vue-super-crud 1.7.1 → 1.7.4

package/packages/crud/mixins/contextMenu.js

@@ -1,98 +0,0 @@
-import { batchMerge } from "utils/mergeTemp";
-import { isFunction } from "lodash-es";
-import { checkVisibility } from "utils";
-export default {
-  computed: {
-    ctxMenu() {
-      return this.crudOptions.contextMenu;
-    },
-  },
-  created() {
-    this.buttonList = [];
-  },
-  methods: {
-    contextMenuTemps(scope, divided) {
-      return {
-        copy: {
-          label: "复制内容",
-          icon: "el-icon-document-copy",
-          onClick: () => {
-            let save = function (e) {
-              e.clipboardData.setData(
-                "text/plain",
-                scope.event.target.innerText
-              );
-              e.preventDefault(); //阻止默认行为
-            };
-            document.addEventListener("copy", save); //添加一个copy事件
-            document.execCommand("copy"); //执行copy方法
-            document.removeEventListener("copy", save); //移除copy事件
-            this.$message.success("复制成功");
-          },
-        },
-        mock: {
-          label: "生成测试数据",
-          icon: "el-icon-magic-stick",
-          onClick: () => {
-            this.$emit("mockData");
-          },
-        },
-        reset: {
-          label: "重置",
-          icon: "el-icon-refresh",
-          onClick: () => {
-            this.reset();
-          },
-          divided,
-        },
-      };
-    },
-    openContextMenu(row, column, event) {
-      if (checkVisibility(this.ctxMenu) === false) return;
-      const items = [];
-      const scope = {
-        row,
-        $index: row.$index,
-        column,
-        ctx: this,
-        event,
-      };
-      const actionBtns = this.getActionButton(scope);
-      if (this.ctxMenu) {
-        let merges = batchMerge(
-          "btn.crud.contextMenu",
-          this.ctxMenu,
-          scope,
-          this.contextMenuTemps(scope, actionBtns.length)
-        );
-        merges = this.checkHiddenButtons("contextMenu", merges);
-        items.push(...merges);
-      }
-      if (this.ctxMenu.actionBtn) {
-        items.push(...actionBtns);
-      }
-      if (items.length === 0) return;
-      event.preventDefault();
-      event.stopPropagation();
-      this.$contextmenu({
-        items,
-        event,
-        minWidth: 100,
-      });
-    },
-    getActionButton(scope) {
-      let custom = this.buttonList[scope.$index] || [];
-      return custom.map(({ hidden, ...item }) => {
-        Object.keys(item).forEach((key) => {
-          if (key === "onClick") {
-            const rawClick = item[key];
-            item[key] = () => rawClick(scope);
-          } else if (isFunction(item[key]) && key !== "onClick") {
-            item[key] = item[key](scope);
-          }
-        });
-        return item;
-      });
-    },
-  },
-};

package/packages/crud/mixins/dataProcessor.js

@@ -1,202 +0,0 @@
-import { isFunction, cloneDeep, uniqueId } from "lodash-es";
-
-export default {
-  data() {
-    return {
-      loadingStatus: false,
-      localFilteredData: undefined, // 存储过滤后的数据
-    };
-  },
-
-  computed: {
-    list() {
-      return this.filterData();
-    },
-  },
-  watch: {
-    data: {
-      handler(newVal, oldVal) {
-        // 是否完全更新数据
-        const isUpdated = newVal !== oldVal;
-        if (isUpdated) {
-          this.transformData(this.list);
-        }
-      },
-      immediate: true,
-    },
-    loading: {
-      handler(val) {
-        val !== undefined && (this.loadingStatus = val);
-      },
-      immediate: true,
-    },
-    loadingStatus(val) {
-      this.$emit("update:loading", val);
-    },
-  },
-
-  methods: {
-    // 过滤数据
-    filterData() {
-      let data = this.data;
-      if (this.localFilteredData !== undefined) {
-        data = this.localFilteredData;
-      }
-
-      if (this.crudOptions.localPagination) {
-        return this.getLocalPaginationData(data);
-      }
-      return data;
-    },
-    // 完全更新时数据转换
-    transformData(list) {
-      // 检查数据唯一性
-      this.validateUniqueValues(list);
-
-      // 处理行数据
-      this.processRowData(list);
-
-      // 恢复新增状态
-      this.restoreEditState(list);
-
-      // 处理树形数据
-      this.processTreeData(list);
-
-      // 处理动态列数据
-      this.processDynamicColumns(list);
-
-      // 数据排序
-      this.sortedData();
-
-      // 更新表格状态
-      this.updateTableState();
-    },
-    // 检查数据唯一性
-    validateUniqueValues(list) {
-      if (this._hasCheckedUnique) return;
-
-      const valueMap = new Map();
-      list.some((row) => {
-        const key = row[this.valueKey];
-        if (!key) {
-          console.error(
-            `[CRUD Error] 数据中存在缺失的 ${this.valueKey} 值`,
-            row
-          );
-          this._hasCheckedUnique = true;
-          return true;
-        }
-        if (valueMap.has(key)) {
-          console.error(
-            `[CRUD Error] 数据中存在重复的 ${this.valueKey} 值`,
-            row
-          );
-          this._hasCheckedUnique = true;
-          return true;
-        }
-        valueMap.set(key, true);
-        return false;
-      });
-    },
-
-    // 处理行数据
-    processRowData(list) {
-      const isGenUniqueId = this.crudOptions.uniqueId;
-
-      list.forEach((item) => {
-        // 生成唯一ID
-        if (isGenUniqueId && !item.$uniqueId) {
-          item.$uniqueId = uniqueId();
-        }
-        // 检查并添加缺失的列字段
-        this.trueRenderColumns.forEach((column) => {
-          if (column.prop && !(column.prop in item)) {
-            this.$set(item, column.form?.prop || column.prop, "");
-          }
-        });
-      });
-    },
-
-    // 恢复新增状态
-    restoreEditState(list) {
-      const addedRows = this.editState?.getAddedRows() || [];
-
-      if (addedRows.length > 0) {
-        addedRows.forEach((item) => {
-          const { addType, row } = item;
-          if (addType === "first") {
-            list.unshift(row);
-          } else if (addType === "last") {
-            list.push(row);
-          }
-        });
-      }
-
-      const editingRows = this.editState.editingRows || [];
-      list.forEach((row) => {
-        const key = row[this.valueKey];
-        const editInfo = editingRows.get(key);
-        if (editInfo) {
-          Object.defineProperty(row, "$edit", {
-            value: true,
-            enumerable: false,
-            configurable: true,
-          });
-        }
-      });
-    },
-
-    // 处理树形数据
-    processTreeData(list) {
-      if (!this.isTree || !this.crudOptions.autoLazy) return;
-
-      this.lazyTreeData = cloneDeep(list);
-      this.handleLocalLazy(list);
-
-      // 更新懒加载的节点
-      this.treeNodeMap.forEach((value, key) => {
-        const { tree, treeNode, resolve } = value;
-        this.lazyLoad(tree, treeNode, resolve);
-      });
-    },
-
-    // 处理动态列数据
-    processDynamicColumns(list) {
-      if (!this.crudOptions.flattenConfig && !this.crudOptions.dynamicConfig)
-        return;
-
-      this.transformToTree(
-        list,
-        this.crudOptions.flattenConfig || this.crudOptions.dynamicConfig
-      );
-    },
-
-    // 更新表格状态
-    updateTableState() {
-      this.$nextTick(() => {
-        this.$refs.tableRef.layout.updateElsHeight();
-        this.updateSelection();
-      });
-    },
-    // 获取本地分页数据
-    getLocalPaginationData(data) {
-      const { pageNum, pageSize } = this.crudOptions.props;
-      const start = (this.query[pageNum] - 1) * this.query[pageSize];
-      const end = start + this.query[pageSize];
-      return data.slice(start, end);
-    },
-
-    // 数据加载相关
-    changeLoading(bool = false) {
-      if (this.crudOptions.disableLoading) return;
-      this.loadingStatus = bool;
-    },
-    initQuery() {
-      this.query = Object.assign({}, this.query, this.searchParams);
-      this.getList();
-    },
-    getList() {
-      this.$emit("getList");
-    },
-  },
-};

package/packages/crud/mixins/dialog.js

@@ -1,109 +0,0 @@
-import { cloneDeep } from "lodash-es";
-import formComp from "../form";
-import dialog from "pak/dialog";
-export default {
-  data() {
-    this.title = {
-      add: "新增",
-      edit: "编辑",
-      view: "查看",
-    };
-    return {
-      dialogLoading: false, //弹窗与内部表单loading
-    };
-  },
-  computed: {
-    dialogOptions() {
-      return this.crudOptions.dialog;
-    },
-  },
-  watch: {
-    dialogLoading(val) {
-      this.$refs.dialogVm && (this.$refs.dialogVm.loading = val);
-    },
-  },
-  methods: {
-    changeDialogLoading(bool = false) {
-      this.dialogLoading = bool;
-    },
-    handleAdd(addType) {
-      this.runBefore(
-        ["add"],
-        (data = {}) => {
-          this.form = data;
-          this.openDialogForm("add", {}, addType);
-        },
-        { mode: "add" }
-      );
-    },
-    handleView(scope) {
-      const callBack = (data) => {
-        this.openDialogForm("view", scope);
-        this.getDetail(scope, data);
-      };
-      this.runBefore(["view"], callBack, { ...scope, mode: "view" });
-    },
-    getDetail(scope, data) {
-      this.changeDialogLoading(true);
-      const callBack = (dataNew) => {
-        this.form = data || dataNew || cloneDeep(scope.row);
-
-        this.changeDialogLoading();
-      };
-      this.runBefore("getDetail", callBack, scope, this.changeDialogLoading);
-    },
-    handleEdit(scope) {
-      const callBack = (data) => {
-        this.openDialogForm("edit", scope);
-        this.getDetail(scope, data);
-      };
-      this.runBefore(["edit"], callBack, { ...scope, mode: "view" });
-    },
-    handleSave(scope, done, addType) {
-      this.$refs.crudForm.validate().then(() => {
-        this.changeDialogLoading(true);
-        const callBack = (row) => {
-          if (scope.mode === "add") {
-            if (addType === "first") {
-              this.list.unshift(row || this.form);
-            } else {
-              this.list.push(row || this.form);
-            }
-          } else {
-            this.$set(this.list, scope.$index, row || this.form);
-          }
-
-          done();
-          this.changeDialogLoading();
-          this.getList();
-        };
-        this.runBefore(["save"], callBack, scope, this.changeDialogLoading);
-      });
-    },
-
-    openDialogForm(mode, scope = {}, addType) {
-      scope = { ...scope, row: this.form, mode };
-      this.$refs.dialogVm = dialog({
-        title: this.title[mode],
-        render: () => (
-          <formComp
-            loading={this.dialogLoading}
-            ctx={this}
-            mode={mode}
-            scope={scope}
-          />
-        ),
-        confirm: (done) => {
-          const params = {
-            ...scope,
-            formRef: this.$refs.crudForm,
-          };
-          this.handleSave(params, done, addType);
-        },
-        footer: mode === "view" ? false : true,
-        ...this.dialogOptions,
-      });
-      this.$refs.dialogVm.show();
-    },
-  },
-};

package/packages/crud/mixins/excelHandler.js

@@ -1,150 +0,0 @@
-// ... 现有代码 ...
-import {
-  parseExcel,
-  getHeaderColumnMap,
-  convertExcelDataToTableData,
-  createFileInput,
-} from "../utils/excelImport";
-import { exportToExcel, formatExportData } from "../utils/excelExport";
-
-export default {
-  methods: {
-    /**
-     * 处理Excel导入
-     * @param {File} file Excel文件
-     */
-    handleExcelImport(file) {
-      if (!file) return;
-      this.changeLoading(true);
-
-      // 读取Excel文件
-      parseExcel(file)
-        .then((data) => {
-          if (!data || !data.length) {
-            this.$message.warning("导入的Excel文件不包含有效数据");
-            this.changeLoading(false);
-            return;
-          }
-
-          // 获取表头映射关系
-          const headerMap = getHeaderColumnMap(this.trueRenderColumns);
-
-          // 转换Excel数据为表格数据
-          const importedRows = convertExcelDataToTableData(
-            data,
-            headerMap,
-            this.valueKey,
-            this.trueRenderColumns
-          );
-
-          // 处理导入数据
-          this.processImportedData(importedRows);
-
-          this.changeLoading(false);
-        })
-        .catch((error) => {
-          console.error("Excel导入失败:", error);
-          this.$message.error(
-            "Excel导入失败: " + (error.message || "未知错误")
-          );
-          this.changeLoading(false);
-        });
-    },
-
-    /**
-     * 根据编辑模式处理导入的数据
-     * @param {Array} importedRows 导入的行数据
-     */
-    processImportedData(importedRows) {
-      if (!importedRows || !importedRows.length) return;
-
-      this.runBefore(
-        ["importExcel"],
-        (data) => {
-          const rows = data || importedRows;
-
-          if (this.editConfig.mode === "row") {
-            // 行编辑模式：添加所有行并设置为编辑状态
-            rows.forEach((row) => {
-              this.list.push(row);
-              this.editState.setRowEditStatus(row, true, "add");
-            });
-            this.$message.success(`成功导入 ${rows.length} 条数据`);
-          } else if (this.editConfig.mode === "cell") {
-            // 单元格编辑模式：仅添加行
-            rows.forEach((row) => {
-              this.list.push(row);
-            });
-            this.$message.success(`成功导入 ${rows.length} 条数据`);
-          } else if (this.editConfig.mode === "free") {
-            // 自由编辑模式：直接添加行
-            rows.forEach((row) => {
-              this.list.push(row);
-            });
-            this.$message.success(`成功导入 ${rows.length} 条数据`);
-          } else if (this.editConfig.mode === "dialog") {
-            // 弹窗编辑模式：不直接添加，提示用户使用新增按钮
-            this.$message.info("弹窗编辑模式下，请使用新增按钮添加数据");
-          }
-
-          setTimeout(() => {
-            this.$refs.tableFormRef && this.$refs.tableFormRef.clearValidate();
-          }, 0);
-        },
-        { rows: importedRows }
-      );
-    },
-
-    /**
-     * 显示Excel导入对话框
-     */
-    showExcelImportDialog() {
-      createFileInput(this.handleExcelImport.bind(this));
-    },
-
-    /**
-     * 导出表格数据到Excel
-     * @param {Object} options 导出选项
-     */
-    exportToExcel(options = {}) {
-      const defaultOptions = {
-        filename: this.crudOptions.title || "表格数据",
-        sheetName: "Sheet1",
-        includeHidden: false,
-        onlySelected: false,
-        selectedData: this.selectionRow,
-        formatter: null,
-      };
-
-      const exportOptions = { ...defaultOptions, ...options };
-
-      // 运行前置钩子
-      this.runBefore(
-        ["exportExcel"],
-        (data) => {
-          const exportData = data || this.list;
-
-          // 导出Excel
-          exportToExcel(exportData, this.trueRenderColumns, exportOptions);
-
-          // 触发导出成功事件
-          this.$emit("exportSuccess", exportData);
-        },
-        { data: this.list, options: exportOptions }
-      );
-    },
-
-    /**
-     * 获取格式化后的导出数据
-     * @param {Boolean} onlySelected 是否只导出选中数据
-     * @returns {Array} 格式化后的数据
-     */
-    getExportData(onlySelected = false) {
-      const data =
-        onlySelected && this.selectionRow.length
-          ? this.selectionRow
-          : this.list;
-      return formatExportData(data, this.trueRenderColumns);
-    },
-  },
-};

package/packages/crud/mixins/exposeMethods.js

@@ -1,107 +0,0 @@
-// TODO: 暴露外部方法
-export default {
-  methods: {
-    resetBatchEdit() {
-      this.$refs.menuBar && this.$refs.menuBar.resetBatchEdit();
-    },
-    /**
-     * 重置表单
-     * @param {String} prop 列属性
-     */
-    resetField(prop) {
-      // 通知子组件执行重置
-      this.$emit("handleChild", "resetField", prop);
-    },
-    // 重置表单
-    reset() {
-      this.$refs.tableFormRef && this.$refs.tableFormRef.resetFields();
-      this.$emit("reset");
-    },
-    /**
-     * 手动排序
-     * @param {Array} data 数据
-     * @param {Array} props 排序字段
-     */
-    sortedData(data, props) {
-      this._sortedData(data || this.list, props);
-    },
-    /**
-     * 新增表格行
-     * @param {Object} params 行数据参数
-     * @param {String} type 新增位置类型: 'first' | 'last'
-     */
-    addRow(params = {}, type = "last") {
-      this.handleRowAdd(params, type);
-    },
-    /**
-     * 设置行编辑状态
-     * @param {Object|Array} rows 行数据或行数据数组
-     * @param {Object} options 配置选项
-     * @param {String} options.type 操作类型: 'edit' | 'cancel' | 'save'
-     * @param {String} options.prop 列属性(可选,用于聚焦)
-     * @returns {void}
-     */
-    setRowEdit(rows, options = {}) {
-      const { type = "edit", prop } = options;
-      const rowArray = Array.isArray(rows) ? rows : [rows];
-
-      rowArray.forEach((row) => {
-        const scope = { row, $index: row.$index };
-        switch (type) {
-          case "edit":
-            this.handleRowEdit(scope, prop);
-            break;
-          case "cancel":
-            this.handleRowCancel(scope);
-            break;
-          case "save":
-            this.handleRowSave(scope);
-            break;
-        }
-      });
-    },
-
-    /**
-     * 批量设置行编辑状态
-     * @param {String} type 操作类型: 'edit'  | 'save' | 'cancel'
-     * @param {Array} rows 行数据数组
-     */
-    setBatchEdit(type = "edit", rows) {
-      if (type === "edit") {
-        this.handleBatchRowEdit(rows);
-      } else if (type === "save") {
-        this.handleBatchRowSave(undefined, rows);
-      } else if (type === "cancel") {
-        this.handleBatchRowCancel(rows);
-      }
-    },
-    /**
-     * 设置单元格编辑状态
-     * @param {Object|Array} rows 行数据或行数据数组
-     * @param {String} prop 列属性
-     */
-    setCellEdit(row, prop) {
-      if (!prop) return;
-      const column = this.columnsMap[prop];
-      if (!column) return;
-      const scope = { row, $index: row.$index };
-      this.handleCellEdit(scope, column);
-    },
-
-    // 获取当前所有处于编辑状态的行
-    getEditingRows() {
-      return this.editState?.getEditingRows().map((item) => item.row) || [];
-    },
-
-    // 清除所有编辑状态
-    clearAllEdit() {
-      this.editState?.clearAllEditStatus();
-      this.resetBatchEdit();
-      this.forceUpdate();
-    },
-    // 强制更新表格
-    forceUpdate() {
-      this._forceUpdate();
-    },
-  },
-};