npm - @maketribe/ms-app - Versions diffs - 3.2.24 → 3.2.25 - Mend

@maketribe/ms-app 3.2.24 → 3.2.25

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 (343) hide show

package/dist/esm/components/basic/doc-editor/plugins/ImagePlugin/utils.js CHANGED Viewed

@@ -42,42 +42,69 @@ const ImageEditPanelComponent = /* @__PURE__ */ defineComponent({
   }) {
     const attrs = reactive(props.attrs);
     const materialTable = reactive(new MsMaterialTable());
-    const margin = computed({
-      set(v) {
-        attrs.margin = `${v.t} ${v.r} ${v.b} ${v.l}`;
-      },
-      get() {
-        var vals = attrs.margin.split(/[\s]+/g);
-        if (vals.length == 1) {
-          return {
-            t: vals[0],
-            r: vals[0],
-            b: vals[0],
-            l: vals[0]
-          };
-        } else if (vals.length == 2) {
-          return {
-            t: vals[0],
-            r: vals[1],
-            b: vals[0],
-            l: vals[1]
-          };
-        } else if (vals.length == 3) {
-          return {
-            t: vals[0],
-            r: vals[1],
-            b: vals[2],
-            l: vals[1]
-          };
-        } else if (vals.length <= 0) {
-          vals = ["", "", "", ""];
-        }
+    const margin = computed(() => {
+      var vals = attrs.margin.split(/[\s]+/g);
+      if (vals.length == 1) {
+        return {
+          t: vals[0],
+          r: vals[0],
+          b: vals[0],
+          l: vals[0]
+        };
+      } else if (vals.length == 2) {
+        return {
+          t: vals[0],
+          r: vals[1],
+          b: vals[0],
+          l: vals[1]
+        };
+      } else if (vals.length == 3) {
         return {
           t: vals[0],
           r: vals[1],
           b: vals[2],
-          l: vals[3]
+          l: vals[1]
         };
+      } else if (vals.length <= 0) {
+        vals = ["", "", "", ""];
+      }
+      return {
+        t: vals[0],
+        r: vals[1],
+        b: vals[2],
+        l: vals[3]
+      };
+    });
+    const marginT = computed({
+      set(v) {
+        attrs.margin = `${v} ${margin.value.r} ${margin.value.b} ${margin.value.l}`;
+      },
+      get() {
+        return margin.value.t;
+      }
+    });
+    const marginR = computed({
+      set(v) {
+        attrs.margin = `${margin.value.t} ${v} ${margin.value.b} ${margin.value.l}`;
+      },
+      get() {
+        return margin.value.r;
+      }
+    });
+    const marginB = computed({
+      set(v) {
+        attrs.margin = `${margin.value.t} ${margin.value.r} ${v} ${margin.value.l}`;
+      },
+      get() {
+        return margin.value.b;
+      }
+    });
+    const marginL = computed({
+      set(v) {
+        attrs.margin = `${margin.value.t} ${margin.value.r}  ${margin.value.b} ${v}`;
+      },
+      get() {
+        return margin.value.l;
       }
     });
     materialTable.selectionChangeEvent.on(() => {
@@ -230,20 +257,20 @@ const ImageEditPanelComponent = /* @__PURE__ */ defineComponent({
                 default: () => [createVNode("div", {
                   "style": "display: flex;flex-wrap: nowrap;gap: 10px;justify-content: space-around;"
                 }, [createVNode("div", null, [createTextVNode("上:"), createVNode(ElInput, {
-                  "modelValue": margin.value.t,
-                  "onUpdate:modelValue": ($event) => margin.value.t = $event,
+                  "modelValue": marginT.value,
+                  "onUpdate:modelValue": ($event) => marginT.value = $event,
                   "placeholder": ""
                 }, null)]), createVNode("div", null, [createTextVNode("右:"), createVNode(ElInput, {
-                  "modelValue": margin.value.r,
-                  "onUpdate:modelValue": ($event) => margin.value.r = $event,
+                  "modelValue": marginR.value,
+                  "onUpdate:modelValue": ($event) => marginR.value = $event,
                   "placeholder": ""
                 }, null)]), createVNode("div", null, [createTextVNode("下:"), createVNode(ElInput, {
-                  "modelValue": margin.value.b,
-                  "onUpdate:modelValue": ($event) => margin.value.b = $event,
+                  "modelValue": marginB.value,
+                  "onUpdate:modelValue": ($event) => marginB.value = $event,
                   "placeholder": ""
                 }, null)]), createVNode("div", null, [createTextVNode("左:"), createVNode(ElInput, {
-                  "modelValue": margin.value.l,
-                  "onUpdate:modelValue": ($event) => margin.value.l = $event,
+                  "modelValue": marginL.value,
+                  "onUpdate:modelValue": ($event) => marginL.value = $event,
                   "placeholder": ""
                 }, null)])])]
               })]

package/dist/esm/components/basic/doc-editor/plugins/ImagePlugin/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/utils.tsx"],"sourcesContent":["\r\nimport { Fragment,h,onMounted, onUnmounted,ref,reactive,defineComponent, computed } from 'vue'\r\nimport { Dialoger } from '@maketribe/dm'\r\nimport { \r\n ElButton,ElTabs,ElTabPane,ElInput,ElImage,ElIcon,\r\n ElForm,ElFormItem,ElRow,ElCol\r\n} from \"element-plus\";\r\nimport { Crop,Share,UploadFilled,Picture } from \"@element-plus/icons-vue\";\r\nimport { MsMaterialTable } from \"../../../../../modules/ms/dataviews/ms-material\";\r\nimport { MKMaterialList } from \"../../../../../modules/ms/components/material-list\";\r\nimport { fileSelect } from \"@maketribe/utils\"\r\nimport { ImageCropper } from \"../../../image-cropper\"\r\nimport { WebFileUpload } from \"@maketribe/request\";\r\nimport { base64ToBlob,md5 } from \"@maketribe/utils\";\r\nimport { Messager } from \"@maketribe/dm\";\r\n\r\n// 选择状态\r\nconst selectState = ref(\"select\");\r\n\r\n/*\r\n 图片加载\r\n * @param src \r\n * @returns \r\n /\r\nexport const imageLoad = (src:string)=>{\r\n // 加载文案\r\n return new Promise((resolve,reject)=>{\r\n // 加载一下\r\n const image = new Image();\r\n const loadComplete = ()=>{\r\n resolve(image.src);\r\n }\r\n image.onload = ()=>loadComplete()\r\n image.onerror = reject\r\n image.src = src;\r\n if(image.complete){\r\n loadComplete();\r\n }\r\n })\r\n}\r\n\r\n/\r\n 图片上传\r\n * @param src \r\n /\r\nexport const imageUpload = (src:string)=>{\r\n\r\n // 上传\r\n const webFileUpload = new WebFileUpload();\r\n return new Promise((resolve,reject)=>{\r\n\r\n if(src && src.indexOf(\"data:image/\") == 0){\r\n\r\n // 开始上传\r\n const blob = base64ToBlob(src); \r\n \r\n // 上传\r\n webFileUpload.upload(\r\n new File([blob], `${md5(Math.random().toString())}.${blob.type.toString().replace(\"image/\",\"\") \|\| \"png\"}`, { type: blob.type })\r\n ).then(result=>{\r\n \r\n if (result.data.code !== 200) {\r\n Messager.error({ message: result.data.msg });\r\n reject(new Error(result.data.msg ));\r\n }\r\n else{\r\n resolve(result.data.data.path);\r\n }\r\n \r\n });\r\n }\r\n else{\r\n resolve(src);\r\n }\r\n })\r\n\r\n \r\n}\r\n\r\n\r\n/\r\n 图片编辑面板\r\n /\r\nconst ImageEditPanelComponent = defineComponent({\r\n name: 'ImageEditPanelComponent',\r\n props: ['attrs'],\r\n setup(props,{ expose }){\r\n\r\n const attrs = reactive(props.attrs)\r\n const materialTable = reactive(new MsMaterialTable()) as MsMaterialTable;\r\n const margin = computed<any>({\r\n set(v){\r\n attrs.margin = `${v.t} ${v.r} ${v.b} ${v.l}`\r\n },\r\n get(){\r\n var vals = attrs.margin.split(/[\\s]+/g);\r\n if(vals.length == 1){\r\n return {t:vals[0],r:vals[0],b:vals[0],l:vals[0]}\r\n }\r\n else if(vals.length == 2){\r\n return {t:vals[0],r:vals[1],b:vals[0],l:vals[1]}\r\n }\r\n else if(vals.length == 3){\r\n return {t:vals[0],r:vals[1],b:vals[2],l:vals[1]}\r\n }\r\n else if(vals.length <= 0){\r\n vals = [\"\",\"\",\"\",\"\"];\r\n }\r\n return {t:vals[0],r:vals[1],b:vals[2],l:vals[3]}\r\n }\r\n })\r\n\r\n // 选择素材\r\n materialTable.selectionChangeEvent.on(()=>{\r\n let id = materialTable.getSelection()[0];\r\n if(id){\r\n attrs.src = materialTable.getList().find(item=>item.id == id)?.path;\r\n }\r\n else{\r\n attrs.src = \"\";\r\n }\r\n })\r\n\r\n //\r\n const selectImage = async ()=>{\r\n\r\n const file = await fileSelect({ accept:\"image/\"});\r\n \r\n if (file) {\r\n\r\n const fileRender = new FileReader();\r\n fileRender.onload = async (data:any)=>{\r\n attrs.src = data.target.result;\r\n \r\n }\r\n fileRender.readAsDataURL(file)\r\n }\r\n }\r\n\r\n // 导出可用的方法\r\n expose({ \r\n getResult:()=>{ return {...attrs} } ,\r\n setSrc:(src:string)=>{ attrs.src = src }\r\n });\r\n\r\n return ()=>{\r\n\r\n // 图片预览\r\n const ImageView = <ElImage style=\"background: #dedede;width: 100%; height: 480px;margin-top:10px\" src={attrs.src} fit=\"contain\" v-slots={{\r\n error:()=>{\r\n return <div style=\"\r\n font-size: 50px;\r\n display: flex;\r\n align-content: center;\r\n justify-content: center;\r\n align-items: center;\r\n height: 100%;\r\n \">\r\n <ElIcon><Picture /></ElIcon>\r\n </div>\r\n }\r\n }}>\r\n </ElImage>\r\n \r\n // 面板内容\r\n let panel = <ElTabs style=\"min-height: 520px\">\r\n <ElTabPane label=\"本地选择\">\r\n <ElButton icon={UploadFilled} type=\"primary\" style=\"width: 100%\" onClick={selectImage}>\r\n 选择本地文件\r\n </ElButton>\r\n {ImageView}\r\n </ElTabPane>\r\n <ElTabPane label=\"素材库选择\">\r\n <MKMaterialList class=\"mk-material-select__list\" selectable allowMaterialTypeValues={[1]} materialTable={materialTable} />\r\n </ElTabPane>\r\n <ElTabPane label=\"网络图片\">\r\n <ElInput v-model={attrs.src} prefix-icon={Share} style=\"width: 100%\" placeholder=\"请输入链接地址\">\r\n </ElInput>\r\n {ImageView}\r\n </ElTabPane>\r\n </ElTabs>\r\n\r\n if(selectState.value == \"attrs\"){\r\n panel = <ElRow gutter={20}>\r\n <ElCol span={14}>\r\n {ImageView}\r\n </ElCol>\r\n <ElCol span={10}>\r\n <ElForm label-position=\"top\" model={attrs}>\r\n <ElFormItem label=\"图片描述\">\r\n <ElInput v-model={attrs.alt} type=\"textarea\" {...{ rows:3 }} style=\"width: 100%\" placeholder=\"请输入\">\r\n </ElInput>\r\n </ElFormItem>\r\n <ElFormItem label=\"图片显示宽度\">\r\n <ElInput v-model={attrs.width} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n </ElInput>\r\n </ElFormItem>\r\n <ElFormItem label=\"图片显示高度\">\r\n <ElInput v-model={attrs.height} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n </ElInput>\r\n </ElFormItem>\r\n <ElFormItem label=\"图片最大显示宽度\">\r\n <ElInput v-model={attrs.maxWidth} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n </ElInput>\r\n </ElFormItem>\r\n <ElFormItem label=\"图片最大显示高度\">\r\n <ElInput v-model={attrs.maxHeight} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n </ElInput>\r\n </ElFormItem>\r\n <ElFormItem label=\"图片显示外边距\">\r\n <div style=\"display: flex;flex-wrap: nowrap;gap: 10px;justify-content: space-around;\">\r\n <div>\r\n 上:\r\n <ElInput v-model={margin.value.t} placeholder=\"\">\r\n </ElInput>\r\n </div>\r\n <div>\r\n 右:\r\n <ElInput v-model={margin.value.r} placeholder=\"\">\r\n </ElInput>\r\n </div>\r\n \r\n <div>\r\n 下:\r\n <ElInput v-model={margin.value.b} placeholder=\"\">\r\n </ElInput>\r\n </div>\r\n \r\n <div>\r\n 左:\r\n <ElInput v-model={margin.value.l} placeholder=\"\">\r\n </ElInput>\r\n </div>\r\n </div>\r\n </ElFormItem>\r\n </ElForm>\r\n </ElCol>\r\n </ElRow>\r\n }\r\n\r\n return panel;\r\n }\r\n }\r\n})\r\n\r\n/*\r\n \r\n * @param attrs 显示图片编辑面板\r\n * @returns \r\n */\r\nexport const showImageEditDialog = async (attrs:any) => {\r\n return new Promise((resolve,reject) => {\r\n\r\n // 初始化\r\n selectState.value = attrs.src ? \"attrs\":\"select\";\r\n\r\n const imageEditPanelRef = ref<any>(null);\r\n const editResult = computed<any>(()=>imageEditPanelRef.value?.getResult())\r\n\r\n // 去裁切\r\n const toCropImageHandle = async ()=>{\r\n \r\n if(editResult.value.src){\r\n var result = await ImageCropper({ src: editResult.value.src});\r\n if(result.data){\r\n imageEditPanelRef.value?.setSrc(result.data);\r\n }\r\n }\r\n \r\n }\r\n\r\n // 取消编辑\r\n const handleCancelClick = () => {\r\n dialogInstance.destroy();\r\n };\r\n\r\n // 确认编辑\r\n const handleConfirmClick = () => {\r\n dialogInstance.destroy();\r\n resolve({...editResult.value});\r\n };\r\n\r\n const dialogInstance = Dialoger.customRender({\r\n title: \"素材选择\",\r\n class: \"mk-material-select\",\r\n width: \"70%\",\r\n onClose: () => {\r\n dialogInstance.destroy();\r\n },\r\n body: () => {\r\n return h(ImageEditPanelComponent,{attrs,ref:r=>imageEditPanelRef.value = r});\r\n },\r\n footer: () => {\r\n\r\n // 下一步按钮\r\n let nextBtns = [\r\n <ElButton type=\"primary\" onClick={()=>selectState.value = 'attrs'}>\r\n 下一步\r\n </ElButton>\r\n ]\r\n\r\n if(selectState.value == \"attrs\"){\r\n nextBtns = [\r\n <ElButton type=\"primary\" onClick={()=>selectState.value='select'}>\r\n 重新选图\r\n </ElButton>,\r\n <ElButton type=\"primary\" onClick={toCropImageHandle}>\r\n 裁切图\r\n </ElButton>,\r\n <ElButton type=\"primary\" onClick={handleConfirmClick}>\r\n 确定\r\n </ElButton>\r\n ];\r\n }\r\n\r\n return (\r\n <Fragment>\r\n <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n {...nextBtns}\r\n </Fragment>\r\n );\r\n },\r\n });\r\n });\r\n}\r\n"],"names":["_isSlot","s","Object","prototype","toString","call","_isVNode","selectState","ref","imageUpload","src","webFileUpload","WebFileUpload","Promise","resolve","reject","indexOf","blob","base64ToBlob","upload","File","md5","Math","random","type","replace","then","result","data","code","Messager","error","message","msg","Error","path","ImageEditPanelComponent","defineComponent","name","props","setup","expose","attrs","reactive","materialTable","MsMaterialTable","margin","computed","set","v","t","r","b","l","get","vals","split","length","selectionChangeEvent","on","id","getSelection","getList","find","item","selectImage","file","fileSelect","accept","fileRender","FileReader","onload","target","readAsDataURL","getResult","setSrc","ImageView","_createVNode","ElImage","ElIcon","default","Picture","panel","ElTabs","ElTabPane","ElButton","UploadFilled","_createTextVNode","MKMaterialList","ElInput","$event","Share","value","ElRow","ElCol","ElForm","ElFormItem","_mergeProps","alt","rows","width","height","maxWidth","maxHeight","showImageEditDialog","imageEditPanelRef","editResult","toCropImageHandle","ImageCropper","handleCancelClick","dialogInstance","destroy","handleConfirmClick","Dialoger","customRender","title","class","onClose","body","h","footer","nextBtns","onClick","_Fragment"],"mappings":"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"}
1	+ {"version":3,"file":"utils.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/utils.tsx"],"sourcesContent":["\r\nimport { Fragment,h,unref, onUnmounted,ref,reactive,defineComponent, computed } from 'vue'\r\nimport { Dialoger } from '@maketribe/dm'\r\nimport { \r\n ElButton,ElTabs,ElTabPane,ElInput,ElImage,ElIcon,\r\n ElForm,ElFormItem,ElRow,ElCol\r\n} from \"element-plus\";\r\nimport { Crop,Share,UploadFilled,Picture } from \"@element-plus/icons-vue\";\r\nimport { MsMaterialTable } from \"../../../../../modules/ms/dataviews/ms-material\";\r\nimport { MKMaterialList } from \"../../../../../modules/ms/components/material-list\";\r\nimport { fileSelect } from \"@maketribe/utils\"\r\nimport { ImageCropper } from \"../../../image-cropper\"\r\nimport { WebFileUpload } from \"@maketribe/request\";\r\nimport { base64ToBlob,md5 } from \"@maketribe/utils\";\r\nimport { Messager } from \"@maketribe/dm\";\r\n\r\n// 选择状态\r\nconst selectState = ref(\"select\");\r\n\r\n/*\r\n 图片加载\r\n * @param src \r\n * @returns \r\n /\r\nexport const imageLoad = (src:string)=>{\r\n // 加载文案\r\n return new Promise((resolve,reject)=>{\r\n // 加载一下\r\n const image = new Image();\r\n const loadComplete = ()=>{\r\n resolve(image.src);\r\n }\r\n image.onload = ()=>loadComplete()\r\n image.onerror = reject\r\n image.src = src;\r\n if(image.complete){\r\n loadComplete();\r\n }\r\n })\r\n}\r\n\r\n/\r\n 图片上传\r\n * @param src \r\n /\r\nexport const imageUpload = (src:string)=>{\r\n\r\n // 上传\r\n const webFileUpload = new WebFileUpload();\r\n return new Promise((resolve,reject)=>{\r\n\r\n if(src && src.indexOf(\"data:image/\") == 0){\r\n\r\n // 开始上传\r\n const blob = base64ToBlob(src); \r\n \r\n // 上传\r\n webFileUpload.upload(\r\n new File([blob], `${md5(Math.random().toString())}.${blob.type.toString().replace(\"image/\",\"\") \|\| \"png\"}`, { type: blob.type })\r\n ).then(result=>{\r\n \r\n if (result.data.code !== 200) {\r\n Messager.error({ message: result.data.msg });\r\n reject(new Error(result.data.msg ));\r\n }\r\n else{\r\n resolve(result.data.data.path);\r\n }\r\n \r\n });\r\n }\r\n else{\r\n resolve(src);\r\n }\r\n })\r\n\r\n \r\n}\r\n\r\n\r\n/\r\n 图片编辑面板\r\n /\r\nconst ImageEditPanelComponent = defineComponent({\r\n name: 'ImageEditPanelComponent',\r\n props: ['attrs'],\r\n setup(props,{ expose }){\r\n\r\n const attrs = reactive(props.attrs)\r\n const materialTable = reactive(new MsMaterialTable()) as MsMaterialTable;\r\n const margin = computed<any>(()=>{\r\n var vals = attrs.margin.split(/[\\s]+/g);\r\n \r\n if(vals.length == 1){\r\n return {t:vals[0],r:vals[0],b:vals[0],l:vals[0]}\r\n }\r\n else if(vals.length == 2){\r\n return {t:vals[0],r:vals[1],b:vals[0],l:vals[1]}\r\n }\r\n else if(vals.length == 3){\r\n return {t:vals[0],r:vals[1],b:vals[2],l:vals[1]}\r\n }\r\n else if(vals.length <= 0){\r\n vals = [\"\",\"\",\"\",\"\"];\r\n }\r\n return {t:vals[0],r:vals[1],b:vals[2],l:vals[3]}\r\n })\r\n const marginT = computed<any>({\r\n set(v){\r\n attrs.margin = `${v} ${margin.value.r} ${margin.value.b} ${margin.value.l}`\r\n },\r\n get(){\r\n return margin.value.t\r\n }\r\n })\r\n const marginR = computed<any>({\r\n set(v){\r\n attrs.margin = `${margin.value.t} ${v} ${margin.value.b} ${margin.value.l}`\r\n },\r\n get(){\r\n return margin.value.r\r\n }\r\n })\r\n const marginB = computed<any>({\r\n set(v){\r\n attrs.margin = `${margin.value.t} ${margin.value.r} ${v} ${margin.value.l}`\r\n },\r\n get(){\r\n return margin.value.b\r\n }\r\n })\r\n const marginL = computed<any>({\r\n set(v){\r\n attrs.margin = `${margin.value.t} ${margin.value.r} ${margin.value.b} ${v}`\r\n },\r\n get(){\r\n return margin.value.l\r\n }\r\n })\r\n\r\n // 选择素材\r\n materialTable.selectionChangeEvent.on(()=>{\r\n let id = materialTable.getSelection()[0];\r\n if(id){\r\n attrs.src = materialTable.getList().find(item=>item.id == id)?.path;\r\n }\r\n else{\r\n attrs.src = \"\";\r\n }\r\n })\r\n\r\n //\r\n const selectImage = async ()=>{\r\n\r\n const file = await fileSelect({ accept:\"image/\"});\r\n \r\n if (file) {\r\n\r\n const fileRender = new FileReader();\r\n fileRender.onload = async (data:any)=>{\r\n attrs.src = data.target.result;\r\n \r\n }\r\n fileRender.readAsDataURL(file)\r\n }\r\n }\r\n\r\n // 导出可用的方法\r\n expose({ \r\n getResult:()=>{ return {...attrs} } ,\r\n setSrc:(src:string)=>{ attrs.src = src }\r\n });\r\n\r\n return ()=>{\r\n\r\n // 图片预览\r\n const ImageView = <ElImage style=\"background: #dedede;width: 100%; height: 480px;margin-top:10px\" src={attrs.src} fit=\"contain\" v-slots={{\r\n error:()=>{\r\n return <div style=\"\r\n font-size: 50px;\r\n display: flex;\r\n align-content: center;\r\n justify-content: center;\r\n align-items: center;\r\n height: 100%;\r\n \">\r\n <ElIcon><Picture /></ElIcon>\r\n </div>\r\n }\r\n }}>\r\n </ElImage>\r\n \r\n // 面板内容\r\n let panel = <ElTabs style=\"min-height: 520px\">\r\n <ElTabPane label=\"本地选择\">\r\n <ElButton icon={UploadFilled} type=\"primary\" style=\"width: 100%\" onClick={selectImage}>\r\n 选择本地文件\r\n </ElButton>\r\n {ImageView}\r\n </ElTabPane>\r\n <ElTabPane label=\"素材库选择\">\r\n <MKMaterialList class=\"mk-material-select__list\" selectable allowMaterialTypeValues={[1]} materialTable={materialTable} />\r\n </ElTabPane>\r\n <ElTabPane label=\"网络图片\">\r\n <ElInput v-model={attrs.src} prefix-icon={Share} style=\"width: 100%\" placeholder=\"请输入链接地址\">\r\n </ElInput>\r\n {ImageView}\r\n </ElTabPane>\r\n </ElTabs>\r\n\r\n if(selectState.value == \"attrs\"){\r\n panel = <ElRow gutter={20}>\r\n <ElCol span={14}>\r\n {ImageView}\r\n </ElCol>\r\n <ElCol span={10}>\r\n <ElForm label-position=\"top\" model={attrs}>\r\n <ElFormItem label=\"图片描述\">\r\n <ElInput v-model={attrs.alt} type=\"textarea\" {...{ rows:3 }} style=\"width: 100%\" placeholder=\"请输入\">\r\n </ElInput>\r\n </ElFormItem>\r\n <ElFormItem label=\"图片显示宽度\">\r\n <ElInput v-model={attrs.width} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n </ElInput>\r\n </ElFormItem>\r\n <ElFormItem label=\"图片显示高度\">\r\n <ElInput v-model={attrs.height} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n </ElInput>\r\n </ElFormItem>\r\n <ElFormItem label=\"图片最大显示宽度\">\r\n <ElInput v-model={attrs.maxWidth} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n </ElInput>\r\n </ElFormItem>\r\n <ElFormItem label=\"图片最大显示高度\">\r\n <ElInput v-model={attrs.maxHeight} style=\"width: 100%\" placeholder=\"请输入宽度（可支持%）\">\r\n </ElInput>\r\n </ElFormItem>\r\n <ElFormItem label=\"图片显示外边距\">\r\n <div style=\"display: flex;flex-wrap: nowrap;gap: 10px;justify-content: space-around;\">\r\n <div>\r\n 上:\r\n <ElInput v-model={marginT.value} placeholder=\"\">\r\n </ElInput>\r\n </div>\r\n <div>\r\n 右:\r\n <ElInput v-model={marginR.value} placeholder=\"\">\r\n </ElInput>\r\n </div>\r\n \r\n <div>\r\n 下:\r\n <ElInput v-model={marginB.value} placeholder=\"\">\r\n </ElInput>\r\n </div>\r\n \r\n <div>\r\n 左:\r\n <ElInput v-model={marginL.value} placeholder=\"\">\r\n </ElInput>\r\n </div>\r\n </div>\r\n </ElFormItem>\r\n </ElForm>\r\n </ElCol>\r\n </ElRow>\r\n }\r\n\r\n return panel;\r\n }\r\n }\r\n})\r\n\r\n/*\r\n \r\n * @param attrs 显示图片编辑面板\r\n * @returns \r\n */\r\nexport const showImageEditDialog = async (attrs:any) => {\r\n return new Promise((resolve,reject) => {\r\n\r\n // 初始化\r\n selectState.value = attrs.src ? \"attrs\":\"select\";\r\n\r\n const imageEditPanelRef = ref<any>(null);\r\n const editResult = computed<any>(()=>imageEditPanelRef.value?.getResult())\r\n\r\n // 去裁切\r\n const toCropImageHandle = async ()=>{\r\n \r\n if(editResult.value.src){\r\n var result = await ImageCropper({ src: editResult.value.src});\r\n if(result.data){\r\n imageEditPanelRef.value?.setSrc(result.data);\r\n }\r\n }\r\n \r\n }\r\n\r\n // 取消编辑\r\n const handleCancelClick = () => {\r\n dialogInstance.destroy();\r\n };\r\n\r\n // 确认编辑\r\n const handleConfirmClick = () => {\r\n dialogInstance.destroy();\r\n resolve({...editResult.value});\r\n };\r\n\r\n const dialogInstance = Dialoger.customRender({\r\n title: \"素材选择\",\r\n class: \"mk-material-select\",\r\n width: \"70%\",\r\n onClose: () => {\r\n dialogInstance.destroy();\r\n },\r\n body: () => {\r\n return h(ImageEditPanelComponent,{attrs,ref:r=>imageEditPanelRef.value = r});\r\n },\r\n footer: () => {\r\n\r\n // 下一步按钮\r\n let nextBtns = [\r\n <ElButton type=\"primary\" onClick={()=>selectState.value = 'attrs'}>\r\n 下一步\r\n </ElButton>\r\n ]\r\n\r\n if(selectState.value == \"attrs\"){\r\n nextBtns = [\r\n <ElButton type=\"primary\" onClick={()=>selectState.value='select'}>\r\n 重新选图\r\n </ElButton>,\r\n <ElButton type=\"primary\" onClick={toCropImageHandle}>\r\n 裁切图\r\n </ElButton>,\r\n <ElButton type=\"primary\" onClick={handleConfirmClick}>\r\n 确定\r\n </ElButton>\r\n ];\r\n }\r\n\r\n return (\r\n <Fragment>\r\n <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n {...nextBtns}\r\n </Fragment>\r\n );\r\n },\r\n });\r\n });\r\n}\r\n"],"names":["_isSlot","s","Object","prototype","toString","call","_isVNode","selectState","ref","imageUpload","src","webFileUpload","WebFileUpload","Promise","resolve","reject","indexOf","blob","base64ToBlob","upload","File","md5","Math","random","type","replace","then","result","data","code","Messager","error","message","msg","Error","path","ImageEditPanelComponent","defineComponent","name","props","setup","expose","attrs","reactive","materialTable","MsMaterialTable","margin","computed","vals","split","length","t","r","b","l","marginT","set","v","value","get","marginR","marginB","marginL","selectionChangeEvent","on","id","getSelection","getList","find","item","selectImage","file","fileSelect","accept","fileRender","FileReader","onload","target","readAsDataURL","getResult","setSrc","ImageView","_createVNode","ElImage","ElIcon","default","Picture","panel","ElTabs","ElTabPane","ElButton","UploadFilled","_createTextVNode","MKMaterialList","ElInput","$event","Share","ElRow","ElCol","ElForm","ElFormItem","_mergeProps","alt","rows","width","height","maxWidth","maxHeight","showImageEditDialog","imageEditPanelRef","editResult","toCropImageHandle","ImageCropper","handleCancelClick","dialogInstance","destroy","handleConfirmClick","Dialoger","customRender","title","class","onClose","body","h","footer","nextBtns","onClick","_Fragment"],"mappings":"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"}

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

@@ -2,7 +2,7 @@ import { defineComponent, onMounted } from "vue";
 import { mergeRegister, $insertNodeToNearestRoot } from "@lexical/utils";
 import { COMMAND_PRIORITY_EDITOR } from "lexical";
 import { useLexicalComposer, useMounted } from "lexical-vue";
-import { registerDocEditorToolbarExtend } from "../ToolbarPlugin/defines.js";
+import { registerDocEditorToolbarExtend } from "../../core/index.js";
 import { INSERT_IMAGETEXT_COMMAND, $createImageTextNode, ImageTextNode } from "./ImageTextNode.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImageTextPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { $insertNodeToNearestRoot,mergeRegister } from '@lexical/utils'\r\nimport { COMMAND_PRIORITY_EDITOR,COMMAND_PRIORITY_LOW,$getSelection,CLICK_COMMAND } from 'lexical'\r\nimport { useLexicalComposer,useMounted } from 'lexical-vue'\r\nimport { onMounted, onUnmounted } from 'vue'\r\nimport { registerDocEditorToolbarExtend,type ToolbarExtendPlugin } from \"~~../ToolbarPlugin/defines~~\"\r\nimport { useElementModule } from '../../core'\r\nimport { ImageAttrType } from '../ImagePlugin'\r\nimport { INSERT_IMAGETEXT_COMMAND,ImageTextNode,$createImageTextNode } from './index'\r\n\r\n\r\n// 注册到工具条\r\nregisterDocEditorToolbarExtend({\r\n icon:\"richtext-outline\",\r\n text:\"图文\",\r\n action:async ()=>{ \r\n editor.dispatchCommand(INSERT_IMAGETEXT_COMMAND,{\r\n src:\"\",\r\n float:\"left\",\r\n width:\"200px\",\r\n margin:\"0 10px 10px 0\"\r\n })\r\n },\r\n sort:10\r\n} as ToolbarExtendPlugin)\r\n\r\nconst editor = useLexicalComposer()\r\n\r\n// 使用元素模块集成了模块选中删除以及工具条\r\n// const { isSelected, curSelectKey, curSelectPos,updateActiveViewState } = useElementModule(el=>{\r\n \r\n// var imageTextEl:any = el\r\n\r\n// while (imageTextEl != null && !imageTextEl.classList.contains(\"mk-doc-block-image-text\")) {\r\n// imageTextEl = imageTextEl.parentElement;\r\n// }\r\n\r\n// return imageTextEl\r\n\r\n// },[\r\n// {\r\n// title:\"编辑\",icon:\"Edit\",action:()=>{\r\n// // 编辑的节点\r\n// editor.getEditorState().read(async () => {\r\n \r\n \r\n// })\r\n// } \r\n// }\r\n// ])\r\n\r\n\r\nuseMounted(()=>{\r\n return mergeRegister(\r\n // 插入图文\r\n editor.registerCommand<ImageAttrType>(INSERT_IMAGETEXT_COMMAND,(payload) => {\r\n $insertNodeToNearestRoot($createImageTextNode(payload))\r\n return true\r\n },COMMAND_PRIORITY_EDITOR)\r\n )\r\n})\r\n\r\nonMounted(() => {\r\n\r\n if (!editor.hasNodes([ImageTextNode])){\r\n throw new Error('ImageTextPlugin: 图文节点未注册！')\r\n }\r\n})\r\n</script>\r\n\r\n\r\n<template>\r\n <!-- <div class=\"mk-doc-active-mark mk-doc-active-box-mark\" v-if=\"isSelected\" :style=\"curSelectPos\">\r\n \r\n </div> -->\r\n</template>\r\n\r\n"],"names":[],"mappings":";;;;;;;;;AAY+B,mCAAA;AAAA,MAC7B,MAAK;AAAA,MACL,MAAK;AAAA,MACL,QAAO,YAAU;AACf,eAAO,gBAAgB,0BAAyB;AAAA,UAC9C,KAAI;AAAA,UACJ,OAAM;AAAA,UACN,OAAM;AAAA,UACN,QAAO;AAAA,QAAA,CACR;AAAA,MACH;AAAA,MACA,MAAK;AAAA,IAAA,CACiB;AAExB,UAAM,SAAS;AA0Bf,eAAW,MAAI;AACN,aAAA;AAAA;AAAA,QAEL,OAAO,gBAA+B,0BAAyB,CAAC,YAAY;AACjD,mCAAA,qBAAqB,OAAO,CAAC;AAC/C,iBAAA;AAAA,WACP,uBAAuB;AAAA,MAAA;AAAA,IAC3B,CACD;AAED,cAAU,MAAM;AAEd,UAAI,CAAC,OAAO,SAAS,CAAC,aAAa,CAAC,GAAE;AAC9B,cAAA,IAAI,MAAM,2BAA2B;AAAA,MAC7C;AAAA,IAAA,CACD;;;;;;"}
1	+ {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImageTextPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { $insertNodeToNearestRoot,mergeRegister } from '@lexical/utils'\r\nimport { COMMAND_PRIORITY_EDITOR,COMMAND_PRIORITY_LOW,$getSelection,CLICK_COMMAND } from 'lexical'\r\nimport { useLexicalComposer,useMounted } from 'lexical-vue'\r\nimport { onMounted, onUnmounted } from 'vue'\r\nimport { registerDocEditorToolbarExtend,type ToolbarExtendPlugin } from \"../../core\"\r\nimport { useElementModule } from '../../core'\r\nimport { ImageAttrType } from '../ImagePlugin'\r\nimport { INSERT_IMAGETEXT_COMMAND,ImageTextNode,$createImageTextNode } from './index'\r\n\r\n\r\n// 注册到工具条\r\nregisterDocEditorToolbarExtend({\r\n icon:\"richtext-outline\",\r\n text:\"图文\",\r\n action:async ()=>{ \r\n editor.dispatchCommand(INSERT_IMAGETEXT_COMMAND,{\r\n src:\"\",\r\n float:\"left\",\r\n width:\"200px\",\r\n margin:\"0 10px 10px 0\"\r\n })\r\n },\r\n sort:10\r\n} as ToolbarExtendPlugin)\r\n\r\nconst editor = useLexicalComposer()\r\n\r\n// 使用元素模块集成了模块选中删除以及工具条\r\n// const { isSelected, curSelectKey, curSelectPos,updateActiveViewState } = useElementModule(el=>{\r\n \r\n// var imageTextEl:any = el\r\n\r\n// while (imageTextEl != null && !imageTextEl.classList.contains(\"mk-doc-block-image-text\")) {\r\n// imageTextEl = imageTextEl.parentElement;\r\n// }\r\n\r\n// return imageTextEl\r\n\r\n// },[\r\n// {\r\n// title:\"编辑\",icon:\"Edit\",action:()=>{\r\n// // 编辑的节点\r\n// editor.getEditorState().read(async () => {\r\n \r\n \r\n// })\r\n// } \r\n// }\r\n// ])\r\n\r\n\r\nuseMounted(()=>{\r\n return mergeRegister(\r\n // 插入图文\r\n editor.registerCommand<ImageAttrType>(INSERT_IMAGETEXT_COMMAND,(payload) => {\r\n $insertNodeToNearestRoot($createImageTextNode(payload))\r\n return true\r\n },COMMAND_PRIORITY_EDITOR)\r\n )\r\n})\r\n\r\nonMounted(() => {\r\n\r\n if (!editor.hasNodes([ImageTextNode])){\r\n throw new Error('ImageTextPlugin: 图文节点未注册！')\r\n }\r\n})\r\n</script>\r\n\r\n\r\n<template>\r\n <!-- <div class=\"mk-doc-active-mark mk-doc-active-box-mark\" v-if=\"isSelected\" :style=\"curSelectPos\">\r\n \r\n </div> -->\r\n</template>\r\n\r\n"],"names":[],"mappings":";;;;;;;;;AAY+B,mCAAA;AAAA,MAC7B,MAAK;AAAA,MACL,MAAK;AAAA,MACL,QAAO,YAAU;AACf,eAAO,gBAAgB,0BAAyB;AAAA,UAC9C,KAAI;AAAA,UACJ,OAAM;AAAA,UACN,OAAM;AAAA,UACN,QAAO;AAAA,QAAA,CACR;AAAA,MACH;AAAA,MACA,MAAK;AAAA,IAAA,CACiB;AAExB,UAAM,SAAS;AA0Bf,eAAW,MAAI;AACN,aAAA;AAAA;AAAA,QAEL,OAAO,gBAA+B,0BAAyB,CAAC,YAAY;AACjD,mCAAA,qBAAqB,OAAO,CAAC;AAC/C,iBAAA;AAAA,WACP,uBAAuB;AAAA,MAAA;AAAA,IAC3B,CACD;AAED,cAAU,MAAM;AAEd,UAAI,CAAC,OAAO,SAAS,CAAC,aAAa,CAAC,GAAE;AAC9B,cAAA,IAAI,MAAM,2BAA2B;AAAA,MAC7C;AAAA,IAAA,CACD;;;;;;"}

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

@@ -65,24 +65,8 @@ class ModuleBlockNode extends BaseBlockNode {
   }
   static importDOM() {
     return {
-      div: (domNode) => {
-        const name = domNode.getAttribute(AttrMarkName);
-        const isModule = BaseBlockNode.hasBlockByType(domNode, ModuleBlockNode.getType());
-        const moduleContent = domNode.innerHTML;
-        if (isModule && name) {
-          domNode.innerHTML = "";
-        }
-        return isModule && name ? {
-          conversion: () => {
-            const { module } = useModule(name);
-            const { data } = createModuleMetaData(moduleContent, module.options);
-            return {
-              node: $createModuleBlockNode(name, data)
-            };
-          },
-          priority: 4
-        } : null;
-      }
+      div: $covertModuleBlockDOM,
+      section: $covertModuleBlockDOM
     };
   }
   /**
@@ -153,7 +137,26 @@ function $createModuleBlockNode(name, data) {
 function $isModuleBlockNode(node) {
   return node instanceof ModuleBlockNode;
 }
+const $covertModuleBlockDOM = (domNode) => {
+  const name = domNode.getAttribute(AttrMarkName);
+  const isModule = BaseBlockNode.hasBlockByType(domNode, ModuleBlockNode.getType());
+  const moduleContent = domNode.innerHTML;
+  if (isModule && name) {
+    domNode.innerHTML = "";
+  }
+  return isModule && name ? {
+    conversion: () => {
+      const { module } = useModule(name);
+      const { data } = createModuleMetaData(moduleContent, module.options);
+      return {
+        node: $createModuleBlockNode(name, data)
+      };
+    },
+    priority: 4
+  } : null;
+};
 export {
+  $covertModuleBlockDOM,
   $createModuleBlockNode,
   $isModuleBlockNode,
   ModuleBlockNode

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 type {\r\n DOMConversionMap,\r\n DOMExportOutput,\r\n LexicalNode,\r\n NodeKey,\r\n Spread,\r\n EditorConfig,\r\n} from 'lexical'\r\nimport { type Component,h} from 'vue'\r\nimport { DecoratorModuleBlockNode } from \"../../core\"\r\nimport { useModule } from \"./composables\"\r\nimport { createHtml,createModuleMetaData } from \"./utils\"\r\nimport RenderComponent from \"./ModuleRenderComponent\"\r\nimport { BaseBlockNode,SerializedBlockNode } from '../RichTextPlugin/nodes/BaseBlockNode'\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 SerializedBlockNode\r\n>\r\n\r\n//\r\nconst ClassMarkName = \"module-name\";\r\n// 属性标识\r\nconst AttrMarkName = \"module-name\";\r\n\r\n/\r\n 模块节点\r\n /\r\nexport class ModuleBlockNode extends BaseBlockNode {\r\n __name: string\r\n __data: object\r\n\r\n static getType(): string {\r\n return \"module\";\r\n }\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 {\r\n return BaseBlockNode.getMarkClassName(ModuleBlockNode.getType())\r\n }\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(ModuleBlockNode.getType(),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 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 : ~~(domNode: HTMLElement) => {\~~r\n~~\r\n const~~ name = domNode.getAttribute(AttrMarkName) as string;\r\n const isModule = BaseBlockNode.hasBlockByType(domNode,ModuleBlockNode.getType());\r\n const moduleContent = domNode.innerHTML ;\r\n\r\n if(isModule && name){\r\n domNode.innerHTML = \"\";\r\n }\r\n\r\n return isModule && name ? {\r\n conversion: ~~()=>{~~ \r\n \r\n const { module } = useModule(name);\r\n const { data } = createModuleMetaData(moduleContent,module.options);\r\n\r\n return { \r\n node:$createModuleBlockNode(name,data)\r\n };\r\n },\r\n priority: 4\r\n } : null;\r\n }\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 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 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(this.getMarkClassName())) {\r\n contentEl.classList.add(this.getMarkClassName());\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/\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"],"names":[],"mappings":";;;;;;~~AA8BA~~,MAAM,eAAe;AAKd,MAAM,wBAAwB,cAAc;AAAA,EAkCjD,YAAY,MAAc,MAAe,KAAe;AAChD,UAAA,gBAAgB,QAAQ,GAAE,GAAG;AAlCrC;AACA;AAkCE,SAAK,SAAS;AACd,SAAK,SAAS;AAAA,EAChB;AAAA,EAlCA,OAAO,UAAkB;AAChB,WAAA;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,OAAO,MAAM,MAAwC;AACnD,WAAO,IAAI,gBAAgB,KAAK,QAAO,KAAK,QAAO,KAAK,KAAK;AAAA,EAC/D;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,OAAO,mBAA2B;AAChC,WAAO,cAAc,iBAAiB,gBAAgB,QAAS,CAAA;AAAA,EACjE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,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,EAEA,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~~,CAAC,YAAyB~~;~~AAExB,cAAA,OAAO,QAAQ,aAAa,YAAY;AAC9C,cAAM,WAAW,cAAc,eAAe,SAAQ,gBAAgB,SAAS;AAC/E,cAAM,gBAAgB,QAAQ;AAE9B,YAAG,YAAY,MAAK;AAClB,kBAAQ,YAAY;~~AAAA,~~QACtB;AAEA~~,~~eAAO,YAAY,OAAO~~;AAAA,~~UACxB,YAAY,MAAI;AAEd,kBAAM,EAAE,OAAA,IAAW,UAAU,IAAI;AACjC,kBAAM,EAAE,KAAK,IAAI,qBAAqB,eAAc,OAAO,OAAO;AAE3D,mBAAA;AAAA,cACL,MAAK,uBAAuB,MAAK,IAAI;AAAA,YAAA;AAAA,UAEzC;AAAA,UACA,UAAU;AAAA,QACR,~~IAAA;AAAA,~~MACN~~;AAAA~~,IAAA~~;AAAA~~,EAEJ~~;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;AAC3B,UAAA,UAAU,SAAS,cAAc,KAAK;AAC5C,UAAM,EAAE,OAAW,IAAA,UAAU,KAAK,MAAM;AACxC,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,KAAK,iBAAA,CAAkB,GAAG;AAC1D,gBAAU,UAAU,IAAI,KAAK,iBAAkB,CAAA;AAAA,IACjD;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,~~EASE~~,UAAU,UAA2B,KAAkB,QAA+B;AAC9E,UAAA,KAAK,KAAK;AAChB,QAAI,YAAY,GAAG;AACZ,WAAA;AAAA,EACT;~~AAEJ~~;AAOgB,SAAA,uBAAuB,MAAY,MAA+B;AACzE,SAAA,IAAI,gBAAgB,MAAK,IAAI;AACtC;AAOO,SAAS,mBACd,MACyB;AACzB,SAAO,gBAAgB;AACzB;"}
1	+ {"version":3,"file":"ModuleBlockNode.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/ModuleBlockNode.ts"],"sourcesContent":["\r\nimport type {\r\n DOMConversionMap,\r\n DOMExportOutput,\r\n LexicalNode,\r\n NodeKey,\r\n Spread,\r\n EditorConfig,\r\n DOMConversion,\r\n} from 'lexical'\r\nimport { type Component,h} from 'vue'\r\nimport { DecoratorModuleBlockNode } from \"../../core\"\r\nimport { useModule } from \"./composables\"\r\nimport { createHtml,createModuleMetaData } from \"./utils\"\r\nimport RenderComponent from \"./ModuleRenderComponent\"\r\nimport { BaseBlockNode,SerializedBlockNode } from '../RichTextPlugin/nodes/BaseBlockNode'\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 SerializedBlockNode\r\n>\r\n\r\n//\r\nconst ClassMarkName = \"module-name\";\r\n// 属性标识\r\nconst AttrMarkName = \"module-name\";\r\n\r\n/\r\n 模块节点\r\n /\r\nexport class ModuleBlockNode extends BaseBlockNode {\r\n __name: string\r\n __data: object\r\n\r\n static getType(): string {\r\n return \"module\";\r\n }\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 {\r\n return BaseBlockNode.getMarkClassName(ModuleBlockNode.getType())\r\n }\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(ModuleBlockNode.getType(),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 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 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 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(this.getMarkClassName())) {\r\n contentEl.classList.add(this.getMarkClassName());\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/\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 = BaseBlockNode.hasBlockByType(domNode,ModuleBlockNode.getType());\r\n const moduleContent = domNode.innerHTML ;\r\n\r\n if(isModule && name){\r\n domNode.innerHTML = \"\";\r\n }\r\n\r\n return isModule && name ? {\r\n conversion: ()=>{ \r\n \r\n const { module } = useModule(name);\r\n const { data } = createModuleMetaData(moduleContent,module.options);\r\n\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":";;;;;;AA+BA,MAAM,eAAe;AAKd,MAAM,wBAAwB,cAAc;AAAA,EAkCjD,YAAY,MAAc,MAAe,KAAe;AAChD,UAAA,gBAAgB,QAAQ,GAAE,GAAG;AAlCrC;AACA;AAkCE,SAAK,SAAS;AACd,SAAK,SAAS;AAAA,EAChB;AAAA,EAlCA,OAAO,UAAkB;AAChB,WAAA;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,OAAO,MAAM,MAAwC;AACnD,WAAO,IAAI,gBAAgB,KAAK,QAAO,KAAK,QAAO,KAAK,KAAK;AAAA,EAC/D;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,OAAO,mBAA2B;AAChC,WAAO,cAAc,iBAAiB,gBAAgB,QAAS,CAAA;AAAA,EACjE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,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,EAEA,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;AAC3B,UAAA,UAAU,SAAS,cAAc,KAAK;AAC5C,UAAM,EAAE,OAAW,IAAA,UAAU,KAAK,MAAM;AACxC,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,KAAK,iBAAA,CAAkB,GAAG;AAC1D,gBAAU,UAAU,IAAI,KAAK,iBAAkB,CAAA;AAAA,IACjD;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;AAEF;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,cAAc,eAAe,SAAQ,gBAAgB,SAAS;AAC/E,QAAM,gBAAgB,QAAQ;AAE9B,MAAG,YAAY,MAAK;AAClB,YAAQ,YAAY;AAAA,EACtB;AAEA,SAAO,YAAY,OAAO;AAAA,IACxB,YAAY,MAAI;AAEd,YAAM,EAAE,OAAA,IAAW,UAAU,IAAI;AACjC,YAAM,EAAE,KAAK,IAAI,qBAAqB,eAAc,OAAO,OAAO;AAE3D,aAAA;AAAA,QACL,MAAK,uBAAuB,MAAK,IAAI;AAAA,MAAA;AAAA,IAEzC;AAAA,IACA,UAAU;AAAA,EACR,IAAA;AACN;"}

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

@@ -104,6 +104,21 @@ class ModuleContainerNode extends BaseBlockCantainerNode {
     }
     return el;
   }
+  /**
+  * 更新DOM
+  * @param prevNode
+  * @param el
+  * @param config
+  * @returns
+  */
+  updateDOM(node, el, config) {
+    if (node.__attrs.class) {
+      el.className = `${ModuleContainerNode.getMarkClassName()} ${node.__attrs.class}`;
+    } else {
+      el.className = `${ModuleContainerNode.getMarkClassName()}`;
+    }
+    return false;
+  }
 }
 function $isModuleContainerNode(node) {
   return node instanceof ModuleContainerNode;

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ModuleContainerNode.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/ModuleContainerNode.ts"],"sourcesContent":["\r\n\r\n\r\n\r\n\r\nimport type { DOMConversionMap, LexicalCommand, LexicalNode, NodeKey, Spread,EditorConfig, DOMExportOutput } from 'lexical'\r\nimport { createCommand } from 'lexical'\r\nimport { BaseBlockCantainerNode,SerializedBlockCantainerNode } from '../RichTextPlugin/nodes/BaseBlockCantainerNode'\r\n\r\n/*\r\n 容器属性\r\n /\r\nexport type ModuleContainerAttrType = {\r\n isFlex:boolean,\r\n direction:'column'\|'row'\|'row-reverse'\|'column-reverse',\r\n wrap:boolean,\r\n alignContent:'center'\|'flex-start',\r\n justifyContent:'center'\|'flex-start',\r\n alignItems:'center'\|'flex-start',\r\n class:string\r\n};\r\n\r\n/\r\n 插入模块容器\r\n /\r\nexport const INSERT_MODULECONTAINER_COMMAND: LexicalCommand<ModuleContainerAttrType> = createCommand('INSERT_MODULECONTAINER_COMMAND')\r\n\r\n/\r\n 图文节点序列化\r\n /\r\nexport type SerializedModuleContainerNode = Spread<{\r\n attrs:ModuleContainerAttrType\r\n},SerializedBlockCantainerNode>\r\n\r\n/\r\n 模块容器\r\n /\r\nexport class ModuleContainerNode extends BaseBlockCantainerNode{\r\n __attrs:ModuleContainerAttrType\r\n\r\n static getType(): string {\r\n return \"module-container\";\r\n }\r\n /\r\n 获取模块类标识\r\n * @returns \r\n /\r\n static getMarkClassName(): string {\r\n return BaseBlockCantainerNode.getMarkClassName(ModuleContainerNode.getType())\r\n }\r\n\r\n static clone(node: ModuleContainerNode): ModuleContainerNode {\r\n return new ModuleContainerNode(node.__attrs,node.__key)\r\n }\r\n\r\n static importJSON(serializedNode: SerializedModuleContainerNode): ModuleContainerNode {\r\n return new ModuleContainerNode(serializedNode.attrs)\r\n }\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n div : (domNode: HTMLElement) => {\r\n\r\n const data = {};\r\n\r\n return BaseBlockCantainerNode.hasBlockByType(domNode,ModuleContainerNode.getType()) ? {\r\n conversion: ()=>{ \r\n\r\n // 标识类名\r\n const className = domNode.className.replace(ModuleContainerNode.getMarkClassName(),\"\").trim();\r\n\r\n return { \r\n node:$createModuleContainerNode(Object.assign({\r\n isFlex:false,\r\n direction:\"\",\r\n wrap:false,\r\n alignContent:\"\",\r\n justifyContent:'',\r\n alignItems:'',\r\n class:className\r\n },data) as ModuleContainerAttrType) \r\n };\r\n },\r\n priority: 4\r\n } : null;\r\n }\r\n }\r\n }\r\n\r\n constructor(attrs:ModuleContainerAttrType,key?: NodeKey) {\r\n super(ModuleContainerNode.getType(),key)\r\n this.__attrs = attrs;\r\n }\r\n\r\n /\r\n 设置属性\r\n * @param pos \r\n /\r\n setAttrs(data?:any){\r\n const writable = this.getWritable();\r\n Object.assign(writable.__attrs,data)\r\n }\r\n\r\n /\r\n 获取属性\r\n * @param pos \r\n /\r\n getAttrs(){\r\n return this.__attrs;\r\n }\r\n\r\n /\r\n 导出JSON\r\n * @returns \r\n /\r\n exportJSON(): SerializedModuleContainerNode {\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n attrs:this.__attrs,\r\n version: 1\r\n }\r\n }\r\n\r\n /\r\n 导出DOM\r\n * @returns \r\n /\r\n exportDOM(): DOMExportOutput {\r\n \r\n const out = super.exportDOM();\r\n const el = out.element as HTMLElement\r\n\r\n if (this.__attrs.class && !el.classList.contains(this.__attrs.class)) {\r\n el.classList.add(this.__attrs.class);\r\n }\r\n\r\n return out\r\n }\r\n\r\n /\r\n 创建渲染DOM\r\n * @param config \r\n * @returns \r\n /\r\n createDOM(config: EditorConfig): HTMLElement {\r\n \r\n const el = super.createDOM(config);\r\n\r\n if (this.__attrs.class && !el.classList.contains(this.__attrs.class)) {\r\n el.classList.add(this.__attrs.class);\r\n }\r\n\r\n if(this.getChildrenSize() <= 0){\r\n el.classList.add(\"empty\")\r\n }\r\n \r\n return el;\r\n }\r\n\r\n}\r\n\r\n/\r\n 判断是否是模块容器节点\r\n * @param node \r\n * @returns \r\n /\r\nexport function $isModuleContainerNode(\r\n node: ModuleContainerNode \| LexicalNode \| null \| undefined,\r\n): node is ModuleContainerNode {\r\n return node instanceof ModuleContainerNode\r\n}\r\n\r\n\r\n/\r\n 创建模块容器\r\n * @param src \r\n * @returns \r\n */\r\nexport function $createModuleContainerNode(data: ModuleContainerAttrType): ModuleContainerNode {\r\n return new ModuleContainerNode(Object.assign({\r\n isFlex:false,\r\n direction:\"\",\r\n wrap:false,\r\n alignContent:\"\",\r\n justifyContent:'',\r\n alignItems:'',\r\n class:\"\"\r\n },data))\r\n}\r\n"],"names":[],"mappings":";;;;;AAyBa,MAAA,iCAA0E,cAAc,gCAAgC;AAY9H,MAAM,4BAA4B,uBAAsB;AAAA,EAoD7D,YAAY,OAA8B,KAAe;AACjD,UAAA,oBAAoB,QAAQ,GAAE,GAAG;AApDzC;AAqDE,SAAK,UAAU;AAAA,EACjB;AAAA,EApDA,OAAO,UAAkB;AAChB,WAAA;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA,EAKA,OAAO,mBAA2B;AAChC,WAAO,uBAAuB,iBAAiB,oBAAoB,QAAS,CAAA;AAAA,EAC9E;AAAA,EAEA,OAAO,MAAM,MAAgD;AAC3D,WAAO,IAAI,oBAAoB,KAAK,SAAQ,KAAK,KAAK;AAAA,EACxD;AAAA,EAEA,OAAO,WAAW,gBAAoE;AAC7E,WAAA,IAAI,oBAAoB,eAAe,KAAK;AAAA,EACrD;AAAA,EAEA,OAAO,YAAqC;AACnC,WAAA;AAAA,MACL,KAAM,CAAC,YAAyB;AAE9B,cAAM,OAAO,CAAA;AAEb,eAAQ,uBAAuB,eAAe,SAAQ,oBAAoB,QAAS,CAAA,IAAI;AAAA,UACrF,YAAY,MAAI;AAGR,kBAAA,YAAY,QAAQ,UAAU,QAAQ,oBAAoB,oBAAmB,EAAE,EAAE;AAE/E,mBAAA;AAAA,cACN,MAAK,2BAA2B,OAAO,OAAO;AAAA,gBAC5C,QAAO;AAAA,gBACP,WAAU;AAAA,gBACV,MAAK;AAAA,gBACL,cAAa;AAAA,gBACb,gBAAe;AAAA,gBACf,YAAW;AAAA,gBACX,OAAM;AAAA,cACR,GAAE,IAAI,CAA4B;AAAA,YAAA;AAAA,UAEtC;AAAA,UACA,UAAU;AAAA,QACR,IAAA;AAAA,MACN;AAAA,IAAA;AAAA,EAEJ;AAAA;AAAA;AAAA;AAAA;AAAA,EAWA,SAAS,MAAU;AACX,UAAA,WAAW,KAAK;AACf,WAAA,OAAO,SAAS,SAAQ,IAAI;AAAA,EACrC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,WAAU;AACR,WAAO,KAAK;AAAA,EACd;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,aAA4C;AACnC,WAAA;AAAA,MACL,GAAG,MAAM,WAAW;AAAA,MACpB,MAAM,KAAK,QAAQ;AAAA,MACnB,OAAM,KAAK;AAAA,MACX,SAAS;AAAA,IAAA;AAAA,EAEb;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,YAA6B;AAErB,UAAA,MAAM,MAAM;AAClB,UAAM,KAAK,IAAI;AAEX,QAAA,KAAK,QAAQ,SAAS,CAAC,GAAG,UAAU,SAAS,KAAK,QAAQ,KAAK,GAAG;AACpE,SAAG,UAAU,IAAI,KAAK,QAAQ,KAAK;AAAA,IACrC;AAEO,WAAA;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,UAAU,QAAmC;AAErC,UAAA,KAAK,MAAM,UAAU,MAAM;AAE7B,QAAA,KAAK,QAAQ,SAAS,CAAC,GAAG,UAAU,SAAS,KAAK,QAAQ,KAAK,GAAG;AACpE,SAAG,UAAU,IAAI,KAAK,QAAQ,KAAK;AAAA,IACrC;AAEG,QAAA,KAAK,gBAAgB,KAAK,GAAE;AAC1B,SAAA,UAAU,IAAI,OAAO;AAAA,IAC1B;AAEO,WAAA;AAAA,EACT;~~AAEF~~;AAOO,SAAS,uBACd,MAC6B;AAC7B,SAAO,gBAAgB;AACzB;AAQO,SAAS,2BAA2B,MAAoD;AACtF,SAAA,IAAI,oBAAoB,OAAO,OAAO;AAAA,IAC3C,QAAO;AAAA,IACP,WAAU;AAAA,IACV,MAAK;AAAA,IACL,cAAa;AAAA,IACb,gBAAe;AAAA,IACf,YAAW;AAAA,IACX,OAAM;AAAA,EAAA,GACN,IAAI,CAAC;AACT;"}
1	+ {"version":3,"file":"ModuleContainerNode.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/ModuleContainerNode.ts"],"sourcesContent":["\r\n\r\n\r\n\r\n\r\nimport type { DOMConversionMap, LexicalCommand, LexicalNode, NodeKey, Spread,EditorConfig, DOMExportOutput } from 'lexical'\r\nimport { createCommand } from 'lexical'\r\nimport { BaseBlockCantainerNode,SerializedBlockCantainerNode } from '../RichTextPlugin/nodes/BaseBlockCantainerNode'\r\n\r\n/*\r\n 容器属性\r\n /\r\nexport type ModuleContainerAttrType = {\r\n isFlex:boolean,\r\n direction:'column'\|'row'\|'row-reverse'\|'column-reverse',\r\n wrap:boolean,\r\n alignContent:'center'\|'flex-start',\r\n justifyContent:'center'\|'flex-start',\r\n alignItems:'center'\|'flex-start',\r\n class:string\r\n};\r\n\r\n/\r\n 插入模块容器\r\n /\r\nexport const INSERT_MODULECONTAINER_COMMAND: LexicalCommand<ModuleContainerAttrType> = createCommand('INSERT_MODULECONTAINER_COMMAND')\r\n\r\n/\r\n 图文节点序列化\r\n /\r\nexport type SerializedModuleContainerNode = Spread<{\r\n attrs:ModuleContainerAttrType\r\n},SerializedBlockCantainerNode>\r\n\r\n/\r\n 模块容器\r\n /\r\nexport class ModuleContainerNode extends BaseBlockCantainerNode{\r\n __attrs:ModuleContainerAttrType\r\n\r\n static getType(): string {\r\n return \"module-container\";\r\n }\r\n /\r\n 获取模块类标识\r\n * @returns \r\n /\r\n static getMarkClassName(): string {\r\n return BaseBlockCantainerNode.getMarkClassName(ModuleContainerNode.getType())\r\n }\r\n\r\n static clone(node: ModuleContainerNode): ModuleContainerNode {\r\n return new ModuleContainerNode(node.__attrs,node.__key)\r\n }\r\n\r\n static importJSON(serializedNode: SerializedModuleContainerNode): ModuleContainerNode {\r\n return new ModuleContainerNode(serializedNode.attrs)\r\n }\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n div : (domNode: HTMLElement) => {\r\n\r\n const data = {};\r\n\r\n return BaseBlockCantainerNode.hasBlockByType(domNode,ModuleContainerNode.getType()) ? {\r\n conversion: ()=>{ \r\n\r\n // 标识类名\r\n const className = domNode.className.replace(ModuleContainerNode.getMarkClassName(),\"\").trim();\r\n\r\n return { \r\n node:$createModuleContainerNode(Object.assign({\r\n isFlex:false,\r\n direction:\"\",\r\n wrap:false,\r\n alignContent:\"\",\r\n justifyContent:'',\r\n alignItems:'',\r\n class:className\r\n },data) as ModuleContainerAttrType) \r\n };\r\n },\r\n priority: 4\r\n } : null;\r\n }\r\n }\r\n }\r\n\r\n constructor(attrs:ModuleContainerAttrType,key?: NodeKey) {\r\n super(ModuleContainerNode.getType(),key)\r\n this.__attrs = attrs;\r\n }\r\n\r\n /\r\n 设置属性\r\n * @param pos \r\n /\r\n setAttrs(data?:any){\r\n const writable = this.getWritable();\r\n Object.assign(writable.__attrs,data)\r\n }\r\n\r\n /\r\n 获取属性\r\n * @param pos \r\n /\r\n getAttrs(){\r\n return this.__attrs;\r\n }\r\n\r\n /\r\n 导出JSON\r\n * @returns \r\n /\r\n exportJSON(): SerializedModuleContainerNode {\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n attrs:this.__attrs,\r\n version: 1\r\n }\r\n }\r\n\r\n /\r\n 导出DOM\r\n * @returns \r\n /\r\n exportDOM(): DOMExportOutput {\r\n \r\n const out = super.exportDOM();\r\n const el = out.element as HTMLElement\r\n\r\n if (this.__attrs.class && !el.classList.contains(this.__attrs.class)) {\r\n el.classList.add(this.__attrs.class);\r\n }\r\n\r\n return out\r\n }\r\n\r\n /\r\n 创建渲染DOM\r\n * @param config \r\n * @returns \r\n /\r\n createDOM(config: EditorConfig): HTMLElement {\r\n \r\n const el = super.createDOM(config);\r\n\r\n if (this.__attrs.class && !el.classList.contains(this.__attrs.class)) {\r\n el.classList.add(this.__attrs.class);\r\n }\r\n\r\n if(this.getChildrenSize() <= 0){\r\n el.classList.add(\"empty\")\r\n }\r\n \r\n return el;\r\n }\r\n\r\n /\r\n 更新DOM\r\n * @param prevNode \r\n * @param el \r\n * @param config \r\n * @returns \r\n /\r\n updateDOM(node: ModuleContainerNode, el: HTMLElement, config: EditorConfig): boolean {\r\n if (node.__attrs.class) {\r\n // 标识类名\r\n el.className = `${ModuleContainerNode.getMarkClassName()} ${node.__attrs.class}`;\r\n }\r\n else{\r\n el.className = `${ModuleContainerNode.getMarkClassName()}`;\r\n }\r\n return false\r\n }\r\n}\r\n\r\n/\r\n 判断是否是模块容器节点\r\n * @param node \r\n * @returns \r\n /\r\nexport function $isModuleContainerNode(\r\n node: ModuleContainerNode \| LexicalNode \| null \| undefined,\r\n): node is ModuleContainerNode {\r\n return node instanceof ModuleContainerNode\r\n}\r\n\r\n\r\n/\r\n 创建模块容器\r\n * @param src \r\n * @returns \r\n */\r\nexport function $createModuleContainerNode(data: ModuleContainerAttrType): ModuleContainerNode {\r\n return new ModuleContainerNode(Object.assign({\r\n isFlex:false,\r\n direction:\"\",\r\n wrap:false,\r\n alignContent:\"\",\r\n justifyContent:'',\r\n alignItems:'',\r\n class:\"\"\r\n },data))\r\n}\r\n"],"names":[],"mappings":"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"}

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

@@ -1,5 +1,5 @@
 const Modules = [];
-const registerModule = (options) => {
+const registerDocModule = (options) => {
   Modules.push(options);
 };
 const useModules = () => {
@@ -14,7 +14,7 @@ const useModule = (name) => {
 };
 export {
   Modules,
-  registerModule,
+  registerDocModule,
   useModule,
   useModules
 };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"composables.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/composables.ts"],"sourcesContent":["~~\r\nimport~~ ~~type~~ {~~\r\n DOMConversionMap,\r\n DOMExportOutput,\r\n EditorConfig,\r\n LexicalEditor,\r\n LexicalNode,\r\n NodeKey,\r\n Spread,\r\n LexicalCommand,\r\n SerializedLexicalNode\r\n}~~ ~~from 'lexical'\r\nimport { createCommand,DecoratorNode } from 'lexical'\r\nimport { h ,type Component } from 'vue'\r\nimport {~~ DynamicFormItemType } from \"../../../dynamic-form-panel\"\r\n\r\n/*\r\n 模块模版类型\r\n /\r\nexport type ModuleType = {\r\n name:string,\r\n title:string,\r\n cover:string,\r\n template:string,\r\n options:DynamicFormItemType[]\r\n}\r\n\r\n\r\n/\r\n 模块模版定义\r\n /\r\nexport const Modules:ModuleType[] = [];\r\n\r\n/\r\n 注册模块模版\r\n * @param options \r\n /\r\nexport const ~~registerModule~~ = (options:ModuleType) => {\r\n Modules.push(options);\r\n}\r\n\r\n/\r\n \r\n * @param name \r\n * @returns \r\n /\r\nexport const useModules = () => {\r\n return Modules;\r\n}\r\n\r\n/\r\n \r\n * @param name \r\n * @returns \r\n */\r\nexport const useModule = (name:string) => {\r\n\r\n const module = Modules.find(item=>item.name == name);\r\n\r\n if(module == null){\r\n throw new Error(\"未知的模块模版：【\" + name + \"】\");\r\n }\r\n\r\n return { module };\r\n}\r\n"],"names":[],"mappings":"~~AA+BO~~,MAAM,UAAuB,CAAC;AAMxB,MAAA,~~iBAAiB~~,CAAC,YAAuB;~~AACpD~~,UAAQ,KAAK,OAAO;AACtB;AAOO,MAAM,aAAa,MAAM;AACvB,SAAA;AACT;AAOa,MAAA,YAAY,CAAC,SAAgB;AAExC,QAAM,SAAS,QAAQ,KAAK,CAAM,SAAA,KAAK,QAAQ,IAAI;AAEnD,MAAG,UAAU,MAAK;AAChB,UAAM,IAAI,MAAM,cAAc,OAAO,GAAG;AAAA,EAC1C;AAEA,SAAO,EAAE,OAAO;AAClB;"}
1	+ {"version":3,"file":"composables.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/composables.ts"],"sourcesContent":["import { DynamicFormItemType } from \"../../../dynamic-form-panel\"\r\n\r\n/*\r\n 模块模版类型\r\n /\r\nexport type ModuleType = {\r\n name:string,\r\n title:string,\r\n cover:string,\r\n template:string,\r\n editorCss:string\|null\|undefined,\r\n options:DynamicFormItemType[]\r\n}\r\n\r\n\r\n/\r\n 模块模版定义\r\n /\r\nexport const Modules:ModuleType[] = [];\r\n\r\n/\r\n 注册模块模版\r\n * @param options \r\n /\r\nexport const registerDocModule = (options:ModuleType) => {\r\n Modules.push(options);\r\n}\r\n\r\n/\r\n \r\n * @param name \r\n * @returns \r\n /\r\nexport const useModules = () => {\r\n return Modules;\r\n}\r\n\r\n/\r\n \r\n * @param name \r\n * @returns \r\n */\r\nexport const useModule = (name:string) => {\r\n\r\n const module = Modules.find(item=>item.name == name);\r\n\r\n if(module == null){\r\n throw new Error(\"未知的模块模版：【\" + name + \"】\");\r\n }\r\n\r\n return { module };\r\n}\r\n"],"names":[],"mappings":"AAkBO,MAAM,UAAuB,CAAC;AAMxB,MAAA,oBAAoB,CAAC,YAAuB;AACvD,UAAQ,KAAK,OAAO;AACtB;AAOO,MAAM,aAAa,MAAM;AACvB,SAAA;AACT;AAOa,MAAA,YAAY,CAAC,SAAgB;AAExC,QAAM,SAAS,QAAQ,KAAK,CAAM,SAAA,KAAK,QAAQ,IAAI;AAEnD,MAAG,UAAU,MAAK;AAChB,UAAM,IAAI,MAAM,cAAc,OAAO,GAAG;AAAA,EAC1C;AAEA,SAAO,EAAE,OAAO;AAClB;"}

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

@@ -2,14 +2,13 @@ import { defineComponent, ref, onMounted, onUnmounted, unref, openBlock, createE
 import { useLexicalComposer } from "lexical-vue";
 import { mergeRegister, $insertNodeToNearestRoot } from "@lexical/utils";
 import { COMMAND_PRIORITY_EDITOR, $getNodeByKey } from "lexical";
-import { registerDocEditorToolbarExtend } from "../ToolbarPlugin/defines.js";
+import { registerDocEditorToolbarExtend } from "../../core/index.js";
 import { useModule } from "./composables.js";
 import { ModuleBlockNode, $createModuleBlockNode, $isModuleBlockNode } from "./ModuleBlockNode.js";
 import { INSERT_MODULECONTAINER_COMMAND, $createModuleContainerNode, $isModuleContainerNode } from "./ModuleContainerNode.js";
 import { INSERT_MODULE_COMMAND } from "./commands.js";
 import { findModuleNodeEl, findModuleContainerEl, showModuleSelectDialog } from "./utils.js";
 import { createDefaultFormData } from "../../../dynamic-form-panel/utils.js";
-import "../../core/index.js";
 import { showDynamicFormDialoger } from "../../../dynamic-form-panel/dialog.js";
 import "element-plus";
 import { useElementModule } from "../../core/element-module.js";

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/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 COMMAND_PRIORITY_EDITOR,COMMAND_PRIORITY_LOW,CLICK_COMMAND, $getSelection,$isNodeSelection, $getNodeByKey\r\n} from 'lexical'\r\nimport { onMounted, onUnmounted,ref } from 'vue'\r\nimport { registerDocEditorToolbarExtend,type ToolbarExtendPlugin } from \"~~../ToolbarPlugin/defines~~\"\r\nimport { ModuleType,useModule } from \"./composables\"\r\nimport { ModuleBlockNode,$createModuleBlockNode,$isModuleBlockNode } from \"./ModuleBlockNode\"\r\nimport { type ModuleContainerAttrType,INSERT_MODULECONTAINER_COMMAND,$createModuleContainerNode,$isModuleContainerNode } from \"./ModuleContainerNode\"\r\nimport { INSERT_MODULE_COMMAND,type ModulePropType } from \"./commands\"\r\nimport { showModuleSelectDialog,findModuleNodeEl,findModuleContainerEl } from \"./utils\"\r\nimport { createDefaultFormData } from \"../../../dynamic-form-panel/utils\"\r\nimport { useElementModule } from '../../core'\r\nimport { showDynamicFormDialoger } from \"../../../dynamic-form-panel\"\r\n\r\n// 编辑器\r\nconst editor = useLexicalComposer()\r\n\r\n// 注册到工具条\r\nregisterDocEditorToolbarExtend({\r\n icon:\"Grid\",\r\n text:\"模块\",\r\n action:async ()=>{\r\n // 插入\r\n editor.dispatchCommand(INSERT_MODULECONTAINER_COMMAND,{ } as ModuleContainerAttrType)\r\n \r\n },\r\n sort:9\r\n} as ToolbarExtendPlugin)\r\n\r\n// 是否是选中模块容器\r\nconst isSelectContainer = ref(false);\r\n\r\n// 使用元素模块集成了模块选中删除以及工具条\r\nconst { isSelected, curSelectKey, curSelectPos,updateActiveViewState } = useElementModule(el=>{\r\n \r\n var modelEl = findModuleNodeEl(el);\r\n var moduleContainerEl = findModuleContainerEl(el);\r\n\r\n\r\n if(modelEl && moduleContainerEl){\r\n isSelectContainer.value = false;\r\n \r\n return modelEl;\r\n }\r\n else if(moduleContainerEl){\r\n\r\n isSelectContainer.value = true;\r\n\r\n return moduleContainerEl;\r\n }\r\n\r\n isSelectContainer.value = false;\r\n return null;\r\n\r\n},(selection)=>{\r\n \r\n const node = $getNodeByKey(curSelectKey.value)\r\n\r\n if(node != null){\r\n\r\n // 工具条\r\n const toolbarList = [];\r\n\r\n // 模块容器\r\n if($isModuleContainerNode(node)){\r\n toolbarList.push(...[\r\n {\r\n title:`编辑模块容器`,icon:\"Edit\",action:async ()=>{\r\n\r\n var result = await showDynamicFormDialoger(\"模块容器\",[\r\n { name:\"class\", title:\"标识类名\", component:\"el-input\", props:{ clearable:true }, defaultValue:\"\" }\r\n ],node.getAttrs())\r\n \r\n editor.update(() => {\r\n node.setAttrs(result)\r\n updateActiveViewState(null);\r\n })\r\n\r\n } \r\n },\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 updateActiveViewState(null);\r\n } \r\n }\r\n ])\r\n }\r\n // 选中模块\r\n else if($isModuleBlockNode(node)){\r\n\r\n const { module } = useModule(node.__name);\r\n\r\n toolbarList.push(...[\r\n {\r\n title:`编辑【${module.title}】`,icon:\"Edit\",action:async ()=>{\r\n\r\n var result = await showDynamicFormDialoger(module.title,module.options,node.__data)\r\n \r\n editor.update(() => {\r\n node.setContent(result)\r\n updateActiveViewState(null);\r\n })\r\n\r\n } \r\n },\r\n {\r\n title:`插入【${module.title}】之前`,icon:\"BottomLeft\",action:async ()=>{\r\n\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 updateActiveViewState(null);\r\n \r\n editor.update(() => {\r\n node.insertBefore($createModuleBlockNode(result.name,defaultData))\r\n updateActiveViewState(null);\r\n })\r\n\r\n } \r\n },\r\n {\r\n title:`插入【${module.title}】之后`,icon:\"BottomRight\",action:async ()=>{\r\n\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 updateActiveViewState(null);\r\n \r\n editor.update(() => {\r\n node.insertAfter($createModuleBlockNode(result.name,defaultData))\r\n updateActiveViewState(null);\r\n })\r\n\r\n } \r\n }\r\n ])\r\n }\r\n\r\n return toolbarList;\r\n }\r\n\r\n return null;\r\n})\r\n\r\n\r\nonMounted(() => {\r\n\r\n if (!editor.hasNodes([ModuleBlockNode])){\r\n throw new Error('ModuleBlockPlugin: 未注册模块模版节点！')\r\n }\r\n\r\n // 注册指令\r\n const unregister = mergeRegister(\r\n // 插入模块容器\r\n editor.registerCommand<ModuleContainerAttrType>(INSERT_MODULECONTAINER_COMMAND,(payload) => { \r\n $insertNodeToNearestRoot($createModuleContainerNode(payload))\r\n return true\r\n },COMMAND_PRIORITY_EDITOR),\r\n // 插入模块\r\n editor.registerCommand<ModulePropType>(INSERT_MODULE_COMMAND,(payload) => {\r\n \r\n if(curSelectKey.value){\r\n\r\n const node = $getNodeByKey(curSelectKey.value);\r\n\r\n if($isModuleContainerNode(node)){\r\n node.append($createModuleBlockNode(payload.name,payload.data))\r\n }\r\n }\r\n \r\n return true\r\n },COMMAND_PRIORITY_EDITOR)\r\n\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-mark\" :class=\"{box:isSelectContainer}\" v-if=\"isSelected\" :style=\"curSelectPos\">\r\n \r\n </div>\r\n</template>\r\n"],"names":[],"mappings":"~~;;;;;;;;;;;;;;;;;;~~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"}
1	+ {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/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 COMMAND_PRIORITY_EDITOR,COMMAND_PRIORITY_LOW,CLICK_COMMAND, $getSelection,$isNodeSelection, $getNodeByKey\r\n} from 'lexical'\r\nimport { onMounted, onUnmounted,ref } from 'vue'\r\nimport { registerDocEditorToolbarExtend,type ToolbarExtendPlugin } from \"../../core\"\r\nimport { ModuleType,useModule } from \"./composables\"\r\nimport { ModuleBlockNode,$createModuleBlockNode,$isModuleBlockNode } from \"./ModuleBlockNode\"\r\nimport { type ModuleContainerAttrType,INSERT_MODULECONTAINER_COMMAND,$createModuleContainerNode,$isModuleContainerNode } from \"./ModuleContainerNode\"\r\nimport { INSERT_MODULE_COMMAND,type ModulePropType } from \"./commands\"\r\nimport { showModuleSelectDialog,findModuleNodeEl,findModuleContainerEl } from \"./utils\"\r\nimport { createDefaultFormData } from \"../../../dynamic-form-panel/utils\"\r\nimport { useElementModule } from '../../core'\r\nimport { showDynamicFormDialoger } from \"../../../dynamic-form-panel\"\r\n\r\n// 编辑器\r\nconst editor = useLexicalComposer()\r\n\r\n// 注册到工具条\r\nregisterDocEditorToolbarExtend({\r\n icon:\"Grid\",\r\n text:\"模块\",\r\n action:async ()=>{\r\n // 插入\r\n editor.dispatchCommand(INSERT_MODULECONTAINER_COMMAND,{ } as ModuleContainerAttrType)\r\n \r\n },\r\n sort:9\r\n} as ToolbarExtendPlugin)\r\n\r\n// 是否是选中模块容器\r\nconst isSelectContainer = ref(false);\r\n\r\n// 使用元素模块集成了模块选中删除以及工具条\r\nconst { isSelected, curSelectKey, curSelectPos,updateActiveViewState } = useElementModule(el=>{\r\n \r\n var modelEl = findModuleNodeEl(el);\r\n var moduleContainerEl = findModuleContainerEl(el);\r\n\r\n\r\n if(modelEl && moduleContainerEl){\r\n isSelectContainer.value = false;\r\n \r\n return modelEl;\r\n }\r\n else if(moduleContainerEl){\r\n\r\n isSelectContainer.value = true;\r\n\r\n return moduleContainerEl;\r\n }\r\n\r\n isSelectContainer.value = false;\r\n return null;\r\n\r\n},(selection)=>{\r\n \r\n const node = $getNodeByKey(curSelectKey.value)\r\n\r\n if(node != null){\r\n\r\n // 工具条\r\n const toolbarList = [];\r\n\r\n // 模块容器\r\n if($isModuleContainerNode(node)){\r\n toolbarList.push(...[\r\n {\r\n title:`编辑模块容器`,icon:\"Edit\",action:async ()=>{\r\n\r\n var result = await showDynamicFormDialoger(\"模块容器\",[\r\n { name:\"class\", title:\"标识类名\", component:\"el-input\", props:{ clearable:true }, defaultValue:\"\" }\r\n ],node.getAttrs())\r\n \r\n editor.update(() => {\r\n node.setAttrs(result)\r\n updateActiveViewState(null);\r\n })\r\n\r\n } \r\n },\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 updateActiveViewState(null);\r\n } \r\n }\r\n ])\r\n }\r\n // 选中模块\r\n else if($isModuleBlockNode(node)){\r\n\r\n const { module } = useModule(node.__name);\r\n\r\n toolbarList.push(...[\r\n {\r\n title:`编辑【${module.title}】`,icon:\"Edit\",action:async ()=>{\r\n\r\n var result = await showDynamicFormDialoger(module.title,module.options,node.__data)\r\n \r\n editor.update(() => {\r\n node.setContent(result)\r\n updateActiveViewState(null);\r\n })\r\n\r\n } \r\n },\r\n {\r\n title:`插入【${module.title}】之前`,icon:\"BottomLeft\",action:async ()=>{\r\n\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 updateActiveViewState(null);\r\n \r\n editor.update(() => {\r\n node.insertBefore($createModuleBlockNode(result.name,defaultData))\r\n updateActiveViewState(null);\r\n })\r\n\r\n } \r\n },\r\n {\r\n title:`插入【${module.title}】之后`,icon:\"BottomRight\",action:async ()=>{\r\n\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 updateActiveViewState(null);\r\n \r\n editor.update(() => {\r\n node.insertAfter($createModuleBlockNode(result.name,defaultData))\r\n updateActiveViewState(null);\r\n })\r\n\r\n } \r\n }\r\n ])\r\n }\r\n\r\n return toolbarList;\r\n }\r\n\r\n return null;\r\n})\r\n\r\n\r\nonMounted(() => {\r\n\r\n if (!editor.hasNodes([ModuleBlockNode])){\r\n throw new Error('ModuleBlockPlugin: 未注册模块模版节点！')\r\n }\r\n\r\n // 注册指令\r\n const unregister = mergeRegister(\r\n // 插入模块容器\r\n editor.registerCommand<ModuleContainerAttrType>(INSERT_MODULECONTAINER_COMMAND,(payload) => { \r\n $insertNodeToNearestRoot($createModuleContainerNode(payload))\r\n return true\r\n },COMMAND_PRIORITY_EDITOR),\r\n // 插入模块\r\n editor.registerCommand<ModulePropType>(INSERT_MODULE_COMMAND,(payload) => {\r\n \r\n if(curSelectKey.value){\r\n\r\n const node = $getNodeByKey(curSelectKey.value);\r\n\r\n if($isModuleContainerNode(node)){\r\n node.append($createModuleBlockNode(payload.name,payload.data))\r\n }\r\n }\r\n \r\n return true\r\n },COMMAND_PRIORITY_EDITOR)\r\n\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-mark\" :class=\"{box:isSelectContainer}\" v-if=\"isSelected\" :style=\"curSelectPos\">\r\n \r\n </div>\r\n</template>\r\n"],"names":[],"mappings":"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"}

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

@@ -74,6 +74,7 @@ const showModuleSelectDialog = async () => {
     });
   });
 };
+const ElAttrList = ["src", "alt", "poster", "href", "_target"];
 const createHtml = (template, data) => {
   const parser = new DOMParser();
   const element = parser.parseFromString(template, "text/html");
@@ -83,7 +84,7 @@ const createHtml = (template, data) => {
       const el = list[i];
       const val = data[key];
       if (el.nodeType != 3) {
-        if (["src", "alt", "poster"].filter((attr) => el.hasAttribute(`data-${key}-${attr}`)).some((attr) => el.setAttribute(attr, val))) {
+        if (ElAttrList.filter((attr) => el.hasAttribute(`data-${key}-${attr}`)).some((attr) => el.setAttribute(attr, val))) {
           break;
         } else if (el.hasAttribute(`data-${key}`)) {
           el.textContent = val;
@@ -110,7 +111,7 @@ const createModuleMetaData = (html, options) => {
       const el = list[i];
       const val = "";
       if (el.nodeType != 3) {
-        if (["src", "alt", "poster"].filter((attr) => el.hasAttribute(`data-${item.name}-${attr}`)).some((attr) => data[item.name] = el.getAttribute(attr))) {
+        if (ElAttrList.filter((attr) => el.hasAttribute(`data-${item.name}-${attr}`)).some((attr) => data[item.name] = el.getAttribute(attr))) {
           break;
         } else if (el.hasAttribute(`data-${item.name}`)) {
           data[item.name] = el.textContent;