npm - @maketribe/ms-app - Versions diffs - 3.2.28 → 3.2.30 - Mend

@maketribe/ms-app 3.2.28 → 3.2.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (34) hide show

package/dist/esm/components/basic/doc-editor/plugins/GridPlugin/index.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/GridPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { $insertNodeToNearestRoot,mergeRegister } from '@lexical/utils'\r\nimport { \r\n $getNodeByKey,$createParagraphNode,$isNodeSelection, $getSelection,\r\n ElementNode,COMMAND_PRIORITY_EDITOR\r\n} from 'lexical'\r\nimport { onMounted, onUnmounted,ref } from 'vue'\r\nimport { registerDocEditorToolbarExtend,type ToolbarExtendPlugin } from \"../../core\"\r\nimport { GridNode,$isGridNode } from \"./GridNode\"\r\nimport { type LayoutGridNodeAttrType,LayoutGridNode,INSERT_LAYOUTGRID_COMMAND } from \"./LayoutGridNode\"\r\nimport { type TextGridNodeAttrType,TextGridNode,INSERT_TEXTGRID_COMMAND } from \"./TextGridNode\"\r\nimport { type ImageTextGridNodeAttrType,ImageTextGridNode,INSERT_IMAGETEXTGRID_COMMAND } from \"./ImageTextGridNode\"\r\nimport { type ModuleGridNodeAttrType,ModuleGridNode,INSERT_MODULEGRID_COMMAND,$isModuleGridNode } from \"./ModuleGridNode\"\r\nimport { INSERT_MODULE_COMMAND } from \"../ModulePlugin/commands\"\r\nimport { showModuleSelectDialog } from \"../ModulePlugin/utils\"\r\nimport { ModuleType,useModule } from \"../ModulePlugin/composables\"\r\nimport { ImageAttrType,InlineImageNode } from '../ImagePlugin'\r\nimport { useElementBlockSelection } from '../../core'\r\nimport { createDefaultFormData } from \"../../../dynamic-form-panel/utils\"\r\nimport { showGridEditDialoger } from \"./utils\"\r\n\r\n// 编辑器\r\nconst editor = useLexicalComposer()\r\n\r\n// 注册到工具条\r\nregisterDocEditorToolbarExtend({\r\n icon:\"richtext-outline\",\r\n text:\"图文环绕\",\r\n action:async ()=>{\r\n editor.dispatchCommand(INSERT_IMAGETEXTGRID_COMMAND,{ width:\"100%\" } as ImageTextGridNodeAttrType)\r\n },\r\n sort:80\r\n} as ToolbarExtendPlugin)\r\nregisterDocEditorToolbarExtend({\r\n icon:\"Grid\",\r\n text:\"文本容器\",\r\n action:async ()=>{\r\n editor.dispatchCommand(INSERT_TEXTGRID_COMMAND,{ width:\"100%\" } as TextGridNodeAttrType)\r\n },\r\n sort:81\r\n} as ToolbarExtendPlugin)\r\nregisterDocEditorToolbarExtend({\r\n icon:\"Grid\",\r\n text:\"模块容器\",\r\n action:async ()=>{\r\n editor.dispatchCommand(INSERT_MODULEGRID_COMMAND,{ width:\"100%\" } as ModuleGridNodeAttrType)\r\n },\r\n sort:70\r\n} as ToolbarExtendPlugin)\r\nregisterDocEditorToolbarExtend({\r\n icon:\"Grid\",\r\n text:\"布局容器\",\r\n action:async ()=>{\r\n editor.dispatchCommand(INSERT_LAYOUTGRID_COMMAND,{ display:\"flex\",width:\"100%\" } as LayoutGridNodeAttrType)\r\n },\r\n sort:1\r\n} as ToolbarExtendPlugin)\r\n\r\n// 当前激活的元素\r\nlet curActiveEl:HTMLElement\|null = null;\r\n// 找格子\r\nconst findGridNodeEl = (element:HTMLElement):HTMLElement\|null => {\r\n\r\n var el:HTMLElement\|null = element\r\n\r\n if(GridNode.hasGridNodeByElement(el)){\r\n return el;\r\n }\r\n\r\n while (el != null && !GridNode.hasGridNodeByElement(el)) {\r\n el = el.parentElement;\r\n }\r\n\r\n // 文本环绕的文本框不做激活处理\r\n if(el != null && el.parentElement != null && TextGridNode.hasGridNodeByElement(el) && ImageTextGridNode.hasGridNodeByElement(el.parentElement)){\r\n return el.parentElement;\r\n }\r\n\r\n return el;\r\n}\r\n// 设置激活\r\nconst setActiveGridElement = (el:HTMLElement\|null)=>{\r\n // 激活对应的格子\r\n if(el){\r\n el.classList.add(\"doc-edit-active\")\r\n if(curActiveEl && curActiveEl != el){\r\n curActiveEl.classList.remove(\"doc-edit-active\")\r\n }\r\n curActiveEl = el;\r\n }\r\n else{\r\n curActiveEl && curActiveEl.classList.remove(\"doc-edit-active\")\r\n curActiveEl = null;\r\n }\r\n}\r\n// 使用元素模块集成了模块选中删除以及工具条\r\nconst { isSelected, curSelectKey, curSelectPos,setSelection } = useElementBlockSelection((el)=>{\r\n\r\n\r\n // 设置激活\r\n setActiveGridElement(findGridNodeEl(el));\r\n\r\n // 文本环绕的文本框不做选中处理\r\n if(el != null && el.parentElement != null && TextGridNode.hasGridNodeByElement(el) && ImageTextGridNode.hasGridNodeByElement(el.parentElement)){\r\n return el.parentElement;\r\n }\r\n\r\n\r\n return GridNode.hasGridNodeByElement(el);\r\n},()=>{\r\n \r\n const node = $getNodeByKey(curSelectKey.value)\r\n \r\n if($isGridNode(node)){\r\n\r\n const parent = node.getParent() as ElementNode\r\n\r\n const toolbars = [\r\n {\r\n title:`编辑容器`,icon:\"Edit\",action:async ()=>{\r\n\r\n var result = await showGridEditDialoger(node,parent,node.getAttrs());\r\n \r\n editor.update(() => node.setAttrs(result as any))\r\n } \r\n },\r\n {\r\n title:`在此之前插入布局容器`,icon:\"BottomLeft\",action:async ()=>{\r\n editor.update(() => {\r\n node.insertBefore(new LayoutGridNode({ display:\"block\",width:\"100%\" } as any))\r\n })\r\n } \r\n },\r\n {\r\n title:`在此之后插入布局容器`,icon:\"BottomRight\",action:async ()=>{\r\n editor.update(() => {\r\n node.insertAfter(new LayoutGridNode({ display:\"block\",width:\"100%\" } as any))\r\n })\r\n } \r\n }\r\n ];\r\n\r\n // 有父亲\r\n if($isGridNode(parent)){\r\n toolbars.push(...[\r\n {\r\n title:\"选中上层容器\",icon:\"Upload\",action: async ()=> {\r\n let parentEl = editor.getElementByKey(parent.getKey());\r\n if(parentEl){\r\n setActiveGridElement(parentEl);\r\n setSelection(parent.__key,parentEl)\r\n }\r\n \r\n }\r\n }\r\n ])\r\n }\r\n\r\n // 模块容器\r\n if($isModuleGridNode(node)){\r\n toolbars.push(...[\r\n {\r\n title:\"添加模块\",icon:\"Plus\",action:async ()=>{\r\n // 打开模块面板\r\n const result = (await showModuleSelectDialog()) as ModuleType;\r\n const defaultData = createDefaultFormData(result.options);\r\n // 插入模块\r\n editor.dispatchCommand(INSERT_MODULE_COMMAND,{ name:result.name,data:defaultData})\r\n } \r\n }\r\n ])\r\n }\r\n\r\n return toolbars;\r\n }\r\n\r\n return null;\r\n})\r\n\r\n\r\nonMounted(() => {\r\n\r\n // 插入格子\r\n const insertGridHandle = (layoutGrid:GridNode)=>{\r\n const selection = $getSelection()\r\n const elementNode = $isNodeSelection(selection) ? selection?.getNodes()[0] as ElementNode : null;\r\n if (elementNode) {\r\n elementNode.append(layoutGrid);\r\n }\r\n else{\r\n $insertNodeToNearestRoot(layoutGrid)\r\n }\r\n }\r\n \r\n // 注册指令\r\n const unregister = mergeRegister(\r\n // 插入布局格子\r\n editor.registerCommand<LayoutGridNodeAttrType>(INSERT_LAYOUTGRID_COMMAND,(payload) => { \r\n \r\n insertGridHandle(new LayoutGridNode(payload));\r\n \r\n return true\r\n },COMMAND_PRIORITY_EDITOR),\r\n // 插入文本格子\r\n editor.registerCommand<TextGridNodeAttrType>(INSERT_TEXTGRID_COMMAND,(payload) => { \r\n \r\n const textGrid = new TextGridNode(payload)\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n insertGridHandle(textGrid);\r\n \r\n return true\r\n },COMMAND_PRIORITY_EDITOR),\r\n // 插入模块格子\r\n editor.registerCommand<ModuleGridNodeAttrType>(INSERT_MODULEGRID_COMMAND,(payload) => { \r\n insertGridHandle(new ModuleGridNode(payload));\r\n return true\r\n },COMMAND_PRIORITY_EDITOR),\r\n // 插入图文环绕格子\r\n editor.registerCommand<ImageTextGridNodeAttrType>(INSERT_IMAGETEXTGRID_COMMAND,(payload) => { \r\n \r\n const textImageGrid = new ImageTextGridNode(payload)\r\n const textGrid = new TextGridNode({} as TextGridNodeAttrType)\r\n\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n\r\n textImageGrid.append(new InlineImageNode({\r\n src:\"\",\r\n float:\"left\",\r\n width:\"200px\",\r\n margin:\"0 10px 10px 0\"\r\n } as ImageAttrType))\r\n textImageGrid.append(textGrid)\r\n\r\n\r\n insertGridHandle(textImageGrid);\r\n \r\n return true\r\n },COMMAND_PRIORITY_EDITOR)\r\n );\r\n\r\n onUnmounted(() => unregister())\r\n})\r\n</script>\r\n\r\n<template>\r\n <div class=\"mk-doc-active-element-block-mark box\" v-if=\"isSelected\" :style=\"curSelectPos\">\r\n \r\n </div>\r\n</template>\r\n./GridNode\r\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/GridPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { $insertNodeToNearestRoot,mergeRegister } from '@lexical/utils'\r\nimport { \r\n $getNodeByKey,$createParagraphNode,$isNodeSelection, $getSelection,\r\n ElementNode,COMMAND_PRIORITY_EDITOR\r\n} from 'lexical'\r\nimport { onMounted, onUnmounted,ref } from 'vue'\r\nimport { registerDocEditorToolbarExtend,type ToolbarExtendPlugin } from \"../../core\"\r\nimport { GridNode,$isGridNode } from \"./GridNode\"\r\nimport { type LayoutGridNodeAttrType,LayoutGridNode,INSERT_LAYOUTGRID_COMMAND } from \"./LayoutGridNode\"\r\nimport { type TextGridNodeAttrType,TextGridNode,INSERT_TEXTGRID_COMMAND } from \"./TextGridNode\"\r\nimport { type ImageTextGridNodeAttrType,ImageTextGridNode,INSERT_IMAGETEXTGRID_COMMAND } from \"./ImageTextGridNode\"\r\nimport { type ModuleGridNodeAttrType,ModuleGridNode,INSERT_MODULEGRID_COMMAND,$isModuleGridNode } from \"./ModuleGridNode\"\r\nimport { INSERT_MODULE_COMMAND } from \"../ModulePlugin/commands\"\r\nimport { showModuleSelectDialog } from \"../ModulePlugin/utils\"\r\nimport { ModuleType,useModule } from \"../ModulePlugin/composables\"\r\nimport { ImageAttrType,InlineImageNode } from '../ImagePlugin'\r\nimport { useElementBlockSelection } from '../../core'\r\nimport { createDefaultFormData } from \"../../../dynamic-form-panel/utils\"\r\nimport { showGridEditDialoger } from \"./utils\"\r\n\r\n// 编辑器\r\nconst editor = useLexicalComposer()\r\n\r\n// 注册到工具条\r\nregisterDocEditorToolbarExtend({\r\n icon:\"richtext-outline\",\r\n text:\"图文环绕\",\r\n action:async ()=>{\r\n editor.dispatchCommand(INSERT_IMAGETEXTGRID_COMMAND,{ width:\"100%\" } as ImageTextGridNodeAttrType)\r\n },\r\n sort:80\r\n} as ToolbarExtendPlugin)\r\nregisterDocEditorToolbarExtend({\r\n icon:\"Grid\",\r\n text:\"文本容器\",\r\n action:async ()=>{\r\n editor.dispatchCommand(INSERT_TEXTGRID_COMMAND,{ width:\"100%\" } as TextGridNodeAttrType)\r\n },\r\n sort:81\r\n} as ToolbarExtendPlugin)\r\nregisterDocEditorToolbarExtend({\r\n icon:\"Grid\",\r\n text:\"模块容器\",\r\n action:async ()=>{\r\n editor.dispatchCommand(INSERT_MODULEGRID_COMMAND,{ width:\"100%\" } as ModuleGridNodeAttrType)\r\n },\r\n sort:70\r\n} as ToolbarExtendPlugin)\r\nregisterDocEditorToolbarExtend({\r\n icon:\"Grid\",\r\n text:\"布局容器\",\r\n action:async ()=>{\r\n editor.dispatchCommand(INSERT_LAYOUTGRID_COMMAND,{ display:\"flex\",width:\"100%\" } as LayoutGridNodeAttrType)\r\n },\r\n sort:1\r\n} as ToolbarExtendPlugin)\r\n\r\n// 当前激活的元素\r\nlet curActiveEl:HTMLElement\|null = null;\r\n// 找格子\r\nconst findGridNodeEl = (element:HTMLElement):HTMLElement\|null => {\r\n\r\n var el:HTMLElement\|null = element\r\n\r\n if(GridNode.hasGridNodeByElement(el)){\r\n return el;\r\n }\r\n\r\n while (el != null && !GridNode.hasGridNodeByElement(el)) {\r\n el = el.parentElement;\r\n }\r\n\r\n // 文本环绕的文本框不做激活处理\r\n if(el != null && el.parentElement != null && TextGridNode.hasGridNodeByElement(el) && ImageTextGridNode.hasGridNodeByElement(el.parentElement)){\r\n return el.parentElement;\r\n }\r\n // 选中模块容器\r\n else if(el != null && el.parentElement != null && ModuleGridNode.hasGridNodeByElement(el.parentElement)){\r\n return el.parentElement;\r\n }\r\n\r\n return el;\r\n}\r\n// 设置激活\r\nconst setActiveGridElement = (el:HTMLElement\|null)=>{\r\n // 激活对应的格子\r\n if(el){\r\n el.classList.add(\"doc-edit-active\")\r\n if(curActiveEl && curActiveEl != el){\r\n curActiveEl.classList.remove(\"doc-edit-active\")\r\n }\r\n curActiveEl = el;\r\n }\r\n else{\r\n curActiveEl && curActiveEl.classList.remove(\"doc-edit-active\")\r\n curActiveEl = null;\r\n }\r\n}\r\n// 使用元素模块集成了模块选中删除以及工具条\r\nconst { isSelected, curSelectKey, curSelectPos,setSelection } = useElementBlockSelection((el)=>{\r\n\r\n // 设置激活\r\n setActiveGridElement(findGridNodeEl(el));\r\n\r\n // 文本环绕的文本框不做选中处理\r\n if(el != null && el.parentElement != null && TextGridNode.hasGridNodeByElement(el) && ImageTextGridNode.hasGridNodeByElement(el.parentElement)){\r\n return el.parentElement;\r\n }\r\n\r\n\r\n return GridNode.hasGridNodeByElement(el);\r\n},()=>{\r\n \r\n const node = $getNodeByKey(curSelectKey.value)\r\n \r\n if($isGridNode(node)){\r\n\r\n const parent = node.getParent() as ElementNode\r\n\r\n const toolbars = [\r\n {\r\n title:`编辑容器`,icon:\"Edit\",action:async ()=>{\r\n\r\n var result = await showGridEditDialoger(node,parent,node.getAttrs());\r\n \r\n editor.update(() => node.setAttrs(result as any))\r\n } \r\n },\r\n {\r\n title:`在此之前插入布局容器`,icon:\"BottomLeft\",action:async ()=>{\r\n editor.update(() => {\r\n node.insertBefore(new LayoutGridNode({ display:\"block\",width:\"100%\" } as any))\r\n })\r\n } \r\n },\r\n {\r\n title:`在此之后插入布局容器`,icon:\"BottomRight\",action:async ()=>{\r\n editor.update(() => {\r\n node.insertAfter(new LayoutGridNode({ display:\"block\",width:\"100%\" } as any))\r\n })\r\n } \r\n }\r\n ];\r\n\r\n // 有父亲\r\n if($isGridNode(parent)){\r\n toolbars.push(...[\r\n {\r\n title:\"选中上层容器\",icon:\"Upload\",action: async ()=> {\r\n let parentEl = editor.getElementByKey(parent.getKey());\r\n if(parentEl){\r\n setActiveGridElement(parentEl);\r\n setSelection(parent.__key,parentEl)\r\n }\r\n \r\n }\r\n }\r\n ])\r\n }\r\n\r\n // 模块容器\r\n if($isModuleGridNode(node)){\r\n toolbars.push(...[\r\n {\r\n title:\"添加模块\",icon:\"Plus\",action:async ()=>{\r\n // 打开模块面板\r\n const result = (await showModuleSelectDialog()) as ModuleType;\r\n const defaultData = createDefaultFormData(result.options);\r\n // 插入模块\r\n editor.dispatchCommand(INSERT_MODULE_COMMAND,{ name:result.name,data:defaultData})\r\n } \r\n }\r\n ])\r\n }\r\n\r\n return toolbars;\r\n }\r\n\r\n return null;\r\n})\r\n\r\n\r\nonMounted(() => {\r\n\r\n // 插入格子\r\n const insertGridHandle = (layoutGrid:GridNode)=>{\r\n const selection = $getSelection()\r\n const elementNode = $isNodeSelection(selection) ? selection?.getNodes()[0] as ElementNode : null;\r\n if (elementNode) {\r\n elementNode.append(layoutGrid);\r\n }\r\n else{\r\n $insertNodeToNearestRoot(layoutGrid)\r\n }\r\n }\r\n \r\n // 注册指令\r\n const unregister = mergeRegister(\r\n // 插入布局格子\r\n editor.registerCommand<LayoutGridNodeAttrType>(INSERT_LAYOUTGRID_COMMAND,(payload) => { \r\n \r\n insertGridHandle(new LayoutGridNode(payload));\r\n \r\n return true\r\n },COMMAND_PRIORITY_EDITOR),\r\n // 插入文本格子\r\n editor.registerCommand<TextGridNodeAttrType>(INSERT_TEXTGRID_COMMAND,(payload) => { \r\n \r\n const textGrid = new TextGridNode(payload)\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n insertGridHandle(textGrid);\r\n \r\n return true\r\n },COMMAND_PRIORITY_EDITOR),\r\n // 插入模块格子\r\n editor.registerCommand<ModuleGridNodeAttrType>(INSERT_MODULEGRID_COMMAND,(payload) => { \r\n insertGridHandle(new ModuleGridNode(payload));\r\n return true\r\n },COMMAND_PRIORITY_EDITOR),\r\n // 插入图文环绕格子\r\n editor.registerCommand<ImageTextGridNodeAttrType>(INSERT_IMAGETEXTGRID_COMMAND,(payload) => { \r\n \r\n const textImageGrid = new ImageTextGridNode(payload)\r\n const textGrid = new TextGridNode({} as TextGridNodeAttrType)\r\n\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n textGrid.append($createParagraphNode())\r\n\r\n textImageGrid.append(new InlineImageNode({\r\n src:\"\",\r\n float:\"left\",\r\n width:\"200px\",\r\n margin:\"0 10px 10px 0\"\r\n } as ImageAttrType))\r\n textImageGrid.append(textGrid)\r\n\r\n\r\n insertGridHandle(textImageGrid);\r\n \r\n return true\r\n },COMMAND_PRIORITY_EDITOR)\r\n );\r\n\r\n onUnmounted(() => unregister())\r\n})\r\n</script>\r\n\r\n<template>\r\n <div class=\"mk-doc-active-element-block-mark box\" v-if=\"isSelected\" :style=\"curSelectPos\">\r\n \r\n </div>\r\n</template>\r\n./GridNode\r\n"],"names":[],"mappings":"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"}

package/dist/esm/components/basic/doc-editor/plugins/ModulePlugin/ModuleBlockNode.js CHANGED Viewed

@@ -1,14 +1,14 @@
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-import { TextNode } from "lexical";
+import { DecoratorNode } from "lexical";
 import { useModule } from "./composables.js";
 import { createHtml, createModuleMetaData } from "./utils.js";
 const ClassMarkName = "mk-doc-block__module";
 const AttrMarkName = "module-name";
-class ModuleBlockNode extends TextNode {
+class ModuleBlockNode extends DecoratorNode {
   constructor(name, data, key) {
-    super("", key);
+    super(key);
     __publicField(this, "__name");
     __publicField(this, "__data");
     this.__name = name;
@@ -135,13 +135,21 @@ class ModuleBlockNode extends TextNode {
     dom.innerHTML = el.innerHTML;
     return false;
   }
-  /**
-   * 非内联
-   * @returns
-   */
-  isInline() {
+  decorate(editor, config) {
+    return null;
+  }
+  isEmpty() {
     return false;
   }
+  isIsolated() {
+    return false;
+  }
+  isInline() {
+    return true;
+  }
+  isKeyboardSelectable() {
+    return true;
+  }
 }
 function $createModuleBlockNode(name, data) {
   return new ModuleBlockNode(name, data);

package/dist/esm/components/basic/doc-editor/plugins/ModulePlugin/ModuleBlockNode.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModuleBlockNode.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/ModuleBlockNode.ts"],"sourcesContent":["\r\nimport {\r\n type DOMConversionMap,\r\n type DOMExportOutput,\r\n type LexicalNode,\r\n type NodeKey,\r\n type Spread,\r\n type EditorConfig,\r\n type DOMConversion,\r\n type ~~SerializedTextNode~~,\r\n ~~TextNode~~,\r\n} from 'lexical'\r\nimport { useModule } from \"./composables\"\r\nimport { createHtml,createModuleMetaData } from \"./utils\"\r\n\r\n/*\r\n 模块模版节点序列化\r\n /\r\nexport type SerializedModuleBlockNode = Spread<\r\n {\r\n name:string,\r\n data: object\r\n },\r\n ~~SerializedTextNode~~\r\n>\r\n\r\n// 类标识\r\nconst ClassMarkName = \"mk-doc-block__module\";\r\n// 属性标识\r\nconst AttrMarkName = \"module-name\";\r\n\r\n/\r\n 模块节点\r\n /\r\nexport class ModuleBlockNode extends ~~TextNode~~ {\r\n __name: string\r\n __data: object\r\n\r\n static getType(): string { return \"module\"; }\r\n\r\n /\r\n 克隆\r\n * @param node \r\n * @returns \r\n /\r\n static clone(node: ModuleBlockNode): ModuleBlockNode {\r\n return new ModuleBlockNode(node.__name,node.__data,node.__key)\r\n }\r\n\r\n /\r\n 获取模块类标识\r\n * @returns \r\n /\r\n static getMarkClassName(): string { return ClassMarkName }\r\n\r\n /\r\n 导入\r\n * @param serializedNode \r\n * @returns \r\n /\r\n static importJSON(serializedNode: SerializedModuleBlockNode): ModuleBlockNode {\r\n return $createModuleBlockNode(serializedNode.name,serializedNode.data)\r\n }\r\n\r\n constructor(name: string, data: object, key?: NodeKey) {\r\n super(~~\"\",~~key)\r\n this.__name = name\r\n this.__data = data\r\n }\r\n\r\n /\r\n 获取html内容\r\n /\r\n getHtml(){\r\n const { module } = useModule(this.__name);\r\n return createHtml(module.template,this.__data)\r\n }\r\n\r\n /\r\n 设置内容\r\n * @param html \r\n /\r\n setContent(data:any){\r\n const writable = this.getWritable();\r\n writable.__data = data;\r\n }\r\n\r\n /\r\n 导出JSON\r\n * @returns \r\n /\r\n exportJSON(): SerializedModuleBlockNode {\r\n\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n version: 1,\r\n name:this.__name,\r\n data: this.__data\r\n }\r\n }\r\n\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n div : $covertModuleBlockDOM,\r\n section : $covertModuleBlockDOM \r\n }\r\n }\r\n\r\n /\r\n 获取文本内容\r\n * @param _includeInert \r\n * @param _includeDirectionless \r\n * @returns \r\n /\r\n getTextContent(\r\n _includeInert?: boolean \| undefined,\r\n _includeDirectionless?: false \| undefined,\r\n ): string {\r\n\r\n const element = document.createElement('div')\r\n const { module } = useModule(this.__name);\r\n element.innerHTML = createHtml(module.template,this.__data);\r\n\r\n return element.textContent as string;\r\n }\r\n\r\n /\r\n 创建模块的el\r\n * @returns \r\n /\r\n createModuleElement(): HTMLElement {\r\n\r\n const element = document.createElement('div')\r\n const { module } = useModule(this.__name);\r\n\r\n element.innerHTML = createHtml(module.template,this.__data);\r\n\r\n if(element.children.length > 1){\r\n throw new Error(\"定义模块模版的时候请用一个容器将模版内容包裹起来，不能有多个并列的元素！\");\r\n }\r\n\r\n const contentEl = element.children[0] as HTMLElement;\r\n\r\n if (!contentEl.classList.contains(ClassMarkName)) {\r\n contentEl.classList.add(ClassMarkName);\r\n }\r\n\r\n // 模块名称标识\r\n contentEl.setAttribute(AttrMarkName,this.__name)\r\n \r\n return contentEl;\r\n }\r\n\r\n /\r\n 导出DOM结构\r\n * @returns \r\n /\r\n exportDOM(): DOMExportOutput {\r\n return { element:this.createModuleElement() }\r\n }\r\n\r\n /\r\n 渲染\r\n * @param config \r\n * @returns \r\n /\r\n createDOM(config: EditorConfig): HTMLElement {\r\n const el = this.createModuleElement();\r\n el.setAttribute(\"node-key\",this.__key)\r\n el.setAttribute(\"contenteditable\",\"false\")\r\n el.setAttribute(\"data-lexical-decorator\",\"true\")\r\n return el;\r\n }\r\n\r\n /\r\n 更新DOM\r\n * @param prevNode \r\n * @param dom \r\n * @param config \r\n * @returns \r\n /\r\n updateDOM(prevNode: ModuleBlockNode, dom: HTMLElement, config: EditorConfig): boolean {\r\n const el = this.createModuleElement();\r\n dom.innerHTML = el.innerHTML;\r\n return false\r\n }\r\n \r\n ~~/\~~r\n ~~非内联\~~r\n * ~~@returns~~ \r\n /\r\n isInline(): ~~boolean~~ {\r\n return ~~false~~;\r\n }\r\n}\r\n\r\n/\r\n 创建节点\r\n * @param src \r\n * @returns \r\n /\r\nexport function $createModuleBlockNode(name:string,data: object): ModuleBlockNode {\r\n return new ModuleBlockNode(name,data)\r\n}\r\n\r\n/\r\n 判断节点\r\n * @param node \r\n * @returns \r\n /\r\nexport function $isModuleBlockNode(\r\n node: ModuleBlockNode \| LexicalNode \| null \| undefined,\r\n): node is ModuleBlockNode {\r\n return node instanceof ModuleBlockNode\r\n}\r\n\r\n\r\n/\r\n 转换模块DOM\r\n * @param node \r\n * @returns \r\n */\r\nexport const $covertModuleBlockDOM = (domNode: HTMLElement):DOMConversion<HTMLElement> \| null => {\r\n\r\n const name = domNode.getAttribute(AttrMarkName) as string;\r\n const isModule = domNode.classList.contains(ClassMarkName);\r\n const moduleContent = domNode.innerHTML ;\r\n\r\n if(isModule && name){ domNode.innerHTML = \"\"; }\r\n\r\n return isModule && name ? {\r\n conversion: ()=>{ \r\n const { module } = useModule(name);\r\n const { data } = createModuleMetaData(moduleContent,module.options);\r\n return { \r\n node:$createModuleBlockNode(name,data)\r\n };\r\n },\r\n priority: 4\r\n } : null;\r\n}\r\n"],"names":[],"mappings":";;;;;;~~AA2BA~~,MAAM,gBAAgB;AAEtB,MAAM,eAAe;AAKd,MAAM,wBAAwB,~~SAAS~~;AAAA,~~EA8B5C~~,YAAY,MAAc,MAAe,KAAe;AACtD,UAAM,~~IAAG,~~GAAG;~~AA9Bd~~;AACA;AA8BE,SAAK,SAAS;AACd,SAAK,SAAS;AAAA,EAChB;AAAA,EA9BA,OAAO,UAAkB;AAAS,WAAA;AAAA,EAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAO5C,OAAO,MAAM,MAAwC;AACnD,WAAO,IAAI,gBAAgB,KAAK,QAAO,KAAK,QAAO,KAAK,KAAK;AAAA,EAC/D;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,OAAO,mBAA2B;AAAS,WAAA;AAAA,EAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOzD,OAAO,WAAW,gBAA4D;AAC5E,WAAO,uBAAuB,eAAe,MAAK,eAAe,IAAI;AAAA,EACvE;AAAA;AAAA;AAAA;AAAA,EAWA,UAAS;AACP,UAAM,EAAE,OAAW,IAAA,UAAU,KAAK,MAAM;AACxC,WAAO,WAAW,OAAO,UAAS,KAAK,MAAM;AAAA,EAC/C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,WAAW,MAAS;AACZ,UAAA,WAAW,KAAK;AACtB,aAAS,SAAS;AAAA,EACpB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,aAAwC;AAE/B,WAAA;AAAA,MACL,GAAG,MAAM,WAAW;AAAA,MACpB,MAAM,KAAK,QAAQ;AAAA,MACnB,SAAS;AAAA,MACT,MAAK,KAAK;AAAA,MACV,MAAM,KAAK;AAAA,IAAA;AAAA,EAEf;AAAA,EAGA,OAAO,YAAqC;AACnC,WAAA;AAAA,MACL,KAAM;AAAA,MACN,SAAU;AAAA,IAAA;AAAA,EAEd;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQA,eACE,eACA,uBACQ;AAEF,UAAA,UAAU,SAAS,cAAc,KAAK;AAC5C,UAAM,EAAE,OAAW,IAAA,UAAU,KAAK,MAAM;AACxC,YAAQ,YAAY,WAAW,OAAO,UAAS,KAAK,MAAM;AAE1D,WAAO,QAAQ;AAAA,EACjB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,sBAAmC;AAE3B,UAAA,UAAU,SAAS,cAAc,KAAK;AAC5C,UAAM,EAAE,OAAW,IAAA,UAAU,KAAK,MAAM;AAExC,YAAQ,YAAY,WAAW,OAAO,UAAS,KAAK,MAAM;AAEvD,QAAA,QAAQ,SAAS,SAAS,GAAE;AACvB,YAAA,IAAI,MAAM,sCAAsC;AAAA,IACxD;AAEM,UAAA,YAAY,QAAQ,SAAS,CAAC;AAEpC,QAAI,CAAC,UAAU,UAAU,SAAS,aAAa,GAAG;AACtC,gBAAA,UAAU,IAAI,aAAa;AAAA,IACvC;AAGU,cAAA,aAAa,cAAa,KAAK,MAAM;AAExC,WAAA;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,YAA6B;AAC3B,WAAO,EAAE,SAAQ,KAAK,oBAAsB,EAAA;AAAA,EAC9C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,UAAU,QAAmC;AACrC,UAAA,KAAK,KAAK;AACb,OAAA,aAAa,YAAW,KAAK,KAAK;AAClC,OAAA,aAAa,mBAAkB,OAAO;AACtC,OAAA,aAAa,0BAAyB,MAAM;AACxC,WAAA;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASA,UAAU,UAA2B,KAAkB,QAA+B;AAC9E,UAAA,KAAK,KAAK;AAChB,QAAI,YAAY,GAAG;AACZ,WAAA;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA,~~EAMA~~,~~WAAoB~~;~~AACX~~,WAAA;AAAA,EACT;AACF;AAOgB,SAAA,uBAAuB,MAAY,MAA+B;AACzE,SAAA,IAAI,gBAAgB,MAAK,IAAI;AACtC;AAOO,SAAS,mBACd,MACyB;AACzB,SAAO,gBAAgB;AACzB;AAQa,MAAA,wBAAwB,CAAC,YAA2D;AAEzF,QAAA,OAAO,QAAQ,aAAa,YAAY;AAC9C,QAAM,WAAW,QAAQ,UAAU,SAAS,aAAa;AACzD,QAAM,gBAAgB,QAAQ;AAE9B,MAAG,YAAY,MAAK;AAAE,YAAQ,YAAY;AAAA,EAAI;AAE9C,SAAO,YAAY,OAAO;AAAA,IACxB,YAAY,MAAI;AACd,YAAM,EAAE,OAAA,IAAW,UAAU,IAAI;AACjC,YAAM,EAAE,KAAK,IAAI,qBAAqB,eAAc,OAAO,OAAO;AAC3D,aAAA;AAAA,QACL,MAAK,uBAAuB,MAAK,IAAI;AAAA,MAAA;AAAA,IAEzC;AAAA,IACA,UAAU;AAAA,EACR,IAAA;AACN;"}
1	+ {"version":3,"file":"ModuleBlockNode.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/ModuleBlockNode.ts"],"sourcesContent":["\r\nimport {\r\n type DOMConversionMap,\r\n type DOMExportOutput,\r\n type LexicalNode,\r\n type NodeKey,\r\n type Spread,\r\n type EditorConfig,\r\n type DOMConversion,\r\n type SerializedLexicalNode,\r\n DecoratorNode,\r\n LexicalEditor,\r\n} from 'lexical'\r\nimport { useModule } from \"./composables\"\r\nimport { createHtml,createModuleMetaData } from \"./utils\"\r\nimport { Component } from 'vue'\r\n\r\n/*\r\n 模块模版节点序列化\r\n /\r\nexport type SerializedModuleBlockNode = Spread<\r\n {\r\n name:string,\r\n data: object\r\n },\r\n SerializedLexicalNode\r\n>\r\n\r\n// 类标识\r\nconst ClassMarkName = \"mk-doc-block__module\";\r\n// 属性标识\r\nconst AttrMarkName = \"module-name\";\r\n\r\n/\r\n 模块节点\r\n /\r\nexport class ModuleBlockNode extends DecoratorNode<Component\|null> {\r\n __name: string\r\n __data: object\r\n\r\n static getType(): string { return \"module\"; }\r\n\r\n /\r\n 克隆\r\n * @param node \r\n * @returns \r\n /\r\n static clone(node: ModuleBlockNode): ModuleBlockNode {\r\n return new ModuleBlockNode(node.__name,node.__data,node.__key)\r\n }\r\n\r\n /\r\n 获取模块类标识\r\n * @returns \r\n /\r\n static getMarkClassName(): string { return ClassMarkName }\r\n\r\n /\r\n 导入\r\n * @param serializedNode \r\n * @returns \r\n /\r\n static importJSON(serializedNode: SerializedModuleBlockNode): ModuleBlockNode {\r\n return $createModuleBlockNode(serializedNode.name,serializedNode.data)\r\n }\r\n\r\n constructor(name: string, data: object, key?: NodeKey) {\r\n super(key)\r\n this.__name = name\r\n this.__data = data\r\n }\r\n\r\n /\r\n 获取html内容\r\n /\r\n getHtml(){\r\n const { module } = useModule(this.__name);\r\n return createHtml(module.template,this.__data)\r\n }\r\n\r\n /\r\n 设置内容\r\n * @param html \r\n /\r\n setContent(data:any){\r\n const writable = this.getWritable();\r\n writable.__data = data;\r\n }\r\n\r\n /\r\n 导出JSON\r\n * @returns \r\n /\r\n exportJSON(): SerializedModuleBlockNode {\r\n\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n version: 1,\r\n name:this.__name,\r\n data: this.__data\r\n }\r\n }\r\n\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n div : $covertModuleBlockDOM,\r\n section : $covertModuleBlockDOM \r\n }\r\n }\r\n\r\n /\r\n 获取文本内容\r\n * @param _includeInert \r\n * @param _includeDirectionless \r\n * @returns \r\n /\r\n getTextContent(\r\n _includeInert?: boolean \| undefined,\r\n _includeDirectionless?: false \| undefined,\r\n ): string {\r\n\r\n const element = document.createElement('div')\r\n const { module } = useModule(this.__name);\r\n element.innerHTML = createHtml(module.template,this.__data);\r\n\r\n return element.textContent as string;\r\n }\r\n\r\n /\r\n 创建模块的el\r\n * @returns \r\n /\r\n createModuleElement(): HTMLElement {\r\n\r\n const element = document.createElement('div')\r\n const { module } = useModule(this.__name);\r\n\r\n element.innerHTML = createHtml(module.template,this.__data);\r\n\r\n if(element.children.length > 1){\r\n throw new Error(\"定义模块模版的时候请用一个容器将模版内容包裹起来，不能有多个并列的元素！\");\r\n }\r\n\r\n const contentEl = element.children[0] as HTMLElement;\r\n\r\n if (!contentEl.classList.contains(ClassMarkName)) {\r\n contentEl.classList.add(ClassMarkName);\r\n }\r\n\r\n // 模块名称标识\r\n contentEl.setAttribute(AttrMarkName,this.__name)\r\n \r\n return contentEl;\r\n }\r\n\r\n /\r\n 导出DOM结构\r\n * @returns \r\n /\r\n exportDOM(): DOMExportOutput {\r\n return { element:this.createModuleElement() }\r\n }\r\n\r\n /\r\n 渲染\r\n * @param config \r\n * @returns \r\n /\r\n createDOM(config: EditorConfig): HTMLElement {\r\n const el = this.createModuleElement();\r\n el.setAttribute(\"node-key\",this.__key)\r\n el.setAttribute(\"contenteditable\",\"false\")\r\n el.setAttribute(\"data-lexical-decorator\",\"true\")\r\n return el;\r\n }\r\n\r\n /\r\n 更新DOM\r\n * @param prevNode \r\n * @param dom \r\n * @param config \r\n * @returns \r\n /\r\n updateDOM(prevNode: ModuleBlockNode, dom: HTMLElement, config: EditorConfig): boolean {\r\n const el = this.createModuleElement();\r\n dom.innerHTML = el.innerHTML;\r\n return false\r\n }\r\n decorate(editor: LexicalEditor, config: EditorConfig): Component \| null {\r\n return null;\r\n }\r\n isEmpty(){\r\n return false;\r\n }\r\n isIsolated() {\r\n return false;\r\n }\r\n isInline() {\r\n return true;\r\n }\r\n isKeyboardSelectable() {\r\n return true;\r\n }\r\n}\r\n\r\n/\r\n 创建节点\r\n * @param src \r\n * @returns \r\n /\r\nexport function $createModuleBlockNode(name:string,data: object): ModuleBlockNode {\r\n return new ModuleBlockNode(name,data)\r\n}\r\n\r\n/\r\n 判断节点\r\n * @param node \r\n * @returns \r\n /\r\nexport function $isModuleBlockNode(\r\n node: ModuleBlockNode \| LexicalNode \| null \| undefined,\r\n): node is ModuleBlockNode {\r\n return node instanceof ModuleBlockNode\r\n}\r\n\r\n\r\n/\r\n 转换模块DOM\r\n * @param node \r\n * @returns \r\n */\r\nexport const $covertModuleBlockDOM = (domNode: HTMLElement):DOMConversion<HTMLElement> \| null => {\r\n\r\n const name = domNode.getAttribute(AttrMarkName) as string;\r\n const isModule = domNode.classList.contains(ClassMarkName);\r\n const moduleContent = domNode.innerHTML ;\r\n\r\n if(isModule && name){ domNode.innerHTML = \"\"; }\r\n\r\n return isModule && name ? {\r\n conversion: ()=>{ \r\n const { module } = useModule(name);\r\n const { data } = createModuleMetaData(moduleContent,module.options);\r\n return { \r\n node:$createModuleBlockNode(name,data)\r\n };\r\n },\r\n priority: 4\r\n } : null;\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/esm/components/basic/doc-editor/themes/doc-editor-edit.css.js CHANGED Viewed

@@ -1,4 +1,4 @@
-const DocEditorEditCss = '\r\n.mk-doc__img {\r\n  cursor: pointer;\r\n  z-index: 1;\r\n  position: relative;\r\n}\r\n\r\n.mk-doc__grid{\r\n  outline: 2px solid #eff5ff;\r\n  position: relative;\r\n  cursor: pointer;\r\n  white-space:initial;\r\n  word-break:initial;\r\n  min-height: 150px;\r\n}\r\n.mk-doc__grid.mk-doc__module-grid::before,\r\n.mk-doc__grid.doc-edit-active::before{\r\n  text-align: center;\r\n  background-color: #eff5ff;\r\n  color: #4284ff;\r\n  left: -20px;\r\n  top: 0px;\r\n  pointer-events: all;\r\n  font-size: 14px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 999; \r\n  width: 20px;\r\n  cursor: pointer;\r\n  font-size: 12px;\r\n  padding: 5px 0;\r\n}\r\n\r\n.mk-doc__grid.doc-edit-active::before{\r\n  content: "容器";\r\n  position: absolute;\r\n}\r\n.mk-doc__grid.mk-doc__layout-grid.doc-edit-active::before{\r\n  content: "布局容器";\r\n}\r\n/* 文本框可编辑文字 */\r\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\r\n  cursor: text;\r\n}\r\n.mk-doc__grid.mk-doc__text-grid.doc-edit-active::before{\r\n  content: "文本容器";\r\n}\r\n\r\n/* 图文环绕容器 */\r\n.mk-doc__grid.mk-doc__image-text.doc-edit-active::before{\r\n  content: "图文环绕容器";\r\n}\r\n\r\n/* 图文环绕容器下的文本框不做选中 */\r\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\r\n  outline: 0;\r\n  padding-top: 0;\r\n}\r\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid::before{\r\n  display: none;\r\n}\r\n\r\n/* 模块容器 */\r\n.mk-doc__grid.mk-doc__module-grid::before{\r\n  content: "模块容器";\r\n  width: 200px;\r\n  height: 20px;\r\n  top:0;\r\n  left: 0;;\r\n  position: sticky;\r\n}\r\n/* 避免模块下的a标签点击 */\r\n.mk-doc__grid.mk-doc__module-grid a{\r\n  pointer-events: none;\r\n}\r\n\r\n/* 给布局下的格子加内边距方便编辑 */\r\n.mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\r\n  margin: 10px;\r\n}\r\n\r\n/* 块选中 */\r\n.mk-doc__embedBlock {\r\n  position: relative;\r\n  z-index: 1;\r\n  padding: 1px;\r\n  cursor: pointer;\r\n}\r\n.mk-doc__embedBlockFocus {\r\n  outline: 2px solid rgb(60, 132, 244);\r\n}\r\n\r\n.mk-doc__embedBlock >*{\r\n  pointer-events: none;\r\n}\r\n\r\n.mk-doc-active-element-block-mark{\r\n  position: absolute;\r\n  box-sizing:border-box;\r\n  background-color:#2776f63b;\r\n  z-index: 99;\r\n  pointer-events: none;\r\n}\r\n.mk-doc-active-element-block-mark.box{\r\n  outline: 2px solid #2776f63b;\r\n  background-color: transparent;\r\n}\r\n';
+const DocEditorEditCss = '\r\n.mk-doc__img {\r\n  cursor: pointer;\r\n  z-index: 1;\r\n  position: relative;\r\n}\r\n\r\n.mk-doc__grid{\r\n  outline: 2px solid #eff5ff;\r\n  position: relative;\r\n  cursor: pointer;\r\n  white-space:initial;\r\n  word-break:initial;\r\n  min-height: 150px;\r\n}\r\n.mk-doc__grid.doc-edit-active::before{\r\n  text-align: center;\r\n  background-color: #eff5ff;\r\n  color: #4284ff;\r\n  left: -20px;\r\n  top: 0px;\r\n  pointer-events: all;\r\n  font-size: 14px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 999; \r\n  width: 20px;\r\n  cursor: pointer;\r\n  font-size: 12px;\r\n  padding: 5px 0;\r\n}\r\n\r\n.mk-doc__grid.doc-edit-active::before{\r\n  content: "容器";\r\n  position: absolute;\r\n}\r\n.mk-doc__grid.mk-doc__layout-grid.doc-edit-active::before{\r\n  content: "布局容器";\r\n}\r\n/* 文本框可编辑文字 */\r\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\r\n  cursor: text;\r\n}\r\n.mk-doc__grid.mk-doc__text-grid.doc-edit-active::before{\r\n  content: "文本容器";\r\n}\r\n\r\n/* 图文环绕容器 */\r\n.mk-doc__grid.mk-doc__image-text.doc-edit-active::before{\r\n  content: "图文环绕容器";\r\n}\r\n\r\n/* 图文环绕容器下的文本框不做选中 */\r\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\r\n  outline: 0;\r\n  padding-top: 0;\r\n}\r\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid::before{\r\n  display: none;\r\n}\r\n\r\n/* 模块容器 */\r\n.mk-doc__grid.mk-doc__module-grid.doc-edit-active::before{\r\n  content: "模块容器";\r\n  top: -20px;\r\n  left: -2px;\r\n  height: 20px;\r\n  width: auto;\r\n  padding: 0 5px;\r\n}\r\n\r\n/* 避免模块下的a标签点击 */\r\n.mk-doc__grid.mk-doc__module-grid a{\r\n  pointer-events: none;\r\n}\r\n\r\n/* 给布局下的格子加内边距方便编辑 */\r\n.mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\r\n  margin: 10px;\r\n}\r\n\r\n/* 块选中 */\r\n.mk-doc__embedBlock {\r\n  position: relative;\r\n  z-index: 1;\r\n  padding: 1px;\r\n  cursor: pointer;\r\n}\r\n.mk-doc__embedBlockFocus {\r\n  outline: 2px solid rgb(60, 132, 244);\r\n}\r\n\r\n.mk-doc__embedBlock >*{\r\n  pointer-events: none;\r\n}\r\n\r\n.mk-doc-active-element-block-mark{\r\n  position: absolute;\r\n  box-sizing:border-box;\r\n  background-color:#2776f63b;\r\n  z-index: 99;\r\n  pointer-events: none;\r\n}\r\n.mk-doc-active-element-block-mark.box{\r\n  outline: 2px solid #2776f63b;\r\n  background-color: transparent;\r\n}\r\n';
 export {
   DocEditorEditCss as default
 };

package/dist/esm/components/basic/doc-editor/themes/doc-editor-edit.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"doc-editor-edit.css.js","sources":["../../../../../../src/components/basic/doc-editor/themes/doc-editor-edit.css?raw"],"sourcesContent":["export default \"\\r\\n.mk-doc__img {\\r\\n cursor: pointer;\\r\\n z-index: 1;\\r\\n position: relative;\\r\\n}\\r\\n\\r\\n.mk-doc__grid{\\r\\n outline: 2px solid #eff5ff;\\r\\n position: relative;\\r\\n cursor: pointer;\\r\\n white-space:initial;\\r\\n word-break:initial;\\r\\n min-height: 150px;\\r\\n}\\r\\n.mk-doc__grid.~~mk-doc__module-grid::before,\\r\\n.mk-doc__grid.~~doc-edit-active::before{\\r\\n text-align: center;\\r\\n background-color: #eff5ff;\\r\\n color: #4284ff;\\r\\n left: -20px;\\r\\n top: 0px;\\r\\n pointer-events: all;\\r\\n font-size: 14px;\\r\\n display: flex;\\r\\n align-items: center;\\r\\n justify-content: center;\\r\\n z-index: 999; \\r\\n width: 20px;\\r\\n cursor: pointer;\\r\\n font-size: 12px;\\r\\n padding: 5px 0;\\r\\n}\\r\\n\\r\\n.mk-doc__grid.doc-edit-active::before{\\r\\n content: \\\"容器\\\";\\r\\n position: absolute;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__layout-grid.doc-edit-active::before{\\r\\n content: \\\"布局容器\\\";\\r\\n}\\r\\n/* 文本框可编辑文字 /\\r\\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\\r\\n cursor: text;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__text-grid.doc-edit-active::before{\\r\\n content: \\\"文本容器\\\";\\r\\n}\\r\\n\\r\\n/ 图文环绕容器 /\\r\\n.mk-doc__grid.mk-doc__image-text.doc-edit-active::before{\\r\\n content: \\\"图文环绕容器\\\";\\r\\n}\\r\\n\\r\\n/ 图文环绕容器下的文本框不做选中 /\\r\\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\\r\\n outline: 0;\\r\\n padding-top: 0;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid::before{\\r\\n display: none;\\r\\n}\\r\\n\\r\\n/ 模块容器 /\\r\\n.mk-doc__grid.mk-doc__module-grid::before{\\r\\n content: \\\"模块容器\\\";\\r\\n ~~width~~: ~~200px~~;\\r\\n ~~height~~: ~~20px~~;\\r\\n ~~top~~:0;\\r\\n ~~left~~: ~~0;;\\~~r\\n ~~position~~: ~~sticky~~;\\r\\n}\\r\\n/ 避免模块下的a标签点击 /\\r\\n.mk-doc__grid.mk-doc__module-grid a{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\n/ 给布局下的格子加内边距方便编辑 /\\r\\n.mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\\r\\n margin: 10px;\\r\\n}\\r\\n\\r\\n/ 块选中 /\\r\\n.mk-doc__embedBlock {\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n padding: 1px;\\r\\n cursor: pointer;\\r\\n}\\r\\n.mk-doc__embedBlockFocus {\\r\\n outline: 2px solid rgb(60, 132, 244);\\r\\n}\\r\\n\\r\\n.mk-doc__embedBlock >{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\n.mk-doc-active-element-block-mark{\\r\\n position: absolute;\\r\\n box-sizing:border-box;\\r\\n background-color:#2776f63b;\\r\\n z-index: 99;\\r\\n pointer-events: none;\\r\\n}\\r\\n.mk-doc-active-element-block-mark.box{\\r\\n outline: 2px solid #2776f63b;\\r\\n background-color: transparent;\\r\\n}\\r\\n\""],"names":[],"mappings":"AAAA,MAAe,mBAAA;"}
1	+ {"version":3,"file":"doc-editor-edit.css.js","sources":["../../../../../../src/components/basic/doc-editor/themes/doc-editor-edit.css?raw"],"sourcesContent":["export default \"\\r\\n.mk-doc__img {\\r\\n cursor: pointer;\\r\\n z-index: 1;\\r\\n position: relative;\\r\\n}\\r\\n\\r\\n.mk-doc__grid{\\r\\n outline: 2px solid #eff5ff;\\r\\n position: relative;\\r\\n cursor: pointer;\\r\\n white-space:initial;\\r\\n word-break:initial;\\r\\n min-height: 150px;\\r\\n}\\r\\n.mk-doc__grid.doc-edit-active::before{\\r\\n text-align: center;\\r\\n background-color: #eff5ff;\\r\\n color: #4284ff;\\r\\n left: -20px;\\r\\n top: 0px;\\r\\n pointer-events: all;\\r\\n font-size: 14px;\\r\\n display: flex;\\r\\n align-items: center;\\r\\n justify-content: center;\\r\\n z-index: 999; \\r\\n width: 20px;\\r\\n cursor: pointer;\\r\\n font-size: 12px;\\r\\n padding: 5px 0;\\r\\n}\\r\\n\\r\\n.mk-doc__grid.doc-edit-active::before{\\r\\n content: \\\"容器\\\";\\r\\n position: absolute;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__layout-grid.doc-edit-active::before{\\r\\n content: \\\"布局容器\\\";\\r\\n}\\r\\n/* 文本框可编辑文字 /\\r\\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\\r\\n cursor: text;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__text-grid.doc-edit-active::before{\\r\\n content: \\\"文本容器\\\";\\r\\n}\\r\\n\\r\\n/ 图文环绕容器 /\\r\\n.mk-doc__grid.mk-doc__image-text.doc-edit-active::before{\\r\\n content: \\\"图文环绕容器\\\";\\r\\n}\\r\\n\\r\\n/ 图文环绕容器下的文本框不做选中 /\\r\\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\\r\\n outline: 0;\\r\\n padding-top: 0;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid::before{\\r\\n display: none;\\r\\n}\\r\\n\\r\\n/ 模块容器 /\\r\\n.mk-doc__grid.mk-doc__module-grid.doc-edit-active::before{\\r\\n content: \\\"模块容器\\\";\\r\\n top: -20px;\\r\\n left: -2px;\\r\\n height: 20px;\\r\\n width: auto;\\r\\n padding: 0 5px;\\r\\n}\\r\\n\\r\\n/ 避免模块下的a标签点击 /\\r\\n.mk-doc__grid.mk-doc__module-grid a{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\n/ 给布局下的格子加内边距方便编辑 /\\r\\n.mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\\r\\n margin: 10px;\\r\\n}\\r\\n\\r\\n/ 块选中 /\\r\\n.mk-doc__embedBlock {\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n padding: 1px;\\r\\n cursor: pointer;\\r\\n}\\r\\n.mk-doc__embedBlockFocus {\\r\\n outline: 2px solid rgb(60, 132, 244);\\r\\n}\\r\\n\\r\\n.mk-doc__embedBlock >{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\n.mk-doc-active-element-block-mark{\\r\\n position: absolute;\\r\\n box-sizing:border-box;\\r\\n background-color:#2776f63b;\\r\\n z-index: 99;\\r\\n pointer-events: none;\\r\\n}\\r\\n.mk-doc-active-element-block-mark.box{\\r\\n outline: 2px solid #2776f63b;\\r\\n background-color: transparent;\\r\\n}\\r\\n\""],"names":[],"mappings":"AAAA,MAAe,mBAAA;"}

package/dist/esm/modules/cms/pages/cms-contents/index.vue2.js CHANGED Viewed

@@ -270,25 +270,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     }, 1032, ["onClick"])) : createCommentVNode("", true)
                   ], 64);
                 }), 256)),
-                createElementVNode("template", null, [
-                  activeTabName.value != "article-list" ? (openBlock(), createBlock(_component_el_button, {
-                    key: 0,
-                    type: "primary",
-                    text: "",
-                    onClick: _cache[0] || (_cache[0] = ($event) => savePartHandle()),
-                    disabled: !(partDataForm == null ? void 0 : partDataForm.isChanged)
-                  }, {
-                    default: withCtx(() => [
-                      createVNode(_component_MKSvgIcon, {
-                        iconClass: "save",
-                        style: { "margin-right": "5px" }
-                      }),
-                      createTextVNode(" 保存 ")
-                    ]),
-                    _: 1
-                  }, 8, ["disabled"])) : createCommentVNode("", true)
-                ]),
-                unref(CmsSettings).publish.mode == "static" && curSelectPartItem.value.coverTemplate || curSelectPartItem.value.listTemplate || curSelectPartItem.value.contentTemplate ? (openBlock(), createBlock(_component_el_dropdown, { key: 0 }, {
+                activeTabName.value == "part" || activeTabName.value == "part-content" ? (openBlock(), createBlock(_component_el_button, {
+                  key: 0,
+                  type: "primary",
+                  text: "",
+                  onClick: _cache[0] || (_cache[0] = ($event) => savePartHandle()),
+                  disabled: !(partDataForm == null ? void 0 : partDataForm.isChanged)
+                }, {
+                  default: withCtx(() => [
+                    createVNode(_component_MKSvgIcon, {
+                      iconClass: "save",
+                      style: { "margin-right": "5px" }
+                    }),
+                    createTextVNode(" 保存 ")
+                  ]),
+                  _: 1
+                }, 8, ["disabled"])) : createCommentVNode("", true),
+                unref(CmsSettings).publish.mode == "static" && curSelectPartItem.value.coverTemplate || curSelectPartItem.value.listTemplate || curSelectPartItem.value.contentTemplate ? (openBlock(), createBlock(_component_el_dropdown, { key: 1 }, {
                   dropdown: withCtx(() => [
                     createVNode(_component_el_dropdown_menu, null, {
                       default: withCtx(() => [

package/dist/esm/modules/cms/pages/cms-contents/index.vue2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue2.js","sources":["../../../../../../src/modules/cms/pages/cms-contents/index.vue"],"sourcesContent":["<template>\r\n <div class=\"mk-cms-contents__warp\" v-loading=\"loading\">\r\n <el-page-header style=\"background-color: #fff; padding: 10px\" :icon=\"null\">\r\n <template #title>\r\n <h3 style=\"color: var(--el-text-color-regular); margin-left: 10px\">\r\n <MKSvgIcon iconClass=\"richtext-outline\" style=\"margin-right: 5px\" />\r\n 内容管理\r\n </h3>\r\n </template>\r\n <template #extra>\r\n <div class=\"flex items-center\">\r\n <el-button-group>\r\n <el-button type=\"primary\" size=\"large\" text v-if=\"CmsSettings.publish.mode == 'static'\" @click=\"publishAllPartHandle\">\r\n <MKSvgIcon iconClass=\"Promotion\" style=\"margin-right: 10px\" />\r\n 整站发布\r\n </el-button>\r\n <el-button type=\"primary\" size=\"large\" text @click=\"showPartFormHandle\">\r\n <MKSvgIcon iconClass=\"Plus\" style=\"margin-right: 10px\" />\r\n 新增栏目\r\n </el-button>\r\n </el-button-group>\r\n </div>\r\n </template>\r\n </el-page-header>\r\n <div class=\"mk-cms-contents__body\">\r\n <MKPartTree class=\"mk-cms-contents__body__left\" @select=\"selectPartHandle\" @edit=\"editPartHandle\"\r\n @add=\"showPartFormHandle\" @deleteSuccessfully=\"deletePartHandle\" ref=\"partTreeRef\"\r\n :curSelectId=\"curSelectPartId\" />\r\n <el-tabs v-if=\"curSelectPartItem\" v-model=\"activeTabName\" class=\"mk-cms-contents__body__right\">\r\n <div class=\"mk-cms-contents__body__right__action\">\r\n\r\n <template v-for=\"(ext,i) in partExList\" :label=\"ext.title \|\| `页面扩展设置 ${i+1}`\" :name=\"\">\r\n <el-button type=\"primary\" text @click=\"ext.save()\" v-if=\"activeTabName == `part-ext${i}` && ext.save\">\r\n <MKSvgIcon iconClass=\"save\" style=\"margin-right: 5px\" />\r\n 保存{{ext.title}}\r\n </el-button>\r\n </template>\r\n <template>\r\n <el-button type=\"primary\" text @click=\"savePartHandle()\" :disabled=\"!partDataForm?.isChanged\"\r\n v-if=\"activeTabName != 'article-list'\">\r\n <MKSvgIcon iconClass=\"save\" style=\"margin-right: 5px\" />\r\n 保存\r\n </el-button>\r\n </template>\r\n <el-dropdown v-if=\"CmsSettings.publish.mode == 'static' && curSelectPartItem.coverTemplate \|\| curSelectPartItem.listTemplate \|\| curSelectPartItem.contentTemplate\">\r\n <span class=\"el-dropdown-link\">\r\n <el-button type=\"primary\" text>\r\n <MKSvgIcon iconClass=\"MoreFilled\" />\r\n </el-button>\r\n </span>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item @click=\"CmsPartForm.openPreview(curSelectPartItem.id)\" v-if=\"CmsSettings.publish.mode == 'static' && curSelectPartItem.coverTemplate\">\r\n <MKSvgIcon iconClass=\"View\" style=\"margin-left: 10px;\" />\r\n 预览封面\r\n </el-dropdown-item>\r\n <el-dropdown-item @click=\"CmsPartForm.openPreview(curSelectPartItem.id,'1')\" v-if=\"curSelectPartItem.listTemplate\">\r\n <MKSvgIcon iconClass=\"View\" style=\"margin-left: 10px;\" />\r\n 预览列表\r\n </el-dropdown-item>\r\n <el-dropdown-item @click=\"showPublish = true\">\r\n <MKSvgIcon iconClass=\"Promotion\" style=\"margin-left: 10px;\" />\r\n 发布当前栏目\r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n </div>\r\n <el-tab-pane label=\"文章列表\" name=\"article-list\" v-if=\"curSelectPartItem.contentTemplate\">\r\n <ArticleList v-if=\"activeTabName == 'article-list'\" :part=\"curSelectPartItem\" />\r\n </el-tab-pane>\r\n <el-tab-pane label=\"栏目设置\" name=\"part\" v-loading=\"partDataForm.loading\">\r\n <PartInfo v-if=\"activeTabName == 'part'\" :part=\"curSelectPartItem\" ref=\"partInfoRef\"\r\n :partDataForm=\"partDataForm\" />\r\n </el-tab-pane>\r\n <el-tab-pane label=\"页面内容\" name=\"part-content\" style=\"background-color: #f4f4f4\"\r\n v-if=\"curSelectPartItem.cmsPartTypeId != 1\" v-loading=\"partDataForm.loading\">\r\n <MKDocEditor v-if=\"activeTabName == 'part-content'\" :css=\"CmsSettings.part.doc.css\" :js=\"CmsSettings.part.doc.js\" :content=\"partDataForm.data?.content\"\r\n placeholder=\"从这里开始写正文...\" @change=\"EditorChangeHandle\">\r\n <template #before-extentions>\r\n <PartBannerEdit v-if=\"partDataForm.data?.id\" :partId=\"partDataForm.data?.id\" :title=\"partDataForm.data?.title\" />\r\n </template>\r\n </MKDocEditor>\r\n </el-tab-pane>\r\n <el-tab-pane v-for=\"(ext,i) in partExList\" :label=\"ext.title \|\| `页面扩展设置 ${i==0 ?'':i}`\" :name=\"`part-ext${i}`\">\r\n <component :is=\"ext.component\" />\r\n </el-tab-pane>\r\n \r\n </el-tabs>\r\n <el-empty v-else description=\"请选择栏目\" style=\"width: 100%\" />\r\n </div>\r\n <el-dialog v-model=\"showPublish\" title=\"栏目发布\" width=\"475px\" :append-to-body=\"false\">\r\n <div class=\"mk-cms-contents__publish\">\r\n <div><span>是否发布列表：</span> <el-switch v-model=\"optionData.isPublishList\"\r\n :disabled=\"!curSelectPartItem.listTemplate\" /></div>\r\n <div><span>是否发布封面：</span> <el-switch v-model=\"optionData.isPublishCover\"\r\n :disabled=\"!curSelectPartItem.coverTemplate\" /></div>\r\n <div><span>是否发布内容：</span> <el-switch v-model=\"optionData.isPublishContent\"\r\n :disabled=\"!curSelectPartItem.contentTemplate\" /></div>\r\n <div><span>是否发布资源：</span> <el-switch v-model=\"optionData.isPublishAssets\" /></div>\r\n <div><span>是否强制发布：</span> <el-switch v-model=\"optionData.isCompulsion\" /></div>\r\n </div>\r\n <template #footer>\r\n <el-button @click=\"showPublish = false\">取消</el-button>\r\n <el-button type=\"primary\" @click=\"publishPartHandle\" :loading=\"publishLoading\">确定</el-button>\r\n </template>\r\n </el-dialog>\r\n </div>\r\n</template>\r\n<script setup lang=\"ts\" >\r\nimport { MKPartTree } from \"../../components\";\r\nimport ArticleList from \"./components/article-list.vue\";\r\nimport PartInfo from \"./components/part-info.vue\";\r\nimport PartBannerEdit from \"./components/part-banner-edit.vue\";\r\nimport { MKDocEditor } from \"../../../../components\";\r\nimport { reactive, ref, watch,watchEffect } from \"vue\";\r\nimport { Dialoger } from \"@maketribe/dm\";\r\nimport { CmsContentManPartForm,CmsPartForm, CmsPartMiniForm } from \"../../dataviews/cms-parts\";\r\nimport { useRoute, useRouter } from \"vue-router\";\r\nimport { usePartExtensionList, type PartExtension } from \"../../composables/part-extensions\"\r\nimport { ElSwitch } from \"element-plus\";\r\nimport { useCmsSettings } from \"../../cms-settings\"\r\n//路由 \r\nconst route = useRoute();\r\nconst router = useRouter();\r\n\r\n// 当前选中的栏目id\r\nconst curSelectPartId = ref<string>(route.query.pid as string)\r\nwatch(()=>route.query.pid,(v:any)=>{\r\n curSelectPartId.value = v \r\n},{ immediate:true });\r\n\r\n//栏目Mini表单\r\nconst partMiniForm = reactive<CmsPartMiniForm>(new CmsPartMiniForm());\r\n\r\n// cms 配置\r\nconst CmsSettings = useCmsSettings(true);\r\n\r\n//发布栏目时的配置\r\nconst showPublish = ref(false)\r\n\r\n//发布配置项\r\nconst optionData = ref({\r\n isPublishList: false,\r\n isPublishCover: false,\r\n isPublishContent: false,\r\n isPublishAssets: false,\r\n isCompulsion: true\r\n});\r\n\r\n//发布加载状态\r\nconst publishLoading = ref(false);\r\n\r\n// 数据加载状态\r\nconst loading = ref(false)\r\n\r\n// 激活的tab\r\nconst activeTabName = ref(\"article-list\");\r\n\r\n// 当前选中的菜单\r\nconst curSelectPartItem = ref(null as any);\r\n\r\n// 栏目树ref\r\nconst partTreeRef = ref(null);\r\n\r\n//栏目扩展\r\nconst partExList = ref<Array<PartExtension>>([]);\r\n\r\n//栏目数据\r\nconst partDataForm = reactive(new CmsContentManPartForm()) as CmsContentManPartForm;\r\n\r\n// 初始化表单\r\npartDataForm.init();\r\n\r\n// 切换tab 加载栏目表单数据\r\nlet beforeInitFormPart:any = null;\r\nwatchEffect(async ()=>{\r\n if((activeTabName.value == \"part\" \|\| activeTabName.value == \"part-content\") && curSelectPartItem.value != beforeInitFormPart){\r\n try {\r\n beforeInitFormPart = curSelectPartItem.value;\r\n await partDataForm.editRecord(curSelectPartItem.value.id);\r\n } catch (error) {\r\n console.log(error)\r\n }\r\n }\r\n});\r\n\r\n// 选择栏目\r\nconst selectPartHandle = async (item: any) => {\r\n\r\n if (curSelectPartItem.value != item) {\r\n\r\n curSelectPartItem.value = item;\r\n\r\n if (!curSelectPartItem.value.contentTemplate) {\r\n activeTabName.value = \"part\";\r\n }\r\n else{\r\n activeTabName.value = \"article-list\";\r\n }\r\n router.replace({ name: 'cms/contents', query: { pid: curSelectPartItem.value.id } } as any)\r\n partExList.value = usePartExtensionList(curSelectPartItem.value.id).concat(usePartExtensionList(curSelectPartItem.value.name));\r\n }\r\n};\r\n\r\n//删除栏目\r\nconst deletePartHandle = (item: any) => {\r\n if (item.id == curSelectPartItem.value.id) {\r\n curSelectPartItem.value = null;\r\n }\r\n};\r\n\r\n//编辑栏目\r\nconst editPartHandle = (item: any) => {\r\n curSelectPartItem.value = item;\r\n activeTabName.value = \"part\";\r\n};\r\n\r\n/*\r\n 显示添加栏目表单\r\n /\r\nconst showPartFormHandle = async (item?: any) => {\r\n await Dialoger.dataFormDialog({\r\n dataForm: partMiniForm as CmsContentManPartForm,\r\n });\r\n\r\n if (item.id) {\r\n partMiniForm.addRecord({ parentId: item.id });\r\n }\r\n\r\n};\r\n\r\nwatch(showPublish, async (v) => {\r\n if(v){\r\n optionData.value.isPublishList = !!curSelectPartItem.value.listTemplate\r\n optionData.value.isPublishCover = !!curSelectPartItem.value.coverTemplate\r\n optionData.value.isPublishContent = !!curSelectPartItem.value.contentTemplate\r\n }\r\n})\r\n \r\n//监听表单完成事件\r\npartMiniForm.submittedEvent.on(({ response }:any) => {\r\n if(response.data.data){\r\n // 重置选中\r\n curSelectPartId.value = response.data.data;\r\n // 刷新完成直接选中\r\n (partTreeRef.value! as any).dataTree?.load();\r\n }\r\n \r\n});\r\n\r\n//栏目发布\r\nconst publishAllPartHandle = async () => {\r\n\r\n try {\r\n\r\n loading.value = true;\r\n \r\n await CmsPartForm.publishAll()\r\n } \r\n finally {\r\n loading.value = false;\r\n }\r\n\r\n}\r\nconst publishPartHandle = async () => {\r\n \r\n try {\r\n\r\n publishLoading.value = true\r\n\r\n await CmsPartForm.publish(curSelectPartItem.value.id,optionData.value);\r\n\r\n showPublish.value = false;\r\n\r\n } finally {\r\n publishLoading.value = false\r\n }\r\n}\r\n\r\n/\r\n 保存栏目信息\r\n /\r\nconst savePartHandle = async () => {\r\n curSelectPartItem.value = partDataForm.data;\r\n await partDataForm.submit();\r\n}\r\n\r\n/\r\n 更新编辑器内容\r\n * @param v 内容\r\n */\r\nconst EditorChangeHandle = (v: any) => {\r\n partDataForm.data.content = v\r\n}\r\n</script>\r\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"index.vue2.js","sources":["../../../../../../src/modules/cms/pages/cms-contents/index.vue"],"sourcesContent":["<template>\r\n <div class=\"mk-cms-contents__warp\" v-loading=\"loading\">\r\n <el-page-header style=\"background-color: #fff; padding: 10px\" :icon=\"null\">\r\n <template #title>\r\n <h3 style=\"color: var(--el-text-color-regular); margin-left: 10px\">\r\n <MKSvgIcon iconClass=\"richtext-outline\" style=\"margin-right: 5px\" />\r\n 内容管理\r\n </h3>\r\n </template>\r\n <template #extra>\r\n <div class=\"flex items-center\">\r\n <el-button-group>\r\n <el-button type=\"primary\" size=\"large\" text v-if=\"CmsSettings.publish.mode == 'static'\" @click=\"publishAllPartHandle\">\r\n <MKSvgIcon iconClass=\"Promotion\" style=\"margin-right: 10px\" />\r\n 整站发布\r\n </el-button>\r\n <el-button type=\"primary\" size=\"large\" text @click=\"showPartFormHandle\">\r\n <MKSvgIcon iconClass=\"Plus\" style=\"margin-right: 10px\" />\r\n 新增栏目\r\n </el-button>\r\n </el-button-group>\r\n </div>\r\n </template>\r\n </el-page-header>\r\n <div class=\"mk-cms-contents__body\">\r\n <MKPartTree class=\"mk-cms-contents__body__left\" @select=\"selectPartHandle\" @edit=\"editPartHandle\"\r\n @add=\"showPartFormHandle\" @deleteSuccessfully=\"deletePartHandle\" ref=\"partTreeRef\"\r\n :curSelectId=\"curSelectPartId\" />\r\n <el-tabs v-if=\"curSelectPartItem\" v-model=\"activeTabName\" class=\"mk-cms-contents__body__right\">\r\n <div class=\"mk-cms-contents__body__right__action\">\r\n\r\n <template v-for=\"(ext,i) in partExList\" :label=\"ext.title \|\| `页面扩展设置 ${i+1}`\" :name=\"\">\r\n <el-button type=\"primary\" text @click=\"ext.save()\" v-if=\"activeTabName == `part-ext${i}` && ext.save\">\r\n <MKSvgIcon iconClass=\"save\" style=\"margin-right: 5px\" />\r\n 保存{{ext.title}}\r\n </el-button>\r\n </template>\r\n <template v-if=\"activeTabName == 'part' \|\| activeTabName == 'part-content'\">\r\n <el-button type=\"primary\" text @click=\"savePartHandle()\" :disabled=\"!partDataForm?.isChanged\">\r\n <MKSvgIcon iconClass=\"save\" style=\"margin-right: 5px\" />\r\n 保存\r\n </el-button>\r\n </template>\r\n <el-dropdown v-if=\"CmsSettings.publish.mode == 'static' && curSelectPartItem.coverTemplate \|\| curSelectPartItem.listTemplate \|\| curSelectPartItem.contentTemplate\">\r\n <span class=\"el-dropdown-link\">\r\n <el-button type=\"primary\" text>\r\n <MKSvgIcon iconClass=\"MoreFilled\" />\r\n </el-button>\r\n </span>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item @click=\"CmsPartForm.openPreview(curSelectPartItem.id)\" v-if=\"CmsSettings.publish.mode == 'static' && curSelectPartItem.coverTemplate\">\r\n <MKSvgIcon iconClass=\"View\" style=\"margin-left: 10px;\" />\r\n 预览封面\r\n </el-dropdown-item>\r\n <el-dropdown-item @click=\"CmsPartForm.openPreview(curSelectPartItem.id,'1')\" v-if=\"curSelectPartItem.listTemplate\">\r\n <MKSvgIcon iconClass=\"View\" style=\"margin-left: 10px;\" />\r\n 预览列表\r\n </el-dropdown-item>\r\n <el-dropdown-item @click=\"showPublish = true\">\r\n <MKSvgIcon iconClass=\"Promotion\" style=\"margin-left: 10px;\" />\r\n 发布当前栏目\r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n </div>\r\n <el-tab-pane label=\"文章列表\" name=\"article-list\" v-if=\"curSelectPartItem.contentTemplate\">\r\n <ArticleList v-if=\"activeTabName == 'article-list'\" :part=\"curSelectPartItem\" />\r\n </el-tab-pane>\r\n <el-tab-pane label=\"栏目设置\" name=\"part\" v-loading=\"partDataForm.loading\">\r\n <PartInfo v-if=\"activeTabName == 'part'\" :part=\"curSelectPartItem\" ref=\"partInfoRef\"\r\n :partDataForm=\"partDataForm\" />\r\n </el-tab-pane>\r\n <el-tab-pane label=\"页面内容\" name=\"part-content\" style=\"background-color: #f4f4f4\"\r\n v-if=\"curSelectPartItem.cmsPartTypeId != 1\" v-loading=\"partDataForm.loading\">\r\n <MKDocEditor v-if=\"activeTabName == 'part-content'\" :css=\"CmsSettings.part.doc.css\" :js=\"CmsSettings.part.doc.js\" :content=\"partDataForm.data?.content\"\r\n placeholder=\"从这里开始写正文...\" @change=\"EditorChangeHandle\">\r\n <template #before-extentions>\r\n <PartBannerEdit v-if=\"partDataForm.data?.id\" :partId=\"partDataForm.data?.id\" :title=\"partDataForm.data?.title\" />\r\n </template>\r\n </MKDocEditor>\r\n </el-tab-pane>\r\n <el-tab-pane v-for=\"(ext,i) in partExList\" :label=\"ext.title \|\| `页面扩展设置 ${i==0 ?'':i}`\" :name=\"`part-ext${i}`\">\r\n <component :is=\"ext.component\" />\r\n </el-tab-pane>\r\n \r\n </el-tabs>\r\n <el-empty v-else description=\"请选择栏目\" style=\"width: 100%\" />\r\n </div>\r\n <el-dialog v-model=\"showPublish\" title=\"栏目发布\" width=\"475px\" :append-to-body=\"false\">\r\n <div class=\"mk-cms-contents__publish\">\r\n <div><span>是否发布列表：</span> <el-switch v-model=\"optionData.isPublishList\"\r\n :disabled=\"!curSelectPartItem.listTemplate\" /></div>\r\n <div><span>是否发布封面：</span> <el-switch v-model=\"optionData.isPublishCover\"\r\n :disabled=\"!curSelectPartItem.coverTemplate\" /></div>\r\n <div><span>是否发布内容：</span> <el-switch v-model=\"optionData.isPublishContent\"\r\n :disabled=\"!curSelectPartItem.contentTemplate\" /></div>\r\n <div><span>是否发布资源：</span> <el-switch v-model=\"optionData.isPublishAssets\" /></div>\r\n <div><span>是否强制发布：</span> <el-switch v-model=\"optionData.isCompulsion\" /></div>\r\n </div>\r\n <template #footer>\r\n <el-button @click=\"showPublish = false\">取消</el-button>\r\n <el-button type=\"primary\" @click=\"publishPartHandle\" :loading=\"publishLoading\">确定</el-button>\r\n </template>\r\n </el-dialog>\r\n </div>\r\n</template>\r\n<script setup lang=\"ts\" >\r\nimport { MKPartTree } from \"../../components\";\r\nimport ArticleList from \"./components/article-list.vue\";\r\nimport PartInfo from \"./components/part-info.vue\";\r\nimport PartBannerEdit from \"./components/part-banner-edit.vue\";\r\nimport { MKDocEditor } from \"../../../../components\";\r\nimport { reactive, ref, watch,watchEffect } from \"vue\";\r\nimport { Dialoger } from \"@maketribe/dm\";\r\nimport { CmsContentManPartForm,CmsPartForm, CmsPartMiniForm } from \"../../dataviews/cms-parts\";\r\nimport { useRoute, useRouter } from \"vue-router\";\r\nimport { usePartExtensionList, type PartExtension } from \"../../composables/part-extensions\"\r\nimport { ElSwitch } from \"element-plus\";\r\nimport { useCmsSettings } from \"../../cms-settings\"\r\n//路由 \r\nconst route = useRoute();\r\nconst router = useRouter();\r\n\r\n// 当前选中的栏目id\r\nconst curSelectPartId = ref<string>(route.query.pid as string)\r\nwatch(()=>route.query.pid,(v:any)=>{\r\n curSelectPartId.value = v \r\n},{ immediate:true });\r\n\r\n//栏目Mini表单\r\nconst partMiniForm = reactive<CmsPartMiniForm>(new CmsPartMiniForm());\r\n\r\n// cms 配置\r\nconst CmsSettings = useCmsSettings(true);\r\n\r\n//发布栏目时的配置\r\nconst showPublish = ref(false)\r\n\r\n//发布配置项\r\nconst optionData = ref({\r\n isPublishList: false,\r\n isPublishCover: false,\r\n isPublishContent: false,\r\n isPublishAssets: false,\r\n isCompulsion: true\r\n});\r\n\r\n//发布加载状态\r\nconst publishLoading = ref(false);\r\n\r\n// 数据加载状态\r\nconst loading = ref(false)\r\n\r\n// 激活的tab\r\nconst activeTabName = ref(\"article-list\");\r\n\r\n// 当前选中的菜单\r\nconst curSelectPartItem = ref(null as any);\r\n\r\n// 栏目树ref\r\nconst partTreeRef = ref(null);\r\n\r\n//栏目扩展\r\nconst partExList = ref<Array<PartExtension>>([]);\r\n\r\n//栏目数据\r\nconst partDataForm = reactive(new CmsContentManPartForm()) as CmsContentManPartForm;\r\n\r\n// 初始化表单\r\npartDataForm.init();\r\n\r\n// 切换tab 加载栏目表单数据\r\nlet beforeInitFormPart:any = null;\r\nwatchEffect(async ()=>{\r\n if((activeTabName.value == \"part\" \|\| activeTabName.value == \"part-content\") && curSelectPartItem.value != beforeInitFormPart){\r\n try {\r\n beforeInitFormPart = curSelectPartItem.value;\r\n await partDataForm.editRecord(curSelectPartItem.value.id);\r\n } catch (error) {\r\n console.log(error)\r\n }\r\n }\r\n});\r\n\r\n// 选择栏目\r\nconst selectPartHandle = async (item: any) => {\r\n\r\n if (curSelectPartItem.value != item) {\r\n\r\n curSelectPartItem.value = item;\r\n\r\n if (!curSelectPartItem.value.contentTemplate) {\r\n activeTabName.value = \"part\";\r\n }\r\n else{\r\n activeTabName.value = \"article-list\";\r\n }\r\n router.replace({ name: 'cms/contents', query: { pid: curSelectPartItem.value.id } } as any)\r\n partExList.value = usePartExtensionList(curSelectPartItem.value.id).concat(usePartExtensionList(curSelectPartItem.value.name));\r\n }\r\n};\r\n\r\n//删除栏目\r\nconst deletePartHandle = (item: any) => {\r\n if (item.id == curSelectPartItem.value.id) {\r\n curSelectPartItem.value = null;\r\n }\r\n};\r\n\r\n//编辑栏目\r\nconst editPartHandle = (item: any) => {\r\n curSelectPartItem.value = item;\r\n activeTabName.value = \"part\";\r\n};\r\n\r\n/*\r\n 显示添加栏目表单\r\n /\r\nconst showPartFormHandle = async (item?: any) => {\r\n await Dialoger.dataFormDialog({\r\n dataForm: partMiniForm as CmsContentManPartForm,\r\n });\r\n\r\n if (item.id) {\r\n partMiniForm.addRecord({ parentId: item.id });\r\n }\r\n\r\n};\r\n\r\nwatch(showPublish, async (v) => {\r\n if(v){\r\n optionData.value.isPublishList = !!curSelectPartItem.value.listTemplate\r\n optionData.value.isPublishCover = !!curSelectPartItem.value.coverTemplate\r\n optionData.value.isPublishContent = !!curSelectPartItem.value.contentTemplate\r\n }\r\n})\r\n \r\n//监听表单完成事件\r\npartMiniForm.submittedEvent.on(({ response }:any) => {\r\n if(response.data.data){\r\n // 重置选中\r\n curSelectPartId.value = response.data.data;\r\n // 刷新完成直接选中\r\n (partTreeRef.value! as any).dataTree?.load();\r\n }\r\n \r\n});\r\n\r\n//栏目发布\r\nconst publishAllPartHandle = async () => {\r\n\r\n try {\r\n\r\n loading.value = true;\r\n \r\n await CmsPartForm.publishAll()\r\n } \r\n finally {\r\n loading.value = false;\r\n }\r\n\r\n}\r\nconst publishPartHandle = async () => {\r\n \r\n try {\r\n\r\n publishLoading.value = true\r\n\r\n await CmsPartForm.publish(curSelectPartItem.value.id,optionData.value);\r\n\r\n showPublish.value = false;\r\n\r\n } finally {\r\n publishLoading.value = false\r\n }\r\n}\r\n\r\n/\r\n 保存栏目信息\r\n /\r\nconst savePartHandle = async () => {\r\n curSelectPartItem.value = partDataForm.data;\r\n await partDataForm.submit();\r\n}\r\n\r\n/\r\n 更新编辑器内容\r\n * @param v 内容\r\n */\r\nconst EditorChangeHandle = (v: any) => {\r\n partDataForm.data.content = v\r\n}\r\n</script>\r\n"],"names":[],"mappings":"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"}

package/dist/style/components/basic/doc-editor/index.css CHANGED Viewed

	@@ -1 +1 @@
1	- .mk-doc-editor-decorator-module-toolbar,.mk-doc-editor-toolbar{background-color:#fff;padding:10px 20px;z-index:1;text-align:center}.mk-doc-editor-decorator-module-toolbar-content-style-item,.mk-doc-editor-toolbar-content-style-item{font-size:14px;text-align:left;margin:5px}.mk-doc-editor-decorator-module-toolbar-content-style-item.text,.mk-doc-editor-toolbar-content-style-item.text{font-size:20px}.mk-doc-editor-decorator-module-toolbar-content-style-item h1,.mk-doc-editor-decorator-module-toolbar-content-style-item h2,.mk-doc-editor-decorator-module-toolbar-content-style-item h3,.mk-doc-editor-decorator-module-toolbar-content-style-item h4,.mk-doc-editor-decorator-module-toolbar-content-style-item h5,.mk-doc-editor-decorator-module-toolbar-content-style-item h6,.mk-doc-editor-toolbar-content-style-item h1,.mk-doc-editor-toolbar-content-style-item h2,.mk-doc-editor-toolbar-content-style-item h3,.mk-doc-editor-toolbar-content-style-item h4,.mk-doc-editor-toolbar-content-style-item h5,.mk-doc-editor-toolbar-content-style-item h6{padding:0;margin:0;font-weight:400}.mk-doc-editor-decorator-module-toolbar__fontcolor,.mk-doc-editor-toolbar__fontcolor{padding:0;margin-left:0!important}.mk-doc-editor-decorator-module-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger,.mk-doc-editor-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger{border:none;position:relative}.mk-doc-editor-decorator-module-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color,.mk-doc-editor-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color{border:0;position:relative}.mk-doc-editor-decorator-module-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner,.mk-doc-editor-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner{position:absolute;height:4px;bottom:0;left:0}.mk-doc-editor-decorator-module-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner .el-icon,.mk-doc-editor-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner .el-icon{display:none}.mk-doc-editor-decorator-module-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger::before,.mk-doc-editor-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger::before{content:"A";font-weight:700;font-size:18px;position:absolute;width:100%;z-index:1}.mk-doc-editor-decorator-module-toolbar__bgcolor,.mk-doc-editor-toolbar__bgcolor{padding:0;margin-left:0!important;position:relative}.mk-doc-editor-decorator-module-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger,.mk-doc-editor-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger{border:none;position:relative}.mk-doc-editor-decorator-module-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color,.mk-doc-editor-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color{border:0;position:relative}.mk-doc-editor-decorator-module-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner,.mk-doc-editor-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner{position:absolute;height:4px;bottom:0;left:0}.mk-doc-editor-decorator-module-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner .el-icon,.mk-doc-editor-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner .el-icon{display:none}.mk-doc-editor-decorator-module-toolbar__bgcolor>span,.mk-doc-editor-toolbar__bgcolor>span{justify-content:center}.mk-doc-editor-decorator-module-toolbar__bgcolor>span>.view,.mk-doc-editor-toolbar__bgcolor>span>.view{position:absolute;pointer-events:none;font-size:18px;top:5px}.mk-doc-editor-decorator-module-toolbar>.el-dropdown .el-button,.mk-doc-editor-toolbar>.el-dropdown .el-button{padding:8px}.mk-doc-editor-decorator-module-toolbar>.el-button-group button,.mk-doc-editor-toolbar>.el-button-group button{font-size:18px;padding:8px}.mk-doc-editor-decorator-module-toolbar>.el-button-group .el-button.is-text:not(.is-disabled).active,.mk-doc-editor-toolbar>.el-button-group .el-button.is-text:not(.is-disabled).active{background-color:var(--el-fill-color)}.mk-doc-editor{width:100%;height:100%;overflow:hidden;display:flex;flex-direction:column}.mk-doc-editor.mobile .mk-doc-editor__stage_body{max-width:640px}.mk-doc-editor__stage_iframe,.mk-doc-editor__stage_warp,.mk-doc-editor__view_iframe,.mk-doc-editor__view_warp{width:100%;height:100%;z-index:0;position:relative}.mk-doc-editor__stage_body{z-index:0;position:relative;max-width:1200px;width:100%;min-height:100%;margin:auto}.mk-doc-editor__stage_warp{display:flex;flex-direction:column;padding:10px;overflow:auto;box-sizing:border-box}.mk-doc-editor__stage_warp .mk-doc-editor-decorator-module-toolbar{position:absolute;background-color:#fff;box-shadow:1px -3px 7px 4px #ccc;padding:5px}.mk-doc-editor__stage_warp .mk-doc-editor-decorator-module-toolbar>.el-dropdown .el-button{padding:8px 12px}.mk-doc-editor__stage_warp .mk-doc-editor-decorator-module-toolbar>.el-button-group button{padding:8px 12px}.mk-doc-editor__stage_iframe,.mk-doc-editor__view_iframe{overflow:hidden;background-color:#fff;margin:0;border:0}.mk-doc-editor__view_warp{display:flex;background-color:var(--mk-container-border-color);overflow:auto;height:calc(100vh - 50px);padding-top:10px}.mk-doc-editor__view_warp.mobile .mk-doc-editor__view_iframe{max-width:640px}.mk-doc-editor__view_iframe{max-width:1200px;margin:auto;padding:20px;overflow:auto}.mk-doc-editor__module-template_dialog_warp{height:600px;display:flex;flex-direction:column}.mk-doc-editor__module-template_dialog_list-body{flex:1;height:100%;overflow:auto;padding-top:10px;box-sizing:border-box;display:flex;flex-wrap:wrap;gap:10px}.mk-doc-editor__module-template_dialog_list-item{width:150px;height:150px;display:flex;background-color:#dedede;align-items:center;justify-content:center;cursor:pointer;box-sizing:border-box;position:relative;border:2px solid #dedede}.mk-doc-editor__module-template_dialog_list-item.active{border-color:#2196f3}.mk-doc-editor__module-template_dialog_list-item_title{text-align:center}.mk-doc-editor__module-template_dialog_list-item.cover img{-o-object-fit:contain;object-fit:contain;padding:10px;width:100%;height:100%;box-sizing:border-box}.mk-doc-editor__module-template_dialog_list-item.cover>.mk-doc-editor__module-template_dialog_list-item_title{width:100%;height:100%;display:none;background-color:rgba(13,13,13,.7019607843);align-items:center;justify-content:center;color:#fff;position:absolute;top:0;left:0}.mk-doc-editor__module-template_dialog_list-item.cover:hover>.mk-doc-editor__module-template_dialog_list-item_title{display:flex}
1	+ .mk-doc-editor-decorator-module-toolbar,.mk-doc-editor-toolbar{background-color:#fff;padding:10px 20px;z-index:1;text-align:center}.mk-doc-editor-decorator-module-toolbar-content-style-item,.mk-doc-editor-toolbar-content-style-item{font-size:14px;text-align:left;margin:5px}.mk-doc-editor-decorator-module-toolbar-content-style-item.text,.mk-doc-editor-toolbar-content-style-item.text{font-size:20px}.mk-doc-editor-decorator-module-toolbar-content-style-item h1,.mk-doc-editor-decorator-module-toolbar-content-style-item h2,.mk-doc-editor-decorator-module-toolbar-content-style-item h3,.mk-doc-editor-decorator-module-toolbar-content-style-item h4,.mk-doc-editor-decorator-module-toolbar-content-style-item h5,.mk-doc-editor-decorator-module-toolbar-content-style-item h6,.mk-doc-editor-toolbar-content-style-item h1,.mk-doc-editor-toolbar-content-style-item h2,.mk-doc-editor-toolbar-content-style-item h3,.mk-doc-editor-toolbar-content-style-item h4,.mk-doc-editor-toolbar-content-style-item h5,.mk-doc-editor-toolbar-content-style-item h6{padding:0;margin:0;font-weight:400}.mk-doc-editor-decorator-module-toolbar__fontcolor,.mk-doc-editor-toolbar__fontcolor{padding:0;margin-left:0!important}.mk-doc-editor-decorator-module-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger,.mk-doc-editor-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger{border:none;position:relative}.mk-doc-editor-decorator-module-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color,.mk-doc-editor-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color{border:0;position:relative}.mk-doc-editor-decorator-module-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner,.mk-doc-editor-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner{position:absolute;height:4px;bottom:0;left:0}.mk-doc-editor-decorator-module-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner .el-icon,.mk-doc-editor-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner .el-icon{display:none}.mk-doc-editor-decorator-module-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger::before,.mk-doc-editor-toolbar__fontcolor .el-color-picker>.el-color-picker__trigger::before{content:"A";font-weight:700;font-size:18px;position:absolute;width:100%;z-index:1}.mk-doc-editor-decorator-module-toolbar__bgcolor,.mk-doc-editor-toolbar__bgcolor{padding:0;margin-left:0!important;position:relative}.mk-doc-editor-decorator-module-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger,.mk-doc-editor-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger{border:none;position:relative}.mk-doc-editor-decorator-module-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color,.mk-doc-editor-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color{border:0;position:relative}.mk-doc-editor-decorator-module-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner,.mk-doc-editor-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner{position:absolute;height:4px;bottom:0;left:0}.mk-doc-editor-decorator-module-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner .el-icon,.mk-doc-editor-toolbar__bgcolor .el-color-picker>.el-color-picker__trigger>.el-color-picker__color .el-color-picker__color-inner .el-icon{display:none}.mk-doc-editor-decorator-module-toolbar__bgcolor>span,.mk-doc-editor-toolbar__bgcolor>span{justify-content:center}.mk-doc-editor-decorator-module-toolbar__bgcolor>span>.view,.mk-doc-editor-toolbar__bgcolor>span>.view{position:absolute;pointer-events:none;font-size:18px;top:5px}.mk-doc-editor-decorator-module-toolbar>.el-dropdown .el-button,.mk-doc-editor-toolbar>.el-dropdown .el-button{padding:8px}.mk-doc-editor-decorator-module-toolbar>.el-button-group button,.mk-doc-editor-toolbar>.el-button-group button{font-size:18px;padding:8px}.mk-doc-editor-decorator-module-toolbar>.el-button-group .el-button.is-text:not(.is-disabled).active,.mk-doc-editor-toolbar>.el-button-group .el-button.is-text:not(.is-disabled).active{background-color:var(--el-fill-color)}.mk-doc-editor{width:100%;height:100%;overflow:hidden;display:flex;flex-direction:column}.mk-doc-editor.mobile .mk-doc-editor__stage_body{max-width:640px}.mk-doc-editor__stage_iframe,.mk-doc-editor__stage_warp,.mk-doc-editor__view_iframe,.mk-doc-editor__view_warp{width:100%;height:100%;z-index:0;position:relative}.mk-doc-editor__stage_body{z-index:0;position:relative;max-width:1200px;width:100%;min-height:100%;margin:auto}.mk-doc-editor__stage_warp{display:flex;flex-direction:column;padding:10px;overflow:auto;box-sizing:border-box}.mk-doc-editor__stage_warp .mk-doc-editor-decorator-module-toolbar{position:absolute;background-color:#fff;box-shadow:1px -3px 7px 4px #ccc;padding:5px}.mk-doc-editor__stage_warp .mk-doc-editor-decorator-module-toolbar>.el-dropdown .el-button{padding:8px 12px}.mk-doc-editor__stage_warp .mk-doc-editor-decorator-module-toolbar>.el-button-group button{padding:8px 12px}.mk-doc-editor__stage_iframe,.mk-doc-editor__view_iframe{overflow:hidden;background-color:#fff;margin:0;border:0}.mk-doc-editor__view_warp{display:flex;background-color:var(--mk-container-border-color);overflow:auto;height:calc(100vh - 50px);padding-top:10px}.mk-doc-editor__view_warp.mobile .mk-doc-editor__view_iframe{max-width:640px}.mk-doc-editor__view_iframe{max-width:1200px;margin:auto;padding:20px;overflow:auto}.mk-doc-editor__module-template_dialog_warp{height:600px;display:flex;flex-direction:column}.mk-doc-editor__module-template_dialog_list-body{flex:1;height:100%;overflow:auto;padding-top:10px;box-sizing:border-box;display:flex;flex-wrap:wrap;align-content:flex-start;gap:10px}.mk-doc-editor__module-template_dialog_list-item{width:150px;height:150px;display:flex;background-color:#dedede;align-items:center;justify-content:center;cursor:pointer;box-sizing:border-box;position:relative;border:2px solid #dedede}.mk-doc-editor__module-template_dialog_list-item.active{border-color:#2196f3}.mk-doc-editor__module-template_dialog_list-item_title{text-align:center}.mk-doc-editor__module-template_dialog_list-item.cover img{-o-object-fit:contain;object-fit:contain;padding:10px;width:100%;height:100%;box-sizing:border-box}.mk-doc-editor__module-template_dialog_list-item.cover>.mk-doc-editor__module-template_dialog_list-item_title{width:100%;height:100%;display:none;background-color:rgba(13,13,13,.7019607843);align-items:center;justify-content:center;color:#fff;position:absolute;top:0;left:0}.mk-doc-editor__module-template_dialog_list-item.cover:hover>.mk-doc-editor__module-template_dialog_list-item_title{display:flex}