@wetspace/pro-components/dist/pro-table/src/index.vue.mjs

::: tip 基本介绍

import { defineComponent as O, shallowRef as E, openBlock as u, createElementBlock as m, normalizeClass as p, unref as e, createVNode as l, mergeProps as S, withCtx as d, renderSlot as U, createTextVNode as w, toDisplayString as x, createCommentVNode as v, createElementVNode as b, createBlock as Q, isRef as A, withDirectives as B } from "vue";
import { useNamespace as X, ElLoading as Y, ElSpace as Z, ElButton as C, ElPagination as ee } from "element-plus";
import { WetSchemaForm as oe } from "../../pro-form/index.mjs";
import te from "./base.mjs";
import { wetProTableProps as se } from "./types.mjs";
import ae from "./hooks/use-colunms.mjs";
import re from "./hooks/use-form.mjs";
import ne from "./hooks/use-request.mjs";
import le from "./hooks/use-tools.mjs";
import ie from "./components/tool-icon.vue.mjs";
import { ArrowDown as ue, ArrowUp as ce } from "../../node_modules/.pnpm/@element-plus_icons-vue@2.3.1_vue@3.5.12_typescript@5.4.2_/node_modules/@element-plus/icons-vue/dist/index.mjs";
const me = {
  key: 0,
  class: "tabel-body-tool"
}, pe = { class: "tabel-body-tool--title" }, de = { style: { flex: "1", display: "flex", "justify-content": "end" } }, fe = { class: "tabel-body-inner" }, he = /* @__PURE__ */ O({
  name: "WetProTable",
  __name: "index",
  props: se,
  emits: ["update:selections"],
  setup(D, { emit: N }) {
    const t = X("pro-table"), s = D, V = N, $ = E(), F = E(), k = Y.directive, { columns: _, columnsControl: y } = ae(s), {
      formPorps: P,
      properties: I,
      formIns: W,
      collapsed: f,
      getSearchValue: q,
      formState: L,
      resetForm: j
    } = re(s, _), { dataSource: h, paginationInfo: r, $pagination: c, loading: R, runReuestApi: z } = ne(s, L), { showTool: M, tableSize: a, paginationSize: G } = le(s), g = async (i = !1) => {
      await q(), i && (r.value.currentPage = 1), await z();
    }, T = () => {
      r.value.currentPage = 1, c.value && (r.value.pageSize = c.value.pageSizes[0]), j(), g();
    }, H = () => g(), J = (i) => {
      V("update:selections", i);
    }, K = () => {
      f.value = !f.value;
    };
    return (i, o) => (u(), m("div", {
      ref_key: "tableDiv",
      ref: $,
      class: p([
        e(t).b(),
        e(t).is("fill", s.fill),
        e(t).is("card-bordered", s.cardBordered)
      ])
    }, [
      e(P) ? (u(), m("section", {
        key: 0,
        class: p([e(t).e("header"), e(t).is("small", e(a) === "small")])
      }, [
        l(e(oe), S(e(P), {
          ref_key: "formIns",
          ref: W,
          size: e(a),
          properties: e(I),
          clearable: ""
        }), {
          actions: d(() => [
            l(e(Z), {
              class: "search-actions",
              wrap: ""
            }, {
              default: d(() => [
                U(i.$slots, "search-actions", {
                  search: () => g(!0),
                  reset: T
                }, () => [
                  l(e(C), {
                    type: "primary",
                    onClick: o[0] || (o[0] = () => g(!0))
                  }, {
                    default: d(() => o[5] || (o[5] = [
                      w(" 查询 ")
                    ])),
                    _: 1
                  }),
                  l(e(C), { onClick: T }, {
                    default: d(() => o[6] || (o[6] = [
                      w(" 重置 ")
                    ])),
                    _: 1
                  })
                ]),
                l(e(C), {
                  link: "",
                  type: "primary",
                  icon: e(f) ? e(ce) : e(ue),
                  onClick: K
                }, {
                  default: d(() => [
                    w(x(e(f) ? "收起" : "展开"), 1)
                  ]),
                  _: 1
                }, 8, ["icon"])
              ]),
              _: 3
            })
          ]),
          _: 3
        }, 16, ["size", "properties"])
      ], 2)) : v("", !0),
      b("section", {
        class: p([e(t).e("body"), e(t).is("small", e(a) === "small")])
      }, [
        e(M) ? (u(), m("div", me, [
          b("div", pe, x(s.title), 1),
          b("div", de, [
            U(i.$slots, "tools-bar")
          ]),
          s.showMoreTools ? (u(), Q(ie, {
            key: 0,
            size: e(a),
            "onUpdate:size": o[1] || (o[1] = (n) => A(a) ? a.value = n : null),
            columns: e(y),
            "onUpdate:columns": o[2] || (o[2] = (n) => A(y) ? y.value = n : null),
            "init-columns": s.columns || [],
            onRefresh: H
          }, null, 8, ["size", "columns", "init-columns"])) : v("", !0)
        ])) : v("", !0),
        B((u(), m("div", fe, [
          l(e(te), S(s, {
            ref_key: "tableRef",
            ref: F,
            request: "",
            columns: e(_),
            data: e(h).data,
            size: e(a),
            "onUpdate:selections": J
          }), null, 16, ["columns", "data", "size"])
        ])), [
          [e(k), e(R)]
        ]),
        e(c) ? B((u(), m("section", {
          key: 1,
          class: p([e(t).e("footer"), e(t).is("small", e(a) === "small"), e(c).position])
        }, [
          b("div", {
            class: p([e(t).e("pagination-inner")])
          }, [
            l(e(ee), S({
              ...e(c),
              ...e(G)
            }, {
              "current-page": e(r).currentPage,
              "onUpdate:currentPage": o[3] || (o[3] = (n) => e(r).currentPage = n),
              "page-size": e(r).pageSize,
              "onUpdate:pageSize": o[4] || (o[4] = (n) => e(r).pageSize = n),
              total: e(h).total,
              onCurrentChange: e(z),
              onSizeChange: e(z)
            }), null, 16, ["current-page", "page-size", "total", "onCurrentChange", "onSizeChange"])
          ], 2)
        ], 2)), [
          [e(k), e(R) ? {
            svg: " "
          } : !1]
        ]) : v("", !0)
      ], 2)
    ], 2));
  }
});
export {
  he as default
};