fix(首页富文本): 写作模式热键开启&模板复制样式丢失

src/views/home/components/rich-text-input-box/formats/template-input-prompt.ts

@@ -9,12 +9,14 @@ class TemplateInputPromptBlot extends Embed {
   static create(config: { placeholder: string; index: string }) {
     const root = super.create() as HTMLElement
 
+    root.dataset.placeholder = `${config.placeholder}`
+    root.dataset.index = `${config.index}`
+
     root.classList.add(`prompt-index-${config.index}`)
 
     // root.classList.add('prompt-blank', 'relative')
 
     const outerEl = document.createElement('span')
-    outerEl.dataset.placeholder = `[${config.placeholder}]`
     // outerEl.classList.add('prompt-blank', 'relative', 'inline-block', 'min-w-fit')
     outerEl.classList.add(
       'relative',
@@ -25,10 +27,7 @@ class TemplateInputPromptBlot extends Embed {
       'mx-[2px]',
       'rounded-[4px]',
     )
-    outerEl.style.backgroundColor = 'rgba(0,87,255,0.06)'
-    // outerEl.style.color = '#b5caff'
-    outerEl.style.color = '#9ea3ff'
-    outerEl.style.lineHeight = '24px'
+    outerEl.style.cssText = 'background-color: rgba(0,87,255,0.06); color: #b5caff; line-height: 24px;'
 
     const placeholderEl = document.createElement('span')
     placeholderEl.textContent = `[${config.placeholder}]`
@@ -51,11 +50,12 @@ class TemplateInputPromptBlot extends Embed {
       'break-all',
       // 'outline-none',
     )
-
-    inputContainerEl.style.left = '0'
-    inputContainerEl.style.right = '0'
-    inputContainerEl.style.color = '#000dff'
-    inputContainerEl.style.outlineStyle = 'none'
+    inputContainerEl.style.cssText = `
+      left: 0;
+      right: 0;
+      color: #000dff;
+      outline-style: none;
+    `
 
     inputContainerEl.textContent = ''
 

src/views/home/components/rich-text-input-box/index.vue

@@ -118,8 +118,27 @@ watchEffect(() => {
     quillInst.value.on('composition-end', () => {
       if (quillInst.value) {
         quillInst.value.root.dataset.placeholder = quillInst.value.options.placeholder
+
+        const text = quillInst.value.getText().trim()
+
+        if (text === '@') {
+          quillInst.value.deleteText(0, text.length + 1)
+          showSceneList.value = true
+          quillInst.value.blur()
+        }
       }
     })
+
+    quillInst.value.clipboard.addMatcher('span.template-input-prompt-container', (node) => {
+      const spanEl = node as HTMLSpanElement
+
+      return new Delta().insert({
+        'template-input-prompt': {
+          placeholder: spanEl.dataset.placeholder,
+          index: spanEl.dataset.index,
+        },
+      })
+    })
   }
 })
 

src/views/home/components/rich-text-input-box/quill-opstions.ts

@@ -23,15 +23,6 @@ export function getQuillOptions(config: ConfigInterface): QuillOptions {
               }
             },
           },
-          process: {
-            key: 'Process',
-            shiftKey: true,
-            handler: function (range: any, context: any) {
-              if (config.keyboardCallback.at) {
-                config.keyboardCallback.at((this as any).quill as Quill, range, context)
-              }
-            },
-          },
           '@': {
             key: '@',
             shiftKey: true,