@duxweb/dvha-pro 1.0.23 → 1.0.24

package/dist/esm/components/upload/file.js

@@ -1,11 +1,11 @@
-import { defineComponent as k, ref as D, computed as m, watch as M, createVNode as o, Fragment as U, createTextVNode as w, isVNode as A } from "vue";
-import { useI18n as Z, useUpload as j } from "@duxweb/dvha-core";
-import { useVModel as O, useDropZone as B } from "@vueuse/core";
-import X from "mime";
-import { useMessage as E, NDataTable as L, NProgress as T, NButton as x } from "naive-ui";
+import { defineComponent as z, ref as k, computed as s, watch as D, createVNode as o, Fragment as M, createTextVNode as U, isVNode as w } from "vue";
+import { useI18n as A, useUpload as Z } from "@duxweb/dvha-core";
+import { useVModel as j, useDropZone as O } from "@vueuse/core";
+import B from "mime";
+import { useMessage as X, NDataTable as E, NProgress as L, NButton as g } from "naive-ui";
 import "vue-router";
 import "@overlastic/vue";
-import { DuxMedia as I } from "../media/media.js";
+import { DuxMedia as T } from "../media/media.js";
 import "vue-echarts";
 import "vue-cropper";
 import "clsx";
@@ -27,7 +27,7 @@ import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
 import "../../pages/page404.js";
 import "@iconify-json/tabler/icons.json";
-import { useUploadConfig as W } from "./config.js";
+import { useUploadConfig as I } from "./config.js";
 import "vue3-ace-editor";
 import "ace-builds/src-noconflict/mode-vue";
 import "ace-builds/src-noconflict/mode-javascript";
@@ -39,14 +39,14 @@ import "ace-builds/src-noconflict/theme-tomorrow";
 import "ace-builds/src-noconflict/ext-searchbox";
 import "ace-builds/src-noconflict/ext-language_tools";
 import "ace-builds/src-noconflict/mode-snippets";
-import { useModal as G } from "../../hooks/modal.js";
+import { useModal as W } from "../../hooks/modal.js";
 import "dayjs";
 import "@tanstack/vue-query";
 import "pinia";
-function h(e) {
-  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !A(e);
+function v(e) {
+  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !w(e);
 }
-const d = {
+const m = {
   "image/*": "JPG, PNG, GIF, BMP, WEBP",
   "video/*": "MP4, AVI, MOV, WMV, FLV",
   "audio/*": "MP3, WAV, AAC, FLAC",
@@ -56,7 +56,7 @@ const d = {
   "application/vnd.openxmlformats-officedocument.wordprocessingml.document": "DOCX",
   "application/vnd.ms-excel": "XLS",
   "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": "XLSX"
-}, n = {
+}, r = {
   container: "flex flex-col gap-2",
   dropZone: {
     base: "flex items-center justify-center p-6 rounded bg-muted border border-dashed transition-all cursor-pointer group",
@@ -77,7 +77,7 @@ const d = {
     empty: "flex items-center justify-center h-full text-muted",
     actions: "flex gap-2"
   }
-}, Oe = /* @__PURE__ */ k({
+}, je = /* @__PURE__ */ z({
   name: "DuxFileUpload",
   props: {
     path: {
@@ -107,57 +107,56 @@ const d = {
     onUpdateValue: Function
   },
   setup(e, {
-    emit: v
+    emit: x
   }) {
-    const b = O(e, "value", v, {
+    const h = j(e, "value", x, {
       passive: !0,
       deep: !0,
       defaultValue: e.defaultValue
-    }), y = E(), {
+    }), b = X(), {
       t: a
-    } = Z(), u = D(), c = m(() => e.maxSize || 5), F = G(), {
-      uploadPath: p,
-      managePath: P,
-      driver: C
-    } = W({
-      driver: e == null ? void 0 : e.driver,
-      signPath: e == null ? void 0 : e.signPath,
-      signCallback: e == null ? void 0 : e.signCallback,
-      uploadPath: e == null ? void 0 : e.path,
-      managePath: e == null ? void 0 : e.managePath
-    }), r = j({
-      path: p.value,
+    } = A(), c = k(), p = s(() => e.maxSize || 5), y = W(), {
+      uploadPath: d,
+      managePath: F,
+      driver: P
+    } = I({
+      driver: e?.driver,
+      signPath: e?.signPath,
+      signCallback: e?.signCallback,
+      uploadPath: e?.path,
+      managePath: e?.managePath
+    }), n = Z({
+      path: d.value,
       multiple: e.multiple,
       maxFileCount: e.maxNum,
-      maxFileSize: c.value * 1024 * 1024,
+      maxFileSize: p.value * 1024 * 1024,
       autoUpload: !0,
       accept: e.accept,
-      onError: (t) => y.error(t.message || a("components.upload.error")),
-      driver: C.value
+      onError: (t) => b.error(t.message || a("components.upload.error")),
+      driver: P.value
     }), {
-      isOverDropZone: f
-    } = B(u, {
+      isOverDropZone: u
+    } = O(c, {
       onDrop: (t) => {
-        t && t.length > 0 && r.addFiles(Array.from(t), "file");
+        t && t.length > 0 && n.addFiles(Array.from(t), "file");
       }
     });
-    M(r.dataFiles, (t) => {
-      var l, s;
-      const i = e.multiple ? t == null ? void 0 : t.map((z) => z.url) : (l = t == null ? void 0 : t[0]) == null ? void 0 : l.url;
-      b.value = i, (s = e.onUpdateValue) == null || s.call(e, i);
+    D(n.dataFiles, (t) => {
+      const i = e.multiple ? t?.map((l) => l.url) : t?.[0]?.url;
+      h.value = i, e.onUpdateValue?.(i);
     });
-    const g = m(() => e.accept ? e.accept.split(",").map((t) => {
+    const f = s(() => e.accept ? e.accept.split(",").map((t) => {
       const i = t.trim();
-      if (d[i]) return d[i];
+      if (m[i]) return m[i];
       if (i.includes("*")) {
-        const s = i.split("/")[0];
-        return d[i] || a("common.fileExtension", {
-          ext: s.toUpperCase()
+        const V = i.split("/")[0];
+        return m[i] || a("common.fileExtension", {
+          ext: V.toUpperCase()
         });
       }
-      const l = X.getExtension(i);
+      const l = B.getExtension(i);
       return l ? l.toUpperCase() : i;
-    }).filter(Boolean).join(", ") : ""), S = m(() => ({
+    }).filter(Boolean).join(", ") : ""), C = s(() => ({
       pending: o("div", {
         class: "text-info"
       }, [a("components.upload.status.pending")]),
@@ -170,56 +169,56 @@ const d = {
       error: o("div", {
         class: "text-error"
       }, [a("components.upload.status.error")])
-    })), N = m(() => [n.dropZone.base, f.value ? n.dropZone.active : n.dropZone.hover]), V = m(() => [r.uploadFiles.value.length === 0 && "border-b border-muted"]);
+    })), S = s(() => [r.dropZone.base, u.value ? r.dropZone.active : r.dropZone.hover]), N = s(() => [n.uploadFiles.value.length === 0 && "border-b border-muted"]);
     return () => o("div", {
-      class: n.container
+      class: r.container
     }, [o("div", {
-      ref: u,
-      class: N.value,
-      onClick: () => r.open()
+      ref: c,
+      class: S.value,
+      onClick: () => n.open()
     }, [o("div", {
-      class: n.content
+      class: r.content
     }, [o("div", {
-      class: n.icon.wrapper,
+      class: r.icon.wrapper,
       onClick: (t) => {
-        e.manager && (t.stopPropagation(), F.show({
+        e.manager && (t.stopPropagation(), y.show({
           title: a("components.upload.title"),
           width: 800,
           component: () => import("./manager.js"),
           componentProps: {
-            path: P.value,
+            path: F.value,
             multiple: e.multiple,
             uploadParams: {
-              path: p.value,
+              path: d.value,
               accept: e.accept,
               maxNum: e.maxNum,
-              maxSize: c.value
+              maxSize: p.value
             }
           }
         }).then((i) => {
-          r.addDataFiles(i);
+          n.addDataFiles(i);
         }));
       }
     }, [o("div", {
-      class: n.icon.icon
+      class: r.icon.icon
     }, null)]), o("div", {
-      class: n.text.title
+      class: r.text.title
     }, [a("components.upload.desc")]), o("div", {
-      class: n.text.desc
-    }, [f.value ? o("span", {
-      class: n.text.highlight
-    }, [a("components.upload.dropHere")]) : o(U, null, [g.value ? a("components.upload.supportFormats", {
-      formats: g.value
-    }) : a("components.upload.allFormats"), w(","), " ", a("components.upload.maxSize", {
-      size: c.value
-    })])])])]), o(L, {
+      class: r.text.desc
+    }, [u.value ? o("span", {
+      class: r.text.highlight
+    }, [a("components.upload.dropHere")]) : o(M, null, [f.value ? a("components.upload.supportFormats", {
+      formats: f.value
+    }) : a("components.upload.allFormats"), U(","), " ", a("components.upload.maxSize", {
+      size: p.value
+    })])])])]), o(E, {
       bordered: !1,
-      class: V.value,
+      class: N.value,
       columns: [{
         key: "filename",
         title: a("components.upload.file.name"),
         minWidth: 200,
-        render: (t) => o(I, {
+        render: (t) => o(T, {
           title: t.filename,
           desc: t.filetype
         }, null)
@@ -231,21 +230,18 @@ const d = {
         key: "status",
         title: a("components.upload.file.status"),
         width: 120,
-        render: (t) => {
-          var i;
-          return t.status === "uploading" ? o(T, {
-            type: "line",
-            style: {
-              width: "24px",
-              height: "24px"
-            },
-            color: "rgb(var(--ui-color-primary))",
-            "indicator-placement": "inside",
-            percentage: (i = t.progress) == null ? void 0 : i.percent,
-            showIndicator: !1,
-            height: 14
-          }, null) : S.value[t.status];
-        }
+        render: (t) => t.status === "uploading" ? o(L, {
+          type: "line",
+          style: {
+            width: "24px",
+            height: "24px"
+          },
+          color: "rgb(var(--ui-color-primary))",
+          "indicator-placement": "inside",
+          percentage: t.progress?.percent,
+          showIndicator: !1,
+          height: 14
+        }, null) : C.value[t.status]
       }, {
         key: "actions",
         title: a("components.upload.actions"),
@@ -253,33 +249,33 @@ const d = {
         render: (t) => {
           let i, l;
           return o("div", {
-            class: n.table.actions
-          }, [o(x, {
+            class: r.table.actions
+          }, [o(g, {
             type: "warning",
             size: "small",
             text: !0,
             disabled: ["success", "error", "cancelled"].includes(t.status),
-            onClick: () => r.cancelFiles([t.id])
-          }, h(i = a("components.upload.cancel")) ? i : {
+            onClick: () => n.cancelFiles([t.id])
+          }, v(i = a("components.upload.cancel")) ? i : {
             default: () => [i]
-          }), o(x, {
+          }), o(g, {
             type: "error",
             size: "small",
             text: !0,
-            onClick: () => r.removeFiles([t.id])
-          }, h(l = a("components.upload.delete")) ? l : {
+            onClick: () => n.removeFiles([t.id])
+          }, v(l = a("components.upload.delete")) ? l : {
             default: () => [l]
           })]);
         }
       }],
-      data: r.uploadFiles.value
+      data: n.uploadFiles.value
     }, {
       empty: () => o("div", {
-        class: n.table.empty
+        class: r.table.empty
       }, [a("components.upload.empty")])
     })]);
   }
 });
 export {
-  Oe as DuxFileUpload
+  je as DuxFileUpload
 };

package/dist/esm/components/upload/image.js

@@ -1,9 +1,9 @@
-import { defineComponent as S, computed as n, watch as U, createVNode as t } from "vue";
-import { useI18n as k, useUpload as w } from "@duxweb/dvha-core";
-import { useVModel as I } from "@vueuse/core";
-import V from "clsx";
-import { useMessage as j, NImage as B, NButton as s, NProgress as D } from "naive-ui";
-import { VueDraggable as A } from "vue-draggable-plus";
+import { defineComponent as F, computed as i, watch as N, createVNode as t } from "vue";
+import { useI18n as S, useUpload as U } from "@duxweb/dvha-core";
+import { useVModel as k } from "@vueuse/core";
+import w from "clsx";
+import { useMessage as I, NImage as V, NButton as s, NProgress as j } from "naive-ui";
+import { VueDraggable as B } from "vue-draggable-plus";
 import "vue-router";
 import "@overlastic/vue";
 import "vue-echarts";
@@ -26,7 +26,7 @@ import "@duxweb/dvha-naiveui";
 import "../../pages/page404.js";
 import "@iconify-json/tabler/icons.json";
 import "mime";
-import { useUploadConfig as M } from "./config.js";
+import { useUploadConfig as D } from "./config.js";
 import "vue3-ace-editor";
 import "ace-builds/src-noconflict/mode-vue";
 import "ace-builds/src-noconflict/mode-javascript";
@@ -38,12 +38,12 @@ import "ace-builds/src-noconflict/theme-tomorrow";
 import "ace-builds/src-noconflict/ext-searchbox";
 import "ace-builds/src-noconflict/ext-language_tools";
 import "ace-builds/src-noconflict/mode-snippets";
-import { useModal as L } from "../../hooks/modal.js";
+import { useModal as A } from "../../hooks/modal.js";
 import "dayjs";
-import { useImagePreview as O } from "../../hooks/image.js";
+import { useImagePreview as M } from "../../hooks/image.js";
 import "@tanstack/vue-query";
 import "pinia";
-const Ie = /* @__PURE__ */ S({
+const ke = /* @__PURE__ */ F({
   name: "DuxImageUpload",
   props: {
     path: {
@@ -75,15 +75,15 @@ const Ie = /* @__PURE__ */ S({
     onUpdateValue: Function
   },
   setup(e, {
-    emit: c
+    emit: d
   }) {
-    const g = I(e, "value", c, {
+    const c = k(e, "value", d, {
       passive: !0,
       deep: !0,
       defaultValue: e.defaultValue
-    }), p = j(), v = O(), {
-      t: m
-    } = k(), i = {
+    }), p = I(), g = M(), {
+      t: u
+    } = S(), l = {
       container: "flex gap-2",
       imageItem: "size-80px rounded border border-muted relative group draggable flex items-center",
       imageOverlay: "z-1 size-full inset-0 absolute flex items-center justify-center bg-default/80 transition-all opacity-0 group-hover:opacity-100 rounded",
@@ -91,129 +91,122 @@ const Ie = /* @__PURE__ */ S({
       uploadContent: "flex-1 flex flex-col justify-center items-center gap-1 relative",
       progressContainer: "size-80px flex items-center justify-center rounded",
       progressBar: "absolute left-2 right-2 bottom-2"
-    }, h = n(() => e.maxSize), {
-      uploadPath: d,
-      managePath: f,
-      driver: b
-    } = M({
-      driver: e == null ? void 0 : e.driver,
-      signPath: e == null ? void 0 : e.signPath,
-      signCallback: e == null ? void 0 : e.signCallback,
-      uploadPath: e == null ? void 0 : e.path,
-      managePath: e == null ? void 0 : e.managePath
-    }), l = w({
-      path: d.value,
+    }, v = i(() => e.maxSize), {
+      uploadPath: m,
+      managePath: h,
+      driver: f
+    } = D({
+      driver: e?.driver,
+      signPath: e?.signPath,
+      signCallback: e?.signCallback,
+      uploadPath: e?.path,
+      managePath: e?.managePath
+    }), r = U({
+      path: m.value,
       multiple: e.multiple,
       maxFileCount: e.maxNum,
-      maxFileSize: h.value * 1024 * 1024,
+      maxFileSize: v.value * 1024 * 1024,
       autoUpload: !0,
       accept: "image/*",
       onError: (a) => {
-        p.error(a.message || m("components.upload.error"));
+        p.error(a.message || u("components.upload.error"));
       },
-      driver: b.value
+      driver: f.value
     });
-    U(l.dataFiles, (a) => {
-      var o, u;
-      const r = e.multiple ? a == null ? void 0 : a.map((N) => N.url) : (o = a == null ? void 0 : a[0]) == null ? void 0 : o.url;
-      g.value = r, (u = e.onUpdateValue) == null || u.call(e, r);
+    N(r.dataFiles, (a) => {
+      const o = e.multiple ? a?.map((n) => n.url) : a?.[0]?.url;
+      c.value = o, e.onUpdateValue?.(o);
     });
-    const x = n(() => l.progress.value.totalPercent), y = n(() => l.isUploading.value), z = async () => {
-      l.open();
-    }, P = n(() => e.multiple ? e.maxNum && l.uploadFiles.value.length >= e.maxNum : !0), C = n(() => {
-      var a;
-      return (a = l.dataFiles.value) == null ? void 0 : a.map((r) => r.url);
-    }), F = L();
-    return () => t("div", null, [t(A, {
-      modelValue: l.uploadFiles.value,
-      "onUpdate:modelValue": (a) => l.uploadFiles.value = a,
-      class: i.container,
+    const b = i(() => r.progress.value.totalPercent), x = i(() => r.isUploading.value), y = async () => {
+      r.open();
+    }, z = i(() => e.multiple ? e.maxNum && r.uploadFiles.value.length >= e.maxNum : !0), P = i(() => r.dataFiles.value?.map((a) => a.url)), C = A();
+    return () => t("div", null, [t(B, {
+      modelValue: r.uploadFiles.value,
+      "onUpdate:modelValue": (a) => r.uploadFiles.value = a,
+      class: l.container,
       draggable: ".draggable"
     }, {
-      default: () => {
-        var a;
-        return [(a = l.uploadFiles.value) == null ? void 0 : a.map((r, o) => {
-          const u = r.url || URL.createObjectURL(r.file);
-          return t("div", {
-            key: o,
-            class: V(i.imageItem)
-          }, [t(B, {
-            class: "z-0 rounded",
-            objectFit: "scale-down",
-            width: 78,
-            height: 78,
-            previewDisabled: !0,
-            src: u
-          }, null), t("div", {
-            class: i.imageOverlay
-          }, [r.status === "success" && t(s, {
-            quaternary: !0,
-            circle: !0,
-            size: "small",
-            renderIcon: () => t("div", {
-              class: "n-icon i-tabler:eye"
-            }, null),
-            onClick: () => v.show(C.value, o)
-          }, null), t(s, {
-            quaternary: !0,
-            circle: !0,
-            size: "small",
-            renderIcon: () => t("div", {
-              class: "n-icon i-tabler:trash"
-            }, null),
-            onClick: () => {
-              l.removeFiles([r.id]);
-            }
-          }, null)])]);
-        }), (l.uploadFiles.value.length === 0 || !P.value) && t("div", {
-          class: i.uploadArea,
+      default: () => [r.uploadFiles.value?.map((a, o) => {
+        const n = a.url || URL.createObjectURL(a.file);
+        return t("div", {
+          key: o,
+          class: w(l.imageItem)
+        }, [t(V, {
+          class: "z-0 rounded",
+          objectFit: "scale-down",
+          width: 78,
+          height: 78,
+          previewDisabled: !0,
+          src: n
+        }, null), t("div", {
+          class: l.imageOverlay
+        }, [a.status === "success" && t(s, {
+          quaternary: !0,
+          circle: !0,
+          size: "small",
+          renderIcon: () => t("div", {
+            class: "n-icon i-tabler:eye"
+          }, null),
+          onClick: () => g.show(P.value, o)
+        }, null), t(s, {
+          quaternary: !0,
+          circle: !0,
+          size: "small",
+          renderIcon: () => t("div", {
+            class: "n-icon i-tabler:trash"
+          }, null),
           onClick: () => {
-            z();
+            r.removeFiles([a.id]);
           }
-        }, [e.manager && t("div", {
-          class: " py-1 text-xs bg-muted border-b border-dashed border-accented flex items-center justify-center",
-          onClick: (r) => {
-            r.stopPropagation(), F.show({
-              title: m("components.upload.title"),
-              width: "800px",
-              component: () => import("./manager.js"),
-              componentProps: {
-                path: f.value,
-                type: "image",
-                multiple: e.multiple,
-                uploadParams: {
-                  path: d.value,
-                  accept: "image/*",
-                  maxNum: e.maxNum,
-                  maxSize: e.maxSize
-                }
+        }, null)])]);
+      }), (r.uploadFiles.value.length === 0 || !z.value) && t("div", {
+        class: l.uploadArea,
+        onClick: () => {
+          y();
+        }
+      }, [e.manager && t("div", {
+        class: " py-1 text-xs bg-muted border-b border-dashed border-accented flex items-center justify-center",
+        onClick: (a) => {
+          a.stopPropagation(), C.show({
+            title: u("components.upload.title"),
+            width: "800px",
+            component: () => import("./manager.js"),
+            componentProps: {
+              path: h.value,
+              type: "image",
+              multiple: e.multiple,
+              uploadParams: {
+                path: m.value,
+                accept: "image/*",
+                maxNum: e.maxNum,
+                maxSize: e.maxSize
               }
-            }).then((o) => {
-              l.addDataFiles(o);
-            });
-          }
-        }, [t("div", {
-          class: "i-tabler:folder size-4"
-        }, null)]), t("div", {
-          class: i.uploadContent
-        }, [y.value ? t("div", {
-          class: i.progressContainer
-        }, [t("div", {
-          class: "i-tabler:photo size-6"
-        }, null), t("div", {
-          class: i.progressBar
-        }, [t(D, {
-          type: "line",
-          percentage: x.value,
-          showIndicator: !1,
-          height: 4
-        }, null)])]) : t("div", {
-          class: "i-tabler:plus size-4"
-        }, null)])])];
-      }
+            }
+          }).then((o) => {
+            r.addDataFiles(o);
+          });
+        }
+      }, [t("div", {
+        class: "i-tabler:folder size-4"
+      }, null)]), t("div", {
+        class: l.uploadContent
+      }, [x.value ? t("div", {
+        class: l.progressContainer
+      }, [t("div", {
+        class: "i-tabler:photo size-6"
+      }, null), t("div", {
+        class: l.progressBar
+      }, [t(j, {
+        type: "line",
+        percentage: b.value,
+        showIndicator: !1,
+        height: 4
+      }, null)])]) : t("div", {
+        class: "i-tabler:plus size-4"
+      }, null)])])]
     })]);
   }
 });
 export {
-  Ie as DuxImageUpload
+  ke as DuxImageUpload
 };