🐛 Add settings for quick insert

https://git.mczhengyi.top/zhengyi/halo-plugin-vditor/issues/36 #11
justice2001 · Jan 2, 2024 · 89be498 · 89be498
1 parent 921234a
commit 89be498
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 10 deletions.
diff --git a/console/src/type/editor.d.ts b/console/src/type/editor.d.ts
@@ -4,6 +4,8 @@ export declare type EditorConfig = {
     defaultRenderMode: "ir" | "wysiwyg" | "sv" | undefined;
     typeWriterMode: boolean;
     codeBlockPreview: boolean;
+    enableQuickInsert: boolean;
+    quickInsertUrl: [];
   };
 };
 

diff --git a/console/src/utils/fetch-utils.ts b/console/src/utils/fetch-utils.ts
@@ -1,14 +1,18 @@
-import type {QuickInsert} from "@/type/editor";
+import type { QuickInsert } from "@/type/editor";
 
-export const fetchAllQuickInsert = async (): Promise<QuickInsert[]> => {
+export const fetchAllQuickInsert = async (
+  quickInsertUrls: { url: string }[]
+): Promise<QuickInsert[]> => {
   const quickInsertList: QuickInsert[] = [];
   // Get Default Path
-  try {
-    const response = await fetch("/plugins/vditor-mde/assets/static/test.json");
-    const quickInsertJson: QuickInsert = await response.json();
-    quickInsertList.push(quickInsertJson);
-  } catch (e) {
-    // ignore this
+  for (const qi of quickInsertUrls) {
+    try {
+      const response = await fetch(qi.url);
+      const quickInsertJson: QuickInsert = await response.json();
+      quickInsertList.push(quickInsertJson);
+    } catch (e) {
+      // ignore this
+    }
   }
   return quickInsertList;
 };
diff --git a/console/src/views/Vditor.vue b/console/src/views/Vditor.vue
@@ -84,6 +84,8 @@ onMounted(async () => {
   let mode: "ir" | "wysiwyg" | "sv" | undefined = "ir";
   let typeWriterMode = false;
   let codeBlockPreview = true;
+  let enableQuickInsert = false;
+  let quickInsertUrls = [];
 
   // 实验性功能: 获取当前语言
   const lang = localStorage.getItem("locale") || "zh-CN";
@@ -96,11 +98,13 @@ onMounted(async () => {
     mode = editorConfig.basic.defaultRenderMode;
     typeWriterMode = editorConfig.basic.typeWriterMode;
     codeBlockPreview = editorConfig.basic.codeBlockPreview;
+    enableQuickInsert = editorConfig.basic.enableQuickInsert;
+    quickInsertUrls = editorConfig.basic.quickInsertUrl;
   } catch (e) {
     // ignore this
   }
 
-  const qil = await fetchAllQuickInsert();
+  const qil = await fetchAllQuickInsert(quickInsertUrls);
   vditor.value = new Vditor(
     vditorRef.value,
     getOptions({
@@ -137,7 +141,7 @@ onMounted(async () => {
         customInsertSchema.value = schema;
         customInsertOpen.value = true;
       },
-      enableQuickInsert: true,
+      enableQuickInsert: enableQuickInsert,
       quickInsertList: qil,
     })
   );

diff --git a/src/main/resources/extensions/settings.yaml b/src/main/resources/extensions/settings.yaml
@@ -29,6 +29,23 @@ spec:
                 label: 编辑器代码块渲染
                 help: 关闭后代码块（包括图表）在所见即所得和即时渲染模式下将不会被渲染
                 value: true
+              - $formkit: checkbox
+                id: enableQuickInsert
+                name: enableQuickInsert
+                label: 启用快速插入功能
+                help: 开启此选项后，将会加入插件或主题提供的快速插入按钮
+                value: false
+              - $formkit: repeater
+                if: "$enableQuickInsert"
+                name: quickInsertUrl
+                label: 快速插入链接
+                help: 在下面的选项框中填入主题或插件给出的配置地址，即可使用
+                value: [ ]
+                children:
+                  - $formkit: text
+                    name: url
+                    label: URL
+                    value: ""
         - group: render
           label: 渲染
           formSchema: