bri-components 1.4.6 → 1.4.7

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

@@ -15,6 +15,12 @@ export default {
             type: Boolean,
             default: true
         },
+        tableDataObj: {
+            type: Object,
+            default () {
+                return {};
+            }
+        },
         data: {
             type: Array,
             default () {
@@ -45,12 +51,6 @@ export default {
                 return {};
             }
         },
-        tableDataObj: {
-            type: Object,
-            default () {
-                return {};
-            }
-        },
 
         allFormList: {
             type: Array,
@@ -73,10 +73,12 @@ export default {
             resetProperties: ["__isRendered__", "__isShow__", "__isTmpShow__", "__isSearchShow__", "__isExpand__", "__treeIndex__"],
 
             initFlag: true,
+            isExpandAction: false,
             showRuleMessage: false, // 进行全体校验
-            ruleRecordMap: {}, // 单元格是否发生校验的记录映射
+
+            idRecordMap: {}, // 默认id转换映射
             hoverRecordMap: {},
-            isExpandAction: false,
+            ruleRecordMap: {}, // 单元格是否发生校验的记录映射
 
             showTopSearch: true,
             selfLogicPropsObj: {
@@ -137,8 +139,13 @@ export default {
                 }
             },
             otherOperationMap: {
+                canQuickChangeVal: {
+                    name: "立即改变值事件",
+                    type: "canQuickChangeVal",
+                    event: "quickChangeVal"
+                },
                 canChangeVal: {
-                    name: "改变输入框值",
+                    name: "改变值事件",
                     type: "canChangeVal",
                     event: "changeVal"
                 }
@@ -237,6 +244,8 @@ export default {
                 _useSelection: false, // 使用选择列 -配置端暂时用不到
                 _useIndex: true, // 使用序号列
                 _useSummary: false, // 使用汇总行
+                _noborderColKeys: [], // 无边线的列
+                _bgColKeys: [], // 带背景色的列
 
                 _disabledBtns: false, // 禁用增删按钮
                 _showCreateBtnColKeys: [], // 显示增删图标的列
@@ -321,6 +330,12 @@ export default {
         useSummary () {
             return this.selfPropsObj._useSummary;
         },
+        noborderColKeys () {
+            return this.selfPropsObj._noborderColKeys;
+        },
+        bgColKeys () {
+            return this.selfPropsObj._bgColKeys;
+        },
 
         disabledBtns () {
             return this.isDftSet ? false : this.selfPropsObj._disabledBtns;
@@ -707,10 +722,13 @@ export default {
         // 重置
         reset () {
             this.initFlag = true;
+            this.isExpandAction = false;
             this.showRuleMessage = false;
-            this.ruleRecordMap = {};
+
+            this.idRecordMap = {};
             this.hoverRecordMap = {};
-            this.isExpandAction = false;
+            this.ruleRecordMap = {};
+
             this.dftAdvSearch = {
                 logic: "and",
                 conditions: []
@@ -734,16 +752,21 @@ export default {
             this.$emit("changeSelect", list);
         },
         // 输入框失去焦点
-        controlBlur (operationItem, row, rowIndex, col, params) {
-            this.$set(this.ruleRecordMap, `${row._id}dsh${col._key}`, { showRuleMessage: true });
+        controlBlur (operationItem, row, rowIndex, column, params) {
+            this.$set(this.ruleRecordMap, this.getMixKey(row, column), { showRuleMessage: true });
+        },
+        // 输入框值改变立即
+        quickChangeVal (operationItem, row, rowIndex, column, params) {
+            this.$set(this.ruleRecordMap, this.getMixKey(row, column), { showRuleMessage: true });
+            this.change("quickChangeVal", row, rowIndex, column, ...params);
         },
         // 输入框值改变
-        changeVal (operationItem, row, rowIndex, col, params) {
-            this.$set(this.ruleRecordMap, `${row._id}dsh${col._key}`, { showRuleMessage: true });
-            this.change("changeVal", row, rowIndex, col, ...params);
+        changeVal (operationItem, row, rowIndex, column, params) {
+            this.$set(this.ruleRecordMap, this.getMixKey(row, column), { showRuleMessage: true });
+            this.change("changeVal", row, rowIndex, column, ...params);
         },
-        change (eventType, row, rowIndex, col, ...params) {
-            this.$emit("change", this.tableDataObj, eventType, col, row, rowIndex, ...params);
+        change (eventType, row, rowIndex, column, ...params) {
+            this.$emit("change", this.tableDataObj, eventType, column, row, rowIndex, ...params);
         },
 
         /* ----------- 隐藏／显示字段 ---------- */
@@ -1089,15 +1112,7 @@ export default {
                                     formData: row,
                                     formItem: {
                                         ...column,
-                                        ...(
-                                            column.colType === "tree"
-                                                ? {
-                                                    _key: "name",
-                                                    _heightAuto: true,
-                                                    _placeholder: " "
-                                                }
-                                                : column
-                                        )
+                                        _key: column.colType === "tree" ? "name" : column._key
                                     },
                                     allFormList: this.selfColumns,
                                     inTableType: this.inTableType,
@@ -1108,6 +1123,7 @@ export default {
                                 },
                                 on: {
                                     blur: () => this.controlBlur(null, row, rowIndex, column, arguments),
+                                    quickChange: () => this.$dispatchEvent(this.operationMap.canQuickChangeVal, row, rowIndex, column, arguments),
                                     change: () => this.$dispatchEvent(this.operationMap.canChangeVal, row, rowIndex, column, arguments)
                                 }
                             })
@@ -1119,15 +1135,7 @@ export default {
                             formData: row,
                             formItem: {
                                 ...column,
-                                ...(
-                                    column.colType === "tree"
-                                        ? {
-                                            _key: "name",
-                                            _heightAuto: true,
-                                            _placeholder: " "
-                                        }
-                                        : column
-                                )
+                                _key: column.colType === "tree" ? "name" : column._key
                             },
                             allFormList: this.selfColumns,
                             inTableType: this.inTableType,
@@ -1138,6 +1146,7 @@ export default {
                         },
                         on: {
                             blur: () => this.controlBlur(null, row, rowIndex, column, arguments),
+                            quickChange: () => this.$dispatchEvent(this.operationMap.canQuickChangeVal, row, rowIndex, column, arguments),
                             change: () => this.$dispatchEvent(this.operationMap.canChangeVal, row, rowIndex, column, arguments)
                         }
                     }),
@@ -1266,6 +1275,14 @@ export default {
                             : ""
                         : " bri-table-td-hide"
                 }` +
+                `${this.noborderColKeys.includes(column._key)
+                    ? " bri-table-td-noborder"
+                    : ""
+                }` +
+                `${this.bgColKeys.includes(column._key)
+                    ? " bri-table-td-bg"
+                    : ""
+                }` +
                 `${this.selfBodyCellClass
                     ? this.selfBodyCellClass({ row, rowIndex, column })
                     : ""
@@ -1292,38 +1309,6 @@ export default {
         },
 
         /* ----------- 方法 ---------- */
-        // 生成新的一行数据
-        getNewRowData (level, list) {
-            if (["cascaderTable"].includes(this.controlType)) {
-                return {
-                    ...this.$deepCopy(this.selfRowDft),
-                    ...(this.getRowOtherDft ? this.$deepCopy(this.getRowOtherDft(level, list)) : {}),
-                    _id: this.$ObjectID().str,
-                    level: level,
-                    isLeaf: true,
-                    children: [],
-                    // __old__: false,
-                    __isDefault__: this.isDftSet,
-                    __isRendered__: true,
-                    __isShow__: true,
-                    __isTmpShow__: true,
-                    __isSearchShow__: false,
-                    __isExpand__: false
-                };
-            } else {
-                return {
-                    ...this.$deepCopy(this.selfRowDft),
-                    _id: this.$ObjectID().str,
-                    // __old__: false,
-                    __isDefault__: this.isDftSet,
-                    __isRendered__: true,
-                    __isShow__: true,
-                    __isTmpShow__: true,
-                    __isSearchShow__: false,
-                    __isExpand__: false
-                };
-            }
-        },
         // 整行校验结果
         getRowRuleResult (row, rowIndex) {
             return this.filterColumns.every(column => this.getColRuleResult({ row, rowIndex, column }).bool);
@@ -1362,7 +1347,7 @@ export default {
             column = this.$transformDynamicProperty(column, row, this.parentObj);
 
             // 未触发校验时 不显示错误
-            if ((this.ruleRecordMap[`${row._id}dsh${column._key}`] || {}).showRuleMessage || this.showRuleMessage) {
+            if ((this.ruleRecordMap[this.getMixKey(row, column)] || {}).showRuleMessage || this.showRuleMessage) {
                 // 校验必填不通过 => 校验对比
                 const resultObj = {};
                 this.$getFieldRuleResult(column, row, resultObj) &&
@@ -1378,38 +1363,36 @@ export default {
                 };
             }
         },
-        // 单元格是否显示对比
-        isShowCompare ({ row, rowIndex, column }) {
-            const oldRow = this.compareListData[rowIndex] || {};
-            const curVal = row[column._key];
-            const oldVal = oldRow[column._key];
-
-            return this.useCampare &&
-                ["number"].includes(column._type) &&
-                !(this.$isEmptyData(curVal) && this.$isEmptyData(oldVal)) &&
-                curVal !== oldVal;
-        },
         // 加工单元格对应的配置
         getResetCol ({ row, rowIndex, column }) {
             return {
                 // isShare: this.isShare,
                 ...column,
-                _heightAuto: this.heightAuto
+                _heightAuto: this.heightAuto,
+                ...(
+                    this.noborderColKeys.includes(column._key)
+                        ? { _placeholder: " " }
+                        : {}
+                ),
+                ...(
+                    this.getSelfResetCol
+                        ? this.getSelfResetCol({ row, rowIndex, column })
+                        : {}
+                )
             };
         },
-        // 单元格最终编辑状态
+        // 单元格最终是否可编辑性
         getUnitCanEdit ({ row, rowIndex, column }) {
             return this.getRowCanEdit(row, rowIndex) &&
                 this.getColCanEdit({ row, rowIndex, column }) &&
                 this.$isAdvRelyShow(column, row, this.parentObj, true);
         },
-        // 列本身是否可编辑
+        // 单元格本身是否可编辑性
         getColCanEdit ({ row, rowIndex, column }) {
-            return (column._oldReadonly ? row.__old__ !== true : true) && // 某些列在老数据行里不可编辑
-                (this.getIsDftRow(row) ? !this.dftReadonlyColKeys.includes(column._key) : true) && // 默认行的某列是否可编辑
+            return (this.getIsDftRow(row) ? !this.dftReadonlyColKeys.includes(column._key) : true) && // 默认行的某列是否可编辑
                 (row.__old__ === true ? !this.oldReadonlyColKeys.includes(column._key) : true) && // 老数据行里某些列不可编辑
                 (row.__isQuote__ ? !this.quoteReadonlyColKeys.includes(column._key) : true) && // 引用过来的数据是否可编辑
-                (!this.getTypeColCanEdit || this.getTypeColCanEdit({ row, rowIndex, column })) &&
+                (this.getSelfColCanEdit ? this.getSelfColCanEdit({ row, rowIndex, column }) : true) &&
                 (
                     ["treeTable"].includes(this.inTableType) && ["number", "date"].includes(column._type)
                         ? column._summaryType
@@ -1430,46 +1413,19 @@ export default {
         },
 
         /* ----------- 工具方法 ---------- */
-        // 获取父级行
-        getParentRow (row, tree = []) {
-            if (row.level === 1) {
-                return {
-                    children: tree
-                };
-            } else {
-                let parentRow;
-
-                const loop = (list = []) => {
-                    return list.some(rowItem => {
-                        if (rowItem.level === row.level - 1) {
-                            const isExist = rowItem.children.some(childRowItem => childRowItem._id === row._id);
-                            parentRow = rowItem;
-                            return isExist;
-                        } else {
-                            return loop(rowItem.children);
-                        }
-                    });
-                };
-                loop(tree);
-
-                return parentRow;
-            }
-        },
         // 初始化时 修复数据
         fixRowItem (row, levelNum) {
             if (this.initFlag) {
-                // TODO：修正数据level属性，后期可以删除
-                if (["cascaderTable"].includes(this.controlType)) {
-                    row.level = row.level || levelNum;
-                }
-
                 // 配置端设置的地方，不会运行下面的，因为_default被过滤掉没值，defaultListDataIds就是空的
                 if (row._id) {
                     if (this.defaultListDataIds.includes(row._id)) {
                         row.__isDefault__ = true;
 
                         // 默认数据的id置换一遍，不然每条数据里该列表的id都是重复的
-                        row._id = this.$ObjectID().str;
+                        const oldId = row._id;
+                        const newId = this.$ObjectID().str;
+                        row._id = newId;
+                        this.idRecordMap[newId] = oldId;
                     }
                 } else {
                     row._id = this.$ObjectID().str;
@@ -1528,7 +1484,67 @@ export default {
                     row.__isExpand__ = Object.prototype.hasOwnProperty.call(row, "__isExpand__") ? row.__isExpand__ : false;
                 }
             }
+
+            this.selfFixRowItem && this.selfFixRowItem(row, levelNum);
         },
+        // 生成新的一行数据
+        getNewRowData (level, list) {
+            if (["cascaderTable"].includes(this.controlType)) {
+                return {
+                    ...this.$deepCopy(this.selfRowDft),
+                    ...(this.getSelfNewRowData ? this.$deepCopy(this.getSelfNewRowData(level, list)) : {}),
+                    _id: this.$ObjectID().str,
+                    level: level,
+                    isLeaf: true,
+                    children: [],
+                    // __old__: false,
+                    __isDefault__: this.isDftSet,
+                    __isRendered__: true,
+                    __isShow__: true,
+                    __isTmpShow__: true,
+                    __isSearchShow__: false,
+                    __isExpand__: false
+                };
+            } else {
+                return {
+                    ...this.$deepCopy(this.selfRowDft),
+                    _id: this.$ObjectID().str,
+                    // __old__: false,
+                    __isDefault__: this.isDftSet,
+                    __isRendered__: true,
+                    __isShow__: true,
+                    __isTmpShow__: true,
+                    __isSearchShow__: false,
+                    __isExpand__: false
+                };
+            }
+        },
+        // 获取父级行
+        getParentRow (row, tree = []) {
+            if (row.level === 1) {
+                return {
+                    children: tree
+                };
+            } else {
+                let parentRow;
+
+                const loop = (list = []) => {
+                    return list.some(rowItem => {
+                        if (rowItem.level === row.level - 1) {
+                            const isExist = rowItem.children.some(childRowItem => childRowItem._id === row._id);
+                            parentRow = rowItem;
+                            return isExist;
+                        } else {
+                            return loop(rowItem.children);
+                        }
+                    });
+                };
+                loop(tree);
+
+                return parentRow;
+            }
+        },
+        // 判断是否符合搜索条件，且处理行状态值等
         dealSearchShow (rowItem) {
             if (this.isSearching) {
                 const bool = this.$isAdvRelyAccord(this.finalTableAdvSearch, rowItem);
@@ -1545,6 +1561,34 @@ export default {
             else {
                 return true;
             }
+        },
+        // 单元格是否显示对比
+        isShowCompare ({ row, rowIndex, column }) {
+            const oldRow = this.compareListData[rowIndex] || {};
+            const curVal = row[column._key];
+            const oldVal = oldRow[column._key];
+
+            return this.useCampare &&
+                ["number"].includes(column._type) &&
+                !(this.$isEmptyData(curVal) && this.$isEmptyData(oldVal)) &&
+                curVal !== oldVal;
+        },
+        // 比较两行某列的值是否相等
+        isCompareSame (column, row, compareRow) {
+            const curColKey = column ? column._key : undefined;
+            const curColType = column ? column._type : undefined;
+
+            return this.$isEmptyData(compareRow[curColKey]) && this.$isEmptyData(row[curColKey])
+                ? true
+                : ["users", "departments"].includes(curColType)
+                    ? compareRow[curColKey].length === row[curColKey].length && compareRow[curColKey].every((item, index) => item._key === row[curColKey][index]._key)
+                    : compareRow[curColKey] === row[curColKey];
+        },
+        // 行id+列key组成键
+        getMixKey (row, column, useDsh = true) {
+            return useDsh
+                ? `${row._id}dsh${column._key}`
+                : `${row._id}${column._key}`;
         }
     }
 };

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

@@ -141,6 +141,12 @@ export default {
         //     });
         // },
 
+        selfFixRowItem (row, levelNum) {
+            if (this.initFlag) {
+                // TODO：修正数据level属性，后期可以删除
+                row.level = row.level || levelNum;
+            }
+        },
         // 展开／隐藏节点
         toggleExpand (row, bool = true) {
             this.isExpandAction = true;

package/src/components/small/DshTags.vue

@@ -127,10 +127,16 @@
                     return this.getItemDisabled(item) === false && this.propsObj.closable;
                 },
                 getItemIcon (item) {
-                    return (this.$dataType(item) === "object" ? item.icon || item._icon : undefined) || this.propsObj.icon;
+                    return (
+                        this.$dataType(item) === "object"
+                            ? item.icon || item._icon
+                            : undefined
+                    ) || this.propsObj.icon;
                 },
                 getItemName (item) {
-                    return this.$dataType(item) === "object" ? item.realname || item.full_name || item.name || item._name || item._id : item;
+                    return this.$dataType(item) === "object"
+                        ? item.realname || item.full_name || item.name || item._name || item._id
+                        : item;
                 }
             };
         },

package/src/components/unit/DshListUnit.vue

@@ -30,6 +30,7 @@
                 :parentFormList="parentFormList"
                 :parentObj="parentObj"
                 @blur="blur"
+                @quickChange="quickChange"
                 @change="change"
             ></component>
         </template>

package/src/components/unit/unitMixin.js

@@ -67,6 +67,9 @@ export default {
     },
     created () { },
     methods: {
+        quickChange (...params) {
+            this.$emit("quickChange", this.formItem, ...params);
+        },
         change (...params) {
             this.$emit("change", this.formItem, ...params);
         },

package/src/styles/components/list/BriTable.less

@@ -91,6 +91,32 @@
                             td.ve-table-body-td {
                                 height: 40px;
                                 padding: 4px 16px;
+
+                                &.bri-table-td-noborder {
+                                    .ivu-input,
+                                    textarea.ivu-input,
+                                    .ivu-select-selection {
+                                        min-height: 18px;
+                                        padding: 0px;
+                                        border: none;
+                                        background-color: transparent;
+                                        box-shadow: none;
+                                        line-height: 18px;
+                                    }
+
+                                    .ivu-input-prefix, 
+                                    .ivu-input-suffix {
+                                        width: 0px;
+                                        display: none;
+                                    }
+
+                                    .ivu-date-picker-focused input:not([disabled]) {
+                                        box-shadow: none;
+                                    }
+                                }
+                                &.bri-table-td-bg {
+                                    background-color: #fbfbfb;
+                                }
                             }
                         }
                     }
@@ -224,10 +250,10 @@
             display: none!important;
         }
 
-        &-merge {
-            background-color: #fbfbfb!important;
-
-            textarea.ivu-input {
+        &-noborder {
+            .ivu-input,
+            textarea.ivu-input,
+            .ivu-select-selection {
                 min-height: 18px;
                 padding: 0px;
                 border: none;
@@ -235,6 +261,19 @@
                 box-shadow: none;
                 line-height: 18px;
             }
+
+            .ivu-input-prefix, 
+            .ivu-input-suffix {
+                width: 0px;
+                display: none;
+            }
+            
+            .ivu-date-picker-focused input:not([disabled]) {
+                box-shadow: none;
+            }
+        }
+        &-bg {
+            background-color: #fbfbfb;
         }
     }