bri-components 1.2.55 → 1.2.57

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 (10) hide show
  1. package/package.json +1 -1
  2. package/src/components/controls/base/DshCascader/DshCascader.vue +40 -45
  3. package/src/components/controls/base/DshCascader/cascaderMixin.js +4 -2
  4. package/src/components/controls/base/DshCascader/cascaderModal.vue +14 -12
  5. package/src/components/controls/base/DshCascader/cascaderPicker.vue +28 -28
  6. package/src/components/controls/base/DshCascader/cascaderPickerMixin.js +3 -3
  7. package/src/components/controls/controlMixin.js +4 -1
  8. package/src/components/controls/senior/flatTable.vue +9 -3
  9. package/src/components/controls/senior/flatTableImportModal.vue +9 -37
  10. package/src/components/unit/DshFormUnit.vue +5 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "bri-components",
3
- "version": "1.2.55",
3
+ "version": "1.2.57",
4
4
  "author": "dengshanghui",
5
5
  "description": "a component lib for vue project",
6
6
  "main": "src/index.js",
package/src/components/controls/base/DshCascader/DshCascader.vue CHANGED
@@ -37,8 +37,8 @@
37
37
  <dsh-control-input
38
38
  :class="commonClass"
39
39
  :value="curValName"
40
- :disabled="selfPropsObj._disabled"
41
- :propsObj="selfPropsObj"
40
+ :disabled="inputPropsObj._disabled"
41
+ :propsObj="inputPropsObj"
42
42
  @clear="clickClear"
43
43
  ></dsh-control-input>
44
44
  </cascader-modal>
@@ -56,8 +56,8 @@
56
56
  <dsh-control-input
57
57
  :class="commonClass"
58
58
  :value="curValName"
59
- :disabled="selfPropsObj._disabled"
60
- :propsObj="selfPropsObj"
59
+ :disabled="inputPropsObj._disabled"
60
+ :propsObj="inputPropsObj"
61
61
  @clear="clickClear"
62
62
  ></dsh-control-input>
63
63
  </cascader-picker>
@@ -103,7 +103,7 @@
103
103
  :disabled="selfPropsObj._disabled"
104
104
  :clearable="selfPropsObj._clearable"
105
105
  :size="selfPropsObj._size"
106
- :filterable="false"
106
+ :filterable="filterable"
107
107
  :render-format="renderFormat"
108
108
  :change-on-select="changeOnSelect"
109
109
  :transfer="selfPropsObj._transfer"
@@ -111,16 +111,14 @@
111
111
  :load-data="loadData"
112
112
  @on-visible-change="changeMulVisible"
113
113
  @on-change="changeMulSelect"
114
- @click.native="clickCascader"
115
114
  >
116
115
  <dsh-control-input
117
116
  :class="commonClass"
118
117
  :value="curValNameList"
119
- :disabled="selfPropsObj._disabled"
120
- :propsObj="selfPropsObj"
118
+ :disabled="inputPropsObj._disabled"
119
+ :propsObj="inputPropsObj"
121
120
  @deleteItem="clickDeleteItem"
122
121
  @clear="clickClear"
123
- @click.native="clickInput"
124
122
  ></dsh-control-input>
125
123
  </Cascader>
126
124
  </template>
@@ -136,8 +134,8 @@
136
134
  <dsh-control-input
137
135
  :class="commonClass"
138
136
  :value="curValNameList"
139
- :disabled="selfPropsObj._disabled"
140
- :propsObj="selfPropsObj"
137
+ :disabled="inputPropsObj._disabled"
138
+ :propsObj="inputPropsObj"
141
139
  @deleteItem="clickDeleteItem"
142
140
  @clear="clickClear"
143
141
  ></dsh-control-input>
@@ -155,8 +153,8 @@
155
153
  <dsh-control-input
156
154
  :class="commonClass"
157
155
  :value="curValNameList"
158
- :disabled="selfPropsObj._disabled"
159
- :propsObj="selfPropsObj"
156
+ :disabled="inputPropsObj._disabled"
157
+ :propsObj="inputPropsObj"
160
158
  @deleteItem="clickDeleteItem"
161
159
  @clear="clickClear"
162
160
  ></dsh-control-input>
@@ -217,8 +215,8 @@
217
215
  props: {},
218
216
  data () {
219
217
  return {
220
- renderAll: false,
221
- clickFlag: true,
218
+ // renderAll: false,
219
+ // clickFlag: true,
222
220
  isVisible: false,
223
221
  curSelectVal: []
224
222
  };
@@ -226,9 +224,9 @@
226
224
  computed: {
227
225
  selfPropsObj () {
228
226
  return {
229
- _icon: this.isVisible ? "ios-arrow-up" : "ios-arrow-down",
230
227
  _showMode: "default", // 只有单选模式有效，值为"default", "custom", "simple"
231
228
  _transfer: true,
229
+ _transferClassName: "",
232
230
 
233
231
  ...this.basePropsObj,
234
232
 
@@ -238,6 +236,12 @@
238
236
  : this.basePropsObj._filterable
239
237
  };
240
238
  },
239
+ inputPropsObj () {
240
+ return {
241
+ _icon: this.isVisible ? "ios-arrow-up" : "ios-arrow-down",
242
+ ...this.selfPropsObj
243
+ };
244
+ },
241
245
 
242
246
  renderCascaderData () {
243
247
  return this.renderAll
@@ -255,42 +259,33 @@
255
259
  /* --------- 简洁方式 ------- */
256
260
  // 动态加载数据
257
261
  loadData (treeItem, cb) {
258
- const list = this.$getTreeLinealDatas(treeItem.keys, this.cascaderData, undefined, this.saveKey);
259
- const lastOption = list[list.length - 1];
260
-
261
- treeItem.children = lastOption
262
- ? lastOption.children.map(item =>
263
- ({
264
- ...item,
265
- children: []
266
- })
267
- )
268
- : [];
262
+ const linealDatas = this.$getTreeLinealDatas(treeItem.keys, this.cascaderData, undefined, this.saveKey);
263
+ const lastData = linealDatas.slice(-1)[0];
264
+ treeItem.children = lastData.children.map(item =>
265
+ ({
266
+ ...item,
267
+ children: []
268
+ })
269
+ );
269
270
 
270
271
  cb();
271
272
  },
272
273
  clickCascader () {
273
- if (
274
- !this.selfPropsObj._disabled &&
275
- this.filterable === true &&
276
- this.renderAll === false &&
277
- this.clickFlag === true
278
- ) {
279
- this.clickFlag = false; // 这个处理其实觉大概率没必要，有没有不受影响
280
- setTimeout(() => {
281
- this.renderAll = true;
282
- }, 0);
283
- }
274
+ // if (
275
+ // !this.selfPropsObj._disabled &&
276
+ // this.filterable === true &&
277
+ // this.renderAll === false &&
278
+ // this.clickFlag === true
279
+ // ) {
280
+ // this.clickFlag = false; // 这个处理其实觉大概率没必要，有没有不受影响
281
+ // setTimeout(() => {
282
+ // this.renderAll = true;
283
+ // }, 0);
284
+ // }
284
285
  },
285
286
  // 简洁方式-单选 -展开和关闭弹窗时触发
286
287
  changeVisible (bool) {
287
- if (bool) {
288
- this.isVisible = bool;
289
- } else {
290
- setTimeout(() => {
291
- this.isVisible = bool;
292
- }, 0);
293
- }
288
+ this.isVisible = bool;
294
289
  },
295
290
  // 简洁方式-单选 -选项变化
296
291
  changeSelect (value, selectedOptions) {
package/src/components/controls/base/DshCascader/cascaderMixin.js CHANGED
@@ -17,7 +17,6 @@ export default {
17
17
  _showMode: "default",
18
18
  _filterable: true,
19
19
  _cascaderFilterVals: [], // 过滤级联数据，只保留的数组
20
- _changeOnSelect: false, // 每级菜单都可取值
21
20
  _renderFormat: (labels) => labels.join(_joinSymbol),
22
21
 
23
22
  ...this.propsObj,
@@ -26,6 +25,9 @@ export default {
26
25
  _saveKey: this.propsObj._saveKey || "_key",
27
26
  _valueKey: this.propsObj._valueKey || "code",
28
27
  _nameKey: this.propsObj._nameKey || "name",
28
+ _changeOnSelect: this.isOnSearch
29
+ ? true
30
+ : this.propsObj._changeOnSelect == undefined ? false : this.propsObj._changeOnSelect, // 每级菜单都可取值 -默认取末级
29
31
  _joinSymbol: _joinSymbol // 级联拼接符
30
32
  };
31
33
  },
@@ -42,7 +44,7 @@ export default {
42
44
  return this.selfPropsObj._cascaderFilterVals;
43
45
  },
44
46
  changeOnSelect () {
45
- return this.isOnSearch ? true : this.selfPropsObj._changeOnSelect;
47
+ return this.selfPropsObj._changeOnSelect;
46
48
  },
47
49
  saveKey () {
48
50
  return this.selfPropsObj._saveKey;
package/src/components/controls/base/DshCascader/cascaderModal.vue CHANGED
@@ -38,7 +38,7 @@
38
38
  <!-- 模式切换 -->
39
39
  <template>
40
40
  <div
41
- v-if="useMode"
41
+ v-if="canUseModeSwitch"
42
42
  class="mode"
43
43
  @click="showMode = showMode === 'default' ? 'flat' : 'default'"
44
44
  >
@@ -75,27 +75,27 @@
75
75
 
76
76
  <div class="wrap-content">
77
77
  <!-- 左 -->
78
- <div class="wrap-content-left">
78
+ <div class="wrap-content-list">
79
79
  <template v-if="showTreeData.length">
80
80
  <!-- 拍平方式 -->
81
81
  <div v-if="useFlatMode">
82
82
  <div
83
- v-for="dataItem in showFlatData"
84
- :key="dataItem[valueKey]"
83
+ v-for="nodeItem in showFlatData"
84
+ :key="nodeItem[valueKey]"
85
85
  :class="{
86
86
  'item': true,
87
- 'item-active': selectedLastOption && dataItem[valueKey] === selectedLastOption[valueKey],
88
- 'item-disabled': dataItem.disabled
87
+ 'item-active': selectedLastOption && nodeItem[valueKey] === selectedLastOption[valueKey],
88
+ 'item-disabled': nodeItem.disabled
89
89
  }"
90
- @click="clickItem(dataItem)"
90
+ @click="clickItem(nodeItem)"
91
91
  >
92
92
  <span class="item-name">
93
- {{ dataItem[nameKey] }}
93
+ {{ nodeItem[nameKey] }}
94
94
  </span>
95
95
 
96
96
  <span class="item-icon">
97
97
  <dsh-icons :list="[{
98
- icon: selectedLastOption && dataItem[valueKey] === selectedLastOption[valueKey]
98
+ icon: selectedLastOption && nodeItem[valueKey] === selectedLastOption[valueKey]
99
99
  ? 'md-checkmark'
100
100
  : ''
101
101
  }]" />
@@ -113,7 +113,7 @@
113
113
  <!-- 无数据 -->
114
114
  <div
115
115
  v-else
116
- class="wrap-content-left-nodata"
116
+ class="wrap-content-list-nodata"
117
117
  >
118
118
  暂无可用的数据……
119
119
  </div>
@@ -153,7 +153,8 @@
153
153
  computed: {
154
154
  modalPropsObj () {
155
155
  return {
156
- title: this.selfPropsObj._name
156
+ title: this.selfPropsObj._name,
157
+ clasName: this.selfPropsObj._transferClassName
157
158
  };
158
159
  },
159
160
 
@@ -206,6 +207,7 @@
206
207
 
207
208
  search () {
208
209
  this.selectedValue = [];
210
+ this.showMode = "default";
209
211
  },
210
212
  clickItemCb (node) {
211
213
  this.dealDescription();
@@ -290,7 +292,7 @@
290
292
  border: 1px solid #E5E5E5;
291
293
  display: flex;
292
294
 
293
- &-left {
295
+ &-list {
294
296
  flex: 1;
295
297
  min-width: 0px;
296
298
  padding: 5px 10px;
package/src/components/controls/base/DshCascader/cascaderPicker.vue CHANGED
@@ -2,15 +2,16 @@
2
2
  <div class="cascaderPicker">
3
3
  <Dropdown
4
4
  style="width: 100%;"
5
+ v-clickoutside="clickCancel"
5
6
  trigger="custom"
6
7
  :visible="showModal"
7
8
  :placement="placement"
8
9
  :transfer="true"
9
- transfer-class-name="cascaderPicker-down"
10
+ :transfer-class-name="`cascaderPicker-down ${selfPropsObj._transferClassName}`"
10
11
  :stop-propagation="true"
11
12
  :events-enabled="true"
12
13
  >
13
- <div @click.stop="clickInput">
14
+ <div @click="clickInput">
14
15
  <slot>
15
16
  <Input
16
17
  v-model="inputStr"
@@ -23,10 +24,11 @@
23
24
  </slot>
24
25
  </div>
25
26
 
26
- <!-- 下拉面板 -->
27
+ <!-- 下拉面板 click.stop目的：slot插槽里的会渲染到body下，点击此面板时，click事件会被Dropdown捕捉到，被当成外部点击事件，用stop阻止住 -->
27
28
  <div
28
29
  slot="list"
29
30
  class="wrap"
31
+ @click.stop="0"
30
32
  >
31
33
  <!-- 头部 -->
32
34
  <div class="wrap-header">
@@ -47,7 +49,7 @@
47
49
  <!-- 模式切换 -->
48
50
  <template>
49
51
  <div
50
- v-if="useMode"
52
+ v-if="canUseModeSwitch"
51
53
  class="mode"
52
54
  @click="showMode = showMode === 'default' ? 'flat' : 'default'"
53
55
  >
@@ -105,67 +107,64 @@
105
107
  <!-- 列表 -->
106
108
  <div class="wrap-content-list">
107
109
  <!-- 有数据 -->
108
- <DropdownMenu
110
+ <div
109
111
  v-if="showTreeData.length"
110
112
  class="wrap-content-list-menu"
111
113
  >
112
114
  <!-- 拍平方式 -->
113
115
  <template v-if="useFlatMode">
114
- <DropdownItem
115
- v-for="dataItem in showFlatData"
116
- :key="dataItem[valueKey]"
116
+ <div
117
+ v-for="nodeItem in showFlatData"
118
+ :key="nodeItem[valueKey]"
117
119
  :class="{
118
120
  'item': true,
119
- 'item-active': selectedLastOption && dataItem[valueKey] === selectedLastOption[valueKey],
120
- 'item-disabled': dataItem.disabled
121
+ 'item-active': selectedLastOption && nodeItem[valueKey] === selectedLastOption[valueKey],
122
+ 'item-disabled': nodeItem.disabled
121
123
  }"
122
- :name="dataItem[valueKey]"
123
- :disabled="dataItem.disabled"
124
- @click.native.stop="clickItem(dataItem)"
124
+ @click="clickItem(nodeItem)"
125
125
  >
126
126
  <span class="item-name">
127
- {{ dataItem[nameKey] }}
127
+ {{ nodeItem[nameKey] }}
128
128
  </span>
129
129
 
130
130
  <span class="item-icon">
131
131
  <dsh-icons :list="[{
132
- icon: selectedLastOption && dataItem[valueKey] === selectedLastOption[valueKey]
132
+ icon: selectedLastOption && nodeItem[valueKey] === selectedLastOption[valueKey]
133
133
  ? 'md-checkmark'
134
134
  : ''
135
135
  }]" />
136
136
  </span>
137
- </DropdownItem>
137
+ </div>
138
138
  </template>
139
139
 
140
140
  <!-- 层级方式 -->
141
141
  <template v-else>
142
- <DropdownItem
143
- v-for="dataItem in curSelectedLinealData.data"
144
- :key="dataItem[valueKey]"
142
+ <div
143
+ v-for="nodeItem in curSelectedLinealData.data"
144
+ :key="nodeItem[valueKey]"
145
145
  :class="{
146
146
  'item': true,
147
- 'item-active': dataItem[valueKey] === curSelectedLinealData[valueKey],
148
- 'item-disabled': dataItem.disabled
147
+ 'item-active': nodeItem[valueKey] === curSelectedLinealData[valueKey],
148
+ 'item-disabled': nodeItem.disabled
149
149
  }"
150
- :name="dataItem[valueKey]"
151
- @click.native.stop="clickItem(dataItem)"
150
+ @click="clickItem(nodeItem)"
152
151
  >
153
152
  <span class="item-name">
154
- {{ dataItem[nameKey] }}
153
+ {{ nodeItem[nameKey] }}
155
154
  </span>
156
155
 
157
156
  <span class="item-icon">
158
157
  <dsh-icons :list="[{
159
- icon: dataItem[valueKey] === curSelectedLinealData[valueKey]
158
+ icon: nodeItem[valueKey] === curSelectedLinealData[valueKey]
160
159
  ? 'md-checkmark'
161
- : dataItem.children.length
160
+ : nodeItem.children.length
162
161
  ? 'ios-arrow-forward'
163
162
  : ''
164
163
  }]" />
165
164
  </span>
166
- </DropdownItem>
165
+ </div>
167
166
  </template>
168
- </DropdownMenu>
167
+ </div>
169
168
 
170
169
  <!-- 无数据 -->
171
170
  <div
@@ -253,6 +252,7 @@
253
252
 
254
253
  search () {
255
254
  this.selectedValue = [];
255
+ this.showMode = "default";
256
256
  this.curTabIndex = 0;
257
257
  },
258
258
  clickItemCb (node) {
package/src/components/controls/base/DshCascader/cascaderPickerMixin.js CHANGED
@@ -93,14 +93,14 @@ export default {
93
93
  return this.selfPropsObj._resourceKey;
94
94
  },
95
95
 
96
- useMode () {
96
+ canUseModeSwitch () {
97
97
  return this.searchName.trim() &&
98
98
  this.showFlatData.length < this.maxFlatModeSearchNum;
99
99
  },
100
100
  useFlatMode () {
101
101
  return this.filterable &&
102
- this.showMode === "flat" &&
103
- this.useMode;
102
+ this.canUseModeSwitch &&
103
+ this.showMode === "flat";
104
104
  },
105
105
  modeTip () {
106
106
  return `在搜索时，会出现层级和平级切换开关，但搜索出的结果超${this.maxFlatModeSearchNum}个时，\
package/src/components/controls/controlMixin.js CHANGED
@@ -85,6 +85,9 @@ export default {
85
85
  controlType () {
86
86
  return this.propsObj._type;
87
87
  },
88
+ controlName () {
89
+ return this.propsObj._name;
90
+ },
88
91
  finalCanEdit () {
89
92
  return this.canEdit && (this.propsObj.canEdit == undefined ? true : this.propsObj.canEdit);
90
93
  },
@@ -92,7 +95,7 @@ export default {
92
95
  multipleMode () {
93
96
  return this.isOnDftSearch || this.isOnSearch
94
97
  ? true
95
- : ["texts", "numberange", "daterange", "checkbox", "regions", "cascaders"].includes(this.controlType) || !!this.propsObj._multiple;
98
+ : ["texts", "numberange", "daterange", "checkbox", "regions", "cascaders", "file"].includes(this.controlType) || !!this.propsObj._multiple;
96
99
  },
97
100
  commonDealPropsObj () {
98
101
  const selectControlTypes = ["date", "switch", "select", "checkbox", "file", "region", "regions", "cascader", "cascaders", "coordinates", "users", "departments"];
package/src/components/controls/senior/flatTable.vue CHANGED
@@ -82,6 +82,7 @@
82
82
  :propsObj="propsObj"
83
83
  :importParams="importParams"
84
84
  @input="toggleBatchImportModal"
85
+ @importCb="importCb"
85
86
  ></flat-table-import-modal>
86
87
  </div>
87
88
  </template>
@@ -130,11 +131,13 @@
130
131
  icon: "md-share-alt",
131
132
  size: "small",
132
133
  btnType: "text",
134
+ disabled: false,
133
135
  event: "clickExport"
134
136
  }
135
137
  },
136
138
 
137
- showBatchImportModal: false
139
+ showBatchImportModal: false,
140
+ timer: null
138
141
  };
139
142
  },
140
143
  computed: {
@@ -147,7 +150,6 @@
147
150
  };
148
151
  },
149
152
  columns () {
150
- console.log(this.propsObj);
151
153
  return this.propsObj._subForm;
152
154
  },
153
155
 
@@ -165,7 +167,7 @@
165
167
  if (this.propsObj._isExport) {
166
168
  btnList.unshift("canExport");
167
169
  }
168
- if (this.propsObj._isImport) {
170
+ if (this.propsObj._isImport && this.finalCanEdit) {
169
171
  btnList.unshift("canImport");
170
172
  }
171
173
 
@@ -248,6 +250,10 @@
248
250
  }
249
251
  });
250
252
  },
253
+ // 回调- 导入成功
254
+ importCb (data) {
255
+ this.value[this.controlKey] = data;
256
+ },
251
257
 
252
258
  // 校验方法 -供外部使用
253
259
  validate () {
package/src/components/controls/senior/flatTableImportModal.vue CHANGED
@@ -108,7 +108,7 @@
108
108
  file: null,
109
109
  loadingStatus: false,
110
110
  window: window,
111
- timer1: null
111
+ timer: null
112
112
  };
113
113
  },
114
114
  computed: {
@@ -174,6 +174,7 @@
174
174
  let formData = new FormData();
175
175
  formData.append("file_stream", this.file);
176
176
  formData.append("modKey", this.modKey);
177
+ formData.append("importType", "flatTable");
177
178
  this.importParams._key && formData.append("_key", this.importParams._key);
178
179
  this.importParams._id && formData.append("_id", this.importParams._id);
179
180
  this.$https({
@@ -186,7 +187,11 @@
186
187
  headers: { "Content-Type": "multipart/form-data" }
187
188
  },
188
189
  callback: data => {
189
- this.timer = setInterval(this.getTransitStatus(data.jobId, "import"), 1000);
190
+ this.$Message.success("导入成功");
191
+ this.file = null;
192
+ this.loadingStatus = false;
193
+ this.$emit("importCb", data);
194
+ this.showModal = false;
190
195
  },
191
196
  error: data => {
192
197
  this.$Message.error("导入失败:" + data.msg);
@@ -197,14 +202,10 @@
197
202
  });
198
203
  },
199
204
 
200
- getTransitStatus (id, type) {
205
+ getTransitStatus (id) {
201
206
  let that = this;
202
207
  return function () {
203
- if (type && type === "import") {
204
- that.getImportJobStatus(id);
205
- } else {
206
- that.getJobStatus(id);
207
- }
208
+ that.getJobStatus(id);
208
209
  };
209
210
  },
210
211
  // 状态查询
@@ -230,35 +231,6 @@
230
231
  this.timer = null;
231
232
  }
232
233
  });
233
- },
234
- // 导入状态查询
235
- getImportJobStatus (id) {
236
- this.$https({
237
- url: {
238
- module: "sheet",
239
- name: "getImportJobStatus"
240
- },
241
- params: {
242
- jobId: id
243
- },
244
- callback: data => {
245
- if (data.status === "over") {
246
- clearInterval(this.timer);
247
- this.$Message.success("导入成功");
248
- this.file = null;
249
- this.loadingStatus = false;
250
- this.showModal = false;
251
- this.$emit("importCb");
252
- } else if (data.status === "check-fai" || data.status === "fai") {
253
- clearInterval(this.timer);
254
- this.$Message.info({ content: data.faiMsg });
255
- this.loadingStatus = false;
256
- }
257
- },
258
- error: data => {
259
- this.timer = null;
260
- }
261
- });
262
234
  }
263
235
  }
264
236
  };
package/src/components/unit/DshFormUnit.vue CHANGED
@@ -79,6 +79,7 @@
79
79
 
80
80
  <slot>
81
81
  <component
82
+ class="DshFormUnit-control-component"
82
83
  ref="control"
83
84
  :is="curComponentName"
84
85
  :canEdit="canEdit"
@@ -247,6 +248,10 @@
247
248
  display: flex;
248
249
  justify-content: flex-end;
249
250
  align-items: center;
251
+
252
+ &-component {
253
+ width: 100%;
254
+ }
250
255
  }
251
256
  }
252
257