@cmstops/pro-compo 0.1.14 → 0.1.15

package/es/resourceModal/components/MediaSelection/MainContent/FileTypeThumb/index.js

@@ -14,23 +14,18 @@ const _sfc_main = defineComponent({
   __name: "index",
   props: {
     itemData: {},
-    preview: { type: Boolean },
-    addType: {}
+    preview: { type: Boolean }
   },
-  emits: ["add"],
-  setup(__props, { emit: __emit }) {
+  emits: ["confirm"],
+  setup(__props, { emit }) {
     const props = __props;
-    const emit = __emit;
     const visible = ref(false);
     const previewType = computed(() => props.itemData.catalog);
     const previewUrl = computed(() => props.itemData.url || "");
     const openPreview = () => visible.value = true;
     const closePreviewer = (val) => visible.value = val;
     const add = () => {
-      if (props.addType === "copper" && props.itemData.catalog === "image") {
-        console.log("copper");
-      }
-      emit("add", props.itemData);
+      emit("confirm", props.itemData);
     };
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(Fragment, null, [

package/es/resourceModal/components/MediaSelection/MainContent/index.js

@@ -43,21 +43,14 @@ const _sfc_main = defineComponent({
     fileListCount: {},
     isOver: { type: Boolean },
     preview: { type: Boolean },
-    addType: {},
     changeDirectory: { type: Function },
     loadFileMore: { type: Function }
   },
-  emits: ["add"],
-  setup(__props, { emit: __emit }) {
-    const emit = __emit;
-    const add = (itemData) => {
-      if (selectedData.value.includes(itemData)) {
-        selectedData.value = [];
-        emit("add", null);
-      } else {
-        selectedData.value = [itemData];
-        emit("add", itemData);
-      }
+  emits: ["confirm"],
+  setup(__props, { emit }) {
+    const confirm = (itemData) => {
+      selectedData.value = [itemData];
+      emit("confirm", selectedData.value);
     };
     const selectedData = ref([]);
     return (_ctx, _cache) => {
@@ -106,10 +99,9 @@ const _sfc_main = defineComponent({
                     createElementVNode("div", _hoisted_7, [
                       createVNode(_sfc_main$1, {
                         preview: _ctx.preview,
-                        "add-type": _ctx.addType,
                         "item-data": item,
-                        onAdd: add
-                      }, null, 8, ["preview", "add-type", "item-data"])
+                        onConfirm: confirm
+                      }, null, 8, ["preview", "item-data"])
                     ]),
                     createElementVNode("h4", null, [
                       createVNode(_sfc_main$2, {

package/es/resourceModal/components/MediaSelection/ToolbarSearch/index.js

@@ -18,7 +18,7 @@ const _sfc_main = defineComponent({
     base_api: {}
   },
   emits: ["search"],
-  setup(__props, { expose: __expose, emit: __emit }) {
+  setup(__props, { expose: __expose, emit }) {
     const props = __props;
     const filter = ref({
       keyword: "",
@@ -58,7 +58,6 @@ const _sfc_main = defineComponent({
       () => contentSearch(),
       { deep: true }
     );
-    const emit = __emit;
     const contentSearch = () => {
       if (filter.value.keyword === "" && filter.value.upload_by === "" && filter.value.sf === "" && filter.value.wh_rate === "" && filter.value.uploadTime === null) {
         emit("search", null);

package/es/resourceModal/components/MediaSelection/index.js

@@ -20,16 +20,14 @@ const _sfc_main = defineComponent({
     base_api: {},
     catalogProps: {},
     preview: { type: Boolean },
-    addType: {},
     ai_static_covers: {},
     ai_gif_covers: {}
   },
-  emits: ["add"],
-  setup(__props, { emit: __emit }) {
+  emits: ["confirm"],
+  setup(__props, { emit }) {
     const props = __props;
-    const emit = __emit;
-    const add = (itemData) => {
-      emit("add", itemData);
+    const confirm = (itemData) => {
+      emit("confirm", itemData);
     };
     const breadCrumbs = ref([
       { directory_id: 0, alias: "\u6839\u76EE\u5F55" }
@@ -196,9 +194,8 @@ const _sfc_main = defineComponent({
               ai_gif_covers: _ctx.ai_gif_covers,
               "selected-max": _ctx.selectedMax,
               preview: _ctx.preview,
-              "add-type": _ctx.addType,
-              onAdd: add
-            }, null, 8, ["ai_static_covers", "ai_gif_covers", "selected-max", "preview", "add-type"])) : createCommentVNode("v-if", true),
+              onConfirm: confirm
+            }, null, 8, ["ai_static_covers", "ai_gif_covers", "selected-max", "preview"])) : createCommentVNode("v-if", true),
             createCommentVNode(" \u7D20\u6750\u5E93\u7D20\u6750 "),
             createCommentVNode(" \u7EC4\u7EC7\u3001\u6587\u4EF6\u5939\u9762\u5305\u5C51 "),
             withDirectives(createElementVNode("div", _hoisted_4, [
@@ -256,11 +253,10 @@ const _sfc_main = defineComponent({
                 "file-list-count": fileListCount.value,
                 "is-over": isOver.value,
                 preview: _ctx.preview,
-                "add-type": _ctx.addType,
                 "change-directory": changeDirectory,
                 "load-file-more": loadFileMore,
-                onAdd: add
-              }, null, 8, ["folder-list", "file-list", "file-list-count", "is-over", "preview", "add-type"])
+                onConfirm: confirm
+              }, null, 8, ["folder-list", "file-list", "file-list-count", "is-over", "preview"])
             ], 512), [
               [vShow, ["all", "my"].includes(activeMediaType.value)]
             ])

package/es/selectAvatarList/component.js

@@ -13,10 +13,9 @@ const _sfc_main = defineComponent({
     repositoryId: {}
   },
   emits: ["update:list"],
-  setup(__props, { emit: __emit }) {
+  setup(__props, { emit }) {
     const props = __props;
     const BASE_API = props.BASE_API || DEFAULT_BASE_API;
-    const emit = __emit;
     const visible = ref(false);
     const list = computed({
       get() {

package/es/selectGategory/component.js

@@ -15,9 +15,8 @@ const _sfc_main = defineComponent({
     columnWithData: {}
   },
   emits: ["update:visible", "submit"],
-  setup(__props, { emit: __emit }) {
+  setup(__props, { emit }) {
     const props = __props;
-    const emit = __emit;
     const BASE_API = props.base_api || DEFAULT_BASE_API;
     const selectColumnData = ref(props.columnData || []);
     const selectColumnWithData = ref(props.columnWithData || []);

package/es/selectGategory/components/ColumnSelection/index.js

@@ -31,9 +31,8 @@ const _sfc_main = defineComponent({
     "update:selectColumnData",
     "update:selectColumnWithData"
   ],
-  setup(__props, { emit: __emit }) {
+  setup(__props, { emit }) {
     const props = __props;
-    const emit = __emit;
     const popoverShow = ref(false);
     const treeData = ref([]);
     const listMinHeight = ref(0);

package/es/selectThumb/component.js

@@ -0,0 +1,410 @@
+import { defineComponent, ref, computed, watch, openBlock, createElementBlock, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, Fragment, renderList, createBlock, createVNode, unref, withCtx, withDirectives, vShow } from "vue";
+import { RadioGroup, Radio, Switch } from "@arco-design/web-vue";
+import { docThumbObjMap, docThumbArrMap, docThumbRatioMap } from "../utils/doc.js";
+import _sfc_main$3 from "../resourceModal/component.js";
+import _sfc_main$4 from "../imageCrop/component.js";
+import _sfc_main$1 from "./components/card.js";
+import _sfc_main$2 from "./components/colorPalette.js";
+import { DEFAULT_BASE_API } from "../config.js";
+const _hoisted_1 = { class: "select-thumb-container" };
+const _hoisted_2 = { class: "title" };
+const _hoisted_3 = {
+  key: 0,
+  class: "tip"
+};
+const _hoisted_4 = {
+  key: 0,
+  class: "thumb-list-view"
+};
+const _hoisted_5 = { class: "banner-view" };
+const _hoisted_6 = { class: "title" };
+const _hoisted_7 = /* @__PURE__ */ createElementVNode("span", null, "\u72EC\u7ACB\u8F6E\u64AD\u56FE", -1);
+const _hoisted_8 = { class: "title" };
+const _hoisted_9 = /* @__PURE__ */ createElementVNode("span", null, "\u72EC\u7ACB\u8F6E\u64AD\u56FE\u80CC\u666F\u989C\u8272", -1);
+const _hoisted_10 = [
+  _hoisted_9
+];
+const _hoisted_11 = { class: "banner-view" };
+const _hoisted_12 = { class: "title" };
+const _hoisted_13 = { key: 0 };
+const _hoisted_14 = { key: 1 };
+const _hoisted_15 = /* @__PURE__ */ createElementVNode("span", { class: "star" }, "*", -1);
+const _hoisted_16 = { key: 2 };
+const _hoisted_17 = /* @__PURE__ */ createElementVNode("span", { class: "tip" }, "(\u5EFA\u8BAE\u5C3A\u5BF8\uFF1A1242px*662px)", -1);
+const _hoisted_18 = { class: "title" };
+const _hoisted_19 = /* @__PURE__ */ createElementVNode("span", null, "\u4E13\u9898\u5934\u56FE\u80CC\u666F\u989C\u8272", -1);
+const _hoisted_20 = [
+  _hoisted_19
+];
+const _sfc_main = defineComponent({
+  ...{ name: "selectThumb" },
+  __name: "component",
+  props: {
+    BASE_API: {},
+    mode: {},
+    dataValue: {},
+    title: {},
+    cropper: { type: Boolean },
+    aiImages: {},
+    series: {}
+  },
+  emits: ["update:dataValue"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const BASE_API = props.BASE_API || DEFAULT_BASE_API;
+    const useCropper = ref(props.cropper || false);
+    const oldData = ref(null);
+    const styleData = ref({});
+    const thumbBannerModel = ref("banner");
+    const dialogMediaSelectionShow = ref(false);
+    const dialogCropperShow = ref(false);
+    const thumbOptionIndex = ref(0);
+    const aspectRatioProp = ref(16 / 9);
+    const cropperData = ref([]);
+    const model = computed({
+      get() {
+        if (!styleData.value.model)
+          return "4";
+        return `${styleData.value.model}`;
+      },
+      set(value) {
+        styleData.value.model = parseInt(value, 10);
+        callback(styleData.value);
+      }
+    });
+    watch(
+      () => props.dataValue,
+      () => {
+        loadData(props.dataValue);
+      }
+    );
+    const loadData = (value) => {
+      let data = null;
+      if (!value) {
+        data = { model: 3, data: [{ url: "", thumb: "" }] };
+      } else if (props.mode === "smiple") {
+        data = { model: 3, data: [{ url: value, thumb: value }] };
+      } else {
+        data = { ...JSON.parse(value) };
+      }
+      if (!oldData.value) {
+        oldData.value = { ...data };
+      }
+      styleData.value = data;
+    };
+    const callback = (value) => {
+      var _a;
+      const temp = JSON.parse(JSON.stringify(value));
+      if (Array.isArray(temp.data)) {
+        temp.data = temp.data.map((item) => {
+          return item || {};
+        });
+      }
+      if (props.mode === "smiple") {
+        emit("update:dataValue", ((_a = temp.data[0]) == null ? void 0 : _a.url) || "");
+      } else {
+        if (!temp.data) {
+          temp.data = [];
+        }
+        emit("update:dataValue", JSON.stringify(temp));
+      }
+    };
+    const curtemplate = computed(() => {
+      if (props.mode !== "doc") {
+        return docThumbObjMap[3];
+      }
+      return docThumbObjMap[parseInt(model.value, 10)];
+    });
+    const modelList = computed(() => {
+      return docThumbArrMap().filter((item) => {
+        return FromThumbArr.value.split(",").includes(item.value);
+      });
+    });
+    const FromThumbArr = computed(() => {
+      const { series } = props;
+      if (series) {
+        if (series === "imagetext")
+          return "1,2,3,4";
+        if (series === "svideo")
+          return "2,5";
+        if (series === "video")
+          return "1,2,3,4";
+        if (series === "atlas")
+          return "1,2,3,4";
+        if (series === "audio")
+          return "1,2,3,4";
+        if (series === "link")
+          return "1,2,3,4,7";
+        if (series === "h5")
+          return "1,2,3,4,7";
+      }
+      return "1,2,3,4,5,7";
+    });
+    const currentModel = computed(() => {
+      if (props.mode !== "doc") {
+        return docThumbObjMap[3];
+      }
+      return modelList.value.find((item) => item.value === model.value);
+    });
+    const thumbList = computed(() => {
+      var _a;
+      return ((_a = styleData.value) == null ? void 0 : _a.data) || [];
+    });
+    const previewList = computed(() => {
+      return thumbList.value.map((item) => item.url);
+    });
+    const openDialogMediaSelection = (type, index) => {
+      thumbBannerModel.value = type || "thumb";
+      thumbOptionIndex.value = index || 0;
+      dialogMediaSelectionShow.value = true;
+    };
+    const docSeriesShowTopThemeColor = computed(() => {
+      const { series } = props;
+      return ["special", "special_v3", "video_album", "audio_album"].includes(
+        series
+      );
+    });
+    const submitCallback = (data) => {
+      var _a;
+      console.log("submitCallback", data);
+      const isPcBaner = props.mode === "doc" && thumbBannerModel.value === "pcBanner" && !docSeriesShowTopThemeColor.value;
+      const _useCropper = props.mode === "doc" ? true : useCropper.value;
+      if (isPcBaner || !_useCropper) {
+        dialogMediaSelectionShow.value = false;
+        data.map(async (media) => {
+          const { width, height } = await loadImage(media.url);
+          styleData.value.pc_banner_url = `${media.url}?width=${width}&height=${height}`;
+          styleData.value.pc_banner_url_info = JSON.stringify({ width, height });
+          callback(styleData.value);
+          return media;
+        });
+      } else {
+        cropperData.value = [].concat(data);
+        if (thumbBannerModel.value === "banner" || docSeriesShowTopThemeColor.value) {
+          aspectRatioProp.value = docThumbRatioMap()[2];
+        }
+        if (thumbBannerModel.value === "thumb") {
+          aspectRatioProp.value = docThumbRatioMap()[model.value];
+          if (data.length) {
+            const media = data[0];
+            const wh = [];
+            (_a = media.metas) == null ? void 0 : _a.map((item) => {
+              if (item.key === "width")
+                wh.unshift(parseInt(item.value, 10));
+              if (item.key === "height")
+                wh.push(parseInt(item.value, 10));
+              return item;
+            });
+            if (wh.length === 2 && Math.abs(wh[0] / wh[1] - curtemplate.value.ratio) <= 0.05) {
+              const [width, height] = wh;
+              const temp = JSON.parse(JSON.stringify(styleData.value.data || []));
+              temp[thumbOptionIndex.value] = {
+                url: `${media.url}?width=${width}&height=${height}`,
+                thumb: `${media.url}?width=${width}&height=${height}`
+              };
+              styleData.value.data = temp;
+              callback(styleData.value);
+              dialogMediaSelectionShow.value = false;
+              return false;
+            }
+          }
+        }
+        setTimeout(() => {
+          dialogCropperShow.value = true;
+        }, 300);
+      }
+    };
+    const cropConfirm = (data) => {
+      dialogMediaSelectionShow.value = false;
+      if (thumbBannerModel.value === "banner") {
+        styleData.value.banner_url = data[0].url;
+        styleData.value.banner_colorList = JSON.parse(
+          JSON.stringify(data[0].banner_theme_color)
+        );
+        styleData.value.banner_theme_color = `rgb(${data[0].banner_theme_color[1]})`;
+      }
+      if (thumbBannerModel.value === "pcBanner" && docSeriesShowTopThemeColor.value) {
+        styleData.value.top_image_url = data[0].url;
+        styleData.value.pc_banner_url = data[0].url;
+        styleData.value.top_colorList = JSON.parse(
+          JSON.stringify(data[0].banner_theme_color)
+        );
+        styleData.value.top_theme_color = `rgb(${data[0].banner_theme_color[1]})`;
+      }
+      if (thumbBannerModel.value === "thumb") {
+        const temp = JSON.parse(JSON.stringify(styleData.value.data || []));
+        temp[thumbOptionIndex.value] = {
+          url: data[0].url,
+          thumb: data[0].url
+        };
+        styleData.value.data = temp;
+      }
+      callback(styleData.value);
+    };
+    const loadImage = (url) => {
+      return new Promise((resolve, reject) => {
+        const _img = new Image();
+        _img.src = url;
+        _img.onload = () => {
+          resolve(_img);
+        };
+        _img.onerror = reject;
+      });
+    };
+    const modelChange = () => {
+      if (!props.dataValue)
+        return;
+      if (styleData.value.model === oldData.value.model) {
+        styleData.value.data = oldData.value.data;
+      } else {
+        styleData.value.data = [];
+      }
+      callback(styleData.value);
+    };
+    const banner = computed(() => {
+      const { banner: banner2, banner_theme_color, banner_url } = styleData.value;
+      return { banner: banner2, banner_theme_color, url: banner_url };
+    });
+    const hasBanner = computed({
+      get() {
+        var _a;
+        return !!((_a = banner.value) == null ? void 0 : _a.banner);
+      },
+      set(value) {
+        styleData.value.banner = value;
+        callback(styleData.value);
+      }
+    });
+    const pcBanner = computed(() => {
+      const { pc_banner_url_info, pc_banner_url } = styleData.value;
+      return { pc_banner_url_info, url: pc_banner_url };
+    });
+    const colorChange = (styleData2) => {
+      callback(styleData2);
+    };
+    return (_ctx, _cache) => {
+      var _a, _b, _c;
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          createTextVNode(toDisplayString(_ctx.title ? _ctx.title : "\u5C01\u9762") + " ", 1),
+          ((_a = curtemplate.value) == null ? void 0 : _a.value) !== "4" ? (openBlock(), createElementBlock("span", _hoisted_3, "(" + toDisplayString((_b = curtemplate.value) == null ? void 0 : _b.alias) + "\u6BD4\u4F8B\uFF1A" + toDisplayString((_c = curtemplate.value) == null ? void 0 : _c.ratioStr) + ")", 1)) : createCommentVNode("v-if", true)
+        ]),
+        currentModel.value ? (openBlock(), createElementBlock("div", _hoisted_4, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(currentModel.value.maxLength, (item, index) => {
+            return openBlock(), createBlock(_sfc_main$1, {
+              key: index,
+              id: `thumb-card-${index}`,
+              data: thumbList.value[index],
+              model: model.value,
+              "preview-list": previewList.value,
+              "thumb-model": "thumb",
+              onOpen: ($event) => openDialogMediaSelection($event, index)
+            }, null, 8, ["id", "data", "model", "preview-list", "onOpen"]);
+          }), 128))
+        ])) : createCommentVNode("v-if", true),
+        _ctx.mode === "doc" ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+          createCommentVNode(" \u9009\u62E9\u5927\u56FE\u3001\u4E09\u56FE\u3001\u5355\u56FE...\u7B49\u6A21\u5F0F "),
+          createVNode(unref(RadioGroup), {
+            modelValue: model.value,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
+            size: "small",
+            type: "button",
+            onChange: modelChange
+          }, {
+            default: withCtx(() => [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(modelList.value, (item, index) => {
+                return openBlock(), createBlock(unref(Radio), {
+                  key: index,
+                  value: item.value
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(item.alias), 1)
+                  ]),
+                  _: 2
+                }, 1032, ["value"]);
+              }), 128))
+            ]),
+            _: 1
+          }, 8, ["modelValue"]),
+          createCommentVNode(" \u72EC\u7ACB\u8F6E\u535A\u56FE "),
+          createElementVNode("div", _hoisted_5, [
+            createElementVNode("div", _hoisted_6, [
+              _hoisted_7,
+              createVNode(unref(Switch), {
+                modelValue: hasBanner.value,
+                "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => hasBanner.value = $event),
+                size: "small"
+              }, null, 8, ["modelValue"])
+            ]),
+            withDirectives(createVNode(_sfc_main$1, {
+              id: `banner-card`,
+              data: banner.value,
+              "preview-list": previewList.value,
+              "thumb-model": "banner",
+              onOpen: openDialogMediaSelection
+            }, null, 8, ["data", "preview-list"]), [
+              [vShow, hasBanner.value]
+            ]),
+            withDirectives(createElementVNode("div", _hoisted_8, _hoisted_10, 512), [
+              [vShow, hasBanner.value && styleData.value.banner_theme_color]
+            ]),
+            createCommentVNode(" banner\u8C03\u8272\u677F "),
+            withDirectives(createVNode(_sfc_main$2, {
+              "style-data": styleData.value,
+              model: "banner",
+              onChange: colorChange
+            }, null, 8, ["style-data"]), [
+              [vShow, hasBanner.value]
+            ])
+          ]),
+          createCommentVNode(" pc\u5C01\u9762\u56FE\uFF08\u4E13\u9898\u5934\u56FE\u5171\u7528\u4E00\u4E2A\u5B57\u6BB5\uFF09 "),
+          createElementVNode("div", _hoisted_11, [
+            createElementVNode("div", _hoisted_12, [
+              ["special", "special_v3"].includes(props.series) ? (openBlock(), createElementBlock("span", _hoisted_13, "\u4E13\u9898\u5934\u56FE")) : ["video_album", "audio_album"].includes(props.series) ? (openBlock(), createElementBlock("span", _hoisted_14, [
+                _hoisted_15,
+                createTextVNode("\u5C01\u9762\u5934\u56FE")
+              ])) : (openBlock(), createElementBlock("span", _hoisted_16, "PC\u5C01\u9762\u56FE")),
+              _hoisted_17
+            ]),
+            createVNode(_sfc_main$1, {
+              id: `pc-banner-card`,
+              data: pcBanner.value,
+              previewList: previewList.value,
+              thumbModel: "pcBanner",
+              onOpen: openDialogMediaSelection
+            }, null, 8, ["data", "previewList"]),
+            withDirectives(createElementVNode("div", _hoisted_18, _hoisted_20, 512), [
+              [vShow, docSeriesShowTopThemeColor.value && styleData.value.top_theme_color]
+            ]),
+            withDirectives(createVNode(_sfc_main$2, {
+              styleData: styleData.value,
+              model: "top",
+              onChange: colorChange
+            }, null, 8, ["styleData"]), [
+              [vShow, docSeriesShowTopThemeColor.value]
+            ])
+          ])
+        ], 64)) : createCommentVNode("v-if", true),
+        createVNode(_sfc_main$3, {
+          dialogVisible: dialogMediaSelectionShow.value,
+          "onUpdate:dialogVisible": _cache[2] || (_cache[2] = ($event) => dialogMediaSelectionShow.value = $event),
+          preview: false,
+          "catalog-props": "image",
+          ai_static_covers: _ctx.aiImages,
+          base_api: unref(BASE_API),
+          onSubmit: submitCallback
+        }, null, 8, ["dialogVisible", "ai_static_covers", "base_api"]),
+        createVNode(_sfc_main$4, {
+          visible: dialogCropperShow.value,
+          "onUpdate:visible": _cache[3] || (_cache[3] = ($event) => dialogCropperShow.value = $event),
+          "aspect-ratio-prop": aspectRatioProp.value,
+          BASE_API: unref(BASE_API),
+          "corp-data": cropperData.value,
+          "generate-assets": false,
+          onConfirm: cropConfirm
+        }, null, 8, ["visible", "aspect-ratio-prop", "BASE_API", "corp-data"])
+      ]);
+    };
+  }
+});
+export { _sfc_main as default };

package/es/selectThumb/components/card.js

@@ -0,0 +1,86 @@
+import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, createVNode, unref, Transition, withCtx, createElementVNode, withModifiers, createCommentVNode } from "vue";
+import { Image } from "@arco-design/web-vue";
+import { IconEdit, IconDelete, IconPlus } from "@arco-design/web-vue/es/icon";
+const _hoisted_1 = {
+  key: 0,
+  class: "img-v"
+};
+const _hoisted_2 = ["onClick"];
+const _hoisted_3 = ["onClick"];
+const _hoisted_4 = ["onClick"];
+const _sfc_main = defineComponent({
+  ...{ name: "thumbCard" },
+  __name: "card",
+  props: {
+    data: {},
+    previewList: {},
+    thumbModel: {},
+    along: { type: Boolean },
+    model: {}
+  },
+  emits: ["open", "remove"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const classObj = computed(() => {
+      var _a;
+      if (!props.model)
+        return {};
+      return {
+        [`model-${props.model}`]: ((_a = props.data) == null ? void 0 : _a.url) && props.model
+      };
+    });
+    const clickMask = () => {
+      props.along && openDialogMediaSelection();
+    };
+    const openDialogMediaSelection = () => {
+      emit("open", props.thumbModel);
+    };
+    const remove = () => {
+      emit("remove");
+    };
+    return (_ctx, _cache) => {
+      var _a, _b;
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["thumb-card-container", classObj.value])
+      }, [
+        ((_a = props.data) == null ? void 0 : _a.url) ? (openBlock(), createElementBlock("div", _hoisted_1, [
+          createVNode(unref(Image), {
+            class: "item",
+            fit: "cover",
+            src: (_b = props.data) == null ? void 0 : _b.url
+          }, null, 8, ["src"]),
+          createVNode(Transition, { name: "fade" }, {
+            default: withCtx(() => [
+              createElementVNode("div", {
+                class: "mask",
+                onClick: clickMask
+              }, [
+                createElementVNode("span", {
+                  class: "half",
+                  onClick: withModifiers(openDialogMediaSelection, ["stop"])
+                }, [
+                  createVNode(unref(IconEdit))
+                ], 8, _hoisted_2),
+                _ctx.along ? (openBlock(), createElementBlock("span", {
+                  key: 0,
+                  class: "half",
+                  onClick: withModifiers(remove, ["stop"])
+                }, [
+                  createVNode(unref(IconDelete))
+                ], 8, _hoisted_3)) : createCommentVNode("v-if", true)
+              ])
+            ]),
+            _: 1
+          })
+        ])) : (openBlock(), createElementBlock("div", {
+          key: 1,
+          class: "item add-thumb",
+          onClick: withModifiers(openDialogMediaSelection, ["stop"])
+        }, [
+          createVNode(unref(IconPlus))
+        ], 8, _hoisted_4))
+      ], 2);
+    };
+  }
+});
+export { _sfc_main as default };