@maketribe/ms-app 3.2.23 → 3.2.25

package/dist/esm/components/basic/upload-file/ui/upload-video/upload-video.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"upload-video.js","sources":["../../../../../../../src/components/basic/upload-file/ui/upload-video/upload-video.tsx"],"sourcesContent":["import {\r\n  Fragment,\r\n  Ref,\r\n  VNode,\r\n  computed,\r\n  defineComponent,\r\n  ref,\r\n  unref,\r\n  watch,\r\n} from \"vue\";\r\nimport { ElImage, ElTooltip, ElImageViewer } from \"element-plus\";\r\nimport { MKSvgIcon } from \"../../../svg-icon\";\r\nimport { MKUploadFile } from \"../../upload-file\";\r\nimport { uploadVideoEmits, uploadVideoProps } from \"./upload-video-options\";\r\nimport { UploadContext } from \"../../context\";\r\n\r\nconst MKUploadFileItem = defineComponent({\r\n  name: \"MKUploadFileItem\",\r\n  props: {\r\n    modelValue: {\r\n      type: String,\r\n      default: \"\",\r\n    },\r\n    uploadContext: {\r\n      type: UploadContext,\r\n      required: true,\r\n    },\r\n    width: {\r\n      type: String,\r\n      default: \"180px\",\r\n    },\r\n    height: {\r\n      type: String,\r\n      default: \"180px\",\r\n    },\r\n    icon: {\r\n      type: String,\r\n      default: \"Plus\",\r\n    }\r\n  },\r\n  emits: [\"update:modelValue\", \"view\", \"delete\"],\r\n  setup(props, { emit }) {\r\n    const uploadFileInstance: Ref<InstanceType<typeof MKUploadFile> | null> =\r\n      ref(null);\r\n\r\n    const imageInstance: Ref<InstanceType<typeof ElImage> | null> = ref(null);\r\n\r\n    const currentFileName: Ref<string> = ref(\"\")\r\n\r\n    const modelValue = computed({\r\n      get: () => props.modelValue as string,\r\n      set: (v: string) => {\r\n        emit(\"update:modelValue\", v);\r\n      },\r\n    });\r\n\r\n\r\n\r\n    const getFileIconBySuffix = (v: string) => {\r\n      const index = v.lastIndexOf('.');\r\n      const indexBias = v.lastIndexOf('/');\r\n      const icon = [\"html\", \"apk\", \"eps\", \"ppt\", \"xml\", \"pdf\", \"exe\", \"psd\", \"visio\", \"xls\", \"doc\", \"txt\", \"dll\", \"tiff\", \"bmp\", \"audio\"]\r\n      const zipIcon = [\"zip\", \"rar\", \"zip\", \"tar\", \"gz\", \"bz2\", \"7z\"]\r\n      const suffixIcon = v.substring(index + 1)\r\n      const suffix = v.substring(indexBias + 1)\r\n      if (icon.includes(suffixIcon)) {\r\n        return {\r\n          icon: suffixIcon,\r\n          suffix: suffix,\r\n        }\r\n      } else if (zipIcon.includes(suffixIcon)) {\r\n        return {\r\n          icon: \"yasuo\",\r\n          suffix: suffix\r\n        }\r\n      } else {\r\n        return {\r\n          icon: \"weizhiwenjian\",\r\n          suffix: suffix\r\n        }\r\n      }\r\n    }\r\n\r\n    const handleUpdateModelValue = (v: string) => {\r\n      modelValue.value = v;\r\n    };\r\n\r\n    const handleClick = (event: MouseEvent) => {\r\n      event.stopPropagation();\r\n\r\n      if (unref(modelValue)) {\r\n        return;\r\n      }\r\n\r\n      unref(uploadFileInstance)?.handleUpload();\r\n    };\r\n\r\n    const handleView = (event: MouseEvent) => {\r\n      event.stopPropagation();\r\n\r\n      emit(\"view\", unref(modelValue));\r\n    };\r\n\r\n    const handleDelete = (event: MouseEvent) => {\r\n      event.stopPropagation();\r\n\r\n      // modelValue.value = \"\";\r\n      emit(\"delete\", unref(modelValue));\r\n    };\r\n\r\n    return () => {\r\n      let content;\r\n\r\n      if (unref(modelValue)) {\r\n        content = (\r\n          <Fragment>\r\n            <div class=\"mk-upload-video-item__file\">\r\n              <MKSvgIcon iconClass=\"video\" />\r\n            </div>\r\n\r\n            <div class=\"mk-upload-video-item__mask\">\r\n              <ElTooltip content=\"查看\">\r\n                <MKSvgIcon iconClass=\"View\" onClick={handleView} />\r\n              </ElTooltip>\r\n              <ElTooltip content=\"删除\">\r\n                <MKSvgIcon iconClass=\"Delete\" onClick={handleDelete} />\r\n              </ElTooltip>\r\n            </div>\r\n          </Fragment>\r\n        );\r\n      } else {\r\n        content = <div class=\"mk-upload-video-item__wrapper__desc\">\r\n          <MKSvgIcon iconClass={props.icon} class=\"mk-upload-video-item__wrapper__desc__icon\" />\r\n          <span class=\"mk-upload-video-item__wrapper__desc__text\">点击上传视频</span>\r\n        </div>;\r\n      }\r\n\r\n      return (\r\n        <div class=\"mk-upload-video-item\" style={{ width: props.width, height: props.height }}>\r\n          <MKUploadFile\r\n            modelValue={props.modelValue}\r\n            onUpdate:modelValue={handleUpdateModelValue}\r\n            uploadContext={props.uploadContext}\r\n            ref={\r\n              ((el: InstanceType<typeof MKUploadFile>) =>\r\n                (uploadFileInstance.value = el)) as any\r\n            }\r\n          >\r\n            <div class=\"mk-upload-video-item__wrapper\" onClick={handleClick}>\r\n              {content}\r\n            </div>\r\n          </MKUploadFile>\r\n        </div>\r\n      );\r\n    };\r\n  },\r\n});\r\n\r\nexport default defineComponent({\r\n  name: \"MKUploadFile\",\r\n  props: uploadVideoProps,\r\n  emits: uploadVideoEmits,\r\n  setup(props, { emit }) {\r\n    const modelValue = computed({\r\n      get: () => props.modelValue as string[] | string,\r\n      set: (v: string[] | string) => emit(\"update:modelValue\", v),\r\n    });\r\n\r\n    const currentVideoSrc: Ref<string> = ref(\"\");\r\n\r\n    const multiple = computed(() => props.multiple);\r\n\r\n    const isShowVideoViewer: Ref<boolean> = ref(false);\r\n\r\n    watch(\r\n      computed(() => [unref(modelValue), unref(multiple)]),\r\n      ([value, multiple]) => {\r\n        if (multiple && !Array.isArray(value)) {\r\n          modelValue.value = [];\r\n        }\r\n      },\r\n      { immediate: true }\r\n    );\r\n\r\n    const handleDelete = (src: string) => {\r\n      if (!unref(multiple)) {\r\n        modelValue.value = \"\";\r\n        return;\r\n      }\r\n\r\n      const index = unref(modelValue).indexOf(src);\r\n\r\n      if (index === -1) {\r\n        return;\r\n      }\r\n\r\n      (modelValue.value as string[]).splice(index, 1);\r\n    };\r\n\r\n    const handleShowImageViewer = (src: string) => {\r\n      isShowVideoViewer.value = true;\r\n      currentVideoSrc.value = src;\r\n    };\r\n\r\n    const handleCloseImageViewer = () => {\r\n      isShowVideoViewer.value = false;\r\n    };\r\n\r\n    const handleAppendImage = (src: string) => {\r\n      const _value = unref(modelValue);\r\n\r\n      if (Array.isArray(_value)) {\r\n        _value.push(src);\r\n      }\r\n    };\r\n\r\n    return () => {\r\n      const _multiple = unref(multiple);\r\n\r\n      let content;\r\n\r\n      if (!_multiple) {\r\n        content = (\r\n          <MKUploadFileItem\r\n            onView={handleShowImageViewer}\r\n            onDelete={handleDelete}\r\n            modelValue={unref(modelValue) as string}\r\n            onUpdate:modelValue={(value) => (modelValue.value = value)}\r\n            uploadContext={props.uploadContext}\r\n            width={props.width}\r\n            height={props.height}\r\n            icon={props.icon}\r\n          />\r\n        );\r\n      } else {\r\n        let images: VNode[] | null = null;\r\n\r\n        if (Array.isArray(unref(modelValue))) {\r\n          images = (unref(modelValue) as string[]).map((src) => (\r\n            <MKUploadFileItem\r\n              onView={handleShowImageViewer}\r\n              onDelete={handleDelete}\r\n              modelValue={src}\r\n              uploadContext={props.uploadContext}\r\n              width={props.width}\r\n              height={props.height}\r\n              icon={props.icon}\r\n            />\r\n          ));\r\n        }\r\n\r\n        content = (\r\n          <Fragment>\r\n            {images}\r\n            <MKUploadFileItem\r\n              onUpdate:modelValue={handleAppendImage}\r\n              uploadContext={props.uploadContext}\r\n              width={props.width}\r\n              height={props.height}\r\n              icon={props.icon}\r\n            />\r\n          </Fragment>\r\n        );\r\n      }\r\n\r\n      const videoViewer = unref(isShowVideoViewer) ? (\r\n        <div class=\"mk-upload-video-viewer\"  >\r\n          <MKSvgIcon class=\"mk-upload-video-viewer__close\" iconClass=\"Close\" onClick={() => isShowVideoViewer.value = false}></MKSvgIcon>\r\n          <div class=\"mk-upload-video-viewer__mask\"></div>\r\n          <video class=\"mk-upload-video-viewer__video\" src={currentVideoSrc.value} controls></video>\r\n        </div>\r\n      ) : null;\r\n\r\n      return (\r\n        <div class=\"mk-upload-video\" style={{ width: _multiple ? \"\" : props.width }}>\r\n          {content}\r\n          {videoViewer}\r\n        </div>\r\n      );\r\n    };\r\n  },\r\n});\r\n"],"names":["MKUploadFileItem","defineComponent","name","props","modelValue","type","String","default","uploadContext","UploadContext","required","width","height","icon","emits","setup","emit","uploadFileInstance","ref","computed","get","set","v","handleUpdateModelValue","value","handleClick","event","stopPropagation","unref","handleUpload","handleView","handleDelete","content","_createVNode","_Fragment","MKSvgIcon","ElTooltip","_createTextVNode","MKUploadFile","el","uploadVideoProps","uploadVideoEmits","currentVideoSrc","multiple","isShowVideoViewer","watch","Array","isArray","immediate","src","index","indexOf","splice","handleShowImageViewer","handleAppendImage","_value","push","_multiple","images","map","videoViewer","onClick"],"mappings":"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"}

package/dist/esm/components/basic/upload-file/upload-file-options.js

@@ -13,7 +13,8 @@ const uploadFileProps = buildProps({
   }
 });
 const uploadFileEmits = {
-  "update:modelValue": (path) => true
+  "update:modelValue": (path) => true,
+  "getSelectFileName": (name) => true
 };
 export {
   uploadFileEmits,

package/dist/esm/components/basic/upload-file/upload-file-options.js.map

@@ -1 +1 @@
-{"version":3,"file":"upload-file-options.js","sources":["../../../../../src/components/basic/upload-file/upload-file-options.ts"],"sourcesContent":["import { ExtractPropTypes } from \"vue\";\r\nimport { buildProps } from \"@maketribe/utils\";\r\nimport { UploadContext, WebFileUploadContext } from \"./context\";\r\n\r\nexport const uploadFileProps = buildProps({\r\n  modelValue: {\r\n    type: String,\r\n  },\r\n  uploadContext: {\r\n    type: UploadContext,\r\n    default: () => new WebFileUploadContext(),\r\n  },\r\n} as const);\r\n\r\nexport type UploadFileProps = ExtractPropTypes<typeof uploadFileProps>;\r\n\r\nexport const uploadFileEmits = {\r\n  \"update:modelValue\": (path: string) => true,\r\n};\r\n\r\nexport type UploadFileEmits = typeof uploadFileEmits;\r\n"],"names":[],"mappings":";;;;;AAIO,MAAM,kBAAkB,WAAW;AAAA,EACxC,YAAY;AAAA,IACV,MAAM;AAAA,EACR;AAAA,EACA,eAAe;AAAA,IACb,MAAM;AAAA,IACN,SAAS,MAAM,IAAI,qBAAqB;AAAA,EAC1C;AACF,CAAU;AAIH,MAAM,kBAAkB;AAAA,EAC7B,qBAAqB,CAAC,SAAiB;AACzC;"}
+{"version":3,"file":"upload-file-options.js","sources":["../../../../../src/components/basic/upload-file/upload-file-options.ts"],"sourcesContent":["import { ExtractPropTypes } from \"vue\";\r\nimport { buildProps } from \"@maketribe/utils\";\r\nimport { UploadContext, WebFileUploadContext } from \"./context\";\r\n\r\nexport const uploadFileProps = buildProps({\r\n  modelValue: {\r\n    type: String,\r\n  },\r\n  uploadContext: {\r\n    type: UploadContext,\r\n    default: () => new WebFileUploadContext(),\r\n  },\r\n} as const);\r\n\r\nexport type UploadFileProps = ExtractPropTypes<typeof uploadFileProps>;\r\n\r\nexport const uploadFileEmits = {\r\n  \"update:modelValue\": (path: string) => true,\r\n  \"getSelectFileName\": (name: string) => true,\r\n};\r\n\r\nexport type UploadFileEmits = typeof uploadFileEmits;\r\n"],"names":[],"mappings":";;;;;AAIO,MAAM,kBAAkB,WAAW;AAAA,EACxC,YAAY;AAAA,IACV,MAAM;AAAA,EACR;AAAA,EACA,eAAe;AAAA,IACb,MAAM;AAAA,IACN,SAAS,MAAM,IAAI,qBAAqB;AAAA,EAC1C;AACF,CAAU;AAIH,MAAM,kBAAkB;AAAA,EAC7B,qBAAqB,CAAC,SAAiB;AAAA,EACvC,qBAAqB,CAAC,SAAiB;AACzC;"}

package/dist/esm/components/basic/upload-file/upload-file.js

@@ -24,6 +24,7 @@ const _UploadFile = /* @__PURE__ */ defineComponent({
         const uploadResult = await unref(uploadContext).selectFile();
         if (uploadResult.success) {
           value.value = uploadResult.path || value.value;
+          emit("getSelectFileName", uploadResult.name || "");
           return;
         }
         ElMessage.error(uploadResult.msg);

package/dist/esm/components/basic/upload-file/upload-file.js.map

@@ -1 +1 @@
-{"version":3,"file":"upload-file.js","sources":["../../../../../src/components/basic/upload-file/upload-file.tsx"],"sourcesContent":["import { computed, defineComponent, inject, unref } from \"vue\";\r\nimport { uploadFileEmits, uploadFileProps } from \"./upload-file-options\";\r\nimport { ElMessage } from \"element-plus\";\r\nimport { UploadContextCtxKey } from \"./context\";\r\nimport { withInstall } from \"@maketribe/utils\";\r\n\r\n/**\r\n * 文件上传\r\n *\r\n * 文件上传在本后台中有两大分类\r\n * 1.直接上传文件\r\n * 2.使用素材库文件\r\n *\r\n * 文件上传的界面交互又会分为几种情况\r\n * 1.单文件上传（单文件上传，可能会根据。文件情况的不同，界面显示方式不一样）\r\n * 2.多文件上传（多文件上传基于单文件的逻辑，不过是会变成多个文件）\r\n *\r\n * 希望文件交互组件不需要用了解是直接上传文件或使用素材库。\r\n *\r\n */\r\n\r\nconst _UploadFile = defineComponent({\r\n  name: \"MKUploadFile\",\r\n  props: uploadFileProps,\r\n  emits: uploadFileEmits,\r\n  setup(props, { emit }) {\r\n    const uploadContextCtx = inject(UploadContextCtxKey, null);\r\n\r\n    const value = computed({\r\n      get: () => props.modelValue as string,\r\n      set: (v: string) => emit(\"update:modelValue\", v),\r\n    });\r\n\r\n    const uploadContext = computed(\r\n      () => uploadContextCtx?.uploadContext || props.uploadContext\r\n    );\r\n\r\n    const handleUpload = async () => {\r\n      try {\r\n        \r\n        const uploadResult = await unref(uploadContext).selectFile();\r\n        \r\n        if (uploadResult.success) {\r\n          value.value = uploadResult.path || value.value;\r\n          return;\r\n        }\r\n\r\n        ElMessage.error(uploadResult.msg);\r\n      } catch (e) {\r\n        console.error(e);\r\n        ElMessage.error(\"网络异常\");\r\n      }\r\n    };\r\n\r\n    return {\r\n      handleUpload,\r\n    };\r\n  },\r\n  render() {\r\n    const { handleUpload, $slots } = this;\r\n\r\n    return (\r\n      <span class=\"mk-upload-file\" onClick={handleUpload}>\r\n        {$slots.default?.()}\r\n      </span>\r\n    );\r\n  },\r\n});\r\n\r\nexport const MKUploadFile = withInstall(_UploadFile);\r\n"],"names":["_UploadFile","defineComponent","name","props","uploadFileProps","emits","uploadFileEmits","setup","emit","uploadContextCtx","inject","UploadContextCtxKey","value","computed","get","modelValue","set","v","uploadContext","handleUpload","uploadResult","unref","selectFile","success","path","ElMessage","error","msg","e","console","render","$slots","_createVNode","default","MKUploadFile","withInstall"],"mappings":";;;;;;;;AAqBA,MAAMA,cAAcC,gCAAgB;AAAA,EAClCC,MAAM;AAAA,EACNC,OAAOC;AAAAA,EACPC,OAAOC;AAAAA,EACPC,MAAMJ,OAAO;AAAA,IAAEK;AAAAA,EAAK,GAAG;AACrB,UAAMC,mBAAmBC,OAAOC,qBAAqB,IAAI;AAEzD,UAAMC,QAAQC,SAAS;AAAA,MACrBC,KAAKA,MAAMX,MAAMY;AAAAA,MACjBC,KAAMC,OAAcT,KAAK,qBAAqBS,CAAC;AAAA,IACjD,CAAC;AAED,UAAMC,gBAAgBL,SACpB,OAAMJ,qDAAkBS,kBAAiBf,MAAMe,aACjD;AAEA,UAAMC,eAAe,YAAY;AAC/B,UAAI;AAEF,cAAMC,eAAe,MAAMC,MAAMH,aAAa,EAAEI,WAAU;AAE1D,YAAIF,aAAaG,SAAS;AACxBX,gBAAMA,QAAQQ,aAAaI,QAAQZ,MAAMA;AACzC;AAAA,QACF;AAEAa,kBAAUC,MAAMN,aAAaO,GAAG;AAAA,MACjC,SAAQC,GAAG;AACVC,gBAAQH,MAAME,CAAC;AACfH,kBAAUC,MAAM,MAAM;AAAA,MACxB;AAAA;AAGF,WAAO;AAAA,MACLP;AAAAA;EAEH;AAAA,EACDW,SAAS;;AACP,UAAM;AAAA,MAAEX;AAAAA,MAAcY;AAAAA,IAAQ,IAAG;AAEjC,WAAAC,YAAA,QAAA;AAAA,MAAA,SAAA;AAAA,MAAA,WACwCb;AAAAA,IAAY,GAAA,EAC/CY,YAAOE,YAAPF,+BAAkB,CAAA;AAAA,EAGzB;AACF,CAAC;MAEYG,eAAeC,YAAYnC,WAAW;"}
+{"version":3,"file":"upload-file.js","sources":["../../../../../src/components/basic/upload-file/upload-file.tsx"],"sourcesContent":["import { computed, defineComponent, inject, unref } from \"vue\";\r\nimport { uploadFileEmits, uploadFileProps } from \"./upload-file-options\";\r\nimport { ElMessage } from \"element-plus\";\r\nimport { UploadContextCtxKey } from \"./context\";\r\nimport { withInstall } from \"@maketribe/utils\";\r\n\r\n/**\r\n * 文件上传\r\n *\r\n * 文件上传在本后台中有两大分类\r\n * 1.直接上传文件\r\n * 2.使用素材库文件\r\n *\r\n * 文件上传的界面交互又会分为几种情况\r\n * 1.单文件上传（单文件上传，可能会根据。文件情况的不同，界面显示方式不一样）\r\n * 2.多文件上传（多文件上传基于单文件的逻辑，不过是会变成多个文件）\r\n *\r\n * 希望文件交互组件不需要用了解是直接上传文件或使用素材库。\r\n *\r\n */\r\n\r\nconst _UploadFile = defineComponent({\r\n  name: \"MKUploadFile\",\r\n  props: uploadFileProps,\r\n  emits: uploadFileEmits,\r\n  setup(props, { emit }) {\r\n    const uploadContextCtx = inject(UploadContextCtxKey, null);\r\n\r\n    const value = computed({\r\n      get: () => props.modelValue as string,\r\n      set: (v: string) => emit(\"update:modelValue\", v),\r\n    });\r\n\r\n    const uploadContext = computed(\r\n      () => uploadContextCtx?.uploadContext || props.uploadContext\r\n    );\r\n\r\n    const handleUpload = async () => {\r\n      try {\r\n\r\n        const uploadResult = await unref(uploadContext).selectFile();\r\n\r\n        if (uploadResult.success) {\r\n          value.value = uploadResult.path || value.value;\r\n          emit(\"getSelectFileName\", uploadResult.name || \"\");\r\n          return;\r\n        }\r\n\r\n        ElMessage.error(uploadResult.msg);\r\n      } catch (e) {\r\n        console.error(e);\r\n        ElMessage.error(\"网络异常\");\r\n      }\r\n    };\r\n\r\n    return {\r\n      handleUpload,\r\n    };\r\n  },\r\n  render() {\r\n    const { handleUpload, $slots } = this;\r\n\r\n    return (\r\n      <span class=\"mk-upload-file\" onClick={handleUpload}>\r\n        {$slots.default?.()}\r\n      </span>\r\n    );\r\n  },\r\n});\r\n\r\nexport const MKUploadFile = withInstall(_UploadFile);\r\n"],"names":["_UploadFile","defineComponent","name","props","uploadFileProps","emits","uploadFileEmits","setup","emit","uploadContextCtx","inject","UploadContextCtxKey","value","computed","get","modelValue","set","v","uploadContext","handleUpload","uploadResult","unref","selectFile","success","path","ElMessage","error","msg","e","console","render","$slots","_createVNode","default","MKUploadFile","withInstall"],"mappings":";;;;;;;;AAqBA,MAAMA,cAAcC,gCAAgB;AAAA,EAClCC,MAAM;AAAA,EACNC,OAAOC;AAAAA,EACPC,OAAOC;AAAAA,EACPC,MAAMJ,OAAO;AAAA,IAAEK;AAAAA,EAAK,GAAG;AACrB,UAAMC,mBAAmBC,OAAOC,qBAAqB,IAAI;AAEzD,UAAMC,QAAQC,SAAS;AAAA,MACrBC,KAAKA,MAAMX,MAAMY;AAAAA,MACjBC,KAAMC,OAAcT,KAAK,qBAAqBS,CAAC;AAAA,IACjD,CAAC;AAED,UAAMC,gBAAgBL,SACpB,OAAMJ,qDAAkBS,kBAAiBf,MAAMe,aACjD;AAEA,UAAMC,eAAe,YAAY;AAC/B,UAAI;AAEF,cAAMC,eAAe,MAAMC,MAAMH,aAAa,EAAEI,WAAU;AAE1D,YAAIF,aAAaG,SAAS;AACxBX,gBAAMA,QAAQQ,aAAaI,QAAQZ,MAAMA;AACzCJ,eAAK,qBAAqBY,aAAalB,QAAQ,EAAE;AACjD;AAAA,QACF;AAEAuB,kBAAUC,MAAMN,aAAaO,GAAG;AAAA,MACjC,SAAQC,GAAG;AACVC,gBAAQH,MAAME,CAAC;AACfH,kBAAUC,MAAM,MAAM;AAAA,MACxB;AAAA;AAGF,WAAO;AAAA,MACLP;AAAAA;EAEH;AAAA,EACDW,SAAS;;AACP,UAAM;AAAA,MAAEX;AAAAA,MAAcY;AAAAA,IAAQ,IAAG;AAEjC,WAAAC,YAAA,QAAA;AAAA,MAAA,SAAA;AAAA,MAAA,WACwCb;AAAAA,IAAY,GAAA,EAC/CY,YAAOE,YAAPF,+BAAkB,CAAA;AAAA,EAGzB;AACF,CAAC;MAEYG,eAAeC,YAAYnC,WAAW;"}

package/dist/esm/components/basic/visual-page-editor/components/BlockRender.js

@@ -0,0 +1,32 @@
+import { defineComponent, h } from "vue";
+import { useRenderComponent } from "../core/index.js";
+const BlockRender = defineComponent({
+  name: "BlockRender",
+  emits: ["click"],
+  props: {
+    node: { type: Object },
+    parent: { type: Object },
+    index: { type: Number },
+    active: { type: Boolean }
+  },
+  setup: (props, { emit }) => {
+    const { RenderComponents } = useRenderComponent();
+    return () => {
+      const content = props.node;
+      const renderComponent = RenderComponents.find((item) => item.name == content.componentInfo);
+      return h("div", { class: "mk-visual-page-editor__stage_block" }, [
+        h(renderComponent == null ? void 0 : renderComponent.component, content.componentProps),
+        h("div", {
+          class: { "mk-visual-page-editor__stage_block_mask": true, active: props.active },
+          onClick: (ev) => {
+            emit("click", { node: content, options: renderComponent, index: props.index, parent: props.parent, event: ev });
+          }
+        })
+      ]);
+    };
+  }
+});
+export {
+  BlockRender as default
+};
+//# sourceMappingURL=BlockRender.js.map

package/dist/esm/components/basic/visual-page-editor/components/BlockRender.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockRender.js","sources":["../../../../../../src/components/basic/visual-page-editor/components/BlockRender.ts"],"sourcesContent":["import { defineComponent,defineProps,defineEmits,computed,ref,onMounted,watch,h } from \"vue\"\r\nimport { ContentBlockType } from \"../core/ContentConfig\"\r\nimport { useRenderComponent } from \"../core\"\r\n\r\nexport default defineComponent({\r\n  name:\"BlockRender\",\r\n  emits:[\"click\"],\r\n  props:{\r\n    node:{type:Object},\r\n    parent:{type:Object},\r\n    index:{type:Number},\r\n    active:{type:Boolean}\r\n  },\r\n  setup:(props,{ emit })=>{\r\n\r\n    const { RenderComponents } = useRenderComponent();\r\n\r\n    return ()=>{\r\n\r\n      const content = props.node as ContentBlockType;\r\n      const renderComponent = RenderComponents.find(item=>item.name == content.componentInfo);\r\n\r\n      return h(\"div\",{class:\"mk-visual-page-editor__stage_block\"},[\r\n        h(renderComponent?.component as any,content.componentProps),\r\n        h(\"div\",{ \r\n          class:{\"mk-visual-page-editor__stage_block_mask\":true,active:props.active},\r\n          onClick:ev=>{\r\n            emit(\"click\",{ node:content,options:renderComponent,index:props.index,parent:props.parent,event:ev })\r\n          }\r\n        })\r\n      ])\r\n    }\r\n  }\r\n});\r\n"],"names":[],"mappings":";;AAIA,MAAA,cAAe,gBAAgB;AAAA,EAC7B,MAAK;AAAA,EACL,OAAM,CAAC,OAAO;AAAA,EACd,OAAM;AAAA,IACJ,MAAK,EAAC,MAAK,OAAM;AAAA,IACjB,QAAO,EAAC,MAAK,OAAM;AAAA,IACnB,OAAM,EAAC,MAAK,OAAM;AAAA,IAClB,QAAO,EAAC,MAAK,QAAO;AAAA,EACtB;AAAA,EACA,OAAM,CAAC,OAAM,EAAE,WAAS;AAEhB,UAAA,EAAE,qBAAqB;AAE7B,WAAO,MAAI;AAET,YAAM,UAAU,MAAM;AACtB,YAAM,kBAAkB,iBAAiB,KAAK,UAAM,KAAK,QAAQ,QAAQ,aAAa;AAEtF,aAAO,EAAE,OAAM,EAAC,OAAM,wCAAsC;AAAA,QAC1D,EAAE,mDAAiB,WAAiB,QAAQ,cAAc;AAAA,QAC1D,EAAE,OAAM;AAAA,UACN,OAAM,EAAC,2CAA0C,MAAK,QAAO,MAAM,OAAM;AAAA,UACzE,SAAQ,CAAI,OAAA;AACV,iBAAK,SAAQ,EAAE,MAAK,SAAQ,SAAQ,iBAAgB,OAAM,MAAM,OAAM,QAAO,MAAM,QAAO,OAAM,IAAI;AAAA,UACtG;AAAA,QAAA,CACD;AAAA,MAAA,CACF;AAAA,IAAA;AAAA,EAEL;AACF,CAAC;"}

package/dist/esm/components/basic/visual-page-editor/content-editable.vue.js

@@ -0,0 +1,197 @@
+import { defineComponent, ref, reactive, onMounted, onBeforeUnmount, resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeStyle, unref, Fragment, renderList, createBlock, createVNode, withCtx, createTextVNode, withModifiers, createCommentVNode } from "vue";
+import { usePageEditor } from "./core/index.js";
+import BlockRender from "./components/BlockRender.js";
+import { ShowComponentSelectPanel, ShowEditPanel } from "./utils/Dialog.js";
+const _hoisted_1 = { class: "mk-visual-page-editor__stage_editable_addblock" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "content-editable",
+  setup(__props) {
+    const { PageEditor, ViewDevice } = usePageEditor();
+    const editableRef = ref(null);
+    const selectIndex = ref(null);
+    const clickHandle = (data) => {
+      data.event.stopPropagation();
+      updateToolsPos();
+      selectIndex.value = data.index;
+    };
+    const clickStageHandle = () => {
+      selectIndex.value = null;
+    };
+    const toolsPos = reactive({ top: "0px" });
+    const updateToolsPos = () => {
+      if (editableRef.value != null) {
+        toolsPos.top = Math.max(editableRef.value.parentElement.scrollTop + editableRef.value.parentElement.offsetHeight / 2 - 100, 5) + "px";
+      }
+    };
+    const addHandle = async (pos, index) => {
+      await ShowComponentSelectPanel();
+    };
+    const editHandle = async (index) => {
+      const item = PageEditor.get(index);
+      await ShowEditPanel(item, {});
+    };
+    onMounted(() => {
+      var _a;
+      (_a = editableRef.value) == null ? void 0 : _a.parentElement.addEventListener("scroll", updateToolsPos, false);
+      onBeforeUnmount(() => {
+        var _a2;
+        (_a2 = editableRef.value) == null ? void 0 : _a2.parentElement.removeEventListener("scroll", updateToolsPos);
+      });
+      PageEditor.setContent({
+        version: "1.0.0",
+        contents: [
+          { componentInfo: "vp-image", componentProps: { src: "https://vgcnminisite.oss-cn-shanghai.aliyuncs.com/uploads/2024/07/03/ffd6b7c7f24f42dab3ae1220e18c3723.jpg", id: 1 } },
+          { componentInfo: "vp-image", componentProps: { src: "https://vgcnminisite.oss-cn-shanghai.aliyuncs.com/uploads/2024/07/03/b9e0baefbd784d70a83e04bea7cd6113.jpg", id: 2 } }
+        ]
+      });
+    });
+    return (_ctx, _cache) => {
+      const _component_MKSvgIcon = resolveComponent("MKSvgIcon");
+      const _component_el_button = resolveComponent("el-button");
+      const _component_el_button_group = resolveComponent("el-button-group");
+      return openBlock(), createElementBlock("div", {
+        class: "mk-visual-page-editor__stage_body",
+        onClick: clickStageHandle
+      }, [
+        createElementVNode("div", {
+          class: "mk-visual-page-editor__stage_editable",
+          style: normalizeStyle({ width: unref(ViewDevice) == "pc" ? "900px" : "640px" }),
+          ref_key: "editableRef",
+          ref: editableRef
+        }, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(PageEditor).getContent().contents, (item, index) => {
+            return openBlock(), createBlock(unref(BlockRender), {
+              key: index,
+              index,
+              node: item,
+              active: selectIndex.value == index,
+              onClick: clickHandle
+            }, null, 8, ["index", "node", "active"]);
+          }), 128)),
+          createElementVNode("div", _hoisted_1, [
+            createVNode(_component_el_button, {
+              text: "",
+              type: "primary",
+              size: "large",
+              onClick: _cache[0] || (_cache[0] = ($event) => addHandle())
+            }, {
+              default: withCtx(() => [
+                createVNode(_component_MKSvgIcon, {
+                  iconClass: "Plus",
+                  style: { "margin-right": "10px" }
+                }),
+                createTextVNode(" 添加 ")
+              ]),
+              _: 1
+            })
+          ]),
+          selectIndex.value != null ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: "mk-visual-page-editor-inline-toolbar",
+            onClick: _cache[7] || (_cache[7] = withModifiers(() => {
+            }, ["stop"])),
+            style: normalizeStyle(toolsPos)
+          }, [
+            createVNode(_component_el_button_group, null, {
+              default: withCtx(() => [
+                selectIndex.value > 0 ? (openBlock(), createBlock(_component_el_button, {
+                  key: 0,
+                  text: "",
+                  onClick: _cache[1] || (_cache[1] = ($event) => {
+                    unref(PageEditor).exchange(selectIndex.value, selectIndex.value - 1);
+                    selectIndex.value--;
+                  })
+                }, {
+                  default: withCtx(() => [
+                    createVNode(_component_MKSvgIcon, {
+                      iconClass: "CaretTop",
+                      style: { "margin-right": "10px" }
+                    }),
+                    createTextVNode(" 上移 ")
+                  ]),
+                  _: 1
+                })) : createCommentVNode("", true),
+                selectIndex.value < unref(PageEditor).size() - 1 ? (openBlock(), createBlock(_component_el_button, {
+                  key: 1,
+                  text: "",
+                  onClick: _cache[2] || (_cache[2] = ($event) => {
+                    unref(PageEditor).exchange(selectIndex.value, selectIndex.value + 1);
+                    selectIndex.value++;
+                  })
+                }, {
+                  default: withCtx(() => [
+                    createVNode(_component_MKSvgIcon, {
+                      iconClass: "CaretBottom",
+                      style: { "margin-right": "10px" }
+                    }),
+                    createTextVNode(" 下移 ")
+                  ]),
+                  _: 1
+                })) : createCommentVNode("", true),
+                createVNode(_component_el_button, {
+                  text: "",
+                  onClick: _cache[3] || (_cache[3] = ($event) => addHandle(selectIndex.value, selectIndex.value - 1))
+                }, {
+                  default: withCtx(() => [
+                    createVNode(_component_MKSvgIcon, {
+                      iconClass: "Fold",
+                      style: { "margin-right": "10px" }
+                    }),
+                    createTextVNode(" 插入 ")
+                  ]),
+                  _: 1
+                }),
+                createVNode(_component_el_button, {
+                  text: "",
+                  onClick: _cache[4] || (_cache[4] = ($event) => addHandle(selectIndex.value, selectIndex.value + 1))
+                }, {
+                  default: withCtx(() => [
+                    createVNode(_component_MKSvgIcon, {
+                      iconClass: "Plus",
+                      style: { "margin-right": "10px" }
+                    }),
+                    createTextVNode(" 添加 ")
+                  ]),
+                  _: 1
+                }),
+                createVNode(_component_el_button, { text: "" }, {
+                  default: withCtx(() => [
+                    createVNode(_component_MKSvgIcon, {
+                      iconClass: "Edit",
+                      onClick: _cache[5] || (_cache[5] = ($event) => editHandle(selectIndex.value)),
+                      style: { "margin-right": "10px" }
+                    }),
+                    createTextVNode(" 编辑 ")
+                  ]),
+                  _: 1
+                }),
+                createVNode(_component_el_button, {
+                  text: "",
+                  type: "danger",
+                  onClick: _cache[6] || (_cache[6] = ($event) => {
+                    unref(PageEditor).remove(selectIndex.value);
+                    selectIndex.value = null;
+                  })
+                }, {
+                  default: withCtx(() => [
+                    createVNode(_component_MKSvgIcon, {
+                      iconClass: "Delete",
+                      style: { "margin-right": "10px" }
+                    }),
+                    createTextVNode(" 删除 ")
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            })
+          ], 4)) : createCommentVNode("", true)
+        ], 4)
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=content-editable.vue.js.map

package/dist/esm/components/basic/visual-page-editor/content-editable.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"content-editable.vue.js","sources":["../../../../../src/components/basic/visual-page-editor/content-editable.vue"],"sourcesContent":["<template>\r\n  <div class=\"mk-visual-page-editor__stage_body\" @click=\"clickStageHandle\">\r\n    <div class=\"mk-visual-page-editor__stage_editable\" :style=\"{width:(ViewDevice=='pc'?'900px':'640px')}\" ref=\"editableRef\">\r\n      <BlockRender v-for=\"(item,index) in PageEditor.getContent().contents\" :key=\"index\" :index=\"index\" :node=\"item\" :active=\"selectIndex==index\" @click=\"clickHandle\"></BlockRender>\r\n      <div  class=\"mk-visual-page-editor__stage_editable_addblock\">\r\n        <el-button text type=\"primary\" size=\"large\" @click=\"addHandle()\">\r\n          <MKSvgIcon iconClass=\"Plus\" style=\"margin-right:10px\" /> \r\n          添加\r\n        </el-button>\r\n      </div>\r\n      <div class=\"mk-visual-page-editor-inline-toolbar\" @click..stop :style=\"toolsPos\"  v-if=\"selectIndex!=null\">\r\n        <el-button-group>\r\n          <el-button text v-if=\"selectIndex > 0\" @click=\"PageEditor.exchange(selectIndex,selectIndex-1);selectIndex--\" >\r\n            <MKSvgIcon iconClass=\"CaretTop\"  style=\"margin-right:10px\"/> \r\n            上移\r\n          </el-button>\r\n          <el-button text @click=\"PageEditor.exchange(selectIndex,selectIndex+1);selectIndex++\" v-if=\"selectIndex < PageEditor.size() - 1\">\r\n            <MKSvgIcon iconClass=\"CaretBottom\"  style=\"margin-right:10px\"/> \r\n            下移\r\n          </el-button>\r\n          <el-button text @click=\"addHandle(selectIndex,selectIndex-1)\">\r\n            <MKSvgIcon iconClass=\"Fold\"  style=\"margin-right:10px\" /> \r\n            插入\r\n          </el-button>\r\n          <el-button text @click=\"addHandle(selectIndex,selectIndex+1)\">\r\n            <MKSvgIcon iconClass=\"Plus\"  style=\"margin-right:10px\"/> \r\n            添加\r\n          </el-button>\r\n          <el-button text>\r\n            <MKSvgIcon iconClass=\"Edit\" @click=\"editHandle(selectIndex)\" style=\"margin-right:10px\"/> \r\n            编辑\r\n          </el-button>\r\n          <el-button text type=\"danger\" @click=\"PageEditor.remove(selectIndex);selectIndex=null\">\r\n            <MKSvgIcon iconClass=\"Delete\"  style=\"margin-right:10px\"/> \r\n            删除\r\n          </el-button>\r\n        </el-button-group>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { nextTick,defineProps,defineEmits,computed,ref,onMounted,onBeforeUnmount,reactive,watch } from \"vue\"\r\nimport { usePageEditor,useRenderComponent } from \"./core\"\r\nimport BlockRender from \"./components/BlockRender\"\r\nimport { RenderComponentType } from \"./core/RenderComponent\"\r\nimport { ShowEditPanel,ShowComponentSelectPanel } from \"./utils/Dialog\"\r\n\r\nconst { PageEditor,ViewDevice } = usePageEditor();\r\nconst editableRef = ref<HTMLDivElement|null>(null);\r\nconst selectIndex = ref(null);\r\n\r\n// 点击块\r\nconst clickHandle = (data:any)=>{\r\n  data.event.stopPropagation();\r\n  updateToolsPos();\r\n  selectIndex.value = data.index;\r\n}\r\nconst clickStageHandle = ()=>{\r\n  selectIndex.value = null;\r\n}\r\n// 工具条位置\r\nconst toolsPos = reactive({ top:\"0px\" });\r\n// 更新工具条位置\r\nconst updateToolsPos = ()=>{\r\n  if(editableRef.value != null){\r\n    toolsPos.top = Math.max(editableRef.value.parentElement!.scrollTop + editableRef.value.parentElement!.offsetHeight / 2 - 100,5) + \"px\"\r\n  }\r\n}\r\n\r\n// 编辑\r\nconst addHandle =  async (pos?:any,index?:any) => {\r\n  const result = await ShowComponentSelectPanel();\r\n}\r\n\r\n// 编辑\r\nconst editHandle =  async (index:any) => {\r\n\r\n  const item = PageEditor.get(index)\r\n  \r\n  const result = await ShowEditPanel(item as any,{});\r\n}\r\n\r\nonMounted(()=>{\r\n  editableRef.value?.parentElement!.addEventListener(\"scroll\",updateToolsPos,false);\r\n  onBeforeUnmount(()=>{\r\n    editableRef.value?.parentElement!.removeEventListener(\"scroll\",updateToolsPos);\r\n  });\r\n\r\n  PageEditor.setContent({\r\n    version:\"1.0.0\",\r\n    contents:[\r\n      {componentInfo:\"vp-image\",componentProps:{src:\"https://vgcnminisite.oss-cn-shanghai.aliyuncs.com/uploads/2024/07/03/ffd6b7c7f24f42dab3ae1220e18c3723.jpg\",id:1}},\r\n      {componentInfo:\"vp-image\",componentProps:{src:\"https://vgcnminisite.oss-cn-shanghai.aliyuncs.com/uploads/2024/07/03/b9e0baefbd784d70a83e04bea7cd6113.jpg\",id:2}}\r\n    ]\r\n  })\r\n\r\n});\r\n</script>\r\n"],"names":["_a"],"mappings":";;;;;;;;AAiDA,UAAM,EAAE,YAAW,WAAW,IAAI,cAAc;AAC1C,UAAA,cAAc,IAAyB,IAAI;AAC3C,UAAA,cAAc,IAAI,IAAI;AAGtB,UAAA,cAAc,CAAC,SAAW;AAC9B,WAAK,MAAM;AACI;AACf,kBAAY,QAAQ,KAAK;AAAA,IAAA;AAE3B,UAAM,mBAAmB,MAAI;AAC3B,kBAAY,QAAQ;AAAA,IAAA;AAGtB,UAAM,WAAW,SAAS,EAAE,KAAI,MAAO,CAAA;AAEvC,UAAM,iBAAiB,MAAI;AACtB,UAAA,YAAY,SAAS,MAAK;AAC3B,iBAAS,MAAM,KAAK,IAAI,YAAY,MAAM,cAAe,YAAY,YAAY,MAAM,cAAe,eAAe,IAAI,KAAI,CAAC,IAAI;AAAA,MACpI;AAAA,IAAA;AAII,UAAA,YAAa,OAAO,KAAS,UAAe;AACjC,YAAM,yBAAyB;AAAA,IAAA;AAI1C,UAAA,aAAc,OAAO,UAAc;AAEjC,YAAA,OAAO,WAAW,IAAI,KAAK;AAElB,YAAM,cAAc,MAAY,EAAE;AAAA,IAAA;AAGnD,cAAU,MAAI;;AACZ,wBAAY,UAAZ,mBAAmB,cAAe,iBAAiB,UAAS,gBAAe;AAC3E,sBAAgB,MAAI;;AAClB,SAAAA,MAAA,YAAY,UAAZ,gBAAAA,IAAmB,cAAe,oBAAoB,UAAS;AAAA,MAAc,CAC9E;AAED,iBAAW,WAAW;AAAA,QACpB,SAAQ;AAAA,QACR,UAAS;AAAA,UACP,EAAC,eAAc,YAAW,gBAAe,EAAC,KAAI,6GAA4G,IAAG,IAAE;AAAA,UAC/J,EAAC,eAAc,YAAW,gBAAe,EAAC,KAAI,6GAA4G,IAAG,IAAE;AAAA,QACjK;AAAA,MAAA,CACD;AAAA,IAAA,CAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/components/basic/visual-page-editor/content-editable.vue2.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./content-editable.vue.js";
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=content-editable.vue2.js.map

package/dist/esm/components/basic/visual-page-editor/content-editable.vue2.js.map

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

package/dist/esm/components/basic/visual-page-editor/core/VisvalPageEditor.js

@@ -0,0 +1,64 @@
+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 { shallowReactive } from "vue";
+class VisualPageEditor {
+  constructor() {
+    __publicField(this, "_version");
+    __publicField(this, "_content");
+    this._version = "1.0.0";
+    this._content = null;
+  }
+  /**
+   * 内容大小
+   * @returns 
+   */
+  size() {
+    var _a;
+    return (_a = this._content) == null ? void 0 : _a.contents.length;
+  }
+  /**
+   * 删除
+   * @param index 
+   */
+  remove(index) {
+    var _a;
+    (_a = this._content) == null ? void 0 : _a.contents.splice(index, 1);
+  }
+  /**
+   * 交换
+   * @param index 
+   * @param exchangeIndex 
+   */
+  exchange(index, exchangeIndex) {
+    var _a, _b;
+    const item = (_a = this._content) == null ? void 0 : _a.contents.splice(index, 1);
+    (_b = this._content) == null ? void 0 : _b.contents.splice(exchangeIndex, 0, item[0]);
+  }
+  /**
+   * 设置内容
+   * @param content 
+   */
+  setContent(content) {
+    this._content = shallowReactive(content);
+  }
+  /**
+   * 获取内容
+   * @returns 
+   */
+  get(index) {
+    var _a;
+    return (_a = this._content) == null ? void 0 : _a.contents[index];
+  }
+  /**
+   * 获取内容
+   * @returns 
+   */
+  getContent() {
+    return this._content || { version: this._version, contents: [] };
+  }
+}
+export {
+  VisualPageEditor as default
+};
+//# sourceMappingURL=VisvalPageEditor.js.map

package/dist/esm/components/basic/visual-page-editor/core/VisvalPageEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VisvalPageEditor.js","sources":["../../../../../../src/components/basic/visual-page-editor/core/VisvalPageEditor.ts"],"sourcesContent":["import { type ContentConfigType,type ContentBlockType } from \"./ContentConfig\"\r\n\r\nimport { shallowReactive } from \"vue\"\r\n\r\n\r\n/**\r\n * 页面编辑器\r\n */\r\nexport default class VisualPageEditor{\r\n\r\n  _version:string\r\n  _content:ContentConfigType|null\r\n\r\n  constructor(){\r\n    this._version = \"1.0.0\"\r\n    this._content = null;\r\n  }\r\n\r\n  /**\r\n   * 内容大小\r\n   * @returns \r\n   */\r\n  size(){\r\n    return this._content?.contents.length as number;\r\n  }\r\n\r\n  /**\r\n   * 删除\r\n   * @param index \r\n   */\r\n  remove(index:number){\r\n    this._content?.contents.splice(index,1)\r\n  }\r\n\r\n  /**\r\n   * 交换\r\n   * @param index \r\n   * @param exchangeIndex \r\n   */\r\n  exchange(index:number,exchangeIndex:number){\r\n    const item = this._content?.contents.splice(index,1)\r\n    this._content?.contents.splice(exchangeIndex,0,item![0])\r\n  }\r\n\r\n  /**\r\n   * 设置内容\r\n   * @param content \r\n   */\r\n  setContent(content:ContentConfigType){\r\n    this._content = shallowReactive(content);\r\n  }\r\n\r\n  /**\r\n   * 获取内容\r\n   * @returns \r\n   */\r\n  get(index:any):ContentBlockType {\r\n    return this._content?.contents[index] as ContentBlockType;\r\n  }\r\n\r\n  /**\r\n   * 获取内容\r\n   * @returns \r\n   */\r\n  getContent():ContentConfigType {\r\n    return this._content || {version:this._version ,contents:[]}\r\n  }\r\n\r\n}\r\n"],"names":[],"mappings":";;;;AAQA,MAAqB,iBAAgB;AAAA,EAKnC,cAAa;AAHb;AACA;AAGE,SAAK,WAAW;AAChB,SAAK,WAAW;AAAA,EAClB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,OAAM;;AACG,YAAA,UAAK,aAAL,mBAAe,SAAS;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,OAAO,OAAa;;AAClB,eAAK,aAAL,mBAAe,SAAS,OAAO,OAAM;AAAA,EACvC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,SAAS,OAAa,eAAqB;;AACzC,UAAM,QAAO,UAAK,aAAL,mBAAe,SAAS,OAAO,OAAM;AAClD,eAAK,aAAL,mBAAe,SAAS,OAAO,eAAc,GAAE,KAAM,CAAC;AAAA,EACxD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,WAAW,SAA0B;AAC9B,SAAA,WAAW,gBAAgB,OAAO;AAAA,EACzC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,IAAI,OAA4B;;AACvB,YAAA,UAAK,aAAL,mBAAe,SAAS;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,aAA+B;AACtB,WAAA,KAAK,YAAY,EAAC,SAAQ,KAAK,UAAU,UAAS,CAAA;EAC3D;AAEF;"}

package/dist/esm/components/basic/visual-page-editor/core/index.js

@@ -0,0 +1,22 @@
+import { shallowReactive, ref } from "vue";
+import VisualPageEditor from "./VisvalPageEditor.js";
+const RenderComponents = shallowReactive([]);
+const PageEditor = shallowReactive(new VisualPageEditor());
+const ViewDevice = ref("pc");
+const RegisterRenderComponent = (options) => {
+  RenderComponents.push(options);
+};
+const useRenderComponent = () => {
+  return {
+    RenderComponents,
+    RegisterRenderComponent
+  };
+};
+const usePageEditor = () => {
+  return { PageEditor, ViewDevice };
+};
+export {
+  usePageEditor,
+  useRenderComponent
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/components/basic/visual-page-editor/core/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../src/components/basic/visual-page-editor/core/index.ts"],"sourcesContent":["\r\nimport { shallowReactive,ref } from \"vue\"\r\n\r\nimport { RenderComponentType } from \"./RenderComponent\"\r\n\r\nimport VisualPageEditor from \"./VisvalPageEditor\"\r\n\r\n\r\nconst RenderComponents = shallowReactive<RenderComponentType[]>([]);\r\n\r\n// 页面编辑器\r\nconst PageEditor = shallowReactive<VisualPageEditor>(new VisualPageEditor())\r\n// pc | mobile\r\nconst ViewDevice = ref('pc')\r\n/**\r\n * 注册渲染组件\r\n * @param options \r\n */\r\nconst RegisterRenderComponent = (options:RenderComponentType)=>{\r\n  RenderComponents.push(options);\r\n}\r\n\r\n/**\r\n * \r\n * @returns \r\n */\r\nexport const useRenderComponent = ()=>{\r\n\r\n  return {\r\n    RenderComponents,\r\n    RegisterRenderComponent\r\n  }\r\n}\r\n\r\n\r\n/**\r\n * \r\n * @returns \r\n */\r\nexport const usePageEditor = ()=>{\r\n  return { PageEditor, ViewDevice }\r\n}\r\n\r\n"],"names":[],"mappings":";;AAQA,MAAM,mBAAmB,gBAAuC,CAAA,CAAE;AAGlE,MAAM,aAAa,gBAAkC,IAAI,iBAAA,CAAkB;AAE3E,MAAM,aAAa,IAAI,IAAI;AAK3B,MAAM,0BAA0B,CAAC,YAA8B;AAC7D,mBAAiB,KAAK,OAAO;AAC/B;AAMO,MAAM,qBAAqB,MAAI;AAE7B,SAAA;AAAA,IACL;AAAA,IACA;AAAA,EAAA;AAEJ;AAOO,MAAM,gBAAgB,MAAI;AACxB,SAAA,EAAE,YAAY;AACvB;"}

package/dist/esm/components/basic/visual-page-editor/editor.vue.js

@@ -0,0 +1,62 @@
+import { defineComponent, onMounted, resolveComponent, openBlock, createElementBlock, renderSlot, createVNode, createElementVNode, withCtx, createTextVNode } from "vue";
+import _sfc_main$1 from "./toolbar.vue.js";
+import _sfc_main$2 from "./content-editable.vue.js";
+import { usePageEditor } from "./core/index.js";
+const _hoisted_1 = { class: "mk-visual-page-editor" };
+const _hoisted_2 = { class: "mk-visual-page-editor__stage" };
+const _hoisted_3 = { class: "mk-visual-page-editor__stage_right" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "editor",
+  props: { device: { type: String, default: "mobile" } },
+  setup(__props) {
+    const { ViewDevice } = usePageEditor();
+    const props = __props;
+    onMounted(() => {
+      ViewDevice.value = props.device;
+    });
+    return (_ctx, _cache) => {
+      const _component_el_collapse_item = resolveComponent("el-collapse-item");
+      const _component_el_collapse = resolveComponent("el-collapse");
+      const _component_el_card = resolveComponent("el-card");
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        renderSlot(_ctx.$slots, "toolbar", {}, () => [
+          createVNode(_sfc_main$1)
+        ]),
+        createElementVNode("div", _hoisted_2, [
+          createVNode(_sfc_main$2),
+          createElementVNode("div", _hoisted_3, [
+            createVNode(_component_el_card, null, {
+              header: withCtx(() => [
+                createTextVNode(" 页面设置 ")
+              ]),
+              default: withCtx(() => [
+                createVNode(_component_el_collapse, null, {
+                  default: withCtx(() => [
+                    createVNode(_component_el_collapse_item, {
+                      title: "基础组件",
+                      name: "base"
+                    }),
+                    createVNode(_component_el_collapse_item, {
+                      title: "业务组件",
+                      name: "business"
+                    }),
+                    createVNode(_component_el_collapse_item, {
+                      title: "自定义组件",
+                      name: "custom"
+                    })
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            })
+          ])
+        ])
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=editor.vue.js.map

package/dist/esm/components/basic/visual-page-editor/editor.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor.vue.js","sources":["../../../../../src/components/basic/visual-page-editor/editor.vue"],"sourcesContent":["<template>\r\n     <div class=\"mk-visual-page-editor\">\r\n      <slot name=\"toolbar\">\r\n        <Toolbar />\r\n      </slot>\r\n      <div class=\"mk-visual-page-editor__stage\"> \r\n        <ContentEditable></ContentEditable> \r\n        <div class=\"mk-visual-page-editor__stage_right\">\r\n          <el-card>\r\n              <template #header>\r\n                页面设置\r\n              </template>\r\n              <el-collapse>\r\n                  <el-collapse-item title=\"基础组件\" name=\"base\">\r\n                    \r\n                  </el-collapse-item>\r\n                  <el-collapse-item title=\"业务组件\" name=\"business\">\r\n                   \r\n                  </el-collapse-item>\r\n                  <el-collapse-item title=\"自定义组件\" name=\"custom\">\r\n                    \r\n                  </el-collapse-item>\r\n                </el-collapse>\r\n            </el-card>\r\n        </div>\r\n      </div>\r\n    </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { defineOptions,defineProps,defineEmits,computed,ref,onMounted,watch } from \"vue\"\r\nimport Toolbar from \"./toolbar.vue\"\r\nimport ContentEditable from \"./content-editable.vue\";\r\nimport { usePageEditor } from \"./core\"\r\nconst { ViewDevice } = usePageEditor();\r\n\r\n\r\nconst props = defineProps({ device:{type:String,default:\"mobile\"} })\r\n\r\n\r\nonMounted(()=>{\r\n\r\n  ViewDevice.value = props.device;\r\n\r\n});\r\n</script>\r\n"],"names":[],"mappings":";;;;;;;;;;;AAkCM,UAAA,EAAE,eAAe;AAGvB,UAAM,QAAQ;AAGd,cAAU,MAAI;AAEZ,iBAAW,QAAQ,MAAM;AAAA,IAAA,CAE1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/components/basic/visual-page-editor/editor.vue2.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./editor.vue.js";
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=editor.vue2.js.map

package/dist/esm/components/basic/visual-page-editor/editor.vue2.js.map

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

package/dist/esm/components/basic/visual-page-editor/index.js

@@ -0,0 +1,9 @@
+import { withInstall } from "@maketribe/utils";
+import _sfc_main from "./editor.vue.js";
+import "./visual-components/ImageRenderComponent.js";
+const MKVisualPageEditor = withInstall(_sfc_main);
+export {
+  MKVisualPageEditor,
+  MKVisualPageEditor as default
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/components/basic/visual-page-editor/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../src/components/basic/visual-page-editor/index.ts"],"sourcesContent":["import { withInstall } from \"@maketribe/utils\";\r\nimport VisualPageEditor from \"./editor.vue\";\r\nimport \"./visual-components\"\r\n\r\nexport const MKVisualPageEditor = withInstall(VisualPageEditor);\r\n\r\nexport default MKVisualPageEditor;\r\n\r\n"],"names":["VisualPageEditor"],"mappings":";;;AAIa,MAAA,qBAAqB,YAAYA,SAAgB;"}

package/dist/esm/components/basic/visual-page-editor/toolbar.vue.js

@@ -0,0 +1,51 @@
+import { defineComponent, ref, onMounted, resolveComponent, openBlock, createElementBlock, createVNode, withCtx, normalizeClass, unref } from "vue";
+import { usePageEditor } from "./core/index.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "toolbar",
+  setup(__props) {
+    const { ViewDevice } = usePageEditor();
+    const toolbarRef = ref(null);
+    onMounted(() => {
+    });
+    return (_ctx, _cache) => {
+      const _component_MKSvgIcon = resolveComponent("MKSvgIcon");
+      const _component_el_button = resolveComponent("el-button");
+      const _component_el_button_group = resolveComponent("el-button-group");
+      return openBlock(), createElementBlock("div", {
+        ref_key: "toolbarRef",
+        ref: toolbarRef,
+        class: "mk-visual-page-editor-toolbar"
+      }, [
+        createVNode(_component_el_button_group, null, {
+          default: withCtx(() => [
+            createVNode(_component_el_button, {
+              text: "",
+              class: normalizeClass(`${unref(ViewDevice) == "pc" ? "active" : ""}`),
+              onClick: _cache[0] || (_cache[0] = ($event) => ViewDevice.value = "pc")
+            }, {
+              default: withCtx(() => [
+                createVNode(_component_MKSvgIcon, { iconClass: "Platform" })
+              ]),
+              _: 1
+            }, 8, ["class"]),
+            createVNode(_component_el_button, {
+              text: "",
+              class: normalizeClass(`${unref(ViewDevice) == "mobile" ? "active" : ""}`),
+              onClick: _cache[1] || (_cache[1] = ($event) => ViewDevice.value = "mobile")
+            }, {
+              default: withCtx(() => [
+                createVNode(_component_MKSvgIcon, { iconClass: "Iphone" })
+              ]),
+              _: 1
+            }, 8, ["class"])
+          ]),
+          _: 1
+        })
+      ], 512);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=toolbar.vue.js.map

package/dist/esm/components/basic/visual-page-editor/toolbar.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolbar.vue.js","sources":["../../../../../src/components/basic/visual-page-editor/toolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { onMounted, onUnmounted, ref,defineProps } from 'vue'\r\nimport { usePageEditor } from \"./core\"\r\nconst { ViewDevice } = usePageEditor();\r\nconst toolbarRef = ref<HTMLDivElement | null>(null)\r\n\r\nonMounted(() => {\r\n \r\n})\r\n\r\n\r\n</script>\r\n\r\n<template>\r\n  <div ref=\"toolbarRef\" class=\"mk-visual-page-editor-toolbar\">\r\n    <el-button-group>\r\n      <el-button text :class=\"`${ViewDevice=='pc' ? 'active' : ''}`\" @click=\"ViewDevice='pc'\">\r\n        <MKSvgIcon iconClass=\"Platform\" /> \r\n      </el-button>\r\n      <el-button text :class=\"`${ViewDevice=='mobile' ? 'active' : ''}`\" @click=\"ViewDevice='mobile'\">\r\n        <MKSvgIcon iconClass=\"Iphone\" /> \r\n      </el-button>\r\n    </el-button-group>\r\n  </div>\r\n</template>\r\n"],"names":[],"mappings":";;;;;AAGM,UAAA,EAAE,eAAe;AACjB,UAAA,aAAa,IAA2B,IAAI;AAElD,cAAU,MAAM;AAAA,IAAA,CAEf;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/components/basic/visual-page-editor/toolbar.vue2.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./toolbar.vue.js";
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=toolbar.vue2.js.map

package/dist/esm/components/basic/visual-page-editor/toolbar.vue2.js.map

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