@king-one/antdv 1.2.21 → 2.0.0

package/dist/es/components/pro-upload/src/gd-upload.mjs

@@ -1,179 +1,222 @@
-import { defineComponent as D, provide as H, reactive as R, ref as h, watch as j, computed as J, createVNode as r, Fragment as v } from "vue";
-import { Form as O, message as y, Upload as $, Spin as q } from "ant-design-vue";
-import { useNamespace as T } from "../../../hooks/use-namespace/index.mjs";
-import { KIcon as G } from "../../icon/index.mjs";
-import { UploadComponentProps as K } from "./props.mjs";
-import { getFileExtension as x, getUploadIcon as U } from "./utils/index.mjs";
-import { UploadContextKey as P } from "./types.mjs";
+import { defineComponent, ref, watch, computed, createVNode, Fragment } from "vue";
+import { message, Upload, Spin } from "ant-design-vue";
+import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
+import { KIcon } from "../../icon/index.mjs";
+import { UploadComponentProps } from "./props.mjs";
+import { getFileExtension, getUploadIcon } from "./utils/index.mjs";
 import "./hooks/index.mjs";
-import E from "./file-list.mjs";
-import { useUpload as M } from "./hooks/useUpload.mjs";
-const te = /* @__PURE__ */ D({
+import FileList from "./file-list.mjs";
+import { useUpload } from "./hooks/useUpload.mjs";
+const GdUpload = /* @__PURE__ */ defineComponent({
   name: "GdUpload",
-  props: K,
+  props: UploadComponentProps,
   emits: {
-    "update:fileList": (e) => !0,
-    "upload-success": (e) => e,
-    change: (e) => e,
-    "upload-error": (e) => e,
-    "delete-success": (e, l) => !0
+    "update:fileList": (val) => true,
+    "upload-success": (fileList) => fileList,
+    "change": (fileList) => fileList,
+    "upload-error": (err) => err,
+    "delete-success": (fileList, delItem) => true
   },
-  setup(e, {
-    emit: l
+  setup(props, {
+    emit
   }) {
     const {
-      uploadFile: b,
-      getFileDetails: F,
-      getImgUrl: N
-    } = M(e.http, e.prefix), p = O.useInjectFormItemContext();
-    H(P, R({
-      prefix: e.prefix
-    }));
+      uploadFile,
+      getFileDetails,
+      getImgUrl
+    } = useUpload(props.http, props.prefix);
     const {
-      b: C
-    } = T("pro-upload"), m = h(!1), o = h([]), g = h(!1), L = async (t) => {
-      const i = t == null ? void 0 : t.map((s) => s.id);
-      if (!(i != null && i.length)) return;
-      const a = [], u = t.filter((s) => s.icon), c = t.filter((s) => !s.icon);
-      if (a.push(...u), c.length > 0) {
-        const s = await F(c.map((n) => n.id));
-        for (const n of s.data) {
-          const d = x(n.originName), f = U(d);
-          if (f === "img") {
-            const z = await N([n.id]);
-            a.push({
-              id: n.id,
-              icon: z[n.id],
-              fileName: n.originName,
-              spining: !1,
-              type: f
+      b
+    } = useNamespace("pro-upload");
+    const spining = ref(false);
+    const localFileList = ref([]);
+    const isUpdating = ref(false);
+    const updateFileList = async (list) => {
+      const ids = list == null ? void 0 : list.map((item) => item.id);
+      if (!(ids == null ? void 0 : ids.length)) return;
+      const files = [];
+      const existingFiles = list.filter((item) => item.icon);
+      const filesNeedUrl = list.filter((item) => !item.icon);
+      files.push(...existingFiles);
+      if (filesNeedUrl.length > 0) {
+        const res = await getFileDetails(filesNeedUrl.map((item) => item.id));
+        for (const item of res.data) {
+          const extension = getFileExtension(item.originName);
+          const iconType = getUploadIcon(extension);
+          if (iconType === "img") {
+            const processedItem = await getImgUrl([item.id]);
+            files.push({
+              id: item.id,
+              icon: processedItem[item.id],
+              fileName: item.originName,
+              spining: false,
+              type: iconType
             });
-          } else
-            a.push({
-              id: n.id,
-              icon: f,
-              fileName: n.originName,
-              spining: !1,
-              type: f
+          } else {
+            files.push({
+              id: item.id,
+              icon: iconType,
+              fileName: item.originName,
+              spining: false,
+              type: iconType
             });
+          }
         }
       }
-      JSON.stringify(a) !== JSON.stringify(o.value) && (o.value = a, l("update:fileList", a), p.onFieldChange());
+      if (JSON.stringify(files) !== JSON.stringify(localFileList.value)) {
+        localFileList.value = files;
+        emit("update:fileList", files);
+      }
     };
-    j(() => e.fileList, async (t, i) => {
-      if (g.value) return;
-      if (!(t != null && t.length)) {
-        o.value = [];
+    watch(() => props.fileList, async (newVal, oldVal) => {
+      if (isUpdating.value) return;
+      if (!(newVal == null ? void 0 : newVal.length)) {
+        localFileList.value = [];
         return;
       }
-      (!(i != null && i.length) || JSON.stringify(t) !== JSON.stringify(i)) && (g.value = !0, o.value = t, await L(t), g.value = !1);
+      const needUpdate = !(oldVal == null ? void 0 : oldVal.length) || JSON.stringify(newVal) !== JSON.stringify(oldVal);
+      if (needUpdate) {
+        isUpdating.value = true;
+        localFileList.value = newVal;
+        await updateFileList(newVal);
+        isUpdating.value = false;
+      }
     }, {
-      immediate: !0,
-      deep: !0
+      immediate: true,
+      deep: true
+    });
+    const uploadDisabled = computed(() => {
+      var _a;
+      if (props.disabled) return true;
+      if (((_a = props.fileList) == null ? void 0 : _a.length) === props.maxCount) return true;
     });
-    const I = J(() => {
-      var t;
-      if (e.disabled || ((t = e.fileList) == null ? void 0 : t.length) === e.maxCount) return !0;
-    }), S = async (t, i) => {
-      var n;
-      if (e.beforeUpload) {
-        const d = e.beforeUpload(t, i);
-        if (d instanceof Promise) {
-          if (await d === !1) return !1;
-        } else if (!d) return !1;
+    const beforeUpload = async (file, fileList) => {
+      var _a;
+      if (props.beforeUpload) {
+        const result = props.beforeUpload(file, fileList);
+        if (result instanceof Promise) {
+          const res = await result;
+          if (res === false) return false;
+        } else {
+          if (!result) return false;
+        }
       }
       const {
-        name: a,
-        size: u
-      } = t, c = x(a), s = u / 1024 / 1024;
-      return e.accept && e.accept.length > 0 && !e.accept.includes(c) ? (y.warning(`只能上传${(n = e.accept) == null ? void 0 : n.join(".")}后缀的文件！`), !1) : s > e.maxSize ? (y.warning(`上传的文件不能大于${e.maxSize}M！`), !1) : !0;
-    }, w = async (t) => {
+        name,
+        size
+      } = file;
+      const extension = getFileExtension(name);
+      const maxSize = size / 1024 / 1024;
+      if (props.accept && props.accept.length > 0 && !props.accept.includes(extension)) {
+        message.warning(`只能上传${(_a = props.accept) == null ? void 0 : _a.join(".")}后缀的文件！`);
+        return false;
+      }
+      if (maxSize > props.maxSize) {
+        message.warning(`上传的文件不能大于${props.maxSize}M！`);
+        return false;
+      }
+      return true;
+    };
+    const handleUploadRequest = async (options) => {
       try {
         const {
-          file: i
-        } = t;
-        m.value = !0;
-        const a = await b({
-          business: e.business,
-          file: i
+          file
+        } = options;
+        spining.value = true;
+        const res = await uploadFile({
+          business: props.business,
+          file
         });
-        if (m.value = !1, !a) return;
-        const u = x(a.originName), c = U(u);
-        let s;
-        c === "img" ? s = {
-          icon: "",
-          id: a.id,
-          type: c,
-          spining: !1,
-          fileName: t.file.name
-        } : s = {
-          icon: c,
-          id: a.id,
-          type: c,
-          spining: !1,
-          fileName: t.file.name
-        };
-        const n = [...o.value, s];
-        o.value = n, l("update:fileList", n), p.onFieldChange(), l("upload-success", n), l("change", n);
-      } catch (i) {
-        m.value = !1, l("upload-error", i);
+        spining.value = false;
+        if (!res) return;
+        const extension = getFileExtension(res.originName);
+        const iconType = getUploadIcon(extension);
+        let newFile;
+        if (iconType === "img") {
+          newFile = {
+            icon: "",
+            id: res.id,
+            type: iconType,
+            spining: false,
+            fileName: options.file.name
+          };
+        } else {
+          newFile = {
+            icon: iconType,
+            id: res.id,
+            type: iconType,
+            spining: false,
+            fileName: options.file.name
+          };
+        }
+        const newFileList = [...localFileList.value, newFile];
+        localFileList.value = newFileList;
+        emit("update:fileList", newFileList);
+        emit("upload-success", newFileList);
+        emit("change", newFileList);
+      } catch (err) {
+        spining.value = false;
+        emit("upload-error", err);
       }
-    }, W = (t, i) => {
-      l("change", t), l("update:fileList", t), p.onFieldChange(), l("delete-success", t, i);
+    };
+    const handleDelSuccess = (list, delItem) => {
+      emit("change", list);
+      emit("update:fileList", list);
+      emit("delete-success", list, delItem);
     };
     return () => {
-      var t, i;
-      return r("div", {
-        class: C(),
-        style: {
+      var _a, _b;
+      return createVNode("div", {
+        "class": b(),
+        "style": {
           display: "flex",
           flexWrap: "wrap",
           alignContent: "space-between"
         }
-      }, [r(E, {
-        http: e.http,
-        itemWidth: e.itemWidth,
-        itemHeight: e.itemHeight,
-        list: o.value,
-        "onUpdate:list": (a) => o.value = a,
-        "onDel-success": W
-      }, null, 8, ["http", "itemWidth", "itemHeight", "list", "onUpdate:list", "onDel-success"]), (((t = o.value) == null ? void 0 : t.length) ?? 0) < (e.maxCount ?? 20) ? r($, {
-        accept: (i = e.accept) == null ? void 0 : i.join(","),
-        disabled: I.value,
-        customRequest: w,
-        beforeUpload: S,
-        style: {
+      }, [createVNode(FileList, {
+        "http": props.http,
+        "itemWidth": props.itemWidth,
+        "itemHeight": props.itemHeight,
+        "list": localFileList.value,
+        "onUpdate:list": ($event) => localFileList.value = $event,
+        "onDel-success": handleDelSuccess
+      }, null, 8, ["http", "itemWidth", "itemHeight", "list", "onUpdate:list", "onDel-success"]), (((_a = localFileList.value) == null ? void 0 : _a.length) ?? 0) < (props.maxCount ?? 20) ? createVNode(Upload, {
+        "accept": (_b = props.accept) == null ? void 0 : _b.join(","),
+        "disabled": uploadDisabled.value,
+        "customRequest": handleUploadRequest,
+        "beforeUpload": beforeUpload,
+        "style": {
           marginTop: "5px"
         }
       }, {
-        default: () => r(q, {
-          spinning: m.value
+        default: () => createVNode(Spin, {
+          "spinning": spining.value
         }, {
-          default: () => [r("div", {
-            style: {
-              width: `${e.itemWidth}px`,
-              height: `${e.itemHeight}px`,
+          default: () => [createVNode("div", {
+            "style": {
+              width: `${props.itemWidth}px`,
+              height: `${props.itemHeight}px`,
               minWidth: "80px",
               minHeight: "80px",
               cursor: "pointer",
-              border: "1px dashed #3296fa",
+              border: `1px dashed #3296fa`,
               display: "flex",
               alignItems: "center",
               justifyContent: "center",
               borderRadius: "5px"
             }
-          }, [r(G, {
-            name: "upload-icon",
-            color: "#3296fa",
-            size: 32
+          }, [createVNode(KIcon, {
+            "name": "upload-icon",
+            "color": "#3296fa",
+            "size": 32
           }, null)], 4)]
         }, 8, ["spinning"]),
-        itemRender: () => r(v, null, null),
+        itemRender: () => createVNode(Fragment, null, null),
         _: 1
-      }, 8, ["accept", "disabled", "customRequest", "beforeUpload"]) : r(v, null, null)], 2);
+      }, 8, ["accept", "disabled", "customRequest", "beforeUpload"]) : createVNode(Fragment, null, null)], 2);
     };
   }
 });
 export {
-  te as default
+  GdUpload as default
 };

package/dist/es/components/pro-upload/src/hooks/index.mjs

@@ -1,6 +1,6 @@
-import { useHttp as p } from "./useHttp.mjs";
-import { useUpload as t } from "./useUpload.mjs";
+import { useHttp } from "./useHttp.mjs";
+import { useUpload } from "./useUpload.mjs";
 export {
-  p as useHttp,
-  t as useUpload
+  useHttp,
+  useUpload
 };

package/dist/es/components/pro-upload/src/hooks/useHttp.mjs

@@ -1,23 +1,23 @@
-function a(l, o) {
+function useHttp(http, prefix) {
   return {
     // 获取文件上传的地址
-    getUploadUrl: (e) => l.get(`${o}/file/aio/upload/url`, e),
+    getUploadUrl: (config) => http.get(`${prefix}/file/aio/upload/url`, config),
     // 文件上传
-    uploadFileApi: (e, i) => l.post(e, i, {
+    uploadFileApi: (url, config) => http.post(url, config, {
       headers: {
         "Content-Type": "multipart/form-data"
       }
     }),
     // 删除文件
-    deleteFileApi: (e) => l.delete(`${o}/file/aio`, e),
+    deleteFileApi: (config) => http.delete(`${prefix}/file/aio`, config),
     // 获取文件下载地址
-    getDownloadUrlApi: (e) => l.post(`${o}/file/aio/download/url`, e),
+    getDownloadUrlApi: (config) => http.post(`${prefix}/file/aio/download/url`, config),
     // 下载文件
-    downloadFileApi: (e, i) => l.get(e, i),
+    downloadFileApi: (url, config) => http.get(url, config),
     // 获取文件详情
-    getFileDetailApi: (e) => l.post(`${o}/aio/batch/info`, e)
+    getFileDetailApi: (config) => http.post(`${prefix}/aio/batch/info`, config)
   };
 }
 export {
-  a as useHttp
+  useHttp
 };

package/dist/es/components/pro-upload/src/hooks/useUpload.mjs

@@ -1,55 +1,85 @@
-import { message as o } from "ant-design-vue";
-import { useHttp as p } from "./useHttp.mjs";
-function w(d, c) {
-  const r = p(d, c);
+import { message } from "ant-design-vue";
+import { useHttp } from "./useHttp.mjs";
+function useUpload(httpConfig, prefix) {
+  const http = useHttp(httpConfig, prefix);
   return {
     // 文件上传
-    uploadFile: (s) => new Promise(async (a, t) => {
+    uploadFile: (config) => new Promise(async (resolve, reject) => {
       try {
-        const e = await r.getUploadUrl({
-          params: { business: s.business }
+        const res = await http.getUploadUrl({
+          params: { business: config.business }
         });
-        if (e.status === 0) {
-          const n = e.data, i = new FormData();
-          i.append("file", s.file);
-          const l = await r.uploadFileApi(`${c}${n}`, i);
-          l.status === 0 ? (o.success("文件上传成功~"), a(l.data)) : (o.error(l.msg), t(l));
-        } else
-          o.error(e.msg), t(e);
-      } catch (e) {
-        console.log(e), o.error("文件上传失败，请联系管理员进行查看！"), t(e);
+        if (res.status === 0) {
+          const path = res.data;
+          const formData = new FormData();
+          formData.append("file", config.file);
+          const uploadRes = await http.uploadFileApi(path, formData);
+          if (uploadRes.status === 0) {
+            message.success("文件上传成功~");
+            resolve(uploadRes.data);
+          } else {
+            message.error(uploadRes.msg);
+            reject(uploadRes);
+          }
+        } else {
+          message.error(res.msg);
+          reject(res);
+        }
+      } catch (err) {
+        console.log(err);
+        message.error("文件上传失败，请联系管理员进行查看！");
+        reject(err);
       }
     }),
     // 文件下载
-    downloadFile: (s) => new Promise(async (a, t) => {
+    downloadFile: (config) => new Promise(async (resolve, reject) => {
       try {
-        const e = s[0], n = await r.getDownloadUrlApi(s);
-        if (n.status === 0) {
-          const i = n.data[e];
-          window.open(i), a(!0);
+        const fileId = config[0];
+        const res = await http.getDownloadUrlApi(config);
+        if (res.status === 0) {
+          const downloadUrl = res.data[fileId];
+          window.open(downloadUrl);
+          resolve(true);
         }
-        a(!1);
-      } catch (e) {
-        t(e);
+        resolve(false);
+      } catch (err) {
+        reject(err);
       }
     }),
     // 获取图片的url
-    getImgUrl: (s) => new Promise(async (a, t) => {
-      const e = await r.getDownloadUrlApi(s);
-      e.status === 0 ? a(e.data) : t(e);
-    }),
+    getImgUrl: (config) => {
+      return new Promise(async (resolve, reject) => {
+        const res = await http.getDownloadUrlApi(config);
+        if (res.status === 0) {
+          resolve(res.data);
+        } else {
+          reject(res);
+        }
+      });
+    },
     // 获取文件详情
-    getFileDetails: async (s) => new Promise(async (a, t) => {
-      r.getFileDetailApi({ fileIds: s }).then((e) => {
-        e.status === 0 ? a(e) : (o.error(e.msg), t(e));
-      }).catch((e) => {
-        o.error(e), t(e);
+    getFileDetails: async (config) => {
+      return new Promise(async (resolve, reject) => {
+        http.getFileDetailApi({ fileIds: config }).then((res) => {
+          if (res.status === 0) {
+            resolve(res);
+          } else {
+            message.error(res.msg);
+            reject(res);
+          }
+        }).catch((err) => {
+          message.error(err);
+          reject(err);
+        });
       });
-    }),
+    },
     // 删除文件
-    removeFile: async (s) => await r.deleteFileApi({ params: { fileId: s } })
+    removeFile: async (fileId) => {
+      const res = await http.deleteFileApi({ params: { fileId } });
+      return res;
+    }
   };
 }
 export {
-  w as useUpload
+  useUpload
 };

package/dist/es/components/pro-upload/src/props.mjs

@@ -1,4 +1,4 @@
-const e = {
+const UploadComponentProps = {
   uploadName: {
     type: String
   },
@@ -7,14 +7,14 @@ const e = {
   },
   business: {
     type: String,
-    required: !0
+    required: true
   },
   proxyPrefix: {
     type: String
   },
   fileList: {
     type: Array,
-    required: !0,
+    required: true,
     default: () => []
   },
   accept: {
@@ -22,7 +22,7 @@ const e = {
   },
   disabled: {
     type: Boolean,
-    default: !1
+    default: false
   },
   maxSize: {
     type: Number,
@@ -34,7 +34,7 @@ const e = {
   },
   http: {
     type: [Object, Function],
-    required: !0
+    required: true
   },
   itemWidth: {
     type: Number,
@@ -50,5 +50,5 @@ const e = {
   }
 };
 export {
-  e as UploadComponentProps
+  UploadComponentProps
 };

package/dist/es/components/pro-upload/src/types.mjs

@@ -1,4 +1 @@
-const o = Symbol("UploadContextKey");
-export {
-  o as UploadContextKey
-};
+

package/dist/es/components/pro-upload/src/utils/index.mjs

@@ -1,33 +1,46 @@
-import { iconTypes as a } from "../data.mjs";
-function i(n) {
-  const e = n.lastIndexOf(".");
-  return e !== -1 ? `.${n.substring(e + 1)}` : "";
+import { iconTypes } from "../data.mjs";
+function getFileExtension(filename) {
+  const index = filename.lastIndexOf(".");
+  if (index !== -1) {
+    return `.${filename.substring(index + 1)}`;
+  }
+  return "";
 }
-function l(n) {
-  const [e, t] = n.split("?"), r = t ? Object.fromEntries(new URLSearchParams(t)) : {};
-  return { path: e, params: r };
+function parseUrl(url) {
+  const [path, query] = url.split("?");
+  const params = query ? Object.fromEntries(new URLSearchParams(query)) : {};
+  return { path, params };
 }
-function s(n) {
-  for (const e in a)
-    for (let t = 0; t < a[e].value.length; t++)
-      if (a[e].value[t] === n)
-        return a[e].url;
-  return a.materials.url;
+function getUploadIcon(extension) {
+  for (const key in iconTypes) {
+    for (let i = 0; i < iconTypes[key].value.length; i++) {
+      if (iconTypes[key].value[i] === extension) {
+        return iconTypes[key].url;
+      }
+    }
+  }
+  return iconTypes.materials.url;
 }
-function u(n) {
-  return new Promise((e, t) => {
-    const r = new FileReader();
-    r.readAsDataURL(n), r.onload = () => e(r.result), r.onerror = (o) => t(o);
+function getBase64(file) {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.readAsDataURL(file);
+    reader.onload = () => resolve(reader.result);
+    reader.onerror = (error) => reject(error);
   });
 }
-function d(n, e, t) {
-  const r = new Blob([n], { type: t }), o = document.createElement("a");
-  o.href = URL.createObjectURL(r), o.download = e, o.click(), URL.revokeObjectURL(o.href);
+function getDownloadFile(blob, fileName, fileType) {
+  const blobObject = new Blob([blob], { type: fileType });
+  const downloadLink = document.createElement("a");
+  downloadLink.href = URL.createObjectURL(blobObject);
+  downloadLink.download = fileName;
+  downloadLink.click();
+  URL.revokeObjectURL(downloadLink.href);
 }
 export {
-  u as getBase64,
-  d as getDownloadFile,
-  i as getFileExtension,
-  s as getUploadIcon,
-  l as parseUrl
+  getBase64,
+  getDownloadFile,
+  getFileExtension,
+  getUploadIcon,
+  parseUrl
 };