From e856af135c3fad3dab6661021667e7dff0469336 Mon Sep 17 00:00:00 2001
From: tone <3341154833@qq.com>
Date: Sun, 6 Oct 2024 00:38:19 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=20Ace=E7=BC=96=E8=BE=91?=
 =?UTF-8?q?=E5=99=A8=E5=AF=B9=E8=AF=AD=E8=A8=80=E7=9A=84=E6=94=AF=E6=8C=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 tonecn/src/components/Console/FileOnline.vue | 35 +++++++++++++++-----
 1 file changed, 27 insertions(+), 8 deletions(-)

diff --git a/tonecn/src/components/Console/FileOnline.vue b/tonecn/src/components/Console/FileOnline.vue
index 864d0a2..dbda481 100644
--- a/tonecn/src/components/Console/FileOnline.vue
+++ b/tonecn/src/components/Console/FileOnline.vue
@@ -3,7 +3,28 @@ import { request } from '@/lib/request';
 import { Refresh, Back, House, UploadFilled, Close } from '@element-plus/icons-vue';
 import OSS, { type ObjectMeta, type PutObjectOptions } from 'ali-oss'
 import { ElMessage, ElMessageBox, ElSubMenu, type UploadFile, type UploadFiles } from 'element-plus';
-import { ref, onMounted, reactive, unref } from 'vue';
+import { ref, onMounted, reactive } from 'vue';
+// ace Editor
+import ace from 'ace-builds';
+import { VAceEditor } from 'vue3-ace-editor';
+import 'ace-builds/src-noconflict/mode-plain_text'
+import 'ace-builds/src-noconflict/mode-json'; // Load the language definition file used below
+import 'ace-builds/src-noconflict/mode-markdown'
+import 'ace-builds/src-noconflict/mode-javascript'
+import 'ace-builds/src-noconflict/mode-typescript'
+import 'ace-builds/src-noconflict/mode-html'
+import 'ace-builds/src-noconflict/mode-css'
+import 'ace-builds/src-noconflict/mode-vue'
+import 'ace-builds/src-noconflict/theme-chrome';
+import modeJsonUrl from 'ace-builds/src-noconflict/mode-json?url';
+ace.config.setModuleUrl('ace/mode/json', modeJsonUrl);
+import themeChromeUrl from 'ace-builds/src-noconflict/theme-chrome?url';
+ace.config.setModuleUrl('ace/theme/chrome', themeChromeUrl);
+import extSearchboxUrl from 'ace-builds/src-noconflict/ext-searchbox?url';
+ace.config.setModuleUrl('ace/ext/searchbox', extSearchboxUrl);// searchBox
+import workerJsonUrl from 'ace-builds/src-noconflict/worker-json?url'; // For vite
+ace.config.setModuleUrl('ace/mode/json_worker', workerJsonUrl);
+
 let OSSClient: OSS;
 onMounted(async () => {
     // 请求sts token，初始化OSSClient
@@ -229,13 +250,14 @@ const fileListHandleRename = async (row: any) => {
 }
 // 文件列表操作：编辑某个文件
 const editableFileTypes = new Map([
-    ['.txt', 'textplain'],
+    ['.txt', 'text'],
     ['.md', 'markdown'],
     ['.json', 'json'],
-    ['.html', 'html'],
-    ['.htm', 'html'],
-    ['.css', 'css'],
     ['.js', 'javascript'],
+    ['.ts', 'typescript'],
+    ['.vue', 'vue'],
+    ['.html', 'html'],
+    ['.css', 'css'],
 ]);
 const fileListHandleEdit = async (row: ObjectMeta) => {
     aceEditorConfig.lang = '';
@@ -268,9 +290,6 @@ const fileListHandleEdit = async (row: ObjectMeta) => {
 const dialogUploadFileShow = ref(false);
 const isUploading = ref(false);
 
-import { VAceEditor } from 'vue3-ace-editor';
-import 'ace-builds/src-noconflict/mode-json'; // Load the language definition file used below
-import 'ace-builds/src-noconflict/theme-chrome'; // Load the theme definition file used below
 const aceEditorContent = reactive({
     text: '',
     textBak: '',