@maketribe/ms-app 3.2.25 → 3.2.27

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

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

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

@@ -1,13 +1,14 @@
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { TextNode } from "lexical";
 import { useModule } from "./composables.js";
 import { createHtml, createModuleMetaData } from "./utils.js";
-import { BaseBlockNode } from "../RichTextPlugin/nodes/BaseBlockNode.js";
+const ClassMarkName = "mk-doc-block__module";
 const AttrMarkName = "module-name";
-class ModuleBlockNode extends BaseBlockNode {
+class ModuleBlockNode extends TextNode {
   constructor(name, data, key) {
-    super(ModuleBlockNode.getType(), key);
+    super("", key);
     __publicField(this, "__name");
     __publicField(this, "__data");
     this.__name = name;
@@ -29,7 +30,7 @@ class ModuleBlockNode extends BaseBlockNode {
    * @returns 
    */
   static getMarkClassName() {
-    return BaseBlockNode.getMarkClassName(ModuleBlockNode.getType());
+    return ClassMarkName;
   }
   /**
    * 导入
@@ -54,6 +55,10 @@ class ModuleBlockNode extends BaseBlockNode {
     const writable = this.getWritable();
     writable.__data = data;
   }
+  /**
+   * 导出JSON
+   * @returns 
+   */
   exportJSON() {
     return {
       ...super.exportJSON(),
@@ -93,8 +98,8 @@ class ModuleBlockNode extends BaseBlockNode {
       throw new Error("定义模块模版的时候请用一个容器将模版内容包裹起来，不能有多个并列的元素！");
     }
     const contentEl = element.children[0];
-    if (!contentEl.classList.contains(this.getMarkClassName())) {
-      contentEl.classList.add(this.getMarkClassName());
+    if (!contentEl.classList.contains(ClassMarkName)) {
+      contentEl.classList.add(ClassMarkName);
     }
     contentEl.setAttribute(AttrMarkName, this.__name);
     return contentEl;
@@ -119,17 +124,24 @@ class ModuleBlockNode extends BaseBlockNode {
     return el;
   }
   /**
-  * 更新DOM
-  * @param prevNode 
-  * @param dom 
-  * @param config 
-  * @returns 
-  */
+   * 更新DOM
+   * @param prevNode 
+   * @param dom 
+   * @param config 
+   * @returns 
+   */
   updateDOM(prevNode, dom, config) {
     const el = this.createModuleElement();
     dom.innerHTML = el.innerHTML;
     return false;
   }
+  /**
+   * 非内联
+   * @returns 
+   */
+  isInline() {
+    return false;
+  }
 }
 function $createModuleBlockNode(name, data) {
   return new ModuleBlockNode(name, data);
@@ -139,7 +151,7 @@ function $isModuleBlockNode(node) {
 }
 const $covertModuleBlockDOM = (domNode) => {
   const name = domNode.getAttribute(AttrMarkName);
-  const isModule = BaseBlockNode.hasBlockByType(domNode, ModuleBlockNode.getType());
+  const isModule = domNode.classList.contains(ClassMarkName);
   const moduleContent = domNode.innerHTML;
   if (isModule && name) {
     domNode.innerHTML = "";

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

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

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

@@ -1,6 +1,18 @@
 const Modules = [];
 const registerDocModule = (options) => {
-  Modules.push(options);
+  if (Modules.findIndex((item) => item.name == options.name) >= 0) {
+    console.warn(`模块【${options.title}】重复注册！`);
+  } else {
+    Modules.push(options);
+  }
+};
+const unRegisterDocModule = (name) => {
+  for (let i = 0; i < Modules.length; i++) {
+    if (Modules[i].name == name) {
+      Modules.splice(i, 1);
+      break;
+    }
+  }
 };
 const useModules = () => {
   return Modules;
@@ -15,6 +27,7 @@ const useModule = (name) => {
 export {
   Modules,
   registerDocModule,
+  unRegisterDocModule,
   useModule,
   useModules
 };

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

@@ -1 +1 @@
-{"version":3,"file":"composables.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/composables.ts"],"sourcesContent":["import { DynamicFormItemType } from \"../../../dynamic-form-panel\"\r\n\r\n/**\r\n * 模块模版类型\r\n */\r\nexport type ModuleType = {\r\n  name:string,\r\n  title:string,\r\n  cover:string,\r\n  template:string,\r\n  editorCss:string|null|undefined,\r\n  options:DynamicFormItemType[]\r\n}\r\n\r\n\r\n/**\r\n * 模块模版定义\r\n */\r\nexport const Modules:ModuleType[] = [];\r\n\r\n/**\r\n * 注册模块模版\r\n * @param options \r\n */\r\nexport const registerDocModule = (options:ModuleType) => {\r\n  Modules.push(options);\r\n}\r\n\r\n/**\r\n * \r\n * @param name \r\n * @returns \r\n */\r\nexport const useModules = () => {\r\n  return Modules;\r\n}\r\n\r\n/**\r\n * \r\n * @param name \r\n * @returns \r\n */\r\nexport const useModule = (name:string) => {\r\n\r\n  const module = Modules.find(item=>item.name == name);\r\n\r\n  if(module == null){\r\n    throw new Error(\"未知的模块模版：【\" + name + \"】\");\r\n  }\r\n\r\n  return { module };\r\n}\r\n"],"names":[],"mappings":"AAkBO,MAAM,UAAuB,CAAC;AAMxB,MAAA,oBAAoB,CAAC,YAAuB;AACvD,UAAQ,KAAK,OAAO;AACtB;AAOO,MAAM,aAAa,MAAM;AACvB,SAAA;AACT;AAOa,MAAA,YAAY,CAAC,SAAgB;AAExC,QAAM,SAAS,QAAQ,KAAK,CAAM,SAAA,KAAK,QAAQ,IAAI;AAEnD,MAAG,UAAU,MAAK;AAChB,UAAM,IAAI,MAAM,cAAc,OAAO,GAAG;AAAA,EAC1C;AAEA,SAAO,EAAE,OAAO;AAClB;"}
+{"version":3,"file":"composables.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/composables.ts"],"sourcesContent":["import { DynamicFormItemType } from \"../../../dynamic-form-panel\"\r\n\r\n/**\r\n * 模块模版类型\r\n */\r\nexport type ModuleType = {\r\n  name:string,\r\n  title:string,\r\n  cover:string,\r\n  template:string,\r\n  editorCss:string|null|undefined,\r\n  options:DynamicFormItemType[]\r\n}\r\n\r\n\r\n/**\r\n * 模块模版定义\r\n */\r\nexport const Modules:ModuleType[] = [];\r\n\r\n/**\r\n * 注册模块模版\r\n * @param options \r\n */\r\nexport const registerDocModule = (options:ModuleType) => {\r\n\r\n  if(Modules.findIndex(item=>item.name == options.name) >= 0){\r\n    console.warn(`模块【${options.title}】重复注册！`);\r\n  }\r\n  else{\r\n    Modules.push(options);\r\n  }\r\n}\r\n\r\n\r\n/**\r\n * 卸载模块\r\n * @param name \r\n */\r\nexport const unRegisterDocModule = (name:string) => {\r\n\r\n  for(let i = 0;i < Modules.length; i++){\r\n    if(Modules[i].name == name){\r\n      Modules.splice(i,1);\r\n      break;\r\n    }\r\n  }\r\n}\r\n\r\n/**\r\n * \r\n * @param name \r\n * @returns \r\n */\r\nexport const useModules = () => {\r\n  return Modules;\r\n}\r\n\r\n/**\r\n * \r\n * @param name \r\n * @returns \r\n */\r\nexport const useModule = (name:string) => {\r\n\r\n  const module = Modules.find(item=>item.name == name);\r\n\r\n  if(module == null){\r\n    throw new Error(\"未知的模块模版：【\" + name + \"】\");\r\n  }\r\n\r\n  return { module };\r\n}\r\n"],"names":[],"mappings":"AAkBO,MAAM,UAAuB,CAAC;AAMxB,MAAA,oBAAoB,CAAC,YAAuB;AAEpD,MAAA,QAAQ,UAAU,CAAM,SAAA,KAAK,QAAQ,QAAQ,IAAI,KAAK,GAAE;AACzD,YAAQ,KAAK,MAAM,QAAQ,KAAK,QAAQ;AAAA,EAAA,OAEtC;AACF,YAAQ,KAAK,OAAO;AAAA,EACtB;AACF;AAOa,MAAA,sBAAsB,CAAC,SAAgB;AAElD,WAAQ,IAAI,GAAE,IAAI,QAAQ,QAAQ,KAAI;AACpC,QAAG,QAAQ,CAAC,EAAE,QAAQ,MAAK;AACjB,cAAA,OAAO,GAAE,CAAC;AAClB;AAAA,IACF;AAAA,EACF;AACF;AAOO,MAAM,aAAa,MAAM;AACvB,SAAA;AACT;AAOa,MAAA,YAAY,CAAC,SAAgB;AAExC,QAAM,SAAS,QAAQ,KAAK,CAAM,SAAA,KAAK,QAAQ,IAAI;AAEnD,MAAG,UAAU,MAAK;AAChB,UAAM,IAAI,MAAM,cAAc,OAAO,GAAG;AAAA,EAC1C;AAEA,SAAO,EAAE,OAAO;AAClB;"}

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

@@ -1,117 +1,98 @@
-import { defineComponent, ref, onMounted, onUnmounted, unref, openBlock, createElementBlock, normalizeClass, normalizeStyle, createCommentVNode } from "vue";
+import { defineComponent, onMounted, onUnmounted, unref, openBlock, createElementBlock, normalizeStyle, createCommentVNode } from "vue";
 import { useLexicalComposer } from "lexical-vue";
-import { mergeRegister, $insertNodeToNearestRoot } from "@lexical/utils";
-import { COMMAND_PRIORITY_EDITOR, $getNodeByKey } from "lexical";
-import { registerDocEditorToolbarExtend } from "../../core/index.js";
+import { mergeRegister } from "@lexical/utils";
+import { $getSelection, $isNodeSelection, COMMAND_PRIORITY_EDITOR, $getNodeByKey } from "lexical";
 import { useModule } from "./composables.js";
 import { ModuleBlockNode, $createModuleBlockNode, $isModuleBlockNode } from "./ModuleBlockNode.js";
-import { INSERT_MODULECONTAINER_COMMAND, $createModuleContainerNode, $isModuleContainerNode } from "./ModuleContainerNode.js";
+import { $isModuleGridNode } from "../GridPlugin/ModuleGridNode.js";
 import { INSERT_MODULE_COMMAND } from "./commands.js";
-import { findModuleNodeEl, findModuleContainerEl, showModuleSelectDialog } from "./utils.js";
+import { findModuleNodeEl, showModuleSelectDialog } from "./utils.js";
 import { createDefaultFormData } from "../../../dynamic-form-panel/utils.js";
+import "../../core/index.js";
 import { showDynamicFormDialoger } from "../../../dynamic-form-panel/dialog.js";
 import "element-plus";
-import { useElementModule } from "../../core/element-module.js";
+import "@maketribe/dm";
+import "@element-plus/icons-vue";
+import "@maketribe/utils";
+import "../../../../../core/DataModelDefines.js";
+import "vue-router";
+import "@maketribe/request";
+import "@maketribe/locale";
+import "../../../../../modules/ms/dataviews/ms-config/MsConfigTable.js";
+import "lodash-es";
+import "../../../../../modules/ms/components/material-list/index.js";
+import "../../../image-cropper/index.js";
+import "../../../upload-file/upload-file.js";
+import "../../../upload-file/context/web-file-upload-context.js";
+import "../../../upload-file/context/web-file-upload-context-options.js";
+import "../../../upload-file/ui/upload-image/index.js";
+import "../../../upload-file/ui/upload-file/index.js";
+import "../../../upload-file/ui/upload-video/index.js";
+import "../../../upload-file/upload-file-options.js";
+import { useElementBlockSelection } from "../../core/element-block.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   setup(__props) {
     const editor = useLexicalComposer();
-    registerDocEditorToolbarExtend({
-      icon: "Grid",
-      text: "模块",
-      action: async () => {
-        editor.dispatchCommand(INSERT_MODULECONTAINER_COMMAND, {});
-      },
-      sort: 9
-    });
-    const isSelectContainer = ref(false);
-    const { isSelected, curSelectKey, curSelectPos, updateActiveViewState } = useElementModule((el) => {
-      var modelEl = findModuleNodeEl(el);
-      var moduleContainerEl = findModuleContainerEl(el);
-      if (modelEl && moduleContainerEl) {
-        isSelectContainer.value = false;
-        return modelEl;
-      } else if (moduleContainerEl) {
-        isSelectContainer.value = true;
-        return moduleContainerEl;
-      }
-      isSelectContainer.value = false;
-      return null;
-    }, (selection) => {
+    const { isSelected, curSelectKey, curSelectPos, setSelection } = useElementBlockSelection(findModuleNodeEl, () => {
       const node = $getNodeByKey(curSelectKey.value);
-      if (node != null) {
-        const toolbarList = [];
-        if ($isModuleContainerNode(node)) {
-          toolbarList.push(...[
-            {
-              title: `编辑模块容器`,
-              icon: "Edit",
-              action: async () => {
-                var result = await showDynamicFormDialoger("模块容器", [
-                  { name: "class", title: "标识类名", component: "el-input", props: { clearable: true }, defaultValue: "" }
-                ], node.getAttrs());
-                editor.update(() => {
-                  node.setAttrs(result);
-                  updateActiveViewState(null);
-                });
-              }
-            },
-            {
-              title: "添加模块",
-              icon: "Plus",
-              action: async () => {
-                const result = await showModuleSelectDialog();
-                const defaultData = createDefaultFormData(result.options);
-                editor.dispatchCommand(INSERT_MODULE_COMMAND, { name: result.name, data: defaultData });
-                updateActiveViewState(null);
-              }
+      if ($isModuleBlockNode(node)) {
+        const { module } = useModule(node.__name);
+        const toobarList = [
+          {
+            title: `编辑【${module.title}】`,
+            icon: "Edit",
+            action: async () => {
+              var result = await showDynamicFormDialoger(module.title, module.options, node.__data);
+              editor.update(() => {
+                node.setContent(result);
+              });
             }
-          ]);
-        } else if ($isModuleBlockNode(node)) {
-          const { module } = useModule(node.__name);
-          toolbarList.push(...[
-            {
-              title: `编辑【${module.title}】`,
-              icon: "Edit",
-              action: async () => {
-                var result = await showDynamicFormDialoger(module.title, module.options, node.__data);
-                editor.update(() => {
-                  node.setContent(result);
-                  updateActiveViewState(null);
-                });
-              }
-            },
+          },
+          {
+            title: `插入【${module.title}】之前`,
+            icon: "BottomLeft",
+            action: async () => {
+              const result = await showModuleSelectDialog();
+              const defaultData = createDefaultFormData(result.options);
+              editor.dispatchCommand(INSERT_MODULE_COMMAND, { name: result.name, data: defaultData });
+              editor.update(() => {
+                node.insertBefore($createModuleBlockNode(result.name, defaultData));
+              });
+            }
+          },
+          {
+            title: `插入【${module.title}】之后`,
+            icon: "BottomRight",
+            action: async () => {
+              const result = await showModuleSelectDialog();
+              const defaultData = createDefaultFormData(result.options);
+              editor.dispatchCommand(INSERT_MODULE_COMMAND, { name: result.name, data: defaultData });
+              editor.update(() => {
+                node.insertAfter($createModuleBlockNode(result.name, defaultData));
+              });
+            }
+          }
+        ];
+        if (node.__prev) {
+          toobarList.push(
             {
-              title: `插入【${module.title}】之前`,
-              icon: "BottomLeft",
-              action: async () => {
-                const result = await showModuleSelectDialog();
-                const defaultData = createDefaultFormData(result.options);
-                editor.dispatchCommand(INSERT_MODULE_COMMAND, { name: result.name, data: defaultData });
-                updateActiveViewState(null);
-                editor.update(() => {
-                  node.insertBefore($createModuleBlockNode(result.name, defaultData));
-                  updateActiveViewState(null);
-                });
-              }
-            },
+              title: "选中上一个兄弟",
+              icon: "ArrowLeftBold",
+              action: async () => setSelection(node.__prev, null)
+            }
+          );
+        }
+        if (node.__next) {
+          toobarList.push(
             {
-              title: `插入【${module.title}】之后`,
-              icon: "BottomRight",
-              action: async () => {
-                const result = await showModuleSelectDialog();
-                const defaultData = createDefaultFormData(result.options);
-                editor.dispatchCommand(INSERT_MODULE_COMMAND, { name: result.name, data: defaultData });
-                updateActiveViewState(null);
-                editor.update(() => {
-                  node.insertAfter($createModuleBlockNode(result.name, defaultData));
-                  updateActiveViewState(null);
-                });
-              }
+              title: "选中上下个兄弟",
+              icon: "ArrowRightBold",
+              action: async () => setSelection(node.__next, null)
             }
-          ]);
+          );
         }
-        return toolbarList;
+        return toobarList;
       }
       return null;
     });
@@ -120,18 +101,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         throw new Error("ModuleBlockPlugin: 未注册模块模版节点！");
       }
       const unregister = mergeRegister(
-        // 插入模块容器
-        editor.registerCommand(INSERT_MODULECONTAINER_COMMAND, (payload) => {
-          $insertNodeToNearestRoot($createModuleContainerNode(payload));
-          return true;
-        }, COMMAND_PRIORITY_EDITOR),
         // 插入模块
         editor.registerCommand(INSERT_MODULE_COMMAND, (payload) => {
-          if (curSelectKey.value) {
-            const node = $getNodeByKey(curSelectKey.value);
-            if ($isModuleContainerNode(node)) {
-              node.append($createModuleBlockNode(payload.name, payload.data));
-            }
+          const selection = $getSelection();
+          const node = $isNodeSelection(selection) ? selection == null ? void 0 : selection.getNodes()[0] : null;
+          if ($isModuleGridNode(node)) {
+            node.append($createModuleBlockNode(payload.name, payload.data));
           }
           return true;
         }, COMMAND_PRIORITY_EDITOR)
@@ -141,9 +116,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return unref(isSelected) ? (openBlock(), createElementBlock("div", {
         key: 0,
-        class: normalizeClass(["mk-doc-active-mark", { box: isSelectContainer.value }]),
+        class: "mk-doc-active-element-block-mark",
         style: normalizeStyle(unref(curSelectPos))
-      }, null, 6)) : createCommentVNode("", true);
+      }, null, 4)) : createCommentVNode("", true);
     };
   }
 });

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

@@ -1 +1 @@
-{"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { $insertNodeToNearestRoot,mergeRegister } from '@lexical/utils'\r\nimport { \r\n  COMMAND_PRIORITY_EDITOR,COMMAND_PRIORITY_LOW,CLICK_COMMAND, $getSelection,$isNodeSelection, $getNodeByKey\r\n} from 'lexical'\r\nimport { onMounted, onUnmounted,ref } from 'vue'\r\nimport { registerDocEditorToolbarExtend,type ToolbarExtendPlugin } from \"../../core\"\r\nimport { ModuleType,useModule } from \"./composables\"\r\nimport { ModuleBlockNode,$createModuleBlockNode,$isModuleBlockNode } from \"./ModuleBlockNode\"\r\nimport { type ModuleContainerAttrType,INSERT_MODULECONTAINER_COMMAND,$createModuleContainerNode,$isModuleContainerNode } from \"./ModuleContainerNode\"\r\nimport { INSERT_MODULE_COMMAND,type ModulePropType } from \"./commands\"\r\nimport { showModuleSelectDialog,findModuleNodeEl,findModuleContainerEl } from \"./utils\"\r\nimport { createDefaultFormData } from \"../../../dynamic-form-panel/utils\"\r\nimport {  useElementModule } from '../../core'\r\nimport { showDynamicFormDialoger } from \"../../../dynamic-form-panel\"\r\n\r\n// 编辑器\r\nconst editor = useLexicalComposer()\r\n\r\n// 注册到工具条\r\nregisterDocEditorToolbarExtend({\r\n  icon:\"Grid\",\r\n  text:\"模块\",\r\n  action:async ()=>{\r\n    // 插入\r\n    editor.dispatchCommand(INSERT_MODULECONTAINER_COMMAND,{ } as ModuleContainerAttrType)\r\n \r\n  },\r\n  sort:9\r\n} as ToolbarExtendPlugin)\r\n\r\n// 是否是选中模块容器\r\nconst isSelectContainer = ref(false);\r\n\r\n// 使用元素模块 集成了模块选中删除以及工具条\r\nconst { isSelected, curSelectKey, curSelectPos,updateActiveViewState } = useElementModule(el=>{\r\n  \r\n  var modelEl = findModuleNodeEl(el);\r\n  var moduleContainerEl = findModuleContainerEl(el);\r\n\r\n\r\n  if(modelEl && moduleContainerEl){\r\n    isSelectContainer.value = false;\r\n    \r\n    return modelEl;\r\n  }\r\n  else if(moduleContainerEl){\r\n\r\n    isSelectContainer.value = true;\r\n\r\n    return moduleContainerEl;\r\n  }\r\n\r\n  isSelectContainer.value = false;\r\n  return null;\r\n\r\n},(selection)=>{\r\n  \r\n  const node = $getNodeByKey(curSelectKey.value)\r\n\r\n  if(node != null){\r\n\r\n    // 工具条\r\n    const toolbarList =  [];\r\n\r\n    // 模块容器\r\n    if($isModuleContainerNode(node)){\r\n      toolbarList.push(...[\r\n      {\r\n          title:`编辑模块容器`,icon:\"Edit\",action:async ()=>{\r\n\r\n            var result = await showDynamicFormDialoger(\"模块容器\",[\r\n            { name:\"class\", title:\"标识类名\", component:\"el-input\",  props:{ clearable:true }, defaultValue:\"\" }\r\n            ],node.getAttrs())\r\n      \r\n            editor.update(() => {\r\n              node.setAttrs(result)\r\n              updateActiveViewState(null);\r\n            })\r\n\r\n          } \r\n        },\r\n        {\r\n          title:\"添加模块\",icon:\"Plus\",action:async ()=>{\r\n            // 打开模块面板\r\n            const result = (await showModuleSelectDialog()) as ModuleType;\r\n            const defaultData = createDefaultFormData(result.options);\r\n            // 插入模块\r\n            editor.dispatchCommand(INSERT_MODULE_COMMAND,{ name:result.name,data:defaultData})\r\n            updateActiveViewState(null);\r\n          } \r\n        }\r\n      ])\r\n    }\r\n    // 选中模块\r\n    else if($isModuleBlockNode(node)){\r\n\r\n      const { module } = useModule(node.__name);\r\n\r\n      toolbarList.push(...[\r\n        {\r\n          title:`编辑【${module.title}】`,icon:\"Edit\",action:async ()=>{\r\n\r\n            var result = await showDynamicFormDialoger(module.title,module.options,node.__data)\r\n      \r\n            editor.update(() => {\r\n              node.setContent(result)\r\n              updateActiveViewState(null);\r\n            })\r\n\r\n          } \r\n        },\r\n        {\r\n          title:`插入【${module.title}】之前`,icon:\"BottomLeft\",action:async ()=>{\r\n\r\n            // 打开模块面板\r\n            const result = (await showModuleSelectDialog()) as ModuleType;\r\n            const defaultData = createDefaultFormData(result.options);\r\n            // 插入模块\r\n            editor.dispatchCommand(INSERT_MODULE_COMMAND,{ name:result.name,data:defaultData})\r\n            updateActiveViewState(null);\r\n      \r\n            editor.update(() => {\r\n              node.insertBefore($createModuleBlockNode(result.name,defaultData))\r\n              updateActiveViewState(null);\r\n            })\r\n\r\n          } \r\n        },\r\n        {\r\n          title:`插入【${module.title}】之后`,icon:\"BottomRight\",action:async ()=>{\r\n\r\n            // 打开模块面板\r\n            const result = (await showModuleSelectDialog()) as ModuleType;\r\n            const defaultData = createDefaultFormData(result.options);\r\n            // 插入模块\r\n            editor.dispatchCommand(INSERT_MODULE_COMMAND,{ name:result.name,data:defaultData})\r\n            updateActiveViewState(null);\r\n      \r\n            editor.update(() => {\r\n              node.insertAfter($createModuleBlockNode(result.name,defaultData))\r\n              updateActiveViewState(null);\r\n            })\r\n\r\n          } \r\n        }\r\n      ])\r\n    }\r\n\r\n    return toolbarList;\r\n  }\r\n\r\n  return null;\r\n})\r\n\r\n\r\nonMounted(() => {\r\n\r\n  if (!editor.hasNodes([ModuleBlockNode])){\r\n    throw new Error('ModuleBlockPlugin: 未注册模块模版节点！')\r\n  }\r\n\r\n  // 注册指令\r\n  const unregister = mergeRegister(\r\n    // 插入模块容器\r\n    editor.registerCommand<ModuleContainerAttrType>(INSERT_MODULECONTAINER_COMMAND,(payload) => { \r\n      $insertNodeToNearestRoot($createModuleContainerNode(payload))\r\n      return true\r\n    },COMMAND_PRIORITY_EDITOR),\r\n    // 插入模块\r\n    editor.registerCommand<ModulePropType>(INSERT_MODULE_COMMAND,(payload) => {\r\n      \r\n      if(curSelectKey.value){\r\n\r\n        const node = $getNodeByKey(curSelectKey.value);\r\n\r\n        if($isModuleContainerNode(node)){\r\n          node.append($createModuleBlockNode(payload.name,payload.data))\r\n        }\r\n      }\r\n     \r\n      return true\r\n    },COMMAND_PRIORITY_EDITOR)\r\n\r\n  );\r\n\r\n  onUnmounted(() => unregister())\r\n})\r\n</script>\r\n\r\n<template>\r\n  <div class=\"mk-doc-active-mark\" :class=\"{box:isSelectContainer}\" v-if=\"isSelected\" :style=\"curSelectPos\">\r\n    \r\n  </div>\r\n</template>\r\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/ModulePlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { useLexicalComposer } from 'lexical-vue'\r\nimport { mergeRegister } from '@lexical/utils'\r\nimport { \r\n  COMMAND_PRIORITY_EDITOR,$getNodeByKey,$getSelection,$isNodeSelection\r\n} from 'lexical'\r\nimport { onMounted, onUnmounted,ref } from 'vue'\r\nimport { ModuleType,useModule } from \"./composables\"\r\nimport { ModuleBlockNode,$createModuleBlockNode,$isModuleBlockNode } from \"./ModuleBlockNode\"\r\nimport { $isModuleGridNode } from \"../GridPlugin/ModuleGridNode\"\r\nimport { INSERT_MODULE_COMMAND,type ModulePropType } from \"./commands\"\r\nimport { showModuleSelectDialog,findModuleNodeEl } from \"./utils\"\r\nimport { createDefaultFormData } from \"../../../dynamic-form-panel/utils\"\r\nimport {  useElementBlockSelection } from '../../core'\r\nimport { showDynamicFormDialoger } from \"../../../dynamic-form-panel\"\r\n\r\n// 编辑器\r\nconst editor = useLexicalComposer()\r\n\r\n// 使用元素模块 集成了模块选中删除以及工具条\r\nconst { isSelected, curSelectKey, curSelectPos,setSelection } = useElementBlockSelection(findModuleNodeEl,()=>{\r\n  \r\n  const node = $getNodeByKey(curSelectKey.value)\r\n\r\n  if($isModuleBlockNode(node)){\r\n\r\n    const { module } = useModule(node.__name);\r\n\r\n    const toobarList = [\r\n      {\r\n        title:`编辑【${module.title}】`,icon:\"Edit\",action:async ()=>{\r\n\r\n          var result = await showDynamicFormDialoger(module.title,module.options,node.__data)\r\n\r\n          editor.update(() => {\r\n            node.setContent(result)\r\n          })\r\n\r\n        } \r\n      },\r\n      {\r\n        title:`插入【${module.title}】之前`,icon:\"BottomLeft\",action:async ()=>{\r\n\r\n          // 打开模块面板\r\n          const result = (await showModuleSelectDialog()) as ModuleType;\r\n          const defaultData = createDefaultFormData(result.options);\r\n          // 插入模块\r\n          editor.dispatchCommand(INSERT_MODULE_COMMAND,{ name:result.name,data:defaultData})\r\n\r\n          editor.update(() => {\r\n            node.insertBefore($createModuleBlockNode(result.name,defaultData))\r\n          })\r\n\r\n        } \r\n      },\r\n      {\r\n        title:`插入【${module.title}】之后`,icon:\"BottomRight\",action:async ()=>{\r\n\r\n          // 打开模块面板\r\n          const result = (await showModuleSelectDialog()) as ModuleType;\r\n          const defaultData = createDefaultFormData(result.options);\r\n          // 插入模块\r\n          editor.dispatchCommand(INSERT_MODULE_COMMAND,{ name:result.name,data:defaultData})\r\n\r\n          editor.update(() => {\r\n            node.insertAfter($createModuleBlockNode(result.name,defaultData))\r\n          })\r\n\r\n        } \r\n      }\r\n    ];\r\n\r\n    if(node.__prev){\r\n      toobarList.push(\r\n        {\r\n          title:\"选中上一个兄弟\",icon:\"ArrowLeftBold\",action: async ()=> setSelection(node.__prev!,null)\r\n        }\r\n      )\r\n    }\r\n    if(node.__next){\r\n      toobarList.push(\r\n        {\r\n          title:\"选中上下个兄弟\",icon:\"ArrowRightBold\",action: async ()=> setSelection(node.__next!,null)\r\n        }\r\n      )\r\n    }\r\n\r\n    return toobarList;\r\n  }\r\n\r\n  return null;\r\n})\r\n\r\n\r\nonMounted(() => {\r\n\r\n  if (!editor.hasNodes([ModuleBlockNode])){\r\n    throw new Error('ModuleBlockPlugin: 未注册模块模版节点！')\r\n  }\r\n\r\n  // 注册指令\r\n  const unregister = mergeRegister(\r\n\r\n    // 插入模块\r\n    editor.registerCommand<ModulePropType>(INSERT_MODULE_COMMAND,(payload) => {\r\n\r\n      const selection = $getSelection()\r\n      const node = $isNodeSelection(selection) ? selection?.getNodes()[0] : null;\r\n\r\n      if($isModuleGridNode(node)){\r\n        node.append($createModuleBlockNode(payload.name,payload.data))\r\n      }\r\n     \r\n      return true\r\n    },COMMAND_PRIORITY_EDITOR)\r\n\r\n  );\r\n\r\n  onUnmounted(() => unregister())\r\n})\r\n</script>\r\n\r\n<template>\r\n  <div class=\"mk-doc-active-element-block-mark\" v-if=\"isSelected\" :style=\"curSelectPos\">\r\n    \r\n  </div>\r\n</template>\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,UAAM,SAAS;AAGT,UAAA,EAAE,YAAY,cAAc,cAAa,iBAAiB,yBAAyB,kBAAiB,MAAI;AAEtG,YAAA,OAAO,cAAc,aAAa,KAAK;AAE1C,UAAA,mBAAmB,IAAI,GAAE;AAE1B,cAAM,EAAE,OAAW,IAAA,UAAU,KAAK,MAAM;AAExC,cAAM,aAAa;AAAA,UACjB;AAAA,YACE,OAAM,MAAM,OAAO,KAAK;AAAA,YAAI,MAAK;AAAA,YAAO,QAAO,YAAU;AAEnD,kBAAA,SAAS,MAAM,wBAAwB,OAAO,OAAM,OAAO,SAAQ,KAAK,MAAM;AAElF,qBAAO,OAAO,MAAM;AAClB,qBAAK,WAAW,MAAM;AAAA,cAAA,CACvB;AAAA,YAEH;AAAA,UACF;AAAA,UACA;AAAA,YACE,OAAM,MAAM,OAAO,KAAK;AAAA,YAAM,MAAK;AAAA,YAAa,QAAO,YAAU;AAGzD,oBAAA,SAAU,MAAM;AAChB,oBAAA,cAAc,sBAAsB,OAAO,OAAO;AAEjD,qBAAA,gBAAgB,uBAAsB,EAAE,MAAK,OAAO,MAAK,MAAK,aAAY;AAEjF,qBAAO,OAAO,MAAM;AAClB,qBAAK,aAAa,uBAAuB,OAAO,MAAK,WAAW,CAAC;AAAA,cAAA,CAClE;AAAA,YAEH;AAAA,UACF;AAAA,UACA;AAAA,YACE,OAAM,MAAM,OAAO,KAAK;AAAA,YAAM,MAAK;AAAA,YAAc,QAAO,YAAU;AAG1D,oBAAA,SAAU,MAAM;AAChB,oBAAA,cAAc,sBAAsB,OAAO,OAAO;AAEjD,qBAAA,gBAAgB,uBAAsB,EAAE,MAAK,OAAO,MAAK,MAAK,aAAY;AAEjF,qBAAO,OAAO,MAAM;AAClB,qBAAK,YAAY,uBAAuB,OAAO,MAAK,WAAW,CAAC;AAAA,cAAA,CACjE;AAAA,YAEH;AAAA,UACF;AAAA,QAAA;AAGF,YAAG,KAAK,QAAO;AACF,qBAAA;AAAA,YACT;AAAA,cACE,OAAM;AAAA,cAAU,MAAK;AAAA,cAAgB,QAAQ,YAAW,aAAa,KAAK,QAAQ,IAAI;AAAA,YACxF;AAAA,UAAA;AAAA,QAEJ;AACA,YAAG,KAAK,QAAO;AACF,qBAAA;AAAA,YACT;AAAA,cACE,OAAM;AAAA,cAAU,MAAK;AAAA,cAAiB,QAAQ,YAAW,aAAa,KAAK,QAAQ,IAAI;AAAA,YACzF;AAAA,UAAA;AAAA,QAEJ;AAEO,eAAA;AAAA,MACT;AAEO,aAAA;AAAA,IAAA,CACR;AAGD,cAAU,MAAM;AAEd,UAAI,CAAC,OAAO,SAAS,CAAC,eAAe,CAAC,GAAE;AAChC,cAAA,IAAI,MAAM,+BAA+B;AAAA,MACjD;AAGA,YAAM,aAAa;AAAA;AAAA,QAGjB,OAAO,gBAAgC,uBAAsB,CAAC,YAAY;AAExE,gBAAM,YAAY;AACZ,gBAAA,OAAO,iBAAiB,SAAS,IAAI,uCAAW,WAAW,KAAK;AAEnE,cAAA,kBAAkB,IAAI,GAAE;AACzB,iBAAK,OAAO,uBAAuB,QAAQ,MAAK,QAAQ,IAAI,CAAC;AAAA,UAC/D;AAEO,iBAAA;AAAA,WACP,uBAAuB;AAAA,MAAA;AAIf,kBAAA,MAAM,YAAY;AAAA,IAAA,CAC/B;;;;;;;;;;"}

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

@@ -4,7 +4,6 @@ import { ElInput, ElButton } from "element-plus";
 import { Search } from "@element-plus/icons-vue";
 import { useModules } from "./composables.js";
 import { ModuleBlockNode } from "./ModuleBlockNode.js";
-import { ModuleContainerNode } from "./ModuleContainerNode.js";
 const showModuleSelectDialog = async () => {
   return new Promise((resolve) => {
     const Modules = useModules();
@@ -131,16 +130,6 @@ const createModuleMetaData = (html, options) => {
     data
   };
 };
-const findModuleContainerEl = (element) => {
-  var el = element;
-  if (el.classList.contains(ModuleContainerNode.getMarkClassName())) {
-    return el;
-  }
-  while (el != null && !el.classList.contains(ModuleContainerNode.getMarkClassName())) {
-    el = el.parentElement;
-  }
-  return el;
-};
 const findModuleNodeEl = (element) => {
   var el = element;
   if (el.classList.contains(ModuleBlockNode.getMarkClassName())) {
@@ -154,7 +143,6 @@ const findModuleNodeEl = (element) => {
 export {
   createHtml,
   createModuleMetaData,
-  findModuleContainerEl,
   findModuleNodeEl,
   showModuleSelectDialog
 };