npm - @maketribe/ms-app - Versions diffs - 3.2.4 → 3.2.6 - Mend

@maketribe/ms-app 3.2.4 → 3.2.6

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

package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/ImageEditPanel.js CHANGED Viewed

@@ -5,7 +5,6 @@ const dm = require("@maketribe/dm");
 const elementPlus = require("element-plus");
 const icons = require("@element-plus/icons-vue");
 const MsMaterialTable = require("../../../../../modules/ms/dataviews/ms-material/MsMaterialTable.js");
-require("@maketribe/request");
 const index = require("../../../../../modules/ms/components/material-list/index.js");
 const utils = require("@maketribe/utils");
 require("../../../image-cropper/index.js");
@@ -86,6 +85,9 @@ const ImageEditPanelComponent = /* @__PURE__ */ vue.defineComponent({
         return {
           ...attrs
         };
+      },
+      setSrc: (src) => {
+        attrs.src = src;
       }
     });
     return () => {
@@ -240,14 +242,14 @@ const ShowImageEditPanel = async (attrs) => {
       return (_a = imageEditPanelRef.value) == null ? void 0 : _a.getResult();
     });
     const toCropImageHandle = async () => {
+      var _a;
       if (editResult.value.src) {
         var result = await imageCropperApi.ImageCropper({
           src: editResult.value.src
         });
         if (result.data) {
-          attrs.src = result.data;
+          (_a = imageEditPanelRef.value) == null ? void 0 : _a.setSrc(result.data);
         }
-        selectState.value = "attrs";
       }
     };
     const handleCancelClick = () => {
@@ -256,7 +258,9 @@ const ShowImageEditPanel = async (attrs) => {
     };
     const handleConfirmClick = () => {
       dialogInstance.destroy();
-      resolve(editResult.value);
+      resolve({
+        ...editResult.value
+      });
     };
     const dialogInstance = dm.Dialoger.customRender({
       title: "素材选择",
@@ -274,7 +278,7 @@ const ShowImageEditPanel = async (attrs) => {
       footer: () => {
         let nextBtns = [vue.createVNode(elementPlus.ElButton, {
           "type": "primary",
-          "onClick": toCropImageHandle
+          "onClick": () => selectState.value = "attrs"
         }, {
           default: () => [vue.createTextVNode("下一步")]
         })];
@@ -284,6 +288,11 @@ const ShowImageEditPanel = async (attrs) => {
             "onClick": () => selectState.value = "select"
           }, {
             default: () => [vue.createTextVNode("重新选图")]
+          }), vue.createVNode(elementPlus.ElButton, {
+            "type": "primary",
+            "onClick": toCropImageHandle
+          }, {
+            default: () => [vue.createTextVNode("裁切图")]
           }), vue.createVNode(elementPlus.ElButton, {
             "type": "primary",
             "onClick": handleConfirmClick

package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/ImageEditPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ImageEditPanel.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/ImageEditPanel.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 { MsMaterial, MsMaterialTable } from \"../../../../../modules/ms/dataviews/ms-material\";\r\nimport { MKMaterialList } from \"../../../../../modules/ms/components/material-list\";\r\nimport { MKImageCropperContent } from \"../../../image-cropper\"\r\nimport { fileSelect } from \"@maketribe/utils\"\r\nimport { ImageCropper } from \"../../../image-cropper\"\r\n\r\n// 选择状态\r\nconst selectState = ref(\"select\");\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({ getResult:()=>{ return {...attrs} } });\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 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 ShowImageEditPanel = 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\r\n if(result.data){\r\n attrs.src = result.data;\r\n }\r\n \r\n selectState.value = 'attrs';\r\n }\r\n \r\n }\r\n\r\n // 取消编辑\r\n const handleCancelClick = () => {\r\n dialogInstance.destroy();\r\n reject();\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={toCropImageHandle}>\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={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","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","src","getList","find","item","path","selectImage","file","fileSelect","accept","fileRender","FileReader","onload","data","target","result","readAsDataURL","getResult","ImageView","_createVNode","ElImage","error","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","ShowImageEditPanel","Promise","resolve","reject","imageEditPanelRef","editResult","toCropImageHandle","ImageCropper","handleCancelClick","dialogInstance","destroy","handleConfirmClick","Dialoger","customRender","title","class","onClose","body","h","footer","nextBtns","onClick","_Fragment"],"mappings":";;;;;;;;;;;;AAcA,SAAAA,QAAAC,GAAA;AAAA,SAAA,OAAAA,MAAA,cAAAC,OAAAC,UAAAC,SAAAC,KAAAJ,CAAA,MAAAK,qBAAAA,CAAAA,IAAA,QAAAL,CAAA;AAAA;AACA,MAAMM,cAAcC,IAAAA,IAAI,QAAQ;AAKhC,MAAMC,0BAA0BC,oBAAAA,gBAAgB;AAAA,EAC9CC,MAAM;AAAA,EACNC,OAAO,CAAC,OAAO;AAAA,EACfC,MAAMD,OAAM;AAAA,IAAEE;AAAAA,EAAO,GAAE;AAErB,UAAMC,QAAQC,IAAAA,SAASJ,MAAMG,KAAK;AAClC,UAAME,gBAAgBD,IAAAA,SAAS,IAAIE,gBAAAA,gBAAiB,CAAA;AACpD,UAAMC,SAASC,IAAAA,SAAc;AAAA,MAC3BC,IAAIC,GAAE;AACJP,cAAMI,SAAS,GAAGG,EAAEC,CAAC,IAAID,EAAEE,CAAC,IAAIF,EAAEG,CAAC,IAAIH,EAAEI,CAAC;AAAA,MAC3C;AAAA,MACDC,MAAK;AACH,YAAIC,OAAOb,MAAMI,OAAOU,MAAM,QAAQ;AACtC,YAAGD,KAAKE,UAAU,GAAE;AAClB,iBAAO;AAAA,YAACP,GAAEK,KAAK,CAAC;AAAA,YAAEJ,GAAEI,KAAK,CAAC;AAAA,YAAEH,GAAEG,KAAK,CAAC;AAAA,YAAEF,GAAEE,KAAK,CAAC;AAAA;QAChD,WACQA,KAAKE,UAAU,GAAE;AACvB,iBAAO;AAAA,YAACP,GAAEK,KAAK,CAAC;AAAA,YAAEJ,GAAEI,KAAK,CAAC;AAAA,YAAEH,GAAEG,KAAK,CAAC;AAAA,YAAEF,GAAEE,KAAK,CAAC;AAAA;QAChD,WACQA,KAAKE,UAAU,GAAE;AACvB,iBAAO;AAAA,YAACP,GAAEK,KAAK,CAAC;AAAA,YAAEJ,GAAEI,KAAK,CAAC;AAAA,YAAEH,GAAEG,KAAK,CAAC;AAAA,YAAEF,GAAEE,KAAK,CAAC;AAAA;QAChD,WACQA,KAAKE,UAAU,GAAE;AACvBF,iBAAO,CAAC,IAAG,IAAG,IAAG,EAAE;AAAA,QACrB;AACA,eAAO;AAAA,UAACL,GAAEK,KAAK,CAAC;AAAA,UAAEJ,GAAEI,KAAK,CAAC;AAAA,UAAEH,GAAEG,KAAK,CAAC;AAAA,UAAEF,GAAEE,KAAK,CAAC;AAAA;MAChD;AAAA,IACF,CAAC;AAGDX,kBAAcc,qBAAqBC,GAAG,MAAI;;AACxC,UAAIC,KAAKhB,cAAciB,aAAc,EAAC,CAAC;AACvC,UAAGD,IAAG;AACJlB,cAAMoB,OAAMlB,mBAAcmB,UAAUC,KAAKC,UAAMA,KAAKL,MAAMA,EAAE,MAAhDhB,mBAAmDsB;AAAAA,MACjE,OACI;AACFxB,cAAMoB,MAAM;AAAA,MACd;AAAA,IACF,CAAC;AAGD,UAAMK,cAAc,YAAU;AAE5B,YAAMC,OAAO,MAAMC,iBAAW;AAAA,QAAEC,QAAO;AAAA,MAAS,CAAC;AAEjD,UAAIF,MAAM;AAER,cAAMG,aAAa,IAAIC;AACvBD,mBAAWE,SAAS,OAAOC,SAAW;AACpChC,gBAAMoB,MAAMY,KAAKC,OAAOC;AAAAA;AAG1BL,mBAAWM,cAAcT,IAAI;AAAA,MAC/B;AAAA;AAIF3B,WAAO;AAAA,MAAEqC,WAAUA,MAAI;AAAE,eAAO;AAAA,UAAC,GAAGpC;AAAAA;MAAO;AAAA,IAAE,CAAC;AAE9C,WAAO,MAAI;AAGT,YAAMqC,YAASC,IAAA,YAAAC,qBAAA;AAAA,QAAA,SAAA;AAAA,QAAA,OAAwFvC,MAAMoB;AAAAA,QAAG,OAAA;AAAA,SAAyB;AAAA,QACvIoB,OAAMA,MAAI;AACR,iBAAAF,IAAAA,YAAA,OAAA;AAAA,YAAA,SAAA;AAAA,aAAAA,CAAAA,IAAAA,YAAAG,YAAA,QAAA,MAAA;AAAA,YAAAC,SAAAA,MAAAJ,CAAAA,IAAA,YAAAK,MAAA,SAAA,MAAA,IAAA,CAAA;AAAA,UAAA,CAAA,CAAA,CAAA;AAAA,QAUF;AAAA,MACF,CAAC;AAID,UAAIC,QAAKN,IAAA,YAAAO,oBAAA;AAAA,QAAA,SAAA;AAAA,MAAA,GAAA;AAAA,QAAAH,SAAAA,MAAAJ,CAAAA,IAAA,YAAAQ,uBAAA;AAAA,UAAA,SAAA;AAAA,QAAA,GAAA;AAAA,UAAAJ,SAAAA,MAAAJ,CAAAA,IAAA,YAAAS,sBAAA;AAAA,YAAA,QAEWC,MAAY;AAAA,YAAA,QAAA;AAAA,YAAA,SAAA;AAAA,YAAA,WAA8CvB;AAAAA,UAAW,GAAA;AAAA,YAAAiB,SAAAA,MAAA,CAAAO,oBAAA,QAAA,CAAA;AAAA,UAAA,CAAA,GAGpFZ,SAAS;AAAA,SAAAC,GAAAA,IAAA,YAAAQ,uBAAA;AAAA,UAAA,SAAA;AAAA,QAAA,GAAA;AAAA,UAAAJ,SAAAA,MAAAJ,CAAAA,IAAA,YAAAY,sBAAA;AAAA,YAAA,SAAA;AAAA,YAAA,cAAA;AAAA,YAAA,iBAGiEhD;AAAAA,UAAa,GAAA,IAAA,CAAA;AAAA,SAAAoC,GAAAA,IAAA,YAAAQ,uBAAA;AAAA,UAAA,SAAA;AAAA,QAAA,GAAA;AAAA,UAAAJ,SAAAA,MAAAJ,CAAAA,IAAA,YAAAa,qBAAA;AAAA,YAAA,cAGtEnD,MAAMoB;AAAAA,YAAG,uBAAAgC,YAATpD,MAAMoB,MAAGgC;AAAAA,YAAA,eAAeC,MAAK;AAAA,YAAA,SAAA;AAAA,YAAA,eAAA;AAAA,UAAA,GAAA,IAAA,GAE9ChB,SAAS;AAAA,QAAA,CAAA,CAAA;AAAA,OAEL;AAET,UAAG7C,YAAY8D,SAAS,SAAQ;AAC9BV,gBAAKN,IAAA,YAAAiB,mBAAA;AAAA,UAAA,UAAkB;AAAA,QAAE,GAAA;AAAA,UAAAb,SAAAA,MAAAJ,CAAAA,IAAA,YAAAkB,mBAAA;AAAA,YAAA,QACV;AAAA,UAAE,GAAAvE,QACZoD,SAAS,IAATA,YAAS;AAAA,YAAAK,SAAAA,MAAA,CAATL,SAAS;AAAA,WAAAC,GAAAA,IAAA,YAAAkB,mBAAA;AAAA,YAAA,QAEC;AAAA,UAAE,GAAA;AAAA,YAAAd,SAAAA,MAAAJ,CAAAA,IAAA,YAAAmB,oBAAA;AAAA,cAAA,kBAAA;AAAA,cAAA,SACuBzD;AAAAA,YAAK,GAAA;AAAA,cAAA0C,SAAAA,MAAAJ,CAAAA,IAAA,YAAAoB,wBAAA;AAAA,gBAAA,SAAA;AAAA,cAAA,GAAA;AAAA,gBAAAhB,SAAAA,MAAA,CAAAJ,gBAAAa,YAAAA,SAAAQ,IAAAA,WAAA;AAAA,kBAAA,cAEnB3D,MAAM4D;AAAAA,kBAAG,uBAAAR,YAATpD,MAAM4D,MAAGR;AAAAA,kBAAA,QAAA;AAAA,gBAAA,GAAA;AAAA,kBAAwBS,MAAK;AAAA,gBAAC,GAAA;AAAA,kBAAA,SAAA;AAAA,kBAAA,eAAA;AAAA,gBAAA,CAAA,GAAA,IAAA,CAAA;AAAA,eAAAvB,GAAAA,IAAA,YAAAoB,wBAAA;AAAA,gBAAA,SAAA;AAAA,cAAA,GAAA;AAAA,gBAAAhB,SAAAA,MAAAJ,CAAAA,IAAA,YAAAa,qBAAA;AAAA,kBAAA,cAIvCnD,MAAM8D;AAAAA,kBAAK,uBAAAV,YAAXpD,MAAM8D,QAAKV;AAAAA,kBAAA,SAAA;AAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA;AAAA,eAAAd,GAAAA,IAAA,YAAAoB,wBAAA;AAAA,gBAAA,SAAA;AAAA,cAAA,GAAA;AAAA,gBAAAhB,SAAAA,MAAAJ,CAAAA,IAAA,YAAAa,qBAAA;AAAA,kBAAA,cAIXnD,MAAM+D;AAAAA,kBAAM,uBAAAX,YAAZpD,MAAM+D,SAAMX;AAAAA,kBAAA,SAAA;AAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA;AAAA,eAAAd,GAAAA,IAAA,YAAAoB,wBAAA;AAAA,gBAAA,SAAA;AAAA,cAAA,GAAA;AAAA,gBAAAhB,SAAAA,MAAAJ,CAAAA,IAAA,YAAAa,qBAAA;AAAA,kBAAA,cAIZnD,MAAMgE;AAAAA,kBAAQ,uBAAAZ,YAAdpD,MAAMgE,WAAQZ;AAAAA,kBAAA,SAAA;AAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA;AAAA,eAAAd,GAAAA,IAAA,YAAAoB,wBAAA;AAAA,gBAAA,SAAA;AAAA,cAAA,GAAA;AAAA,gBAAAhB,SAAAA,MAAAJ,CAAAA,IAAA,YAAAa,qBAAA;AAAA,kBAAA,cAIdnD,MAAMiE;AAAAA,kBAAS,uBAAAb,YAAfpD,MAAMiE,YAASb;AAAAA,kBAAA,SAAA;AAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA;AAAA,eAAAd,GAAAA,IAAA,YAAAoB,wBAAA;AAAA,gBAAA,SAAA;AAAA,cAAA,GAAA;AAAA,gBAAAhB,SAAAA,MAAA,CAAAJ,IAAA,YAAA,OAAA;AAAA,kBAAA,SAAA;AAAA,gBAAA,GAAA,CAAAA,IAAAA,YAAAW,OAAAA,MAAAA,CAAAA,IAAAA,gBAAAX,IAAAA,GAAAA,IAAA,YAAAa,qBAAA;AAAA,kBAAA,cAOX/C,OAAOkD,MAAM9C;AAAAA,kBAAC,uBAAA4C,YAAdhD,OAAOkD,MAAM9C,IAAC4C;AAAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA,CAAA,GAAAd,IAAAA,YAAAW,OAAAA,MAAAA,CAAAA,oBAAAX,IAAAA,GAAAA,IAAAA,YAAAa,YAAAA,SAAA;AAAA,kBAAA,cAKd/C,OAAOkD,MAAM7C;AAAAA,kBAAC,uBAAA2C,YAAdhD,OAAOkD,MAAM7C,IAAC2C;AAAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA,CAAA,GAAAd,IAAAA,YAAAW,OAAAA,MAAAA,CAAAA,oBAAAX,IAAAA,GAAAA,IAAAA,YAAAa,YAAAA,SAAA;AAAA,kBAAA,cAMd/C,OAAOkD,MAAM5C;AAAAA,kBAAC,uBAAA0C,YAAdhD,OAAOkD,MAAM5C,IAAC0C;AAAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA,CAAA,GAAAd,IAAAA,YAAAW,OAAAA,MAAAA,CAAAA,oBAAAX,IAAAA,GAAAA,IAAAA,YAAAa,YAAAA,SAAA;AAAA,kBAAA,cAMd/C,OAAOkD,MAAM3C;AAAAA,kBAAC,uBAAAyC,YAAdhD,OAAOkD,MAAM3C,IAACyC;AAAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAAA,cAAA,CAAA,CAAA;AAAA,YAAA,CAAA,CAAA;AAAA,UAAA,CAAA,CAAA;AAAA,SAOpC;AAAA,MACV;AAEA,aAAOR;AAAAA;EAEX;AACF,CAAC;AAOYsB,MAAAA,qBAAsB,OAAQlE,UAAc;AACvD,SAAO,IAAImE,QAAQ,CAACC,SAAQC,WAAW;AAGrC7E,gBAAY8D,QAAQtD,MAAMoB,MAAM,UAAQ;AAExC,UAAMkD,oBAAoB7E,QAAS,IAAI;AACvC,UAAM8E,aAAalE,IAAAA,SAAc,MAAA;;AAAIiE,qCAAkBhB,UAAlBgB,mBAAyBlC;AAAAA,KAAW;AAGzE,UAAMoC,oBAAoB,YAAU;AAElC,UAAGD,WAAWjB,MAAMlC,KAAI;AACtB,YAAIc,SAAS,MAAMuC,6BAAa;AAAA,UAAErD,KAAKmD,WAAWjB,MAAMlC;AAAAA,QAAG,CAAC;AAE5D,YAAGc,OAAOF,MAAK;AACbhC,gBAAMoB,MAAMc,OAAOF;AAAAA,QACrB;AAEAxC,oBAAY8D,QAAQ;AAAA,MACtB;AAAA;AAKF,UAAMoB,oBAAoBA,MAAM;AAC9BC,qBAAeC,QAAO;AACtBP;;AAIF,UAAMQ,qBAAqBA,MAAM;AAC/BF,qBAAeC,QAAO;AACtBR,cAAQG,WAAWjB,KAAK;AAAA;AAG1B,UAAMqB,iBAAiBG,GAAQ,SAACC,aAAa;AAAA,MAC3CC,OAAO;AAAA,MACPC,OAAO;AAAA,MACPnB,OAAO;AAAA,MACPoB,SAASA,MAAM;AACbP,uBAAeC,QAAO;AAAA,MACvB;AAAA,MACDO,MAAMA,MAAM;AACV,eAAOC,IAAAA,EAAE1F,yBAAwB;AAAA,UAACM;AAAAA,UAAMP,KAAIgB,OAAG6D,kBAAkBhB,QAAQ7C;AAAAA,QAAC,CAAC;AAAA,MAC5E;AAAA,MACD4E,QAAQA,MAAM;AAGZ,YAAIC,WAAW,CAAAhD,IAAA,YAAAS,sBAAA;AAAA,UAAA,QAAA;AAAA,UAAA,WACqByB;AAAAA,QAAiB,GAAA;AAAA,UAAA9B,SAAAA,MAAA,CAAAO,oBAAA,KAAA,CAAA;AAAA,QAGpD,CAAA,CAAA;AAED,YAAGzD,YAAY8D,SAAS,SAAQ;AAC9BgC,qBAAW,CAAAhD,IAAA,YAAAS,sBAAA;AAAA,YAAA,QAAA;AAAA,YAAA,WACyBwC,MAAI/F,YAAY8D,QAAM;AAAA,UAAQ,GAAA;AAAA,YAAAZ,SAAAA,MAAA,CAAAO,oBAAA,MAAA,CAAA;AAAA,WAAAX,GAAAA,IAAA,YAAAS,sBAAA;AAAA,YAAA,QAAA;AAAA,YAAA,WAG9B8B;AAAAA,UAAkB,GAAA;AAAA,YAAAnC,SAAAA,MAAA,CAAAO,oBAAA,IAAA,CAAA;AAAA,UAGrD,CAAA,CAAA;AAAA,QACH;AAEA,eAAAX,IAAA,YAAAkD,IAAA,UAAAlD,MAAAA,CAAAA,IAAAA,YAAAS,YAAAA,UAAA;AAAA,UAAA,WAEuB2B;AAAAA,QAAiB,GAAA;AAAA,UAAAhC,SAAAA,MAAA,CAAAO,oBAAA,IAAA,CAAA;AAAA,QAAA,CAAA,GAAA,GAChCqC,QAAQ,CAAA;AAAA,MAGlB;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACH;;"}
1	+ {"version":3,"file":"ImageEditPanel.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/ImageEditPanel.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 { MsMaterial, MsMaterialTable } from \"../../../../../modules/ms/dataviews/ms-material\";\r\nimport { MKMaterialList } from \"../../../../../modules/ms/components/material-list\";\r\nimport { MKImageCropperContent } from \"../../../image-cropper\"\r\nimport { fileSelect } from \"@maketribe/utils\"\r\nimport { ImageCropper } from \"../../../image-cropper\"\r\n\r\n// 选择状态\r\nconst selectState = ref(\"select\");\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 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 ShowImageEditPanel = 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 reject();\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","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","src","getList","find","item","path","selectImage","file","fileSelect","accept","fileRender","FileReader","onload","data","target","result","readAsDataURL","getResult","setSrc","ImageView","_createVNode","ElImage","error","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","ShowImageEditPanel","Promise","resolve","reject","imageEditPanelRef","editResult","toCropImageHandle","ImageCropper","handleCancelClick","dialogInstance","destroy","handleConfirmClick","Dialoger","customRender","title","class","onClose","body","h","footer","nextBtns","onClick","_Fragment"],"mappings":";;;;;;;;;;;AAcA,SAAAA,QAAAC,GAAA;AAAA,SAAA,OAAAA,MAAA,cAAAC,OAAAC,UAAAC,SAAAC,KAAAJ,CAAA,MAAAK,qBAAAA,CAAAA,IAAA,QAAAL,CAAA;AAAA;AACA,MAAMM,cAAcC,IAAAA,IAAI,QAAQ;AAKhC,MAAMC,0BAA0BC,oBAAAA,gBAAgB;AAAA,EAC9CC,MAAM;AAAA,EACNC,OAAO,CAAC,OAAO;AAAA,EACfC,MAAMD,OAAM;AAAA,IAAEE;AAAAA,EAAO,GAAE;AAErB,UAAMC,QAAQC,IAAAA,SAASJ,MAAMG,KAAK;AAClC,UAAME,gBAAgBD,IAAAA,SAAS,IAAIE,gBAAAA,gBAAiB,CAAA;AACpD,UAAMC,SAASC,IAAAA,SAAc;AAAA,MAC3BC,IAAIC,GAAE;AACJP,cAAMI,SAAS,GAAGG,EAAEC,CAAC,IAAID,EAAEE,CAAC,IAAIF,EAAEG,CAAC,IAAIH,EAAEI,CAAC;AAAA,MAC3C;AAAA,MACDC,MAAK;AACH,YAAIC,OAAOb,MAAMI,OAAOU,MAAM,QAAQ;AACtC,YAAGD,KAAKE,UAAU,GAAE;AAClB,iBAAO;AAAA,YAACP,GAAEK,KAAK,CAAC;AAAA,YAAEJ,GAAEI,KAAK,CAAC;AAAA,YAAEH,GAAEG,KAAK,CAAC;AAAA,YAAEF,GAAEE,KAAK,CAAC;AAAA;QAChD,WACQA,KAAKE,UAAU,GAAE;AACvB,iBAAO;AAAA,YAACP,GAAEK,KAAK,CAAC;AAAA,YAAEJ,GAAEI,KAAK,CAAC;AAAA,YAAEH,GAAEG,KAAK,CAAC;AAAA,YAAEF,GAAEE,KAAK,CAAC;AAAA;QAChD,WACQA,KAAKE,UAAU,GAAE;AACvB,iBAAO;AAAA,YAACP,GAAEK,KAAK,CAAC;AAAA,YAAEJ,GAAEI,KAAK,CAAC;AAAA,YAAEH,GAAEG,KAAK,CAAC;AAAA,YAAEF,GAAEE,KAAK,CAAC;AAAA;QAChD,WACQA,KAAKE,UAAU,GAAE;AACvBF,iBAAO,CAAC,IAAG,IAAG,IAAG,EAAE;AAAA,QACrB;AACA,eAAO;AAAA,UAACL,GAAEK,KAAK,CAAC;AAAA,UAAEJ,GAAEI,KAAK,CAAC;AAAA,UAAEH,GAAEG,KAAK,CAAC;AAAA,UAAEF,GAAEE,KAAK,CAAC;AAAA;MAChD;AAAA,IACF,CAAC;AAGDX,kBAAcc,qBAAqBC,GAAG,MAAI;;AACxC,UAAIC,KAAKhB,cAAciB,aAAc,EAAC,CAAC;AACvC,UAAGD,IAAG;AACJlB,cAAMoB,OAAMlB,mBAAcmB,UAAUC,KAAKC,UAAMA,KAAKL,MAAMA,EAAE,MAAhDhB,mBAAmDsB;AAAAA,MACjE,OACI;AACFxB,cAAMoB,MAAM;AAAA,MACd;AAAA,IACF,CAAC;AAGD,UAAMK,cAAc,YAAU;AAE5B,YAAMC,OAAO,MAAMC,iBAAW;AAAA,QAAEC,QAAO;AAAA,MAAS,CAAC;AAEjD,UAAIF,MAAM;AAER,cAAMG,aAAa,IAAIC;AACvBD,mBAAWE,SAAS,OAAOC,SAAW;AACpChC,gBAAMoB,MAAMY,KAAKC,OAAOC;AAAAA;AAG1BL,mBAAWM,cAAcT,IAAI;AAAA,MAC/B;AAAA;AAIF3B,WAAO;AAAA,MACLqC,WAAUA,MAAI;AAAE,eAAO;AAAA,UAAC,GAAGpC;AAAAA;MAAQ;AAAA,MACnCqC,QAAQjB,SAAa;AAAGpB,cAAMoB,MAAMA;AAAAA,MAAI;AAAA,IAC1C,CAAC;AAED,WAAO,MAAI;AAGT,YAAMkB,YAASC,IAAA,YAAAC,qBAAA;AAAA,QAAA,SAAA;AAAA,QAAA,OAAwFxC,MAAMoB;AAAAA,QAAG,OAAA;AAAA,SAAyB;AAAA,QACvIqB,OAAMA,MAAI;AACR,iBAAAF,IAAAA,YAAA,OAAA;AAAA,YAAA,SAAA;AAAA,aAAAA,CAAAA,IAAAA,YAAAG,YAAA,QAAA,MAAA;AAAA,YAAAC,SAAAA,MAAAJ,CAAAA,IAAA,YAAAK,MAAA,SAAA,MAAA,IAAA,CAAA;AAAA,UAAA,CAAA,CAAA,CAAA;AAAA,QAUF;AAAA,MACF,CAAC;AAID,UAAIC,QAAKN,IAAA,YAAAO,oBAAA;AAAA,QAAA,SAAA;AAAA,MAAA,GAAA;AAAA,QAAAH,SAAAA,MAAAJ,CAAAA,IAAA,YAAAQ,uBAAA;AAAA,UAAA,SAAA;AAAA,QAAA,GAAA;AAAA,UAAAJ,SAAAA,MAAAJ,CAAAA,IAAA,YAAAS,sBAAA;AAAA,YAAA,QAEWC,MAAY;AAAA,YAAA,QAAA;AAAA,YAAA,SAAA;AAAA,YAAA,WAA8CxB;AAAAA,UAAW,GAAA;AAAA,YAAAkB,SAAAA,MAAA,CAAAO,oBAAA,QAAA,CAAA;AAAA,UAAA,CAAA,GAGpFZ,SAAS;AAAA,SAAAC,GAAAA,IAAA,YAAAQ,uBAAA;AAAA,UAAA,SAAA;AAAA,QAAA,GAAA;AAAA,UAAAJ,SAAAA,MAAAJ,CAAAA,IAAA,YAAAY,sBAAA;AAAA,YAAA,SAAA;AAAA,YAAA,cAAA;AAAA,YAAA,iBAGiEjD;AAAAA,UAAa,GAAA,IAAA,CAAA;AAAA,SAAAqC,GAAAA,IAAA,YAAAQ,uBAAA;AAAA,UAAA,SAAA;AAAA,QAAA,GAAA;AAAA,UAAAJ,SAAAA,MAAAJ,CAAAA,IAAA,YAAAa,qBAAA;AAAA,YAAA,cAGtEpD,MAAMoB;AAAAA,YAAG,uBAAAiC,YAATrD,MAAMoB,MAAGiC;AAAAA,YAAA,eAAeC,MAAK;AAAA,YAAA,SAAA;AAAA,YAAA,eAAA;AAAA,UAAA,GAAA,IAAA,GAE9ChB,SAAS;AAAA,QAAA,CAAA,CAAA;AAAA,OAEL;AAET,UAAG9C,YAAY+D,SAAS,SAAQ;AAC9BV,gBAAKN,IAAA,YAAAiB,mBAAA;AAAA,UAAA,UAAkB;AAAA,QAAE,GAAA;AAAA,UAAAb,SAAAA,MAAAJ,CAAAA,IAAA,YAAAkB,mBAAA;AAAA,YAAA,QACV;AAAA,UAAE,GAAAxE,QACZqD,SAAS,IAATA,YAAS;AAAA,YAAAK,SAAAA,MAAA,CAATL,SAAS;AAAA,WAAAC,GAAAA,IAAA,YAAAkB,mBAAA;AAAA,YAAA,QAEC;AAAA,UAAE,GAAA;AAAA,YAAAd,SAAAA,MAAAJ,CAAAA,IAAA,YAAAmB,oBAAA;AAAA,cAAA,kBAAA;AAAA,cAAA,SACuB1D;AAAAA,YAAK,GAAA;AAAA,cAAA2C,SAAAA,MAAAJ,CAAAA,IAAA,YAAAoB,wBAAA;AAAA,gBAAA,SAAA;AAAA,cAAA,GAAA;AAAA,gBAAAhB,SAAAA,MAAA,CAAAJ,gBAAAa,YAAAA,SAAAQ,IAAAA,WAAA;AAAA,kBAAA,cAEnB5D,MAAM6D;AAAAA,kBAAG,uBAAAR,YAATrD,MAAM6D,MAAGR;AAAAA,kBAAA,QAAA;AAAA,gBAAA,GAAA;AAAA,kBAAwBS,MAAK;AAAA,gBAAC,GAAA;AAAA,kBAAA,SAAA;AAAA,kBAAA,eAAA;AAAA,gBAAA,CAAA,GAAA,IAAA,CAAA;AAAA,eAAAvB,GAAAA,IAAA,YAAAoB,wBAAA;AAAA,gBAAA,SAAA;AAAA,cAAA,GAAA;AAAA,gBAAAhB,SAAAA,MAAAJ,CAAAA,IAAA,YAAAa,qBAAA;AAAA,kBAAA,cAIvCpD,MAAM+D;AAAAA,kBAAK,uBAAAV,YAAXrD,MAAM+D,QAAKV;AAAAA,kBAAA,SAAA;AAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA;AAAA,eAAAd,GAAAA,IAAA,YAAAoB,wBAAA;AAAA,gBAAA,SAAA;AAAA,cAAA,GAAA;AAAA,gBAAAhB,SAAAA,MAAAJ,CAAAA,IAAA,YAAAa,qBAAA;AAAA,kBAAA,cAIXpD,MAAMgE;AAAAA,kBAAM,uBAAAX,YAAZrD,MAAMgE,SAAMX;AAAAA,kBAAA,SAAA;AAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA;AAAA,eAAAd,GAAAA,IAAA,YAAAoB,wBAAA;AAAA,gBAAA,SAAA;AAAA,cAAA,GAAA;AAAA,gBAAAhB,SAAAA,MAAAJ,CAAAA,IAAA,YAAAa,qBAAA;AAAA,kBAAA,cAIZpD,MAAMiE;AAAAA,kBAAQ,uBAAAZ,YAAdrD,MAAMiE,WAAQZ;AAAAA,kBAAA,SAAA;AAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA;AAAA,eAAAd,GAAAA,IAAA,YAAAoB,wBAAA;AAAA,gBAAA,SAAA;AAAA,cAAA,GAAA;AAAA,gBAAAhB,SAAAA,MAAAJ,CAAAA,IAAA,YAAAa,qBAAA;AAAA,kBAAA,cAIdpD,MAAMkE;AAAAA,kBAAS,uBAAAb,YAAfrD,MAAMkE,YAASb;AAAAA,kBAAA,SAAA;AAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA;AAAA,eAAAd,GAAAA,IAAA,YAAAoB,wBAAA;AAAA,gBAAA,SAAA;AAAA,cAAA,GAAA;AAAA,gBAAAhB,SAAAA,MAAA,CAAAJ,IAAA,YAAA,OAAA;AAAA,kBAAA,SAAA;AAAA,gBAAA,GAAA,CAAAA,IAAAA,YAAAW,OAAAA,MAAAA,CAAAA,IAAAA,gBAAAX,IAAAA,GAAAA,IAAA,YAAAa,qBAAA;AAAA,kBAAA,cAOXhD,OAAOmD,MAAM/C;AAAAA,kBAAC,uBAAA6C,YAAdjD,OAAOmD,MAAM/C,IAAC6C;AAAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA,CAAA,GAAAd,IAAAA,YAAAW,OAAAA,MAAAA,CAAAA,oBAAAX,IAAAA,GAAAA,IAAAA,YAAAa,YAAAA,SAAA;AAAA,kBAAA,cAKdhD,OAAOmD,MAAM9C;AAAAA,kBAAC,uBAAA4C,YAAdjD,OAAOmD,MAAM9C,IAAC4C;AAAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA,CAAA,GAAAd,IAAAA,YAAAW,OAAAA,MAAAA,CAAAA,oBAAAX,IAAAA,GAAAA,IAAAA,YAAAa,YAAAA,SAAA;AAAA,kBAAA,cAMdhD,OAAOmD,MAAM7C;AAAAA,kBAAC,uBAAA2C,YAAdjD,OAAOmD,MAAM7C,IAAC2C;AAAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA,CAAA,GAAAd,IAAAA,YAAAW,OAAAA,MAAAA,CAAAA,oBAAAX,IAAAA,GAAAA,IAAAA,YAAAa,YAAAA,SAAA;AAAA,kBAAA,cAMdhD,OAAOmD,MAAM5C;AAAAA,kBAAC,uBAAA0C,YAAdjD,OAAOmD,MAAM5C,IAAC0C;AAAAA,kBAAA,eAAA;AAAA,gBAAA,GAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAAA,cAAA,CAAA,CAAA;AAAA,YAAA,CAAA,CAAA;AAAA,UAAA,CAAA,CAAA;AAAA,SAOpC;AAAA,MACV;AAEA,aAAOR;AAAAA;EAEX;AACF,CAAC;AAOYsB,MAAAA,qBAAqB,OAAQnE,UAAc;AACtD,SAAO,IAAIoE,QAAQ,CAACC,SAAQC,WAAW;AAGrC9E,gBAAY+D,QAAQvD,MAAMoB,MAAM,UAAQ;AAExC,UAAMmD,oBAAoB9E,QAAS,IAAI;AACvC,UAAM+E,aAAanE,IAAAA,SAAc,MAAA;;AAAIkE,qCAAkBhB,UAAlBgB,mBAAyBnC;AAAAA,KAAW;AAGzE,UAAMqC,oBAAoB,YAAU;;AAElC,UAAGD,WAAWjB,MAAMnC,KAAI;AACtB,YAAIc,SAAS,MAAMwC,6BAAa;AAAA,UAAEtD,KAAKoD,WAAWjB,MAAMnC;AAAAA,QAAG,CAAC;AAC5D,YAAGc,OAAOF,MAAK;AACbuC,kCAAkBhB,UAAlBgB,mBAAyBlC,OAAOH,OAAOF;AAAAA,QACzC;AAAA,MACF;AAAA;AAKF,UAAM2C,oBAAoBA,MAAM;AAC9BC,qBAAeC,QAAO;AACtBP;;AAIF,UAAMQ,qBAAqBA,MAAM;AAC/BF,qBAAeC,QAAO;AACtBR,cAAQ;AAAA,QAAC,GAAGG,WAAWjB;AAAAA,MAAK,CAAC;AAAA;AAG/B,UAAMqB,iBAAiBG,GAAQ,SAACC,aAAa;AAAA,MAC3CC,OAAO;AAAA,MACPC,OAAO;AAAA,MACPnB,OAAO;AAAA,MACPoB,SAASA,MAAM;AACbP,uBAAeC,QAAO;AAAA,MACvB;AAAA,MACDO,MAAMA,MAAM;AACV,eAAOC,IAAAA,EAAE3F,yBAAwB;AAAA,UAACM;AAAAA,UAAMP,KAAIgB,OAAG8D,kBAAkBhB,QAAQ9C;AAAAA,QAAC,CAAC;AAAA,MAC5E;AAAA,MACD6E,QAAQA,MAAM;AAGZ,YAAIC,WAAW,CAAAhD,IAAA,YAAAS,sBAAA;AAAA,UAAA,QAAA;AAAA,UAAA,WACqBwC,MAAIhG,YAAY+D,QAAQ;AAAA,QAAO,GAAA;AAAA,UAAAZ,SAAAA,MAAA,CAAAO,oBAAA,KAAA,CAAA;AAAA,QAGlE,CAAA,CAAA;AAED,YAAG1D,YAAY+D,SAAS,SAAQ;AAC9BgC,qBAAW,CAAAhD,IAAA,YAAAS,sBAAA;AAAA,YAAA,QAAA;AAAA,YAAA,WACyBwC,MAAIhG,YAAY+D,QAAM;AAAA,UAAQ,GAAA;AAAA,YAAAZ,SAAAA,MAAA,CAAAO,oBAAA,MAAA,CAAA;AAAA,WAAAX,GAAAA,IAAA,YAAAS,sBAAA;AAAA,YAAA,QAAA;AAAA,YAAA,WAG9ByB;AAAAA,UAAiB,GAAA;AAAA,YAAA9B,SAAAA,MAAA,CAAAO,oBAAA,KAAA,CAAA;AAAA,WAAAX,GAAAA,IAAA,YAAAS,sBAAA;AAAA,YAAA,QAAA;AAAA,YAAA,WAGjB8B;AAAAA,UAAkB,GAAA;AAAA,YAAAnC,SAAAA,MAAA,CAAAO,oBAAA,IAAA,CAAA;AAAA,UAGrD,CAAA,CAAA;AAAA,QACH;AAEA,eAAAX,IAAA,YAAAkD,IAAA,UAAAlD,MAAAA,CAAAA,IAAAA,YAAAS,YAAAA,UAAA;AAAA,UAAA,WAEuB2B;AAAAA,QAAiB,GAAA;AAAA,UAAAhC,SAAAA,MAAA,CAAAO,oBAAA,IAAA,CAAA;AAAA,QAAA,CAAA,GAAA,GAChCqC,QAAQ,CAAA;AAAA,MAGlB;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACH;;"}

package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/index.js CHANGED Viewed

@@ -73,7 +73,6 @@ class ImageNode extends LexicalDecoratorBlockNode.DecoratorBlockNode {
           conversion: (domNode) => {
             const src = domNode.getAttribute("src");
             const alt = domNode.getAttribute("alt");
-            console.log(domNode.style.width);
             return domNode.tagName.toLowerCase() == "img" && src != null ? {
               node: $createImageNode({
                 src,

package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/index.ts"],"sourcesContent":["\r\nimport type {\r\n DOMConversionMap,\r\n DOMConversionOutput,\r\n DOMExportOutput,\r\n EditorConfig,\r\n ElementFormatType,\r\n LexicalEditor,\r\n LexicalNode,\r\n NodeKey,\r\n Spread,\r\n LexicalCommand\r\n} from 'lexical'\r\nimport { createCommand } from 'lexical'\r\nimport { DecoratorBlockNode,type SerializedDecoratorBlockNode } from '../../lexical-vue'\r\nimport { h ,type Component} from 'vue'\r\nimport DocImageComponent from './DocImageComponent'\r\n\r\n/*\r\n 图片属性类型\r\n /\r\nexport type ImageAttrs = {\r\n src:string,\r\n alt?:string,\r\n width?:string,\r\n height?:string,\r\n float?:string,\r\n maxWidth?:string,\r\n maxHeight?:string,\r\n margin?:string\r\n};\r\n\r\n/\r\n 图片属性数据\r\n /\r\nexport type ImageAttrData = { name:string, value:string\|null\|undefined }\r\n\r\n/\r\n 图片属性改变\r\n /\r\nexport const IMAGE_ATTRS_CHANGE: LexicalCommand<ImageAttrData> = createCommand('IMAGE_ATTRS_CHANGE')\r\n\r\n\r\n/\r\n 删除图片\r\n /\r\nexport const REMOVE_IMAGE_COMMAND: LexicalCommand<undefined\|null> = createCommand('REMOVE_IMAGE_COMMAND')\r\n\r\n\r\n/\r\n 插入图片指令\r\n /\r\nexport const INSERT_IMAGE_COMMAND: LexicalCommand<ImageAttrs> = createCommand('INSERT_IMAGE_COMMAND')\r\n\r\n/\r\n 图片节点序列化\r\n /\r\nexport type SerializedImageNode = Spread<\r\n {\r\n attrs: ImageAttrs\r\n },\r\n SerializedDecoratorBlockNode\r\n>\r\n\r\n/\r\n 定义图片节点\r\n /\r\nexport class ImageNode extends DecoratorBlockNode {\r\n __attrs: ImageAttrs\r\n\r\n static getType(): string {\r\n return 'Image'\r\n }\r\n\r\n static clone(node: ImageNode): ImageNode {\r\n return new ImageNode(node.__attrs, node.__format, node.__key)\r\n }\r\n\r\n static importJSON(serializedNode: SerializedImageNode): ImageNode {\r\n const node = $createImageNode(serializedNode.attrs)\r\n node.setFormat(serializedNode.format)\r\n return node\r\n }\r\n\r\n constructor(attrs: ImageAttrs, format?: ElementFormatType, key?: NodeKey) {\r\n super(format, key)\r\n this.__attrs = attrs\r\n }\r\n\r\n exportJSON(): SerializedImageNode {\r\n\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n version: 1,\r\n attrs: this.__attrs,\r\n }\r\n }\r\n\r\n exportDOM(): DOMExportOutput {\r\n\r\n const element = document.createElement('img') \r\n\r\n element.setAttribute('src', this.__attrs.src) \r\n\r\n if(this.__attrs.alt != null){\r\n element.setAttribute('alt', this.__attrs.alt ?? \"\")\r\n }\r\n\r\n element.setAttribute(\"style\",this.getStyles().join(\";\"))\r\n \r\n return { element }\r\n }\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n img: (dn: HTMLElement) => {\r\n return {\r\n conversion: (domNode: HTMLElement) => {\r\n const src = domNode.getAttribute('src');\r\n const alt = domNode.getAttribute('alt');\r\n ~~console.log(domNode.style.width);\r\n~~ return domNode.tagName.toLowerCase() == \"img\" && src != null ? { \r\n node:$createImageNode({\r\n src:src,\r\n alt:alt,\r\n width:domNode.style.width,\r\n height:domNode.style.height,\r\n maxWidth:domNode.style.maxWidth \|\| \"100%\",\r\n maxHeight:domNode.style.maxHeight,\r\n margin:domNode.style.margin,\r\n float:domNode.style.float\r\n } as ImageAttrs) \r\n } : null;\r\n },\r\n priority: 0\r\n }\r\n },\r\n }\r\n }\r\n\r\n setFloat(pos?:string){\r\n this.__attrs.float = pos;\r\n }\r\n\r\n getStyles():string[]{\r\n\r\n const style : string[] = [];\r\n\r\n if(this.__attrs.width){\r\n style.push(\"width:\"+this.__attrs.width)\r\n }\r\n if(this.__attrs.height){\r\n style.push(\"height:\"+this.__attrs.height)\r\n }\r\n if(this.__attrs.float){\r\n style.push(\"float:\"+this.__attrs.float)\r\n }\r\n if(this.__attrs.maxWidth){\r\n style.push(\"max-width:\"+this.__attrs.maxWidth)\r\n }\r\n if(this.__attrs.maxHeight){\r\n style.push(\"max-height:\"+this.__attrs.maxHeight)\r\n }\r\n if(this.__attrs.float){\r\n style.push(\"float:\"+this.__attrs.float)\r\n }\r\n if(this.__attrs.margin){\r\n style.push(\"margin:\"+this.__attrs.margin)\r\n }\r\n\r\n return style\r\n }\r\n\r\n updateDOM(): false {\r\n return false\r\n }\r\n\r\n getTextContent(\r\n _includeInert?: boolean \| undefined,\r\n _includeDirectionless?: false \| undefined,\r\n ): string {\r\n return this.__attrs.src\r\n }\r\n\r\n decorate(_editor: LexicalEditor, config: EditorConfig): Component {\r\n const embedBlockTheme = config.theme.embedBlock \|\| {}\r\n return h(DocImageComponent, {\r\n baseClass: embedBlockTheme.base \|\| '',\r\n focusClass: embedBlockTheme.focus \|\| '',\r\n format: this.__format,\r\n nodeKey: this.getKey(),\r\n attrs: this.__attrs\r\n })\r\n }\r\n}\r\n\r\n/\r\n 创建图片节点\r\n * @param src \r\n * @returns \r\n /\r\nexport function $createImageNode(attrs: ImageAttrs): ImageNode {\r\n return new ImageNode(attrs)\r\n}\r\n\r\n/\r\n 判断是否是图片节点\r\n * @param node \r\n * @returns \r\n */\r\nexport function $isImageNode(\r\n node: ImageNode \| LexicalNode \| null \| undefined,\r\n): node is ImageNode {\r\n return node instanceof ImageNode\r\n}\r\n"],"names":["createCommand","DecoratorBlockNode","h"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCa,MAAA,qBAAoDA,sBAAc,oBAAoB;AAMtF,MAAA,uBAAuDA,sBAAc,sBAAsB;AAM3F,MAAA,uBAAmDA,sBAAc,sBAAsB;AAe7F,MAAM,kBAAkBC,0BAAAA,mBAAmB;AAAA,EAiBhD,YAAY,OAAmB,QAA4B,KAAe;AACxE,UAAM,QAAQ,GAAG;AAjBnB;AAkBE,SAAK,UAAU;AAAA,EACjB;AAAA,EAjBA,OAAO,UAAkB;AAChB,WAAA;AAAA,EACT;AAAA,EAEA,OAAO,MAAM,MAA4B;AACvC,WAAO,IAAI,UAAU,KAAK,SAAS,KAAK,UAAU,KAAK,KAAK;AAAA,EAC9D;AAAA,EAEA,OAAO,WAAW,gBAAgD;AAC1D,UAAA,OAAO,iBAAiB,eAAe,KAAK;AAC7C,SAAA,UAAU,eAAe,MAAM;AAC7B,WAAA;AAAA,EACT;AAAA,EAOA,aAAkC;AAEzB,WAAA;AAAA,MACL,GAAG,MAAM,WAAW;AAAA,MACpB,MAAM,KAAK,QAAQ;AAAA,MACnB,SAAS;AAAA,MACT,OAAO,KAAK;AAAA,IAAA;AAAA,EAEhB;AAAA,EAEA,YAA6B;AAErB,UAAA,UAAU,SAAS,cAAc,KAAK;AAE5C,YAAQ,aAAa,OAAO,KAAK,QAAQ,GAAG;AAEzC,QAAA,KAAK,QAAQ,OAAQ,MAAK;AAC3B,cAAQ,aAAa,OAAO,KAAK,QAAQ,OAAO,EAAE;AAAA,IACpD;AAEA,YAAQ,aAAa,SAAQ,KAAK,YAAY,KAAK,GAAG,CAAC;AAEvD,WAAO,EAAE,QAAQ;AAAA,EACnB;AAAA,EAEA,OAAO,YAAqC;AACnC,WAAA;AAAA,MACL,KAAK,CAAC,OAAoB;AAChB,eAAA;AAAA,UACN,YAAY,CAAC,YAAyB;AAC9B,kBAAA,MAAM,QAAQ,aAAa,KAAK;AAChC,kBAAA,MAAM,QAAQ,aAAa,KAAK;~~AAC9B~~,~~oBAAA,IAAI,QAAQ,MAAM,KAAK;AAC/B,~~mBAAO,QAAQ,QAAQ,YAAiB,KAAA,SAAS,OAAO,OAAQ;AAAA,cAC9D,MAAK,iBAAiB;AAAA,gBACpB;AAAA,gBACA;AAAA,gBACA,OAAM,QAAQ,MAAM;AAAA,gBACpB,QAAO,QAAQ,MAAM;AAAA,gBACrB,UAAS,QAAQ,MAAM,YAAY;AAAA,gBACnC,WAAU,QAAQ,MAAM;AAAA,gBACxB,QAAO,QAAQ,MAAM;AAAA,gBACrB,OAAM,QAAQ,MAAM;AAAA,cAAA,CACP;AAAA,YACb,IAAA;AAAA,UACN;AAAA,UACA,UAAU;AAAA,QAAA;AAAA,MAEd;AAAA,IAAA;AAAA,EAEJ;AAAA,EAEA,SAAS,KAAY;AACnB,SAAK,QAAQ,QAAQ;AAAA,EACvB;AAAA,EAEA,YAAoB;AAElB,UAAM,QAAmB,CAAA;AAEtB,QAAA,KAAK,QAAQ,OAAM;AACpB,YAAM,KAAK,WAAS,KAAK,QAAQ,KAAK;AAAA,IACxC;AACG,QAAA,KAAK,QAAQ,QAAO;AACrB,YAAM,KAAK,YAAU,KAAK,QAAQ,MAAM;AAAA,IAC1C;AACG,QAAA,KAAK,QAAQ,OAAM;AACpB,YAAM,KAAK,WAAS,KAAK,QAAQ,KAAK;AAAA,IACxC;AACG,QAAA,KAAK,QAAQ,UAAS;AACvB,YAAM,KAAK,eAAa,KAAK,QAAQ,QAAQ;AAAA,IAC/C;AACG,QAAA,KAAK,QAAQ,WAAU;AACxB,YAAM,KAAK,gBAAc,KAAK,QAAQ,SAAS;AAAA,IACjD;AACG,QAAA,KAAK,QAAQ,OAAM;AACpB,YAAM,KAAK,WAAS,KAAK,QAAQ,KAAK;AAAA,IACxC;AACG,QAAA,KAAK,QAAQ,QAAO;AACrB,YAAM,KAAK,YAAU,KAAK,QAAQ,MAAM;AAAA,IAC1C;AAEO,WAAA;AAAA,EACT;AAAA,EAEA,YAAmB;AACV,WAAA;AAAA,EACT;AAAA,EAEA,eACE,eACA,uBACQ;AACR,WAAO,KAAK,QAAQ;AAAA,EACtB;AAAA,EAEA,SAAS,SAAwB,QAAiC;AAChE,UAAM,kBAAkB,OAAO,MAAM,cAAc,CAAA;AACnD,WAAOC,IAAAA,EAAE,mBAAmB;AAAA,MAC1B,WAAW,gBAAgB,QAAQ;AAAA,MACnC,YAAY,gBAAgB,SAAS;AAAA,MACrC,QAAQ,KAAK;AAAA,MACb,SAAS,KAAK,OAAO;AAAA,MACrB,OAAO,KAAK;AAAA,IAAA,CACb;AAAA,EACH;AACF;AAOO,SAAS,iBAAiB,OAA8B;AACtD,SAAA,IAAI,UAAU,KAAK;AAC5B;;;;;;"}
1	+ {"version":3,"file":"index.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/index.ts"],"sourcesContent":["\r\nimport type {\r\n DOMConversionMap,\r\n DOMConversionOutput,\r\n DOMExportOutput,\r\n EditorConfig,\r\n ElementFormatType,\r\n LexicalEditor,\r\n LexicalNode,\r\n NodeKey,\r\n Spread,\r\n LexicalCommand\r\n} from 'lexical'\r\nimport { createCommand } from 'lexical'\r\nimport { DecoratorBlockNode,type SerializedDecoratorBlockNode } from '../../lexical-vue'\r\nimport { h ,type Component} from 'vue'\r\nimport DocImageComponent from './DocImageComponent'\r\n\r\n/*\r\n 图片属性类型\r\n /\r\nexport type ImageAttrs = {\r\n src:string,\r\n alt?:string,\r\n width?:string,\r\n height?:string,\r\n float?:string,\r\n maxWidth?:string,\r\n maxHeight?:string,\r\n margin?:string\r\n};\r\n\r\n/\r\n 图片属性数据\r\n /\r\nexport type ImageAttrData = { name:string, value:string\|null\|undefined }\r\n\r\n/\r\n 图片属性改变\r\n /\r\nexport const IMAGE_ATTRS_CHANGE: LexicalCommand<ImageAttrData> = createCommand('IMAGE_ATTRS_CHANGE')\r\n\r\n\r\n/\r\n 删除图片\r\n /\r\nexport const REMOVE_IMAGE_COMMAND: LexicalCommand<undefined\|null> = createCommand('REMOVE_IMAGE_COMMAND')\r\n\r\n\r\n/\r\n 插入图片指令\r\n /\r\nexport const INSERT_IMAGE_COMMAND: LexicalCommand<ImageAttrs> = createCommand('INSERT_IMAGE_COMMAND')\r\n\r\n/\r\n 图片节点序列化\r\n /\r\nexport type SerializedImageNode = Spread<\r\n {\r\n attrs: ImageAttrs\r\n },\r\n SerializedDecoratorBlockNode\r\n>\r\n\r\n/\r\n 定义图片节点\r\n /\r\nexport class ImageNode extends DecoratorBlockNode {\r\n __attrs: ImageAttrs\r\n\r\n static getType(): string {\r\n return 'Image'\r\n }\r\n\r\n static clone(node: ImageNode): ImageNode {\r\n return new ImageNode(node.__attrs, node.__format, node.__key)\r\n }\r\n\r\n static importJSON(serializedNode: SerializedImageNode): ImageNode {\r\n const node = $createImageNode(serializedNode.attrs)\r\n node.setFormat(serializedNode.format)\r\n return node\r\n }\r\n\r\n constructor(attrs: ImageAttrs, format?: ElementFormatType, key?: NodeKey) {\r\n super(format, key)\r\n this.__attrs = attrs\r\n }\r\n\r\n exportJSON(): SerializedImageNode {\r\n\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n version: 1,\r\n attrs: this.__attrs,\r\n }\r\n }\r\n\r\n exportDOM(): DOMExportOutput {\r\n\r\n const element = document.createElement('img') \r\n\r\n element.setAttribute('src', this.__attrs.src) \r\n\r\n if(this.__attrs.alt != null){\r\n element.setAttribute('alt', this.__attrs.alt ?? \"\")\r\n }\r\n\r\n element.setAttribute(\"style\",this.getStyles().join(\";\"))\r\n \r\n return { element }\r\n }\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n img: (dn: HTMLElement) => {\r\n return {\r\n conversion: (domNode: HTMLElement) => {\r\n const src = domNode.getAttribute('src');\r\n const alt = domNode.getAttribute('alt');\r\n return domNode.tagName.toLowerCase() == \"img\" && src != null ? { \r\n node:$createImageNode({\r\n src:src,\r\n alt:alt,\r\n width:domNode.style.width,\r\n height:domNode.style.height,\r\n maxWidth:domNode.style.maxWidth \|\| \"100%\",\r\n maxHeight:domNode.style.maxHeight,\r\n margin:domNode.style.margin,\r\n float:domNode.style.float\r\n } as ImageAttrs) \r\n } : null;\r\n },\r\n priority: 0\r\n }\r\n },\r\n }\r\n }\r\n\r\n setFloat(pos?:string){\r\n this.__attrs.float = pos;\r\n }\r\n\r\n getStyles():string[]{\r\n\r\n const style : string[] = [];\r\n\r\n if(this.__attrs.width){\r\n style.push(\"width:\"+this.__attrs.width)\r\n }\r\n if(this.__attrs.height){\r\n style.push(\"height:\"+this.__attrs.height)\r\n }\r\n if(this.__attrs.float){\r\n style.push(\"float:\"+this.__attrs.float)\r\n }\r\n if(this.__attrs.maxWidth){\r\n style.push(\"max-width:\"+this.__attrs.maxWidth)\r\n }\r\n if(this.__attrs.maxHeight){\r\n style.push(\"max-height:\"+this.__attrs.maxHeight)\r\n }\r\n if(this.__attrs.float){\r\n style.push(\"float:\"+this.__attrs.float)\r\n }\r\n if(this.__attrs.margin){\r\n style.push(\"margin:\"+this.__attrs.margin)\r\n }\r\n\r\n return style\r\n }\r\n\r\n updateDOM(): false {\r\n return false\r\n }\r\n\r\n getTextContent(\r\n _includeInert?: boolean \| undefined,\r\n _includeDirectionless?: false \| undefined,\r\n ): string {\r\n return this.__attrs.src\r\n }\r\n\r\n decorate(_editor: LexicalEditor, config: EditorConfig): Component {\r\n const embedBlockTheme = config.theme.embedBlock \|\| {}\r\n return h(DocImageComponent, {\r\n baseClass: embedBlockTheme.base \|\| '',\r\n focusClass: embedBlockTheme.focus \|\| '',\r\n format: this.__format,\r\n nodeKey: this.getKey(),\r\n attrs: this.__attrs\r\n })\r\n }\r\n}\r\n\r\n/\r\n 创建图片节点\r\n * @param src \r\n * @returns \r\n /\r\nexport function $createImageNode(attrs: ImageAttrs): ImageNode {\r\n return new ImageNode(attrs)\r\n}\r\n\r\n/\r\n 判断是否是图片节点\r\n * @param node \r\n * @returns \r\n */\r\nexport function $isImageNode(\r\n node: ImageNode \| LexicalNode \| null \| undefined,\r\n): node is ImageNode {\r\n return node instanceof ImageNode\r\n}\r\n"],"names":["createCommand","DecoratorBlockNode","h"],"mappings":"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"}

package/dist/cjs/components/basic/doc-editor/plugins/ImagePlugin/index.vue.js CHANGED Viewed

@@ -54,6 +54,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             maxWidth: "100%",
             maxHeight: "",
             margin: ""
+          }).then((data) => {
+            editor.dispatchCommand(index.INSERT_IMAGE_COMMAND, data);
           });
         },
         sort: 11

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { $insertNodeToNearestRoot,mergeRegister,mediaFileReader,isMimeType } from '@lexical/utils'\r\nimport { COMMAND_PRIORITY_EDITOR,COMMAND_PRIORITY_LOW,$getSelection } from 'lexical'\r\nimport { DRAG_DROP_PASTE } from '@lexical/rich-text'\r\nimport { useLexicalComposer } from '../../lexical-vue'\r\nimport { onMounted, onUnmounted } from 'vue'\r\nimport { INSERT_IMAGE_COMMAND,$createImageNode,ImageNode,type ImageAttrs } from './index'\r\nimport { RegisterToolbarExtend,type ToolbarExtendPlugin } from \"../ToolbarPlugin/defines\"\r\nimport { ShowImageEditPanel } from \"./ImageEditPanel\"\r\n\r\nconst ACCEPTABLE_IMAGE_TYPES = [\r\n 'image/',\r\n 'image/heic',\r\n 'image/heif',\r\n 'image/gif',\r\n 'image/webp',\r\n]\r\n\r\nconst editor = useLexicalComposer()\r\n\r\nonMounted(() => {\r\n\r\n if (!editor.hasNodes([ImageNode])){\r\n throw new Error('ImagePlugin: 图片节点未注册！')\r\n }\r\n\r\n // 注册到工具条\r\n RegisterToolbarExtend({\r\n icon:\"Picture\",\r\n text:\"图片\",\r\n action:async ()=>{\r\n // 显示图片编辑面板\r\n ShowImageEditPanel({\r\n src:\"\", alt:\"\", width:\"\", height:\"\", maxWidth:\"100%\", maxHeight:\"\", margin:\"\"\r\n } as ImageAttrs);\r\n },\r\n sort:11\r\n } as ToolbarExtendPlugin)\r\n\r\n // 注册指令\r\n const unregister = mergeRegister(\r\n\r\n // 插入图片\r\n editor.registerCommand<ImageAttrs>(INSERT_IMAGE_COMMAND,(payload) => {\r\n $insertNodeToNearestRoot($createImageNode(payload))\r\n return true\r\n },COMMAND_PRIORITY_EDITOR),\r\n\r\n // 剪切板图片\r\n editor.registerCommand(DRAG_DROP_PASTE,(files) => {\r\n\r\n (async () => {\r\n\r\n const filesResult = await mediaFileReader(files, [ACCEPTABLE_IMAGE_TYPES].flatMap((x) => x))\r\n\r\n for (const {file, result} of filesResult) {\r\n\r\n if (isMimeType(file, ACCEPTABLE_IMAGE_TYPES)) {\r\n\r\n editor.dispatchCommand(INSERT_IMAGE_COMMAND, {\r\n src:result,\r\n alt:file.name,\r\n maxWidth:\":100%\"\r\n } as ImageAttrs)\r\n }\r\n }\r\n })()\r\n\r\n return true\r\n },COMMAND_PRIORITY_LOW)\r\n );\r\n\r\n onUnmounted(() => unregister())\r\n})\r\n</script>\r\n\r\n<template />\r\n"],"names":["useLexicalComposer","onMounted","ImageNode","RegisterToolbarExtend","ShowImageEditPanel","~~mergeRegister~~","~~INSERT_IMAGE_COMMAND~~","$insertNodeToNearestRoot","$createImageNode","COMMAND_PRIORITY_EDITOR","DRAG_DROP_PASTE","mediaFileReader","isMimeType","COMMAND_PRIORITY_LOW","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,UAAM,yBAAyB;AAAA,MAC7B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAGF,UAAM,SAASA,mBAAAA;AAEfC,QAAAA,UAAU,MAAM;AAEd,UAAI,CAAC,OAAO,SAAS,CAACC,MAAAA,SAAS,CAAC,GAAE;AAC1B,cAAA,IAAI,MAAM,uBAAuB;AAAA,MACzC;AAGsBC,oCAAA;AAAA,QACpB,MAAK;AAAA,QACL,MAAK;AAAA,QACL,QAAO,YAAU;AAEIC,4CAAA;AAAA,YACjB,KAAI;AAAA,YAAI,KAAI;AAAA,YAAI,OAAM;AAAA,YAAI,QAAO;AAAA,YAAI,UAAS;AAAA,YAAQ,WAAU;AAAA,YAAI,QAAO;AAAA,UAAA,CAC9D;AAAA,~~QACjB~~;AAAA,QACA,MAAK;AAAA,MAAA,CACiB;AAGxB,YAAM,aAAaC,MAAA;AAAA;AAAA,QAGjB,OAAO,~~gBAA4BC~~,4BAAqB,CAAC,YAAY;~~AAC1CC~~,yCAAAC,MAAAA,iBAAiB,OAAO,CAAC;AAC3C,iBAAA;AAAA,WACPC,+BAAuB;AAAA;AAAA,QAGzB,OAAO,gBAAgBC,0BAAgB,CAAC,UAAU;AAEhD,WAAC,YAAY;AAEL,kBAAA,cAAc,MAAMC,sBAAgB,OAAO,CAAC,sBAAsB,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;AAE3F,uBAAW,EAAC,MAAM,OAAM,KAAK,aAAa;AAEpC,kBAAAC,MAAA,WAAW,MAAM,sBAAsB,GAAG;AAE5C,uBAAO,~~gBAAgBN~~,4BAAsB;AAAA,kBAC3C,KAAI;AAAA,kBACJ,KAAI,KAAK;AAAA,kBACT,UAAS;AAAA,gBAAA,CACI;AAAA,cACjB;AAAA,YACF;AAAA,UAAA;AAGK,iBAAA;AAAA,~~WACPO~~,4BAAoB;AAAA,MAAA;AAGZC,sBAAA,MAAM,YAAY;AAAA,IAAA,CAC/B;;;;;;;"}
1	+ {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImagePlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { $insertNodeToNearestRoot,mergeRegister,mediaFileReader,isMimeType } from '@lexical/utils'\r\nimport { COMMAND_PRIORITY_EDITOR,COMMAND_PRIORITY_LOW,$getSelection } from 'lexical'\r\nimport { DRAG_DROP_PASTE } from '@lexical/rich-text'\r\nimport { useLexicalComposer } from '../../lexical-vue'\r\nimport { onMounted, onUnmounted } from 'vue'\r\nimport { INSERT_IMAGE_COMMAND,$createImageNode,ImageNode,type ImageAttrs } from './index'\r\nimport { RegisterToolbarExtend,type ToolbarExtendPlugin } from \"../ToolbarPlugin/defines\"\r\nimport { ShowImageEditPanel } from \"./ImageEditPanel\"\r\n\r\nconst ACCEPTABLE_IMAGE_TYPES = [\r\n 'image/',\r\n 'image/heic',\r\n 'image/heif',\r\n 'image/gif',\r\n 'image/webp',\r\n]\r\n\r\nconst editor = useLexicalComposer()\r\n\r\nonMounted(() => {\r\n\r\n if (!editor.hasNodes([ImageNode])){\r\n throw new Error('ImagePlugin: 图片节点未注册！')\r\n }\r\n\r\n // 注册到工具条\r\n RegisterToolbarExtend({\r\n icon:\"Picture\",\r\n text:\"图片\",\r\n action:async ()=>{\r\n // 显示图片编辑面板\r\n ShowImageEditPanel({\r\n src:\"\", alt:\"\", width:\"\", height:\"\", maxWidth:\"100%\", maxHeight:\"\", margin:\"\"\r\n } as ImageAttrs).then((data:any)=>{\r\n editor.dispatchCommand(INSERT_IMAGE_COMMAND,data as ImageAttrs)\r\n });\r\n },\r\n sort:11\r\n } as ToolbarExtendPlugin)\r\n\r\n // 注册指令\r\n const unregister = mergeRegister(\r\n\r\n // 插入图片\r\n editor.registerCommand<ImageAttrs>(INSERT_IMAGE_COMMAND,(payload) => {\r\n $insertNodeToNearestRoot($createImageNode(payload))\r\n return true\r\n },COMMAND_PRIORITY_EDITOR),\r\n\r\n // 剪切板图片\r\n editor.registerCommand(DRAG_DROP_PASTE,(files) => {\r\n\r\n (async () => {\r\n\r\n const filesResult = await mediaFileReader(files, [ACCEPTABLE_IMAGE_TYPES].flatMap((x) => x))\r\n\r\n for (const {file, result} of filesResult) {\r\n\r\n if (isMimeType(file, ACCEPTABLE_IMAGE_TYPES)) {\r\n\r\n editor.dispatchCommand(INSERT_IMAGE_COMMAND, {\r\n src:result,\r\n alt:file.name,\r\n maxWidth:\":100%\"\r\n } as ImageAttrs)\r\n }\r\n }\r\n })()\r\n\r\n return true\r\n },COMMAND_PRIORITY_LOW)\r\n );\r\n\r\n onUnmounted(() => unregister())\r\n})\r\n</script>\r\n\r\n<template />\r\n"],"names":["useLexicalComposer","onMounted","ImageNode","RegisterToolbarExtend","ShowImageEditPanel","INSERT_IMAGE_COMMAND","mergeRegister","$insertNodeToNearestRoot","$createImageNode","COMMAND_PRIORITY_EDITOR","DRAG_DROP_PASTE","mediaFileReader","isMimeType","COMMAND_PRIORITY_LOW","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,UAAM,yBAAyB;AAAA,MAC7B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAGF,UAAM,SAASA,mBAAAA;AAEfC,QAAAA,UAAU,MAAM;AAEd,UAAI,CAAC,OAAO,SAAS,CAACC,MAAAA,SAAS,CAAC,GAAE;AAC1B,cAAA,IAAI,MAAM,uBAAuB;AAAA,MACzC;AAGsBC,oCAAA;AAAA,QACpB,MAAK;AAAA,QACL,MAAK;AAAA,QACL,QAAO,YAAU;AAEIC,4CAAA;AAAA,YACjB,KAAI;AAAA,YAAI,KAAI;AAAA,YAAI,OAAM;AAAA,YAAI,QAAO;AAAA,YAAI,UAAS;AAAA,YAAQ,WAAU;AAAA,YAAI,QAAO;AAAA,UAAA,CAC9D,EAAE,KAAK,CAAC,SAAW;AACzB,mBAAA,gBAAgBC,4BAAqB,IAAkB;AAAA,UAAA,CAC/D;AAAA,QACH;AAAA,QACA,MAAK;AAAA,MAAA,CACiB;AAGxB,YAAM,aAAaC,MAAA;AAAA;AAAA,QAGjB,OAAO,gBAA4BD,4BAAqB,CAAC,YAAY;AAC1CE,yCAAAC,MAAAA,iBAAiB,OAAO,CAAC;AAC3C,iBAAA;AAAA,WACPC,+BAAuB;AAAA;AAAA,QAGzB,OAAO,gBAAgBC,0BAAgB,CAAC,UAAU;AAEhD,WAAC,YAAY;AAEL,kBAAA,cAAc,MAAMC,sBAAgB,OAAO,CAAC,sBAAsB,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;AAE3F,uBAAW,EAAC,MAAM,OAAM,KAAK,aAAa;AAEpC,kBAAAC,MAAA,WAAW,MAAM,sBAAsB,GAAG;AAE5C,uBAAO,gBAAgBP,4BAAsB;AAAA,kBAC3C,KAAI;AAAA,kBACJ,KAAI,KAAK;AAAA,kBACT,UAAS;AAAA,gBAAA,CACI;AAAA,cACjB;AAAA,YACF;AAAA,UAAA;AAGK,iBAAA;AAAA,WACPQ,4BAAoB;AAAA,MAAA;AAGZC,sBAAA,MAAM,YAAY;AAAA,IAAA,CAC/B;;;;;;;"}

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

@@ -34,6 +34,13 @@ class ImageTextNode extends BaseBlockNode.BaseBlockNode {
   constructor(key) {
     super(ImageTextNode.getType(), key);
   }
+  exportJSON() {
+    return {
+      ...super.exportJSON(),
+      type: this.getType(),
+      version: 1
+    };
+  }
 }
 function $createImageTextNode(attrs) {
   const imageText = new ImageTextNode();

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImageTextPlugin/index.ts"],"sourcesContent":["\r\n\r\n\r\n\r\n\r\nimport type { DOMConversionMap, LexicalCommand, LexicalNode, NodeKey, Spread } from 'lexical'\r\nimport { createCommand,$createParagraphNode } from 'lexical'\r\nimport { ImageAttrs,$createImageNode } from '../ImagePlugin'\r\nimport { BaseBlockNode,SerializedMkDocEditBlockComponentNode } from '../BaseBlockNode'\r\n\r\n/*\r\n 插入图文\r\n /\r\nexport const INSERT_IMAGETEXT_COMMAND: LexicalCommand<ImageAttrs> = createCommand(\r\n 'INSERT_IMAGETEXT_COMMAND',\r\n)\r\n\r\n\r\n/\r\n 图文节点序列化\r\n /\r\nexport type SerializedImageTextNode = Spread<{},SerializedMkDocEditBlockComponentNode>\r\n\r\n/\r\n 图文节点\r\n /\r\nexport class ImageTextNode extends BaseBlockNode{\r\n\r\n static getType(): string {\r\n return \"image-text\";\r\n }\r\n\r\n static clone(node: ImageTextNode): ImageTextNode {\r\n return new ImageTextNode(node.__key)\r\n }\r\n\r\n static importJSON(serializedNode: SerializedImageTextNode): ImageTextNode {\r\n return $createImageTextNode()\r\n }\r\n\r\n static getMakeClassName(): string {\r\n return `${BaseBlockNode.MarkClassName}-${ImageTextNode.getType()}`\r\n }\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n \"div\" : (domNode: HTMLElement) => {\r\n return {\r\n conversion: (domNode : HTMLElement)=>{\r\n return domNode.classList.contains(ImageTextNode.getMakeClassName()) ? { node:$createImageTextNode() } : null;\r\n },\r\n priority: 0\r\n }\r\n },\r\n }\r\n }\r\n\r\n~~\r\n~~ constructor(key?: NodeKey) {\r\n super(ImageTextNode.getType(),key)\r\n }\r\n}\r\n\r\n/\r\n 创建图片节点\r\n * @param src \r\n * @returns \r\n /\r\nexport function $createImageTextNode(attrs?: ImageAttrs): ImageTextNode {\r\n\r\n const imageText = new ImageTextNode()\r\n\r\n if(attrs != null){\r\n imageText.append($createImageNode(attrs))\r\n imageText.append($createParagraphNode())\r\n }\r\n\r\n return imageText;\r\n}\r\n\r\n/\r\n 判断是否是图文节点\r\n * @param node \r\n * @returns \r\n */\r\nexport function $isImageTextNode(\r\n node: ImageTextNode \| LexicalNode \| null \| undefined,\r\n): node is ImageTextNode {\r\n return node instanceof ImageTextNode\r\n}\r\n"],"names":["createCommand","BaseBlockNode","domNode","$createImageNode","$createParagraphNode"],"mappings":";;;;;AAaO,MAAM,2BAAuDA,QAAA;AAAA,EAClE;AACF;AAWO,MAAM,sBAAsBC,cAAAA,cAAa;AAAA,EAE9C,OAAO,UAAkB;AAChB,WAAA;AAAA,EACT;AAAA,~~EAEA~~,OAAO,MAAM,MAAoC;AACxC,WAAA,IAAI,cAAc,KAAK,KAAK;AAAA,EACrC;AAAA,EAEA,OAAO,WAAW,gBAAwD;AACxE,WAAO,qBAAqB;AAAA,EAC9B;AAAA,EAEA,OAAO,mBAA2B;AAChC,WAAO,GAAGA,cAAAA,cAAc,aAAa,IAAI,cAAc,QAAS,CAAA;AAAA,EAClE;AAAA,EAEA,OAAO,YAAqC;AACnC,WAAA;AAAA,MACL,OAAQ,CAAC,YAAyB;AACxB,eAAA;AAAA,UACN,YAAY,CAACC,aAAwB;AAC5BA,mBAAAA,SAAQ,UAAU,SAAS,cAAc,kBAAkB,IAAI,EAAE,MAAK,qBAAqB,EAAA,IAAM;AAAA,UAC1G;AAAA,UACA,UAAU;AAAA,QAAA;AAAA,MAEd;AAAA,IAAA;AAAA,EAEJ;AAAA,~~EAGA~~,YAAY,KAAe;AACnB,UAAA,cAAc,QAAQ,GAAE,GAAG;AAAA,EACnC;AACF;AAOO,SAAS,qBAAqB,OAAmC;AAEhE,QAAA,YAAY,IAAI;AAEtB,MAAG,SAAS,MAAK;AACL,cAAA,OAAOC,uBAAiB,KAAK,CAAC;AAC9B,cAAA,OAAOC,8BAAsB;AAAA,EACzC;AAEO,SAAA;AACT;;;;"}
1	+ {"version":3,"file":"index.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImageTextPlugin/index.ts"],"sourcesContent":["\r\n\r\n\r\n\r\n\r\nimport type { DOMConversionMap, LexicalCommand, LexicalNode, NodeKey, Spread } from 'lexical'\r\nimport { createCommand,$createParagraphNode } from 'lexical'\r\nimport { ImageAttrs,$createImageNode } from '../ImagePlugin'\r\nimport { BaseBlockNode,SerializedMkDocEditBlockComponentNode } from '../BaseBlockNode'\r\n\r\n/*\r\n 插入图文\r\n /\r\nexport const INSERT_IMAGETEXT_COMMAND: LexicalCommand<ImageAttrs> = createCommand(\r\n 'INSERT_IMAGETEXT_COMMAND',\r\n)\r\n\r\n\r\n/\r\n 图文节点序列化\r\n /\r\nexport type SerializedImageTextNode = Spread<{},SerializedMkDocEditBlockComponentNode>\r\n\r\n/\r\n 图文节点\r\n /\r\nexport class ImageTextNode extends BaseBlockNode{\r\n\r\n static getType(): string {\r\n return \"image-text\";\r\n }\r\n\r\n\r\n static clone(node: ImageTextNode): ImageTextNode {\r\n return new ImageTextNode(node.__key)\r\n }\r\n\r\n static importJSON(serializedNode: SerializedImageTextNode): ImageTextNode {\r\n return $createImageTextNode()\r\n }\r\n\r\n static getMakeClassName(): string {\r\n return `${BaseBlockNode.MarkClassName}-${ImageTextNode.getType()}`\r\n }\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n \"div\" : (domNode: HTMLElement) => {\r\n return {\r\n conversion: (domNode : HTMLElement)=>{\r\n return domNode.classList.contains(ImageTextNode.getMakeClassName()) ? { node:$createImageTextNode() } : null;\r\n },\r\n priority: 0\r\n }\r\n },\r\n }\r\n }\r\n\r\n constructor(key?: NodeKey) {\r\n super(ImageTextNode.getType(),key)\r\n }\r\n\r\n exportJSON(): SerializedMkDocEditBlockComponentNode {\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n version: 1\r\n }\r\n }\r\n}\r\n\r\n/\r\n 创建图片节点\r\n * @param src \r\n * @returns \r\n /\r\nexport function $createImageTextNode(attrs?: ImageAttrs): ImageTextNode {\r\n\r\n const imageText = new ImageTextNode()\r\n\r\n if(attrs != null){\r\n imageText.append($createImageNode(attrs))\r\n imageText.append($createParagraphNode())\r\n }\r\n\r\n return imageText;\r\n}\r\n\r\n/\r\n 判断是否是图文节点\r\n * @param node \r\n * @returns \r\n */\r\nexport function $isImageTextNode(\r\n node: ImageTextNode \| LexicalNode \| null \| undefined,\r\n): node is ImageTextNode {\r\n return node instanceof ImageTextNode\r\n}\r\n"],"names":["createCommand","BaseBlockNode","domNode","$createImageNode","$createParagraphNode"],"mappings":";;;;;AAaO,MAAM,2BAAuDA,QAAA;AAAA,EAClE;AACF;AAWO,MAAM,sBAAsBC,cAAAA,cAAa;AAAA,EAE9C,OAAO,UAAkB;AAChB,WAAA;AAAA,EACT;AAAA,EAGA,OAAO,MAAM,MAAoC;AACxC,WAAA,IAAI,cAAc,KAAK,KAAK;AAAA,EACrC;AAAA,EAEA,OAAO,WAAW,gBAAwD;AACxE,WAAO,qBAAqB;AAAA,EAC9B;AAAA,EAEA,OAAO,mBAA2B;AAChC,WAAO,GAAGA,cAAAA,cAAc,aAAa,IAAI,cAAc,QAAS,CAAA;AAAA,EAClE;AAAA,EAEA,OAAO,YAAqC;AACnC,WAAA;AAAA,MACL,OAAQ,CAAC,YAAyB;AACxB,eAAA;AAAA,UACN,YAAY,CAACC,aAAwB;AAC5BA,mBAAAA,SAAQ,UAAU,SAAS,cAAc,kBAAkB,IAAI,EAAE,MAAK,qBAAqB,EAAA,IAAM;AAAA,UAC1G;AAAA,UACA,UAAU;AAAA,QAAA;AAAA,MAEd;AAAA,IAAA;AAAA,EAEJ;AAAA,EAEA,YAAY,KAAe;AACnB,UAAA,cAAc,QAAQ,GAAE,GAAG;AAAA,EACnC;AAAA,EAEA,aAAoD;AAC3C,WAAA;AAAA,MACL,GAAG,MAAM,WAAW;AAAA,MACpB,MAAM,KAAK,QAAQ;AAAA,MACnB,SAAS;AAAA,IAAA;AAAA,EAEb;AACF;AAOO,SAAS,qBAAqB,OAAmC;AAEhE,QAAA,YAAY,IAAI;AAEtB,MAAG,SAAS,MAAK;AACL,cAAA,OAAOC,uBAAiB,KAAK,CAAC;AAC9B,cAAA,OAAOC,8BAAsB;AAAA,EACzC;AAEO,SAAA;AACT;;;;"}

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

@@ -39,7 +39,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         text: "图文",
         action: async () => {
           editor.dispatchCommand(index.INSERT_IMAGETEXT_COMMAND, {
-            src: "https://img-s-msn-com.akamaized.net/tenant/amp/entityid/BB1prXny.img?w=768&amp;h=479&amp;m=6&amp;x=142&amp;y=148&amp;s=131&amp;d=131",
+            src: "",
             float: "left",
             width: "200px",
             margin: "0 10px 10px 0"

package/dist/cjs/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 { useLexicalComposer } from '../../lexical-vue'\r\nimport { $insertNodeToNearestRoot,mergeRegister } from '@lexical/utils'\r\nimport { COMMAND_PRIORITY_EDITOR,COMMAND_PRIORITY_LOW,$getSelection,CLICK_COMMAND } from 'lexical'\r\n\r\nimport { onMounted, onUnmounted } from 'vue'\r\nimport { INSERT_IMAGETEXT_COMMAND,ImageTextNode,$createImageTextNode } from './index'\r\nimport { ImageAttrs } from '../ImagePlugin/index'\r\nimport { RegisterToolbarExtend,type ToolbarExtendPlugin } from \"../ToolbarPlugin/defines\"\r\n\r\n\r\nconst editor = useLexicalComposer()\r\n\r\nonMounted(() => {\r\n\r\n if (!editor.hasNodes([ImageTextNode])){\r\n throw new Error('ImageTextPlugin: 图文节点未注册！')\r\n }\r\n\r\n // 注册到工具条\r\n RegisterToolbarExtend({\r\n icon:\"richtext-outline\",\r\n text:\"图文\",\r\n action:async ()=>{\r\n editor.dispatchCommand(INSERT_IMAGETEXT_COMMAND,{\r\n src:\"~~https://img-s-msn-com.akamaized.net/tenant/amp/entityid/BB1prXny.img?w=768&h=479&m=6&x=142&y=148&s=131&d=131~~\",\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\n // 注册指令\r\n const unregister = mergeRegister(\r\n\r\n // 插入图片\r\n editor.registerCommand<ImageAttrs>(INSERT_IMAGETEXT_COMMAND,(payload) => {\r\n $insertNodeToNearestRoot($createImageTextNode(payload))\r\n return true\r\n },COMMAND_PRIORITY_EDITOR),\r\n // editor.registerCommand<MouseEvent>(CLICK_COMMAND,(event) => {\r\n\r\n // let dom = event.target as HTMLElement\r\n // let block = dom.parentElement\r\n\r\n // if(block?.classList.contains(ImageTextNode.getMakeClassName())){\r\n\r\n // event.preventDefault();\r\n // console.log(block);\r\n\r\n // // if (!event.shiftKey){ clearSelection() }\r\n \r\n // // setSelected(true)\r\n // // updateImageActiveBox();\r\n\r\n // return true\r\n // }\r\n\r\n // // if (event.target === selfElRef.value) {\r\n\r\n \r\n // // }\r\n // return false\r\n // },COMMAND_PRIORITY_LOW),\r\n );\r\n\r\n onUnmounted(() => unregister())\r\n})\r\n</script>\r\n\r\n<template />\r\n"],"names":["useLexicalComposer","onMounted","ImageTextNode","RegisterToolbarExtend","INSERT_IMAGETEXT_COMMAND","mergeRegister","$insertNodeToNearestRoot","$createImageTextNode","COMMAND_PRIORITY_EDITOR","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,UAAM,SAASA,mBAAAA;AAEfC,QAAAA,UAAU,MAAM;AAEd,UAAI,CAAC,OAAO,SAAS,CAACC,MAAAA,aAAa,CAAC,GAAE;AAC9B,cAAA,IAAI,MAAM,2BAA2B;AAAA,MAC7C;AAGsBC,oCAAA;AAAA,QACpB,MAAK;AAAA,QACL,MAAK;AAAA,QACL,QAAO,YAAU;AACf,iBAAO,gBAAgBC,gCAAyB;AAAA,YAC9C,KAAI;AAAA,YACJ,OAAM;AAAA,YACN,OAAM;AAAA,YACN,QAAO;AAAA,UAAA,CACR;AAAA,QACH;AAAA,QACA,MAAK;AAAA,MAAA,CACiB;AAGxB,YAAM,aAAaC,MAAA;AAAA;AAAA,QAGjB,OAAO,gBAA4BD,gCAAyB,CAAC,YAAY;AAC9CE,yCAAAC,MAAAA,qBAAqB,OAAO,CAAC;AAC/C,iBAAA;AAAA,WACPC,+BAAuB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAAA;AA2BfC,sBAAA,MAAM,YAAY;AAAA,IAAA,CAC/B;;;;;;;"}
1	+ {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ImageTextPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { useLexicalComposer } from '../../lexical-vue'\r\nimport { $insertNodeToNearestRoot,mergeRegister } from '@lexical/utils'\r\nimport { COMMAND_PRIORITY_EDITOR,COMMAND_PRIORITY_LOW,$getSelection,CLICK_COMMAND } from 'lexical'\r\n\r\nimport { onMounted, onUnmounted } from 'vue'\r\nimport { INSERT_IMAGETEXT_COMMAND,ImageTextNode,$createImageTextNode } from './index'\r\nimport { ImageAttrs } from '../ImagePlugin/index'\r\nimport { RegisterToolbarExtend,type ToolbarExtendPlugin } from \"../ToolbarPlugin/defines\"\r\n\r\n\r\nconst editor = useLexicalComposer()\r\n\r\nonMounted(() => {\r\n\r\n if (!editor.hasNodes([ImageTextNode])){\r\n throw new Error('ImageTextPlugin: 图文节点未注册！')\r\n }\r\n \r\n // 注册到工具条\r\n RegisterToolbarExtend({\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\n // 注册指令\r\n const unregister = mergeRegister(\r\n\r\n // 插入图片\r\n editor.registerCommand<ImageAttrs>(INSERT_IMAGETEXT_COMMAND,(payload) => {\r\n $insertNodeToNearestRoot($createImageTextNode(payload))\r\n return true\r\n },COMMAND_PRIORITY_EDITOR),\r\n // editor.registerCommand<MouseEvent>(CLICK_COMMAND,(event) => {\r\n\r\n // let dom = event.target as HTMLElement\r\n // let block = dom.parentElement\r\n\r\n // if(block?.classList.contains(ImageTextNode.getMakeClassName())){\r\n\r\n // event.preventDefault();\r\n // console.log(block);\r\n\r\n // // if (!event.shiftKey){ clearSelection() }\r\n \r\n // // setSelected(true)\r\n // // updateImageActiveBox();\r\n\r\n // return true\r\n // }\r\n\r\n // // if (event.target === selfElRef.value) {\r\n\r\n \r\n // // }\r\n // return false\r\n // },COMMAND_PRIORITY_LOW),\r\n );\r\n\r\n onUnmounted(() => unregister())\r\n})\r\n</script>\r\n\r\n<template />\r\n"],"names":["useLexicalComposer","onMounted","ImageTextNode","RegisterToolbarExtend","INSERT_IMAGETEXT_COMMAND","mergeRegister","$insertNodeToNearestRoot","$createImageTextNode","COMMAND_PRIORITY_EDITOR","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,UAAM,SAASA,mBAAAA;AAEfC,QAAAA,UAAU,MAAM;AAEd,UAAI,CAAC,OAAO,SAAS,CAACC,MAAAA,aAAa,CAAC,GAAE;AAC9B,cAAA,IAAI,MAAM,2BAA2B;AAAA,MAC7C;AAGsBC,oCAAA;AAAA,QACpB,MAAK;AAAA,QACL,MAAK;AAAA,QACL,QAAO,YAAU;AACf,iBAAO,gBAAgBC,gCAAyB;AAAA,YAC9C,KAAI;AAAA,YACJ,OAAM;AAAA,YACN,OAAM;AAAA,YACN,QAAO;AAAA,UAAA,CACR;AAAA,QACH;AAAA,QACA,MAAK;AAAA,MAAA,CACiB;AAGxB,YAAM,aAAaC,MAAA;AAAA;AAAA,QAGjB,OAAO,gBAA4BD,gCAAyB,CAAC,YAAY;AAC9CE,yCAAAC,MAAAA,qBAAqB,OAAO,CAAC;AAC/C,iBAAA;AAAA,WACPC,+BAAuB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAAA;AA2BfC,sBAAA,MAAM,YAAY;AAAA,IAAA,CAC/B;;;;;;;"}

package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/{HtmlCodeTool.vue.js → PreviewToolbar.vue.js} RENAMED Viewed

@@ -1,9 +1,9 @@
 "use strict";
 const vue = require("vue");
-require("lexical");
 require("@lexical/text");
 require("@lexical/utils");
 require("@lexical/overflow");
+require("lexical");
 require("tiny-invariant");
 require("@lexical/history");
 const useLexicalComposer = require("../../lexical-vue/composables/useLexicalComposer.js");
@@ -24,44 +24,53 @@ require("../../lexical-vue/composables/useCollaborationContext.js");
 require("../../lexical-vue/components/LexicalMenu/shared.js");
 require("../../lexical-vue/components/LexicalAutoEmbedPlugin/shared.js");
 require("../../lexical-vue/components/LexicalTypeaheadMenuPlugin/shared.js");
-const index = require("../../../code-editor/index.js");
-const langHtml = require("@codemirror/lang-html");
-const _hoisted_1 = /* @__PURE__ */ vue.createElementVNode("div", null, null, -1);
+const commands = require("../commands.js");
+const docTheme = require("../../themes/doc-theme.css.js");
+const docEditor = require("../../themes/doc-editor.css.js");
+const _hoisted_1 = ["srcdoc"];
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-  __name: "HtmlCodeTool",
+  __name: "PreviewToolbar",
   setup(__props) {
     const editor = useLexicalComposer.useLexicalComposer();
+    const iframeContentRef = vue.ref(null);
+    const iframeBody = vue.computed(() => {
+      var _a, _b, _c;
+      return (_c = (_b = (_a = iframeContentRef.value) == null ? void 0 : _a.contentWindow) == null ? void 0 : _b.document) == null ? void 0 : _c.body;
+    });
     const codeDialogVisible = vue.ref(false);
-    new DOMParser();
-    const htmlContent = vue.ref("");
-    function printPrettyHTML(str) {
-      const div = document.createElement("div");
-      div.innerHTML = str.trim();
-      return prettifyHTML(div, 0).innerHTML;
-    }
-    function prettifyHTML(node, level) {
-      const indentBefore = Array.from({ length: level++ + 1 }).join("  ");
-      const indentAfter = Array.from({ length: level - 1 }).join("  ");
-      let textNode;
-      for (let i = 0; i < node.children.length; i++) {
-        textNode = document.createTextNode(`
-${indentBefore}`);
-        node.insertBefore(textNode, node.children[i]);
-        prettifyHTML(node.children[i], level);
-        if (node.lastElementChild === node.children[i]) {
-          textNode = document.createTextNode(`
-${indentAfter}`);
-          node.appendChild(textNode);
-        }
-      }
-      return node;
-    }
+    const srcdoc = vue.ref("");
+    const createViewContent = (content) => {
+      srcdoc.value = `
+    <html>
+      <head>
+        <style type="text/css">
+          ${docEditor}
+          ${docTheme}
+        </style>
+      </head>
+      <body style="font-size:${viewDevice.value == "pc" ? "14px" : "18px"}">${content}</body>
+    </html>
+  `;
+    };
+    const viewDevice = vue.ref("pc");
     const show = function() {
       editor.getEditorState().read(() => {
-        htmlContent.value = printPrettyHTML(html.$generateHtmlFromNodes(editor));
+        createViewContent(html.$generateHtmlFromNodes(editor));
+        setTimeout(() => {
+          var _a;
+          if (iframeBody.value.scrollHeight > iframeBody.value.offsetHeight) {
+            iframeContentRef.value.style.height = ((_a = iframeBody.value) == null ? void 0 : _a.scrollHeight) + 10 + "px";
+          }
+        }, 100);
       });
       codeDialogVisible.value = true;
     };
+    vue.onMounted(() => {
+      editor.registerCommand(commands.DEVICE_VIEW_MODE, (payload) => {
+        viewDevice.value = payload;
+        return false;
+      }, 1);
+    });
     return (_ctx, _cache) => {
       const _component_MKSvgIcon = vue.resolveComponent("MKSvgIcon");
       const _component_el_button = vue.resolveComponent("el-button");
@@ -72,26 +81,30 @@ ${indentAfter}`);
           onClick: show
         }, {
           default: vue.withCtx(() => [
-            vue.createVNode(_component_MKSvgIcon, { iconClass: "html-code" })
+            vue.createVNode(_component_MKSvgIcon, { iconClass: "View" })
           ]),
           _: 1
         }),
         vue.createVNode(_component_el_dialog, {
           modelValue: codeDialogVisible.value,
-          "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => codeDialogVisible.value = $event),
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => codeDialogVisible.value = $event),
           "append-to-body": "",
-          title: "查看源代码",
-          width: "80%"
+          title: "预览",
+          width: "80%",
+          fullscreen: ""
         }, {
-          footer: vue.withCtx(() => [
-            _hoisted_1
-          ]),
           default: vue.withCtx(() => [
-            vue.createVNode(vue.unref(index.MKCodeEditor), {
-              modelValue: htmlContent.value,
-              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => htmlContent.value = $event),
-              extensions: [vue.unref(langHtml.html)()]
-            }, null, 8, ["modelValue", "extensions"])
+            codeDialogVisible.value ? (vue.openBlock(), vue.createElementBlock("div", {
+              key: 0,
+              class: vue.normalizeClass(["mk-doc-editor__view_warp", viewDevice.value])
+            }, [
+              vue.createElementVNode("iframe", {
+                class: "mk-doc-editor__view_iframe",
+                ref_key: "iframeContentRef",
+                ref: iframeContentRef,
+                srcdoc: srcdoc.value
+              }, null, 8, _hoisted_1)
+            ], 2)) : vue.createCommentVNode("", true)
           ]),
           _: 1
         }, 8, ["modelValue"])
@@ -100,4 +113,4 @@ ${indentAfter}`);
   }
 });
 module.exports = _sfc_main;
-//# sourceMappingURL=HtmlCodeTool.vue.js.map
+//# sourceMappingURL=PreviewToolbar.vue.js.map

package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"PreviewToolbar.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { useLexicalComposer } from '../../lexical-vue'\r\nimport { DEVICE_VIEW_MODE } from \"../commands\"\r\nimport { $generateHtmlFromNodes} from '@lexical/html'\r\nimport { onMounted,ref,computed } from \"vue\"\r\nimport DocThemeCss from \"../../themes/doc-theme.css?raw\";\r\nimport DocEditorCss from \"../../themes/doc-editor.css?raw\";\r\n\r\nconst editor = useLexicalComposer()\r\n// iframe 编辑器\r\nconst iframeContentRef = ref(null as any);\r\nconst iframeBody = computed<any>(()=>iframeContentRef.value?.contentWindow?.document?.body)\r\n\r\nconst codeDialogVisible = ref(false);\r\nconst srcdoc = ref(\"\");\r\n// 创建预览内容\r\nconst createViewContent = (content:string)=>{\r\n srcdoc.value = `\r\n <html>\r\n <head>\r\n <style type=\"text/css\">\r\n ${DocEditorCss}\r\n ${DocThemeCss}\r\n </style>\r\n </head>\r\n <body style=\"font-size:${viewDevice.value=='pc'?\"14px\":\"18px\"}\">${content}</body>\r\n </html>\r\n `\r\n}\r\n\r\n// pc | mobile\r\nconst viewDevice = ref('pc')\r\n// 显示\r\nconst show = function(){\r\n\r\n editor.getEditorState().read(() => {\r\n createViewContent($generateHtmlFromNodes(editor))\r\n setTimeout(() => {\r\n if(iframeBody.value.scrollHeight > iframeBody.value.offsetHeight){\r\n iframeContentRef.value.style.height = (iframeBody.value?.scrollHeight + 10)+\"px\";\r\n }\r\n }, 100);\r\n })\r\n\r\n codeDialogVisible.value = true;\r\n \r\n}\r\nonMounted(()=>{\r\n editor.registerCommand(DEVICE_VIEW_MODE,(payload: string) => {\r\n viewDevice.value = payload;\r\n return false\r\n },1)\r\n});\r\n\r\n</script>\r\n\r\n<template>\r\n <el-button text @click=\"show\">\r\n <MKSvgIcon iconClass=\"View\" /> \r\n </el-button>\r\n <el-dialog v-model=\"codeDialogVisible\" append-to-body title=\"预览\" width=\"80%\" fullscreen>\r\n <div class=\"mk-doc-editor__view_warp\" :class=\"viewDevice\" v-if=\"codeDialogVisible\">\r\n <iframe class=\"mk-doc-editor__view_iframe\" ref=\"iframeContentRef\" :srcdoc=\"srcdoc\"></iframe>\r\n </div>\r\n \r\n </el-dialog>\r\n</template>\r\n"],"names":["useLexicalComposer","ref","computed","DocEditorCss","DocThemeCss","$generateHtmlFromNodes","onMounted","DEVICE_VIEW_MODE"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,UAAM,SAASA,mBAAAA;AAET,UAAA,mBAAmBC,QAAI,IAAW;AACxC,UAAM,aAAaC,IAAc,SAAA;;AAAI,gDAAiB,UAAjB,mBAAwB,kBAAxB,mBAAuC,aAAvC,mBAAiD;AAAA,KAAI;AAEpF,UAAA,oBAAoBD,QAAI,KAAK;AAC7B,UAAA,SAASA,QAAI,EAAE;AAEf,UAAA,oBAAoB,CAAC,YAAiB;AAC1C,aAAO,QAAQ;AAAA;AAAA;AAAA;AAAA,YAILE,SAAY;AAAA,YACZC,QAAW;AAAA;AAAA;AAAA,+BAGQ,WAAW,SAAO,OAAK,SAAO,MAAM,KAAK,OAAO;AAAA;AAAA;AAAA,IAAA;AAMzE,UAAA,aAAaH,QAAI,IAAI;AAE3B,UAAM,OAAO,WAAU;AAEd,aAAA,iBAAiB,KAAK,MAAM;AACf,0BAAAI,KAAAA,uBAAuB,MAAM,CAAC;AAChD,mBAAW,MAAM;;AACf,cAAG,WAAW,MAAM,eAAe,WAAW,MAAM,cAAa;AAC/D,6BAAiB,MAAM,MAAM,WAAU,gBAAW,UAAX,mBAAkB,gBAAe,KAAI;AAAA,UAC9E;AAAA,WACC,GAAG;AAAA,MAAA,CACP;AAED,wBAAkB,QAAQ;AAAA,IAAA;AAG5BC,QAAAA,UAAU,MAAI;AACL,aAAA,gBAAgBC,2BAAiB,CAAC,YAAoB;AAC3D,mBAAW,QAAQ;AACZ,eAAA;AAAA,SACP,CAAC;AAAA,IAAA,CACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue2.js ADDED Viewed

@@ -0,0 +1,4 @@
+"use strict";
+const PreviewToolbar_vue_vue_type_script_setup_true_lang = require("./PreviewToolbar.vue.js");
+module.exports = PreviewToolbar_vue_vue_type_script_setup_true_lang;
+//# sourceMappingURL=PreviewToolbar.vue2.js.map

package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/PreviewToolbar.vue2.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"PreviewToolbar.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/cjs/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue.js CHANGED Viewed

@@ -24,7 +24,7 @@ require("../../lexical-vue/composables/useCollaborationContext.js");
 require("../../lexical-vue/components/LexicalMenu/shared.js");
 require("../../lexical-vue/components/LexicalAutoEmbedPlugin/shared.js");
 require("../../lexical-vue/components/LexicalTypeaheadMenuPlugin/shared.js");
-const HtmlCodeTool_vue_vue_type_script_setup_true_lang = require("./HtmlCodeTool.vue.js");
+const PreviewToolbar_vue_vue_type_script_setup_true_lang = require("./PreviewToolbar.vue.js");
 const FontStyleTool_vue_vue_type_script_setup_true_lang = require("./FontStyleTool.vue.js");
 const ContentStyleTool_vue_vue_type_script_setup_true_lang = require("./ContentStyleTool.vue.js");
 const defines = require("./defines.js");
@@ -178,7 +178,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         vue.createVNode(_component_el_divider, { direction: "vertical" }),
         vue.createVNode(_component_el_button_group, null, {
           default: vue.withCtx(() => [
-            vue.createVNode(HtmlCodeTool_vue_vue_type_script_setup_true_lang)
+            vue.createVNode(PreviewToolbar_vue_vue_type_script_setup_true_lang)
           ]),
           _: 1
         })

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { CommandListenerPriority } from 'lexical'\r\nimport {\r\n CAN_REDO_COMMAND,\r\n CAN_UNDO_COMMAND,\r\n REDO_COMMAND,\r\n UNDO_COMMAND,\r\n} from 'lexical'\r\n\r\nimport { mergeRegister } from '@lexical/utils'\r\nimport { useLexicalComposer } from '../../lexical-vue'\r\nimport { onMounted, onUnmounted, ref } from 'vue'\r\nimport ~~HtmlCodeToolbar~~ from \"./~~HtmlCodeTool~~.vue\"\r\nimport FontStyleToolbar from \"./FontStyleTool.vue\"\r\nimport ContentStyleToolbar from \"./ContentStyleTool.vue\"\r\nimport { ToolbarExtendPlugins } from \"./defines\"\r\nimport { DEVICE_VIEW_MODE } from \"../commands\"\r\n\r\n\r\nconst LowPriority: CommandListenerPriority = 1\r\n\r\nconst toolbarRef = ref<HTMLDivElement \| null>(null)\r\nconst editor = useLexicalComposer()\r\n\r\nconst canUndo = ref(false)\r\nconst canRedo = ref(false)\r\n// pc \| mobile\r\nconst viewDevice = ref('pc')\r\n\r\n\r\nonMounted(() => {\r\n const unregisterMergeListener = mergeRegister(\r\n editor.registerCommand(\r\n CAN_UNDO_COMMAND,\r\n (payload: boolean) => {\r\n canUndo.value = payload\r\n return false\r\n },\r\n LowPriority,\r\n ),\r\n editor.registerCommand(\r\n CAN_REDO_COMMAND,\r\n (payload: boolean) => {\r\n canRedo.value = payload\r\n return false\r\n },\r\n LowPriority,\r\n ),\r\n editor.registerCommand(\r\n DEVICE_VIEW_MODE,\r\n (payload: string) => {\r\n viewDevice.value = payload\r\n return false\r\n },\r\n LowPriority,\r\n )\r\n )\r\n\r\n onUnmounted(() => {\r\n ToolbarExtendPlugins.length = 0;\r\n unregisterMergeListener()\r\n })\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n <div ref=\"toolbarRef\" class=\"mk-doc-editor-toolbar\">\r\n <el-button-group>\r\n <el-button text :disabled=\"!canUndo\" @click=\"editor.dispatchCommand(UNDO_COMMAND, undefined)\">\r\n <MKSvgIcon iconClass=\"RefreshLeft\" /> \r\n </el-button>\r\n <el-button text :disabled=\"!canRedo\" @click=\"editor.dispatchCommand(REDO_COMMAND, undefined)\">\r\n <MKSvgIcon iconClass=\"RefreshRight\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <!-- 内容 -->\r\n <ContentStyleToolbar />\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 文字样式 -->\r\n <FontStyleToolbar />\r\n <el-divider direction=\"vertical\" />\r\n \r\n <el-button-group>\r\n <el-button text :class=\"`${viewDevice=='pc' ? 'active' : ''}`\" @click=\"editor.dispatchCommand(DEVICE_VIEW_MODE, 'pc')\">\r\n <MKSvgIcon iconClass=\"Platform\" /> \r\n </el-button>\r\n <el-button text :class=\"`${viewDevice=='mobile' ? 'active' : ''}`\" @click=\"editor.dispatchCommand(DEVICE_VIEW_MODE, 'mobile')\">\r\n <MKSvgIcon iconClass=\"Iphone\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <el-dropdown>\r\n <el-button text>\r\n <MKSvgIcon iconClass=\"Plus\" style=\"margin-right: 5px;\" /> 插入\r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item v-for=\"item in ToolbarExtendPlugins\" :key=\"item\" @click=\"item.action()\">\r\n <MKSvgIcon :iconClass=\"item.icon\" /> \r\n {{item.text}}\r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" />\r\n <el-button-group>\r\n <~~HtmlCodeToolbar~~ />\r\n </el-button-group>\r\n </div>\r\n</template>\r\n"],"names":["ref","useLexicalComposer","onMounted","mergeRegister","CAN_UNDO_COMMAND","CAN_REDO_COMMAND","DEVICE_VIEW_MODE","onUnmounted","ToolbarExtendPlugins"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,cAAuC;;;;AAEvC,UAAA,aAAaA,QAA2B,IAAI;AAClD,UAAM,SAASC,mBAAAA;AAET,UAAA,UAAUD,QAAI,KAAK;AACnB,UAAA,UAAUA,QAAI,KAAK;AAEnB,UAAA,aAAaA,QAAI,IAAI;AAG3BE,QAAAA,UAAU,MAAM;AACd,YAAM,0BAA0BC,MAAA;AAAA,QAC9B,OAAO;AAAA,UACLC,QAAA;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO;AAAA,UACLC,QAAA;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO;AAAA,UACLC,SAAA;AAAA,UACA,CAAC,YAAoB;AACnB,uBAAW,QAAQ;AACZ,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,MAAA;AAGFC,UAAAA,YAAY,MAAM;AAChBC,gBAAA,qBAAqB,SAAS;AACN;MAAA,CACzB;AAAA,IAAA,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ToolbarPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { CommandListenerPriority } from 'lexical'\r\nimport {\r\n CAN_REDO_COMMAND,\r\n CAN_UNDO_COMMAND,\r\n REDO_COMMAND,\r\n UNDO_COMMAND,\r\n} from 'lexical'\r\n\r\nimport { mergeRegister } from '@lexical/utils'\r\nimport { useLexicalComposer } from '../../lexical-vue'\r\nimport { onMounted, onUnmounted, ref } from 'vue'\r\nimport PreviewToolbar from \"./PreviewToolbar.vue\"\r\nimport FontStyleToolbar from \"./FontStyleTool.vue\"\r\nimport ContentStyleToolbar from \"./ContentStyleTool.vue\"\r\nimport { ToolbarExtendPlugins } from \"./defines\"\r\nimport { DEVICE_VIEW_MODE } from \"../commands\"\r\n\r\n\r\nconst LowPriority: CommandListenerPriority = 1\r\n\r\nconst toolbarRef = ref<HTMLDivElement \| null>(null)\r\nconst editor = useLexicalComposer()\r\n\r\nconst canUndo = ref(false)\r\nconst canRedo = ref(false)\r\n// pc \| mobile\r\nconst viewDevice = ref('pc')\r\n\r\n\r\nonMounted(() => {\r\n const unregisterMergeListener = mergeRegister(\r\n editor.registerCommand(\r\n CAN_UNDO_COMMAND,\r\n (payload: boolean) => {\r\n canUndo.value = payload\r\n return false\r\n },\r\n LowPriority,\r\n ),\r\n editor.registerCommand(\r\n CAN_REDO_COMMAND,\r\n (payload: boolean) => {\r\n canRedo.value = payload\r\n return false\r\n },\r\n LowPriority,\r\n ),\r\n editor.registerCommand(\r\n DEVICE_VIEW_MODE,\r\n (payload: string) => {\r\n viewDevice.value = payload\r\n return false\r\n },\r\n LowPriority,\r\n )\r\n )\r\n\r\n onUnmounted(() => {\r\n ToolbarExtendPlugins.length = 0;\r\n unregisterMergeListener()\r\n })\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n <div ref=\"toolbarRef\" class=\"mk-doc-editor-toolbar\">\r\n <el-button-group>\r\n <el-button text :disabled=\"!canUndo\" @click=\"editor.dispatchCommand(UNDO_COMMAND, undefined)\">\r\n <MKSvgIcon iconClass=\"RefreshLeft\" /> \r\n </el-button>\r\n <el-button text :disabled=\"!canRedo\" @click=\"editor.dispatchCommand(REDO_COMMAND, undefined)\">\r\n <MKSvgIcon iconClass=\"RefreshRight\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <!-- 内容 -->\r\n <ContentStyleToolbar />\r\n <el-divider direction=\"vertical\" /> \r\n <!-- 文字样式 -->\r\n <FontStyleToolbar />\r\n <el-divider direction=\"vertical\" />\r\n \r\n <el-button-group>\r\n <el-button text :class=\"`${viewDevice=='pc' ? 'active' : ''}`\" @click=\"editor.dispatchCommand(DEVICE_VIEW_MODE, 'pc')\">\r\n <MKSvgIcon iconClass=\"Platform\" /> \r\n </el-button>\r\n <el-button text :class=\"`${viewDevice=='mobile' ? 'active' : ''}`\" @click=\"editor.dispatchCommand(DEVICE_VIEW_MODE, 'mobile')\">\r\n <MKSvgIcon iconClass=\"Iphone\" /> \r\n </el-button>\r\n </el-button-group>\r\n <el-divider direction=\"vertical\" />\r\n <el-dropdown>\r\n <el-button text>\r\n <MKSvgIcon iconClass=\"Plus\" style=\"margin-right: 5px;\" /> 插入\r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item v-for=\"item in ToolbarExtendPlugins\" :key=\"item\" @click=\"item.action()\">\r\n <MKSvgIcon :iconClass=\"item.icon\" /> \r\n {{item.text}}\r\n </el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n <el-divider direction=\"vertical\" />\r\n <el-button-group>\r\n <PreviewToolbar />\r\n </el-button-group>\r\n </div>\r\n</template>\r\n"],"names":["ref","useLexicalComposer","onMounted","mergeRegister","CAN_UNDO_COMMAND","CAN_REDO_COMMAND","DEVICE_VIEW_MODE","onUnmounted","ToolbarExtendPlugins"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,cAAuC;;;;AAEvC,UAAA,aAAaA,QAA2B,IAAI;AAClD,UAAM,SAASC,mBAAAA;AAET,UAAA,UAAUD,QAAI,KAAK;AACnB,UAAA,UAAUA,QAAI,KAAK;AAEnB,UAAA,aAAaA,QAAI,IAAI;AAG3BE,QAAAA,UAAU,MAAM;AACd,YAAM,0BAA0BC,MAAA;AAAA,QAC9B,OAAO;AAAA,UACLC,QAAA;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO;AAAA,UACLC,QAAA;AAAA,UACA,CAAC,YAAqB;AACpB,oBAAQ,QAAQ;AACT,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO;AAAA,UACLC,SAAA;AAAA,UACA,CAAC,YAAoB;AACnB,uBAAW,QAAQ;AACZ,mBAAA;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,MAAA;AAGFC,UAAAA,YAAY,MAAM;AAChBC,gBAAA,qBAAqB,SAAS;AACN;MAAA,CACzB;AAAA,IAAA,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -4,6 +4,7 @@ const AutoLinkPlugin_vue_vue_type_script_setup_true_lang = require("./AutoLinkPl
 const index_vue_vue_type_script_setup_true_lang = require("./ImagePlugin/index.vue.js");
 const index_vue_vue_type_script_setup_true_lang$1 = require("./ImageTextPlugin/index.vue.js");
 const InlineToolsPlugin_vue_vue_type_script_setup_true_lang = require("./ToolbarPlugin/InlineToolsPlugin.vue.js");
+const index_vue_vue_type_script_setup_true_lang$2 = require("./HtmlBlockPlugin/index.vue.js");
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "index",
   setup(__props) {
@@ -12,7 +13,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         vue.createVNode(InlineToolsPlugin_vue_vue_type_script_setup_true_lang),
         vue.createVNode(AutoLinkPlugin_vue_vue_type_script_setup_true_lang),
         vue.createVNode(index_vue_vue_type_script_setup_true_lang),
-        vue.createVNode(index_vue_vue_type_script_setup_true_lang$1)
+        vue.createVNode(index_vue_vue_type_script_setup_true_lang$1),
+        vue.createVNode(index_vue_vue_type_script_setup_true_lang$2)
       ], 64);
     };
   }

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":"~~;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"index.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/components/basic/doc-editor/plugins/nodes.js CHANGED Viewed

@@ -4,6 +4,7 @@ const list = require("@lexical/list");
 const link = require("@lexical/link");
 const index = require("./ImagePlugin/index.js");
 const index$1 = require("./ImageTextPlugin/index.js");
+const index$2 = require("./HtmlBlockPlugin/index.js");
 const Nodes = [
   richText.HeadingNode,
   list.ListNode,
@@ -18,7 +19,8 @@ const Nodes = [
   link.LinkNode,
   // HashtagNode,
   index.ImageNode,
-  index$1.ImageTextNode
+  index$1.ImageTextNode,
+  index$2.HtmlBlockNode
 ];
 module.exports = Nodes;
 //# sourceMappingURL=nodes.js.map

package/dist/cjs/components/basic/doc-editor/plugins/nodes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nodes.js","sources":["../../../../../../src/components/basic/doc-editor/plugins/nodes.ts"],"sourcesContent":["import type { Klass, LexicalNode } from 'lexical'\r\nimport { HeadingNode, QuoteNode } from '@lexical/rich-text'\r\nimport { TableCellNode, TableNode, TableRowNode } from '@lexical/table'\r\nimport { ListItemNode, ListNode } from '@lexical/list'\r\nimport { CodeHighlightNode, CodeNode } from '@lexical/code'\r\nimport { AutoLinkNode, LinkNode } from '@lexical/link'\r\nimport { HashtagNode } from '@lexical/hashtag'\r\nimport { ImageNode } from \"./ImagePlugin\"\r\nimport { ImageTextNode } from \"./ImageTextPlugin\"\r\n\r\nconst Nodes: Array<Klass<LexicalNode>> = [\r\n HeadingNode,\r\n ListNode,\r\n ListItemNode,\r\n // QuoteNode,\r\n // CodeNode,\r\n // CodeHighlightNode,\r\n // TableNode,\r\n // TableCellNode,\r\n // TableRowNode,\r\n AutoLinkNode,\r\n LinkNode,\r\n // HashtagNode,\r\n ImageNode,\r\n ImageTextNode\r\n]\r\n\r\nexport default Nodes\r\n"],"names":["HeadingNode","ListNode","ListItemNode","AutoLinkNode","LinkNode","ImageNode","ImageTextNode"],"mappings":"~~;;;;;;AAUA~~,MAAM,QAAmC;AAAA,EACvCA,SAAA;AAAA,EACAC,KAAA;AAAA,EACAC,KAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOAC,KAAA;AAAA,EACAC,KAAA;AAAA;AAAA,EAEAC,MAAA;AAAA,EACAC,QAAA;AACF;;"}
1	+ {"version":3,"file":"nodes.js","sources":["../../../../../../src/components/basic/doc-editor/plugins/nodes.ts"],"sourcesContent":["import type { Klass, LexicalNode } from 'lexical'\r\nimport { HeadingNode, QuoteNode } from '@lexical/rich-text'\r\nimport { TableCellNode, TableNode, TableRowNode } from '@lexical/table'\r\nimport { ListItemNode, ListNode } from '@lexical/list'\r\nimport { CodeHighlightNode, CodeNode } from '@lexical/code'\r\nimport { AutoLinkNode, LinkNode } from '@lexical/link'\r\nimport { HashtagNode } from '@lexical/hashtag'\r\nimport { ImageNode } from \"./ImagePlugin\"\r\nimport { ImageTextNode } from \"./ImageTextPlugin\"\r\nimport { HtmlBlockNode } from \"./HtmlBlockPlugin\"\r\n\r\nconst Nodes: Array<Klass<LexicalNode>> = [\r\n HeadingNode,\r\n ListNode,\r\n ListItemNode,\r\n // QuoteNode,\r\n // CodeNode,\r\n // CodeHighlightNode,\r\n // TableNode,\r\n // TableCellNode,\r\n // TableRowNode,\r\n AutoLinkNode,\r\n LinkNode,\r\n // HashtagNode,\r\n ImageNode,\r\n ImageTextNode,\r\n HtmlBlockNode\r\n]\r\n\r\nexport default Nodes\r\n"],"names":["HeadingNode","ListNode","ListItemNode","AutoLinkNode","LinkNode","ImageNode","ImageTextNode","HtmlBlockNode"],"mappings":";;;;;;;AAWA,MAAM,QAAmC;AAAA,EACvCA,SAAA;AAAA,EACAC,KAAA;AAAA,EACAC,KAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOAC,KAAA;AAAA,EACAC,KAAA;AAAA;AAAA,EAEAC,MAAA;AAAA,EACAC,QAAA;AAAA,EACAC,QAAA;AACF;;"}

package/dist/cjs/components/business/resource-list/ResourceManager.js CHANGED Viewed

@@ -192,30 +192,6 @@ class ResourceManager extends utils.Disposable {
     }
     item.isSelected = !item.isSelected;
   }
-  async publishAssets() {
-    const httpRequest = MSAppClient.MSAppClient.instance.httpRequest;
-    try {
-      const isConfirm = await dm.Dialoger.confirm({
-        title: "发布资源",
-        message: "是否发布资源？",
-        type: "warning"
-      });
-      if (!isConfirm) {
-        return;
-      }
-      this.loadingManager.startLoading();
-      const response = await httpRequest.post(
-        `${this.baseURL}/content/publish/assets`
-      );
-      if (response.data.code !== 200) {
-        dm.Messager.error({ message: response.data.msg });
-        return;
-      }
-      dm.Messager.success({ message: "发布成功" });
-    } finally {
-      this.loadingManager.completeLoading();
-    }
-  }
 }
 exports.ResourceManager = ResourceManager;
 //# sourceMappingURL=ResourceManager.js.map