bri-components 1.3.23 → 1.3.25

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.
Files changed (23) hide show
  1. package/package.json +1 -1
  2. package/src/components/controls/base/BriUpload/uploadList.vue +1 -1
  3. package/src/components/controls/base/DshDate/DshDate.vue +6 -2
  4. package/src/components/controls/mixins/controlMixin.js +17 -5
  5. package/src/components/controls/senior/cascaderTable.vue +102 -37
  6. package/src/components/controls/senior/flatTable/flatTable.vue +14 -6
  7. package/src/components/form/DshForm.vue +25 -1
  8. package/src/components/list/BriTable.vue +0 -2
  9. package/src/components/list/DshBox/DshBox.vue +19 -9
  10. package/src/components/list/DshBox/DshCrossTable.vue +9 -8
  11. package/src/components/list/DshBox/DshTable.vue +97 -93
  12. package/src/components/list/DshCascaderTable.vue +17 -2
  13. package/src/components/list/DshFlatTable.vue +5 -274
  14. package/src/components/list/DshTreeTable.vue +217 -0
  15. package/src/components/list/mixins/DshFlatTableMixin.js +18 -5
  16. package/src/components/list/mixins/tableMixin.js +279 -0
  17. package/src/components/unit/DshFormUnit.vue +4 -0
  18. package/src/components/unit/DshListUnit.vue +4 -9
  19. package/src/components/unit/unitMixin.js +20 -0
  20. package/src/index.js +2 -0
  21. package/src/styles/components/list/BriTable.less +10 -2
  22. package/src/styles/global/text.less +1 -1
  23. package/src/styles/reset-iview-other.less +6 -4
package/src/components/list/DshBox/DshTable.vue CHANGED
@@ -30,25 +30,29 @@
30
30
  return [];
31
31
  }
32
32
  },
33
- fixTitle: {
34
- type: Boolean,
35
- default: true
33
+ ownColumns: {
34
+ type: Array,
35
+ default () {
36
+ return [];
37
+ }
36
38
  },
37
- ownColumns: Array,
38
39
  operationList: {
39
40
  type: Array,
40
41
  default () {
41
42
  return [];
42
43
  }
43
44
  },
44
-
45
45
  propsObj: {
46
46
  type: Object,
47
47
  default () {
48
48
  return {};
49
49
  }
50
50
  },
51
- isLoading: Boolean,
51
+
52
+ isLoading: {
53
+ type: Boolean,
54
+ default: false
55
+ },
52
56
  noDataText: String
53
57
  },
54
58
  data () {
@@ -60,6 +64,9 @@
60
64
  multiple () {
61
65
  return !!this.propsObj.multiple;
62
66
  },
67
+ maxBtnNum () {
68
+ return Math.max(this.propsObj.maxBtnNum || 4, 2);
69
+ },
63
70
  selfOperationList () {
64
71
  const getOperationItemMaxWidth = (operationItem) => {
65
72
  // 字宽
@@ -82,96 +89,93 @@
82
89
  };
83
90
  });
84
91
  },
85
- selfColumns () {
86
- if (this.ownColumns) {
87
- return this.ownColumns;
88
- } else {
89
- const maxBtnNum = Math.max(this.propsObj.maxBtnNum || 4, 2);
90
-
91
- return [
92
- ...(
93
- this.multiple
94
- ? [{
95
- field: "selection",
96
- key: "selection",
97
- type: "checkbox",
98
- width: 66,
99
- align: "center",
100
- fixed: "left"
101
- }]
102
- : []
103
- ),
104
- {
105
- title: "序号",
106
- field: "custome",
107
- key: "customes",
108
- width: 78,
109
- align: "center",
110
- fixed: "left",
111
- renderBodyCell: ({ row, column, rowIndex }, h) => {
112
- return ++rowIndex;
113
- }
114
- },
115
92
 
93
+ selfColumns () {
94
+ return this.ownColumns.length
95
+ ? this.ownColumns
96
+ : [
97
+ ...(this.multiple ? [this.selectionColumn] : []),
98
+ this.indexColumn,
116
99
  ...this.columns,
100
+ ...(this.selfOperationList.length ? [this.operationColumn] : [])
101
+ ];
102
+ },
103
+ selectionColumn () {
104
+ return {
105
+ _key: "__selection__",
106
+ key: "__selection__",
107
+ field: "__selection__",
108
+ type: "checkbox", // 内置类型
109
+ width: 66,
110
+ align: "center",
111
+ fixed: "left"
112
+ };
113
+ },
114
+ indexColumn () {
115
+ return {
116
+ title: "序号",
117
+ _key: "__index__",
118
+ key: "__index__",
119
+ field: "__index__",
120
+ width: 78,
121
+ align: "center",
122
+ fixed: "left",
123
+ renderBodyCell: ({ row, column, rowIndex }, h) => {
124
+ return ++rowIndex;
125
+ }
126
+ };
127
+ },
128
+ operationColumn () {
129
+ return {
130
+ title: "操作",
131
+ _key: "__operation__",
132
+ key: "__operation__",
133
+ field: "__operation__",
134
+ align: "center",
135
+ fixed: "right",
136
+ width: Math.max(
137
+ // 漏在外部按钮的宽度
138
+ this.selfOperationList
139
+ .slice(0, this.selfOperationList.length > this.maxBtnNum ? this.maxBtnNum - 1 : this.selfOperationList.length)
140
+ .reduce((total, operationItem) => total + operationItem.width + 9, 0) +
141
+ (this.selfOperationList.length > this.maxBtnNum ? 70 : 0) + // 出现更多按钮的宽度
142
+ (this.selfOperationList.length > 0 ? 40 : 0) + // 操作列的padding
143
+ 4 // 留出4px空间，避免麻烦问题
144
+ , 80
145
+ ),
146
+ renderBodyCell: (params, h) => {
147
+ const totalOperationList = this.selfOperationList.map(operationItem => {
148
+ return {
149
+ ...operationItem,
150
+ ...(
151
+ operationItem.operationFunc
152
+ ? operationItem.operationFunc(operationItem, params.row, params.index)
153
+ : {}
154
+ )
155
+ };
156
+ });
117
157
 
118
- ...(
119
- this.selfOperationList.length
120
- ? [
121
- {
122
- title: "操作",
123
- field: "operation",
124
- key: "operation",
125
- align: "center",
126
- fixed: "right",
127
- width: Math.max(
128
- // 漏在外部按钮的宽度
129
- this.selfOperationList
130
- .slice(0, this.selfOperationList.length > maxBtnNum ? maxBtnNum - 1 : this.selfOperationList.length)
131
- .reduce((total, operationItem) => total + operationItem.width + 9, 0) +
132
- (this.selfOperationList.length > maxBtnNum ? 70 : 0) + // 出现更多按钮的宽度
133
- (this.selfOperationList.length > 0 ? 40 : 0) + // 操作列的padding
134
- 4 // 留出4px空间，避免麻烦问题
135
- , 80
136
- ),
137
- renderBodyCell: (params, h) => {
138
- const totalOperationList = this.selfOperationList.map(operationItem => {
139
- return {
140
- ...operationItem,
141
- ...(
142
- operationItem.operationFunc
143
- ? operationItem.operationFunc(operationItem, params.row, params.index)
144
- : {}
145
- )
146
- };
147
- });
148
-
149
- // TODO: 注意此处totalOperationList用的一定是表格行显示最多的操作按钮数组，有改动注意看此备注！！！
150
- return h("dsh-buttons", {
151
- class: "bri-table-td-operation",
152
- props: {
153
- list: totalOperationList,
154
- maxFlatNum: maxBtnNum - 1,
155
- itemClass: "bri-table-td-operation-btn"
156
- },
157
- on: {
158
- click: (operationItem) => {
159
- this.$dshEmit(operationItem, params.row, params.row);
160
- }
161
- },
162
- nativeOn: {
163
- click: (e) => {
164
- e.stopPropagation();
165
- }
166
- }
167
- });
168
- }
169
- }
170
- ]
171
- : []
172
- )
173
- ];
174
- }
158
+ // TODO: 注意此处totalOperationList用的一定是表格行显示最多的操作按钮数组，有改动注意看此备注！！！
159
+ return h("dsh-buttons", {
160
+ class: "bri-table-td-operation",
161
+ props: {
162
+ list: totalOperationList,
163
+ maxFlatNum: this.maxBtnNum - 1,
164
+ itemClass: "bri-table-td-operation-btn"
165
+ },
166
+ on: {
167
+ click: (operationItem) => {
168
+ this.$dshEmit(operationItem, params.row, params.row);
169
+ }
170
+ },
171
+ nativeOn: {
172
+ click: (e) => {
173
+ e.stopPropagation();
174
+ }
175
+ }
176
+ });
177
+ }
178
+ };
175
179
  }
176
180
  },
177
181
  created () {
package/src/components/list/DshCascaderTable.vue CHANGED
@@ -155,13 +155,16 @@
155
155
  >
156
156
  <dsh-list-unit
157
157
  :canEdit="canEdit"
158
- :rowIndex="rowIndex"
159
158
  :formData="row[col.nodeKey]"
160
159
  :formItem="{
161
160
  ...col,
162
161
  _heightAuto: heightAuto
163
162
  }"
164
163
  :allFormList="subColumns"
164
+ :rowIndex="rowIndex"
165
+ :parentListData="rows"
166
+ :parentFormList="parentFormList"
167
+ :parentObj="parentObj"
165
168
  @blur="controlBlur(null, col, row[col.nodeKey], arguments)"
166
169
  @change="$dispatchEvent(operationMap.changeVal, col, row[col.nodeKey], arguments)"
167
170
  ></dsh-list-unit>
@@ -234,12 +237,24 @@
234
237
  return [];
235
238
  }
236
239
  },
237
-
238
240
  propsObj: {
239
241
  type: Object,
240
242
  default () {
241
243
  return {};
242
244
  }
245
+ },
246
+
247
+ parentFormList: {
248
+ type: Array,
249
+ default () {
250
+ return [];
251
+ }
252
+ },
253
+ parentObj: {
254
+ type: Object,
255
+ default () {
256
+ return {};
257
+ }
243
258
  }
244
259
  },
245
260
  data () {
package/src/components/list/DshFlatTable.vue CHANGED
@@ -21,12 +21,14 @@
21
21
 
22
22
  <script>
23
23
  import DshFlatTableMixin from "./mixins/DshFlatTableMixin.js";
24
+ import tableMixin from "./mixins/tableMixin.js";
24
25
  import DshListUnit from "../unit/DshListUnit.vue";
25
26
 
26
27
  export default {
27
28
  name: "DshFlatTable",
28
29
  mixins: [
29
- DshFlatTableMixin
30
+ DshFlatTableMixin,
31
+ tableMixin
30
32
  ],
31
33
  components: {
32
34
  DshListUnit
@@ -35,280 +37,9 @@
35
37
  data () {
36
38
  return {};
37
39
  },
38
- computed: {
39
- footerData () {
40
- if (this.useSummary && this.listData.length) {
41
- return [
42
- this.filterColumns.reduce((obj, col) => {
43
- return {
44
- ...obj,
45
- [col._key]: col._type === "number"
46
- ? this.$calNumList(this.listData.map(item => item[col._key]), col._summaryType, { ...col, _defaultDigit: 2 })
47
- : obj[col._key]
48
- };
49
- }, {
50
- _id: this.$ObjectID().str,
51
- custome: "汇总"
52
- })
53
- ];
54
- } else {
55
- return [];
56
- }
57
- },
58
-
59
- tablePropsObj () {
60
- return {
61
- maxHeight: this.contentHeight,
62
- cellStyleOption: {
63
- bodyCellClass: ({row, column, rowIndex}) => {
64
- return `bri-table-td ${this.canEdit ? "bri-table-td-edit" : "bri-table-td-show"}`;
65
- }
66
- }
67
- };
68
- },
69
- selfPropsObj () {
70
- return {
71
- ...this.commonPropsObj
72
- };
73
- },
74
- showRequired () {
75
- return this.selfPropsObj._showRequired;
76
- },
77
- showDescription () {
78
- return this.selfPropsObj._showDescription;
79
- },
80
- headHeightAuto () {
81
- return this.selfPropsObj._headHeightAuto;
82
- },
83
- heightAuto () {
84
- return this.selfPropsObj._heightAuto;
85
- },
86
-
87
- showColumns () {
88
- const operationList = this.$getOperationList(["canDelete"]);
89
-
90
- return [
91
- ...(
92
- this.useSelection === true
93
- ? [
94
- {
95
- field: "selection",
96
- key: "selection",
97
- type: "checkbox",
98
- width: 66,
99
- align: "center",
100
- fixed: "left"
101
- }
102
- ]
103
- : []
104
- ),
105
-
106
- ...(
107
- this.useIndex === true
108
- ? [
109
- {
110
- title: "序号",
111
- field: "custome",
112
- key: "customes",
113
- width: 76,
114
- align: "center",
115
- fixed: "left",
116
- renderBodyCell: ({ rowIndex }) => ++rowIndex
117
- }
118
- ]
119
- : []
120
- ),
121
-
122
- ...this.$transformToColumns(
123
- this.filterColumns.map(colItem => ({
124
- filter: undefined,
125
- sortBy: undefined,
126
- renderBodyCell: ({ row, column, rowIndex }, h) => {
127
- column = this.$transformFieldProperty(column, row, this.parentObj);
128
- column = this.resetCol(column, row);
129
- const unitCanEdit = this.getUnitCanEdit(column, row);
130
-
131
- return [
132
- this.isShowCompare(column, row, this.oldListData[rowIndex])
133
- ? h("Tooltip", {
134
- style: {
135
- width: "100%"
136
- },
137
- props: {
138
- content: this.$isEmptyData(this.oldListData[rowIndex][column._key])
139
- ? ""
140
- : this.oldListData[rowIndex][column._key],
141
- transfer: true,
142
- maxWidth: 200,
143
- placement: "top"
144
- },
145
- scopedSlots: {
146
- default: props => h("dsh-list-unit", {
147
- props: {
148
- canEdit: unitCanEdit,
149
- formData: row,
150
- formItem: column,
151
- rowIndex: rowIndex,
152
- allFormList: this.columns,
153
- parentListData: this.listData
154
- },
155
- on: {
156
- blur: () => this.controlBlur(null, column, row, arguments),
157
- change: () => this.$dispatchEvent(this.operationMap.changeVal, column, row, rowIndex, arguments)
158
- }
159
- })
160
- }
161
- })
162
- : h("dsh-list-unit", {
163
- props: {
164
- canEdit: unitCanEdit,
165
- formData: row,
166
- formItem: column,
167
- rowIndex: rowIndex,
168
- allFormList: this.columns,
169
- parentListData: this.listData
170
- },
171
- on: {
172
- blur: () => this.controlBlur(null, column, row, arguments),
173
- change: () => this.$dispatchEvent(this.operationMap.changeVal, column, row, rowIndex, arguments)
174
- }
175
- }),
176
-
177
- !this.getColRuleResult(column, row).bool
178
- ? h("span", {
179
- class: "bri-table-td-tip"
180
- }, this.getColRuleResult(column, row).message)
181
- : undefined
182
- ];
183
- },
184
- renderHeaderCell: ({ column }, h) => {
185
- column = this.$transformFieldProperty(column, undefined, this.parentObj);
186
-
187
- return this.$getHeadRender(h, column, {
188
- showRequired: this.showRequired,
189
- showDescription: this.showDescription,
190
- headHeightAuto: this.headHeightAuto
191
- });
192
- },
193
- ...colItem
194
- }))
195
- ),
196
-
197
- ...(
198
- this.canEdit && operationList.length
199
- ? [
200
- {
201
- title: "操作",
202
- field: "operation",
203
- key: "operation",
204
- align: "center",
205
- fixed: "right",
206
- width: 100,
207
- renderBodyCell: (params, h) => {
208
- return h("dsh-buttons", {
209
- props: {
210
- list: operationList.map(btnItem => ({
211
- ...btnItem,
212
- disabled: this.disabledOldDataRow && !params.row.__isCreate__
213
- }))
214
- },
215
- on: {
216
- click: (operationItem) => {
217
- this.$dispatchEvent(operationItem, params.row, params.rowIndex, this.listData);
218
- }
219
- }
220
- });
221
- }
222
- }
223
- ]
224
- : []
225
- )
226
- ];
227
- },
228
-
229
- allOperationMap () {
230
- return {
231
- canCreate: {
232
- name: "添加一行",
233
- type: "canCreate",
234
- size: "default",
235
- long: true,
236
- disabled: !!this.disabledCreateBtn,
237
- event: "clickCreate",
238
- btnType: "default"
239
- },
240
- canDelete: {
241
- name: "删除",
242
- type: "canDelete",
243
- btnType: "errorText",
244
- icon: "ios-trash-outline",
245
- size: "small",
246
- disabled: false,
247
- event: "clickDelete"
248
- },
249
- // expand: {
250
- // name: "展开",
251
- // type: "expand",
252
- // event: "clickExpand"
253
- // },
254
- changeVal: {
255
- name: "改变输入框值",
256
- type: "changeVal",
257
- event: "changeVal"
258
- }
259
- };
260
- }
261
- },
40
+ computed: {},
262
41
  created () {},
263
- methods: {
264
- // 点击 -添加行
265
- clickCreate (operationItem, row, index, list) {
266
- const newRow = {
267
- ...this.$deepCopy(this.selfRowDefault),
268
- __isCreate__: true,
269
- _id: this.$ObjectID().str
270
- };
271
- const newRowIndex = index == null ? list.length : index + 1;
272
- list.splice(newRowIndex, 0, newRow);
273
- this.$forceUpdate(); // 自定义页中点击添加一行没有更新页面
274
-
275
- this.change("createRow", null, newRow, newRowIndex);
276
- },
277
- changeSelect (list) {
278
- this.$emit("changeSelect", list);
279
- },
280
- // 表单控件值改变
281
- changeVal (operationItem, col, row, rowIndex, params) {
282
- this.$set(this.ruleRecordMap, `${row._id}dsh${col._key}`, { showRuleMessage: true });
283
- this.change("changeVal", col, row, rowIndex, ...params);
284
- },
285
- // 表单控件失去焦点
286
- controlBlur (operationItem, col, row, params) {
287
- this.$set(this.ruleRecordMap, `${row._id}dsh${col._key}`, { showRuleMessage: true });
288
- },
289
-
290
- resetCol (col, row) {
291
- let resetMap = {
292
- select: {
293
- _optionKind: "dropdown"
294
- },
295
- checkbox: {
296
- _optionKind: "dropdown"
297
- }
298
- };
299
- return {
300
- ...col,
301
- ...(resetMap[col._type] || {}),
302
- // isShare: this.isShare,
303
- _heightAuto: this.heightAuto
304
- };
305
- },
306
- getUnitCanEdit (col, row) {
307
- return this.getRowCanEdit(row) &&
308
- this.getColCanEdit(col, row) &&
309
- this.$isAdvRelyShow(col, row, this.parentObj, true);
310
- }
311
- }
42
+ methods: {}
312
43
  };
313
44
  </script>
314
45