chore: 编辑器优化指令功能完善

src/components/custom-editor/custom-editor.vue

@@ -2,7 +2,6 @@
 import { computed, nextTick, onMounted, ref, shallowRef, useTemplateRef, watch } from 'vue'
 import { createEditorConfig } from './config/editor-config'
 import EditorToolbar from './editor-toolbar.vue'
-import { markdownTransformHtml } from '@/utils/markdown-parse'
 import { downloadFile } from '@/utils/download-file'
 import { useI18n } from 'vue-i18n'
 import { fetchExportFile } from '@/apis/file'
@@ -36,19 +35,13 @@ const { t } = useI18n()
 const editorWrapperRef = useTemplateRef('editorWrapperRef')
 const { height: editorWrapperRefHeight } = useElementSize(editorWrapperRef)
 
-let controller: AbortController | null = null
-
 const editorConfig = createEditorConfig()
 
 const editor = shallowRef<Editor | null>(null)
 const isShowEditor = ref(false)
 
 const articleContentModifyContainerShow = ref(false)
-const articleContentModifyState = ref<'selection' | 'loading' | 'generating' | 'done'>('selection')
-const articleContentModifyResponseText = ref('')
-const articleContentModifyResponseTextResource = ref('')
 
-// const contentOptimizationEditContainerTop = ref(300)
 const contentOptimizationEditContainerIsSetBottom = ref(false)
 const contentOptimizationEditContainerLocation = ref(0)
 
@@ -61,15 +54,6 @@ const editorContent = computed({
   },
 })
 
-// const editorTitleText = ref('')
-
-watch(articleContentModifyResponseTextResource, (newVal) => {
-  if (newVal && editor.value)
-    articleContentModifyResponseText.value = markdownTransformHtml(
-      editor.value.dom ? editor.value.dom.decode(newVal) : newVal,
-    ) as string
-})
-
 watch(
   () => props.content,
   (val: string, prevVal: string) => {
@@ -121,15 +105,7 @@ onMounted(() => {
         if (e.button !== 0) return
 
         if (articleContentModifyContainerShow.value) {
-          if (controller) {
-            controller.abort()
-            controller = null
-          }
-
           articleContentModifyContainerShow.value = false
-          articleContentModifyResponseText.value = ''
-          articleContentModifyResponseTextResource.value = ''
-          articleContentModifyState.value = 'selection'
         }
 
         editorInstance.selection.collapse()
@@ -146,8 +122,6 @@ onMounted(() => {
           const rects = rng.getClientRects()
           const lastRect = rects[rects.length - 1]
 
-          // const locationEl = rng.endContainer.parentElement
-
           if (lastRect) {
             /* 其中 46 是当前编辑器文档HTMl距离 外部挂载容器之间产生的高度 */
             const locationHeight = lastRect.bottom + 46 + 10
@@ -166,8 +140,12 @@ onMounted(() => {
         }
       })
 
-      editorInstance.on('keydown', () => {
-        // if (articleContentModifyContainerShow.value) articleContentModifyContainerShow.value = false
+      editorInstance.on('keyup', () => {
+        const selectionContent = editorInstance.selection.getContent()
+
+        if (!selectionContent && articleContentModifyContainerShow.value) {
+          articleContentModifyContainerShow.value = false
+        }
       })
     },
   })

src/components/custom-editor/utils/fetch-event-stream-source.ts

@@ -4,13 +4,14 @@ import { useUserStore } from '@/store/modules/user'
 import { languageKeyTransform } from '@/utils/language-key-transform'
 import { fetchEventSource } from '@microsoft/fetch-event-source'
 
-interface ResponseData {
+export interface ResponseData {
   message: string
   reasoningContent: string
   function: { name: string }
 }
 
 interface Options {
+  onopen?: (response?: Response) => Promise<void>
   onResponse?: (data: ResponseData) => void
   onend?: () => void
   onclose?: () => void
@@ -21,6 +22,7 @@ export default function fetchEventStreamSource(
   url: string,
   payload: object = {},
   options: Options = {
+    onopen: async (_response) => {},
     onResponse: (_data: ResponseData) => {},
     onend: () => {},
     onclose: () => {},
@@ -43,6 +45,9 @@ export default function fetchEventStreamSource(
     body: JSON.stringify(payload),
     signal: controller?.signal,
 
+    onopen: async (response) => {
+      return options.onopen && options.onopen(response)
+    },
     onmessage: (e: { data: string }) => {
       if (e.data === '[DONE]') {
         options.onend && options.onend()

src/components/editor-drawer/editor-drawer.vue

@@ -3,22 +3,17 @@ import CustomEditor from '@/components/custom-editor/custom-editor.vue'
 
 const contentEdit = defineModel<string>('contentEdit', { required: true })
 
-const isShowEditorDrawerDraft = true
-const contentEditDraft = `<h1>标题</h1><h1>标题</h1><h1>标题</h1><h1>标题</h1><h1>标题</h1><h4>济南的冬天，是一幅独特的画卷。它不同于北方的严寒，也不同于南方的温润。这里的冬天，有着独特的魅力和风情。济南的冬日，天空湛蓝，阳光明媚，尽管寒风凛冽，但总能带给人一份宁静和温馨。济南的泉水在冬天依然潺潺流淌，为这座城市增添了一份生机和活力。济南的冬日，不仅是季节的更迭，更是一种生活的体验，一种对大自然的敬畏和感慨。</h4><h1>标题</h1><h1>标题</h1><h1>标题</h1><h1>标题</h1><h1>标题</h1><h1>标题</h1><h1>标题</h1><h1>标题</h1><h1>标题</h1><h1>标题</h1><h1>标题</h1><h1>标题</h1><h4>济南的冬天，是一幅独特的画卷。它不同于北方的严寒，也不同于南方的温润。这里的冬天，有着独特的魅力和风情。济南的冬日，天空湛蓝，阳光明媚，尽管寒风凛冽，但总能带给人一份宁静和温馨。济南的泉水在冬天依然潺潺流淌，为这座城市增添了一份生机和活力。济南的冬日，不仅是季节的更迭，更是一种生活的体验，一种对大自然的敬畏和感慨。</h4><h1>标题</h1><h1>标题</h1>`
-
 const isShowEditorDrawer = defineModel<boolean>('isShowEditorDrawer', { required: true })
 
-console.log(isShowEditorDrawer)
-
 function onDrawerAfterLeave() {
   contentEdit.value = ''
 }
 </script>
 
 <template>
-  <n-drawer v-model:show="isShowEditorDrawerDraft" :width="800" placement="right" :on-after-leave="onDrawerAfterLeave">
+  <n-drawer v-model:show="isShowEditorDrawer" :width="800" placement="right" :on-after-leave="onDrawerAfterLeave">
     <n-drawer-content>
-      <CustomEditor :content="contentEditDraft" />
+      <CustomEditor :content="contentEdit" />
     </n-drawer-content>
   </n-drawer>
 </template>

src/config/base-url.ts

 export const BASE_URLS: Record<'DEV' | 'PROD', string> = {
-  // DEV: 'https://poc-sit.gsstcloud.com',
-  DEV: 'http://localhost:8848',
+  DEV: 'https://poc-sit.gsstcloud.com',
+  // DEV: 'http://localhost:8848',
   PROD: 'https://model-link.gsstcloud.com',
 }
 

src/locales/langs/en.yaml

@@ -799,3 +799,16 @@ editor_module:
   center_align: 'Center align'
   justify_right: 'Justify right'
   align_both_ends: 'Align both ends'
+
+  optimize_input_placeholder: 'Please enter the instructions for optimizing the text'
+  retouching: 'Retouching'
+  expansion: 'Expansion'
+  abbreviation: 'Abbreviation'
+  adjust_the_tone: 'Adjust the tone'
+
+  colloquial: 'Colloquial'
+  academicization: 'Academicization'
+  humorous_and_vivid: 'Humorous and vivid'
+  serious_and_formal: 'Serious and formal'
+  concise_and_clear: 'Concise and clear'
+  elegant_literary_style: 'Elegant literary style'

src/locales/langs/zh-cn.yaml

@@ -798,3 +798,16 @@ editor_module:
   center_align: '居中对齐'
   justify_right: '右对齐'
   align_both_ends: '两端对齐'
+
+  optimize_input_placeholder: '请输入优化文本的指令'
+  retouching: '润色'
+  expansion: '扩写'
+  abbreviation: '缩写'
+  adjust_the_tone: '调整语气'
+
+  colloquial: '口语化'
+  academicization: '学术化'
+  humorous_and_vivid: '幽默生动'
+  serious_and_formal: '严肃正式'
+  concise_and_clear: '简洁明了'
+  elegant_literary_style: '文采优美'

src/locales/langs/zh-hk.yaml

@@ -797,3 +797,16 @@ editor_module:
   center_align: '居中對齊'
   justify_right: '右對齊'
   align_both_ends: '兩端對齊'
+
+  optimize_input_placeholder: '請輸入優化文本的指令'
+  retouching: '潤色'
+  expansion: '擴寫'
+  abbreviation: '縮寫'
+  adjust_the_tone: '調整語氣'
+
+  colloquial: '口語化'
+  academicization: '學術化'
+  humorous_and_vivid: '幽默生動'
+  serious_and_formal: '嚴肅正式'
+  concise_and_clear: '簡潔明了'
+  elegant_literary_style: '文采優美'

types/locales.d.ts

@@ -820,6 +820,19 @@ declare namespace I18n {
       center_align: string
       justify_right: string
       align_both_ends: string
+
+      optimize_input_placeholder: string
+      retouching: string
+      expansion: string
+      abbreviation: string
+      adjust_the_tone: string
+
+      colloquial: string
+      academicization: string
+      humorous_and_vivid: string
+      serious_and_formal: string
+      concise_and_clear: string
+      elegant_literary_style: string
     }
   }
 }

vite.config.ts

@@ -27,15 +27,15 @@ export default defineConfig(({ command, mode }) => {
     server: {
       host: true,
       port: envConf.VITE_PORT,
-      proxy: {
-        '/api/rest': {
-          target: 'http://192.168.13.93:5000',
-          changeOrigin: true,
-          rewrite: (path) => {
-            return path
-          },
-        },
-      },
+      // proxy: {
+      //   '/api/rest': {
+      //     target: 'http://192.168.13.93:5000',
+      //     changeOrigin: true,
+      //     rewrite: (path) => {
+      //       return path
+      //     },
+      //   },
+      // },
     },
     css: {
       preprocessorOptions: {