@cmstops/pro-compo 0.1.42 → 0.1.44

package/es/editMetaInfo/component.js

@@ -1,9 +1,9 @@
 import { defineComponent, ref, openBlock, createElementBlock, createVNode, unref, withCtx, createElementVNode } from "vue";
-import { Modal, Scrollbar } from "@arco-design/web-vue";
+import { Modal, Spin, Scrollbar } from "@arco-design/web-vue";
 import { getDocDetailsNew } from "./script/api.js";
-import _sfc_main$1 from "./components/metaInfoForm.js";
 import useDialogVisible from "../hooks/dialogVisible.js";
 import { DEFAULT_BASE_API } from "../config.js";
+import _sfc_main$1 from "./components/metaInfoForm.js";
 const _hoisted_1 = { class: "edit-meta-info-container" };
 const _hoisted_2 = { style: { "padding": "20px" } };
 const _sfc_main = defineComponent({
@@ -19,14 +19,17 @@ const _sfc_main = defineComponent({
     const emit = __emit;
     const props = __props;
     const metaInfoFormRef = ref();
+    const isLoading = ref(false);
     const editorDataPubInfo = ref(null);
     const BASE_API = props.BASE_API || DEFAULT_BASE_API;
     const handleOpen = async () => {
       if (props.hashId) {
+        isLoading.value = true;
         const { code, message } = await getDocDetailsNew(BASE_API, {
           hashid: props.hashId
         });
         if (code === 0) {
+          isLoading.value = false;
           editorDataPubInfo.value = {
             id: message.id,
             title: message.title,
@@ -62,23 +65,31 @@ const _sfc_main = defineComponent({
           onCancel: handleCancel
         }, {
           default: withCtx(() => [
-            createVNode(unref(Scrollbar), {
-              "outer-style": "height: 60vh; overflow: auto",
-              style: { "height": "100%", "overflow": "auto" }
+            createVNode(unref(Spin), {
+              loading: isLoading.value,
+              style: { "width": "100%" }
             }, {
               default: withCtx(() => [
-                createElementVNode("div", _hoisted_2, [
-                  createVNode(_sfc_main$1, {
-                    ref_key: "metaInfoFormRef",
-                    ref: metaInfoFormRef,
-                    BASE_API: unref(BASE_API),
-                    "init-data": editorDataPubInfo.value,
-                    onUpload: _cache[0] || (_cache[0] = (e) => _ctx.$emit("upload", e))
-                  }, null, 8, ["BASE_API", "init-data"])
-                ])
+                createVNode(unref(Scrollbar), {
+                  "outer-style": "height: 60vh; overflow: auto",
+                  style: { "height": "100%", "overflow": "auto" }
+                }, {
+                  default: withCtx(() => [
+                    createElementVNode("div", _hoisted_2, [
+                      createVNode(_sfc_main$1, {
+                        ref_key: "metaInfoFormRef",
+                        ref: metaInfoFormRef,
+                        BASE_API: unref(BASE_API),
+                        "init-data": editorDataPubInfo.value,
+                        onUpload: _cache[0] || (_cache[0] = (e) => _ctx.$emit("upload", e))
+                      }, null, 8, ["BASE_API", "init-data"])
+                    ])
+                  ]),
+                  _: 1
+                })
               ]),
               _: 1
-            })
+            }, 8, ["loading"])
           ]),
           _: 1
         }, 8, ["visible"])

package/es/imageCrop/component.js

@@ -1,5 +1,5 @@
-import { defineComponent, ref, watch, resolveDirective, openBlock, createBlock, unref, withCtx, createTextVNode, toDisplayString, createElementVNode, createVNode, withDirectives, vShow, createElementBlock, normalizeClass, createCommentVNode, Fragment, renderList } from "vue";
-import { Modal, Tooltip, Button, Space } from "@arco-design/web-vue";
+import { defineComponent, ref, watch, onBeforeUnmount, openBlock, createBlock, unref, withCtx, createTextVNode, toDisplayString, createElementVNode, createVNode, withDirectives, vShow, normalizeClass, createElementBlock, createCommentVNode, Fragment, renderList } from "vue";
+import { Modal, Tooltip, Button, Space, Spin } from "@arco-design/web-vue";
 import { IconZoomIn, IconZoomOut, IconRotateLeft, IconRotateRight, IconSync } from "@arco-design/web-vue/es/icon";
 import Cropper from "cropperjs";
 import ColorThief from "colorthief";
@@ -10,22 +10,21 @@ import { DEFAULT_BASE_API } from "../config.js";
 import { replaceSuffix } from "../utils/index.js";
 import { getFileRealUrl } from "./script/api.js";
 import { useGenerateAssets } from "../hooks/assets.js";
-const _hoisted_1 = { class: "image-cropper" };
-const _hoisted_2 = { class: "edit-cropper" };
-const _hoisted_3 = ["src"];
-const _hoisted_4 = {
+const _hoisted_1 = { class: "edit-cropper" };
+const _hoisted_2 = ["src"];
+const _hoisted_3 = {
   key: 0,
   class: "tool"
 };
-const _hoisted_5 = ["onClick"];
-const _hoisted_6 = {
+const _hoisted_4 = ["onClick"];
+const _hoisted_5 = {
   key: 1,
   class: "tool"
 };
-const _hoisted_7 = ["onClick"];
-const _hoisted_8 = { class: "image-crop-modal-footer" };
-const _hoisted_9 = { class: "left" };
-const _hoisted_10 = { class: "right" };
+const _hoisted_6 = ["onClick"];
+const _hoisted_7 = { class: "image-crop-modal-footer" };
+const _hoisted_8 = { class: "left" };
+const _hoisted_9 = { class: "right" };
 const _sfc_main = defineComponent({
   __name: "component",
   props: {
@@ -64,6 +63,13 @@ const _sfc_main = defineComponent({
     const cropperIndex = ref(0);
     const selectedData = ref([]);
     const loadImage = () => {
+      const cropperImg = document.getElementById("cropper_img");
+      const editCropper = document.querySelector(".edit-cropper");
+      cropperImg.classList.remove("position");
+      if (cropperImg && editCropper) {
+        editCropper.style.width = `${cropperImg.offsetWidth}px`;
+        editCropper.style.height = `${cropperImg.offsetHeight}px`;
+      }
     };
     const getBase64 = (imgUrl) => {
       window.URL = window.URL || window.webkitURL;
@@ -304,8 +310,10 @@ const _sfc_main = defineComponent({
       }
       getMediaRealUrl();
     };
+    onBeforeUnmount(() => {
+      cropperDestroy();
+    });
     return (_ctx, _cache) => {
-      const _directive_loading = resolveDirective("loading");
       return openBlock(), createBlock(unref(Modal), {
         visible: _ctx.visible,
         width: "986px",
@@ -313,14 +321,15 @@ const _sfc_main = defineComponent({
         "title-align": "center",
         "unmount-on-close": "",
         "modal-class": "image-crop-modal-wrapper",
-        "body-class": "image-crop-modal-body"
+        "body-class": "image-crop-modal-body",
+        onCancel: _cache[4] || (_cache[4] = ($event) => setVisible(false))
       }, {
         title: withCtx(() => [
           createTextVNode(toDisplayString(_ctx.aspectRatioProp ? "\u88C1\u526A\u56FE\u7247" : "\u8BF7\u9009\u62E9\u88C1\u526A\u6BD4\u4F8B"), 1)
         ]),
         footer: withCtx(() => [
-          createElementVNode("span", _hoisted_8, [
-            createElementVNode("div", _hoisted_9, [
+          createElementVNode("span", _hoisted_7, [
+            createElementVNode("div", _hoisted_8, [
               createVNode(unref(Tooltip), { content: "\u653E\u5927" }, {
                 default: withCtx(() => [
                   createVNode(unref(Button), {
@@ -397,7 +406,7 @@ const _sfc_main = defineComponent({
                 _: 1
               })
             ]),
-            createElementVNode("div", _hoisted_10, [
+            createElementVNode("div", _hoisted_9, [
               createVNode(unref(Space), null, {
                 default: withCtx(() => [
                   createVNode(unref(Button), {
@@ -429,47 +438,52 @@ const _sfc_main = defineComponent({
           ])
         ]),
         default: withCtx(() => [
-          createElementVNode("div", _hoisted_1, [
-            withDirectives((openBlock(), createElementBlock("div", {
-              class: normalizeClass(["edit", {
-                fullHeight: _ctx.aspectRatioProp && !Array.isArray(_ctx.aspectRatioProp)
-              }])
-            }, [
-              createElementVNode("div", _hoisted_2, [
-                editImage.value ? (openBlock(), createElementBlock("img", {
-                  key: 0,
-                  id: "cropper_img",
-                  class: "position",
-                  crossorigin: "anonymous",
-                  src: editImage.value,
-                  onLoad: loadImage
-                }, null, 40, _hoisted_3)) : createCommentVNode("v-if", true)
-              ])
-            ], 2)), [
-              [_directive_loading, croppering.value]
+          createVNode(unref(Spin), {
+            loading: croppering.value,
+            class: "image-cropper",
+            style: { "width": "100%" }
+          }, {
+            default: withCtx(() => [
+              createElementVNode("div", {
+                class: normalizeClass(["edit", {
+                  fullHeight: _ctx.aspectRatioProp && !Array.isArray(_ctx.aspectRatioProp)
+                }])
+              }, [
+                createElementVNode("div", _hoisted_1, [
+                  editImage.value ? (openBlock(), createElementBlock("img", {
+                    key: 0,
+                    id: "cropper_img",
+                    class: "position",
+                    crossorigin: "anonymous",
+                    src: editImage.value,
+                    onLoad: loadImage
+                  }, null, 40, _hoisted_2)) : createCommentVNode("v-if", true)
+                ])
+              ], 2),
+              !_ctx.aspectRatioProp ? (openBlock(), createElementBlock("div", _hoisted_3, [
+                (openBlock(), createElementBlock(Fragment, null, renderList(aspectRatioList, (item, i) => {
+                  return createElementVNode("div", {
+                    key: item.lable,
+                    class: normalizeClass(["btn btn" + (i + 1), { active: aspectRatioActive.value === i }]),
+                    onClick: ($event) => cropper(item.value, i)
+                  }, toDisplayString(item.label), 11, _hoisted_4);
+                }), 64))
+              ])) : createCommentVNode("v-if", true),
+              _ctx.aspectRatioProp && Array.isArray(_ctx.aspectRatioProp) && customizedAspectRatioList.value.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_5, [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(customizedAspectRatioList.value, (item, i) => {
+                  return openBlock(), createElementBlock("div", {
+                    key: item.lable,
+                    class: normalizeClass([
+                      "btn btn" + (item.buttonIndex + 1),
+                      { active: aspectRatioActive.value === i }
+                    ]),
+                    onClick: ($event) => cropper(item.value, i)
+                  }, toDisplayString(item.label), 11, _hoisted_6);
+                }), 128))
+              ])) : createCommentVNode("v-if", true)
             ]),
-            !_ctx.aspectRatioProp ? (openBlock(), createElementBlock("div", _hoisted_4, [
-              (openBlock(), createElementBlock(Fragment, null, renderList(aspectRatioList, (item, i) => {
-                return createElementVNode("div", {
-                  key: item.lable,
-                  class: normalizeClass(["btn btn" + (i + 1), { active: aspectRatioActive.value === i }]),
-                  onClick: ($event) => cropper(item.value, i)
-                }, toDisplayString(item.label), 11, _hoisted_5);
-              }), 64))
-            ])) : createCommentVNode("v-if", true),
-            _ctx.aspectRatioProp && Array.isArray(_ctx.aspectRatioProp) && customizedAspectRatioList.value.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_6, [
-              (openBlock(true), createElementBlock(Fragment, null, renderList(customizedAspectRatioList.value, (item, i) => {
-                return openBlock(), createElementBlock("div", {
-                  key: item.lable,
-                  class: normalizeClass([
-                    "btn btn" + (item.buttonIndex + 1),
-                    { active: aspectRatioActive.value === i }
-                  ]),
-                  onClick: ($event) => cropper(item.value, i)
-                }, toDisplayString(item.label), 11, _hoisted_7);
-              }), 128))
-            ])) : createCommentVNode("v-if", true)
-          ])
+            _: 1
+          }, 8, ["loading"])
         ]),
         _: 1
       }, 8, ["visible"]);

package/es/resourceModal/component.js

@@ -60,7 +60,7 @@ const _sfc_main = defineComponent({
         onCancel: handleCancel
       }, {
         title: withCtx(() => [
-          createTextVNode("\u9009\u62E9\u5C01\u9762\u6765\u6E90")
+          createTextVNode("\u9009\u62E9\u7D20\u6750\u6765\u6E90")
         ]),
         default: withCtx(() => [
           createVNode(_sfc_main$1, {

package/es/selectThumb/component.js

@@ -1,5 +1,6 @@
 import { defineComponent, ref, provide, computed, watch, openBlock, createElementBlock, createTextVNode, toDisplayString, createCommentVNode, Fragment, renderList, createBlock, createVNode, unref, withCtx, createElementVNode, withDirectives, vShow } from "vue";
 import { RadioGroup, Radio, Switch } from "@arco-design/web-vue";
+import { nextTick } from "process";
 import { docThumbObjMap, docThumbArrMap, docThumbRatioMap } from "../utils/doc.js";
 import _sfc_main$3 from "../resourceModal/component.js";
 import _sfc_main$4 from "../imageCrop/component.js";
@@ -81,6 +82,16 @@ const _sfc_main = defineComponent({
         callback(styleData.value);
       }
     });
+    const refreshCrop = ref(true);
+    watch(
+      () => dialogCropperShow.value,
+      (n) => {
+        if (n)
+          return;
+        refreshCrop.value = false;
+        nextTick(() => refreshCrop.value = true);
+      }
+    );
     const loadData = (value) => {
       let data = null;
       if (!value) {
@@ -414,7 +425,8 @@ const _sfc_main = defineComponent({
           onSubmit: submitCallback,
           onUpload: _cache[3] || (_cache[3] = (cb) => _ctx.$emit("upload", cb))
         }, null, 8, ["dialogVisible", "ai_static_covers", "BASE_API"]),
-        createVNode(_sfc_main$4, {
+        refreshCrop.value ? (openBlock(), createBlock(_sfc_main$4, {
+          key: 3,
           visible: dialogCropperShow.value,
           "onUpdate:visible": _cache[4] || (_cache[4] = ($event) => dialogCropperShow.value = $event),
           "aspect-ratio-prop": aspectRatioProp.value,
@@ -422,7 +434,7 @@ const _sfc_main = defineComponent({
           "corp-data": cropperData.value,
           "generate-assets": false,
           onConfirm: cropConfirm
-        }, null, 8, ["visible", "aspect-ratio-prop", "BASE_API", "corp-data"])
+        }, null, 8, ["visible", "aspect-ratio-prop", "BASE_API", "corp-data"])) : createCommentVNode("v-if", true)
       ]);
     };
   }

package/lib/editMetaInfo/component.js

@@ -2,9 +2,9 @@
 var vue = require("vue");
 var webVue = require("@arco-design/web-vue");
 var api = require("./script/api.js");
-var metaInfoForm = require("./components/metaInfoForm.js");
 var dialogVisible = require("../hooks/dialogVisible.js");
 var config = require("../config.js");
+var metaInfoForm = require("./components/metaInfoForm.js");
 const _hoisted_1 = { class: "edit-meta-info-container" };
 const _hoisted_2 = { style: { "padding": "20px" } };
 const _sfc_main = vue.defineComponent({
@@ -20,14 +20,17 @@ const _sfc_main = vue.defineComponent({
     const emit = __emit;
     const props = __props;
     const metaInfoFormRef = vue.ref();
+    const isLoading = vue.ref(false);
     const editorDataPubInfo = vue.ref(null);
     const BASE_API = props.BASE_API || config.DEFAULT_BASE_API;
     const handleOpen = async () => {
       if (props.hashId) {
+        isLoading.value = true;
         const { code, message } = await api.getDocDetailsNew(BASE_API, {
           hashid: props.hashId
         });
         if (code === 0) {
+          isLoading.value = false;
           editorDataPubInfo.value = {
             id: message.id,
             title: message.title,
@@ -63,23 +66,31 @@ const _sfc_main = vue.defineComponent({
           onCancel: handleCancel
         }, {
           default: vue.withCtx(() => [
-            vue.createVNode(vue.unref(webVue.Scrollbar), {
-              "outer-style": "height: 60vh; overflow: auto",
-              style: { "height": "100%", "overflow": "auto" }
+            vue.createVNode(vue.unref(webVue.Spin), {
+              loading: isLoading.value,
+              style: { "width": "100%" }
             }, {
               default: vue.withCtx(() => [
-                vue.createElementVNode("div", _hoisted_2, [
-                  vue.createVNode(metaInfoForm, {
-                    ref_key: "metaInfoFormRef",
-                    ref: metaInfoFormRef,
-                    BASE_API: vue.unref(BASE_API),
-                    "init-data": editorDataPubInfo.value,
-                    onUpload: _cache[0] || (_cache[0] = (e) => _ctx.$emit("upload", e))
-                  }, null, 8, ["BASE_API", "init-data"])
-                ])
+                vue.createVNode(vue.unref(webVue.Scrollbar), {
+                  "outer-style": "height: 60vh; overflow: auto",
+                  style: { "height": "100%", "overflow": "auto" }
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.createElementVNode("div", _hoisted_2, [
+                      vue.createVNode(metaInfoForm, {
+                        ref_key: "metaInfoFormRef",
+                        ref: metaInfoFormRef,
+                        BASE_API: vue.unref(BASE_API),
+                        "init-data": editorDataPubInfo.value,
+                        onUpload: _cache[0] || (_cache[0] = (e) => _ctx.$emit("upload", e))
+                      }, null, 8, ["BASE_API", "init-data"])
+                    ])
+                  ]),
+                  _: 1
+                })
               ]),
               _: 1
-            })
+            }, 8, ["loading"])
           ]),
           _: 1
         }, 8, ["visible"])

package/lib/imageCrop/component.js

@@ -17,22 +17,21 @@ function _interopDefaultLegacy(e) {
 var Cropper__default = /* @__PURE__ */ _interopDefaultLegacy(Cropper);
 var ColorThief__default = /* @__PURE__ */ _interopDefaultLegacy(ColorThief);
 var GIF__default = /* @__PURE__ */ _interopDefaultLegacy(GIF);
-const _hoisted_1 = { class: "image-cropper" };
-const _hoisted_2 = { class: "edit-cropper" };
-const _hoisted_3 = ["src"];
-const _hoisted_4 = {
+const _hoisted_1 = { class: "edit-cropper" };
+const _hoisted_2 = ["src"];
+const _hoisted_3 = {
   key: 0,
   class: "tool"
 };
-const _hoisted_5 = ["onClick"];
-const _hoisted_6 = {
+const _hoisted_4 = ["onClick"];
+const _hoisted_5 = {
   key: 1,
   class: "tool"
 };
-const _hoisted_7 = ["onClick"];
-const _hoisted_8 = { class: "image-crop-modal-footer" };
-const _hoisted_9 = { class: "left" };
-const _hoisted_10 = { class: "right" };
+const _hoisted_6 = ["onClick"];
+const _hoisted_7 = { class: "image-crop-modal-footer" };
+const _hoisted_8 = { class: "left" };
+const _hoisted_9 = { class: "right" };
 const _sfc_main = vue.defineComponent({
   __name: "component",
   props: {
@@ -71,6 +70,13 @@ const _sfc_main = vue.defineComponent({
     const cropperIndex = vue.ref(0);
     const selectedData = vue.ref([]);
     const loadImage = () => {
+      const cropperImg = document.getElementById("cropper_img");
+      const editCropper = document.querySelector(".edit-cropper");
+      cropperImg.classList.remove("position");
+      if (cropperImg && editCropper) {
+        editCropper.style.width = `${cropperImg.offsetWidth}px`;
+        editCropper.style.height = `${cropperImg.offsetHeight}px`;
+      }
     };
     const getBase64 = (imgUrl) => {
       window.URL = window.URL || window.webkitURL;
@@ -311,8 +317,10 @@ const _sfc_main = vue.defineComponent({
       }
       getMediaRealUrl();
     };
+    vue.onBeforeUnmount(() => {
+      cropperDestroy();
+    });
     return (_ctx, _cache) => {
-      const _directive_loading = vue.resolveDirective("loading");
       return vue.openBlock(), vue.createBlock(vue.unref(webVue.Modal), {
         visible: _ctx.visible,
         width: "986px",
@@ -320,14 +328,15 @@ const _sfc_main = vue.defineComponent({
         "title-align": "center",
         "unmount-on-close": "",
         "modal-class": "image-crop-modal-wrapper",
-        "body-class": "image-crop-modal-body"
+        "body-class": "image-crop-modal-body",
+        onCancel: _cache[4] || (_cache[4] = ($event) => setVisible(false))
       }, {
         title: vue.withCtx(() => [
           vue.createTextVNode(vue.toDisplayString(_ctx.aspectRatioProp ? "\u88C1\u526A\u56FE\u7247" : "\u8BF7\u9009\u62E9\u88C1\u526A\u6BD4\u4F8B"), 1)
         ]),
         footer: vue.withCtx(() => [
-          vue.createElementVNode("span", _hoisted_8, [
-            vue.createElementVNode("div", _hoisted_9, [
+          vue.createElementVNode("span", _hoisted_7, [
+            vue.createElementVNode("div", _hoisted_8, [
               vue.createVNode(vue.unref(webVue.Tooltip), { content: "\u653E\u5927" }, {
                 default: vue.withCtx(() => [
                   vue.createVNode(vue.unref(webVue.Button), {
@@ -404,7 +413,7 @@ const _sfc_main = vue.defineComponent({
                 _: 1
               })
             ]),
-            vue.createElementVNode("div", _hoisted_10, [
+            vue.createElementVNode("div", _hoisted_9, [
               vue.createVNode(vue.unref(webVue.Space), null, {
                 default: vue.withCtx(() => [
                   vue.createVNode(vue.unref(webVue.Button), {
@@ -436,47 +445,52 @@ const _sfc_main = vue.defineComponent({
           ])
         ]),
         default: vue.withCtx(() => [
-          vue.createElementVNode("div", _hoisted_1, [
-            vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
-              class: vue.normalizeClass(["edit", {
-                fullHeight: _ctx.aspectRatioProp && !Array.isArray(_ctx.aspectRatioProp)
-              }])
-            }, [
-              vue.createElementVNode("div", _hoisted_2, [
-                editImage.value ? (vue.openBlock(), vue.createElementBlock("img", {
-                  key: 0,
-                  id: "cropper_img",
-                  class: "position",
-                  crossorigin: "anonymous",
-                  src: editImage.value,
-                  onLoad: loadImage
-                }, null, 40, _hoisted_3)) : vue.createCommentVNode("v-if", true)
-              ])
-            ], 2)), [
-              [_directive_loading, croppering.value]
+          vue.createVNode(vue.unref(webVue.Spin), {
+            loading: croppering.value,
+            class: "image-cropper",
+            style: { "width": "100%" }
+          }, {
+            default: vue.withCtx(() => [
+              vue.createElementVNode("div", {
+                class: vue.normalizeClass(["edit", {
+                  fullHeight: _ctx.aspectRatioProp && !Array.isArray(_ctx.aspectRatioProp)
+                }])
+              }, [
+                vue.createElementVNode("div", _hoisted_1, [
+                  editImage.value ? (vue.openBlock(), vue.createElementBlock("img", {
+                    key: 0,
+                    id: "cropper_img",
+                    class: "position",
+                    crossorigin: "anonymous",
+                    src: editImage.value,
+                    onLoad: loadImage
+                  }, null, 40, _hoisted_2)) : vue.createCommentVNode("v-if", true)
+                ])
+              ], 2),
+              !_ctx.aspectRatioProp ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
+                (vue.openBlock(), vue.createElementBlock(vue.Fragment, null, vue.renderList(aspectRatioList, (item, i) => {
+                  return vue.createElementVNode("div", {
+                    key: item.lable,
+                    class: vue.normalizeClass(["btn btn" + (i + 1), { active: aspectRatioActive.value === i }]),
+                    onClick: ($event) => cropper(item.value, i)
+                  }, vue.toDisplayString(item.label), 11, _hoisted_4);
+                }), 64))
+              ])) : vue.createCommentVNode("v-if", true),
+              _ctx.aspectRatioProp && Array.isArray(_ctx.aspectRatioProp) && customizedAspectRatioList.value.length > 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
+                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(customizedAspectRatioList.value, (item, i) => {
+                  return vue.openBlock(), vue.createElementBlock("div", {
+                    key: item.lable,
+                    class: vue.normalizeClass([
+                      "btn btn" + (item.buttonIndex + 1),
+                      { active: aspectRatioActive.value === i }
+                    ]),
+                    onClick: ($event) => cropper(item.value, i)
+                  }, vue.toDisplayString(item.label), 11, _hoisted_6);
+                }), 128))
+              ])) : vue.createCommentVNode("v-if", true)
             ]),
-            !_ctx.aspectRatioProp ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4, [
-              (vue.openBlock(), vue.createElementBlock(vue.Fragment, null, vue.renderList(aspectRatioList, (item, i) => {
-                return vue.createElementVNode("div", {
-                  key: item.lable,
-                  class: vue.normalizeClass(["btn btn" + (i + 1), { active: aspectRatioActive.value === i }]),
-                  onClick: ($event) => cropper(item.value, i)
-                }, vue.toDisplayString(item.label), 11, _hoisted_5);
-              }), 64))
-            ])) : vue.createCommentVNode("v-if", true),
-            _ctx.aspectRatioProp && Array.isArray(_ctx.aspectRatioProp) && customizedAspectRatioList.value.length > 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6, [
-              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(customizedAspectRatioList.value, (item, i) => {
-                return vue.openBlock(), vue.createElementBlock("div", {
-                  key: item.lable,
-                  class: vue.normalizeClass([
-                    "btn btn" + (item.buttonIndex + 1),
-                    { active: aspectRatioActive.value === i }
-                  ]),
-                  onClick: ($event) => cropper(item.value, i)
-                }, vue.toDisplayString(item.label), 11, _hoisted_7);
-              }), 128))
-            ])) : vue.createCommentVNode("v-if", true)
-          ])
+            _: 1
+          }, 8, ["loading"])
         ]),
         _: 1
       }, 8, ["visible"]);

package/lib/resourceModal/component.js

@@ -61,7 +61,7 @@ const _sfc_main = vue.defineComponent({
         onCancel: handleCancel
       }, {
         title: vue.withCtx(() => [
-          vue.createTextVNode("\u9009\u62E9\u5C01\u9762\u6765\u6E90")
+          vue.createTextVNode("\u9009\u62E9\u7D20\u6750\u6765\u6E90")
         ]),
         default: vue.withCtx(() => [
           vue.createVNode(index, {

package/lib/selectThumb/component.js

@@ -1,6 +1,7 @@
 "use strict";
 var vue = require("vue");
 var webVue = require("@arco-design/web-vue");
+var process = require("process");
 var doc = require("../utils/doc.js");
 var component = require("../resourceModal/component.js");
 var component$1 = require("../imageCrop/component.js");
@@ -82,6 +83,16 @@ const _sfc_main = vue.defineComponent({
         callback(styleData.value);
       }
     });
+    const refreshCrop = vue.ref(true);
+    vue.watch(
+      () => dialogCropperShow.value,
+      (n) => {
+        if (n)
+          return;
+        refreshCrop.value = false;
+        process.nextTick(() => refreshCrop.value = true);
+      }
+    );
     const loadData = (value) => {
       let data = null;
       if (!value) {
@@ -415,7 +426,8 @@ const _sfc_main = vue.defineComponent({
           onSubmit: submitCallback,
           onUpload: _cache[3] || (_cache[3] = (cb) => _ctx.$emit("upload", cb))
         }, null, 8, ["dialogVisible", "ai_static_covers", "BASE_API"]),
-        vue.createVNode(component$1, {
+        refreshCrop.value ? (vue.openBlock(), vue.createBlock(component$1, {
+          key: 3,
           visible: dialogCropperShow.value,
           "onUpdate:visible": _cache[4] || (_cache[4] = ($event) => dialogCropperShow.value = $event),
           "aspect-ratio-prop": aspectRatioProp.value,
@@ -423,7 +435,7 @@ const _sfc_main = vue.defineComponent({
           "corp-data": cropperData.value,
           "generate-assets": false,
           onConfirm: cropConfirm
-        }, null, 8, ["visible", "aspect-ratio-prop", "BASE_API", "corp-data"])
+        }, null, 8, ["visible", "aspect-ratio-prop", "BASE_API", "corp-data"])) : vue.createCommentVNode("v-if", true)
       ]);
     };
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cmstops/pro-compo",
-  "version": "0.1.42",
+  "version": "0.1.44",
   "description": "",
   "keywords": [
     "vue",