feat: Markdown优化，禁止cdn加载(#585)

ui/src/components/ai-chat/ExecutionDetailDialog.vue

@@ -185,7 +185,6 @@ import { cloneDeep } from 'lodash'
 import { arraySort } from '@/utils/utils'
 import { iconComponent } from '@/workflow/icons/utils'
 import { WorkflowType } from '@/enums/workflow'
-import { MdPreview } from 'md-editor-v3'
 
 const dialogVisible = ref(false)
 const detail = ref<any[]>([])

ui/src/components/ai-chat/ParagraphSourceDialog.vue

@@ -71,7 +71,6 @@
 import { ref, watch, onBeforeUnmount } from 'vue'
 import { cloneDeep } from 'lodash'
 import { arraySort } from '@/utils/utils'
-import { MdPreview } from 'md-editor-v3'
 const emit = defineEmits(['refresh'])
 
 const ParagraphDialogRef = ref()

ui/src/components/ai-chat/index.vue

@@ -154,9 +154,8 @@ import logApi from '@/api/log'
 import { ChatManagement, type chatType } from '@/api/type/application'
 import { randomId } from '@/utils/utils'
 import useStore from '@/stores'
-import MdRenderer from '@/components/markdown-renderer/MdRenderer.vue'
+import MdRenderer from '@/components/markdown/MdRenderer.vue'
 import { isWorkFlow } from '@/utils/application'
-import { MdPreview } from 'md-editor-v3'
 import { debounce } from 'lodash'
 defineOptions({ name: 'AiChat' })
 const route = useRoute()

ui/src/components/index.ts

@@ -17,6 +17,8 @@ import CardCheckbox from './card-checkbox/index.vue'
 import AiChat from './ai-chat/index.vue'
 import InfiniteScroll from './infinite-scroll/index.vue'
 import AutoTooltip from './auto-tooltip/index.vue'
+import MdEditor from './markdown/MdEditor.vue'
+import MdPreview from './markdown/MdPreview.vue'
 
 export default {
   install(app: App) {
@@ -38,5 +40,7 @@ export default {
     app.component(AiChat.name, AiChat)
     app.component(InfiniteScroll.name, InfiniteScroll)
     app.component(AutoTooltip.name, AutoTooltip)
+    app.component(MdPreview.name, MdPreview)
+    app.component(MdEditor.name, MdEditor)
   }
 }

ui/src/components/markdown-editor/index.vue

@@ -1,21 +0,0 @@
-<template>
-  <MdEditor noIconfont noPrettier v-bind="$attrs">
-    <template #defFooters>
-      <slot name="defFooters"> </slot>
-    </template>
-  </MdEditor>
-</template>
-
-<script setup lang="ts">
-import { MdEditor } from 'md-editor-v3'
-
-// // <3.0
-// import prettier from 'prettier'
-// import parserMarkdown from 'prettier/parser-markdown'
-// // >=3.0
-// import * as prettier from 'prettier'
-// import parserMarkdown from 'prettier/plugins/markdown'
-
-// https://at.alicdn.com/t/c/font_2605852_u82y61ve02.js
-import './assets/iconfont.js'
-</script>

ui/src/components/markdown/MdEditor.vue

@@ -0,0 +1,14 @@
+<template>
+  <MdEditor noIconfont noPrettier v-bind="$attrs">
+    <template #defFooters>
+      <slot name="defFooters"> </slot>
+    </template>
+  </MdEditor>
+</template>
+
+<script setup lang="ts">
+import { MdEditor } from 'md-editor-v3'
+
+import './assets/markdown-iconfont.js'
+defineOptions({ name: 'MdEditor' })
+</script>

ui/src/components/markdown/MdPreview.vue

@@ -0,0 +1,8 @@
+<template>
+  <MdPreview noIconfont noPrettier v-bind="$attrs" />
+</template>
+
+<script setup lang="ts">
+import { MdPreview } from 'md-editor-v3'
+defineOptions({ name: 'MdPreview' })
+</script>

ui/src/components/markdown/MdRenderer.vue

@@ -11,7 +11,7 @@
 </template>
 <script setup lang="ts">
 import { computed, ref } from 'vue'
-import { MdPreview, config } from 'md-editor-v3'
+import { config } from 'md-editor-v3'
 config({
   markdownItConfig(md) {
     md.renderer.rules.link_open = (tokens, idx, options, env, self) => {

ui/src/views/application/ApplicationSetting.vue

@@ -309,7 +309,6 @@ import ParamSettingDialog from './component/ParamSettingDialog.vue'
 import AddDatasetDialog from './component/AddDatasetDialog.vue'
 import CreateModelDialog from '@/views/template/component/CreateModelDialog.vue'
 import SelectProviderDialog from '@/views/template/component/SelectProviderDialog.vue'
-import { MdEditor } from 'md-editor-v3'
 import applicationApi from '@/api/application'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { ApplicationFormType } from '@/api/type/application'

ui/src/views/application/CreateAndSetting.vue

@@ -321,7 +321,6 @@ import ParamSettingDialog from './component/ParamSettingDialog.vue'
 import AddDatasetDialog from './component/AddDatasetDialog.vue'
 import CreateModelDialog from '@/views/template/component/CreateModelDialog.vue'
 import SelectProviderDialog from '@/views/template/component/SelectProviderDialog.vue'
-import { MdEditor } from 'md-editor-v3'
 import applicationApi from '@/api/application'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { ApplicationFormType } from '@/api/type/application'

ui/src/views/paragraph/component/ParagraphForm.vue

@@ -19,7 +19,7 @@
       <span class="lighter" v-else>{{ form.title || '-' }}</span>
     </el-form-item>
     <el-form-item label="分段内容" prop="content">
-      <MarkdownEditor
+      <MdEditor
         v-if="isEdit"
         v-model="form.content"
         placeholder="请输入分段内容"
@@ -33,14 +33,13 @@
         <template #defFooters>
           <span style="margin-left: -6px">/ 4096</span>
         </template>
-      </MarkdownEditor>
+      </MdEditor>
       <MdPreview
         v-else
         ref="editorRef"
         editorId="preview-only"
         :modelValue="form.content"
         class="maxkb-md"
-        noIconfont
       />
     </el-form-item>
   </el-form>
@@ -48,8 +47,6 @@
 <script setup lang="ts">
 import { ref, reactive, onUnmounted, watch } from 'vue'
 import type { FormInstance, FormRules } from 'element-plus'
-import { MdPreview } from 'md-editor-v3'
-import MarkdownEditor from '@/components/markdown-editor/index.vue'
 import imageApi from '@/api/image'
 const props = defineProps({
   data: {

ui/src/workflow/nodes/base-node/index.vue

@@ -56,7 +56,6 @@ import { set } from 'lodash'
 import NodeContainer from '@/workflow/common/NodeContainer.vue'
 import type { FormInstance } from 'element-plus'
 import { ref, computed, onMounted } from 'vue'
-import { MdEditor } from 'md-editor-v3'
 const props = defineProps<{ nodeModel: any }>()
 
 const form = {

ui/src/workflow/nodes/reply-node/index.vue

@@ -63,8 +63,6 @@
 import { set } from 'lodash'
 import NodeContainer from '@/workflow/common/NodeContainer.vue'
 import NodeCascader from '@/workflow/common/NodeCascader.vue'
-import { MdEditor } from 'md-editor-v3'
-import type { FormInstance } from 'element-plus'
 import { ref, computed, onMounted } from 'vue'
 
 const props = defineProps<{ nodeModel: any }>()