ling-yun-custom-components 0.0.10

package/es/PaginationTable.mjs

@@ -0,0 +1,407 @@
+import { w as ye } from "./chunks/index.bCzIhWFw.js";
+import { useSlots as Se, computed as C, ref as v, watch as ee, onMounted as be, nextTick as Ce, createElementBlock as w, openBlock as g, createElementVNode as m, createCommentVNode as B, unref as r, renderSlot as A, Fragment as xe, createBlock as te, withCtx as E, createTextVNode as le, toDisplayString as Te, createVNode as K, createSlots as we, renderList as Be, normalizeProps as Re, guardReactiveProps as ze, h as W } from "vue";
+import { ElButton as ae, ElAutoResizer as ke, ElTableV2 as Ne, ElCheckbox as Pe } from "element-plus";
+import { b as ne, c as Ae, a as Ee } from "./chunks/index.D4Kbv-m1.js";
+import { _ as Ie } from "./chunks/layout.ypvwQzq5.js";
+import { _ as _e } from "./chunks/_plugin-vue_export-helper.CHgC5LLL.js";
+import './assets/PaginationTable.css';const De = { class: "flex h-full flex-col" }, je = {
+  class: "w-full flex justify-between overflow-hidden",
+  style: { height: "auto" }
+}, Oe = {
+  key: 0,
+  class: "flex-1 overflow-hidden"
+}, qe = {
+  class: "flex",
+  style: { width: "auto", gap: "10px" }
+}, Ke = {
+  key: 1,
+  class: "flex items-center mg-b-18"
+}, We = { class: "fz-12 text-74798c" }, Fe = { class: "btn-group mg-l-12" }, Me = { class: "w-full flex-1 overflow-hidden flex flex-col" }, $e = { class: "flex-1 overflow-hidden TABLE-AREA" }, Le = {
+  key: 0,
+  class: "flex justify-end mg-t-20",
+  style: { height: "auto" }
+}, Ve = /* @__PURE__ */ Object.assign({
+  name: "PaginationTable"
+}, {
+  __name: "layout",
+  props: {
+    // 是否有分页
+    isPagination: {
+      type: Boolean,
+      default: !0
+    },
+    // 总数
+    total: {
+      type: Number,
+      default: 0
+    },
+    // 表格数据
+    tableData: {
+      type: Array,
+      default: () => []
+    },
+    // 分页配置
+    pagination: {
+      type: Object,
+      default: () => Ae
+    },
+    // 查询参数
+    params: {
+      type: Object,
+      default: () => {
+      }
+    },
+    // 请求的接口
+    requestFn: {
+      type: Function
+    },
+    // 表格的列
+    columns: {
+      type: Array,
+      default: () => []
+    },
+    // 是否有批量选择
+    hasBatchSelect: {
+      type: Boolean,
+      default: !1
+    },
+    // 标记哪个行可以被展开
+    expandColumnKey: {
+      type: String,
+      default: ""
+    },
+    // 表格列宽度的比例(索引从0开始)
+    // 0: 0.3,
+    // 1: 0.27,
+    // 2: 0.2,
+    // 3: 0.15,
+    // 4: 0.08,
+    columnWidthMap: {
+      type: Object,
+      default: () => {
+      }
+    },
+    tableDataKey: {
+      type: String,
+      default: "list"
+    },
+    // 表格总宽度
+    tableDomWidth: {
+      type: Number,
+      default: 0
+    },
+    // 页码和分页大小映射
+    pageMapping: {
+      type: Object,
+      default: () => ({
+        pageSize: "pageSize",
+        pageNum: "pageNum"
+      })
+    }
+  },
+  emits: [
+    ne.paginationChange,
+    "updateTableData",
+    "handleTableSelect",
+    "handleBatchDelete"
+  ],
+  setup(h, { expose: se, emit: ue }) {
+    const R = ue, u = h, I = Se(), z = C(() => typeof u.requestFn == "function"), c = C({
+      get: () => z.value ? y.value : u.tableData,
+      set: (e) => {
+        z.value ? y.value = e : R("updateTableData", e);
+      }
+    }), _ = v(0), F = C(() => z.value ? _.value : u.total), y = v([]), d = C(() => u.pageMapping.pageNum), k = C(() => u.pageMapping.pageSize), D = {
+      [d.value]: 1,
+      [k.value]: 20
+    }, i = v({
+      ...D
+    }), f = v([]), n = v([]), M = v([]), S = v({}), $ = C(() => ie(S.value));
+    function ie(e) {
+      const t = /* @__PURE__ */ new Set();
+      for (const l in e)
+        e.hasOwnProperty(l) && e[l].forEach((a) => {
+          t.add(a.id);
+        });
+      return t;
+    }
+    const L = ({ value: e, intermediate: t = !1, onChange: l }) => W(Pe, {
+      onChange: l,
+      modelValue: e,
+      indeterminate: t
+    }), oe = (e, t) => {
+      if (e.selected = t, t ? n.value.some((l) => l.id === e.id) || n.value.push(e) : n.value = n.value.filter(({ id: l }) => l !== e.id), e.children && e.children.length > 0) {
+        const l = (a) => {
+          a.forEach((s) => {
+            s.selected = t, t ? n.value.some((o) => o.id === s.id) || n.value.push(s) : n.value = n.value.filter(({ id: o }) => o !== s.id), s.children && s.children.length > 0 && l(s.children);
+          });
+        };
+        l(e.children);
+      }
+      e.parentId && V(e.parentId), H(), x();
+    }, V = (e) => {
+      const t = U(c.value, e);
+      if (!t) return;
+      const l = t.children.every((a) => a.selected);
+      l && !t.selected ? (t.selected = !0, n.value.some((a) => a.id === t.id) || n.value.push(t)) : !l && t.selected && (t.selected = !1, n.value = n.value.filter(({ id: a }) => a !== t.id)), t.parentId && V(t.parentId);
+    }, U = (e, t) => {
+      for (const l of e) {
+        if (l.id === t) return l;
+        if (l.children) {
+          const a = U(l.children, t);
+          if (a) return a;
+        }
+      }
+      return null;
+    };
+    function H() {
+      S.value[i.value[d.value]] = G(
+        c.value
+      );
+    }
+    function G(e) {
+      let t = [];
+      return e.forEach((l) => {
+        l.selected && t.push(l), l.children && l.children.length > 0 && (t = t.concat(G(l.children)));
+      }), t;
+    }
+    function j(e, t) {
+      e.selected = t, e.children && e.children.length > 0 && e.children.forEach((l) => j(l, t));
+    }
+    const re = (e) => {
+      const t = c.value.map((l) => (j(l, e), l));
+      return c.value = [...t], H(), n.value = e ? [...Object.values(S.value).flat()] : [], x(), [...n.value];
+    }, ce = () => {
+      f.value.unshift({
+        key: "selection",
+        width: 50,
+        cellRenderer: (e) => {
+          const { rowData: t } = e, a = t.children && t.children.length > 0 ? de(t) : !1;
+          return W(L, {
+            value: t.selected,
+            intermediate: a,
+            onChange: (s) => oe(t, s)
+          });
+        },
+        headerCellRenderer: () => {
+          const e = r(c), t = e.every((a) => {
+            const s = a.selected, o = J(a);
+            return s && o;
+          }), l = e.some((a) => a.selected || Q(a));
+          return W(L, {
+            value: t,
+            intermediate: l && !t,
+            // 目前是当前页全选就是全选状态，也就是每页的全选状态单独的
+            onChange: re
+          });
+        }
+      });
+    }, de = (e) => {
+      if (!e.children || e.children.length === 0)
+        return !1;
+      const t = e.children.filter((l) => l.selected).length;
+      return t > 0 && t < e.children.length;
+    };
+    function J(e) {
+      return e.children?.length ? !!e.selected && e.children.every(J) : !!e.selected;
+    }
+    function Q(e) {
+      return e.selected ? !0 : e.children?.some(Q) || !1;
+    }
+    function X(e) {
+      return e.map((t) => {
+        const l = { ...t, selected: !1 };
+        return l.children && (l.children = X(l.children)), l;
+      });
+    }
+    const p = v(!1), fe = () => {
+      p.value = !0, ce();
+    }, O = () => {
+      p.value = !1, n.value = [], c.value = c.value.map((e) => (j(e, !1), e)), S.value = {}, y.value = X(y.value), f.value.shift(), x();
+    }, ve = () => {
+      R("handleBatchDelete", {
+        selectedRows: Object.values(S.value).flat(),
+        // getAllSelectedNodes(finalTableData.value)
+        cb: () => {
+          O(), x();
+        }
+      });
+    }, he = () => {
+      n.value = [], x();
+    };
+    function x() {
+      const e = Object.values(S.value).flat();
+      R("handleTableSelect", {
+        originNodeData: n.value,
+        allSelectedNodes: e,
+        // 所有选中的节点包含父节点
+        selectedSubNodes: e.filter((t) => !t.children)
+        // 所有选中的子节点
+      });
+    }
+    const T = () => {
+      z.value ? u.requestFn({
+        ...u.params,
+        ...i.value
+      }).then((e) => {
+        y.value = q(
+          e?.data[u.tableDataKey],
+          i.value[d.value],
+          $.value
+        ) || [], _.value = e?.data?.total;
+      }) : (y.value = q(
+        u.tableData,
+        i.value[d.value],
+        $.value
+      ), _.value = u.total);
+    };
+    function q(e, t, l, a = !1) {
+      return e.map((s) => {
+        const o = l.has(s.id) || a, b = {
+          ...s,
+          selected: o
+        };
+        return b.children && (b.children = q(
+          b.children,
+          t,
+          l,
+          o
+          // 将当前选中状态传递给子节点
+        )), b;
+      });
+    }
+    const pe = () => {
+      i.value[d.value] = D[d.value], T();
+    }, ge = () => {
+      i.value = { ...D }, T();
+    }, Y = (e) => {
+      e === "size" && (i.value[d.value] = 1), T(), R(ne.paginationChange, i.value);
+    }, N = v(0), P = () => {
+      let e = N.value;
+      e = p.value ? e - 50 : e;
+      let t = r(f);
+      p.value && (t = r(f).slice(1));
+      const l = 1 / Ee();
+      t = t.map((a, s) => (u.columnWidthMap ? a.width = e * u.columnWidthMap[s] * l : (a.width = e * (100 / t.length / 100) * l, a.width < 100 && (a.width = 100 * l)), a)), p.value ? f.value = [r(f)[0], ...t] : f.value = [...t];
+    };
+    ee(
+      () => p.value,
+      () => {
+        P();
+      }
+    ), ee(
+      () => u.tableDomWidth,
+      (e) => {
+        e && (N.value = e, P());
+      }
+    );
+    function me(e, t = 200) {
+      let l;
+      return function() {
+        clearTimeout(l), l = setTimeout(() => {
+          e.apply(this, arguments);
+        }, t);
+      };
+    }
+    const Z = me(() => {
+      N.value = document.querySelector(".TABLE-AREA").getBoundingClientRect().width, P();
+    }, 200);
+    return be(() => {
+      T(), f.value = u.columns, N.value = document.querySelector(".TABLE-AREA").getBoundingClientRect().width, Ce(() => {
+        P();
+      }), window.addEventListener("resize", Z);
+    }), se({
+      getTableList: T,
+      search: pe,
+      reset: ge,
+      initBatchSelect: he,
+      handleCancelSelect: O,
+      handleResize: Z
+    }), (e, t) => (g(), w("div", De, [
+      m("div", je, [
+        r(I)["filter-left"] ? (g(), w("div", Oe, [
+          A(e.$slots, "filter-left", {}, void 0, !0)
+        ])) : B("", !0),
+        m("div", qe, [
+          h.hasBatchSelect && c.value.length ? (g(), w(xe, { key: 0 }, [
+            p.value ? (g(), w("div", Ke, [
+              m("div", We, "已选" + Te(n.value.length) + "条数据", 1),
+              m("div", {
+                class: "fz-12 text-3b64ff mg-l-4 pointer",
+                onClick: O
+              }, "取消选择"),
+              A(e.$slots, "btn-group", {}, () => [
+                m("div", Fe, [
+                  K(r(ae), {
+                    type: "danger",
+                    onClick: ve,
+                    disabled: !n.value.length
+                  }, {
+                    default: E(() => [...t[6] || (t[6] = [
+                      le("删除", -1)
+                    ])]),
+                    _: 1
+                  }, 8, ["disabled"])
+                ])
+              ], !0)
+            ])) : (g(), te(r(ae), {
+              key: 0,
+              type: "default",
+              onClick: fe
+            }, {
+              default: E(() => [...t[5] || (t[5] = [
+                le(" 批量选择 ", -1)
+              ])]),
+              _: 1
+            }))
+          ], 64)) : B("", !0),
+          r(I)["filter-right"] ? A(e.$slots, "filter-right", { key: 1 }, void 0, !0) : B("", !0)
+        ])
+      ]),
+      m("div", Me, [
+        m("div", $e, [
+          K(r(ke), null, {
+            default: E(({ width: l, height: a }) => [
+              K(r(Ne), {
+                "expanded-row-keys": M.value,
+                "onUpdate:expandedRowKeys": t[0] || (t[0] = (s) => M.value = s),
+                "expand-column-key": h.expandColumnKey,
+                columns: f.value,
+                data: c.value,
+                width: l,
+                height: a,
+                fixed: ""
+              }, we({ _: 2 }, [
+                Be(r(I), (s, o) => ({
+                  name: o,
+                  fn: E((b) => [
+                    A(e.$slots, o, Re(ze(b)), void 0, !0)
+                  ])
+                }))
+              ]), 1032, ["expanded-row-keys", "expand-column-key", "columns", "data", "width", "height"])
+            ]),
+            _: 3
+          })
+        ]),
+        h.isPagination && F.value > i.value[k.value] ? (g(), w("div", Le, [
+          h.isPagination ? (g(), te(Ie, {
+            key: 0,
+            "current-page": i.value[d.value],
+            "onUpdate:currentPage": t[1] || (t[1] = (l) => i.value[d.value] = l),
+            "page-size": i.value[k.value],
+            "onUpdate:pageSize": t[2] || (t[2] = (l) => i.value[k.value] = l),
+            "page-sizes": h.pagination.pageSizes,
+            layout: h.pagination.layout,
+            total: F.value,
+            onSizeChange: t[3] || (t[3] = (l) => Y("size")),
+            onCurrentChange: t[4] || (t[4] = (l) => Y("page"))
+          }, null, 8, ["current-page", "page-size", "page-sizes", "layout", "total"])) : B("", !0)
+        ])) : B("", !0)
+      ])
+    ]));
+  }
+}), Ue = /* @__PURE__ */ _e(Ve, [["__scopeId", "data-v-0c8c6750"]]), Ze = ye(Ue);
+export {
+  Ze as PaginationTable,
+  Ze as default
+};

package/es/SearchBar.mjs

@@ -0,0 +1,7 @@
+import { w as a } from "./chunks/index.bCzIhWFw.js";
+import { S as r } from "./chunks/layout.CTQtuC78.js";
+const s = a(r);
+export {
+  s as SearchBar,
+  s as default
+};