z-crud-table 0.0.22 → 0.0.23

package/dist/components/CrudTable.vue.d.ts

@@ -37,6 +37,10 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<im
         type: BooleanConstructor;
         default: boolean;
     };
+    showSearchActionButtons: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     showNewBtn: {
         type: BooleanConstructor;
         default: boolean;
@@ -183,6 +187,10 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<im
         type: BooleanConstructor;
         default: boolean;
     };
+    showSearchActionButtons: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     showNewBtn: {
         type: BooleanConstructor;
         default: boolean;
@@ -290,6 +298,7 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<im
     customClass: string;
     theme: "default" | "large-screen";
     showSearchSection: boolean;
+    showSearchActionButtons: boolean;
     showNewBtn: boolean;
     columns: any[];
     showSelectionColumn: boolean;

package/dist/z-crud-table.js

@@ -1,5 +1,5 @@
-import { defineComponent as H, ref as A, resolveComponent as g, createBlock as p, openBlock as n, mergeProps as _, withCtx as u, createElementBlock as w, Fragment as $, renderList as q, createCommentVNode as m, createTextVNode as v, toDisplayString as re, computed as j, reactive as T, onMounted as ne, resolveDirective as ie, normalizeClass as se, renderSlot as y, withDirectives as W, createVNode as h, createElementVNode as E, createSlots as ue } from "vue";
-import { ElMessage as F } from "element-plus";
+import { defineComponent as H, ref as F, resolveComponent as g, createBlock as p, openBlock as n, mergeProps as _, withCtx as u, createElementBlock as b, Fragment as V, renderList as q, createCommentVNode as m, createTextVNode as v, toDisplayString as re, computed as j, reactive as T, onMounted as ne, resolveDirective as ie, normalizeClass as se, renderSlot as y, withDirectives as W, createVNode as w, createElementVNode as E, createSlots as ue } from "vue";
+import { ElMessage as $ } from "element-plus";
 import de from "axios";
 const pe = /* @__PURE__ */ H({
   __name: "DynamicForm",
@@ -8,34 +8,34 @@ const pe = /* @__PURE__ */ H({
     formConfig: {},
     rules: {}
   },
-  setup(c, { expose: D }) {
-    const z = A(null);
-    return D({
+  setup(c, { expose: k }) {
+    const z = F(null);
+    return k({
       validate: () => {
         var s;
         return (s = z.value) == null ? void 0 : s.validate();
       }
-    }), (s, t) => {
-      const B = g("el-input"), Q = g("el-option"), S = g("el-select"), N = g("el-radio"), f = g("el-radio-group"), k = g("el-form-item"), U = g("el-form");
-      return n(), p(U, _({
+    }), (s, e) => {
+      const A = g("el-input"), Q = g("el-option"), S = g("el-select"), N = g("el-radio"), f = g("el-radio-group"), D = g("el-form-item"), B = g("el-form");
+      return n(), p(B, _({
         model: s.modelValue,
         rules: s.rules,
         ref_key: "formRef",
         ref: z
       }, s.$attrs), {
         default: u(() => [
-          (n(!0), w($, null, q(s.formConfig, (r) => (n(), p(k, {
+          (n(!0), b(V, null, q(s.formConfig, (r) => (n(), p(D, {
             key: r.prop,
             label: r.label,
             prop: r.prop
           }, {
             default: u(() => [
-              r.type === "input" ? (n(), p(B, _({
+              r.type === "input" ? (n(), p(A, _({
                 key: 0,
                 modelValue: s.modelValue[r.prop],
                 "onUpdate:modelValue": (d) => s.modelValue[r.prop] = d
               }, { ref_for: !0 }, r.componentProps), null, 16, ["modelValue", "onUpdate:modelValue"])) : m("", !0),
-              r.type === "textarea" ? (n(), p(B, _({
+              r.type === "textarea" ? (n(), p(A, _({
                 key: 1,
                 type: "textarea",
                 modelValue: s.modelValue[r.prop],
@@ -47,7 +47,7 @@ const pe = /* @__PURE__ */ H({
                 "onUpdate:modelValue": (d) => s.modelValue[r.prop] = d
               }, { ref_for: !0 }, r.componentProps), {
                 default: u(() => [
-                  (n(!0), w($, null, q(r.options, (d) => (n(), p(Q, {
+                  (n(!0), b(V, null, q(r.options, (d) => (n(), p(Q, {
                     key: d.value,
                     label: d.label,
                     value: d.value
@@ -61,7 +61,7 @@ const pe = /* @__PURE__ */ H({
                 "onUpdate:modelValue": (d) => s.modelValue[r.prop] = d
               }, { ref_for: !0 }, r.componentProps), {
                 default: u(() => [
-                  (n(!0), w($, null, q(r.options, (d) => (n(), p(N, {
+                  (n(!0), b(V, null, q(r.options, (d) => (n(), p(N, {
                     key: d.value,
                     label: d.value
                   }, {
@@ -73,7 +73,7 @@ const pe = /* @__PURE__ */ H({
                 ]),
                 _: 2
               }, 1040, ["modelValue", "onUpdate:modelValue"])) : m("", !0),
-              r.type === "input-disabled" ? (n(), p(B, _({
+              r.type === "input-disabled" ? (n(), p(A, _({
                 key: 4,
                 "model-value": s.modelValue[r.prop],
                 disabled: ""
@@ -95,14 +95,14 @@ const pe = /* @__PURE__ */ H({
 });
 C.interceptors.request.use(
   (c) => {
-    const D = localStorage.getItem("token");
-    return D && (c.headers.Authorization = "Bearer " + D), c;
+    const k = localStorage.getItem("token");
+    return k && (c.headers.Authorization = "Bearer " + k), c;
   },
   (c) => (console.log(c), Promise.reject(c))
 );
 C.interceptors.response.use(
   (c) => c.data,
-  (c) => (console.log("err" + c), F({
+  (c) => (console.log("err" + c), $({
     message: "接口错误，请刷新接口",
     // 这里是您要求的统一错误提示
     type: "error",
@@ -134,7 +134,8 @@ const fe = {
     apiUrlUpdate: { type: String, required: !0 },
     apiUrlDelete: { type: String, required: !0 },
     showSearchSection: { type: Boolean, default: !0 },
-    // ✨ 新增：控制搜索区域显隐
+    // ✨ [新增] 控制搜索/清空按钮的显示
+    showSearchActionButtons: { type: Boolean, default: !0 },
     // 控制新增按钮
     showNewBtn: { type: Boolean, default: !0 },
     // 表格列定义，通过配置数组动态渲染，比 slot 更灵活。
@@ -157,7 +158,6 @@ const fe = {
     showActionsColumn: { type: Boolean, default: !0 },
     showEditButton: { type: Boolean, default: !0 },
     showDeleteButton: { type: Boolean, default: !0 },
-    showNewBtn: { type: Boolean, default: !0 },
     // UI 定制化配置
     actionsColumnWidth: { type: [String, Number], default: 120 },
     dialogWidth: { type: String, default: "50%" },
@@ -174,94 +174,94 @@ const fe = {
     dialogFormRules: { type: Object, default: () => ({}) }
   },
   emits: ["open-dialog", "submit", "delete"],
-  setup(c, { expose: D, emit: z }) {
-    const s = z, t = c, B = j(() => ["crud-table-wrapper", `theme-${t.theme}`, t.customClass]), Q = j(() => t.theme === "large-screen" ? "large-screen-dialog" : ""), S = (e, o) => e ? !0 : (F.error(`${o} prop is required.`), !1), N = async (e, o) => {
+  setup(c, { expose: k, emit: z }) {
+    const s = z, e = c, A = j(() => ["crud-table-wrapper", `theme-${e.theme}`, e.customClass]), Q = j(() => e.theme === "large-screen" ? "large-screen-dialog" : ""), S = (t, o) => t ? !0 : ($.error(`${o} prop is required.`), !1), N = async (t, o) => {
       try {
-        let l = { ...o };
-        if (t.onBeforeSubmit && (l = await t.onBeforeSubmit(l)), a.submitting = !0, e === "add") {
-          if (!S(t.apiUrlCreate, "apiUrlCreate")) return;
-          await C.post(t.apiUrlCreate, l), F.success("新增成功");
+        let a = { ...o };
+        if (e.onBeforeSubmit && (a = await e.onBeforeSubmit(a)), l.submitting = !0, t === "add") {
+          if (!S(e.apiUrlCreate, "apiUrlCreate")) return;
+          await C.post(e.apiUrlCreate, a), $.success("新增成功");
         } else {
-          if (!S(t.apiUrlUpdate, "apiUrlUpdate")) return;
-          await C.put(t.apiUrlUpdate, l), F.success("更新成功");
+          if (!S(e.apiUrlUpdate, "apiUrlUpdate")) return;
+          await C.put(e.apiUrlUpdate, a), $.success("更新成功");
         }
-        return t.onAfterSubmit && t.onAfterSubmit(e, l), s("submit", { mode: e, data: l }), a.visible && (a.visible = !1), V(), Promise.resolve();
-      } catch (l) {
-        return console.log("Submit error:", l), Promise.reject(l);
+        return e.onAfterSubmit && e.onAfterSubmit(t, a), s("submit", { mode: t, data: a }), l.visible && (l.visible = !1), U(), Promise.resolve();
+      } catch (a) {
+        return console.log("Submit error:", a), Promise.reject(a);
       } finally {
-        a.submitting = !1;
+        l.submitting = !1;
       }
-    }, f = T({ pageNum: 1, pageSize: 10, ...t.initialSearchForm }), k = A([]), U = A(0), r = A(!1), d = A([]), a = T({ visible: !1, loading: !1, submitting: !1, mode: "add", data: {}, formRef: null }), M = j(() => a.mode === "add" ? "新增" : "编辑"), G = j(() => {
-      if (a.mode === "add") return t.dialogFormConfig.filter((o) => o.prop !== "id");
-      const e = [...t.dialogFormConfig.filter((o) => o.prop !== "id")];
-      return e.some((o) => o.prop === "id") || e.unshift({ type: "input-disabled", prop: "id", label: "用户ID" }), e;
-    }), V = async () => {
-      if (S(t.apiUrlQuery, "apiUrlQuery")) {
+    }, f = T({ pageNum: 1, pageSize: 10, ...e.initialSearchForm }), D = F([]), B = F(0), r = F(!1), d = F([]), l = T({ visible: !1, loading: !1, submitting: !1, mode: "add", data: {}, formRef: null }), M = j(() => l.mode === "add" ? "新增" : "编辑"), G = j(() => {
+      if (l.mode === "add") return e.dialogFormConfig.filter((o) => o.prop !== "id");
+      const t = [...e.dialogFormConfig.filter((o) => o.prop !== "id")];
+      return t.some((o) => o.prop === "id") || t.unshift({ type: "input-disabled", prop: "id", label: "用户ID" }), t;
+    }), U = async () => {
+      if (S(e.apiUrlQuery, "apiUrlQuery")) {
         r.value = !0;
         try {
-          let e = { ...f };
-          t.onBeforeQuery && (e = await t.onBeforeQuery(e));
-          const o = await C.get(t.apiUrlQuery, { params: e });
-          if (o && Array.isArray(o.data.rows) && typeof o.data.total == "number") {
-            let l = o.data.rows;
-            t.onAfterQuery && (l = await t.onAfterQuery(l)), k.value = l, U.value = o.data.total;
+          let t = { ...f };
+          e.onBeforeQuery && (t = await e.onBeforeQuery(t));
+          const o = await C.get(e.apiUrlQuery, { params: t });
+          if (o && o.data && Array.isArray(o.data.rows) && typeof o.data.total == "number") {
+            let a = o.data.rows;
+            e.onAfterQuery && (a = await e.onAfterQuery(a)), D.value = a, B.value = o.data.total;
           } else
-            console.warn("API response is not in the expected { data: [], total: 0 } format."), k.value = [], U.value = 0;
-        } catch (e) {
-          console.error("Fetch data failed:", e);
+            console.warn("API response is not in the expected { data: { rows: [], total: 0 } } format."), D.value = [], B.value = 0;
+        } catch (t) {
+          console.error("Fetch data failed:", t);
         } finally {
           r.value = !1;
         }
       }
     }, P = () => {
-      f.pageNum = 1, V();
+      f.pageNum = 1, U();
     }, J = () => {
-      const { pageNum: e, pageSize: o, ...l } = t.initialSearchForm;
-      Object.keys(f).forEach((b) => {
-        b !== "pageNum" && b !== "pageSize" && delete f[b];
-      }), Object.assign(f, l), P();
-    }, K = (e) => {
-      d.value = e;
-    }, x = async (e, o) => {
-      let l;
-      if (e === "add" ? l = o ? { ...o } : { role: "user" } : l = { ...o }, t.onBeforeOpenDialog) {
-        const b = await t.onBeforeOpenDialog(e, l);
-        b && (l = b);
+      const { pageNum: t, pageSize: o, ...a } = e.initialSearchForm;
+      Object.keys(f).forEach((h) => {
+        h !== "pageNum" && h !== "pageSize" && delete f[h];
+      }), Object.assign(f, a), P();
+    }, K = (t) => {
+      d.value = t;
+    }, x = async (t, o) => {
+      let a;
+      if (t === "add" ? a = o ? { ...o } : { role: "user" } : a = { ...o }, e.onBeforeOpenDialog) {
+        const h = await e.onBeforeOpenDialog(t, a);
+        h && (a = h);
       }
-      if (a.mode = e, a.visible = !0, e === "edit") {
-        if (!S(t.apiUrlDetail, "apiUrlDetail")) return;
-        a.loading = !0;
+      if (l.mode = t, l.visible = !0, t === "edit") {
+        if (!S(e.apiUrlDetail, "apiUrlDetail")) return;
+        l.loading = !0;
         try {
-          const b = await C.get(t.apiUrlDetail, { params: { id: l.id } });
-          a.data = b.data;
+          const h = await C.get(e.apiUrlDetail + "/" + a.id.toString());
+          l.data = h.data.data;
         } finally {
-          a.loading = !1, t.onAfterOpenDialog && t.onAfterOpenDialog(e, a.data), s("open-dialog", { mode: e, data: a.data });
+          l.loading = !1, e.onAfterOpenDialog && e.onAfterOpenDialog(t, l.data), s("open-dialog", { mode: t, data: l.data });
         }
       } else
-        a.data = l, t.onAfterOpenDialog && t.onAfterOpenDialog(e, a.data), s("open-dialog", { mode: e, data: a.data });
+        l.data = a, e.onAfterOpenDialog && e.onAfterOpenDialog(t, l.data), s("open-dialog", { mode: t, data: l.data });
     }, X = async () => {
       try {
-        a.formRef && await a.formRef.validate(), await N(a.mode, a.data);
-      } catch (e) {
-        console.log("Validation failed:", e);
+        l.formRef && await l.formRef.validate(), await N(l.mode, l.data);
+      } catch (t) {
+        console.log("Validation failed:", t);
       }
-    }, I = async (e) => {
-      if (S(t.apiUrlDelete, "apiUrlDelete"))
+    }, I = async (t) => {
+      if (S(e.apiUrlDelete, "apiUrlDelete"))
         try {
-          if (t.onBeforeDelete && await t.onBeforeDelete(e) === !1)
+          if (e.onBeforeDelete && await e.onBeforeDelete(t) === !1)
             return;
-          const o = e.join(",");
-          await C.delete(t.apiUrlDelete + "/" + o.toString()), F.success("删除成功"), t.onAfterDelete && t.onAfterDelete(e), s("delete", e), k.value.length === e.length && f.pageNum > 1 && f.pageNum--, V();
+          const o = t.join(",");
+          await C.delete(e.apiUrlDelete + "/" + o.toString()), $.success("删除成功"), e.onAfterDelete && e.onAfterDelete(t), s("delete", t), D.value.length === t.length && f.pageNum > 1 && f.pageNum--, U();
         } catch (o) {
           console.error("Delete failed", o);
         }
-    }, Y = (e) => {
-      f.pageSize = e, P();
-    }, Z = (e) => {
-      f.pageNum = e, V();
+    }, Y = (t) => {
+      f.pageSize = t, P();
+    }, Z = (t) => {
+      f.pageNum = t, U();
     };
-    return ne(V), D({
-      refresh: V,
+    return ne(U), k({
+      refresh: U,
       // 刷新表格
       search: P,
       // 按当前条件搜索
@@ -271,43 +271,45 @@ const fe = {
       // 手动打开弹窗
       submit: N
       // 手动提交
-    }), (e, o) => {
-      const l = g("el-button"), b = g("el-form-item"), ee = g("el-form"), O = g("el-table-column"), te = g("el-popconfirm"), oe = g("el-table"), le = g("el-pagination"), ae = g("el-dialog"), L = ie("loading");
-      return n(), w("div", {
-        class: se(B.value)
+    }), (t, o) => {
+      const a = g("el-button"), h = g("el-form-item"), ee = g("el-form"), O = g("el-table-column"), te = g("el-popconfirm"), oe = g("el-table"), ae = g("el-pagination"), le = g("el-dialog"), L = ie("loading");
+      return n(), b("div", {
+        class: se(A.value)
       }, [
-        y(e.$slots, "header"),
-        t.showSearchSection ? (n(), w("div", fe, [
-          h(ee, {
+        y(t.$slots, "header"),
+        e.showSearchSection ? (n(), b("div", fe, [
+          w(ee, {
             model: f,
             class: "query-form flex flex-nowrap items-center gap-x-4",
             style: { "overflow-x": "auto", "padding-bottom": "8px" }
           }, {
             default: u(() => [
-              y(e.$slots, "query-conditions", { searchForm: f }),
-              h(b, { class: "!mr-0 flex-shrink-0" }, {
+              y(t.$slots, "query-conditions", { searchForm: f }),
+              w(h, { class: "!mr-0 flex-shrink-0" }, {
                 default: u(() => [
                   E("div", me, [
-                    y(e.$slots, "query-left"),
-                    h(l, {
-                      type: "primary",
-                      onClick: P,
-                      loading: r.value
-                    }, {
-                      default: u(() => o[6] || (o[6] = [
-                        v("搜索")
-                      ])),
-                      _: 1,
-                      __: [6]
-                    }, 8, ["loading"]),
-                    h(l, { onClick: J }, {
-                      default: u(() => o[7] || (o[7] = [
-                        v("清空")
-                      ])),
-                      _: 1,
-                      __: [7]
-                    }),
-                    y(e.$slots, "query-right")
+                    y(t.$slots, "query-left"),
+                    e.showSearchActionButtons ? (n(), b(V, { key: 0 }, [
+                      w(a, {
+                        type: "primary",
+                        onClick: P,
+                        loading: r.value
+                      }, {
+                        default: u(() => o[6] || (o[6] = [
+                          v("搜索")
+                        ])),
+                        _: 1,
+                        __: [6]
+                      }, 8, ["loading"]),
+                      w(a, { onClick: J }, {
+                        default: u(() => o[7] || (o[7] = [
+                          v("清空")
+                        ])),
+                        _: 1,
+                        __: [7]
+                      })
+                    ], 64)) : m("", !0),
+                    y(t.$slots, "query-right")
                   ])
                 ]),
                 _: 3
@@ -316,9 +318,9 @@ const fe = {
             _: 3
           }, 8, ["model"]),
           E("div", ge, [
-            y(e.$slots, "action-left", { selections: d.value }),
-            y(e.$slots, "add-button-content", {}, () => [
-              t.showNewBtn ? (n(), p(l, {
+            y(t.$slots, "action-left", { selections: d.value }),
+            y(t.$slots, "add-button-content", {}, () => [
+              e.showNewBtn ? (n(), p(a, {
                 key: 0,
                 type: "success",
                 onClick: o[0] || (o[0] = (i) => x("add"))
@@ -330,28 +332,28 @@ const fe = {
                 __: [8]
               })) : m("", !0)
             ]),
-            y(e.$slots, "action-right")
+            y(t.$slots, "action-right")
           ])
         ])) : m("", !0),
         W((n(), p(oe, _({
-          data: k.value,
+          data: D.value,
           onSelectionChange: K
-        }, e.$attrs, { style: { width: "100%", "margin-bottom": "1.5rem" } }), {
+        }, t.$attrs, { style: { width: "100%", "margin-bottom": "1.5rem" } }), {
           default: u(() => [
-            t.showSelectionColumn ? (n(), p(O, {
+            e.showSelectionColumn ? (n(), p(O, {
               key: 0,
               type: "selection",
               width: "55",
               fixed: ""
             })) : m("", !0),
-            t.showIndexColumn ? (n(), p(O, {
+            e.showIndexColumn ? (n(), p(O, {
               key: 1,
               type: "index",
               label: "序号",
               width: "70",
               fixed: ""
             })) : m("", !0),
-            (n(!0), w($, null, q(t.columns, (i) => (n(), p(O, _({
+            (n(!0), b(V, null, q(e.columns, (i) => (n(), p(O, _({
               key: i.prop,
               prop: i.prop,
               label: i.label,
@@ -361,28 +363,28 @@ const fe = {
               i.slot ? {
                 name: "default",
                 fn: u((R) => [
-                  y(e.$slots, i.slot, {
+                  y(t.$slots, i.slot, {
                     row: R.row
                   })
                 ]),
                 key: "0"
               } : void 0
             ]), 1040, ["prop", "label", "width", "sortable"]))), 128)),
-            t.showActionsColumn ? (n(), p(O, {
+            e.showActionsColumn ? (n(), p(O, {
               key: 2,
               label: "操作",
               width: c.actionsColumnWidth
             }, {
               default: u((i) => [
-                i.row ? (n(), w("div", ce, [
-                  e.$slots.actions ? y(e.$slots, "actions", {
+                i.row ? (n(), b("div", ce, [
+                  t.$slots.actions ? y(t.$slots, "actions", {
                     key: 0,
                     row: i.row
-                  }) : (n(), w($, { key: 1 }, [
-                    y(e.$slots, "action-before-edit", {
+                  }) : (n(), b(V, { key: 1 }, [
+                    y(t.$slots, "action-before-edit", {
                       row: i.row
                     }),
-                    t.showEditButton ? (n(), p(l, {
+                    e.showEditButton ? (n(), p(a, {
                       key: 0,
                       size: "small",
                       type: "primary",
@@ -395,7 +397,7 @@ const fe = {
                       _: 2,
                       __: [9]
                     }, 1032, ["onClick"])) : m("", !0),
-                    t.showDeleteButton ? (n(), p(te, {
+                    e.showDeleteButton ? (n(), p(te, {
                       key: 1,
                       title: "确定要删除这条数据吗?",
                       onConfirm: (R) => I([i.row.id]),
@@ -404,7 +406,7 @@ const fe = {
                       width: "200"
                     }, {
                       reference: u(() => [
-                        h(l, {
+                        w(a, {
                           size: "small",
                           type: "danger",
                           link: ""
@@ -418,7 +420,7 @@ const fe = {
                       ]),
                       _: 2
                     }, 1032, ["onConfirm"])) : m("", !0),
-                    y(e.$slots, "action-after-delete", {
+                    y(t.$slots, "action-after-delete", {
                       row: i.row
                     })
                   ], 64))
@@ -431,34 +433,34 @@ const fe = {
         }, 16, ["data"])), [
           [L, r.value]
         ]),
-        t.showPagination && U.value > 0 ? (n(), w("div", ye, [
-          h(le, {
+        e.showPagination && B.value > 0 ? (n(), b("div", ye, [
+          w(ae, {
             "current-page": f.pageNum,
             "onUpdate:currentPage": o[1] || (o[1] = (i) => f.pageNum = i),
             "page-size": f.pageSize,
             "onUpdate:pageSize": o[2] || (o[2] = (i) => f.pageSize = i),
-            "page-sizes": t.pageSizes,
-            layout: t.paginationLayout,
-            total: U.value,
-            background: t.paginationBackground,
-            small: t.paginationSmall,
-            "hide-on-single-page": t.paginationHideOnSinglePage,
+            "page-sizes": e.pageSizes,
+            layout: e.paginationLayout,
+            total: B.value,
+            background: e.paginationBackground,
+            small: e.paginationSmall,
+            "hide-on-single-page": e.paginationHideOnSinglePage,
             onSizeChange: Y,
             onCurrentChange: Z
           }, null, 8, ["current-page", "page-size", "page-sizes", "layout", "total", "background", "small", "hide-on-single-page"])
         ])) : m("", !0),
-        h(ae, {
-          modelValue: a.visible,
-          "onUpdate:modelValue": o[5] || (o[5] = (i) => a.visible = i),
+        w(le, {
+          modelValue: l.visible,
+          "onUpdate:modelValue": o[5] || (o[5] = (i) => l.visible = i),
           title: M.value,
-          width: t.dialogWidth,
+          width: e.dialogWidth,
           "destroy-on-close": !0,
           "custom-class": Q.value
         }, {
           footer: u(() => [
             E("div", be, [
-              h(l, {
-                onClick: o[4] || (o[4] = (i) => a.visible = !1)
+              w(a, {
+                onClick: o[4] || (o[4] = (i) => l.visible = !1)
               }, {
                 default: u(() => o[11] || (o[11] = [
                   v("取消")
@@ -466,10 +468,10 @@ const fe = {
                 _: 1,
                 __: [11]
               }),
-              h(l, {
+              w(a, {
                 type: "primary",
                 onClick: X,
-                loading: a.submitting
+                loading: l.submitting
               }, {
                 default: u(() => o[12] || (o[12] = [
                   v("确定")
@@ -480,23 +482,23 @@ const fe = {
             ])
           ]),
           default: u(() => [
-            W((n(), w("div", null, [
-              y(e.$slots, "dialog-form-content", {
-                formData: a.data,
-                mode: a.mode
+            W((n(), b("div", null, [
+              y(t.$slots, "dialog-form-content", {
+                formData: l.data,
+                mode: l.mode
               }, () => [
-                t.dialogFormConfig.length > 0 ? (n(), p(pe, {
+                e.dialogFormConfig.length > 0 ? (n(), p(pe, {
                   key: 0,
                   "form-config": G.value,
-                  modelValue: a.data,
-                  "onUpdate:modelValue": o[3] || (o[3] = (i) => a.data = i),
-                  ref: (i) => a.formRef = i,
-                  rules: t.dialogFormRules,
+                  modelValue: l.data,
+                  "onUpdate:modelValue": o[3] || (o[3] = (i) => l.data = i),
+                  ref: (i) => l.formRef = i,
+                  rules: e.dialogFormRules,
                   "label-width": "80px"
                 }, null, 8, ["form-config", "modelValue", "rules"])) : m("", !0)
               ])
             ])), [
-              [L, a.loading]
+              [L, l.loading]
             ])
           ]),
           _: 3

package/dist/z-crud-table.umd.cjs

@@ -1 +1 @@
-(function(f,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("element-plus"),require("axios")):typeof define=="function"&&define.amd?define(["exports","vue","element-plus","axios"],e):(f=typeof globalThis<"u"?globalThis:f||self,e(f.ZCrudTable={},f.Vue,f.ElementPlus,f.axios))})(this,function(f,e,h,A){"use strict";const E=e.defineComponent({__name:"DynamicForm",props:{modelValue:{},formConfig:{},rules:{}},setup(c,{expose:y}){const b=e.ref(null);return y({validate:()=>{var s;return(s=b.value)==null?void 0:s.validate()}}),(s,o)=>{const w=e.resolveComponent("el-input"),N=e.resolveComponent("el-option"),u=e.resolveComponent("el-select"),V=e.resolveComponent("el-radio"),p=e.resolveComponent("el-radio-group"),C=e.resolveComponent("el-form-item"),k=e.resolveComponent("el-form");return e.openBlock(),e.createBlock(k,e.mergeProps({model:s.modelValue,rules:s.rules,ref_key:"formRef",ref:b},s.$attrs),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.formConfig,n=>(e.openBlock(),e.createBlock(C,{key:n.prop,label:n.label,prop:n.prop},{default:e.withCtx(()=>[n.type==="input"?(e.openBlock(),e.createBlock(w,e.mergeProps({key:0,modelValue:s.modelValue[n.prop],"onUpdate:modelValue":d=>s.modelValue[n.prop]=d},{ref_for:!0},n.componentProps),null,16,["modelValue","onUpdate:modelValue"])):e.createCommentVNode("",!0),n.type==="textarea"?(e.openBlock(),e.createBlock(w,e.mergeProps({key:1,type:"textarea",modelValue:s.modelValue[n.prop],"onUpdate:modelValue":d=>s.modelValue[n.prop]=d},{ref_for:!0},n.componentProps),null,16,["modelValue","onUpdate:modelValue"])):e.createCommentVNode("",!0),n.type==="select"?(e.openBlock(),e.createBlock(u,e.mergeProps({key:2,modelValue:s.modelValue[n.prop],"onUpdate:modelValue":d=>s.modelValue[n.prop]=d},{ref_for:!0},n.componentProps),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.options,d=>(e.openBlock(),e.createBlock(N,{key:d.value,label:d.label,value:d.value},null,8,["label","value"]))),128))]),_:2},1040,["modelValue","onUpdate:modelValue"])):e.createCommentVNode("",!0),n.type==="radio-group"?(e.openBlock(),e.createBlock(p,e.mergeProps({key:3,modelValue:s.modelValue[n.prop],"onUpdate:modelValue":d=>s.modelValue[n.prop]=d},{ref_for:!0},n.componentProps),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.options,d=>(e.openBlock(),e.createBlock(V,{key:d.value,label:d.value},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(d.label),1)]),_:2},1032,["label"]))),128))]),_:2},1040,["modelValue","onUpdate:modelValue"])):e.createCommentVNode("",!0),n.type==="input-disabled"?(e.openBlock(),e.createBlock(w,e.mergeProps({key:4,"model-value":s.modelValue[n.prop],disabled:""},{ref_for:!0},n.componentProps),null,16,["model-value"])):e.createCommentVNode("",!0)]),_:2},1032,["label","prop"]))),128))]),_:1},16,["model","rules"])}}}),g=A.create({baseURL:"",timeout:1e4});g.interceptors.request.use(c=>{const y=localStorage.getItem("token");return y&&(c.headers.Authorization="Bearer "+y),c},c=>(console.log(c),Promise.reject(c))),g.interceptors.response.use(c=>c.data,c=>(console.log("err"+c),h.ElMessage({message:"接口错误，请刷新接口",type:"error",duration:5*1e3}),Promise.reject(c)));const $={key:0,class:"flex flex-wrap items-center justify-between gap-4 mb-6"},z={class:"flex items-center gap-x-2"},P={class:"flex items-center gap-x-3 action-buttons flex-shrink-0"},O={key:0,class:"flex items-center gap-x-2"},T={key:1,class:"flex justify-end"},q={class:"dialog-footer"},j=e.defineComponent({__name:"CrudTable",props:{theme:{type:String,default:"default"},customClass:{type:String,default:""},apiUrlQuery:{type:String,required:!0},apiUrlDetail:{type:String,required:!0},apiUrlCreate:{type:String,required:!0},apiUrlUpdate:{type:String,required:!0},apiUrlDelete:{type:String,required:!0},showSearchSection:{type:Boolean,default:!0},showNewBtn:{type:Boolean,default:!0},columns:{type:Array,default:()=>[]},onBeforeQuery:{type:Function},onAfterQuery:{type:Function},onBeforeOpenDialog:{type:Function},onAfterOpenDialog:{type:Function},onBeforeSubmit:{type:Function},onAfterSubmit:{type:Function},onBeforeDelete:{type:Function},onAfterDelete:{type:Function},showSelectionColumn:{type:Boolean,default:!0},showIndexColumn:{type:Boolean,default:!0},showActionsColumn:{type:Boolean,default:!0},showEditButton:{type:Boolean,default:!0},showDeleteButton:{type:Boolean,default:!0},showNewBtn:{type:Boolean,default:!0},actionsColumnWidth:{type:[String,Number],default:120},dialogWidth:{type:String,default:"50%"},initialSearchForm:{type:Object,default:()=>({pageNum:1,pageSize:10})},showPagination:{type:Boolean,default:!0},pageSizes:{type:Array,default:()=>[10,20,50,100]},paginationLayout:{type:String,default:"total, sizes, prev, pager, next, jumper"},paginationBackground:{type:Boolean,default:!0},paginationSmall:{type:Boolean,default:!1},paginationHideOnSinglePage:{type:Boolean,default:!1},dialogFormConfig:{type:Array,default:()=>[]},dialogFormRules:{type:Object,default:()=>({})}},emits:["open-dialog","submit","delete"],setup(c,{expose:y,emit:b}){const s=b,o=c,w=e.computed(()=>["crud-table-wrapper",`theme-${o.theme}`,o.customClass]),N=e.computed(()=>o.theme==="large-screen"?"large-screen-dialog":""),u=(t,l)=>t?!0:(h.ElMessage.error(`${l} prop is required.`),!1),V=async(t,l)=>{try{let a={...l};if(o.onBeforeSubmit&&(a=await o.onBeforeSubmit(a)),r.submitting=!0,t==="add"){if(!u(o.apiUrlCreate,"apiUrlCreate"))return;await g.post(o.apiUrlCreate,a),h.ElMessage.success("新增成功")}else{if(!u(o.apiUrlUpdate,"apiUrlUpdate"))return;await g.put(o.apiUrlUpdate,a),h.ElMessage.success("更新成功")}return o.onAfterSubmit&&o.onAfterSubmit(t,a),s("submit",{mode:t,data:a}),r.visible&&(r.visible=!1),B(),Promise.resolve()}catch(a){return console.log("Submit error:",a),Promise.reject(a)}finally{r.submitting=!1}},p=e.reactive({pageNum:1,pageSize:10,...o.initialSearchForm}),C=e.ref([]),k=e.ref(0),n=e.ref(!1),d=e.ref([]),r=e.reactive({visible:!1,loading:!1,submitting:!1,mode:"add",data:{},formRef:null}),Q=e.computed(()=>r.mode==="add"?"新增":"编辑"),R=e.computed(()=>{if(r.mode==="add")return o.dialogFormConfig.filter(l=>l.prop!=="id");const t=[...o.dialogFormConfig.filter(l=>l.prop!=="id")];return t.some(l=>l.prop==="id")||t.unshift({type:"input-disabled",prop:"id",label:"用户ID"}),t}),B=async()=>{if(u(o.apiUrlQuery,"apiUrlQuery")){n.value=!0;try{let t={...p};o.onBeforeQuery&&(t=await o.onBeforeQuery(t));const l=await g.get(o.apiUrlQuery,{params:t});if(l&&Array.isArray(l.data.rows)&&typeof l.data.total=="number"){let a=l.data.rows;o.onAfterQuery&&(a=await o.onAfterQuery(a)),C.value=a,k.value=l.data.total}else console.warn("API response is not in the expected { data: [], total: 0 } format."),C.value=[],k.value=0}catch(t){console.error("Fetch data failed:",t)}finally{n.value=!1}}},S=()=>{p.pageNum=1,B()},L=()=>{const{pageNum:t,pageSize:l,...a}=o.initialSearchForm;Object.keys(p).forEach(m=>{m!=="pageNum"&&m!=="pageSize"&&delete p[m]}),Object.assign(p,a),S()},M=t=>{d.value=t},D=async(t,l)=>{let a;if(t==="add"?a=l?{...l}:{role:"user"}:a={...l},o.onBeforeOpenDialog){const m=await o.onBeforeOpenDialog(t,a);m&&(a=m)}if(r.mode=t,r.visible=!0,t==="edit"){if(!u(o.apiUrlDetail,"apiUrlDetail"))return;r.loading=!0;try{const m=await g.get(o.apiUrlDetail,{params:{id:a.id}});r.data=m.data}finally{r.loading=!1,o.onAfterOpenDialog&&o.onAfterOpenDialog(t,r.data),s("open-dialog",{mode:t,data:r.data})}}else r.data=a,o.onAfterOpenDialog&&o.onAfterOpenDialog(t,r.data),s("open-dialog",{mode:t,data:r.data})},I=async()=>{try{r.formRef&&await r.formRef.validate(),await V(r.mode,r.data)}catch(t){console.log("Validation failed:",t)}},U=async t=>{if(u(o.apiUrlDelete,"apiUrlDelete"))try{if(o.onBeforeDelete&&await o.onBeforeDelete(t)===!1)return;const l=t.join(",");await g.delete(o.apiUrlDelete+"/"+l.toString()),h.ElMessage.success("删除成功"),o.onAfterDelete&&o.onAfterDelete(t),s("delete",t),C.value.length===t.length&&p.pageNum>1&&p.pageNum--,B()}catch(l){console.error("Delete failed",l)}},W=t=>{p.pageSize=t,S()},H=t=>{p.pageNum=t,B()};return e.onMounted(B),y({refresh:B,search:S,handleDelete:U,openDialog:D,submit:V}),(t,l)=>{const a=e.resolveComponent("el-button"),m=e.resolveComponent("el-form-item"),Z=e.resolveComponent("el-form"),_=e.resolveComponent("el-table-column"),G=e.resolveComponent("el-popconfirm"),J=e.resolveComponent("el-table"),K=e.resolveComponent("el-pagination"),X=e.resolveComponent("el-dialog"),F=e.resolveDirective("loading");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(w.value)},[e.renderSlot(t.$slots,"header"),o.showSearchSection?(e.openBlock(),e.createElementBlock("div",$,[e.createVNode(Z,{model:p,class:"query-form flex flex-nowrap items-center gap-x-4",style:{"overflow-x":"auto","padding-bottom":"8px"}},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"query-conditions",{searchForm:p}),e.createVNode(m,{class:"!mr-0 flex-shrink-0"},{default:e.withCtx(()=>[e.createElementVNode("div",z,[e.renderSlot(t.$slots,"query-left"),e.createVNode(a,{type:"primary",onClick:S,loading:n.value},{default:e.withCtx(()=>l[6]||(l[6]=[e.createTextVNode("搜索")])),_:1,__:[6]},8,["loading"]),e.createVNode(a,{onClick:L},{default:e.withCtx(()=>l[7]||(l[7]=[e.createTextVNode("清空")])),_:1,__:[7]}),e.renderSlot(t.$slots,"query-right")])]),_:3})]),_:3},8,["model"]),e.createElementVNode("div",P,[e.renderSlot(t.$slots,"action-left",{selections:d.value}),e.renderSlot(t.$slots,"add-button-content",{},()=>[o.showNewBtn?(e.openBlock(),e.createBlock(a,{key:0,type:"success",onClick:l[0]||(l[0]=i=>D("add"))},{default:e.withCtx(()=>l[8]||(l[8]=[e.createTextVNode("新增")])),_:1,__:[8]})):e.createCommentVNode("",!0)]),e.renderSlot(t.$slots,"action-right")])])):e.createCommentVNode("",!0),e.withDirectives((e.openBlock(),e.createBlock(J,e.mergeProps({data:C.value,onSelectionChange:M},t.$attrs,{style:{width:"100%","margin-bottom":"1.5rem"}}),{default:e.withCtx(()=>[o.showSelectionColumn?(e.openBlock(),e.createBlock(_,{key:0,type:"selection",width:"55",fixed:""})):e.createCommentVNode("",!0),o.showIndexColumn?(e.openBlock(),e.createBlock(_,{key:1,type:"index",label:"序号",width:"70",fixed:""})):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.columns,i=>(e.openBlock(),e.createBlock(_,e.mergeProps({key:i.prop,prop:i.prop,label:i.label,width:i.width,sortable:i.sortable||!1},{ref_for:!0},i.attrs),e.createSlots({_:2},[i.slot?{name:"default",fn:e.withCtx(x=>[e.renderSlot(t.$slots,i.slot,{row:x.row})]),key:"0"}:void 0]),1040,["prop","label","width","sortable"]))),128)),o.showActionsColumn?(e.openBlock(),e.createBlock(_,{key:2,label:"操作",width:c.actionsColumnWidth},{default:e.withCtx(i=>[i.row?(e.openBlock(),e.createElementBlock("div",O,[t.$slots.actions?e.renderSlot(t.$slots,"actions",{key:0,row:i.row}):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.renderSlot(t.$slots,"action-before-edit",{row:i.row}),o.showEditButton?(e.openBlock(),e.createBlock(a,{key:0,size:"small",type:"primary",link:"",onClick:x=>D("edit",i.row)},{default:e.withCtx(()=>l[9]||(l[9]=[e.createTextVNode("编辑 ")])),_:2,__:[9]},1032,["onClick"])):e.createCommentVNode("",!0),o.showDeleteButton?(e.openBlock(),e.createBlock(G,{key:1,title:"确定要删除这条数据吗?",onConfirm:x=>U([i.row.id]),"confirm-button-text":"确定","cancel-button-text":"取消",width:"200"},{reference:e.withCtx(()=>[e.createVNode(a,{size:"small",type:"danger",link:""},{default:e.withCtx(()=>l[10]||(l[10]=[e.createTextVNode("删除")])),_:1,__:[10]})]),_:2},1032,["onConfirm"])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"action-after-delete",{row:i.row})],64))])):e.createCommentVNode("",!0)]),_:3},8,["width"])):e.createCommentVNode("",!0)]),_:3},16,["data"])),[[F,n.value]]),o.showPagination&&k.value>0?(e.openBlock(),e.createElementBlock("div",T,[e.createVNode(K,{"current-page":p.pageNum,"onUpdate:currentPage":l[1]||(l[1]=i=>p.pageNum=i),"page-size":p.pageSize,"onUpdate:pageSize":l[2]||(l[2]=i=>p.pageSize=i),"page-sizes":o.pageSizes,layout:o.paginationLayout,total:k.value,background:o.paginationBackground,small:o.paginationSmall,"hide-on-single-page":o.paginationHideOnSinglePage,onSizeChange:W,onCurrentChange:H},null,8,["current-page","page-size","page-sizes","layout","total","background","small","hide-on-single-page"])])):e.createCommentVNode("",!0),e.createVNode(X,{modelValue:r.visible,"onUpdate:modelValue":l[5]||(l[5]=i=>r.visible=i),title:Q.value,width:o.dialogWidth,"destroy-on-close":!0,"custom-class":N.value},{footer:e.withCtx(()=>[e.createElementVNode("div",q,[e.createVNode(a,{onClick:l[4]||(l[4]=i=>r.visible=!1)},{default:e.withCtx(()=>l[11]||(l[11]=[e.createTextVNode("取消")])),_:1,__:[11]}),e.createVNode(a,{type:"primary",onClick:I,loading:r.submitting},{default:e.withCtx(()=>l[12]||(l[12]=[e.createTextVNode("确定")])),_:1,__:[12]},8,["loading"])])]),default:e.withCtx(()=>[e.withDirectives((e.openBlock(),e.createElementBlock("div",null,[e.renderSlot(t.$slots,"dialog-form-content",{formData:r.data,mode:r.mode},()=>[o.dialogFormConfig.length>0?(e.openBlock(),e.createBlock(E,{key:0,"form-config":R.value,modelValue:r.data,"onUpdate:modelValue":l[3]||(l[3]=i=>r.data=i),ref:i=>r.formRef=i,rules:o.dialogFormRules,"label-width":"80px"},null,8,["form-config","modelValue","rules"])):e.createCommentVNode("",!0)])])),[[F,r.loading]])]),_:3},8,["modelValue","title","width","custom-class"])],2)}}});f.CrudTable=j,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})});
+(function(f,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("element-plus"),require("axios")):typeof define=="function"&&define.amd?define(["exports","vue","element-plus","axios"],e):(f=typeof globalThis<"u"?globalThis:f||self,e(f.ZCrudTable={},f.Vue,f.ElementPlus,f.axios))})(this,function(f,e,h,A){"use strict";const E=e.defineComponent({__name:"DynamicForm",props:{modelValue:{},formConfig:{},rules:{}},setup(c,{expose:y}){const b=e.ref(null);return y({validate:()=>{var s;return(s=b.value)==null?void 0:s.validate()}}),(s,t)=>{const w=e.resolveComponent("el-input"),N=e.resolveComponent("el-option"),u=e.resolveComponent("el-select"),V=e.resolveComponent("el-radio"),p=e.resolveComponent("el-radio-group"),C=e.resolveComponent("el-form-item"),k=e.resolveComponent("el-form");return e.openBlock(),e.createBlock(k,e.mergeProps({model:s.modelValue,rules:s.rules,ref_key:"formRef",ref:b},s.$attrs),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.formConfig,n=>(e.openBlock(),e.createBlock(C,{key:n.prop,label:n.label,prop:n.prop},{default:e.withCtx(()=>[n.type==="input"?(e.openBlock(),e.createBlock(w,e.mergeProps({key:0,modelValue:s.modelValue[n.prop],"onUpdate:modelValue":d=>s.modelValue[n.prop]=d},{ref_for:!0},n.componentProps),null,16,["modelValue","onUpdate:modelValue"])):e.createCommentVNode("",!0),n.type==="textarea"?(e.openBlock(),e.createBlock(w,e.mergeProps({key:1,type:"textarea",modelValue:s.modelValue[n.prop],"onUpdate:modelValue":d=>s.modelValue[n.prop]=d},{ref_for:!0},n.componentProps),null,16,["modelValue","onUpdate:modelValue"])):e.createCommentVNode("",!0),n.type==="select"?(e.openBlock(),e.createBlock(u,e.mergeProps({key:2,modelValue:s.modelValue[n.prop],"onUpdate:modelValue":d=>s.modelValue[n.prop]=d},{ref_for:!0},n.componentProps),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.options,d=>(e.openBlock(),e.createBlock(N,{key:d.value,label:d.label,value:d.value},null,8,["label","value"]))),128))]),_:2},1040,["modelValue","onUpdate:modelValue"])):e.createCommentVNode("",!0),n.type==="radio-group"?(e.openBlock(),e.createBlock(p,e.mergeProps({key:3,modelValue:s.modelValue[n.prop],"onUpdate:modelValue":d=>s.modelValue[n.prop]=d},{ref_for:!0},n.componentProps),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.options,d=>(e.openBlock(),e.createBlock(V,{key:d.value,label:d.value},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(d.label),1)]),_:2},1032,["label"]))),128))]),_:2},1040,["modelValue","onUpdate:modelValue"])):e.createCommentVNode("",!0),n.type==="input-disabled"?(e.openBlock(),e.createBlock(w,e.mergeProps({key:4,"model-value":s.modelValue[n.prop],disabled:""},{ref_for:!0},n.componentProps),null,16,["model-value"])):e.createCommentVNode("",!0)]),_:2},1032,["label","prop"]))),128))]),_:1},16,["model","rules"])}}}),g=A.create({baseURL:"",timeout:1e4});g.interceptors.request.use(c=>{const y=localStorage.getItem("token");return y&&(c.headers.Authorization="Bearer "+y),c},c=>(console.log(c),Promise.reject(c))),g.interceptors.response.use(c=>c.data,c=>(console.log("err"+c),h.ElMessage({message:"接口错误，请刷新接口",type:"error",duration:5*1e3}),Promise.reject(c)));const $={key:0,class:"flex flex-wrap items-center justify-between gap-4 mb-6"},z={class:"flex items-center gap-x-2"},P={class:"flex items-center gap-x-3 action-buttons flex-shrink-0"},O={key:0,class:"flex items-center gap-x-2"},T={key:1,class:"flex justify-end"},q={class:"dialog-footer"},j=e.defineComponent({__name:"CrudTable",props:{theme:{type:String,default:"default"},customClass:{type:String,default:""},apiUrlQuery:{type:String,required:!0},apiUrlDetail:{type:String,required:!0},apiUrlCreate:{type:String,required:!0},apiUrlUpdate:{type:String,required:!0},apiUrlDelete:{type:String,required:!0},showSearchSection:{type:Boolean,default:!0},showSearchActionButtons:{type:Boolean,default:!0},showNewBtn:{type:Boolean,default:!0},columns:{type:Array,default:()=>[]},onBeforeQuery:{type:Function},onAfterQuery:{type:Function},onBeforeOpenDialog:{type:Function},onAfterOpenDialog:{type:Function},onBeforeSubmit:{type:Function},onAfterSubmit:{type:Function},onBeforeDelete:{type:Function},onAfterDelete:{type:Function},showSelectionColumn:{type:Boolean,default:!0},showIndexColumn:{type:Boolean,default:!0},showActionsColumn:{type:Boolean,default:!0},showEditButton:{type:Boolean,default:!0},showDeleteButton:{type:Boolean,default:!0},actionsColumnWidth:{type:[String,Number],default:120},dialogWidth:{type:String,default:"50%"},initialSearchForm:{type:Object,default:()=>({pageNum:1,pageSize:10})},showPagination:{type:Boolean,default:!0},pageSizes:{type:Array,default:()=>[10,20,50,100]},paginationLayout:{type:String,default:"total, sizes, prev, pager, next, jumper"},paginationBackground:{type:Boolean,default:!0},paginationSmall:{type:Boolean,default:!1},paginationHideOnSinglePage:{type:Boolean,default:!1},dialogFormConfig:{type:Array,default:()=>[]},dialogFormRules:{type:Object,default:()=>({})}},emits:["open-dialog","submit","delete"],setup(c,{expose:y,emit:b}){const s=b,t=c,w=e.computed(()=>["crud-table-wrapper",`theme-${t.theme}`,t.customClass]),N=e.computed(()=>t.theme==="large-screen"?"large-screen-dialog":""),u=(o,l)=>o?!0:(h.ElMessage.error(`${l} prop is required.`),!1),V=async(o,l)=>{try{let a={...l};if(t.onBeforeSubmit&&(a=await t.onBeforeSubmit(a)),r.submitting=!0,o==="add"){if(!u(t.apiUrlCreate,"apiUrlCreate"))return;await g.post(t.apiUrlCreate,a),h.ElMessage.success("新增成功")}else{if(!u(t.apiUrlUpdate,"apiUrlUpdate"))return;await g.put(t.apiUrlUpdate,a),h.ElMessage.success("更新成功")}return t.onAfterSubmit&&t.onAfterSubmit(o,a),s("submit",{mode:o,data:a}),r.visible&&(r.visible=!1),B(),Promise.resolve()}catch(a){return console.log("Submit error:",a),Promise.reject(a)}finally{r.submitting=!1}},p=e.reactive({pageNum:1,pageSize:10,...t.initialSearchForm}),C=e.ref([]),k=e.ref(0),n=e.ref(!1),d=e.ref([]),r=e.reactive({visible:!1,loading:!1,submitting:!1,mode:"add",data:{},formRef:null}),Q=e.computed(()=>r.mode==="add"?"新增":"编辑"),R=e.computed(()=>{if(r.mode==="add")return t.dialogFormConfig.filter(l=>l.prop!=="id");const o=[...t.dialogFormConfig.filter(l=>l.prop!=="id")];return o.some(l=>l.prop==="id")||o.unshift({type:"input-disabled",prop:"id",label:"用户ID"}),o}),B=async()=>{if(u(t.apiUrlQuery,"apiUrlQuery")){n.value=!0;try{let o={...p};t.onBeforeQuery&&(o=await t.onBeforeQuery(o));const l=await g.get(t.apiUrlQuery,{params:o});if(l&&l.data&&Array.isArray(l.data.rows)&&typeof l.data.total=="number"){let a=l.data.rows;t.onAfterQuery&&(a=await t.onAfterQuery(a)),C.value=a,k.value=l.data.total}else console.warn("API response is not in the expected { data: { rows: [], total: 0 } } format."),C.value=[],k.value=0}catch(o){console.error("Fetch data failed:",o)}finally{n.value=!1}}},S=()=>{p.pageNum=1,B()},L=()=>{const{pageNum:o,pageSize:l,...a}=t.initialSearchForm;Object.keys(p).forEach(m=>{m!=="pageNum"&&m!=="pageSize"&&delete p[m]}),Object.assign(p,a),S()},M=o=>{d.value=o},D=async(o,l)=>{let a;if(o==="add"?a=l?{...l}:{role:"user"}:a={...l},t.onBeforeOpenDialog){const m=await t.onBeforeOpenDialog(o,a);m&&(a=m)}if(r.mode=o,r.visible=!0,o==="edit"){if(!u(t.apiUrlDetail,"apiUrlDetail"))return;r.loading=!0;try{const m=await g.get(t.apiUrlDetail+"/"+a.id.toString());r.data=m.data.data}finally{r.loading=!1,t.onAfterOpenDialog&&t.onAfterOpenDialog(o,r.data),s("open-dialog",{mode:o,data:r.data})}}else r.data=a,t.onAfterOpenDialog&&t.onAfterOpenDialog(o,r.data),s("open-dialog",{mode:o,data:r.data})},I=async()=>{try{r.formRef&&await r.formRef.validate(),await V(r.mode,r.data)}catch(o){console.log("Validation failed:",o)}},U=async o=>{if(u(t.apiUrlDelete,"apiUrlDelete"))try{if(t.onBeforeDelete&&await t.onBeforeDelete(o)===!1)return;const l=o.join(",");await g.delete(t.apiUrlDelete+"/"+l.toString()),h.ElMessage.success("删除成功"),t.onAfterDelete&&t.onAfterDelete(o),s("delete",o),C.value.length===o.length&&p.pageNum>1&&p.pageNum--,B()}catch(l){console.error("Delete failed",l)}},W=o=>{p.pageSize=o,S()},H=o=>{p.pageNum=o,B()};return e.onMounted(B),y({refresh:B,search:S,handleDelete:U,openDialog:D,submit:V}),(o,l)=>{const a=e.resolveComponent("el-button"),m=e.resolveComponent("el-form-item"),Z=e.resolveComponent("el-form"),_=e.resolveComponent("el-table-column"),G=e.resolveComponent("el-popconfirm"),J=e.resolveComponent("el-table"),K=e.resolveComponent("el-pagination"),X=e.resolveComponent("el-dialog"),F=e.resolveDirective("loading");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(w.value)},[e.renderSlot(o.$slots,"header"),t.showSearchSection?(e.openBlock(),e.createElementBlock("div",$,[e.createVNode(Z,{model:p,class:"query-form flex flex-nowrap items-center gap-x-4",style:{"overflow-x":"auto","padding-bottom":"8px"}},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"query-conditions",{searchForm:p}),e.createVNode(m,{class:"!mr-0 flex-shrink-0"},{default:e.withCtx(()=>[e.createElementVNode("div",z,[e.renderSlot(o.$slots,"query-left"),t.showSearchActionButtons?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createVNode(a,{type:"primary",onClick:S,loading:n.value},{default:e.withCtx(()=>l[6]||(l[6]=[e.createTextVNode("搜索")])),_:1,__:[6]},8,["loading"]),e.createVNode(a,{onClick:L},{default:e.withCtx(()=>l[7]||(l[7]=[e.createTextVNode("清空")])),_:1,__:[7]})],64)):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"query-right")])]),_:3})]),_:3},8,["model"]),e.createElementVNode("div",P,[e.renderSlot(o.$slots,"action-left",{selections:d.value}),e.renderSlot(o.$slots,"add-button-content",{},()=>[t.showNewBtn?(e.openBlock(),e.createBlock(a,{key:0,type:"success",onClick:l[0]||(l[0]=i=>D("add"))},{default:e.withCtx(()=>l[8]||(l[8]=[e.createTextVNode("新增")])),_:1,__:[8]})):e.createCommentVNode("",!0)]),e.renderSlot(o.$slots,"action-right")])])):e.createCommentVNode("",!0),e.withDirectives((e.openBlock(),e.createBlock(J,e.mergeProps({data:C.value,onSelectionChange:M},o.$attrs,{style:{width:"100%","margin-bottom":"1.5rem"}}),{default:e.withCtx(()=>[t.showSelectionColumn?(e.openBlock(),e.createBlock(_,{key:0,type:"selection",width:"55",fixed:""})):e.createCommentVNode("",!0),t.showIndexColumn?(e.openBlock(),e.createBlock(_,{key:1,type:"index",label:"序号",width:"70",fixed:""})):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.columns,i=>(e.openBlock(),e.createBlock(_,e.mergeProps({key:i.prop,prop:i.prop,label:i.label,width:i.width,sortable:i.sortable||!1},{ref_for:!0},i.attrs),e.createSlots({_:2},[i.slot?{name:"default",fn:e.withCtx(x=>[e.renderSlot(o.$slots,i.slot,{row:x.row})]),key:"0"}:void 0]),1040,["prop","label","width","sortable"]))),128)),t.showActionsColumn?(e.openBlock(),e.createBlock(_,{key:2,label:"操作",width:c.actionsColumnWidth},{default:e.withCtx(i=>[i.row?(e.openBlock(),e.createElementBlock("div",O,[o.$slots.actions?e.renderSlot(o.$slots,"actions",{key:0,row:i.row}):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.renderSlot(o.$slots,"action-before-edit",{row:i.row}),t.showEditButton?(e.openBlock(),e.createBlock(a,{key:0,size:"small",type:"primary",link:"",onClick:x=>D("edit",i.row)},{default:e.withCtx(()=>l[9]||(l[9]=[e.createTextVNode("编辑 ")])),_:2,__:[9]},1032,["onClick"])):e.createCommentVNode("",!0),t.showDeleteButton?(e.openBlock(),e.createBlock(G,{key:1,title:"确定要删除这条数据吗?",onConfirm:x=>U([i.row.id]),"confirm-button-text":"确定","cancel-button-text":"取消",width:"200"},{reference:e.withCtx(()=>[e.createVNode(a,{size:"small",type:"danger",link:""},{default:e.withCtx(()=>l[10]||(l[10]=[e.createTextVNode("删除")])),_:1,__:[10]})]),_:2},1032,["onConfirm"])):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"action-after-delete",{row:i.row})],64))])):e.createCommentVNode("",!0)]),_:3},8,["width"])):e.createCommentVNode("",!0)]),_:3},16,["data"])),[[F,n.value]]),t.showPagination&&k.value>0?(e.openBlock(),e.createElementBlock("div",T,[e.createVNode(K,{"current-page":p.pageNum,"onUpdate:currentPage":l[1]||(l[1]=i=>p.pageNum=i),"page-size":p.pageSize,"onUpdate:pageSize":l[2]||(l[2]=i=>p.pageSize=i),"page-sizes":t.pageSizes,layout:t.paginationLayout,total:k.value,background:t.paginationBackground,small:t.paginationSmall,"hide-on-single-page":t.paginationHideOnSinglePage,onSizeChange:W,onCurrentChange:H},null,8,["current-page","page-size","page-sizes","layout","total","background","small","hide-on-single-page"])])):e.createCommentVNode("",!0),e.createVNode(X,{modelValue:r.visible,"onUpdate:modelValue":l[5]||(l[5]=i=>r.visible=i),title:Q.value,width:t.dialogWidth,"destroy-on-close":!0,"custom-class":N.value},{footer:e.withCtx(()=>[e.createElementVNode("div",q,[e.createVNode(a,{onClick:l[4]||(l[4]=i=>r.visible=!1)},{default:e.withCtx(()=>l[11]||(l[11]=[e.createTextVNode("取消")])),_:1,__:[11]}),e.createVNode(a,{type:"primary",onClick:I,loading:r.submitting},{default:e.withCtx(()=>l[12]||(l[12]=[e.createTextVNode("确定")])),_:1,__:[12]},8,["loading"])])]),default:e.withCtx(()=>[e.withDirectives((e.openBlock(),e.createElementBlock("div",null,[e.renderSlot(o.$slots,"dialog-form-content",{formData:r.data,mode:r.mode},()=>[t.dialogFormConfig.length>0?(e.openBlock(),e.createBlock(E,{key:0,"form-config":R.value,modelValue:r.data,"onUpdate:modelValue":l[3]||(l[3]=i=>r.data=i),ref:i=>r.formRef=i,rules:t.dialogFormRules,"label-width":"80px"},null,8,["form-config","modelValue","rules"])):e.createCommentVNode("",!0)])])),[[F,r.loading]])]),_:3},8,["modelValue","title","width","custom-class"])],2)}}});f.CrudTable=j,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "z-crud-table",
   "private": false,
-  "version": "0.0.22",
+  "version": "0.0.23",
   "type": "module",
   "description": "A powerful and flexible CRUD table component for Vue 3 and Element Plus.",
   "keywords": [