feat: 文本编辑器新增右侧缩略图开关 (#5781)

This commit is contained in:
2024-07-12 10:19:25 +08:00 committed by GitHub
parent d2740308a1
commit 03b04eea6b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 29 additions and 0 deletions

View File

@ -1262,6 +1262,7 @@ const message = {
noEdit: 'The file has not been modified, no need to do this!',
noNameFolder: 'Untitled Folder',
noNameFile: 'Untitled File',
minimap: 'Code Mini Map',
},
ssh: {
autoStart: 'Auto Start',

View File

@ -1199,6 +1199,7 @@ const message = {
noEdit: '檔案未修改無需此操作',
noNameFolder: '未命名資料夾',
noNameFile: '未命名檔案',
minimap: '縮略圖',
},
ssh: {
autoStart: '開機自啟',

View File

@ -1201,6 +1201,7 @@ const message = {
noEdit: '文件未修改,无需此操作',
noNameFolder: '未命名文件夹',
noNameFile: '未命名文件',
minimap: '缩略图',
},
ssh: {
autoStart: '开机自启',

View File

@ -447,6 +447,10 @@ html {
background-color: #e5eefd;
}
.monaco-editor-tree-light .el-tree-node.is-current > .el-tree-node__content {
background-color: #e5eefd;
}
.monaco-editor-tree-dark .el-tree-node__content:hover {
background-color: #111417;
}

View File

@ -57,6 +57,12 @@
<el-option :label="$t('commons.button.disable')" value="off"></el-option>
</el-select>
</el-form-item>
<el-form-item :label="$t('file.minimap')">
<el-select v-model="config.minimap" @change="changeMinimap()" class="p-w-100">
<el-option :label="$t('commons.button.enable')" :value="true"></el-option>
<el-option :label="$t('commons.button.disable')" :value="false"></el-option>
</el-select>
</el-form-item>
</el-form>
</div>
<div v-loading="loading">
@ -209,6 +215,7 @@ interface EditorConfig {
language: string;
eol: number;
wordWrap: WordWrapOptions;
minimap: boolean;
}
interface TreeNode {
@ -227,6 +234,7 @@ const loading = ref(false);
const fileName = ref('');
const codeThemeKey = 'code-theme';
const warpKey = 'code-warp';
const minimapKey = 'code-minimap';
const directoryPath = ref('');
const fileExtension = ref('');
const baseDir = ref();
@ -261,6 +269,7 @@ const config = reactive<EditorConfig>({
language: 'plaintext',
eol: monaco.editor.EndOfLineSequence.LF,
wordWrap: 'on',
minimap: false,
});
const eols = [
@ -403,6 +412,15 @@ const changeWarp = () => {
});
};
const changeMinimap = () => {
localStorage.setItem(minimapKey, JSON.stringify(config.minimap));
editor.updateOptions({
minimap: {
enabled: config.minimap,
},
});
};
const initEditor = () => {
if (editor) {
editor.dispose();
@ -418,6 +436,9 @@ const initEditor = () => {
roundedSelection: false,
overviewRulerBorder: false,
wordWrap: config.wordWrap,
minimap: {
enabled: config.minimap,
},
});
if (editor.getModel().getValue() === '') {
let defaultContent = '\n\n\n\n';
@ -470,6 +491,7 @@ const acceptParams = (props: EditProps) => {
config.eol = monaco.editor.EndOfLineSequence.LF;
config.theme = localStorage.getItem(codeThemeKey) || 'vs-dark';
config.wordWrap = (localStorage.getItem(warpKey) as WordWrapOptions) || 'on';
config.minimap = localStorage.getItem(minimapKey) !== null ? localStorage.getItem(minimapKey) === 'true' : true;
open.value = true;
};