@web-utils/component 2.7.36 → 2.8.0

package/table-page/index.mjs

@@ -0,0 +1,132 @@
+import { c as u } from "../chunks/config.46422d7f.mjs";
+import { o as n } from "../chunks/util.17330567.mjs";
+import { n as g } from "../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var l = function() {
+  var e = this, t = e.$createElement, i = e._self._c || t;
+  return e.pageFlag && e.optVal(e.crud.tableOption.page, !0) ? i("ElCard", {
+    staticClass: "avue-pagination",
+    attrs: {
+      shadow: e.crud.isCard
+    }
+  }, [e._t("page"), i("ElPagination", {
+    staticStyle: {
+      "margin-top": "25px"
+    },
+    attrs: {
+      small: e.crud.size === "mini",
+      disabled: e.defaultPage.disabled,
+      "hide-on-single-page": e.defaultPage.single,
+      "pager-count": e.defaultPage.pagerCount,
+      "current-page": e.defaultPage.currentPage,
+      background: e.defaultPage.background,
+      "page-size": e.defaultPage.pageSize,
+      "page-sizes": e.defaultPage.pageSizes,
+      layout: e.defaultPage.layout,
+      total: e.defaultPage.total
+    },
+    on: {
+      "update:currentPage": function(a) {
+        return e.$set(e.defaultPage, "currentPage", a);
+      },
+      "update:current-page": function(a) {
+        return e.$set(e.defaultPage, "currentPage", a);
+      },
+      "size-change": e.sizeChange,
+      "prev-click": e.prevClick,
+      "next-click": e.nextClick,
+      "current-change": e.currentChange
+    }
+  })], 2) : e._e();
+}, s = [];
+const c = {
+  name: "TablePage",
+  inject: ["crud"],
+  data() {
+    return {
+      config: u,
+      defaultPage: {
+        single: !1,
+        total: 0,
+        // 总页数
+        pagerCount: 7,
+        // 超过多少条隐藏
+        currentPage: 1,
+        // 当前页数
+        pageSize: 10,
+        // 每页显示多少条
+        pageSizes: [10, 20, 30, 40, 50, 100],
+        layout: "total, sizes, prev, pager, next, jumper",
+        background: !0
+        // 背景颜色
+      }
+    };
+  },
+  computed: {
+    pageFlag() {
+      return this.defaultPage.total != 0;
+    }
+  },
+  watch: {
+    "crud.page": {
+      handler() {
+        this.pageInit();
+      },
+      deep: !0
+    },
+    pageFlag() {
+      this.crud.getTableHeight();
+    },
+    // 如果当前页面删除没数据了调用第一页
+    "defaultPage.total"() {
+      this.defaultPage.total === (this.defaultPage.currentPage - 1) * this.defaultPage.pageSize && this.defaultPage.total != 0 && (this.defaultPage.currentPage = this.defaultPage.currentPage - 1, this.currentChange(this.defaultPage.currentPage));
+    }
+  },
+  created() {
+    this.crud.isMobile && (this.defaultPage.layout = "total, sizes, prev, pager, next"), this.pageInit(), this.crud.$emit("on-load", this.defaultPage);
+  },
+  methods: {
+    optVal: n,
+    pageInit() {
+      this.defaultPage = Object.assign(this.defaultPage, this.crud.page), this.updateValue();
+    },
+    updateValue() {
+      this.crud.$emit("update:page", this.defaultPage);
+    },
+    // 下一页事件
+    nextClick(e) {
+      this.crud.$emit("next-click", e);
+    },
+    // 上一页事件
+    prevClick(e) {
+      this.crud.$emit("prev-click", e);
+    },
+    // 页大小回调
+    sizeChange(e) {
+      this.defaultPage.currentPage = 1, this.defaultPage.pageSize = e, this.updateValue(), this.crud.$emit("on-load", this.defaultPage), this.crud.$emit("size-change", e);
+    },
+    // 页码回调
+    currentChange(e) {
+      this.updateValue(), this.crud.$emit("on-load", this.defaultPage), this.crud.$emit("current-change", e);
+    }
+  }
+}, r = {};
+var d = /* @__PURE__ */ g(
+  c,
+  l,
+  s,
+  !1,
+  o,
+  null,
+  null,
+  null
+);
+function o(e) {
+  for (let t in r)
+    this[t] = r[t];
+}
+const P = /* @__PURE__ */ function() {
+  return d.exports;
+}();
+export {
+  P as default
+};

package/table-view/index.mjs

@@ -0,0 +1,390 @@
+var o = (e, r, t) => new Promise((s, l) => {
+  var a = (i) => {
+    try {
+      c(t.next(i));
+    } catch (h) {
+      l(h);
+    }
+  }, b = (i) => {
+    try {
+      c(t.throw(i));
+    } catch (h) {
+      l(h);
+    }
+  }, c = (i) => i.done ? s(i.value) : Promise.resolve(i.value).then(a, b);
+  c((t = t.apply(e, r)).next());
+});
+import { merge as n } from "@web-utils/integrations/lodash";
+import { isString as d, isArray as m, trace as f, warning as _, toStringArray as g, isFunction as w, hasOwn as p } from "@web-utils/core";
+import { k as v } from "../chunks/index.57f871af.mjs";
+import { n as y } from "../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var P = function() {
+  var e = this, r = e.$createElement, t = e._self._c || r;
+  return t("div", {
+    staticClass: "table-view"
+  }, [t("Toolbar", e._g(e._b({
+    on: {
+      search: e.toggleSearch,
+      del: e.del,
+      create: e.create,
+      reload: e.reloadTable,
+      imp: function(s) {
+        e.importDialogVisible = !0;
+      }
+    },
+    scopedSlots: e._u([{
+      key: "default",
+      fn: function() {
+        return [e._t("toolbar-button")];
+      },
+      proxy: !0
+    }, e._l(e.buttonSlots, function(s) {
+      return {
+        key: s,
+        fn: function() {
+          return [e._t(s)];
+        },
+        proxy: !0
+      };
+    })], null, !0)
+  }, "Toolbar", e.toolbarProps, !1), e.toolbarListeners)), t("div", {
+    staticClass: "table-view-content-wrapper"
+  }, [t("div", {
+    staticClass: "table-view-content"
+  }, [e.treeProps.show ? t("div", {
+    ref: "treeScroller",
+    staticClass: "table-view-sidebar",
+    on: {
+      scroll: e.onTreeScroll
+    }
+  }, [t("div", {
+    staticStyle: {
+      "font-size": "16px"
+    }
+  }, [e._v(" 视图导航 ")]), t("EditableTree", e._g(e._b({
+    ref: "tree",
+    attrs: {
+      readonly: ""
+    },
+    scopedSlots: e._u([{
+      key: "default",
+      fn: function(s) {
+        var l = s.node, a = s.data;
+        return [e._t("tree-node", function() {
+          return [t("span", [t("i", {
+            staticClass: "node-icon",
+            class: l.childNodes.length > 0 ? l.expanded ? "el-icon-folder-opened" : "el-icon-folder" : "el-icon-tickets"
+          }), e._t("tree-label", function() {
+            return [e._v(e._s(l.label))];
+          }, {
+            node: l,
+            data: a
+          })], 2)];
+        }, {
+          node: l,
+          data: a
+        })];
+      }
+    }], null, !0)
+  }, "EditableTree", e.treeProps, !1), e.treeListeners))], 1) : e._e(), t("div", {
+    staticClass: "table-view-table"
+  }, [t("PageableTable", e._g(e._b({
+    ref: "table",
+    class: [{
+      "border-top": e.borderTop,
+      "border-bottom": e.borderBottom,
+      "border-left": e.borderLeft || e.treeAttrs && e.treeAttrs.show,
+      "border-right": e.borderRight
+    }],
+    attrs: {
+      border: e.border
+    },
+    on: {
+      "row-dblclick": e.rowDbClick,
+      "selection-change": e.onSelectionChange
+    }
+  }, "PageableTable", e.tableProps, !1), e.tableListeners), [e._t("columns")], 2)], 1)]), e.toolbarProps.searchable ? t("div", {
+    staticClass: "slide-panel",
+    style: {
+      right: `${e.right}px`,
+      width: `${e.searchPanelProps.width}px`
+    }
+  }, [e._m(0), t("div", {
+    staticClass: "slide-panel-content"
+  }, [t("ElForm", {
+    ref: "form",
+    attrs: {
+      "label-position": "right",
+      model: e.searchModel || e.searchPanelProps.model,
+      size: "mini",
+      "label-width": e.labelWidth
+    },
+    nativeOn: {
+      "!submit": function(s) {
+        return s.preventDefault(), e.onSearchClick.apply(null, arguments);
+      }
+    }
+  }, [t("FormItemConfigProvider", {
+    attrs: {
+      block: "",
+      "wrap-col": !1
+    }
+  }, [t("ElRow", {
+    attrs: {
+      gutter: 0
+    }
+  }, [e._t("search-form", function() {
+    return [t("p", [e._v("请添加搜索条件！")])];
+  })], 2)], 1), t("ElFormItem", {
+    attrs: {
+      "label-width": "0"
+    }
+  }, [t("div", {
+    staticClass: "slide-panel-actions"
+  }, [t("ElButton", {
+    attrs: {
+      type: "primary",
+      "native-type": "submit",
+      size: "mini"
+    }
+  }, [e._v(" 开始搜索 ")]), t("ElButton", {
+    attrs: {
+      size: "mini"
+    },
+    on: {
+      click: e.onClearClick
+    }
+  }, [e._v(" 清除条件 ")])], 1)])], 1)], 1)]) : e._e()]), e._t("default")], 2);
+}, S = [function() {
+  var e = this, r = e.$createElement, t = e._self._c || r;
+  return t("div", {
+    staticClass: "slide-panel-line"
+  }, [t("div", {
+    staticClass: "slide-panel-line-indicator"
+  })]);
+}];
+const $ = ["back", "create", "save", "withdraw", "edit", "submit", "publish", "agree", "disagree", "reject", "finish", "cancel", "enable", "exp", "imp", "del", "disabled", "reload", "slot"], T = {
+  name: "TableView",
+  bus: {
+    reloadTableView(e, r) {
+      if (this._viewIds)
+        if (d(e) || m(e)) {
+          let t = e;
+          d(t) && (t = t.split(",")), this._viewIds.some((s) => t.includes(s)) && (r ? this.$refs.tree && (f.call(this.$parent || {}, "reloadTree"), this.refreshTree()) : (f.call(this.$parent || {}, "reloadTable"), this.reloadTable()));
+        } else
+          _.call(this.$parent || {}, "`viewId`的类型必须是字符串或数组");
+    }
+  },
+  props: {
+    viewId: {
+      type: String
+    },
+    searchPanelAttrs: {
+      type: Object,
+      default: () => {
+      }
+    },
+    toolbarAttrs: {
+      type: Object,
+      default: () => {
+      }
+    },
+    toolbarListeners: {
+      type: Object
+    },
+    treeAttrs: {
+      type: Object,
+      default: () => {
+      }
+    },
+    treeListeners: {
+      type: Object
+    },
+    tableAttrs: {
+      type: Object
+    },
+    searchModel: {
+      type: Object
+    },
+    tableListeners: {
+      type: Object,
+      default: () => {
+      }
+    },
+    deleteApi: {
+      type: Function
+    },
+    borderTop: Boolean,
+    borderBottom: Boolean,
+    borderLeft: Boolean,
+    borderRight: Boolean,
+    border: {
+      type: Boolean,
+      default: !0
+    },
+    labelWidth: {
+      type: String,
+      default: "80px"
+    },
+    formPath: {
+      type: [String, Function]
+    }
+  },
+  data() {
+    var e;
+    return {
+      importDialogVisible: !1,
+      right: -(((e = this.searchPanelAttrs) == null ? void 0 : e.width) || 350),
+      selectedRows: []
+    };
+  },
+  computed: {
+    buttonSlots() {
+      return $.filter((e) => this.$scopedSlots[e]);
+    },
+    toolbarProps() {
+      var s, l;
+      const e = {}, r = n(this.toolbarAttrs, e);
+      let t = (r == null ? void 0 : r.buttons) || this.$parent.buttons;
+      return t = t || [], t.includes("reload") || (t = [...t, "reload"]), r.buttons = t, r.buttons = g(r.buttons), r.searchable = !!((l = (s = this.$scopedSlots)["search-form"]) != null && l.call(s)), r;
+    },
+    treeProps() {
+      const e = {
+        treeProps: {
+          children: "children",
+          label: "label",
+          isLeaf: (r) => p(r, "hasChildren") ? !r.hasChildren : p(r, "hasChild") ? !r.hasChild : !0
+        },
+        show: !1,
+        lazy: !0,
+        readonly: !0,
+        data: [],
+        "expand-first-node": !1,
+        "default-expand-all": !1
+      };
+      return n(this.treeAttrs, e);
+    },
+    tableProps() {
+      const e = this.tableAttrs.api || this.$parent.getPage, r = {
+        model: this.searchModel || {},
+        height: "auto",
+        "highlight-current-row": !0,
+        api: e
+      };
+      return n(this.tableAttrs, r);
+    },
+    searchPanelProps() {
+      const e = {
+        width: 350,
+        model: this.searchModel || {}
+      };
+      return n(this.searchPanelAttrs, e);
+    }
+  },
+  created() {
+    this._viewIds = [], this.viewId && this._viewIds.push(this.viewId), this._viewIds.includes(this.$parent.$options.name) || this._viewIds.push(this.$parent.$options.name);
+  },
+  activated() {
+    return o(this, null, function* () {
+      this.$refs.treeScroller && (this.treeScrollTop && (this.$refs.treeScroller.scrollTop = this.treeScrollTop), this.treeScrollLeft && (this.$refs.treeScroller.scrollLeft = this.treeScrollLeft));
+    });
+  },
+  methods: {
+    onTreeScroll() {
+      this.treeScrollTop = this.$refs.treeScroller.scrollTop, this.treeScrollLeft = this.$refs.treeScroller.scrollLeft;
+    },
+    toggleSearch() {
+      this.right = this.right === 0 ? -this.searchPanelProps.width : 0;
+    },
+    onSearchClick() {
+      return o(this, null, function* () {
+        this.$refs.table.setModel(this.searchModel || this.searchPanelProps.model), yield this.refreshTable();
+      });
+    },
+    onClearClick() {
+      return o(this, null, function* () {
+        this.$emit("reset"), this.$refs.form.resetFields(), this.$refs.table.setModel(this.searchModel || this.searchPanelProps.model), yield this.refreshTable();
+      });
+    },
+    openFrom(e) {
+      this.$router.push(v(this.formPath, e));
+    },
+    rowDbClick(e) {
+      var r;
+      !((r = this.tableListeners) != null && r["row-dblclick"]) && this.formPath && this.openFrom(e);
+    },
+    onSelectionChange(e) {
+      this.selectedRows = e;
+    },
+    create() {
+      var e;
+      !((e = this.toolbarListeners) != null && e.create) && this.formPath && this.openFrom();
+    },
+    del() {
+      return o(this, null, function* () {
+        var r;
+        const e = this.deleteApi || this.$parent.del;
+        if (!((r = this.toolbarListeners) != null && r.del) && w(e)) {
+          if (!this.selectedRows.length) {
+            this.$message.warning("请选择要删除的记录！");
+            return;
+          }
+          yield this.$confirm(
+            `您确定要删除选中的[<span class="break-word" style="color: orange">${this.selectedRows.length}</span>]行记录吗？`,
+            "系统提示",
+            {
+              type: "warning",
+              modal: !0,
+              dangerouslyUseHTMLString: !0,
+              closeOnClickModal: !1,
+              beforeClose: (t, s, l) => o(this, null, function* () {
+                if (t === "confirm")
+                  try {
+                    s.confirmButtonLoading = !0, s.confirmButtonText = "删除...", yield e.call(this, this.selectedRows.map((a) => a.id).join(",")), this.$message.success("删除成功"), yield this.reloadTable(), yield this.refreshTree();
+                  } catch (a) {
+                  }
+                l();
+              })
+            }
+          ).catch((t) => t);
+        }
+      });
+    },
+    reloadTable() {
+      var e;
+      (e = this.$refs.table) == null || e.reload();
+    },
+    refreshTable() {
+      return o(this, null, function* () {
+        var e;
+        yield (e = this.$refs.table) == null ? void 0 : e.getPage();
+      });
+    },
+    refreshTree() {
+      this.$refs.tree.reloadTree();
+    },
+    getSearchModel() {
+      return this.searchPanelProps.model;
+    }
+  }
+}, u = {};
+var C = /* @__PURE__ */ y(
+  T,
+  P,
+  S,
+  !1,
+  L,
+  null,
+  null,
+  null
+);
+function L(e) {
+  for (let r in u)
+    this[r] = u[r];
+}
+const M = /* @__PURE__ */ function() {
+  return C.exports;
+}();
+export {
+  M as default
+};

package/table-view/style.css

@@ -0,0 +1 @@
+.table-view{display:flex;flex-direction:column;height:100%}.table-view .el-table--border{border:none}.table-view .border-top .el-table--border{border-top:1px solid #ebeef5}.table-view .border-bottom .el-table--border{border-bottom:1px solid #ebeef5}.table-view .border-left .el-table--border,.table-view .border-left .el-pagination{border-left:1px solid #ebeef5}.table-view .border-right .el-table--border{border-right:1px solid #ebeef5}.table-view .table-view-content-wrapper{position:relative;flex:1;overflow:hidden}.table-view .table-view-content{position:absolute;top:0;left:0;display:flex;width:100%;height:100%;background-color:#fff}.table-view .table-view-sidebar{flex-shrink:0;width:240px;height:100%;padding:10px;overflow:auto}.table-view .table-view-sidebar .et-tree-wrapper{display:table;overflow:visible}.table-view .table-view-table{flex:1 1 auto;height:100%}.table-view .slide-panel{position:absolute;top:0;right:0;bottom:0;z-index:5;display:flex;background-color:#fff;transition:right .2s ease}.table-view .slide-panel .slide-panel-line{position:relative;width:3px;height:100%;background-color:#ddd;flex-shrink:0}.table-view .slide-panel .slide-panel-line-indicator{position:absolute;top:50%;left:0;width:100%;height:50px;background-color:#aaa;transform:translateY(-50%)}.table-view .slide-panel .slide-panel-actions{display:flex;align-items:center;justify-content:center;margin-top:10px}.table-view .slide-panel .slide-panel-content{flex:1;padding:10px;overflow:auto}.table-view .slide-panel .slide-panel-content .el-date-editor{width:100%}

package/tag-render/index.mjs

@@ -0,0 +1,108 @@
+var c = Object.defineProperty;
+var r = Object.getOwnPropertySymbols;
+var _ = Object.prototype.hasOwnProperty, g = Object.prototype.propertyIsEnumerable;
+var l = (t, e, n) => e in t ? c(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n, o = (t, e) => {
+  for (var n in e || (e = {}))
+    _.call(e, n) && l(t, n, e[n]);
+  if (r)
+    for (var n of r(e))
+      g.call(e, n) && l(t, n, e[n]);
+  return t;
+};
+import { hasOwn as i } from "@web-utils/core";
+import { n as m } from "../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var f = function() {
+  var t = this, e = t.$createElement, n = t._self._c || e;
+  return n("div", {
+    staticClass: "tag-render"
+  }, [t.tags && t.tags.length && t.tags[0] ? t._l(t.internalTags, function(s, a) {
+    return n("ElTag", {
+      key: a,
+      attrs: {
+        closable: t.enable,
+        "disable-transitions": ""
+      },
+      on: {
+        close: function(b) {
+          return t.$emit("close", t.tags[a], a);
+        }
+      }
+    }, [t._v(" " + t._s(t.getTagName(s)) + " ")]);
+  }) : t.enable ? t._e() : [n("span", {
+    staticStyle: {
+      color: "#b5b5b5"
+    }
+  }, [t._v("无")])], t.enable ? n("ElButton", {
+    staticClass: "el-tag el-tag--medium el-tag--light button-new-tag",
+    attrs: {
+      size: "small"
+    },
+    on: {
+      click: function(s) {
+        return t.$emit("add");
+      }
+    }
+  }, [t._v(" + 添加 ")]) : t._e(), t.count ? n("span", {
+    staticClass: "tags-count"
+  }, [t._v(t._s(t.tags.length && t.tags[0] ? t.tags.length : ""))]) : t._e()], 2);
+}, d = [];
+const p = {
+  name: "TagRender",
+  inject: ["elFormItem"],
+  props: {
+    enable: {
+      type: Boolean,
+      default: !0
+    },
+    count: {
+      type: Boolean,
+      default: !0
+    },
+    tags: {
+      type: Array,
+      default: () => []
+    },
+    transfer: {
+      type: Function,
+      default: null
+    }
+  },
+  computed: {
+    internalTags() {
+      return this.transfer ? this.tags.map((t) => {
+        const e = o({}, t);
+        return this.transfer(e);
+      }) : this.tags;
+    }
+  },
+  watch: {
+    tags(t) {
+      this.elFormItem && t && t.length > 0 && this.elFormItem.clearValidate();
+    }
+  },
+  methods: {
+    getTagName(t) {
+      return i(t, "name") ? t.name : i(t, "label") ? t.label : t;
+    }
+  }
+}, u = {};
+var v = /* @__PURE__ */ m(
+  p,
+  f,
+  d,
+  !1,
+  h,
+  null,
+  null,
+  null
+);
+function h(t) {
+  for (let e in u)
+    this[e] = u[e];
+}
+const $ = /* @__PURE__ */ function() {
+  return v.exports;
+}();
+export {
+  $ as default
+};

package/tag-render/style.css

@@ -0,0 +1 @@
+.tag-render{min-height:80px;padding-top:3px;padding-right:5px;padding-left:5px;overflow:hidden;background-color:#fff;border:1px solid #d7dae0;border-radius:4px}.tag-render .el-tag{margin-top:4px}.tag-render .button-new-tag{padding-top:0;padding-bottom:0}.tag-render .el-tag .el-tag__close:hover{background-color:#ee8677}.tag-render .tags-count{position:absolute;right:7px;bottom:-4px;color:#b7b7b7;font-size:.9em}