@maketribe/ms-app 3.2.9 → 3.2.11

package/dist/cjs/components/basic/image-cropper/image-cropper-api.js

@@ -41,7 +41,9 @@ async function ImageCropper(options) {
           "ref": (el) => imageCropperContentEl.value = el,
           "src": options.src,
           "fixedBox": fixedBox,
-          "ratioOptions": ratioOptions
+          "ratioOptions": ratioOptions,
+          "maxHeight": options.maxHeight,
+          "maxWidth": options.maxWidth
         }, null);
       },
       footer: () => {

package/dist/cjs/components/basic/image-cropper/image-cropper-api.js.map

@@ -1 +1 @@
-{"version":3,"file":"image-cropper-api.js","sources":["../../../../../src/components/basic/image-cropper/image-cropper-api.tsx"],"sourcesContent":["import { Dialoger } from \"@maketribe/dm\";\r\nimport ImageCropperContent, {\r\n  ImageCropperRatioOption,\r\n} from \"./image-cropper-content\";\r\nimport { Fragment } from \"vue/jsx-runtime\";\r\nimport { ElButton } from \"element-plus\";\r\nimport { ref, Ref, unref } from \"vue\";\r\n\r\nexport type MKImageCropperOptions = {\r\n  src: string;\r\n  ratioOptions?: Array<ImageCropperRatioOption>;\r\n  fixedBox?: boolean;\r\n};\r\nexport type MKImageCropperResult = {\r\n  isConfirm: boolean;\r\n  data: string;\r\n  size: { width: number; height: number };\r\n};\r\n\r\nexport async function ImageCropper(\r\n  options: MKImageCropperOptions\r\n): Promise<MKImageCropperResult> {\r\n  const ratioOptions = options.ratioOptions ?? [];\r\n  const fixedBox = options.fixedBox ?? false;\r\n\r\n  return new Promise((resolve) => {\r\n    const imageCropperContentEl: Ref<typeof ImageCropperContent | null> =\r\n      ref(null);\r\n\r\n    const handleCancelClick = () => {\r\n      dialogInstance.destroy();\r\n\r\n      resolve({\r\n        isConfirm: false,\r\n        data: \"\",\r\n        size: { width: 0, height: 0 },\r\n      });\r\n    };\r\n\r\n    const handleConfirmClick = async () => {\r\n      dialogInstance.destroy();\r\n\r\n      const cropperRef = unref(imageCropperContentEl)!.cropperRef;\r\n\r\n      resolve({\r\n        isConfirm: true,\r\n        data: await new Promise(cropperRef.getCropData.bind(cropperRef)),\r\n        size: { width: cropperRef.cropW, height: cropperRef.cropH },\r\n      });\r\n    };\r\n\r\n    const dialogInstance = Dialoger.customRender({\r\n      title: \"图片裁切\",\r\n      onClose: handleCancelClick,\r\n      body: () => {\r\n        return (\r\n          <ImageCropperContent\r\n            ref={((el: any) => (imageCropperContentEl.value = el)) as any}\r\n            src={options.src}\r\n            fixedBox={fixedBox}\r\n            ratioOptions={ratioOptions}\r\n          />\r\n        );\r\n      },\r\n      footer: () => {\r\n        return (\r\n          <Fragment>\r\n            <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n            <ElButton type=\"primary\" onClick={handleConfirmClick}>\r\n              确认\r\n            </ElButton>\r\n          </Fragment>\r\n        );\r\n      },\r\n    });\r\n  });\r\n}\r\n"],"names":["ImageCropper","options","ratioOptions","fixedBox","Promise","resolve","imageCropperContentEl","ref","handleCancelClick","dialogInstance","destroy","isConfirm","data","size","width","height","handleConfirmClick","cropperRef","unref","getCropData","bind","cropW","cropH","Dialoger","customRender","title","onClose","body","_createVNode","ImageCropperContent","el","value","src","footer","_Fragment","ElButton","default","_createTextVNode"],"mappings":";;;;;;;AAmBO,eAAeA,aACpBC,SAC+B;AAC/B,QAAMC,eAAeD,QAAQC,gBAAgB;AAC7C,QAAMC,WAAWF,QAAQE,YAAY;AAErC,SAAO,IAAIC,QAASC,aAAY;AAC9B,UAAMC,wBACJC,QAAI,IAAI;AAEV,UAAMC,oBAAoBA,MAAM;AAC9BC,qBAAeC,QAAO;AAEtBL,cAAQ;AAAA,QACNM,WAAW;AAAA,QACXC,MAAM;AAAA,QACNC,MAAM;AAAA,UAAEC,OAAO;AAAA,UAAGC,QAAQ;AAAA,QAAE;AAAA,MAC9B,CAAC;AAAA;AAGH,UAAMC,qBAAqB,YAAY;AACrCP,qBAAeC,QAAO;AAEtB,YAAMO,aAAaC,IAAAA,MAAMZ,qBAAqB,EAAGW;AAEjDZ,cAAQ;AAAA,QACNM,WAAW;AAAA,QACXC,MAAM,MAAM,IAAIR,QAAQa,WAAWE,YAAYC,KAAKH,UAAU,CAAC;AAAA,QAC/DJ,MAAM;AAAA,UAAEC,OAAOG,WAAWI;AAAAA,UAAON,QAAQE,WAAWK;AAAAA,QAAM;AAAA,MAC5D,CAAC;AAAA;AAGH,UAAMb,iBAAiBc,GAAQ,SAACC,aAAa;AAAA,MAC3CC,OAAO;AAAA,MACPC,SAASlB;AAAAA,MACTmB,MAAMA,MAAM;AACV,eAAAC,IAAAA,YAAAC,qBAAA;AAAA,UAAA,OAEWC,QAAaxB,sBAAsByB,QAAQD;AAAAA,UAAG,OAChD7B,QAAQ+B;AAAAA,UAAG,YACN7B;AAAAA,UAAQ,gBACJD;AAAAA,QAAY,GAAA,IAAA;AAAA,MAG/B;AAAA,MACD+B,QAAQA,MAAM;AACZ,eAAAL,IAAA,YAAAM,IAAA,UAAAN,MAAAA,CAAAA,IAAAA,YAAAO,YAAAA,UAAA;AAAA,UAAA,WAEuB3B;AAAAA,QAAiB,GAAA;AAAA,UAAA4B,SAAAA,MAAA,CAAAC,oBAAA,IAAA,CAAA;AAAA,SAAAT,GAAAA,IAAA,YAAAO,sBAAA;AAAA,UAAA,QAAA;AAAA,UAAA,WACFnB;AAAAA,QAAkB,GAAA;AAAA,UAAAoB,SAAAA,MAAA,CAAAC,oBAAA,IAAA,CAAA;AAAA,QAAA,CAAA,CAAA,CAAA;AAAA,MAK1D;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACH;;"}
+{"version":3,"file":"image-cropper-api.js","sources":["../../../../../src/components/basic/image-cropper/image-cropper-api.tsx"],"sourcesContent":["import { Dialoger } from \"@maketribe/dm\";\r\nimport ImageCropperContent, {\r\n  ImageCropperRatioOption,\r\n} from \"./image-cropper-content\";\r\nimport { Fragment } from \"vue/jsx-runtime\";\r\nimport { ElButton } from \"element-plus\";\r\nimport { ref, Ref, unref } from \"vue\";\r\n\r\nexport type MKImageCropperOptions = {\r\n  src: string;\r\n  ratioOptions?: Array<ImageCropperRatioOption>;\r\n  fixedBox?: boolean;\r\n  maxWidth?:number;\r\n  maxHeight?:number;\r\n};\r\nexport type MKImageCropperResult = {\r\n  isConfirm: boolean;\r\n  data: string;\r\n  size: { width: number; height: number };\r\n};\r\n\r\nexport async function ImageCropper(\r\n  options: MKImageCropperOptions\r\n): Promise<MKImageCropperResult> {\r\n  const ratioOptions = options.ratioOptions ?? [];\r\n  const fixedBox = options.fixedBox ?? false;\r\n\r\n  return new Promise((resolve) => {\r\n    const imageCropperContentEl: Ref<typeof ImageCropperContent | null> =\r\n      ref(null);\r\n\r\n    const handleCancelClick = () => {\r\n      dialogInstance.destroy();\r\n\r\n      resolve({\r\n        isConfirm: false,\r\n        data: \"\",\r\n        size: { width: 0, height: 0 },\r\n      });\r\n    };\r\n\r\n    const handleConfirmClick = async () => {\r\n      dialogInstance.destroy();\r\n\r\n      const cropperRef = unref(imageCropperContentEl)!.cropperRef;\r\n\r\n      resolve({\r\n        isConfirm: true,\r\n        data: await new Promise(cropperRef.getCropData.bind(cropperRef)),\r\n        size: { width: cropperRef.cropW, height: cropperRef.cropH },\r\n      });\r\n    };\r\n\r\n    const dialogInstance = Dialoger.customRender({\r\n      title: \"图片裁切\",\r\n      onClose: handleCancelClick,\r\n      body: () => {\r\n        return (\r\n          <ImageCropperContent\r\n            ref={((el: any) => (imageCropperContentEl.value = el)) as any}\r\n            src={options.src}\r\n            fixedBox={fixedBox}\r\n            ratioOptions={ratioOptions}\r\n            maxHeight={options.maxHeight}\r\n            maxWidth={options.maxWidth}\r\n          />\r\n        );\r\n      },\r\n      footer: () => {\r\n        return (\r\n          <Fragment>\r\n            <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n            <ElButton type=\"primary\" onClick={handleConfirmClick}>\r\n              确认\r\n            </ElButton>\r\n          </Fragment>\r\n        );\r\n      },\r\n    });\r\n  });\r\n}\r\n"],"names":["ImageCropper","options","ratioOptions","fixedBox","Promise","resolve","imageCropperContentEl","ref","handleCancelClick","dialogInstance","destroy","isConfirm","data","size","width","height","handleConfirmClick","cropperRef","unref","getCropData","bind","cropW","cropH","Dialoger","customRender","title","onClose","body","_createVNode","ImageCropperContent","el","value","src","maxHeight","maxWidth","footer","_Fragment","ElButton","default","_createTextVNode"],"mappings":";;;;;;;AAqBO,eAAeA,aACpBC,SAC+B;AAC/B,QAAMC,eAAeD,QAAQC,gBAAgB;AAC7C,QAAMC,WAAWF,QAAQE,YAAY;AAErC,SAAO,IAAIC,QAASC,aAAY;AAC9B,UAAMC,wBACJC,QAAI,IAAI;AAEV,UAAMC,oBAAoBA,MAAM;AAC9BC,qBAAeC,QAAO;AAEtBL,cAAQ;AAAA,QACNM,WAAW;AAAA,QACXC,MAAM;AAAA,QACNC,MAAM;AAAA,UAAEC,OAAO;AAAA,UAAGC,QAAQ;AAAA,QAAE;AAAA,MAC9B,CAAC;AAAA;AAGH,UAAMC,qBAAqB,YAAY;AACrCP,qBAAeC,QAAO;AAEtB,YAAMO,aAAaC,IAAAA,MAAMZ,qBAAqB,EAAGW;AAEjDZ,cAAQ;AAAA,QACNM,WAAW;AAAA,QACXC,MAAM,MAAM,IAAIR,QAAQa,WAAWE,YAAYC,KAAKH,UAAU,CAAC;AAAA,QAC/DJ,MAAM;AAAA,UAAEC,OAAOG,WAAWI;AAAAA,UAAON,QAAQE,WAAWK;AAAAA,QAAM;AAAA,MAC5D,CAAC;AAAA;AAGH,UAAMb,iBAAiBc,GAAQ,SAACC,aAAa;AAAA,MAC3CC,OAAO;AAAA,MACPC,SAASlB;AAAAA,MACTmB,MAAMA,MAAM;AACV,eAAAC,IAAAA,YAAAC,qBAAA;AAAA,UAAA,OAEWC,QAAaxB,sBAAsByB,QAAQD;AAAAA,UAAG,OAChD7B,QAAQ+B;AAAAA,UAAG,YACN7B;AAAAA,UAAQ,gBACJD;AAAAA,UAAY,aACfD,QAAQgC;AAAAA,UAAS,YAClBhC,QAAQiC;AAAAA,QAAQ,GAAA,IAAA;AAAA,MAG/B;AAAA,MACDC,QAAQA,MAAM;AACZ,eAAAP,IAAA,YAAAQ,IAAA,UAAAR,MAAAA,CAAAA,IAAAA,YAAAS,YAAAA,UAAA;AAAA,UAAA,WAEuB7B;AAAAA,QAAiB,GAAA;AAAA,UAAA8B,SAAAA,MAAA,CAAAC,oBAAA,IAAA,CAAA;AAAA,SAAAX,GAAAA,IAAA,YAAAS,sBAAA;AAAA,UAAA,QAAA;AAAA,UAAA,WACFrB;AAAAA,QAAkB,GAAA;AAAA,UAAAsB,SAAAA,MAAA,CAAAC,oBAAA,IAAA,CAAA;AAAA,QAAA,CAAA,CAAA,CAAA;AAAA,MAK1D;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACH;;"}

package/dist/cjs/components/basic/image-cropper/image-cropper-content-options.js

@@ -5,6 +5,8 @@ const imageCropperContentProps = utils.buildProps({
   // modelValue: { type: String, required: true },
   src: { type: String, required: true },
   fixedBox: { type: Boolean, default: false },
+  maxWidth: { type: Number, default: 0 },
+  maxHeight: { type: Number, default: 0 },
   ratioOptions: {
     type: Array,
     default: () => []

package/dist/cjs/components/basic/image-cropper/image-cropper-content-options.js.map

@@ -1 +1 @@
-{"version":3,"file":"image-cropper-content-options.js","sources":["../../../../../src/components/basic/image-cropper/image-cropper-content-options.ts"],"sourcesContent":["import { buildProps } from \"@maketribe/utils\";\r\nimport { ExtractPropTypes } from \"vue\";\r\n\r\nexport const imageCropperContentProps = buildProps({\r\n  // modelValue: { type: String, required: true },\r\n  src: { type: String, required: true },\r\n  fixedBox: { type: Boolean, default: false },\r\n  ratioOptions: {\r\n    type: Array,\r\n    default: () => [],\r\n  },\r\n} as const);\r\n\r\nexport type ImageCropperContentProps = ExtractPropTypes<\r\n  typeof imageCropperContentProps\r\n>;\r\n\r\nexport const imageCropperContentEmits = {\r\n  // \"update:model-value\": (modelValue: string) => true,\r\n};\r\n\r\nexport type ImageCropperContentEmits = typeof imageCropperContentEmits;\r\n"],"names":["buildProps"],"mappings":";;;AAGO,MAAM,2BAA2BA,MAAAA,WAAW;AAAA;AAAA,EAEjD,KAAK,EAAE,MAAM,QAAQ,UAAU,KAAK;AAAA,EACpC,UAAU,EAAE,MAAM,SAAS,SAAS,MAAM;AAAA,EAC1C,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,SAAS,MAAM,CAAC;AAAA,EAClB;AACF,CAAU;AAMH,MAAM,2BAA2B;AAAA;AAExC;;;"}
+{"version":3,"file":"image-cropper-content-options.js","sources":["../../../../../src/components/basic/image-cropper/image-cropper-content-options.ts"],"sourcesContent":["import { buildProps } from \"@maketribe/utils\";\r\nimport { ExtractPropTypes } from \"vue\";\r\n\r\nexport const imageCropperContentProps = buildProps({\r\n  // modelValue: { type: String, required: true },\r\n  src: { type: String, required: true },\r\n  fixedBox: { type: Boolean, default: false },\r\n  maxWidth:{ type:Number,default:0},\r\n  maxHeight:{ type:Number,default:0},\r\n  ratioOptions: {\r\n    type: Array,\r\n    default: () => [],\r\n  },\r\n} as const);\r\n\r\nexport type ImageCropperContentProps = ExtractPropTypes<\r\n  typeof imageCropperContentProps\r\n>;\r\n\r\nexport const imageCropperContentEmits = {\r\n  // \"update:model-value\": (modelValue: string) => true,\r\n};\r\n\r\nexport type ImageCropperContentEmits = typeof imageCropperContentEmits;\r\n"],"names":["buildProps"],"mappings":";;;AAGO,MAAM,2BAA2BA,MAAAA,WAAW;AAAA;AAAA,EAEjD,KAAK,EAAE,MAAM,QAAQ,UAAU,KAAK;AAAA,EACpC,UAAU,EAAE,MAAM,SAAS,SAAS,MAAM;AAAA,EAC1C,UAAS,EAAE,MAAK,QAAO,SAAQ,EAAC;AAAA,EAChC,WAAU,EAAE,MAAK,QAAO,SAAQ,EAAC;AAAA,EACjC,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,SAAS,MAAM,CAAC;AAAA,EAClB;AACF,CAAU;AAMH,MAAM,2BAA2B;AAAA;AAExC;;;"}

package/dist/cjs/components/basic/image-cropper/image-cropper-content.js

@@ -7,7 +7,6 @@ const elementPlus = require("element-plus");
 function _isSlot(s) {
   return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
 }
-const ORIGIN_RATIO = "origin";
 const FREE_RATIO = "free";
 const BASE64_PREFIX = /^data:image\/([^;]+);base64,/;
 const ImageCropperContent = /* @__PURE__ */ vue.defineComponent({
@@ -28,28 +27,26 @@ const ImageCropperContent = /* @__PURE__ */ vue.defineComponent({
       }
       return url.slice(index2 + 1) || "jpeg";
     });
-    const originRatioOption = vue.reactive({
-      value: ORIGIN_RATIO,
-      label: "原图比例",
-      width: 1,
-      height: 1
-    });
     const ratioOptions = vue.computed(() => {
-      return [originRatioOption, {
-        value: FREE_RATIO,
-        label: "自由比例",
-        width: 1,
-        height: 1
-      }, ...props.ratioOptions.map((item) => ({
-        ...item,
-        value: item.value.toString()
-      }))];
+      return [
+        ...props.ratioOptions.map((item) => ({
+          ...item,
+          value: item.value.toString()
+        })),
+        // originRatioOption,
+        {
+          value: FREE_RATIO,
+          label: "自由比例",
+          width: 1,
+          height: 1
+        }
+      ];
     });
-    const autoCropWidth = vue.ref(0);
-    const autoCropHeight = vue.ref(0);
-    const currentRatio = vue.ref(ORIGIN_RATIO);
-    const maxWidth = vue.ref(0);
-    const maxHeight = vue.ref(0);
+    const autoCropWidth = vue.ref(props.maxWidth);
+    const autoCropHeight = vue.ref(props.maxHeight);
+    const currentRatio = vue.ref(ratioOptions.value[0].value);
+    const maxWidth = vue.ref(props.maxWidth);
+    const maxHeight = vue.ref(props.maxHeight);
     const enlarge = vue.computed(() => {
       var _a, _b;
       const width = ((_a = vue.unref(cropperRef)) == null ? void 0 : _a.cropW) ?? 1;
@@ -70,8 +67,12 @@ const ImageCropperContent = /* @__PURE__ */ vue.defineComponent({
       const image = new Image();
       image.src = src;
       image.onload = () => {
-        maxWidth.value = autoCropWidth.value = originRatioOption.width = image.naturalWidth;
-        maxHeight.value = autoCropHeight.value = originRatioOption.height = image.naturalHeight;
+        if (!props.maxWidth) {
+          autoCropWidth.value = image.naturalWidth;
+        }
+        if (props.maxHeight) {
+          autoCropHeight.value = image.naturalHeight;
+        }
       };
     }, {
       immediate: true

package/dist/cjs/components/basic/image-cropper/image-cropper-content.js.map

@@ -1 +1 @@
-{"version":3,"file":"image-cropper-content.js","sources":["../../../../../src/components/basic/image-cropper/image-cropper-content.tsx"],"sourcesContent":["import {\r\n  computed,\r\n  defineComponent,\r\n  reactive,\r\n  ref,\r\n  Ref,\r\n  unref,\r\n  watch,\r\n} from \"vue\";\r\nimport { VueCropper } from \"vue-cropper\";\r\nimport { MKSvgIcon } from \"../svg-icon\";\r\nimport {\r\n  imageCropperContentEmits,\r\n  imageCropperContentProps,\r\n} from \"./image-cropper-content-options\";\r\nimport {\r\n  ElForm,\r\n  ElFormItem,\r\n  ElInputNumber,\r\n  ElOption,\r\n  ElScrollbar,\r\n  ElSelect,\r\n  ElTooltip,\r\n} from \"element-plus\";\r\n\r\nexport type ImageCropperRatioOption = {\r\n  value: string;\r\n  label: string;\r\n  width: number;\r\n  height: number;\r\n};\r\n\r\nconst ORIGIN_RATIO = \"origin\";\r\nconst FREE_RATIO = \"free\";\r\n\r\nconst BASE64_PREFIX = /^data:image\\/([^;]+);base64,/;\r\n\r\nexport default defineComponent({\r\n  name: \"MKImageContentCropper\",\r\n  props: imageCropperContentProps,\r\n  emits: imageCropperContentEmits,\r\n  setup(props) {\r\n    const cropperRef: Ref<any> = ref(null);\r\n\r\n    const outputType = computed(() => {\r\n      const base64Match = props.src.match(BASE64_PREFIX);\r\n\r\n      if (base64Match?.[1]) {\r\n        return base64Match?.[1];\r\n      }\r\n\r\n      const url = new URL(props.src, location.origin).toString();\r\n\r\n      const index = url.lastIndexOf(\".\");\r\n\r\n      if (index === -1) {\r\n        return \"jpeg\";\r\n      }\r\n\r\n      return url.slice(index + 1) || \"jpeg\";\r\n    });\r\n\r\n    const originRatioOption: ImageCropperRatioOption = reactive({\r\n      value: ORIGIN_RATIO,\r\n      label: \"原图比例\",\r\n      width: 1,\r\n      height: 1,\r\n    });\r\n\r\n    const ratioOptions = computed(() => {\r\n      return [\r\n        originRatioOption,\r\n        { value: FREE_RATIO, label: \"自由比例\", width: 1, height: 1 },\r\n        ...props.ratioOptions.map((item: any) => ({\r\n          ...item,\r\n          value: item.value.toString(),\r\n        })),\r\n      ] as ImageCropperRatioOption[];\r\n    });\r\n\r\n    const autoCropWidth = ref(0);\r\n    const autoCropHeight = ref(0);\r\n\r\n    const currentRatio: Ref<string> = ref(ORIGIN_RATIO);\r\n\r\n    const maxWidth: Ref<number> = ref(0);\r\n    const maxHeight: Ref<number> = ref(0);\r\n\r\n    const enlarge = computed(() => {\r\n      const width = unref(cropperRef)?.cropW ?? 1;\r\n      const height = unref(cropperRef)?.cropH ?? 1;\r\n\r\n      const ratio = unref(maxWidth) / unref(maxHeight);\r\n      const cropRatio = width / height;\r\n\r\n      return cropRatio > ratio\r\n        ? unref(maxWidth) / width\r\n        : unref(maxHeight) / height;\r\n    });\r\n\r\n    const setCurrentRatio = (value: string) => {\r\n      currentRatio.value = value;\r\n    };\r\n\r\n    const isFixed = computed(() => unref(currentRatio) !== FREE_RATIO);\r\n\r\n    const fixedNumber = computed(() => {\r\n      const option = unref(ratioOptions).find(\r\n        (option) => option.value === unref(currentRatio)\r\n      );\r\n\r\n      return [option?.width ?? 1, option?.height ?? 1];\r\n    });\r\n\r\n    watch(\r\n      computed(() => props.src),\r\n      (src) => {\r\n        const image = new Image();\r\n        image.src = src;\r\n\r\n        image.onload = () => {\r\n          maxWidth.value =\r\n            autoCropWidth.value =\r\n            originRatioOption.width =\r\n              image.naturalWidth;\r\n          maxHeight.value =\r\n            autoCropHeight.value =\r\n            originRatioOption.height =\r\n              image.naturalHeight;\r\n        };\r\n      },\r\n      { immediate: true }\r\n    );\r\n\r\n    // watch(currentRatio, (currentRatio) => {\r\n    //   new MouseEvent(\"mousemove\", {});\r\n    //   // debugger;\r\n    //   unref(cropperRef).changeCropNow(new MouseEvent(\"mousemove\"));\r\n    // });\r\n\r\n    const handleRotateLeft = () => {\r\n      unref(cropperRef).rotateLeft();\r\n    };\r\n\r\n    const handleRotateRight = () => {\r\n      unref(cropperRef).rotateRight();\r\n    };\r\n\r\n    const setCropperRef = (el: any) => {\r\n      cropperRef.value = el;\r\n    };\r\n\r\n    return {\r\n      enlarge,\r\n      maxWidth,\r\n      maxHeight,\r\n      outputType,\r\n      cropperRef,\r\n      ratioOptions,\r\n      autoCropWidth,\r\n      autoCropHeight,\r\n      currentRatio,\r\n      isFixed,\r\n      fixedNumber,\r\n      setCurrentRatio,\r\n      setCropperRef,\r\n      handleRotateLeft,\r\n      handleRotateRight,\r\n    };\r\n  },\r\n  render() {\r\n    const {\r\n      enlarge,\r\n      maxWidth,\r\n      maxHeight,\r\n      outputType,\r\n      ratioOptions,\r\n      autoCropHeight,\r\n      autoCropWidth,\r\n      isFixed,\r\n      fixedNumber,\r\n      currentRatio,\r\n      setCurrentRatio,\r\n      setCropperRef,\r\n      handleRotateLeft,\r\n      handleRotateRight,\r\n      $props,\r\n      $slots,\r\n    } = this;\r\n\r\n    const ratioOptionsVNodes = unref(ratioOptions).map((ratioOption) => (\r\n      <ElOption value={ratioOption.value} label={ratioOption.label} />\r\n    ));\r\n\r\n    return (\r\n      <div class=\"mk-image-cropper\">\r\n        <div class=\"mk-image-cropper__main\">\r\n          <VueCropper\r\n            ref={setCropperRef}\r\n            outputType={outputType}\r\n            img={$props.src}\r\n            auto-crop\r\n            canMoveBox\r\n            auto-crop-width={autoCropWidth}\r\n            auto-crop-height={autoCropHeight}\r\n            fixedBox={$props.fixedBox}\r\n            fixed={isFixed}\r\n            fixedNumber={fixedNumber}\r\n            enlarge={enlarge}\r\n          />\r\n\r\n          <div class=\"mk-image-cropper__bar\">\r\n            <ElTooltip content=\"左旋\">\r\n              <MKSvgIcon iconClass=\"RefreshLeft\" onClick={handleRotateLeft} />\r\n            </ElTooltip>\r\n            <ElTooltip content=\"右旋\">\r\n              <MKSvgIcon iconClass=\"RefreshRight\" onClick={handleRotateRight} />\r\n            </ElTooltip>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"mk-image-cropper__tools\">\r\n          <ElScrollbar height=\"100%\">\r\n            <ElForm label-position=\"top\">\r\n              <ElFormItem label=\"比例\">\r\n                <ElSelect\r\n                  placeholder=\"选择比例\"\r\n                  modelValue={currentRatio}\r\n                  onUpdate:modelValue={setCurrentRatio}\r\n                >\r\n                  {ratioOptionsVNodes}\r\n                </ElSelect>\r\n              </ElFormItem>\r\n              <ElFormItem label=\"最大输出宽度\">\r\n                <ElInputNumber\r\n                  placeholder=\"宽度\"\r\n                  modelValue={maxWidth}\r\n                  onUpdate:modelValue={\r\n                    ((v: number) => (this.maxWidth = v)) as any\r\n                  }\r\n                />\r\n              </ElFormItem>\r\n\r\n              <ElFormItem label=\"最大输出高度\">\r\n                <ElInputNumber\r\n                  placeholder=\"高度\"\r\n                  modelValue={maxHeight}\r\n                  onUpdate:modelValue={\r\n                    ((v: number) => (this.maxHeight = v)) as any\r\n                  }\r\n                />\r\n              </ElFormItem>\r\n            </ElForm>\r\n\r\n            {$slots.tools?.()}\r\n          </ElScrollbar>\r\n        </div>\r\n      </div>\r\n    );\r\n  },\r\n});\r\n"],"names":["_isSlot","s","Object","prototype","toString","call","_isVNode","ORIGIN_RATIO","FREE_RATIO","BASE64_PREFIX","defineComponent","name","props","imageCropperContentProps","emits","imageCropperContentEmits","setup","cropperRef","ref","outputType","computed","base64Match","src","match","url","URL","location","origin","index","lastIndexOf","slice","originRatioOption","reactive","value","label","width","height","ratioOptions","map","item","autoCropWidth","autoCropHeight","currentRatio","maxWidth","maxHeight","enlarge","unref","cropW","cropH","ratio","cropRatio","setCurrentRatio","isFixed","fixedNumber","option","find","watch","image","Image","onload","naturalWidth","naturalHeight","immediate","handleRotateLeft","rotateLeft","handleRotateRight","rotateRight","setCropperRef","el","render","$props","$slots","ratioOptionsVNodes","ratioOption","_createVNode","ElOption","VueCropper","fixedBox","ElTooltip","default","MKSvgIcon","ElScrollbar","ElForm","ElFormItem","ElSelect","ElInputNumber","v","tools"],"mappings":"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"}
+{"version":3,"file":"image-cropper-content.js","sources":["../../../../../src/components/basic/image-cropper/image-cropper-content.tsx"],"sourcesContent":["import {\r\n  computed,\r\n  defineComponent,\r\n  reactive,\r\n  ref,\r\n  Ref,\r\n  unref,\r\n  watch,\r\n} from \"vue\";\r\nimport { VueCropper } from \"vue-cropper\";\r\nimport { MKSvgIcon } from \"../svg-icon\";\r\nimport {\r\n  imageCropperContentEmits,\r\n  imageCropperContentProps,\r\n} from \"./image-cropper-content-options\";\r\nimport {\r\n  ElForm,\r\n  ElFormItem,\r\n  ElInputNumber,\r\n  ElOption,\r\n  ElScrollbar,\r\n  ElSelect,\r\n  ElTooltip,\r\n} from \"element-plus\";\r\n\r\nexport type ImageCropperRatioOption = {\r\n  value: string;\r\n  label: string;\r\n  width: number;\r\n  height: number;\r\n};\r\n\r\n// const ORIGIN_RATIO = \"origin\";\r\nconst FREE_RATIO = \"free\";\r\n\r\nconst BASE64_PREFIX = /^data:image\\/([^;]+);base64,/;\r\n\r\nexport default defineComponent({\r\n  name: \"MKImageContentCropper\",\r\n  props: imageCropperContentProps,\r\n  emits: imageCropperContentEmits,\r\n  setup(props) {\r\n    const cropperRef: Ref<any> = ref(null);\r\n\r\n    const outputType = computed(() => {\r\n      const base64Match = props.src.match(BASE64_PREFIX);\r\n\r\n      if (base64Match?.[1]) {\r\n        return base64Match?.[1];\r\n      }\r\n\r\n      const url = new URL(props.src, location.origin).toString();\r\n\r\n      const index = url.lastIndexOf(\".\");\r\n\r\n      if (index === -1) {\r\n        return \"jpeg\";\r\n      }\r\n\r\n      return url.slice(index + 1) || \"jpeg\";\r\n    });\r\n\r\n    // const originRatioOption: ImageCropperRatioOption = reactive({\r\n    //   value: ORIGIN_RATIO,\r\n    //   label: \"原图比例\",\r\n    //   width: 1,\r\n    //   height: 1,\r\n    // });\r\n\r\n    const ratioOptions = computed(() => {\r\n      return  [\r\n        ...props.ratioOptions.map((item: any) => ({\r\n          ...item,\r\n          value: item.value.toString(),\r\n        })),\r\n        // originRatioOption,\r\n        { value: FREE_RATIO, label: \"自由比例\", width: 1, height: 1 },\r\n         \r\n      ] as ImageCropperRatioOption[];\r\n    });\r\n\r\n    const autoCropWidth = ref(props.maxWidth);\r\n    const autoCropHeight = ref(props.maxHeight);\r\n\r\n    const currentRatio: Ref<string> = ref(ratioOptions.value[0].value);\r\n\r\n    const maxWidth: Ref<number> = ref(props.maxWidth);\r\n    const maxHeight: Ref<number> = ref(props.maxHeight);\r\n\r\n    const enlarge = computed(() => {\r\n      const width = unref(cropperRef)?.cropW ?? 1;\r\n      const height = unref(cropperRef)?.cropH ?? 1;\r\n\r\n      const ratio = unref(maxWidth) / unref(maxHeight);\r\n      const cropRatio = width / height;\r\n     \r\n      return cropRatio > ratio\r\n        ? unref(maxWidth) / width\r\n        : unref(maxHeight) / height;\r\n    });\r\n\r\n    const setCurrentRatio = (value: string) => {\r\n      currentRatio.value = value;\r\n    };\r\n\r\n    const isFixed = computed(() => unref(currentRatio) !== FREE_RATIO);\r\n\r\n    const fixedNumber = computed(() => {\r\n      const option = unref(ratioOptions).find(\r\n        (option) => option.value === unref(currentRatio)\r\n      );\r\n\r\n      return [option?.width ?? 1, option?.height ?? 1];\r\n    });\r\n\r\n    watch(\r\n      computed(() => props.src),\r\n      (src) => {\r\n        const image = new Image();\r\n        image.src = src;\r\n\r\n        image.onload = () => {\r\n\r\n          if(!props.maxWidth){\r\n            autoCropWidth.value = image.naturalWidth;\r\n          }\r\n\r\n          if(props.maxHeight){\r\n            autoCropHeight.value = image.naturalHeight;\r\n          }\r\n          \r\n              \r\n        };\r\n      },\r\n      { immediate: true }\r\n    );\r\n\r\n    // watch(currentRatio, (currentRatio) => {\r\n    //   new MouseEvent(\"mousemove\", {});\r\n    //   // debugger;\r\n    //   unref(cropperRef).changeCropNow(new MouseEvent(\"mousemove\"));\r\n    // });\r\n\r\n    const handleRotateLeft = () => {\r\n      unref(cropperRef).rotateLeft();\r\n    };\r\n\r\n    const handleRotateRight = () => {\r\n      unref(cropperRef).rotateRight();\r\n    };\r\n\r\n    const setCropperRef = (el: any) => {\r\n      cropperRef.value = el;\r\n    };\r\n\r\n    return {\r\n      enlarge,\r\n      maxWidth,\r\n      maxHeight,\r\n      outputType,\r\n      cropperRef,\r\n      ratioOptions,\r\n      autoCropWidth,\r\n      autoCropHeight,\r\n      currentRatio,\r\n      isFixed,\r\n      fixedNumber,\r\n      setCurrentRatio,\r\n      setCropperRef,\r\n      handleRotateLeft,\r\n      handleRotateRight,\r\n    };\r\n  },\r\n  render() {\r\n    const {\r\n      enlarge,\r\n      maxWidth,\r\n      maxHeight,\r\n      outputType,\r\n      ratioOptions,\r\n      autoCropHeight,\r\n      autoCropWidth,\r\n      isFixed,\r\n      fixedNumber,\r\n      currentRatio,\r\n      setCurrentRatio,\r\n      setCropperRef,\r\n      handleRotateLeft,\r\n      handleRotateRight,\r\n      $props,\r\n      $slots,\r\n    } = this;\r\n\r\n    const ratioOptionsVNodes = unref(ratioOptions).map((ratioOption) => (\r\n      <ElOption value={ratioOption.value} label={ratioOption.label} />\r\n    ));\r\n\r\n    return (\r\n      <div class=\"mk-image-cropper\">\r\n        <div class=\"mk-image-cropper__main\">\r\n          <VueCropper\r\n            ref={setCropperRef}\r\n            outputType={outputType}\r\n            img={$props.src}\r\n            auto-crop\r\n            canMoveBox\r\n            auto-crop-width={autoCropWidth}\r\n            auto-crop-height={autoCropHeight}\r\n            fixedBox={$props.fixedBox}\r\n            fixed={isFixed}\r\n            fixedNumber={fixedNumber}\r\n            enlarge={enlarge}\r\n          />\r\n\r\n          <div class=\"mk-image-cropper__bar\">\r\n            <ElTooltip content=\"左旋\">\r\n              <MKSvgIcon iconClass=\"RefreshLeft\" onClick={handleRotateLeft} />\r\n            </ElTooltip>\r\n            <ElTooltip content=\"右旋\">\r\n              <MKSvgIcon iconClass=\"RefreshRight\" onClick={handleRotateRight} />\r\n            </ElTooltip>\r\n          </div>\r\n        </div>\r\n\r\n        <div class=\"mk-image-cropper__tools\">\r\n          <ElScrollbar height=\"100%\">\r\n            <ElForm label-position=\"top\">\r\n              <ElFormItem label=\"比例\">\r\n                <ElSelect\r\n                  placeholder=\"选择比例\"\r\n                  modelValue={currentRatio}\r\n                  onUpdate:modelValue={setCurrentRatio}\r\n                >\r\n                  {ratioOptionsVNodes}\r\n                </ElSelect>\r\n              </ElFormItem>\r\n              <ElFormItem label=\"最大输出宽度\">\r\n                <ElInputNumber\r\n                  placeholder=\"宽度\"\r\n                  modelValue={maxWidth}\r\n                  onUpdate:modelValue={\r\n                    ((v: number) => (this.maxWidth = v)) as any\r\n                  }\r\n                />\r\n              </ElFormItem>\r\n\r\n              <ElFormItem label=\"最大输出高度\">\r\n                <ElInputNumber\r\n                  placeholder=\"高度\"\r\n                  modelValue={maxHeight}\r\n                  onUpdate:modelValue={\r\n                    ((v: number) => (this.maxHeight = v)) as any\r\n                  }\r\n                />\r\n              </ElFormItem>\r\n            </ElForm>\r\n\r\n            {$slots.tools?.()}\r\n          </ElScrollbar>\r\n        </div>\r\n      </div>\r\n    );\r\n  },\r\n});\r\n"],"names":["_isSlot","s","Object","prototype","toString","call","_isVNode","FREE_RATIO","BASE64_PREFIX","defineComponent","name","props","imageCropperContentProps","emits","imageCropperContentEmits","setup","cropperRef","ref","outputType","computed","base64Match","src","match","url","URL","location","origin","index","lastIndexOf","slice","ratioOptions","map","item","value","label","width","height","autoCropWidth","maxWidth","autoCropHeight","maxHeight","currentRatio","enlarge","unref","cropW","cropH","ratio","cropRatio","setCurrentRatio","isFixed","fixedNumber","option","find","watch","image","Image","onload","naturalWidth","naturalHeight","immediate","handleRotateLeft","rotateLeft","handleRotateRight","rotateRight","setCropperRef","el","render","$props","$slots","ratioOptionsVNodes","ratioOption","_createVNode","ElOption","VueCropper","fixedBox","ElTooltip","default","MKSvgIcon","ElScrollbar","ElForm","ElFormItem","ElSelect","ElInputNumber","v","tools"],"mappings":"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"}

package/dist/cjs/components/basic/upload-file/ui/upload-image/upload-image.js

@@ -195,6 +195,8 @@ const UploadImage = /* @__PURE__ */ vue.defineComponent({
         }, null)]);
       }
       const imageViewer = vue.unref(isShowImageViewer) ? vue.createVNode(elementPlus.ElImageViewer, {
+        "teleported": true,
+        "zIndex": 99,
         "onClose": handleCloseImageViewer,
         "urlList": [vue.unref(currentImageSrc)]
       }, null) : null;

package/dist/cjs/components/basic/upload-file/ui/upload-image/upload-image.js.map

@@ -1 +1 @@
-{"version":3,"file":"upload-image.js","sources":["../../../../../../../src/components/basic/upload-file/ui/upload-image/upload-image.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 { uploadImageEmits, uploadImageProps } from \"./upload-image-options\";\r\nimport { UploadContext } from \"../../context\";\r\n\r\nconst MKUploadImageItem = defineComponent({\r\n  name: \"MKUploadImageItem\",\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 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    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            <ElImage\r\n              ref={\r\n                ((el: InstanceType<typeof ElImage>) =>\r\n                  (imageInstance.value = el)) as any\r\n              }\r\n              src={unref(modelValue)}\r\n              class=\"mk-upload-image-item__image\"\r\n              fit=\"cover\"\r\n            />\r\n\r\n            <div class=\"mk-upload-image-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 = <MKSvgIcon iconClass={props.icon} />;\r\n      }\r\n\r\n      return (\r\n        <div class=\"mk-upload-image-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-image-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: \"MKUploadImage\",\r\n  props: uploadImageProps,\r\n  emits: uploadImageEmits,\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 currentImageSrc: Ref<string> = ref(\"\");\r\n\r\n    const multiple = computed(() => props.multiple);\r\n\r\n    const isShowImageViewer: 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      isShowImageViewer.value = true;\r\n      currentImageSrc.value = src;\r\n    };\r\n\r\n    const handleCloseImageViewer = () => {\r\n      isShowImageViewer.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          <MKUploadImageItem\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            <MKUploadImageItem\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            <MKUploadImageItem\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 imageViewer = unref(isShowImageViewer) ? (\r\n        <ElImageViewer\r\n          onClose={handleCloseImageViewer}\r\n          urlList={[unref(currentImageSrc)]}\r\n        />\r\n      ) : null;\r\n\r\n      return (\r\n        <div class=\"mk-upload-image\" style={{width:_multiple?\"\":props.width}}>\r\n          {content}\r\n          {imageViewer}\r\n        </div>\r\n      );\r\n    };\r\n  },\r\n});\r\n"],"names":["MKUploadImageItem","defineComponent","name","props","modelValue","type","String","default","uploadContext","UploadContext","required","width","height","icon","emits","setup","emit","uploadFileInstance","ref","imageInstance","computed","get","set","v","handleUpdateModelValue","value","handleClick","event","stopPropagation","unref","handleUpload","handleView","handleDelete","content","_createVNode","_Fragment","ElImage","el","ElTooltip","MKSvgIcon","MKUploadFile","uploadImageProps","uploadImageEmits","currentImageSrc","multiple","isShowImageViewer","watch","Array","isArray","immediate","src","index","indexOf","splice","handleShowImageViewer","handleCloseImageViewer","handleAppendImage","_value","push","_multiple","images","map","imageViewer","ElImageViewer"],"mappings":"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"}
+{"version":3,"file":"upload-image.js","sources":["../../../../../../../src/components/basic/upload-file/ui/upload-image/upload-image.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 { uploadImageEmits, uploadImageProps } from \"./upload-image-options\";\r\nimport { UploadContext } from \"../../context\";\r\n\r\nconst MKUploadImageItem = defineComponent({\r\n  name: \"MKUploadImageItem\",\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 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    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            <ElImage ref={\r\n                ((el: InstanceType<typeof ElImage>) =>\r\n                  (imageInstance.value = el)) as any\r\n              }\r\n              src={unref(modelValue)}\r\n              class=\"mk-upload-image-item__image\"\r\n              fit=\"cover\"\r\n            />\r\n\r\n            <div class=\"mk-upload-image-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 = <MKSvgIcon iconClass={props.icon} />;\r\n      }\r\n\r\n      return (\r\n        <div class=\"mk-upload-image-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-image-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: \"MKUploadImage\",\r\n  props: uploadImageProps,\r\n  emits: uploadImageEmits,\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 currentImageSrc: Ref<string> = ref(\"\");\r\n\r\n    const multiple = computed(() => props.multiple);\r\n\r\n    const isShowImageViewer: 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      isShowImageViewer.value = true;\r\n      currentImageSrc.value = src;\r\n    };\r\n\r\n    const handleCloseImageViewer = () => {\r\n      isShowImageViewer.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          <MKUploadImageItem\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            <MKUploadImageItem\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            <MKUploadImageItem\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 imageViewer = unref(isShowImageViewer) ? (\r\n        <ElImageViewer teleported zIndex={99}\r\n          onClose={handleCloseImageViewer}\r\n          urlList={[unref(currentImageSrc)]}\r\n        />\r\n      ) : null;\r\n\r\n      return (\r\n        <div class=\"mk-upload-image\" style={{width:_multiple?\"\":props.width}}>\r\n          {content}\r\n          {imageViewer}\r\n        </div>\r\n      );\r\n    };\r\n  },\r\n});\r\n"],"names":["MKUploadImageItem","defineComponent","name","props","modelValue","type","String","default","uploadContext","UploadContext","required","width","height","icon","emits","setup","emit","uploadFileInstance","ref","imageInstance","computed","get","set","v","handleUpdateModelValue","value","handleClick","event","stopPropagation","unref","handleUpload","handleView","handleDelete","content","_createVNode","_Fragment","ElImage","el","ElTooltip","MKSvgIcon","MKUploadFile","uploadImageProps","uploadImageEmits","currentImageSrc","multiple","isShowImageViewer","watch","Array","isArray","immediate","src","index","indexOf","splice","handleShowImageViewer","handleCloseImageViewer","handleAppendImage","_value","push","_multiple","images","map","imageViewer","ElImageViewer"],"mappings":"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"}

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

@@ -37,7 +37,7 @@ class ResourceManager extends utils.Disposable {
     try {
       this.loadingManager.startLoading();
       const response = await httpRequest.post(
-        `${this.baseURL}/resource/resource-list`,
+        `${this.baseURL}/list`,
         {
           directoryPath: toPath,
           extensions: this.filterExtensions
@@ -65,10 +65,9 @@ class ResourceManager extends utils.Disposable {
     const httpRequest = MSAppClient.MSAppClient.instance.httpRequest;
     try {
       this.loadingManager.startLoading();
-      const response = await httpRequest.post(
-        `${this.baseURL}/resource/delete-resource-list`,
-        { paths: this.selectResourceList.map((item) => item.path) }
-      );
+      const response = await httpRequest.post(`${this.baseURL}/delete`, {
+        paths: this.selectResourceList.map((item) => item.path)
+      });
       if (response.data.code !== 200) {
         dm.Messager.error({ message: response.data.msg });
         this.loadResourceInfoList();
@@ -82,15 +81,16 @@ class ResourceManager extends utils.Disposable {
       this.loadingManager.completeLoading();
     }
   }
+  // 暂不做调整
   async getExistPathList(pathList) {
     const httpRequest = MSAppClient.MSAppClient.instance.httpRequest;
     try {
       this.loadingManager.startLoading();
       const directoryPath = this.directories.length ? `/${this.directories.join("/")}` : "";
-      return await httpRequest.post(
-        `${this.baseURL}/resource/get-exist-path-list`,
-        { pathList, directoryPath }
-      );
+      return await httpRequest.post(`${this.baseURL}/exist-path-list`, {
+        pathList,
+        directoryPath
+      });
     } catch (e) {
       console.error(e);
       dm.Messager.error({ message: "网络异常" });
@@ -109,10 +109,7 @@ class ResourceManager extends utils.Disposable {
         formData.append(files[i].name, files[i]);
       }
       formData.append("directory", directory);
-      const response = await httpRequest.post(
-        `${this.baseURL}/resource/update-resource-list`,
-        formData
-      );
+      const response = await httpRequest.post(`${this.baseURL}/save`, formData);
       if (response.data.code !== 200) {
         dm.Messager.error({ message: response.data.msg });
         this.loadResourceInfoList();
@@ -128,30 +125,34 @@ class ResourceManager extends utils.Disposable {
   }
   async downloadSelectResource() {
     const httpRequest = MSAppClient.MSAppClient.instance.httpRequest;
-    const response = await httpRequest.post(
-      `${this.baseURL}/resource/get-download-resource-url`,
-      { filePath: this.selectResourceList[0].path }
-    );
-    if (response.data.code !== 200) {
-      dm.Messager.error({ message: response.data.msg });
-      return;
+    try {
+      const response = await httpRequest.post(
+        `${this.baseURL}/download`,
+        {
+          path: this.selectResourceList[0].path
+        },
+        { responseType: "blob" }
+      );
+      const url = URL.createObjectURL(response.data);
+      var aElement = document.createElement("a");
+      aElement.href = url;
+      aElement.target = "_blank";
+      aElement.download = this.selectResourceList[0].name;
+      aElement.click();
+      URL.revokeObjectURL(url);
+    } catch (e) {
+      console.error(e);
+      dm.Messager.error({ message: "网络异常" });
     }
-    var aElement = document.createElement("a");
-    aElement.href = response.data.data;
-    aElement.target = "_blank";
-    aElement.click();
   }
   async editSelectFile() {
     const httpRequest = MSAppClient.MSAppClient.instance.httpRequest;
     try {
       this.loadingManager.startLoading();
       var resourceInfo = this.selectResourceList[0];
-      const response = await httpRequest.post(
-        `${this.baseURL}/resource/get-text`,
-        {
-          path: resourceInfo.path
-        }
-      );
+      const response = await httpRequest.post(`${this.baseURL}/text/read`, {
+        path: resourceInfo.path
+      });
       this.isShowEditDialog = true;
       this.currentEditText = response.data.data;
     } finally {
@@ -163,17 +164,15 @@ class ResourceManager extends utils.Disposable {
     try {
       this.loadingManager.startLoading();
       var resourceInfo = this.selectResourceList[0];
-      const response = await httpRequest.post(
-        `${this.baseURL}/resource/set-text`,
-        {
-          path: resourceInfo.path,
-          content: this.currentEditText
-        }
-      );
+      const response = await httpRequest.post(`${this.baseURL}/text/write`, {
+        path: resourceInfo.path,
+        content: this.currentEditText
+      });
       if (response.data.code !== 200) {
         dm.Messager.error({ message: response.data.msg });
         return;
       }
+      await this.loadResourceInfoList();
       this.isShowEditDialog = false;
       this.currentEditText = "";
     } finally {

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

@@ -1 +1 @@
-{"version":3,"file":"ResourceManager.js","sources":["../../../../../src/components/business/resource-list/ResourceManager.ts"],"sourcesContent":["import { Disposable } from \"@maketribe/utils\";\r\nimport { MSAppClient } from \"../../../core\";\r\nimport { Dialoger, LoadingManager, Messager } from \"@maketribe/dm\";\r\nimport { R } from \"@maketribe/request\";\r\n\r\nexport type ResourceInfo = {\r\n  name: string;\r\n  path: string;\r\n  isDirectory: boolean;\r\n  extension: string;\r\n  isSelected: boolean;\r\n};\r\n\r\nexport type ResourceManagerOptions = {\r\n  extensions?: string[];\r\n  baseURL: string;\r\n};\r\n\r\nexport class ResourceManager extends Disposable {\r\n  directories: string[];\r\n\r\n  resourceInfoList: ResourceInfo[];\r\n\r\n  loadingManager: LoadingManager;\r\n\r\n  isShowEditDialog: boolean = false;\r\n\r\n  currentEditText: string = \"\";\r\n\r\n  filterExtensions: string[] = [];\r\n\r\n  baseURL: string = \"\";\r\n\r\n  get selectResourceList() {\r\n    return this.resourceInfoList.filter((item) => item.isSelected);\r\n  }\r\n\r\n  get loading() {\r\n    return this.loadingManager.loading;\r\n  }\r\n\r\n  constructor(options: ResourceManagerOptions) {\r\n    super();\r\n\r\n    this.directories = [];\r\n\r\n    this.resourceInfoList = [];\r\n\r\n    this.loadingManager = new LoadingManager();\r\n\r\n    this.filterExtensions = options.extensions ?? [];\r\n    this.baseURL = options.baseURL;\r\n  }\r\n\r\n  async loadResourceInfoList(\r\n    toPath: string = this.directories.length\r\n      ? `/${this.directories.join(\"/\")}`\r\n      : \"\"\r\n  ) {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      this.loadingManager.startLoading();\r\n\r\n      const response = await httpRequest.post<R<ResourceInfo[]>>(\r\n        `${this.baseURL}/resource/resource-list`,\r\n        {\r\n          directoryPath: toPath,\r\n          extensions: this.filterExtensions,\r\n        }\r\n      );\r\n\r\n      if (response.data.code !== 200) {\r\n        Messager.error({ message: response.data.msg });\r\n        this.resourceInfoList = [];\r\n        return;\r\n      }\r\n\r\n      this.resourceInfoList = response.data.data.map((item) => ({\r\n        ...item,\r\n        isSelected: false,\r\n      }));\r\n\r\n      var directorySegments = toPath.startsWith(\"/\")\r\n        ? toPath.slice(1).split(\"/\")\r\n        : toPath.split(\"/\");\r\n\r\n      this.directories = directorySegments.filter(Boolean);\r\n    } catch (e) {\r\n      console.error(e);\r\n\r\n      Messager.error({ message: \"网络异常\" });\r\n    } finally {\r\n      this.loadingManager.completeLoading();\r\n    }\r\n  }\r\n\r\n  async deleteSelectResourceList() {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      this.loadingManager.startLoading();\r\n\r\n      const response = await httpRequest.post(\r\n        `${this.baseURL}/resource/delete-resource-list`,\r\n        { paths: this.selectResourceList.map((item) => item.path) }\r\n      );\r\n\r\n      if (response.data.code !== 200) {\r\n        Messager.error({ message: response.data.msg });\r\n        this.loadResourceInfoList();\r\n        return;\r\n      }\r\n\r\n      await this.loadResourceInfoList();\r\n    } catch (e) {\r\n      console.error(e);\r\n\r\n      Messager.error({ message: \"网络异常\" });\r\n    } finally {\r\n      this.loadingManager.completeLoading();\r\n    }\r\n  }\r\n\r\n  async getExistPathList(pathList: string[]) {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      this.loadingManager.startLoading();\r\n\r\n      const directoryPath = this.directories.length\r\n        ? `/${this.directories.join(\"/\")}`\r\n        : \"\";\r\n\r\n      return await httpRequest.post(\r\n        `${this.baseURL}/resource/get-exist-path-list`,\r\n        { pathList, directoryPath }\r\n      );\r\n    } catch (e) {\r\n      console.error(e);\r\n\r\n      Messager.error({ message: \"网络异常\" });\r\n\r\n      throw e;\r\n    } finally {\r\n      this.loadingManager.completeLoading();\r\n    }\r\n  }\r\n\r\n  async uploadResourceList(files: File[]) {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      this.loadingManager.startLoading();\r\n\r\n      var directory = this.directories.length\r\n        ? `/${this.directories.join(\"/\")}`\r\n        : \"\";\r\n\r\n      var formData = new FormData();\r\n      for (var i = 0; i < files.length; i++) {\r\n        formData.append(files[i].name, files[i]);\r\n      }\r\n      formData.append(\"directory\", directory);\r\n\r\n      const response = await httpRequest.post(\r\n        `${this.baseURL}/resource/update-resource-list`,\r\n        formData\r\n      );\r\n\r\n      if (response.data.code !== 200) {\r\n        Messager.error({ message: response.data.msg });\r\n        this.loadResourceInfoList();\r\n        return;\r\n      }\r\n\r\n      await this.loadResourceInfoList();\r\n    } catch (e) {\r\n      console.error(e);\r\n\r\n      Messager.error({ message: \"网络异常\" });\r\n    } finally {\r\n      this.loadingManager.completeLoading();\r\n    }\r\n  }\r\n\r\n  async downloadSelectResource() {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    const response = await httpRequest.post(\r\n      `${this.baseURL}/resource/get-download-resource-url`,\r\n      { filePath: this.selectResourceList[0].path }\r\n    );\r\n\r\n    if (response.data.code !== 200) {\r\n      Messager.error({ message: response.data.msg });\r\n      return;\r\n    }\r\n\r\n    var aElement = document.createElement(\"a\");\r\n    aElement.href = response.data.data;\r\n    aElement.target = \"_blank\";\r\n\r\n    aElement.click();\r\n  }\r\n\r\n  async editSelectFile() {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      this.loadingManager.startLoading();\r\n\r\n      var resourceInfo = this.selectResourceList[0];\r\n\r\n      const response = await httpRequest.post(\r\n        `${this.baseURL}/resource/get-text`,\r\n        {\r\n          path: resourceInfo.path,\r\n        }\r\n      );\r\n\r\n      this.isShowEditDialog = true;\r\n      this.currentEditText = response.data.data;\r\n    } finally {\r\n      this.loadingManager.completeLoading();\r\n    }\r\n  }\r\n\r\n  async saveEditFile() {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      this.loadingManager.startLoading();\r\n\r\n      var resourceInfo = this.selectResourceList[0];\r\n\r\n      const response = await httpRequest.post(\r\n        `${this.baseURL}/resource/set-text`,\r\n        {\r\n          path: resourceInfo.path,\r\n          content: this.currentEditText,\r\n        }\r\n      );\r\n\r\n      if (response.data.code !== 200) {\r\n        Messager.error({ message: response.data.msg });\r\n        return;\r\n      }\r\n\r\n      this.isShowEditDialog = false;\r\n      this.currentEditText = \"\";\r\n    } finally {\r\n      this.loadingManager.completeLoading();\r\n    }\r\n  }\r\n\r\n  clearAllSelect() {\r\n    for (var resourceInfo of this.selectResourceList) {\r\n      resourceInfo.isSelected = false;\r\n    }\r\n  }\r\n\r\n  handleSelectClick(event: MouseEvent, item: ResourceInfo) {\r\n    if (!event.ctrlKey) {\r\n      this.clearAllSelect();\r\n\r\n      item.isSelected = true;\r\n      return;\r\n    }\r\n\r\n    item.isSelected = !item.isSelected;\r\n  }\r\n}\r\n"],"names":["Disposable","LoadingManager","MSAppClient","Messager"],"mappings":"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"}
+{"version":3,"file":"ResourceManager.js","sources":["../../../../../src/components/business/resource-list/ResourceManager.ts"],"sourcesContent":["import { Disposable } from \"@maketribe/utils\";\r\nimport { MSAppClient } from \"../../../core\";\r\nimport { Dialoger, LoadingManager, Messager } from \"@maketribe/dm\";\r\nimport { R } from \"@maketribe/request\";\r\n\r\nexport type ResourceInfo = {\r\n  name: string;\r\n  path: string;\r\n  isDirectory: boolean;\r\n  extension: string;\r\n  length: string;\r\n  lastModified: string;\r\n  isSelected: boolean;\r\n};\r\n\r\nexport type ResourceManagerOptions = {\r\n  extensions?: string[];\r\n  baseURL: string;\r\n};\r\n\r\nexport class ResourceManager extends Disposable {\r\n  directories: string[];\r\n\r\n  resourceInfoList: ResourceInfo[];\r\n\r\n  loadingManager: LoadingManager;\r\n\r\n  isShowEditDialog: boolean = false;\r\n\r\n  currentEditText: string = \"\";\r\n\r\n  filterExtensions: string[] = [];\r\n\r\n  baseURL: string = \"\";\r\n\r\n  get selectResourceList() {\r\n    return this.resourceInfoList.filter((item) => item.isSelected);\r\n  }\r\n\r\n  get loading() {\r\n    return this.loadingManager.loading;\r\n  }\r\n\r\n  constructor(options: ResourceManagerOptions) {\r\n    super();\r\n\r\n    this.directories = [];\r\n\r\n    this.resourceInfoList = [];\r\n\r\n    this.loadingManager = new LoadingManager();\r\n\r\n    this.filterExtensions = options.extensions ?? [];\r\n    this.baseURL = options.baseURL;\r\n  }\r\n\r\n  async loadResourceInfoList(\r\n    toPath: string = this.directories.length\r\n      ? `/${this.directories.join(\"/\")}`\r\n      : \"\"\r\n  ) {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      this.loadingManager.startLoading();\r\n\r\n      const response = await httpRequest.post<R<ResourceInfo[]>>(\r\n        `${this.baseURL}/list`,\r\n        {\r\n          directoryPath: toPath,\r\n          extensions: this.filterExtensions,\r\n        }\r\n      );\r\n\r\n      if (response.data.code !== 200) {\r\n        Messager.error({ message: response.data.msg });\r\n        this.resourceInfoList = [];\r\n        return;\r\n      }\r\n\r\n      this.resourceInfoList = response.data.data.map((item) => ({\r\n        ...item,\r\n        isSelected: false,\r\n      }));\r\n\r\n      var directorySegments = toPath.startsWith(\"/\")\r\n        ? toPath.slice(1).split(\"/\")\r\n        : toPath.split(\"/\");\r\n\r\n      this.directories = directorySegments.filter(Boolean);\r\n    } catch (e) {\r\n      console.error(e);\r\n\r\n      Messager.error({ message: \"网络异常\" });\r\n    } finally {\r\n      this.loadingManager.completeLoading();\r\n    }\r\n  }\r\n\r\n  async deleteSelectResourceList() {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      this.loadingManager.startLoading();\r\n\r\n      const response = await httpRequest.post(`${this.baseURL}/delete`, {\r\n        paths: this.selectResourceList.map((item) => item.path),\r\n      });\r\n\r\n      if (response.data.code !== 200) {\r\n        Messager.error({ message: response.data.msg });\r\n        this.loadResourceInfoList();\r\n        return;\r\n      }\r\n\r\n      await this.loadResourceInfoList();\r\n    } catch (e) {\r\n      console.error(e);\r\n\r\n      Messager.error({ message: \"网络异常\" });\r\n    } finally {\r\n      this.loadingManager.completeLoading();\r\n    }\r\n  }\r\n  // 暂不做调整\r\n  async getExistPathList(pathList: string[]) {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      this.loadingManager.startLoading();\r\n\r\n      const directoryPath = this.directories.length\r\n        ? `/${this.directories.join(\"/\")}`\r\n        : \"\";\r\n\r\n      return await httpRequest.post(`${this.baseURL}/exist-path-list`, {\r\n        pathList,\r\n        directoryPath,\r\n      });\r\n    } catch (e) {\r\n      console.error(e);\r\n\r\n      Messager.error({ message: \"网络异常\" });\r\n\r\n      throw e;\r\n    } finally {\r\n      this.loadingManager.completeLoading();\r\n    }\r\n  }\r\n\r\n  async uploadResourceList(files: File[]) {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      this.loadingManager.startLoading();\r\n\r\n      var directory = this.directories.length\r\n        ? `/${this.directories.join(\"/\")}`\r\n        : \"\";\r\n\r\n      var formData = new FormData();\r\n      for (var i = 0; i < files.length; i++) {\r\n        formData.append(files[i].name, files[i]);\r\n      }\r\n      formData.append(\"directory\", directory);\r\n\r\n      const response = await httpRequest.post(`${this.baseURL}/save`, formData);\r\n\r\n      if (response.data.code !== 200) {\r\n        Messager.error({ message: response.data.msg });\r\n        this.loadResourceInfoList();\r\n        return;\r\n      }\r\n\r\n      await this.loadResourceInfoList();\r\n    } catch (e) {\r\n      console.error(e);\r\n\r\n      Messager.error({ message: \"网络异常\" });\r\n    } finally {\r\n      this.loadingManager.completeLoading();\r\n    }\r\n  }\r\n\r\n  async downloadSelectResource() {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      const response = await httpRequest.post<Blob>(\r\n        `${this.baseURL}/download`,\r\n        {\r\n          path: this.selectResourceList[0].path,\r\n        },\r\n        { responseType: \"blob\" }\r\n      );\r\n\r\n      const url = URL.createObjectURL(response.data);\r\n\r\n      var aElement = document.createElement(\"a\");\r\n      aElement.href = url;\r\n      aElement.target = \"_blank\";\r\n      aElement.download = this.selectResourceList[0].name;\r\n\r\n      aElement.click();\r\n\r\n      URL.revokeObjectURL(url);\r\n    } catch (e) {\r\n      console.error(e);\r\n\r\n      Messager.error({ message: \"网络异常\" });\r\n    }\r\n  }\r\n\r\n  async editSelectFile() {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      this.loadingManager.startLoading();\r\n\r\n      var resourceInfo = this.selectResourceList[0];\r\n\r\n      const response = await httpRequest.post(`${this.baseURL}/text/read`, {\r\n        path: resourceInfo.path,\r\n      });\r\n\r\n      this.isShowEditDialog = true;\r\n      this.currentEditText = response.data.data;\r\n    } finally {\r\n      this.loadingManager.completeLoading();\r\n    }\r\n  }\r\n\r\n  async saveEditFile() {\r\n    const httpRequest = MSAppClient.instance!.httpRequest;\r\n\r\n    try {\r\n      this.loadingManager.startLoading();\r\n\r\n      var resourceInfo = this.selectResourceList[0];\r\n\r\n      const response = await httpRequest.post(`${this.baseURL}/text/write`, {\r\n        path: resourceInfo.path,\r\n        content: this.currentEditText,\r\n      });\r\n\r\n      if (response.data.code !== 200) {\r\n        Messager.error({ message: response.data.msg });\r\n        return;\r\n      }\r\n\r\n      await this.loadResourceInfoList();\r\n\r\n      this.isShowEditDialog = false;\r\n      this.currentEditText = \"\";\r\n    } finally {\r\n      this.loadingManager.completeLoading();\r\n    }\r\n  }\r\n\r\n  clearAllSelect() {\r\n    for (var resourceInfo of this.selectResourceList) {\r\n      resourceInfo.isSelected = false;\r\n    }\r\n  }\r\n\r\n  handleSelectClick(event: MouseEvent, item: ResourceInfo) {\r\n    if (!event.ctrlKey) {\r\n      this.clearAllSelect();\r\n\r\n      item.isSelected = true;\r\n      return;\r\n    }\r\n\r\n    item.isSelected = !item.isSelected;\r\n  }\r\n}\r\n"],"names":["Disposable","LoadingManager","MSAppClient","Messager"],"mappings":"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"}

package/dist/cjs/components/business/resource-list/components/resource-item/index.vue.js

@@ -27,6 +27,10 @@ const _hoisted_1 = { class: "resource-item__wrapper" };
 const _hoisted_2 = { class: "resource-item__main" };
 const _hoisted_3 = { class: "resource-item__label" };
 const _hoisted_4 = ["title"];
+const _hoisted_5 = { class: "resource-item__time" };
+const _hoisted_6 = { class: "resource-item__size" };
+const _hoisted_7 = { key: 0 };
+const _hoisted_8 = { key: 1 };
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "index",
   props: {
@@ -67,6 +71,12 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             vue.createElementVNode("span", {
               title: __props.resourceItem.name
             }, vue.toDisplayString(__props.resourceItem.name), 9, _hoisted_4)
+          ]),
+          vue.createElementVNode("div", _hoisted_5, [
+            vue.createElementVNode("span", null, vue.toDisplayString(__props.resourceItem.lastModified), 1)
+          ]),
+          vue.createElementVNode("div", _hoisted_6, [
+            __props.resourceItem.isDirectory ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_7, " - ")) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_8, vue.toDisplayString(__props.resourceItem.length > 1024 ? __props.resourceItem.length > 1024 * 1024 ? Math.ceil(__props.resourceItem.length / 1024 / 1024 * 100) / 100 + " MB" : Math.ceil(__props.resourceItem.length / 1024 * 100) / 100 + " KB" : __props.resourceItem.length + " 字节"), 1))
           ])
         ])
       ], 2);

package/dist/cjs/components/business/resource-list/components/resource-item/index.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/business/resource-list/components/resource-item/index.vue"],"sourcesContent":["<template>\r\n  <div :class=\"['resource-item', resourceItem.isSelected ? 'is-selected' : '']\">\r\n    <div class=\"resource-item__wrapper\">\r\n      <div class=\"resource-item__main\">\r\n        <MKSvgIcon :icon-class=\"iconClass\" />\r\n      </div>\r\n      <div class=\"resource-item__label\">\r\n        <span :title=\"resourceItem.name\">{{ resourceItem.name }}</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { computed } from \"vue\";\r\nimport { MKSvgIcon } from \"../../../../basic\";\r\n\r\nconst props = defineProps({\r\n  resourceItem: {\r\n    type: Object,\r\n    required: true,\r\n  },\r\n});\r\n\r\nconst iconClass = computed(() => {\r\n  if (props.resourceItem.isDirectory) {\r\n    return \"wenjianjia\";\r\n  }\r\n\r\n  switch (props.resourceItem.extension) {\r\n    case \".html\":\r\n      return \"html\";\r\n    case \".jpeg\":\r\n    case \".jpg\":\r\n    case \".png\":\r\n      return \"image1\";\r\n    case \".pdf\":\r\n      return \"pdf\";\r\n    case \".dll\":\r\n      return \"dll\";\r\n  }\r\n\r\n  return \"weizhiwenjian\";\r\n});\r\n</script>\r\n"],"names":["computed"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,UAAM,QAAQ;AAOR,UAAA,YAAYA,IAAAA,SAAS,MAAM;AAC3B,UAAA,MAAM,aAAa,aAAa;AAC3B,eAAA;AAAA,MACT;AAEQ,cAAA,MAAM,aAAa,WAAW;AAAA,QACpC,KAAK;AACI,iBAAA;AAAA,QACT,KAAK;AAAA,QACL,KAAK;AAAA,QACL,KAAK;AACI,iBAAA;AAAA,QACT,KAAK;AACI,iBAAA;AAAA,QACT,KAAK;AACI,iBAAA;AAAA,MACX;AAEO,aAAA;AAAA,IAAA,CACR;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/business/resource-list/components/resource-item/index.vue"],"sourcesContent":["<template>\r\n  <div :class=\"['resource-item', resourceItem.isSelected ? 'is-selected' : '']\">\r\n    <div class=\"resource-item__wrapper\">\r\n      <div class=\"resource-item__main\">\r\n        <MKSvgIcon :icon-class=\"iconClass\" />\r\n      </div>\r\n      <div class=\"resource-item__label\">\r\n        <span :title=\"resourceItem.name\">{{ resourceItem.name }}</span>\r\n      </div>\r\n      <div class=\"resource-item__time\">\r\n        <span>{{ resourceItem.lastModified }}</span>\r\n      </div>\r\n      <div class=\"resource-item__size\">\r\n        <span v-if=\"resourceItem.isDirectory\"> - </span>\r\n        <span v-else> {{ resourceItem.length > 1024 ?\r\n          (resourceItem.length > 1024*1024 ? Math.ceil(resourceItem.length/1024/1024*100)/100+\" MB\":Math.ceil(resourceItem.length/1024*100)/100+\" KB\") \r\n           : resourceItem.length+\" 字节\" }}</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { computed } from \"vue\";\r\nimport { MKSvgIcon } from \"../../../../basic\";\r\n\r\nconst props = defineProps({\r\n  resourceItem: {\r\n    type: Object,\r\n    required: true,\r\n  },\r\n});\r\n\r\nconst iconClass = computed(() => {\r\n  if (props.resourceItem.isDirectory) {\r\n    return \"wenjianjia\";\r\n  }\r\n\r\n  switch (props.resourceItem.extension) {\r\n    case \".html\":\r\n      return \"html\";\r\n    case \".jpeg\":\r\n    case \".jpg\":\r\n    case \".png\":\r\n      return \"image1\";\r\n    case \".pdf\":\r\n      return \"pdf\";\r\n    case \".dll\":\r\n      return \"dll\";\r\n  }\r\n\r\n  return \"weizhiwenjian\";\r\n});\r\n</script>\r\n"],"names":["computed"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,UAAM,QAAQ;AAOR,UAAA,YAAYA,IAAAA,SAAS,MAAM;AAC3B,UAAA,MAAM,aAAa,aAAa;AAC3B,eAAA;AAAA,MACT;AAEQ,cAAA,MAAM,aAAa,WAAW;AAAA,QACpC,KAAK;AACI,iBAAA;AAAA,QACT,KAAK;AAAA,QACL,KAAK;AAAA,QACL,KAAK;AACI,iBAAA;AAAA,QACT,KAAK;AACI,iBAAA;AAAA,QACT,KAAK;AACI,iBAAA;AAAA,MACX;AAEO,aAAA;AAAA,IAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/components/business/resource-list/resource-list.vue.js

@@ -5,8 +5,9 @@ const ResourceManager = require("./ResourceManager.js");
 const index_vue_vue_type_script_setup_true_lang = require("./components/resource-item/index.vue.js");
 const _hoisted_1 = { class: "resource-list-header" };
 const _hoisted_2 = ["onClick"];
-const _hoisted_3 = { class: "resource-list-list" };
-const _hoisted_4 = ["onClick", "onDblclick"];
+const _hoisted_3 = { class: "resource-list-mode" };
+const _hoisted_4 = { class: "resource-list-list" };
+const _hoisted_5 = ["onClick", "onDblclick"];
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "resource-list",
   props: {
@@ -18,6 +19,16 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   emits: ["drop"],
   setup(__props, { emit: __emit }) {
     const props = __props;
+    const sortMethodName = vue.ref("time");
+    const resourceInfoList = vue.computed(() => {
+      if (sortMethodName.value == "name") {
+        return [
+          ...props.resourceManager.resourceInfoList.filter((item) => item.isDirectory).sort((a, b) => a.name > b.name ? 1 : -1),
+          ...props.resourceManager.resourceInfoList.filter((item) => !item.isDirectory).sort((a, b) => a.name > b.name ? 1 : -1)
+        ];
+      }
+      return props.resourceManager.resourceInfoList.sort((a, b) => a.lastModified < b.lastModified ? 1 : -1);
+    });
     const emit = __emit;
     const listMode = vue.ref("row");
     const handleBreadcrumbClick = (index) => {
@@ -51,6 +62,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       const _component_MKSvgIcon = vue.resolveComponent("MKSvgIcon");
       const _component_ElBreadcrumbItem = vue.resolveComponent("ElBreadcrumbItem");
       const _component_ElBreadcrumb = vue.resolveComponent("ElBreadcrumb");
+      const _component_el_button = vue.resolveComponent("el-button");
       return vue.openBlock(), vue.createElementBlock("div", {
         class: vue.normalizeClass(["resource-list", { row: listMode.value == "row" }])
       }, [
@@ -91,30 +103,44 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             ]),
             _: 1
           }),
-          vue.createElementVNode("div", {
-            class: "resource-list-mode",
-            onClick: _cache[2] || (_cache[2] = ($event) => listMode.value = listMode.value == "row" ? "col" : "row")
-          }, [
-            listMode.value == "row" ? (vue.openBlock(), vue.createBlock(_component_MKSvgIcon, {
-              key: 0,
-              iconClass: "Grid"
-            })) : (vue.openBlock(), vue.createBlock(_component_MKSvgIcon, {
-              key: 1,
-              iconClass: "Fold"
-            }))
+          vue.createElementVNode("div", _hoisted_3, [
+            vue.createVNode(_component_el_button, {
+              text: "",
+              onClick: _cache[2] || (_cache[2] = ($event) => sortMethodName.value = sortMethodName.value == "time" ? "name" : "time")
+            }, {
+              default: vue.withCtx(() => [
+                vue.createTextVNode(vue.toDisplayString(sortMethodName.value == "name" ? "按照时间排序" : "按照文件名排序"), 1)
+              ]),
+              _: 1
+            }),
+            vue.createVNode(_component_el_button, {
+              text: "",
+              onClick: _cache[3] || (_cache[3] = ($event) => listMode.value = listMode.value == "row" ? "col" : "row")
+            }, {
+              default: vue.withCtx(() => [
+                listMode.value == "row" ? (vue.openBlock(), vue.createBlock(_component_MKSvgIcon, {
+                  key: 0,
+                  iconClass: "Grid"
+                })) : (vue.openBlock(), vue.createBlock(_component_MKSvgIcon, {
+                  key: 1,
+                  iconClass: "Fold"
+                }))
+              ]),
+              _: 1
+            })
           ])
         ]),
         vue.createElementVNode("div", {
           class: "resource-list-main",
           onClick: handleMainClick,
-          onDragover: _cache[3] || (_cache[3] = vue.withModifiers(() => {
+          onDragover: _cache[4] || (_cache[4] = vue.withModifiers(() => {
           }, ["prevent"])),
           onDrop: vue.withModifiers(handleDrop, ["prevent"])
         }, [
           vue.createVNode(vue.unref(elementPlus.ElScrollbar), { height: "100%" }, {
             default: vue.withCtx(() => [
-              vue.createElementVNode("div", _hoisted_3, [
-                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.resourceManager.resourceInfoList, (item) => {
+              vue.createElementVNode("div", _hoisted_4, [
+                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(resourceInfoList.value, (item) => {
                   return vue.openBlock(), vue.createElementBlock("div", {
                     class: "resource-list__item",
                     onClick: vue.withModifiers(($event) => handleClick($event, item), ["stop"]),
@@ -124,7 +150,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                       key: item.path,
                       resourceItem: item
                     }, null, 8, ["resourceItem"]))
-                  ], 40, _hoisted_4);
+                  ], 40, _hoisted_5);
                 }), 256))
               ])
             ]),