Browse Source

text unfocus

bianjiang 1 year ago
parent
commit
79feadc710

+ 2 - 5
src/modules/editor/components/CompUI/basicUI/Text/TextToolComp.tsx

@@ -12,24 +12,21 @@ import {
   IconTextUnderline,
 } from "@/assets/icons";
 import { css } from "@linaria/core";
-import { Button, InputNumber, Tooltip, Checkbox } from "ant-design-vue";
+import { Button, Checkbox, InputNumber, Tooltip } from "ant-design-vue";
 
 import { useEditor } from "@/modules/editor";
 import Select from "@queenjs-modules/queditor/components/FormUI/Items/Select";
-// import "@simonwep/pickr/dist/themes/nano.min.css";
-import _ from "lodash";
+
 import { queenApi } from "queenjs";
 import {
   defineComponent,
   onMounted,
   onUnmounted,
   reactive,
-  ref,
   toRaw,
   watch,
 } from "vue";
 import { any, bool, func, number, object, string } from "vue-types";
-import Slider from "../../formItems/Slider";
 import NewColorPicker from "../../formItems/NewColorPicker";
 interface ColumnItem {
   label?: string;

+ 1 - 1
src/modules/editor/components/CompUI/basicUI/Text/TextToolForm.tsx

@@ -27,7 +27,7 @@ export const TextToolForm = defineComponent({
     const changeVal = (e: { dataIndex: string; value: any }) => {
       let editor = controls.textEditorCtrl.state.currEditor;
       if (!editor) {
-        controls.textEditorCtrl.setCompValueInReg(e.dataIndex, e.value);
+        // controls.textEditorCtrl.setCompValueInReg(e.dataIndex, e.value);
         return;
       }
       editor = toRaw(editor);

+ 1 - 1
src/modules/editor/components/CompUI/basicUI/Text/ckeditor-plugin/TextStrokeEditing.ts

@@ -45,7 +45,7 @@ export default class TextStrokeEditing extends Plugin {
         return writer.createAttributeElement(
           "span",
           { style: "-webkit-text-stroke:" + attributeValue },
-          { priority: 8 }
+          { priority: 7 }
         );
       },
     });

+ 2 - 1
src/modules/editor/components/CompUI/basicUI/Text/component2.tsx

@@ -120,7 +120,8 @@ const EditorComp = defineComponent({
           curr.id == "text_toolform" ||
           curr.id == "toolbar" ||
           curr.classList.contains("editor_text_color") ||
-          curr.classList.contains("ant-modal-input")
+          curr.classList.contains("ant-modal-input") ||
+          curr.classList.contains("ant-select-dropdown")
         ) {
           out.in = true;
           out.stop = false;

+ 1 - 1
src/modules/editor/components/Viewport/Slider/SliderLeft/Text.tsx

@@ -63,7 +63,7 @@ export default defineUI({
                 class={"btn_item text-12px"}
                 onClick={() => {
                   const text =
-                    '<p style="text-align:center;line-height:1.5;">请输入正文</p>';
+                    '<p style="text-align:center;line-height:1.5;"><span style="font-size:12px;">请输入正文</span></p>';
                   editor.actions.clickCompToDesign(
                     "Text",
                     (comp: DesignComp) => {

+ 39 - 0
src/modules/editor/controllers/TextEditorCtrl/index.ts

@@ -33,6 +33,11 @@ export class TextEditorCtrl extends ModuleControl<EditorModule> {
   }
   setCompValueInReg(key: string, e: any) {
     console.log(key, e);
+    const addTagsKey = ["bold", "italic", "underline", "strikethrough"];
+    if (addTagsKey.includes(key)) {
+      this.addCompValueTags(key, e);
+      return;
+    }
     const compValue = this.store.currComp.value;
     const regString = `(${stylesKey[key]}:)([0-9a-zA-z#.])*(\\;)`;
     const styleReg = new RegExp(regString, "ig");
@@ -41,6 +46,40 @@ export class TextEditorCtrl extends ModuleControl<EditorModule> {
       const changeValue = compValue.replace(styleReg, `$1${e.value}$3`);
       console.log(changeValue);
       this.actions.updateCompData(this.store.currComp, "value", changeValue);
+    } else {
+      console.log(1);
+    }
+  }
+  addCompValueTags(key: string, e: any) {
+    console.log(key, e);
+    // const
+    // ("i s strong u");
+    const keyToTags = {
+      italic: {
+        tag: "<strong>",
+        end: "</strong>",
+      },
+      strikethrough: {
+        tag: "<strong>",
+        end: "</strong>",
+      },
+
+      bold: {
+        tag: "<strong>",
+        end: "</strong>",
+      },
+      underline: {
+        tag: "<strong>",
+        end: "</strong>",
+      },
+    };
+    const compValue = this.store.currComp.value;
+    console.log(compValue);
+    const blocks = compValue.match(/<p(([\s\S])*?)<\/p>/gi);
+    if (!blocks) {
+      return;
     }
+    blocks.map((item: string, index: number) => {});
+    console.log(blocks);
   }
 }