yc-pro-components 0.0.44 → 0.0.46

package/es/components/yc-batch-import-dialog/src/index.vue2.mjs

@@ -0,0 +1,579 @@
+import { defineComponent, ref, computed, resolveComponent, openBlock, createBlock, unref, withCtx, createElementVNode, createCommentVNode, createElementBlock, toDisplayString, createVNode, createTextVNode, Fragment, pushScopeId, popScopeId } from 'vue';
+import { YcDialog } from '../../yc-dialog/index.mjs';
+import { ElUpload, ElMessage } from 'element-plus';
+import { Loading } from '@element-plus/icons-vue';
+import UploadRecordList from './UploadRecordList.vue.mjs';
+
+const _withScopeId = (n) => (pushScopeId("data-v-338bd60b"), n = n(), popScopeId(), n);
+const _hoisted_1 = { class: "batch-import" };
+const _hoisted_2 = {
+  key: 0,
+  class: "step-container"
+};
+const _hoisted_3 = { class: "step-content" };
+const _hoisted_4 = { class: "step-title" };
+const _hoisted_5 = { class: "step-notice" };
+const _hoisted_6 = { class: "ml-2" };
+const _hoisted_7 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode(
+  "div",
+  { class: "required-tip" },
+  "\u6CE8\u610F\uFF01\u6A21\u677F\u4E2D\u7EA2\u8272\u8868\u5934\u90E8\u5206\u4E3A\u5FC5\u586B\u9879\uFF01",
+  -1
+  /* HOISTED */
+));
+const _hoisted_8 = {
+  key: 1,
+  class: "step-container"
+};
+const _hoisted_9 = { class: "step-content" };
+const _hoisted_10 = { class: "step-title" };
+const _hoisted_11 = { class: "upload-area" };
+const _hoisted_12 = {
+  key: 0,
+  class: "upload-zone"
+};
+const _hoisted_13 = { class: "upload-tip" };
+const _hoisted_14 = { class: "upload-zone uploaded" };
+const _hoisted_15 = { class: "file-name" };
+const _hoisted_16 = {
+  key: 3,
+  class: "import-status-zone"
+};
+const _hoisted_17 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode(
+  "div",
+  { class: "status-text" },
+  "\u6B63\u5728\u5BFC\u5165\u4E2D\u2026",
+  -1
+  /* HOISTED */
+));
+const _hoisted_18 = {
+  key: 4,
+  class: "import-status-zone"
+};
+const _hoisted_19 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode(
+  "div",
+  { class: "status-text" },
+  "\u5BFC\u5165\u6210\u529F",
+  -1
+  /* HOISTED */
+));
+const _hoisted_20 = { class: "file-info" };
+const _hoisted_21 = { class: "file-name" };
+const _hoisted_22 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode(
+  "span",
+  { class: "separator" },
+  "\uFF5C",
+  -1
+  /* HOISTED */
+));
+const _hoisted_23 = {
+  key: 5,
+  class: "import-status-zone"
+};
+const _hoisted_24 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode(
+  "div",
+  { class: "status-text" },
+  "\u5BFC\u5165\u5931\u8D25",
+  -1
+  /* HOISTED */
+));
+const _hoisted_25 = { class: "file-info" };
+const _hoisted_26 = { class: "file-name" };
+const _hoisted_27 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode(
+  "span",
+  { class: "separator" },
+  "\uFF5C",
+  -1
+  /* HOISTED */
+));
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "YcBatchImportDialog"
+  },
+  __name: "index",
+  props: {
+    title: { default: "\u6279\u91CF\u5BFC\u5165" },
+    width: { default: 520 },
+    iconBaseUrl: { default: "" },
+    stepOneTitle: { default: "\u7B2C\u4E00\u6B65\uFF1A\u8BF7\u4E25\u683C\u6309\u7167\u5BFC\u5165\u6A21\u677F\u586B\u5199\u5185\u5BB9\u540E\u5BFC\u5165\uFF0C\u5426\u5219\u5C06\u65B0\u589E\u5931\u8D25\uFF01" },
+    tips: { default: "\u6CE8\u610F\uFF1A\u5355\u6B21\u5BFC\u5165\u6570\u636E\u4E0D\u5F97\u8D85\u8FC75000\u6761\uFF0C\u5426\u5219\u5BFC\u5165\u53EF\u80FD\u5931\u8D25!" },
+    templateUrl: {},
+    templateFileName: {},
+    resultFileName: { default: "\u5BFC\u5165\u7ED3\u679C" },
+    templateButtonText: { default: "\u4E0B\u8F7D\u5BFC\u5165\u6A21\u677F" },
+    onDownloadTemplate: {},
+    stepTwoTitle: { default: "\u7B2C\u4E8C\u6B65\uFF1A\u9009\u62E9\u6A21\u677F\u6587\u4EF6\u5E76\u5F00\u59CB\u5BFC\u5165" },
+    accept: { default: ".xls,.xlsx" },
+    maxFileSize: { default: 10 },
+    maxRowCount: { default: 5e3 },
+    importApi: {},
+    extraFormData: {},
+    responseType: { default: "blob" }
+  },
+  emits: ["success", "error", "close"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const visible = ref(false);
+    const importStatus = ref("initial");
+    const uploadedFile = ref(null);
+    const errorMessage = ref("");
+    const importResult = ref(null);
+    const uploadRecords = ref([]);
+    const importIconUrl = computed(
+      () => props.iconBaseUrl ? `${props.iconBaseUrl}import.svg` : ""
+    );
+    const excelIconUrl = computed(
+      () => props.iconBaseUrl ? `${props.iconBaseUrl}excel.svg` : ""
+    );
+    const importSuccessIconUrl = computed(
+      () => props.iconBaseUrl ? `${props.iconBaseUrl}import_success.svg` : ""
+    );
+    const importErrorIconUrl = computed(
+      () => props.iconBaseUrl ? `${props.iconBaseUrl}import_error.svg` : ""
+    );
+    const dynamicTips = computed(() => {
+      if (props.tips) return props.tips;
+      return `\u6CE8\u610F\uFF1A\u5355\u6B21\u5BFC\u5165\u6570\u636E\u4E0D\u5F97\u8D85\u8FC7${props.maxRowCount}\u6761\uFF0C\u5426\u5219\u5BFC\u5165\u53EF\u80FD\u5931\u8D25!`;
+    });
+    const uploadTip = computed(() => {
+      const fileTypes = props.accept.split(",").map((t) => t.replace(".", "").toUpperCase()).join("/");
+      return `${fileTypes}\u6587\u4EF6\u5927\u5C0F\u4E0D\u5F97\u8D85\u8FC7${props.maxFileSize}M`;
+    });
+    const open = (type) => {
+      visible.value = true;
+      resetState();
+    };
+    const close = () => {
+      visible.value = false;
+    };
+    const resetState = () => {
+      importStatus.value = "initial";
+      uploadedFile.value = null;
+      errorMessage.value = "";
+      importResult.value = null;
+      uploadRecords.value = [];
+    };
+    const handleDownloadTemplate = async () => {
+      if (props.onDownloadTemplate) {
+        await props.onDownloadTemplate();
+        return;
+      }
+      if (props.templateUrl) {
+        try {
+          const response = await fetch(props.templateUrl);
+          if (!response.ok) {
+            throw new Error(`\u4E0B\u8F7D\u5931\u8D25: ${response.status}`);
+          }
+          const blob = await response.blob();
+          const url = window.URL.createObjectURL(blob);
+          const link = document.createElement("a");
+          link.href = url;
+          const fileName = props.templateFileName || props.templateUrl.split("/").pop() || "";
+          link.setAttribute("download", fileName);
+          document.body.appendChild(link);
+          link.click();
+          document.body.removeChild(link);
+          window.URL.revokeObjectURL(url);
+          ElMessage.success("\u6A21\u677F\u4E0B\u8F7D\u6210\u529F");
+        } catch (error) {
+          console.error("\u4E0B\u8F7D\u6A21\u677F\u5931\u8D25:", error);
+        }
+        return;
+      }
+      ElMessage.warning("\u672A\u914D\u7F6E\u6A21\u677F\u4E0B\u8F7D\u5730\u5740");
+    };
+    const beforeUpload = (file) => {
+      var _a;
+      const acceptTypes = props.accept.split(",").map((t) => t.trim().toLowerCase());
+      const fileExt = "." + ((_a = file.name.split(".").pop()) == null ? void 0 : _a.toLowerCase());
+      const isValidType = acceptTypes.includes(fileExt);
+      if (!isValidType) {
+        const typeNames = acceptTypes.map((t) => t.replace(".", "")).join(" \u6216 ");
+        ElMessage.error(`\u53EA\u80FD\u4E0A\u4F20 ${typeNames} \u683C\u5F0F\u7684\u6587\u4EF6`);
+        return false;
+      }
+      const isValidSize = file.size / 1024 / 1024 < props.maxFileSize;
+      if (!isValidSize) {
+        ElMessage.error(`\u6587\u4EF6\u5927\u5C0F\u4E0D\u5F97\u8D85\u8FC7 ${props.maxFileSize}M`);
+        return false;
+      }
+      return true;
+    };
+    const handleFileChange = (file) => {
+      if (file.status === "ready") {
+        uploadedFile.value = file;
+        importStatus.value = "uploaded";
+        const recordId = crypto.randomUUID();
+        const record = {
+          id: recordId,
+          name: file.name,
+          size: file.size || 0,
+          progress: 100,
+          status: "completed"
+        };
+        uploadRecords.value.push(record);
+      }
+    };
+    const handleReupload = () => {
+      importStatus.value = "initial";
+      uploadedFile.value = null;
+      errorMessage.value = "";
+      importResult.value = null;
+    };
+    const downloadFile = (blob, originalFileName) => {
+      const url = window.URL.createObjectURL(blob);
+      const link = document.createElement("a");
+      link.href = url;
+      const baseFileName = props.resultFileName || "\u5BFC\u5165\u7ED3\u679C";
+      const fileExt = (originalFileName == null ? void 0 : originalFileName.split(".").pop()) || "xlsx";
+      const downloadFileName = `${baseFileName}_${Date.now()}.${fileExt}`;
+      link.setAttribute("download", downloadFileName);
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+      window.URL.revokeObjectURL(url);
+    };
+    const handleStartImport = async () => {
+      if (!uploadedFile.value) {
+        ElMessage.warning("\u8BF7\u5148\u9009\u62E9\u6587\u4EF6");
+        return;
+      }
+      try {
+        importStatus.value = "importing";
+        const formData = new FormData();
+        formData.append("file", uploadedFile.value.raw);
+        if (props.extraFormData) {
+          Object.entries(props.extraFormData).forEach(([key, value]) => {
+            formData.append(key, value);
+          });
+        }
+        const result = await props.importApi(formData);
+        if (props.responseType === "blob" && result instanceof Blob) {
+          importResult.value = result;
+          downloadFile(result, uploadedFile.value.name);
+          importStatus.value = "success";
+          ElMessage.success("\u5BFC\u5165\u6210\u529F");
+          emit("success", result);
+          return;
+        }
+        const response = result;
+        const data = (response == null ? void 0 : response.data) || response;
+        if ((data == null ? void 0 : data.success) === false) {
+          importStatus.value = "error";
+          errorMessage.value = data.message || "\u90E8\u5206\u6570\u636E\u5BFC\u5165\u5931\u8D25";
+          if (data.errorFileBase64) {
+            importResult.value = data.errorFileBase64;
+          }
+          ElMessage.error(errorMessage.value);
+          emit("error", new Error(errorMessage.value));
+          return;
+        }
+        importStatus.value = "success";
+        ElMessage.success("\u5BFC\u5165\u6210\u529F");
+        emit("success", result);
+      } catch (error) {
+        importStatus.value = "error";
+        const err = error instanceof Error ? error : new Error(String(error));
+        errorMessage.value = err.message || "\u5BFC\u5165\u5931\u8D25";
+        emit("error", err);
+      }
+    };
+    const base64ToBlob = (base64, mimeType = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet") => {
+      const byteCharacters = atob(base64);
+      const byteNumbers = new Array(byteCharacters.length);
+      for (let i = 0; i < byteCharacters.length; i++) {
+        byteNumbers[i] = byteCharacters.charCodeAt(i);
+      }
+      const byteArray = new Uint8Array(byteNumbers);
+      return new Blob([byteArray], { type: mimeType });
+    };
+    const handleDownloadResult = () => {
+      var _a, _b;
+      if (!importResult.value) {
+        ElMessage.warning("\u6682\u65E0\u5BFC\u5165\u7ED3\u679C\u53EF\u4E0B\u8F7D");
+        return;
+      }
+      if (typeof importResult.value === "string") {
+        const blob = base64ToBlob(importResult.value);
+        downloadFile(blob, (_a = uploadedFile.value) == null ? void 0 : _a.name);
+        return;
+      }
+      downloadFile(importResult.value, (_b = uploadedFile.value) == null ? void 0 : _b.name);
+    };
+    const handleConfirm = async () => {
+      if (importStatus.value === "success") {
+        visible.value = false;
+        emit("close");
+      } else if (importStatus.value === "uploaded") {
+        await handleStartImport();
+      } else if (importStatus.value === "initial") {
+        ElMessage.warning("\u8BF7\u5148\u4E0A\u4F20\u6587\u4EF6");
+      }
+    };
+    const handleCancel = () => {
+      visible.value = false;
+      emit("close");
+    };
+    const handlePauseUpload = (_id) => {
+    };
+    const handleResumeUpload = (_id) => {
+    };
+    const handleCancelUpload = (id) => {
+      const record = uploadRecords.value.find((r) => r.id === id);
+      if (record && uploadedFile.value && record.name === uploadedFile.value.name) {
+        importStatus.value = "initial";
+        uploadedFile.value = null;
+        errorMessage.value = "";
+        importResult.value = null;
+      }
+      const index = uploadRecords.value.findIndex((r) => r.id === id);
+      if (index !== -1) {
+        uploadRecords.value.splice(index, 1);
+      }
+    };
+    __expose({
+      open,
+      close,
+      reset: resetState
+    });
+    return (_ctx, _cache) => {
+      const _component_YcSvgIcon = resolveComponent("YcSvgIcon");
+      const _component_el_button = resolveComponent("el-button");
+      const _component_el_icon = resolveComponent("el-icon");
+      return openBlock(), createBlock(unref(YcDialog), {
+        modelValue: visible.value,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => visible.value = $event),
+        title: _ctx.title,
+        width: _ctx.width,
+        "show-header-border": "",
+        onConfirm: handleConfirm,
+        onCancel: handleCancel
+      }, {
+        default: withCtx(() => {
+          var _a, _b, _c;
+          return [
+            createElementVNode("div", _hoisted_1, [
+              createCommentVNode(" \u7B2C\u4E00\u6B65\uFF1A\u4E0B\u8F7D\u6A21\u677F\uFF08\u4EC5\u5728\u521D\u59CB\u548C\u5DF2\u4E0A\u4F20\u72B6\u6001\u663E\u793A\uFF09 "),
+              importStatus.value === "initial" || importStatus.value === "uploaded" ? (openBlock(), createElementBlock("div", _hoisted_2, [
+                createElementVNode("div", _hoisted_3, [
+                  createElementVNode(
+                    "div",
+                    _hoisted_4,
+                    toDisplayString(_ctx.stepOneTitle),
+                    1
+                    /* TEXT */
+                  ),
+                  createElementVNode(
+                    "div",
+                    _hoisted_5,
+                    toDisplayString(dynamicTips.value),
+                    1
+                    /* TEXT */
+                  ),
+                  createVNode(_component_el_button, {
+                    class: "download-btn",
+                    onClick: handleDownloadTemplate
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(_component_YcSvgIcon, {
+                        src: importIconUrl.value,
+                        size: 16
+                      }, null, 8, ["src"]),
+                      createElementVNode(
+                        "span",
+                        _hoisted_6,
+                        toDisplayString(_ctx.templateButtonText),
+                        1
+                        /* TEXT */
+                      )
+                    ]),
+                    _: 1
+                    /* STABLE */
+                  }),
+                  _hoisted_7
+                ])
+              ])) : createCommentVNode("v-if", true),
+              createCommentVNode(" \u7B2C\u4E8C\u6B65\uFF1A\u4E0A\u4F20\u6587\u4EF6\uFF08\u4EC5\u5728\u521D\u59CB\u548C\u5DF2\u4E0A\u4F20\u72B6\u6001\u663E\u793A\uFF09 "),
+              importStatus.value === "initial" || importStatus.value === "uploaded" ? (openBlock(), createElementBlock("div", _hoisted_8, [
+                createElementVNode("div", _hoisted_9, [
+                  createElementVNode(
+                    "div",
+                    _hoisted_10,
+                    toDisplayString(_ctx.stepTwoTitle),
+                    1
+                    /* TEXT */
+                  ),
+                  createCommentVNode(" \u4E0A\u4F20\u533A\u57DF "),
+                  createElementVNode("div", _hoisted_11, [
+                    createCommentVNode(" \u521D\u59CB\u72B6\u6001\uFF1A\u663E\u793A\u4E0A\u4F20\u533A\u57DF "),
+                    importStatus.value === "initial" ? (openBlock(), createElementBlock("div", _hoisted_12, [
+                      createVNode(_component_YcSvgIcon, {
+                        src: excelIconUrl.value,
+                        size: 48,
+                        "preserve-color": true,
+                        class: "excel-icon"
+                      }, null, 8, ["src"]),
+                      createVNode(unref(ElUpload), {
+                        "auto-upload": false,
+                        "show-file-list": false,
+                        "before-upload": beforeUpload,
+                        "on-change": handleFileChange,
+                        accept: _ctx.accept
+                      }, {
+                        default: withCtx(() => [
+                          createVNode(_component_el_button, { class: "select-file-btn" }, {
+                            default: withCtx(() => [
+                              createTextVNode("\u9009\u62E9\u6587\u4EF6")
+                            ]),
+                            _: 1
+                            /* STABLE */
+                          })
+                        ]),
+                        _: 1
+                        /* STABLE */
+                      }, 8, ["accept"]),
+                      createElementVNode(
+                        "div",
+                        _hoisted_13,
+                        toDisplayString(uploadTip.value),
+                        1
+                        /* TEXT */
+                      )
+                    ])) : (openBlock(), createElementBlock(
+                      Fragment,
+                      { key: 1 },
+                      [
+                        createCommentVNode(" \u5DF2\u4E0A\u4F20\u6587\u4EF6\u72B6\u6001 "),
+                        createElementVNode("div", _hoisted_14, [
+                          createVNode(_component_YcSvgIcon, {
+                            src: excelIconUrl.value,
+                            size: 48,
+                            "preserve-color": true,
+                            class: "excel-icon"
+                          }, null, 8, ["src"]),
+                          createElementVNode(
+                            "div",
+                            _hoisted_15,
+                            toDisplayString((_a = uploadedFile.value) == null ? void 0 : _a.name),
+                            1
+                            /* TEXT */
+                          ),
+                          createElementVNode("div", {
+                            class: "reupload-link",
+                            onClick: handleReupload
+                          }, "\u91CD\u65B0\u4E0A\u4F20")
+                        ])
+                      ],
+                      2112
+                      /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+                    ))
+                  ])
+                ])
+              ])) : createCommentVNode("v-if", true),
+              createCommentVNode(" \u4E0A\u4F20\u8BB0\u5F55\u6A21\u5757\uFF08\u4EC5\u5728\u521D\u59CB\u548C\u5DF2\u4E0A\u4F20\u72B6\u6001\u663E\u793A\uFF09 "),
+              importStatus.value === "initial" || importStatus.value === "uploaded" ? (openBlock(), createBlock(UploadRecordList, {
+                key: 2,
+                records: uploadRecords.value,
+                "icon-base-url": _ctx.iconBaseUrl,
+                onPause: handlePauseUpload,
+                onResume: handleResumeUpload,
+                onCancel: handleCancelUpload
+              }, null, 8, ["records", "icon-base-url"])) : createCommentVNode("v-if", true),
+              createCommentVNode(" \u5BFC\u5165\u4E2D\u72B6\u6001 "),
+              importStatus.value === "importing" ? (openBlock(), createElementBlock("div", _hoisted_16, [
+                createVNode(_component_el_icon, {
+                  class: "loading-icon",
+                  size: 44
+                }, {
+                  default: withCtx(() => [
+                    createVNode(unref(Loading))
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }),
+                _hoisted_17
+              ])) : createCommentVNode("v-if", true),
+              createCommentVNode(" \u5BFC\u5165\u6210\u529F\u72B6\u6001 "),
+              importStatus.value === "success" ? (openBlock(), createElementBlock("div", _hoisted_18, [
+                createVNode(_component_YcSvgIcon, {
+                  src: importSuccessIconUrl.value,
+                  size: 48,
+                  "preserve-color": true,
+                  class: "status-icon"
+                }, null, 8, ["src"]),
+                _hoisted_19,
+                createElementVNode("div", _hoisted_20, [
+                  createVNode(_component_YcSvgIcon, {
+                    src: excelIconUrl.value,
+                    size: 48,
+                    "preserve-color": true,
+                    class: "excel-icon"
+                  }, null, 8, ["src"]),
+                  createElementVNode(
+                    "div",
+                    _hoisted_21,
+                    toDisplayString((_b = uploadedFile.value) == null ? void 0 : _b.name),
+                    1
+                    /* TEXT */
+                  ),
+                  createElementVNode("div", { class: "action-links" }, [
+                    createElementVNode("span", {
+                      class: "link",
+                      onClick: handleReupload
+                    }, "\u91CD\u65B0\u4E0A\u4F20"),
+                    _hoisted_22,
+                    createElementVNode("span", {
+                      class: "link",
+                      onClick: handleDownloadResult
+                    }, "\u4E0B\u8F7D\u5BFC\u5165\u7ED3\u679C")
+                  ])
+                ])
+              ])) : createCommentVNode("v-if", true),
+              createCommentVNode(" \u5BFC\u5165\u5931\u8D25\u72B6\u6001 "),
+              importStatus.value === "error" ? (openBlock(), createElementBlock("div", _hoisted_23, [
+                createVNode(_component_YcSvgIcon, {
+                  src: importErrorIconUrl.value,
+                  size: 48,
+                  "preserve-color": true,
+                  class: "status-icon"
+                }, null, 8, ["src"]),
+                _hoisted_24,
+                createElementVNode("div", _hoisted_25, [
+                  createVNode(_component_YcSvgIcon, {
+                    src: excelIconUrl.value,
+                    size: 48,
+                    "preserve-color": true,
+                    class: "excel-icon"
+                  }, null, 8, ["src"]),
+                  createElementVNode(
+                    "div",
+                    _hoisted_26,
+                    toDisplayString((_c = uploadedFile.value) == null ? void 0 : _c.name),
+                    1
+                    /* TEXT */
+                  ),
+                  createElementVNode("div", { class: "action-links" }, [
+                    createElementVNode("span", {
+                      class: "link",
+                      onClick: handleReupload
+                    }, "\u91CD\u65B0\u4E0A\u4F20"),
+                    _hoisted_27,
+                    createElementVNode("span", {
+                      class: "link",
+                      onClick: handleDownloadResult
+                    }, "\u4E0B\u8F7D\u5BFC\u5165\u7ED3\u679C")
+                  ])
+                ])
+              ])) : createCommentVNode("v-if", true)
+            ])
+          ];
+        }),
+        _: 1
+        /* STABLE */
+      }, 8, ["modelValue", "title", "width"]);
+    };
+  }
+});
+
+export { _sfc_main as default };