@web-utils/component 2.0.10 → 2.0.12

package/dist/components/table-view/index.js

@@ -1,161 +1,185 @@
-import { isString as o, isArray as d, trace as n, warning as f, merge as i, toStringArray as p, isFunction as u, hasOwn as c } from "@web-utils/core";
-import { k as b } from "../../chunks/f71045fc.js";
-import { n as m } from "../../chunks/5d4282fb.js";
-var _ = function() {
-  var e = this, r = e.$createElement, t = e._self._c || r;
-  return t("div", {
+import { isString, isArray, trace, warning, merge, toStringArray, isFunction, hasOwn } from "@web-utils/core";
+import { k as fillPath } from "../../chunks/c69d5628.js";
+import { n as normalizeComponent } from "../../chunks/3d28cc08.js";
+var render = function() {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c("div", {
     staticClass: "table-view"
-  }, [t("Toolbar", e._g(e._b({
+  }, [_c("Toolbar", _vm._g(_vm._b({
     on: {
-      search: e.toggleSearch,
-      del: e.del,
-      create: e.create,
-      reload: e.reloadTable,
-      imp: function(s) {
-        e.importDialogVisible = !0;
+      "search": _vm.toggleSearch,
+      "del": _vm.del,
+      "create": _vm.create,
+      "reload": _vm.reloadTable,
+      "imp": function($event) {
+        _vm.importDialogVisible = true;
       }
     },
-    scopedSlots: e._u([{
+    scopedSlots: _vm._u([{
       key: "default",
       fn: function() {
-        return [e._t("toolbar-button")];
+        return [_vm._t("toolbar-button")];
       },
-      proxy: !0
-    }, e._l(e.buttonSlots, function(s) {
+      proxy: true
+    }, _vm._l(_vm.buttonSlots, function(item) {
       return {
-        key: s,
+        key: item,
         fn: function() {
-          return [e._t(s)];
+          return [_vm._t(item)];
         },
-        proxy: !0
+        proxy: true
       };
-    })], null, !0)
-  }, "Toolbar", e.toolbarProps, !1), e.toolbarListeners)), t("div", {
+    })], null, true)
+  }, "Toolbar", _vm.toolbarProps, false), _vm.toolbarListeners)), _c("div", {
     staticClass: "table-view-content-wrapper"
-  }, [t("div", {
+  }, [_c("div", {
     staticClass: "table-view-content"
-  }, [e.treeProps.show ? t("div", {
+  }, [_vm.treeProps.show ? _c("div", {
     ref: "treeScroller",
     staticClass: "table-view-sidebar",
     on: {
-      scroll: e.onTreeScroll
+      "scroll": _vm.onTreeScroll
     }
-  }, [t("div", {
+  }, [_c("div", {
     staticStyle: {
       "font-size": "16px"
     }
-  }, [e._v(" 视图导航 ")]), t("EditableTree", e._g(e._b({
+  }, [_vm._v(" 视图导航 ")]), _c("EditableTree", _vm._g(_vm._b({
     ref: "tree",
     attrs: {
-      readonly: ""
+      "readonly": ""
     },
-    scopedSlots: e._u([{
+    scopedSlots: _vm._u([{
       key: "default",
-      fn: function(s) {
-        var l = s.node, a = s.data;
-        return [e._t("tree-node", function() {
-          return [t("span", [t("i", {
+      fn: function(_ref) {
+        var node = _ref.node, data = _ref.data;
+        return [_vm._t("tree-node", function() {
+          return [_c("span", [_c("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))];
+            class: node.childNodes.length > 0 ? node.expanded ? "el-icon-folder-opened" : "el-icon-folder" : "el-icon-tickets"
+          }), _vm._t("tree-label", function() {
+            return [_vm._v(_vm._s(node.label))];
           }, {
-            node: l,
-            data: a
+            "node": node,
+            "data": data
           })], 2)];
         }, {
-          node: l,
-          data: a
+          "node": node,
+          "data": data
         })];
       }
-    }], null, !0)
-  }, "EditableTree", e.treeProps, !1), e.treeListeners))], 1) : e._e(), t("div", {
+    }], null, true)
+  }, "EditableTree", _vm.treeProps, false), _vm.treeListeners))], 1) : _vm._e(), _c("div", {
     staticClass: "table-view-table"
-  }, [t("PageableTable", e._g(e._b({
+  }, [_c("PageableTable", _vm._g(_vm._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
+      "border-top": _vm.borderTop,
+      "border-bottom": _vm.borderBottom,
+      "border-left": _vm.borderLeft || _vm.treeAttrs && _vm.treeAttrs.show,
+      "border-right": _vm.borderRight
     }],
     attrs: {
-      border: e.border
+      "border": _vm.border
     },
     on: {
-      "row-dblclick": e.rowDbClick,
-      "selection-change": e.onSelectionChange
+      "row-dblclick": _vm.rowDbClick,
+      "selection-change": _vm.onSelectionChange
     }
-  }, "PageableTable", e.tableProps, !1), e.tableListeners), [e._t("columns")], 2)], 1)]), e.toolbarProps.searchable ? t("div", {
+  }, "PageableTable", _vm.tableProps, false), _vm.tableListeners), [_vm._t("columns")], 2)], 1)]), _vm.toolbarProps.searchable ? _c("div", {
     staticClass: "slide-panel",
     style: {
-      right: `${e.right}px`,
-      width: `${e.searchPanelProps.width}px`
+      right: `${_vm.right}px`,
+      width: `${_vm.searchPanelProps.width}px`
     }
-  }, [e._m(0), t("div", {
+  }, [_vm._m(0), _c("div", {
     staticClass: "slide-panel-content"
-  }, [t("ElForm", {
+  }, [_c("ElForm", {
     ref: "form",
     attrs: {
       "label-position": "right",
-      model: e.searchModel || e.searchPanelProps.model,
-      size: "mini",
-      "label-width": e.labelWidth
+      "model": _vm.searchModel || _vm.searchPanelProps.model,
+      "size": "mini",
+      "label-width": _vm.labelWidth
     },
     nativeOn: {
-      "!submit": function(s) {
-        return s.preventDefault(), e.onSearchClick.apply(null, arguments);
+      "!submit": function($event) {
+        $event.preventDefault();
+        return _vm.onSearchClick.apply(null, arguments);
       }
     }
-  }, [t("FormItemConfigProvider", {
+  }, [_c("FormItemConfigProvider", {
     attrs: {
-      block: "",
-      "wrap-col": !1
+      "block": "",
+      "wrap-col": false
     }
-  }, [t("ElRow", {
+  }, [_c("ElRow", {
     attrs: {
-      gutter: 0
+      "gutter": 0
     }
-  }, [e._t("search-form", function() {
-    return [t("p", [e._v("请添加搜索条件！")])];
-  })], 2)], 1), t("ElFormItem", {
+  }, [_vm._t("search-form", function() {
+    return [_c("p", [_vm._v("请添加搜索条件！")])];
+  })], 2)], 1), _c("ElFormItem", {
     attrs: {
       "label-width": "0"
     }
-  }, [t("div", {
+  }, [_c("div", {
     staticClass: "slide-panel-actions"
-  }, [t("ElButton", {
+  }, [_c("ElButton", {
     attrs: {
-      type: "primary",
+      "type": "primary",
       "native-type": "submit",
-      size: "mini"
+      "size": "mini"
     }
-  }, [e._v(" 开始搜索 ")]), t("ElButton", {
+  }, [_vm._v(" 开始搜索 ")]), _c("ElButton", {
     attrs: {
-      size: "mini"
+      "size": "mini"
     },
     on: {
-      click: e.onClearClick
+      "click": _vm.onClearClick
     }
-  }, [e._v(" 清除条件 ")])], 1)])], 1)], 1)]) : e._e()]), e._t("default")], 2);
-}, g = [function() {
-  var e = this, r = e.$createElement, t = e._self._c || r;
-  return t("div", {
+  }, [_vm._v(" 清除条件 ")])], 1)])], 1)], 1)]) : _vm._e()]), _vm._t("default")], 2);
+};
+var staticRenderFns = [function() {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c("div", {
     staticClass: "slide-panel-line"
-  }, [t("div", {
+  }, [_c("div", {
     staticClass: "slide-panel-line-indicator"
   })]);
 }];
-const w = ["back", "create", "save", "withdraw", "edit", "submit", "publish", "agree", "disagree", "reject", "finish", "cancel", "enable", "exp", "imp", "del", "disabled", "reload", "slot"], v = {
+const TableView_vue_vue_type_style_index_0_lang = "";
+const builtInButtons = ["back", "create", "save", "withdraw", "edit", "submit", "publish", "agree", "disagree", "reject", "finish", "cancel", "enable", "exp", "imp", "del", "disabled", "reload", "slot"];
+const __vue2_script = {
   name: "TableView",
   bus: {
-    reloadTableView(e, r) {
-      if (this._viewIds)
-        if (o(e) || d(e)) {
-          let t = e;
-          o(t) && (t = t.split(",")), this._viewIds.some((s) => t.includes(s)) && (r ? this.$refs.tree && (n.call(this.$parent || {}, "reloadTree"), this.refreshTree()) : (n.call(this.$parent || {}, "reloadTable"), this.reloadTable()));
-        } else
-          f.call(this.$parent || {}, "`viewId`的类型必须是字符串或数组");
+    reloadTableView(viewId, tree) {
+      if (!this._viewIds) {
+        return;
+      }
+      if (isString(viewId) || isArray(viewId)) {
+        let viewIds = viewId;
+        if (isString(viewIds)) {
+          viewIds = viewIds.split(",");
+        }
+        if (this._viewIds.some((value) => viewIds.includes(value))) {
+          if (!tree) {
+            trace.call(this.$parent || {}, "reloadTable");
+            this.reloadTable();
+          } else {
+            if (this.$refs.tree) {
+              trace.call(this.$parent || {}, "reloadTree");
+              this.refreshTree();
+            }
+          }
+        }
+      } else {
+        warning.call(this.$parent || {}, "`viewId`的类型必须是字符串或数组");
+      }
     }
   },
   props: {
@@ -203,7 +227,7 @@ const w = ["back", "create", "save", "withdraw", "edit", "submit", "publish", "a
     borderRight: Boolean,
     border: {
       type: Boolean,
-      default: !0
+      default: true
     },
     labelWidth: {
       type: String,
@@ -214,93 +238,132 @@ const w = ["back", "create", "save", "withdraw", "edit", "submit", "publish", "a
     }
   },
   data() {
-    var e;
+    var _a;
     return {
-      importDialogVisible: !1,
-      right: -(((e = this.searchPanelAttrs) == null ? void 0 : e.width) || 350),
+      importDialogVisible: false,
+      right: -(((_a = this.searchPanelAttrs) == null ? void 0 : _a.width) || 350),
       selectedRows: []
     };
   },
   computed: {
     buttonSlots() {
-      return w.filter((e) => this.$scopedSlots[e]);
+      return builtInButtons.filter((value) => this.$scopedSlots[value]);
     },
     toolbarProps() {
-      var s, l;
-      const e = {}, r = i(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 = p(r.buttons), r.searchable = !!((l = (s = this.$scopedSlots)["search-form"]) != null && l.call(s)), r;
+      var _a, _b;
+      const defaultProps = {};
+      const toolbarAttrs = merge(this.toolbarAttrs, defaultProps);
+      let buttons = (toolbarAttrs == null ? void 0 : toolbarAttrs.buttons) || this.$parent.buttons;
+      buttons = buttons || [];
+      if (!buttons.includes("reload")) {
+        buttons = [...buttons, "reload"];
+      }
+      toolbarAttrs.buttons = buttons;
+      toolbarAttrs.buttons = toStringArray(toolbarAttrs.buttons);
+      toolbarAttrs.searchable = !!((_b = (_a = this.$scopedSlots)["search-form"]) == null ? void 0 : _b.call(_a));
+      return toolbarAttrs;
     },
     treeProps() {
-      const e = {
+      const defaultProps = {
         treeProps: {
           children: "children",
           label: "label",
-          isLeaf: (r) => c(r, "hasChildren") ? !r.hasChildren : c(r, "hasChild") ? !r.hasChild : !0
+          isLeaf: (data) => {
+            if (hasOwn(data, "hasChildren")) {
+              return !data.hasChildren;
+            } else if (hasOwn(data, "hasChild")) {
+              return !data.hasChild;
+            } else {
+              return true;
+            }
+          }
         },
-        show: !1,
-        lazy: !0,
-        readonly: !0,
+        show: false,
+        lazy: true,
+        readonly: true,
         data: [],
-        "expand-first-node": !1,
-        "default-expand-all": !1
+        "expand-first-node": false,
+        "default-expand-all": false
       };
-      return i(this.treeAttrs, e);
+      return merge(this.treeAttrs, defaultProps);
     },
     tableProps() {
-      const e = this.tableAttrs.api || this.$parent.getPage, r = {
+      const api = this.tableAttrs.api || this.$parent.getPage;
+      const defaultProps = {
         model: this.searchModel || {},
         height: "auto",
-        "highlight-current-row": !0,
-        api: e
+        "highlight-current-row": true,
+        api
       };
-      return i(this.tableAttrs, r);
+      return merge(this.tableAttrs, defaultProps);
     },
     searchPanelProps() {
-      const e = {
+      const defaultProps = {
         width: 350,
         model: this.searchModel || {}
       };
-      return i(this.searchPanelAttrs, e);
+      return merge(this.searchPanelAttrs, defaultProps);
     }
   },
   created() {
-    this._viewIds = [], this.viewId && this._viewIds.push(this.viewId), this._viewIds.includes(this.$parent.$options.name) || this._viewIds.push(this.$parent.$options.name);
+    this._viewIds = [];
+    if (this.viewId) {
+      this._viewIds.push(this.viewId);
+    }
+    if (!this._viewIds.includes(this.$parent.$options.name)) {
+      this._viewIds.push(this.$parent.$options.name);
+    }
   },
   async activated() {
-    this.$refs.treeScroller && (this.treeScrollTop && (this.$refs.treeScroller.scrollTop = this.treeScrollTop), this.treeScrollLeft && (this.$refs.treeScroller.scrollLeft = this.treeScrollLeft));
+    if (this.$refs.treeScroller) {
+      if (this.treeScrollTop) {
+        this.$refs.treeScroller.scrollTop = this.treeScrollTop;
+      }
+      if (this.treeScrollLeft) {
+        this.$refs.treeScroller.scrollLeft = this.treeScrollLeft;
+      }
+    }
   },
   methods: {
     onTreeScroll() {
-      this.treeScrollTop = this.$refs.treeScroller.scrollTop, this.treeScrollLeft = this.$refs.treeScroller.scrollLeft;
+      this.treeScrollTop = this.$refs.treeScroller.scrollTop;
+      this.treeScrollLeft = this.$refs.treeScroller.scrollLeft;
     },
     toggleSearch() {
       this.right = this.right === 0 ? -this.searchPanelProps.width : 0;
     },
     async onSearchClick() {
-      this.$refs.table.setModel(this.searchModel || this.searchPanelProps.model), await this.refreshTable();
+      this.$refs.table.setModel(this.searchModel || this.searchPanelProps.model);
+      await this.refreshTable();
     },
     async onClearClick() {
-      this.$emit("reset"), this.$refs.form.resetFields(), this.$refs.table.setModel(this.searchModel || this.searchPanelProps.model), await this.refreshTable();
-    },
-    openFrom(e) {
-      this.$router.push(b(this.formPath, e));
-    },
-    rowDbClick(e) {
-      var r;
-      !((r = this.tableListeners) != null && r["row-dblclick"]) && this.formPath && this.openFrom(e);
+      this.$emit("reset");
+      this.$refs.form.resetFields();
+      this.$refs.table.setModel(this.searchModel || this.searchPanelProps.model);
+      await this.refreshTable();
+    },
+    openFrom(row) {
+      this.$router.push(fillPath(this.formPath, row));
+    },
+    rowDbClick(row) {
+      var _a;
+      if (!((_a = this.tableListeners) == null ? void 0 : _a["row-dblclick"]) && this.formPath) {
+        this.openFrom(row);
+      }
     },
-    onSelectionChange(e) {
-      this.selectedRows = e;
+    onSelectionChange(rows) {
+      this.selectedRows = rows;
     },
     create() {
-      var e;
-      !((e = this.toolbarListeners) != null && e.create) && this.formPath && this.openFrom();
+      var _a;
+      if (!((_a = this.toolbarListeners) == null ? void 0 : _a.create) && this.formPath) {
+        this.openFrom();
+      }
     },
     async del() {
-      var r;
-      const e = this.deleteApi || this.$parent.del;
-      if (!((r = this.toolbarListeners) != null && r.del) && u(e)) {
+      var _a;
+      const api = this.deleteApi || this.$parent.del;
+      if (!((_a = this.toolbarListeners) == null ? void 0 : _a.del) && isFunction(api)) {
         if (!this.selectedRows.length) {
           this.$message.warning("请选择要删除的记录！");
           return;
@@ -310,28 +373,34 @@ const w = ["back", "create", "save", "withdraw", "edit", "submit", "publish", "a
           "系统提示",
           {
             type: "warning",
-            modal: !0,
-            dangerouslyUseHTMLString: !0,
-            closeOnClickModal: !1,
-            beforeClose: async (t, s, l) => {
-              if (t === "confirm")
+            modal: true,
+            dangerouslyUseHTMLString: true,
+            closeOnClickModal: false,
+            beforeClose: async (action, instance, done) => {
+              if (action === "confirm") {
                 try {
-                  s.confirmButtonLoading = !0, s.confirmButtonText = "删除...", await e.call(this, this.selectedRows.map((a) => a.id).join(",")), this.$message.success("删除成功"), await this.reloadTable(), await this.refreshTree();
-                } catch {
+                  instance.confirmButtonLoading = true;
+                  instance.confirmButtonText = "删除...";
+                  await api.call(this, this.selectedRows.map((value) => value.id).join(","));
+                  this.$message.success("删除成功");
+                  await this.reloadTable();
+                  await this.refreshTree();
+                } catch (_) {
                 }
-              l();
+              }
+              done();
             }
           }
-        ).catch((t) => t);
+        ).catch((_) => _);
       }
     },
     reloadTable() {
-      var e;
-      (e = this.$refs.table) == null || e.reload();
+      var _a;
+      (_a = this.$refs.table) == null ? void 0 : _a.reload();
     },
     async refreshTable() {
-      var e;
-      await ((e = this.$refs.table) == null ? void 0 : e.getPage());
+      var _a;
+      await ((_a = this.$refs.table) == null ? void 0 : _a.getPage());
     },
     refreshTree() {
       this.$refs.tree.reloadTree();
@@ -340,24 +409,26 @@ const w = ["back", "create", "save", "withdraw", "edit", "submit", "publish", "a
       return this.searchPanelProps.model;
     }
   }
-}, h = {};
-var y = /* @__PURE__ */ m(
-  v,
-  _,
-  g,
-  !1,
-  P,
+};
+const __cssModules = {};
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  __vue2_script,
+  render,
+  staticRenderFns,
+  false,
+  __vue2_injectStyles,
   null,
   null,
   null
 );
-function P(e) {
-  for (let r in h)
-    this[r] = h[r];
+function __vue2_injectStyles(context) {
+  for (let o in __cssModules) {
+    this[o] = __cssModules[o];
+  }
 }
-const C = /* @__PURE__ */ function() {
-  return y.exports;
+const TableView = /* @__PURE__ */ function() {
+  return __component__.exports;
 }();
 export {
-  C as default
+  TableView as default
 };

package/dist/components/table-view/style.css

@@ -1 +1,95 @@
-.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%}
+/* 全局公共颜色配置 */ /* 全局公共尺寸配置 */
+/* 应用头部高度 */
+/* 页面宽度 */
+/* 侧栏宽度 */
+/* 标签高度 */
+/* 页面头部工具条高度 */
+.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: white;
+}
+.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: white;
+  transition: right 200ms 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%;
+}