bri-components 1.3.91 → 1.3.92
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/components/list/DshCascaderTable.vue +0 -50
- package/src/components/list/DshFlatTable.vue +5 -5
- package/src/components/list/DshTreeTable.vue +2 -2
- package/src/components/list/mixins/DshCascaderTableMixin.js +364 -385
- package/src/components/list/mixins/DshFlatTableMixin.js +11 -49
- package/src/components/list/mixins/DshTreeTableMixin.js +42 -179
- package/src/components/list/mixins/tableBaseMixin.js +291 -126
- package/src/styles/components/list/BriTable.less +44 -0
|
@@ -7,18 +7,15 @@ export default {
|
|
|
7
7
|
},
|
|
8
8
|
computed: {
|
|
9
9
|
allListData () {
|
|
10
|
-
|
|
11
|
-
this.data.forEach(item => {
|
|
12
|
-
!item._id && this.$set(item, "_id", this.$ObjectID().str);
|
|
13
|
-
|
|
10
|
+
this.data.forEach(rowItem => {
|
|
14
11
|
if (this.initFlag) {
|
|
15
|
-
|
|
16
|
-
item.__isDefault__ = item.__isDefault__ === undefined ? this.controlKey === "_default" : item.__isDefault__; // 配置端-默认数据打上标记
|
|
12
|
+
this.fixRowItem(rowItem);
|
|
17
13
|
}
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
14
|
+
|
|
15
|
+
rowItem.__isRendered__ = true;
|
|
16
|
+
rowItem.__isShow__ = true;
|
|
17
|
+
rowItem.__isTmpShow__ = true;
|
|
18
|
+
rowItem.__isSearchShow__ = false;
|
|
22
19
|
});
|
|
23
20
|
|
|
24
21
|
this.initFlag = false;
|
|
@@ -34,7 +31,7 @@ export default {
|
|
|
34
31
|
...obj,
|
|
35
32
|
[column._key]: column._type === "number" && column._summaryType
|
|
36
33
|
? this.$calNumList(
|
|
37
|
-
this.allListData.map(
|
|
34
|
+
this.allListData.map(rowItem => rowItem[column._key]),
|
|
38
35
|
column._summaryType,
|
|
39
36
|
{ ...column, _defaultDigit: 2 }
|
|
40
37
|
)
|
|
@@ -76,43 +73,8 @@ export default {
|
|
|
76
73
|
return [
|
|
77
74
|
h("div", rowIndex + 1),
|
|
78
75
|
|
|
79
|
-
//
|
|
80
|
-
|
|
81
|
-
!this.isSearching &&
|
|
82
|
-
!this.showCreateBtnColKeys.length
|
|
83
|
-
? h("div", {
|
|
84
|
-
style: {
|
|
85
|
-
position: "absolute",
|
|
86
|
-
bottom: "0px",
|
|
87
|
-
right: "0px",
|
|
88
|
-
display: "inline-block",
|
|
89
|
-
width: "16px",
|
|
90
|
-
height: " 16px",
|
|
91
|
-
border: "1px solid #3DB8C5",
|
|
92
|
-
backgroundColor: "#ffffff",
|
|
93
|
-
lineHeight: "12px",
|
|
94
|
-
cursor: "pointer",
|
|
95
|
-
verticalAlign: "middle",
|
|
96
|
-
transition: "color .2s ease-in-out,border-color .2s ease-in-out"
|
|
97
|
-
}
|
|
98
|
-
}, [
|
|
99
|
-
h("Icon", {
|
|
100
|
-
style: {
|
|
101
|
-
fontWeight: "500",
|
|
102
|
-
color: "#3DB8C5"
|
|
103
|
-
},
|
|
104
|
-
props: {
|
|
105
|
-
type: "md-add-circle", // "ios-add"
|
|
106
|
-
size: "14"
|
|
107
|
-
},
|
|
108
|
-
on: {
|
|
109
|
-
click: () => {
|
|
110
|
-
this.$dispatchEvent(this.operationMap.canCreate, row, rowIndex, column);
|
|
111
|
-
}
|
|
112
|
-
}
|
|
113
|
-
})
|
|
114
|
-
])
|
|
115
|
-
: h("span", "")
|
|
76
|
+
// 添加符
|
|
77
|
+
...this.createIconRender(h, { row, rowIndex, column })
|
|
116
78
|
];
|
|
117
79
|
}
|
|
118
80
|
};
|
|
@@ -129,9 +91,9 @@ export default {
|
|
|
129
91
|
const newIndex = newList.findIndex(rowItem => row[col._key] !== rowItem[col._key]);
|
|
130
92
|
row = newList[newIndex - 1];
|
|
131
93
|
|
|
94
|
+
// 当前列是合并列,则该列之前的合并列,要复制这一行对应列的值;当前列是普通列,则所有的合并列不用处理
|
|
132
95
|
const curIndex = this.mergeRowColumns.findIndex(column => col._key === column._key);
|
|
133
96
|
mergeRowData = this.mergeRowColumns.reduce((obj, column, colIndex) => {
|
|
134
|
-
// 该列之前的合并列,要复制这一行对应列的值
|
|
135
97
|
return colIndex < curIndex
|
|
136
98
|
? Object.assign(obj, { [column._key]: row[column._key] })
|
|
137
99
|
: obj;
|
|
@@ -6,9 +6,8 @@ export default {
|
|
|
6
6
|
props: {},
|
|
7
7
|
data () {
|
|
8
8
|
return {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
9
|
+
// 除了__readonly__, __isDefault__, __old__, __isQuote__不处理
|
|
10
|
+
deleteProperties: ["__treeIndex__", "__isExpand__", "__isRendered__", "__isShow__", "__isTmpShow__", "__isSearchShow__"],
|
|
12
11
|
searchMode: "flat" // "flat", "tree"
|
|
13
12
|
};
|
|
14
13
|
},
|
|
@@ -41,15 +40,12 @@ export default {
|
|
|
41
40
|
},
|
|
42
41
|
|
|
43
42
|
allTreeData () {
|
|
44
|
-
// console.log("allTreeData");
|
|
45
43
|
return this.getCalcuedTree(this.data, this.selfColumns);
|
|
46
44
|
},
|
|
47
45
|
allListData () {
|
|
48
|
-
// console.log("allListData");
|
|
49
46
|
return this.$getTreeFlatArr(this.allTreeData);
|
|
50
47
|
},
|
|
51
48
|
footerData () {
|
|
52
|
-
// console.log("footerData");
|
|
53
49
|
return this.isSearching
|
|
54
50
|
? []
|
|
55
51
|
: this.useSummary && this.allListData.length
|
|
@@ -60,8 +56,8 @@ export default {
|
|
|
60
56
|
[column._key]: column._type === "number" && column._summaryType
|
|
61
57
|
? this.$calNumList(
|
|
62
58
|
this.allListData
|
|
63
|
-
.filter(
|
|
64
|
-
.map(
|
|
59
|
+
.filter(rowItem => rowItem.level === 1)
|
|
60
|
+
.map(rowItem => rowItem[column._key]),
|
|
65
61
|
column._summaryType,
|
|
66
62
|
{ ...column, _defaultDigit: 2 }
|
|
67
63
|
)
|
|
@@ -77,40 +73,6 @@ export default {
|
|
|
77
73
|
: [];
|
|
78
74
|
},
|
|
79
75
|
|
|
80
|
-
tablePropsObj () {
|
|
81
|
-
return {
|
|
82
|
-
maxHeight: this.contentHeight,
|
|
83
|
-
// 通过实例方法 hideColumnsByKeys(keys)将列隐藏,通过实例方法 showColumnsByKeys(keys)将隐藏的列显示
|
|
84
|
-
columnHiddenOption: {
|
|
85
|
-
defaultHiddenColumnKeys: [...this.hideColKeys] // 必须这么写,不解构,切换一次隐藏/显示后,hideColKeys会变成空数组
|
|
86
|
-
},
|
|
87
|
-
cellStyleOption: {
|
|
88
|
-
bodyCellClass: ({ row, rowIndex, column }) => {
|
|
89
|
-
return "bri-table-td" +
|
|
90
|
-
`${this.getRowCanEdit(row)
|
|
91
|
-
? " bri-table-td-edit"
|
|
92
|
-
: ""
|
|
93
|
-
}` +
|
|
94
|
-
`${this.isSearching
|
|
95
|
-
? row.__isSearchShow__ === false
|
|
96
|
-
? " bri-table-td-hide"
|
|
97
|
-
: ""
|
|
98
|
-
: row.__isShow__ === true
|
|
99
|
-
? this.isExpandAction
|
|
100
|
-
? " bri-table-td-visible"
|
|
101
|
-
: ""
|
|
102
|
-
: " bri-table-td-hide"
|
|
103
|
-
}` +
|
|
104
|
-
`${["__isExpand__"].includes(column._key)
|
|
105
|
-
? " bri-table-td-expand"
|
|
106
|
-
: ["__index__"].includes(column._key)
|
|
107
|
-
? " bri-table-td-index"
|
|
108
|
-
: ""
|
|
109
|
-
}`;
|
|
110
|
-
}
|
|
111
|
-
}
|
|
112
|
-
};
|
|
113
|
-
},
|
|
114
76
|
showColumns () {
|
|
115
77
|
return [
|
|
116
78
|
...(this.useSelection === true ? [this.selectionColumn] : []),
|
|
@@ -179,81 +141,8 @@ export default {
|
|
|
179
141
|
}
|
|
180
142
|
}, row.__treeIndex__),
|
|
181
143
|
|
|
182
|
-
//
|
|
183
|
-
|
|
184
|
-
!this.isSearching &&
|
|
185
|
-
!this.showCreateBtnColKeys.length
|
|
186
|
-
? h("div", {
|
|
187
|
-
style: {
|
|
188
|
-
position: "absolute",
|
|
189
|
-
bottom: "0px",
|
|
190
|
-
right: row.level < this.maxLevel ? "17px" : "0px",
|
|
191
|
-
display: "inline-block",
|
|
192
|
-
width: "16px",
|
|
193
|
-
height: " 16px",
|
|
194
|
-
border: "1px solid #3DB8C5",
|
|
195
|
-
backgroundColor: "#ffffff",
|
|
196
|
-
lineHeight: "12px",
|
|
197
|
-
cursor: "pointer",
|
|
198
|
-
verticalAlign: "middle",
|
|
199
|
-
transition: "color .2s ease-in-out,border-color .2s ease-in-out"
|
|
200
|
-
}
|
|
201
|
-
}, [
|
|
202
|
-
h("Icon", {
|
|
203
|
-
style: {
|
|
204
|
-
fontWeight: "500",
|
|
205
|
-
color: "#3DB8C5"
|
|
206
|
-
},
|
|
207
|
-
props: {
|
|
208
|
-
type: "md-add-circle",
|
|
209
|
-
size: "14"
|
|
210
|
-
},
|
|
211
|
-
on: {
|
|
212
|
-
click: () => {
|
|
213
|
-
this.$dispatchEvent(this.operationMap.canCreate, row, rowIndex, column);
|
|
214
|
-
}
|
|
215
|
-
}
|
|
216
|
-
})
|
|
217
|
-
])
|
|
218
|
-
: h("span", ""),
|
|
219
|
-
|
|
220
|
-
// 插入一行下级添加符
|
|
221
|
-
(this.operationMap.canCreateChild && this.operationMap.canCreateChild.disabled !== true) &&
|
|
222
|
-
!this.isSearching &&
|
|
223
|
-
row.level < this.maxLevel
|
|
224
|
-
? h("div", {
|
|
225
|
-
style: {
|
|
226
|
-
position: "absolute",
|
|
227
|
-
bottom: "0px",
|
|
228
|
-
right: "0px",
|
|
229
|
-
display: "inline-block",
|
|
230
|
-
width: "16px",
|
|
231
|
-
height: " 16px",
|
|
232
|
-
border: "1px solid #3DB8C5",
|
|
233
|
-
backgroundColor: "#ffffff",
|
|
234
|
-
lineHeight: "12px",
|
|
235
|
-
cursor: "pointer",
|
|
236
|
-
verticalAlign: "middle",
|
|
237
|
-
transition: "color .2s ease-in-out,border-color .2s ease-in-out"
|
|
238
|
-
}
|
|
239
|
-
}, [
|
|
240
|
-
h("Icon", {
|
|
241
|
-
style: {
|
|
242
|
-
fontWeight: "600",
|
|
243
|
-
color: "#3DB8C5"
|
|
244
|
-
},
|
|
245
|
-
props: {
|
|
246
|
-
type: "ios-add",
|
|
247
|
-
size: "14"
|
|
248
|
-
},
|
|
249
|
-
on: {
|
|
250
|
-
click: () => {
|
|
251
|
-
this.$dispatchEvent(this.operationMap.canCreateChild, row, rowIndex);
|
|
252
|
-
}
|
|
253
|
-
}
|
|
254
|
-
})
|
|
255
|
-
])
|
|
256
|
-
: h("span", "")
|
|
144
|
+
// 添加符
|
|
145
|
+
...this.createIconRender(h, { row, rowIndex, column })
|
|
257
146
|
];
|
|
258
147
|
}
|
|
259
148
|
};
|
|
@@ -263,7 +152,6 @@ export default {
|
|
|
263
152
|
methods: {
|
|
264
153
|
// 本身的初始化
|
|
265
154
|
selfReset () {
|
|
266
|
-
this.isExpandAction = false;
|
|
267
155
|
this.searchMode = "flat";
|
|
268
156
|
this.dftAdvSearch = {
|
|
269
157
|
logic: "and",
|
|
@@ -271,16 +159,8 @@ export default {
|
|
|
271
159
|
};
|
|
272
160
|
},
|
|
273
161
|
|
|
274
|
-
// 展开/隐藏节点
|
|
275
|
-
toggleExpand (row, bool = true) {
|
|
276
|
-
this.isExpandAction = true;
|
|
277
|
-
this.$set(row, "__isExpand__", bool);
|
|
278
|
-
|
|
279
|
-
this.toggleDescendantsShow(row, bool);
|
|
280
|
-
},
|
|
281
|
-
|
|
282
162
|
// 点击 -添加一行
|
|
283
|
-
clickCreate (operationItem, row, rowIndex) {
|
|
163
|
+
clickCreate (operationItem, row, rowIndex, col) {
|
|
284
164
|
const newRow = {
|
|
285
165
|
...this.$deepCopy(this.selfRowDefault),
|
|
286
166
|
_id: this.$ObjectID().str,
|
|
@@ -295,7 +175,7 @@ export default {
|
|
|
295
175
|
__isSearchShow__: false
|
|
296
176
|
};
|
|
297
177
|
const list = row
|
|
298
|
-
? this.
|
|
178
|
+
? this.getParentRow(row, this.data).children
|
|
299
179
|
: this.data;
|
|
300
180
|
const newRowIndex = row
|
|
301
181
|
? list.findIndex(rowItem => rowItem._id === row._id) + 1
|
|
@@ -305,7 +185,7 @@ export default {
|
|
|
305
185
|
this.change("createRow", null, newRow, newRowIndex);
|
|
306
186
|
},
|
|
307
187
|
// 点击 -添加子行
|
|
308
|
-
clickCreateChild (operationItem, row, rowIndex) {
|
|
188
|
+
clickCreateChild (operationItem, row, rowIndex, col) {
|
|
309
189
|
const newRow = {
|
|
310
190
|
...this.$deepCopy(this.selfRowDefault),
|
|
311
191
|
_id: this.$ObjectID().str,
|
|
@@ -319,10 +199,13 @@ export default {
|
|
|
319
199
|
__isTmpShow__: false,
|
|
320
200
|
__isSearchShow__: false
|
|
321
201
|
};
|
|
322
|
-
row.children
|
|
202
|
+
const list = row.children;
|
|
203
|
+
const newRowIndex = list.length;
|
|
204
|
+
list.splice(newRowIndex, 0, newRow);
|
|
205
|
+
// 展开子级
|
|
323
206
|
this.toggleExpand(row, true);
|
|
324
207
|
|
|
325
|
-
this.change("
|
|
208
|
+
this.change("createChildRow", null, newRow, newRowIndex);
|
|
326
209
|
},
|
|
327
210
|
// 点击 -删除行
|
|
328
211
|
clickDelete (operationItem, row, rowIndex) {
|
|
@@ -330,9 +213,9 @@ export default {
|
|
|
330
213
|
title: "警告",
|
|
331
214
|
content: "确定删除吗?",
|
|
332
215
|
onOk: () => {
|
|
333
|
-
const
|
|
334
|
-
const index =
|
|
335
|
-
|
|
216
|
+
const parentRow = this.getParentRow(row, this.data);
|
|
217
|
+
const index = parentRow.children.findIndex(childRowItem => childRowItem._id === row._id);
|
|
218
|
+
parentRow.children.splice(index, 1);
|
|
336
219
|
|
|
337
220
|
this.change("deleteRow", null, row, rowIndex);
|
|
338
221
|
}
|
|
@@ -343,7 +226,7 @@ export default {
|
|
|
343
226
|
// 加工树形数据
|
|
344
227
|
getCalcuedTree (treeData = [], cols = []) {
|
|
345
228
|
const loop = (list = [], parentRow, levelNum = 1) =>
|
|
346
|
-
list.forEach(
|
|
229
|
+
list.forEach(rowItem => {
|
|
347
230
|
// 递归到叶子节点前 从上往下执行 要处理的
|
|
348
231
|
cols.reduce((newRow, column) => {
|
|
349
232
|
if (["number", "date"].includes(column._type)) {
|
|
@@ -361,11 +244,11 @@ export default {
|
|
|
361
244
|
}
|
|
362
245
|
|
|
363
246
|
return newRow;
|
|
364
|
-
},
|
|
247
|
+
}, rowItem);
|
|
365
248
|
|
|
366
|
-
if (
|
|
367
|
-
|
|
368
|
-
loop(
|
|
249
|
+
if (rowItem.children && rowItem.children.length) {
|
|
250
|
+
rowItem.isLeaf = false;
|
|
251
|
+
loop(rowItem.children, rowItem, levelNum + 1);
|
|
369
252
|
|
|
370
253
|
// 递归到叶子节点后到 从下往上执行 要处理的(非叶子节点)
|
|
371
254
|
cols.reduce((newRow, column) => {
|
|
@@ -397,9 +280,9 @@ export default {
|
|
|
397
280
|
}
|
|
398
281
|
|
|
399
282
|
return newRow;
|
|
400
|
-
},
|
|
283
|
+
}, rowItem);
|
|
401
284
|
} else {
|
|
402
|
-
|
|
285
|
+
rowItem.isLeaf = true;
|
|
403
286
|
|
|
404
287
|
// 递归到叶子节点后到 从下往上执行 要处理的(叶子节点)
|
|
405
288
|
cols.reduce((newRow, column) => {
|
|
@@ -413,29 +296,27 @@ export default {
|
|
|
413
296
|
}
|
|
414
297
|
|
|
415
298
|
return newRow;
|
|
416
|
-
},
|
|
299
|
+
}, rowItem);
|
|
417
300
|
}
|
|
418
301
|
|
|
419
302
|
if (this.initFlag) {
|
|
420
|
-
|
|
421
|
-
row.level = row.level || levelNum;
|
|
303
|
+
this.fixRowItem(rowItem);
|
|
422
304
|
|
|
423
|
-
//
|
|
305
|
+
// 初次进来把前端存的状态值全部清除
|
|
424
306
|
this.deleteProperties.forEach(property => {
|
|
425
|
-
delete
|
|
307
|
+
delete rowItem[property];
|
|
426
308
|
});
|
|
427
|
-
|
|
428
|
-
//
|
|
429
|
-
// row.__isSearchShow__ = false;
|
|
309
|
+
// rowItem.__isExpand__ = false;
|
|
310
|
+
// rowItem.__isSearchShow__ = false;
|
|
430
311
|
// 第一级的需要显示出来
|
|
431
|
-
if (
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
312
|
+
if (rowItem.level == 1) {
|
|
313
|
+
rowItem.__isRendered__ = true;
|
|
314
|
+
rowItem.__isShow__ = true;
|
|
315
|
+
rowItem.__isTmpShow__ = true;
|
|
435
316
|
} else {
|
|
436
|
-
//
|
|
437
|
-
//
|
|
438
|
-
//
|
|
317
|
+
// rowItem.__isRendered__ = false;
|
|
318
|
+
// rowItem.__isShow__ = false;
|
|
319
|
+
// rowItem.__isTmpShow__ = false;
|
|
439
320
|
}
|
|
440
321
|
}
|
|
441
322
|
});
|
|
@@ -444,30 +325,12 @@ export default {
|
|
|
444
325
|
this.initFlag = false;
|
|
445
326
|
return treeData;
|
|
446
327
|
},
|
|
447
|
-
//
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
children: tree
|
|
452
|
-
};
|
|
453
|
-
} else {
|
|
454
|
-
let parentNode;
|
|
455
|
-
|
|
456
|
-
const loop = (list = []) => {
|
|
457
|
-
return list.some(row => {
|
|
458
|
-
if (row.level === curRow.level - 1) {
|
|
459
|
-
const isExist = row.children.some(childNode => childNode._id === curRow._id);
|
|
460
|
-
parentNode = row;
|
|
461
|
-
return isExist;
|
|
462
|
-
} else {
|
|
463
|
-
return loop(row.children);
|
|
464
|
-
}
|
|
465
|
-
});
|
|
466
|
-
};
|
|
467
|
-
loop(tree);
|
|
328
|
+
// 展开/隐藏节点
|
|
329
|
+
toggleExpand (row, bool = true) {
|
|
330
|
+
this.isExpandAction = true;
|
|
331
|
+
this.$set(row, "__isExpand__", bool);
|
|
468
332
|
|
|
469
|
-
|
|
470
|
-
}
|
|
333
|
+
this.toggleDescendantsShow(row, bool);
|
|
471
334
|
},
|
|
472
335
|
// 切换子孙后代的显示/隐藏
|
|
473
336
|
toggleDescendantsShow (row, bool) {
|