bri-components 1.4.92 → 1.4.93

package/src/components/list/mixins/DshFlatTableMixin.js

@@ -1,493 +1,493 @@
-export default {
-    mixins: [],
-    components: {},
-    props: {
-        // 使用多选列
-        useSelection: {
-            type: Boolean,
-            default: false
-        }
-    },
-    data () {
-        return {
-            isUseDescSort: false,
-            pageMode: "small",
-            pagePropsObj: {
-                page: 1,
-                pagesize: 10,
-                pagesizeOpts: [10, 20, 30, 50]
-            }
-        };
-    },
-    computed: {
-        selfBasePropsObj () {
-            return {
-                _isUseDescSort: false, // 是否使用使用倒序
-                _mergeRowColKeys: [] // 合并行的列
-            };
-        },
-        // 是不是合并行表格
-        isMergeRowTable () {
-            return !!this.mergeRowColKeys.length;
-        },
-        mergeRowColKeys () {
-            const mergeRowColKeys = this.selfPropsObj._mergeRowColKeys || []; // 配置端有问题，高级依赖时值成undefined了
-            return this.selfColumns
-                .filter(colItem => mergeRowColKeys.includes(colItem._key))
-                .map(colItem => colItem._key);
-        },
-        // 一级合并列keys（一级合并列：左侧第一合并列和右侧和并列）
-        firstMergeRowColKeys () {
-            if (this.isMergeRowTable) {
-                const firstNormalIndex = this.selfColumns.findIndex(colItem => !this.mergeRowColKeys.includes(colItem._key));
-
-                // -1代表无普通单元格，0代表第一列就是普通单元格
-                return [-1, 0].includes(firstNormalIndex)
-                    ? this.mergeRowColKeys
-                    : [
-                        this.mergeRowColKeys[0],
-                        ...this.selfColumns
-                            .filter((colItem, colIndex) => colIndex > firstNormalIndex && this.mergeRowColKeys.includes(colItem._key))
-                            .map(colItem => colItem._key)
-                ];
-            } else {
-                return [];
-            }
-        },
-        notFirstMergeRowColKeys () {
-            return this.mergeRowColKeys.filter(colKey => !this.firstMergeRowColKeys.includes(colKey));
-        },
-        // 替换tableBaseMixin里的
-        searchTitle () {
-            return `${this.isSearching ? "筛选" : "全部"}数据${this.isMergeRowTable ? `，共 ${this.selfTotal}条；` : "；"}`;
-        },
-
-        /* --- 列字段 --- */
-        showColumns () {
-            return [
-                ...(this.useSelection === true ? [this.selectionColumn] : []),
-                ...(this.useIndex === true ? [this.indexColumn] : []),
-                ...this.$transformToColumns(this.showContentColumns),
-                ...(!this.isSearching && this.rowOperationList.length ? [this.operationColumn] : [])
-            ];
-        },
-        indexColumn () {
-            return {
-                title: "序号",
-                _key: "__index__",
-                key: "__index__",
-                field: "__index__",
-                width: 76,
-                align: "center",
-                fixed: "left",
-                renderBodyCell: ({ row, rowIndex, column }, h) => {
-                    return [
-                        h("div", this.isMergeRowTable ? rowIndex + 1 : row.__index__),
-
-                        // 添加符
-                        ...this.operationIconRender(h, { row, rowIndex, column })
-                    ];
-                }
-            };
-        },
-
-        /* --- 数据 --- */
-        rowspanMap () {
-            return this.tableDataObj.rowspanMap || {};
-        },
-        allListData () {
-            this.data.forEach((row) => {
-                this.fixRowData(row);
-            });
-            this.initFlag = false;
-
-            return this.isMergeRowTable
-                ? this.data
-                : this.isUseDescSort
-                    ? [...this.data].reverse()
-                    : this.data;
-        },
-        // 全部数据（或筛选出的数据）
-        showListData () {
-            return this.allListData
-                .filter(row =>
-                    this.isSearching
-                        ? this.$isAdvRelyAccord(this.finalTableAdvSearch, row)
-                        : true
-                )
-                .map((row, rowIndex) => {
-                    row.__index__ = rowIndex + 1;
-                    return row;
-            });
-        },
-        selfShowListData () {
-            return this.isMergeRowTable
-                ? this.showListData
-                : this.curPageShowListData;
-        },
-        // 替换tableBaseMixin里的
-        changedCols () {
-            return this.selfShowListData.reduce((totalCols, row) => {
-                return [
-                    ...new Set([...totalCols, ...(row.__changed__ || []).map(item => item.fieldKey)])
-                ];
-            }, []);
-        },
-        footerData () {
-            return this.isSearching
-                ? []
-                : this.useSummary && this.allListData.length
-                    ? [
-                        this.contentColumns.reduce((obj, column) => {
-                            return {
-                                ...obj,
-                                [column._key]: column._type === "number" && column._summaryType
-                                    ? this.$calNumList(
-                                        this.allListData.map(rowItem => rowItem[column._key]),
-                                        column._summaryType,
-                                        { ...column, _defaultDigit: 2 }
-                                    )
-                                    : (obj[column._key] || "--")
-                            };
-                        }, {
-                            _id: this.$ObjectID().str,
-                            __index__: "汇总",
-                            __operation__: "——"
-                        })
-                    ]
-                    : [];
-        },
-
-        allListMap () {
-            return this.$arrToMap(this.allListData, "_id");
-        },
-        //  全部数据 或 筛选时符合条件的数据 -当前页的
-        curPageShowListData () {
-            return this.pagePropsObj.page >= 1
-                ? (this.pagePropsObj.page - 1) * this.pagePropsObj.pagesize >= this.showListData.length
-                    ? this.showListData.slice(-(
-                        this.showListData.length % this.pagePropsObj.pagesize === 0
-                            ? this.pagePropsObj.pagesize
-                            : this.showListData.length % this.pagePropsObj.pagesize
-                    ))
-                    : this.showListData.slice(
-                        (this.pagePropsObj.page - 1) * this.pagePropsObj.pagesize,
-                        this.pagePropsObj.page * this.pagePropsObj.pagesize
-                    )
-                : [];
-        },
-        // 全部数据 或 筛选时符合条件的数据 -共多少分（！！！最小为1）
-        PageNum () {
-            return (
-                this.selfTotal % this.pagePropsObj.pagesize > 0
-                    ? Math.ceil(this.selfTotal / this.pagePropsObj.pagesize)
-                    : this.selfTotal / this.pagePropsObj.pagesize
-            ) || 1;
-        }
-    },
-    created () {
-        this.selfInit();
-    },
-    methods: {
-        selfInit () {
-            this.isUseDescSort = this.selfPropsObj._isUseDescSort;
-            this.initRowspan();
-        },
-        // 本身的初始化
-        selfReset () {
-            this.selfInit();
-        },
-        fixSelfRowData (row) {
-            if (this.initFlag) {
-                // 每条数据都补充全所有字段值（赋一个默认的空值）
-                this.selfColumns.forEach((colItem) => {
-                    // 不用row[colItem._key] === undefined判断，是因为后端给的空值不可靠，多选的有时候都能给null
-                    if (!Object.prototype.hasOwnProperty.call(row, colItem._key) && this.$isEmptyData(row[colItem._key])) {
-                        this.$set(row, colItem._key, this.$deepCopy(this.dftInitValMap[colItem._type]));
-                    }
-                });
-            }
-        },
-
-        // 切换正倒序
-        changeDescSort () {
-            this.isUseDescSort = !this.isUseDescSort;
-            this.changePage(1);
-        },
-        // 切换分页
-        changePage (page) {
-            this.pagePropsObj.page = page;
-            this.loadingFunc();
-        },
-        // 切换分页条数
-        changePageSize (pagesize) {
-            this.pagePropsObj.page = 1;
-            this.pagePropsObj.pagesize = pagesize;
-            this.loadingFunc();
-        },
-
-        // 点击 -添加行
-        clickCreate (operationItem, row, rowIndex, column) {
-            const curColKey = column ? column._key : undefined;
-            const list = this.data;
-            const newRow = this.getNewRowData();
-
-            // 处理单元格合并相关
-            if (this.isMergeRowTable) {
-                // 非底部按钮添加时
-                if (row) {
-                    // 寻找对应的行数据 -当前列是合并列会寻找，普通列不用找（就是row）
-                    if (this.mergeRowColKeys.includes(curColKey) && this.rowspanMap[this.getMixKey(row, column)] > 1) {
-                        const newList = this.allListData.slice(rowIndex + 1); // 从下一行开始截取
-                        const nextRowIndex = newList.findIndex(rowItem => this.rowspanMap[this.getMixKey(rowItem, column)] > 0); // 寻找该单元格值开始不一样的行
-                        // nextRowIndex为-1，代表最后一行
-                        row = nextRowIndex < 0
-                            ? newList[newList.length - 1]
-                            : newList[nextRowIndex - 1];
-                        rowIndex = list.findIndex(dataItem => dataItem._id === row._id);
-                    }
-
-                    // 寻找要复制值的列
-                    // 当前列：一级合并列，不复制值；
-                    if (this.firstMergeRowColKeys.includes(curColKey)) {
-                        this.mergeRowColKeys.forEach(colKey => {
-                            this.rowspanMap[this.getMixKey(newRow, { _key: colKey })] = 1;
-                        });
-                    }
-                    // 当前列：普通合并列(非一级合并列)-该列之前的合并列和一级合并列复制值给新的行；非合并列-全部复制值给新的行
-                    else {
-                        const notFirstCopyColKeys = this.notFirstMergeRowColKeys.includes(curColKey)
-                            ? this.notFirstMergeRowColKeys.filter((colKey, colIndex, list) => colIndex < list.findIndex(colKey => colKey === curColKey))
-                            : this.notFirstMergeRowColKeys;
-                        const noCopyColKeys = this.notFirstMergeRowColKeys.includes(curColKey)
-                            ? this.notFirstMergeRowColKeys.filter((colKey, colIndex, list) => colIndex >= list.findIndex(colKey => colKey === curColKey))
-                            : [];
-                        const copyColKeys = notFirstCopyColKeys.concat(this.firstMergeRowColKeys);
-
-                        // 复制值
-                        copyColKeys.reduce((obj, colKey, colIndex) => {
-                            return Object.assign(obj, {
-                                [colKey]: this.$deepCopy(row[colKey])
-                            });
-                        }, newRow);
-
-                        // rowspan记录
-                        copyColKeys.forEach(colKey => {
-                            // 合并的单元格更新rowspan记录
-                            const fistMergeRow = this.rowspanMap[this.getMixKey(row, { _key: colKey })] === 0
-                                ? list.slice(0, rowIndex).findLast(rowItem => this.rowspanMap[this.getMixKey(rowItem, { _key: colKey })] > 1)
-                                : row;
-                            this.rowspanMap[this.getMixKey(fistMergeRow, { _key: colKey })] = this.rowspanMap[this.getMixKey(fistMergeRow, { _key: colKey })] + 1;
-
-                            // 新增的单元格做rowspan记录
-                            this.rowspanMap[this.getMixKey(newRow, { _key: colKey })] = 0;
-                        });
-                        noCopyColKeys.forEach(colKey => {
-                            this.rowspanMap[this.getMixKey(newRow, { _key: colKey })] = 1;
-                        });
-                    }
-                }
-                // 底部按钮添加时
-                else {
-                    this.mergeRowColKeys.forEach(colKey => {
-                        this.rowspanMap[this.getMixKey(newRow, { _key: colKey })] = 1;
-                    });
-                }
-            }
-
-            const newRowIndex = row
-                ? list.findIndex(rowItem => rowItem._id === row._id) + 1
-                : list.length;
-
-            if (this.isMergeRowTable) {
-                list.splice(newRowIndex, 0, newRow);
-            } else {
-                if (this.isUseDescSort) {
-                    if (row) {
-                        list.splice(newRowIndex - 1, 0, newRow);
-                        if (rowIndex + 1 === this.pagePropsObj.pagesize) {
-                            this.changePage(this.pagePropsObj.page + 1); // 一定翻页了
-                        }
-                    } else {
-                        list.splice(newRowIndex, 0, newRow);
-                        if (this.pagePropsObj.page !== 1) {
-                            this.changePage(1);
-                        }
-                    }
-                } else {
-                    if (row) {
-                        list.splice(newRowIndex, 0, newRow);
-                        if (rowIndex + 1 === this.pagePropsObj.pagesize) {
-                            this.changePage(this.pagePropsObj.page + 1); // 一定翻页了
-                        }
-                    } else {
-                        list.splice(newRowIndex, 0, newRow);
-                        if (this.pagePropsObj.page !== this.PageNum) {
-                            this.changePage(this.PageNum);
-                        }
-                    }
-                }
-            }
-
-            this.changeSelect();
-            this.change("createRow", newRow, newRowIndex, null);
-        },
-        // 点击 -删除行
-        clickDelete (operationItem, row, rowIndex) {
-            this.$Modal.confirm({
-                title: "提示",
-                content: "确定删除吗？",
-                onOk: () => {
-                    const list = this.data;
-
-                    // 处理单元格合并相关
-                    if (this.isMergeRowTable) {
-                        this.mergeRowColKeys.forEach(colKey => {
-                            const column = { _key: colKey };
-                            const rowIndex = list.findIndex(dataItem => dataItem._id === row._id);
-
-                            // 当前单元格合并了下面的 -把合并数减去1给下一单元格
-                            if (this.rowspanMap[this.getMixKey(row, column)] > 1) {
-                                const nextRow = list[rowIndex + 1];
-                                this.rowspanMap[this.getMixKey(nextRow, column)] = this.rowspanMap[this.getMixKey(row, column)] - 1;
-                            }
-                            // 当前单元格被上面的合并了 -最上面的合并单元格合并数减去1
-                            else if (this.rowspanMap[this.getMixKey(row, column)] === 0) {
-                                const fistMergeRow = list.slice(0, rowIndex).findLast(rowItem => this.rowspanMap[this.getMixKey(rowItem, column)] > 1);
-                                this.rowspanMap[this.getMixKey(fistMergeRow, column)] = this.rowspanMap[this.getMixKey(fistMergeRow, column)] - 1;
-                            }
-                            // 当前单元格单独存在（无合并）
-                            else if (this.rowspanMap[this.getMixKey(row, column)] === 1) {
-                                // 无处理
-                            }
-
-                            // 清除被删除单元格的rowspan记录
-                            delete this.rowspanMap[this.getMixKey(row, column)];
-                        });
-                    }
-
-                    const listIndex = list.findIndex(rowItem => rowItem._id === row._id);
-                    list.splice(listIndex, 1);
-
-                    this.change("deleteRow", row, rowIndex, null);
-                }
-            });
-        },
-        quickChangeVal (operationItem, row, rowIndex, column, params) {
-            if (["text", "textarea", "idcard", "email", "phone", "url", "password"].includes(column._type)) {
-                this.dealRuleRecord(row, column);
-                this.dealSameRowsVal({ row, rowIndex, column });
-
-                this.change("quickChangeVal", row, rowIndex, column, ...params);
-            }
-        },
-        changeVal (operationItem, row, rowIndex, column, params) {
-            if (!["text", "textarea", "idcard", "email", "phone", "url", "password"].includes(column._type)) {
-                this.dealRuleRecord(row, column);
-                this.dealSameRowsVal({ row, rowIndex, column });
-
-                this.change("changeVal", row, rowIndex, column, ...params);
-            }
-        },
-
-        bodyCellSpan ({ row, rowIndex, column }) {
-            return {
-                rowspan: this.mergeRowColKeys.includes(column._key)
-                    ? this.isSearching
-                        ? this.getRowspan({ row, rowIndex, column })
-                        : this.getRealRowspan({ row, rowIndex, column })
-                    : 1,
-                colspan: 1
-            };
-        },
-        // 加工单元格对应的配置
-        getSelfResetCol ({ row, rowIndex, column }) {
-            return this.mergeRowColKeys.includes(column._key)
-                ? {
-                    _heightAuto: true
-                }
-                : {};
-        },
-
-        /* ----------- 方法 ---------- */
-        // 初始化合并单元格的rowspan
-        initRowspan () {
-            if (this.isMergeRowTable) {
-                this.$set(this.tableDataObj, "rowspanMap", this.tableDataObj.rowspanMap || {});
-
-                // TODO: 待删除
-                Object.entries(this.rowspanMap).forEach(arr => {
-                    if (arr[0].includes("dsh")) {
-                        this.rowspanMap[arr[0].split("dsh").join("--")] = this.rowspanMap[arr[1]];
-                        delete this.rowspanMap[arr[0]];
-                    }
-                });
-
-                this.allListData.forEach((rowItem, rowIndex) => {
-                    this.mergeRowColKeys.forEach(colKey => {
-                        const column = { _key: colKey };
-
-                        // 新增页 -行的_id被置换，rowspanMap也要相应置换，还要清除rowspanMap里和默认行老_id相关的
-                        const oldId = this.idRecordMap[rowItem._id];
-                        const oldRow = { ...rowItem, _id: oldId };
-                        if (oldId && ![undefined, null].includes(this.rowspanMap[this.getMixKey(oldRow, column)])) {
-                            this.rowspanMap[this.getMixKey(rowItem, column)] = this.getRealRowspan({ row: oldRow, rowIndex, column });
-                            delete this.rowspanMap[this.getMixKey(oldRow, column)];
-                        } else {
-                            this.rowspanMap[this.getMixKey(rowItem, column)] = this.getRealRowspan({ row: rowItem, rowIndex, column });
-                        }
-                    });
-                });
-
-                // 清除rowspanMap无用的（针对来回改mergeRowColKeys）
-                Object.entries(this.rowspanMap).forEach(arr => {
-                    const keyArr = arr[0].split("--");
-                    const id = keyArr[0];
-                    const colKey = keyArr.slice(1).join("--");
-                    if (!this.allListMap[id] || !this.mergeRowColKeys.includes(colKey)) {
-                        delete this.rowspanMap[arr[0]];
-                    }
-                });
-            }
-        },
-        // 获取合并单元格真实的rowspan
-        getRealRowspan ({ row, rowIndex, column }) {
-            return ![undefined, null].includes(this.rowspanMap[this.getMixKey(row, column)])
-                ? this.rowspanMap[this.getMixKey(row, column)]
-                : this.getRowspan({ row, rowIndex, column }, this.allListData);
-        },
-        // 计算rowspan
-        getRowspan ({ row, rowIndex, column }, list = this.showListData) {
-            let rowspan = 1;
-            rowIndex = list.findIndex(dataItem => dataItem._id === row._id);
-
-            // 合并单元格的列走这
-            if (this.mergeRowColKeys.includes(column._key)) {
-                rowIndex = list.findIndex(dataItem => dataItem._id === row._id);
-
-                // 代表显示出来的行
-                if (rowIndex > -1) {
-                    if (rowIndex !== 0 && this.isCompareSame(column, row, list[rowIndex - 1])) {
-                        rowspan = 0;
-                    } else {
-                        const newList = list.slice(rowIndex + 1);
-                        const newIndex = newList.findIndex(rowItem => !this.isCompareSame(column, row, rowItem));
-                        rowspan = 1 + (newIndex === -1 ? newList.length : newIndex);
-                    }
-                }
-            }
-
-            return rowspan;
-        },
-        // 合并单元格的行，某列的值全部跟着修改
-        dealSameRowsVal ({ row, rowIndex, column }, list = this.allListData) {
-            if (this.mergeRowColKeys.includes(column._key) && this.rowspanMap[this.getMixKey(row, column)] > 1) {
-                const indexInAll = list.findIndex(dataItem => dataItem._id === row._id);
-                list.slice(indexInAll + 1, indexInAll + this.rowspanMap[this.getMixKey(row, column)])
-                    .forEach(rowItem => {
-                        rowItem[column._key] = this.$deepCopy(row[column._key]);
-                });
-            }
-        }
-    }
-};
+export default {
+    mixins: [],
+    components: {},
+    props: {
+        // 使用多选列
+        useSelection: {
+            type: Boolean,
+            default: false
+        }
+    },
+    data () {
+        return {
+            isUseDescSort: false,
+            pageMode: "small",
+            pagePropsObj: {
+                page: 1,
+                pagesize: 10,
+                pagesizeOpts: [10, 20, 30, 50]
+            }
+        };
+    },
+    computed: {
+        selfBasePropsObj () {
+            return {
+                _isUseDescSort: false, // 是否使用使用倒序
+                _mergeRowColKeys: [] // 合并行的列
+            };
+        },
+        // 是不是合并行表格
+        isMergeRowTable () {
+            return !!this.mergeRowColKeys.length;
+        },
+        mergeRowColKeys () {
+            const mergeRowColKeys = this.selfPropsObj._mergeRowColKeys || []; // 配置端有问题，高级依赖时值成undefined了
+            return this.selfColumns
+                .filter(colItem => mergeRowColKeys.includes(colItem._key))
+                .map(colItem => colItem._key);
+        },
+        // 一级合并列keys（一级合并列：左侧第一合并列和右侧和并列）
+        firstMergeRowColKeys () {
+            if (this.isMergeRowTable) {
+                const firstNormalIndex = this.selfColumns.findIndex(colItem => !this.mergeRowColKeys.includes(colItem._key));
+
+                // -1代表无普通单元格，0代表第一列就是普通单元格
+                return [-1, 0].includes(firstNormalIndex)
+                    ? this.mergeRowColKeys
+                    : [
+                        this.mergeRowColKeys[0],
+                        ...this.selfColumns
+                            .filter((colItem, colIndex) => colIndex > firstNormalIndex && this.mergeRowColKeys.includes(colItem._key))
+                            .map(colItem => colItem._key)
+                ];
+            } else {
+                return [];
+            }
+        },
+        notFirstMergeRowColKeys () {
+            return this.mergeRowColKeys.filter(colKey => !this.firstMergeRowColKeys.includes(colKey));
+        },
+        // 替换tableBaseMixin里的
+        searchTitle () {
+            return `${this.isSearching ? "筛选" : "全部"}数据${this.isMergeRowTable ? `，共 ${this.selfTotal}条；` : "；"}`;
+        },
+
+        /* --- 列字段 --- */
+        showColumns () {
+            return [
+                ...(this.useSelection === true ? [this.selectionColumn] : []),
+                ...(this.useIndex === true ? [this.indexColumn] : []),
+                ...this.$transformToColumns(this.showContentColumns),
+                ...(!this.isSearching && this.rowOperationList.length ? [this.operationColumn] : [])
+            ];
+        },
+        indexColumn () {
+            return {
+                title: "序号",
+                _key: "__index__",
+                key: "__index__",
+                field: "__index__",
+                width: 76,
+                align: "center",
+                fixed: "left",
+                renderBodyCell: ({ row, rowIndex, column }, h) => {
+                    return [
+                        h("div", this.isMergeRowTable ? rowIndex + 1 : row.__index__),
+
+                        // 添加符
+                        ...this.operationIconRender(h, { row, rowIndex, column })
+                    ];
+                }
+            };
+        },
+
+        /* --- 数据 --- */
+        rowspanMap () {
+            return this.tableDataObj.rowspanMap || {};
+        },
+        allListData () {
+            this.data.forEach((row) => {
+                this.fixRowData(row);
+            });
+            this.initFlag = false;
+
+            return this.isMergeRowTable
+                ? this.data
+                : this.isUseDescSort
+                    ? [...this.data].reverse()
+                    : this.data;
+        },
+        // 全部数据（或筛选出的数据）
+        showListData () {
+            return this.allListData
+                .filter(row =>
+                    this.isSearching
+                        ? this.$isAdvRelyAccord(this.finalTableAdvSearch, row)
+                        : true
+                )
+                .map((row, rowIndex) => {
+                    row.__index__ = rowIndex + 1;
+                    return row;
+            });
+        },
+        selfShowListData () {
+            return this.isMergeRowTable
+                ? this.showListData
+                : this.curPageShowListData;
+        },
+        // 替换tableBaseMixin里的
+        changedCols () {
+            return this.selfShowListData.reduce((totalCols, row) => {
+                return [
+                    ...new Set([...totalCols, ...(row.__changed__ || []).map(item => item.fieldKey)])
+                ];
+            }, []);
+        },
+        footerData () {
+            return this.isSearching
+                ? []
+                : this.useSummary && this.allListData.length
+                    ? [
+                        this.contentColumns.reduce((obj, column) => {
+                            return {
+                                ...obj,
+                                [column._key]: column._type === "number" && column._summaryType
+                                    ? this.$calNumList(
+                                        this.allListData.map(rowItem => rowItem[column._key]),
+                                        column._summaryType,
+                                        { ...column, _defaultDigit: 2 }
+                                    )
+                                    : (obj[column._key] || "--")
+                            };
+                        }, {
+                            _id: this.$ObjectID().str,
+                            __index__: "汇总",
+                            __operation__: "——"
+                        })
+                    ]
+                    : [];
+        },
+
+        allListMap () {
+            return this.$arrToMap(this.allListData, "_id");
+        },
+        //  全部数据 或 筛选时符合条件的数据 -当前页的
+        curPageShowListData () {
+            return this.pagePropsObj.page >= 1
+                ? (this.pagePropsObj.page - 1) * this.pagePropsObj.pagesize >= this.showListData.length
+                    ? this.showListData.slice(-(
+                        this.showListData.length % this.pagePropsObj.pagesize === 0
+                            ? this.pagePropsObj.pagesize
+                            : this.showListData.length % this.pagePropsObj.pagesize
+                    ))
+                    : this.showListData.slice(
+                        (this.pagePropsObj.page - 1) * this.pagePropsObj.pagesize,
+                        this.pagePropsObj.page * this.pagePropsObj.pagesize
+                    )
+                : [];
+        },
+        // 全部数据 或 筛选时符合条件的数据 -共多少分（！！！最小为1）
+        PageNum () {
+            return (
+                this.selfTotal % this.pagePropsObj.pagesize > 0
+                    ? Math.ceil(this.selfTotal / this.pagePropsObj.pagesize)
+                    : this.selfTotal / this.pagePropsObj.pagesize
+            ) || 1;
+        }
+    },
+    created () {
+        this.selfInit();
+    },
+    methods: {
+        selfInit () {
+            this.isUseDescSort = this.selfPropsObj._isUseDescSort;
+            this.initRowspan();
+        },
+        // 本身的初始化
+        selfReset () {
+            this.selfInit();
+        },
+        fixSelfRowData (row) {
+            if (this.initFlag) {
+                // 每条数据都补充全所有字段值（赋一个默认的空值）
+                this.selfColumns.forEach((colItem) => {
+                    // 不用row[colItem._key] === undefined判断，是因为后端给的空值不可靠，多选的有时候都能给null
+                    if (!Object.prototype.hasOwnProperty.call(row, colItem._key) && this.$isEmptyData(row[colItem._key])) {
+                        this.$set(row, colItem._key, this.$deepCopy(this.dftInitValMap[colItem._type]));
+                    }
+                });
+            }
+        },
+
+        // 切换正倒序
+        changeDescSort () {
+            this.isUseDescSort = !this.isUseDescSort;
+            this.changePage(1);
+        },
+        // 切换分页
+        changePage (page) {
+            this.pagePropsObj.page = page;
+            this.loadingFunc();
+        },
+        // 切换分页条数
+        changePageSize (pagesize) {
+            this.pagePropsObj.page = 1;
+            this.pagePropsObj.pagesize = pagesize;
+            this.loadingFunc();
+        },
+
+        // 点击 -添加行
+        clickCreate (operationItem, row, rowIndex, column) {
+            const curColKey = column ? column._key : undefined;
+            const list = this.data;
+            const newRow = this.getNewRowData();
+
+            // 处理单元格合并相关
+            if (this.isMergeRowTable) {
+                // 非底部按钮添加时
+                if (row) {
+                    // 寻找对应的行数据 -当前列是合并列会寻找，普通列不用找（就是row）
+                    if (this.mergeRowColKeys.includes(curColKey) && this.rowspanMap[this.getMixKey(row, column)] > 1) {
+                        const newList = this.allListData.slice(rowIndex + 1); // 从下一行开始截取
+                        const nextRowIndex = newList.findIndex(rowItem => this.rowspanMap[this.getMixKey(rowItem, column)] > 0); // 寻找该单元格值开始不一样的行
+                        // nextRowIndex为-1，代表最后一行
+                        row = nextRowIndex < 0
+                            ? newList[newList.length - 1]
+                            : newList[nextRowIndex - 1];
+                        rowIndex = list.findIndex(dataItem => dataItem._id === row._id);
+                    }
+
+                    // 寻找要复制值的列
+                    // 当前列：一级合并列，不复制值；
+                    if (this.firstMergeRowColKeys.includes(curColKey)) {
+                        this.mergeRowColKeys.forEach(colKey => {
+                            this.rowspanMap[this.getMixKey(newRow, { _key: colKey })] = 1;
+                        });
+                    }
+                    // 当前列：普通合并列(非一级合并列)-该列之前的合并列和一级合并列复制值给新的行；非合并列-全部复制值给新的行
+                    else {
+                        const notFirstCopyColKeys = this.notFirstMergeRowColKeys.includes(curColKey)
+                            ? this.notFirstMergeRowColKeys.filter((colKey, colIndex, list) => colIndex < list.findIndex(colKey => colKey === curColKey))
+                            : this.notFirstMergeRowColKeys;
+                        const noCopyColKeys = this.notFirstMergeRowColKeys.includes(curColKey)
+                            ? this.notFirstMergeRowColKeys.filter((colKey, colIndex, list) => colIndex >= list.findIndex(colKey => colKey === curColKey))
+                            : [];
+                        const copyColKeys = notFirstCopyColKeys.concat(this.firstMergeRowColKeys);
+
+                        // 复制值
+                        copyColKeys.reduce((obj, colKey, colIndex) => {
+                            return Object.assign(obj, {
+                                [colKey]: this.$deepCopy(row[colKey])
+                            });
+                        }, newRow);
+
+                        // rowspan记录
+                        copyColKeys.forEach(colKey => {
+                            // 合并的单元格更新rowspan记录
+                            const fistMergeRow = this.rowspanMap[this.getMixKey(row, { _key: colKey })] === 0
+                                ? list.slice(0, rowIndex).findLast(rowItem => this.rowspanMap[this.getMixKey(rowItem, { _key: colKey })] > 1)
+                                : row;
+                            this.rowspanMap[this.getMixKey(fistMergeRow, { _key: colKey })] = this.rowspanMap[this.getMixKey(fistMergeRow, { _key: colKey })] + 1;
+
+                            // 新增的单元格做rowspan记录
+                            this.rowspanMap[this.getMixKey(newRow, { _key: colKey })] = 0;
+                        });
+                        noCopyColKeys.forEach(colKey => {
+                            this.rowspanMap[this.getMixKey(newRow, { _key: colKey })] = 1;
+                        });
+                    }
+                }
+                // 底部按钮添加时
+                else {
+                    this.mergeRowColKeys.forEach(colKey => {
+                        this.rowspanMap[this.getMixKey(newRow, { _key: colKey })] = 1;
+                    });
+                }
+            }
+
+            const newRowIndex = row
+                ? list.findIndex(rowItem => rowItem._id === row._id) + 1
+                : list.length;
+
+            if (this.isMergeRowTable) {
+                list.splice(newRowIndex, 0, newRow);
+            } else {
+                if (this.isUseDescSort) {
+                    if (row) {
+                        list.splice(newRowIndex - 1, 0, newRow);
+                        if (rowIndex + 1 === this.pagePropsObj.pagesize) {
+                            this.changePage(this.pagePropsObj.page + 1); // 一定翻页了
+                        }
+                    } else {
+                        list.splice(newRowIndex, 0, newRow);
+                        if (this.pagePropsObj.page !== 1) {
+                            this.changePage(1);
+                        }
+                    }
+                } else {
+                    if (row) {
+                        list.splice(newRowIndex, 0, newRow);
+                        if (rowIndex + 1 === this.pagePropsObj.pagesize) {
+                            this.changePage(this.pagePropsObj.page + 1); // 一定翻页了
+                        }
+                    } else {
+                        list.splice(newRowIndex, 0, newRow);
+                        if (this.pagePropsObj.page !== this.PageNum) {
+                            this.changePage(this.PageNum);
+                        }
+                    }
+                }
+            }
+
+            this.changeSelect();
+            this.change("createRow", newRow, newRowIndex, null);
+        },
+        // 点击 -删除行
+        clickDelete (operationItem, row, rowIndex) {
+            this.$Modal.confirm({
+                title: "提示",
+                content: "确定删除吗？",
+                onOk: () => {
+                    const list = this.data;
+
+                    // 处理单元格合并相关
+                    if (this.isMergeRowTable) {
+                        this.mergeRowColKeys.forEach(colKey => {
+                            const column = { _key: colKey };
+                            const rowIndex = list.findIndex(dataItem => dataItem._id === row._id);
+
+                            // 当前单元格合并了下面的 -把合并数减去1给下一单元格
+                            if (this.rowspanMap[this.getMixKey(row, column)] > 1) {
+                                const nextRow = list[rowIndex + 1];
+                                this.rowspanMap[this.getMixKey(nextRow, column)] = this.rowspanMap[this.getMixKey(row, column)] - 1;
+                            }
+                            // 当前单元格被上面的合并了 -最上面的合并单元格合并数减去1
+                            else if (this.rowspanMap[this.getMixKey(row, column)] === 0) {
+                                const fistMergeRow = list.slice(0, rowIndex).findLast(rowItem => this.rowspanMap[this.getMixKey(rowItem, column)] > 1);
+                                this.rowspanMap[this.getMixKey(fistMergeRow, column)] = this.rowspanMap[this.getMixKey(fistMergeRow, column)] - 1;
+                            }
+                            // 当前单元格单独存在（无合并）
+                            else if (this.rowspanMap[this.getMixKey(row, column)] === 1) {
+                                // 无处理
+                            }
+
+                            // 清除被删除单元格的rowspan记录
+                            delete this.rowspanMap[this.getMixKey(row, column)];
+                        });
+                    }
+
+                    const listIndex = list.findIndex(rowItem => rowItem._id === row._id);
+                    list.splice(listIndex, 1);
+
+                    this.change("deleteRow", row, rowIndex, null);
+                }
+            });
+        },
+        quickChangeVal (operationItem, row, rowIndex, column, params) {
+            if (["text", "textarea", "idcard", "email", "phone", "url", "password"].includes(column._type)) {
+                this.dealRuleRecord(row, column);
+                this.dealSameRowsVal({ row, rowIndex, column });
+
+                this.change("quickChangeVal", row, rowIndex, column, ...params);
+            }
+        },
+        changeVal (operationItem, row, rowIndex, column, params) {
+            if (!["text", "textarea", "idcard", "email", "phone", "url", "password"].includes(column._type)) {
+                this.dealRuleRecord(row, column);
+                this.dealSameRowsVal({ row, rowIndex, column });
+
+                this.change("changeVal", row, rowIndex, column, ...params);
+            }
+        },
+
+        bodyCellSpan ({ row, rowIndex, column }) {
+            return {
+                rowspan: this.mergeRowColKeys.includes(column._key)
+                    ? this.isSearching
+                        ? this.getRowspan({ row, rowIndex, column })
+                        : this.getRealRowspan({ row, rowIndex, column })
+                    : 1,
+                colspan: 1
+            };
+        },
+        // 加工单元格对应的配置
+        getSelfResetCol ({ row, rowIndex, column }) {
+            return this.mergeRowColKeys.includes(column._key)
+                ? {
+                    _heightAuto: true
+                }
+                : {};
+        },
+
+        /* ----------- 方法 ---------- */
+        // 初始化合并单元格的rowspan
+        initRowspan () {
+            if (this.isMergeRowTable) {
+                this.$set(this.tableDataObj, "rowspanMap", this.tableDataObj.rowspanMap || {});
+
+                // TODO: 待删除
+                Object.entries(this.rowspanMap).forEach(arr => {
+                    if (arr[0].includes("dsh")) {
+                        this.rowspanMap[arr[0].split("dsh").join("--")] = this.rowspanMap[arr[1]];
+                        delete this.rowspanMap[arr[0]];
+                    }
+                });
+
+                this.allListData.forEach((rowItem, rowIndex) => {
+                    this.mergeRowColKeys.forEach(colKey => {
+                        const column = { _key: colKey };
+
+                        // 新增页 -行的_id被置换，rowspanMap也要相应置换，还要清除rowspanMap里和默认行老_id相关的
+                        const oldId = this.idRecordMap[rowItem._id];
+                        const oldRow = { ...rowItem, _id: oldId };
+                        if (oldId && ![undefined, null].includes(this.rowspanMap[this.getMixKey(oldRow, column)])) {
+                            this.rowspanMap[this.getMixKey(rowItem, column)] = this.getRealRowspan({ row: oldRow, rowIndex, column });
+                            delete this.rowspanMap[this.getMixKey(oldRow, column)];
+                        } else {
+                            this.rowspanMap[this.getMixKey(rowItem, column)] = this.getRealRowspan({ row: rowItem, rowIndex, column });
+                        }
+                    });
+                });
+
+                // 清除rowspanMap无用的（针对来回改mergeRowColKeys）
+                Object.entries(this.rowspanMap).forEach(arr => {
+                    const keyArr = arr[0].split("--");
+                    const id = keyArr[0];
+                    const colKey = keyArr.slice(1).join("--");
+                    if (!this.allListMap[id] || !this.mergeRowColKeys.includes(colKey)) {
+                        delete this.rowspanMap[arr[0]];
+                    }
+                });
+            }
+        },
+        // 获取合并单元格真实的rowspan
+        getRealRowspan ({ row, rowIndex, column }) {
+            return ![undefined, null].includes(this.rowspanMap[this.getMixKey(row, column)])
+                ? this.rowspanMap[this.getMixKey(row, column)]
+                : this.getRowspan({ row, rowIndex, column }, this.allListData);
+        },
+        // 计算rowspan
+        getRowspan ({ row, rowIndex, column }, list = this.showListData) {
+            let rowspan = 1;
+            rowIndex = list.findIndex(dataItem => dataItem._id === row._id);
+
+            // 合并单元格的列走这
+            if (this.mergeRowColKeys.includes(column._key)) {
+                rowIndex = list.findIndex(dataItem => dataItem._id === row._id);
+
+                // 代表显示出来的行
+                if (rowIndex > -1) {
+                    if (rowIndex !== 0 && this.isCompareSame(column, row, list[rowIndex - 1])) {
+                        rowspan = 0;
+                    } else {
+                        const newList = list.slice(rowIndex + 1);
+                        const newIndex = newList.findIndex(rowItem => !this.isCompareSame(column, row, rowItem));
+                        rowspan = 1 + (newIndex === -1 ? newList.length : newIndex);
+                    }
+                }
+            }
+
+            return rowspan;
+        },
+        // 合并单元格的行，某列的值全部跟着修改
+        dealSameRowsVal ({ row, rowIndex, column }, list = this.allListData) {
+            if (this.mergeRowColKeys.includes(column._key) && this.rowspanMap[this.getMixKey(row, column)] > 1) {
+                const indexInAll = list.findIndex(dataItem => dataItem._id === row._id);
+                list.slice(indexInAll + 1, indexInAll + this.rowspanMap[this.getMixKey(row, column)])
+                    .forEach(rowItem => {
+                        rowItem[column._key] = this.$deepCopy(row[column._key]);
+                });
+            }
+        }
+    }
+};