@web-utils/component 2.7.36 → 2.7.37

package/dist/components/fy-curd/index.mjs

@@ -0,0 +1,751 @@
+import { p as F } from "../../chunks/packages.1fc9ccba.mjs";
+import { p as S } from "../../chunks/permission.ce5d2121.mjs";
+import { i as _ } from "../../chunks/init.07b0cebe.mjs";
+import { c as d } from "../../chunks/config.46422d7f.mjs";
+import { c as O, t as v, f as L } from "../../chunks/dataformat.5f95e59e.mjs";
+import { D as f, s as E, o as y, d as n } from "../../chunks/util.eca708b6.mjs";
+import { isBlank as b } from "@web-utils/core";
+import { n as k } from "../../chunks/vueComponentNormalizer.446f5dc4.mjs";
+var x = function() {
+  var e = this, t = e.$createElement, l = e._self._c || t;
+  return l("div", {
+    staticClass: "avue-crud avue-crud--card"
+  }, [e.tableOption.title ? l(e.tableOption.titleSize || "h2", {
+    tag: "Component",
+    style: e.tableOption.titleStyle
+  }, [e._v(" " + e._s(e.tableOption.title) + " ")]) : e._e(), l("HeaderSearch", {
+    ref: "headerSearch",
+    scopedSlots: e._u([{
+      key: "search",
+      fn: function(i) {
+        return [e._t("search", null, null, i)];
+      }
+    }, {
+      key: "searchMenu",
+      fn: function(i) {
+        return [e._t("searchMenu", null, null, i)];
+      }
+    }, e._l(e.searchSlot, function(i) {
+      return {
+        key: i,
+        fn: function(s) {
+          return [e._t(i, null, null, s)];
+        }
+      };
+    })], null, !0)
+  }), e.optVal(e.tableOption.header, !0) ? l("HeaderMenu", {
+    ref: "headerMenu",
+    scopedSlots: e._u([{
+      key: "menuLeft",
+      fn: function(i) {
+        return [e._t("menuLeft", null, null, i)];
+      }
+    }, {
+      key: "menuRight",
+      fn: function(i) {
+        return [e._t("menuRight", null, null, i)];
+      }
+    }], null, !0)
+  }) : e._e(), e.optVal(e.tableOption.tip, e.config.tip) && e.tableOption.selection ? l("ElTag", {
+    staticClass: "avue-crud__tip"
+  }, [l("span", {
+    staticClass: "avue-crud__tip-name"
+  }, [e._v(" 当前表格已选择 "), l("span", {
+    staticClass: "avue-crud__tip-count"
+  }, [e._v(e._s(e.selectLen))]), e._v(" 项 ")]), e.optVal(e.tableOption.selectClearBtn, e.config.selectClearBtn) && e.tableOption.selection ? l("ElButton", {
+    directives: [{
+      name: "permission",
+      rawName: "v-permission",
+      value: e.getPermission("selectClearBtn"),
+      expression: "getPermission('selectClearBtn')"
+    }],
+    attrs: {
+      type: "text",
+      size: "small"
+    },
+    on: {
+      click: e.selectClear
+    }
+  }, [e._v(" 清 空 ")]) : e._e(), e._t("tip")], 2) : e._e(), e._t("header"), l("ElForm", {
+    ref: "cellForm",
+    attrs: {
+      model: e.cellForm,
+      "show-message": !1
+    },
+    on: {
+      validate: e.handleValidate
+    }
+  }, [l("ElTable", {
+    directives: [{
+      name: "loading",
+      rawName: "v-loading",
+      value: e.tableLoading,
+      expression: "tableLoading"
+    }],
+    key: e.reload,
+    ref: "table",
+    class: {
+      "avue-crud--indeterminate": e.optVal(e.tableOption.indeterminate, !1)
+    },
+    attrs: {
+      data: e.cellForm.list,
+      "row-key": e.rowKey,
+      size: e.$AVUE.tableSize || e.controlSize,
+      lazy: e.optVal(e.tableOption.lazy, !1),
+      load: e.treeLoad,
+      "tree-props": e.treeProps,
+      "expand-row-keys": e.tableOption.expandRowKeys,
+      "default-expand-all": e.tableOption.defaultExpandAll,
+      "highlight-current-row": e.tableOption.highlightCurrentRow,
+      "show-summary": e.tableOption.showSummary,
+      "summary-method": e.tableSummaryMethod,
+      "span-method": e.tableSpanMethod,
+      stripe: e.tableOption.stripe,
+      "show-header": e.tableOption.showHeader,
+      "default-sort": e.tableOption.defaultSort,
+      "row-class-name": e.rowClassName,
+      "cell-class-name": e.cellClassName,
+      "row-style": e.rowStyle,
+      "cell-style": e.cellStyle,
+      fit: e.tableOption.fit,
+      "header-cell-class-name": e.headerCellClassName,
+      "max-height": e.isAutoHeight ? e.tableHeight : e.tableOption.maxHeight,
+      height: e.tableHeight,
+      width: e.setPx(e.tableOption.width, e.config.width),
+      border: e.tableOption.border
+    },
+    on: {
+      "current-change": e.currentRowChange,
+      "expand-change": e.expandChange,
+      "header-dragend": e.headerDragend,
+      "row-click": e.rowClick,
+      "row-dblclick": e.rowDblclick,
+      "cell-mouse-enter": e.cellMouseEnter,
+      "cell-mouse-leave": e.cellMouseLeave,
+      "cell-click": e.cellClick,
+      "header-click": e.headerClick,
+      "row-contextmenu": e.rowContextmenu,
+      "header-contextmenu": e.headerContextmenu,
+      "cell-dblclick": e.cellDblclick,
+      "filter-change": e.filterChange,
+      "selection-change": e.selectionChange,
+      select: e.select,
+      "select-all": e.selectAll,
+      "sort-change": e.sortChange
+    },
+    scopedSlots: e._u([{
+      key: "empty",
+      fn: function() {
+        return [e.$slots.empty ? e._t("empty") : l("ElEmpty", {
+          staticClass: "avue-crud__empty",
+          attrs: {
+            "image-size": 100,
+            description: e.tableOption.emptyText
+          }
+        })];
+      },
+      proxy: !0
+    }], null, !0)
+  }, [l("Column", {
+    attrs: {
+      "column-option": e.columnOption
+    },
+    scopedSlots: e._u([{
+      key: "header",
+      fn: function() {
+        return [l("ColumnDefault", {
+          ref: "columnDefault",
+          scopedSlots: e._u([{
+            key: "expand",
+            fn: function(i) {
+              var s = i.row, r = i.index;
+              return [e._t("expand", null, {
+                row: s,
+                index: r
+              })];
+            }
+          }], null, !0)
+        })];
+      },
+      proxy: !0
+    }, e._l(e.mainSlot, function(i) {
+      return {
+        key: i,
+        fn: function(s) {
+          return [e._t(i, null, null, s)];
+        }
+      };
+    }), {
+      key: "footer",
+      fn: function() {
+        return [l("ColumnMenu", {
+          scopedSlots: e._u([{
+            key: "menu",
+            fn: function(i) {
+              return [e._t("menu", null, null, i)];
+            }
+          }, {
+            key: "menuBtn",
+            fn: function(i) {
+              return [e._t("menuBtn", null, null, i)];
+            }
+          }], null, !0)
+        })];
+      },
+      proxy: !0
+    }], null, !0)
+  })], 1)], 1), e._t("footer"), l("TablePage", {
+    ref: "tablePage"
+  }), l("FyDialogForm", {
+    ref: "dialogForm",
+    scopedSlots: e._u([e._l(e.formSlot, function(i) {
+      return {
+        key: i,
+        fn: function(s) {
+          return [e._t(i, null, null, s)];
+        }
+      };
+    }), {
+      key: "menuForm",
+      fn: function(i) {
+        return [e._t("menuForm", null, null, i)];
+      }
+    }], null, !0)
+  }), l("DialogColumn", {
+    ref: "dialogColumn"
+  }), l("DialogExcel", {
+    ref: "dialogExcel"
+  }), l("DialogFilter", {
+    ref: "dialogFilter"
+  })], 2);
+}, D = [];
+const P = {
+  name: "FyCurd",
+  directives: {
+    permission: S
+  },
+  mixins: [_],
+  provide() {
+    return {
+      crud: this
+    };
+  },
+  props: {
+    spanMethod: Function,
+    summaryMethod: Function,
+    rowStyle: Function,
+    cellStyle: Function,
+    beforeClose: Function,
+    beforeOpen: Function,
+    rowClassName: Function,
+    cellClassName: Function,
+    headerCellClassName: Function,
+    uploadBefore: Function,
+    uploadAfter: Function,
+    uploadDelete: Function,
+    uploadPreview: Function,
+    uploadError: Function,
+    uploadExceed: Function,
+    permission: {
+      type: [Function, Object],
+      default: () => ({})
+    },
+    value: {
+      type: Object,
+      default: () => ({})
+    },
+    search: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    page: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    tableLoading: {
+      type: Boolean,
+      default: !1
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    data: {
+      type: Array,
+      required: !0,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      reload: Math.random(),
+      cellForm: {
+        list: []
+      },
+      config: d,
+      list: [],
+      listError: {},
+      tableForm: {},
+      tableHeight: void 0,
+      tableIndex: -1,
+      tableSelect: [],
+      sumsList: {},
+      cascaderIndexList: [],
+      cascaderDicList: {},
+      cascaderFormList: {},
+      btnDisabledList: {},
+      btnDisabled: !1,
+      default: {}
+    };
+  },
+  computed: {
+    isHeightAuto() {
+      return this.tableOption.height === "auto";
+    },
+    isSortable() {
+      return this.tableOption.sortable;
+    },
+    isRowSort() {
+      return this.tableOption.rowSort;
+    },
+    isColumnSort() {
+      return this.tableOption.columnSort;
+    },
+    rowParentKey() {
+      return this.option.rowParentKey || f.rowParentKey;
+    },
+    childrenKey() {
+      return this.treeProps.children || f.children;
+    },
+    hasChildrenKey() {
+      return this.treeProps.hasChildren || f.hasChildren;
+    },
+    treeProps() {
+      return this.tableOption.treeProps || {};
+    },
+    isAutoHeight() {
+      return this.tableOption.height === "auto";
+    },
+    formSlot() {
+      return this.getSlotList(["Error", "Label", "Type", "Form"], this.$scopedSlots, this.propOption);
+    },
+    searchSlot() {
+      return this.getSlotList(["Search"], this.$scopedSlots, this.propOption);
+    },
+    mainSlot() {
+      const e = [];
+      return this.propOption.forEach((t) => {
+        this.$scopedSlots[t.prop] && e.push(t.prop);
+      }), this.getSlotList(["Header", "Form"], this.$scopedSlots, this.propOption).concat(e);
+    },
+    calcHeight() {
+      return (this.tableOption.calcHeight || 0) + this.$AVUE.calcHeight;
+    },
+    propOption() {
+      let e = [];
+      function t(l = []) {
+        Array.isArray(l) && l.forEach((i) => {
+          Array.isArray(i.children) ? t(i.children) : e.push(i);
+        });
+      }
+      return t(this.columnOption), e = O(e), e;
+    },
+    isShowSummary() {
+      return this.option.showSummary;
+    },
+    isHeader() {
+      let e = !1;
+      return this.columnOption.forEach((t) => {
+        t.children && (e = !0);
+      }), e;
+    },
+    isTree() {
+      let e = !1;
+      return this.data.forEach((t) => {
+        t.children && (e = !0);
+      }), e;
+    },
+    isCard() {
+      return this.option.card ? "always" : "never";
+    },
+    expandLevel() {
+      return this.parentOption.expandLevel || 0;
+    },
+    expandAll() {
+      return this.parentOption.expandAll || !1;
+    },
+    parentOption() {
+      return this.tableOption || {};
+    },
+    columnOption() {
+      return this.tableOption.column || [];
+    },
+    sumColumnList() {
+      return this.tableOption.sumColumnList || [];
+    },
+    selectLen() {
+      return this.tableSelect ? this.tableSelect.length : 0;
+    }
+  },
+  watch: {
+    value: {
+      handler() {
+        this.tableForm = this.value;
+      },
+      immediate: !0,
+      deep: !0
+    },
+    list: {
+      handler() {
+        this.cellForm.list = this.list;
+      },
+      deep: !0
+    },
+    data: {
+      handler() {
+        this.dataInit();
+      },
+      deep: !0
+    }
+  },
+  mounted() {
+    this.dataInit(), this.getTableHeight(), this.refreshTable();
+  },
+  methods: {
+    setPx: E,
+    optVal: y,
+    handleValidate(e, t, l) {
+      this.listError[e] || this.$set(this.listError, e, { valid: !1, msg: "" }), this.listError[e].valid = !t, this.listError[e].msg = l;
+    },
+    getPermission(e, t, l) {
+      return typeof this.permission == "function" ? this.permission(e, t, l) : b(this.permission[e]) ? !0 : this.permission[e];
+    },
+    getTableHeight() {
+      this.isAutoHeight ? this.$nextTick(() => {
+        const e = this.$refs.table, t = this.$refs.tablePage;
+        if (!e)
+          return;
+        const l = e.$el, i = t.$el.offsetHeight || 20;
+        this.tableHeight = document.documentElement.clientHeight - l.offsetTop - i - this.calcHeight;
+      }) : this.tableHeight = this.tableOption.height;
+    },
+    doLayout() {
+      this.$refs.table.doLayout();
+    },
+    refreshTable(e) {
+      this.reload = Math.random(), this.$nextTick(() => {
+        e && e();
+      });
+    },
+    // 树懒加载
+    treeLoad(e, t, l) {
+      this.$emit("tree-load", e, t, (i) => {
+        e.children = i, l(i);
+      });
+    },
+    menuIcon(e) {
+      return y(this.tableOption[`${e}Text`], v(`crud.${e}`));
+    },
+    getBtnIcon(e) {
+      const t = `${e}Icon`;
+      return this.tableOption[t] || d[t];
+    },
+    // 对部分表单字段进行校验的方法
+    validateField(e) {
+      return this.$refs.dialogForm.$refs.tableForm.validateField(e);
+    },
+    selectClear() {
+      this.$emit("selection-clear", n(this.tableSelect)), this.$refs.table.clearSelection();
+    },
+    toggleRowSelection(e, t) {
+      this.$refs.table.toggleRowSelection(e, t);
+    },
+    toggleRowExpansion(e, t) {
+      this.$refs.table.toggleRowExpansion(e, t);
+    },
+    setCurrentRow(e) {
+      this.$refs.table.setCurrentRow(e);
+    },
+    dataInit() {
+      this.list = this.data, this.list.forEach((e, t) => {
+        e.$cellEdit && !this.cascaderFormList[t] && (this.cascaderFormList[t] = n(e)), this.$set(e, "$cellEdit", e.$cellEdit || !1), this.$set(e, "$index", t);
+      });
+    },
+    // 拖动表头事件
+    headerDragend(e, t, l, i) {
+      this.objectOption[l.property] && this.$set(this.objectOption[l.property], "width", e), this.$emit("header-dragend", e, t, l, i);
+    },
+    headerSort(e, t) {
+      const l = this.columnOption, i = l.splice(e, 1)[0];
+      l.splice(t, 0, i), this.refreshTable();
+    },
+    // 清除过滤器执行函数
+    clearFilter(e) {
+      this.$refs.table.clearFilter(e);
+    },
+    // 展开或则关闭
+    expandChange(e, t) {
+      this.$emit("expand-change", e, t);
+    },
+    // 设置单选
+    currentRowChange(e, t) {
+      this.$emit("current-row-change", e, t);
+    },
+    // 刷新事件
+    refreshChange() {
+      this.$emit("refresh-change");
+    },
+    // 选中实例
+    toggleSelection(e) {
+      e ? e.forEach((t) => {
+        this.$refs.table.toggleRowSelection(t);
+      }) : this.$refs.table.clearSelection();
+    },
+    // 选择回调
+    selectionChange(e) {
+      this.tableSelect = e, this.$emit("selection-change", this.tableSelect);
+    },
+    // 单个选择回调
+    select(e, t) {
+      this.$emit("select", e, t);
+    },
+    // 点击勾选全选 Checkbox
+    selectAll(e) {
+      this.$emit("select-all", e);
+    },
+    // 筛选回调用
+    filterChange(e) {
+      this.$emit("filter-change", e);
+    },
+    // 排序回调
+    sortChange(e) {
+      this.$emit("sort-change", e);
+    },
+    // 行双击
+    rowDblclick(e, t) {
+      this.$emit("row-dblclick", e, t);
+    },
+    // 行单机
+    rowClick(e, t, l) {
+      this.$emit("row-click", e, t, l);
+    },
+    // 清空排序
+    clearSort() {
+      this.$refs.table.clearSort();
+    },
+    // 当单元格 hover 进入时会触发该事件
+    cellMouseEnter(e, t, l, i) {
+      this.$emit("cell-mouse-enter", e, t, l, i);
+    },
+    // 当单元格 hover 退出时会触发该事件
+    cellMouseLeave(e, t, l, i) {
+      this.$emit("cell-mouse-leave", e, t, l, i);
+    },
+    // 当某个单元格被点击时会触发该事件
+    cellClick(e, t, l, i) {
+      this.$emit("cell-click", e, t, l, i);
+    },
+    //	当某一列的表头被点击时会触发该事件
+    headerClick(e, t) {
+      this.$emit("header-click", e, t);
+    },
+    // 当某一行被鼠标右键点击时会触发该事件
+    rowContextmenu(e, t, l) {
+      this.$emit("row-contextmenu", e, t, l);
+    },
+    // 当某一列的表头被鼠标右键点击时触发该事件
+    headerContextmenu(e, t) {
+      this.$emit("header-contextmenu", e, t);
+    },
+    // 当某个单元格被双击击时会触发该事件
+    cellDblclick(e, t, l, i) {
+      this.$emit("cell-dblclick", e, t, l, i);
+    },
+    // 单元格新增
+    rowCellAdd(e = {}) {
+      const t = this.list.length, l = L(this.propOption).tableForm;
+      e = n(
+        Object.assign(
+          {
+            $cellEdit: !0,
+            $index: t
+          },
+          l,
+          e
+        )
+      ), this.list.push(e);
+    },
+    // 行取消
+    rowCancel(e, t) {
+      b(e[this.rowKey]) ? (this.list.splice(t, 1), delete this.cascaderDIC[t]) : (this.cascaderFormList[t].$cellEdit = !1, this.$set(this.cascaderDIC, t, this.cascaderDicList[t]), this.$set(this.list, t, this.cascaderFormList[t])), delete this.cascaderDicList[t], delete this.cascaderFormList[t], this.cascaderIndexList.splice(this.cascaderIndexList.indexOf(t), 1);
+    },
+    // 行编辑点击
+    rowCell(e, t) {
+      e.$cellEdit ? this.rowCellUpdate(e, t) : this.rowCellEdit(e, t);
+    },
+    rowCellUpdate(e, t) {
+      e = n(e);
+      const l = this.validateCellField(t), i = () => {
+        this.btnDisabledList[t] = !1, this.btnDisabled = !1, this.list[t].$cellEdit = !1, this.cascaderIndexList.splice(this.cascaderIndexList.indexOf(t), 1), delete this.cascaderFormList[t];
+      }, s = () => {
+        this.btnDisabledList[t] = !1, this.btnDisabled = !1;
+      };
+      l && (this.btnDisabledList[t] = !0, this.btnDisabled = !0, b(e[this.rowKey]) ? this.$emit("row-save", e, i, s) : this.$emit("row-update", e, t, i, s));
+    },
+    // 单元格编辑
+    rowCellEdit(e, t) {
+      e.$cellEdit = !0, this.cascaderFormList[t] = n(e), this.cascaderDicList[t] = n(this.cascaderDIC[t]);
+    },
+    // 对部分表单字段进行校验
+    validateCellForm() {
+      return new Promise((e) => {
+        this.$refs.cellForm.validate((t, l) => {
+          e(l);
+        });
+      });
+    },
+    validateCellField(e) {
+      let t = !0;
+      for (const l of this.$refs.cellForm.fields)
+        if (l.prop.split(".")[1] == e && this.$refs.cellForm.validateField(l.prop, (i) => {
+          i && (t = !1);
+        }), !t)
+          break;
+      return t;
+    },
+    rowAdd() {
+      this.$refs.dialogForm.show("add");
+    },
+    rowSave() {
+      return this.$refs.dialogForm.$refs.tableForm.submit();
+    },
+    rowUpdate() {
+      return this.$refs.dialogForm.$refs.tableForm.submit();
+    },
+    closeDialog() {
+      return this.$refs.dialogForm.closeDialog();
+    },
+    getPropRef(e) {
+      return this.$refs.dialogForm.$refs.tableForm.getPropRef(e);
+    },
+    setVal() {
+      this.$emit("input", this.tableForm), this.$emit("change", this.tableForm);
+    },
+    // 编辑
+    rowEdit(e, t) {
+      this.tableForm = n(e), this.tableIndex = t, this.setVal(), this.$refs.dialogForm.show("edit");
+    },
+    // 复制
+    rowCopy(e) {
+      this.tableForm = n(e), delete this.tableForm[this.rowKey], this.tableIndex = -1, this.setVal(), this.$refs.dialogForm.show("add");
+    },
+    // 查看
+    rowView(e, t) {
+      this.tableForm = n(e), this.tableIndex = t, this.setVal(), this.$refs.dialogForm.show("view");
+    },
+    // 删除
+    rowDel(e, t) {
+      this.$emit("row-del", e, t, () => {
+        const { parentList: l, index: i } = this.findData(e[this.rowKey]);
+        l && l.splice(i, 1);
+      });
+    },
+    // 合并行
+    tableSpanMethod(e) {
+      if (typeof this.spanMethod == "function")
+        return this.spanMethod(e);
+    },
+    // 合集统计逻辑
+    tableSummaryMethod(e) {
+      const t = {};
+      if (typeof this.summaryMethod == "function")
+        return this.summaryMethod(e);
+      const { columns: l, data: i } = e, s = [];
+      return l.length > 0 && l.forEach((r, a) => {
+        const h = this.sumColumnList.find((u) => u.name === r.property);
+        if (h) {
+          const u = h.decimals || 2, m = h.label || "";
+          switch (h.type) {
+            case "count":
+              s[a] = m + i.length;
+              break;
+            case "avg":
+              const C = i.map((o) => Number(o[r.property]));
+              let g = 1;
+              s[a] = C.reduce((o, c) => {
+                const p = Number(c);
+                return isNaN(p) ? o : (o * (g - 1) + c) / g++;
+              }, 0), s[a] = m + s[a].toFixed(u);
+              break;
+            case "sum":
+              const $ = i.map((o) => Number(o[r.property]));
+              s[a] = $.reduce((o, c) => {
+                const p = Number(c);
+                return isNaN(p) ? o : o + c;
+              }, 0), s[a] = m + s[a].toFixed(u);
+              break;
+          }
+          t[r.property] = s[a];
+        } else
+          s[a] = "";
+      }), this.sumsList = t, s;
+    },
+    tableDrop(e, t, l) {
+      if (this.isSortable !== !0) {
+        if (e === "row" && !this.isRowSort)
+          return;
+        if (e === "column" && !this.isColumnSort)
+          return;
+      }
+      if (!window.Sortable) {
+        F.logs("Sortable");
+        return;
+      }
+      window.Sortable.create(t, {
+        ghostClass: d.ghostClass,
+        chosenClass: d.ghostClass,
+        animation: 500,
+        delay: 0,
+        onEnd: (i) => l(i)
+      });
+    },
+    findData(e) {
+      let t = {};
+      const l = (i, s) => {
+        i.forEach((r, a) => {
+          r[this.rowKey] === e && (t = {
+            item: r,
+            index: a,
+            parentList: i,
+            parent: s
+          }), r[this.childrenKey] && l(r[this.childrenKey], r);
+        });
+      };
+      return l(this.list), t;
+    }
+  }
+}, w = {};
+var H = /* @__PURE__ */ k(
+  P,
+  x,
+  D,
+  !1,
+  M,
+  null,
+  null,
+  null
+);
+function M(e) {
+  for (let t in w)
+    this[t] = w[t];
+}
+const j = /* @__PURE__ */ function() {
+  return H.exports;
+}();
+export {
+  j as default
+};