bri-components 1.2.10 → 1.2.11

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 (32) hide show
  1. package/lib/0.bri-components.min.js +1 -1
  2. package/lib/1.bri-components.min.js +1 -1
  3. package/lib/2.bri-components.min.js +1 -1
  4. package/lib/3.bri-components.min.js +1 -1
  5. package/lib/4.bri-components.min.js +1 -1
  6. package/lib/5.bri-components.min.js +1 -1
  7. package/lib/6.bri-components.min.js +1 -1
  8. package/lib/bri-components.min.js +7 -7
  9. package/package.json +1 -1
  10. package/src/components/controls/BriControlInput.vue +68 -4
  11. package/src/components/controls/base/BriUpload/BriUpload.vue +75 -192
  12. package/src/components/controls/base/BriUpload/BriUploadImage.vue +4 -3
  13. package/src/components/controls/base/BriUpload/uploadMixin.js +15 -21
  14. package/src/components/controls/base/DshCascader/DshCascader.vue +49 -96
  15. package/src/components/controls/base/DshCoordinates.vue +38 -57
  16. package/src/components/controls/controlMixin.js +19 -15
  17. package/src/components/controls/senior/BriLabels.vue +9 -40
  18. package/src/components/controls/senior/selectDepartments.vue +11 -41
  19. package/src/components/controls/senior/selectUsers/selectUsers.vue +8 -38
  20. package/src/components/form/DshAdvSearchForm.vue +9 -9
  21. package/src/components/small/BriButton.vue +1 -1
  22. package/src/components/unit/DshUnit.vue +1 -1
  23. package/src/index.js +2 -0
  24. package/src/styles/common/control.less +4 -38
  25. package/src/styles/components/controls/BriControlInput.less +28 -1
  26. package/src/styles/components/controls/base/DshCascader/DshCascader.less +2 -3
  27. package/src/styles/components/controls/base/DshCoordinates.less +1 -5
  28. package/src/styles/components/controls/senior/BriLabels.less +1 -1
  29. package/src/styles/components/controls/senior/selectDepartments.less +1 -1
  30. package/src/styles/components/controls/senior/selectUsers/selectUsers.less +1 -1
  31. package/src/styles/components/index.less +2 -0
  32. package/src/styles/components/small/DshModal.less +1 -1
package/src/components/controls/base/DshCascader/DshCascader.vue CHANGED
@@ -19,48 +19,20 @@
19
19
  @on-visible-change="multipleVisibleChange"
20
20
  @on-change="createItem"
21
21
  >
22
- <div
22
+ <bri-control-input
23
23
  :class="{
24
24
  ...commonClass,
25
25
  'DshCascader-edit-multiple-edit': true,
26
- 'DshCascader-row-edit': isMultipleRow,
26
+ 'DshCascader-row-edit': isFullRow && multipleMode
27
27
  }"
28
- @mouseenter="isHover = true"
29
- @mouseleave="isHover = false"
30
- @click="clickInput"
31
- >
32
- <!-- 有值 -->
33
- <template v-if="!$isEmptyData(curValList)">
34
- <dsh-tags
35
- class="overflow"
36
- :list="curValNameList"
37
- :propsObj="{
38
- disabled: !finalCanEdit,
39
- closable: true
40
- }"
41
- @delete="deleteItem"
42
- ></dsh-tags>
43
- </template>
44
- <!-- 无值 -->
45
- <template v-else>
46
- {{ emptyShowVal }}
47
- </template>
48
-
49
- <!-- 图标 -->
50
- <template>
51
- <Icon
52
- v-if="!$isEmptyData(curValList) && selfPropsObj._clearable && isHover"
53
- class="icon-close"
54
- type="ios-close-circle"
55
- @click.stop="clickClear"
56
- />
57
- <Icon
58
- v-else
59
- class="icon-default"
60
- :type="inputIcon"
61
- />
62
- </template>
63
- </div>
28
+ :canEdit="finalCanEdit"
29
+ :value="curValNameList"
30
+ :inputIcon="inputIcon"
31
+ :propsObj="selfPropsObj"
32
+ @deleteItem="clickDeleteItem"
33
+ @clear="clickClear"
34
+ @click.native="clickInput"
35
+ ></bri-control-input>
64
36
  </Cascader>
65
37
  </template>
66
38
 
@@ -68,33 +40,18 @@
68
40
  <template v-else>
69
41
  <!-- 弹框方式 -->
70
42
  <template v-if="showMode === 'custom'">
71
- <div
43
+ <bri-control-input
72
44
  :class="{
73
45
  ...commonClass,
74
46
  'DshCascader-edit-custom': true
75
47
  }"
76
- @mouseenter="isHover = true"
77
- @mouseleave="isHover = false"
78
- @click="openModal"
79
- >
80
- <!-- 内容 -->
81
- <div class="text">
82
- {{ showVal }}
83
- </div>
84
-
85
- <!-- 右侧图标 -->
86
- <Icon
87
- v-if="selfPropsObj._clearable && isHover"
88
- class="icon-close"
89
- type="ios-close-circle"
90
- @click.stop="clickClear"
91
- />
92
- <Icon
93
- v-else
94
- class="icon-default"
95
- type="ios-arrow-down"
96
- />
97
- </div>
48
+ :canEdit="finalCanEdit"
49
+ :value="curValName"
50
+ :inputIcon="inputIcon"
51
+ :propsObj="selfPropsObj"
52
+ @clear="clickClear"
53
+ @click.native="openModal"
54
+ ></bri-control-input>
98
55
 
99
56
  <!-- 内容弹框 -->
100
57
  <info-cascader
@@ -103,8 +60,8 @@
103
60
  v-model="curValList"
104
61
  :data="cascaderData"
105
62
  :propsObj="selfPropsObj"
63
+ @changeShowModal="toggleModal"
106
64
  @change="change"
107
- @changeShowModal="changeShowModal"
108
65
  ></info-cascader>
109
66
  </template>
110
67
 
@@ -146,11 +103,11 @@
146
103
  <div :class="{
147
104
  ...commonClass,
148
105
  'DshCascader-show-multiple': true,
149
- 'DshCascader-row-show': isMultipleRow && !isUnitShow,
106
+ 'DshCascader-row-show': !isUnitShow && isFullRow && multipleMode
150
107
  }">
151
108
  <!-- 有值 -->
152
109
  <dsh-tags
153
- v-if="!$isEmptyData(curValList)"
110
+ v-if="!$isEmptyData(curValNameList)"
154
111
  class="text"
155
112
  :list="curValNameList"
156
113
  ></dsh-tags>
@@ -230,9 +187,7 @@
230
187
  multipleSelectVal: [], // 必须要，每次选完之后再选，需清空上次选的
231
188
  selectVal: [],
232
189
 
233
- isHover: false,
234
- showModal: false,
235
- modalVallist: []
190
+ showModal: false
236
191
  };
237
192
  },
238
193
  computed: {
@@ -245,6 +200,18 @@
245
200
  ...this.commonDealPropsObj
246
201
  };
247
202
  },
203
+ // 是否多选类型
204
+ multipleMode () {
205
+ return ["regions", "cascaders"].includes(this.propsObj._type);
206
+ },
207
+ // 只有单选时有效
208
+ showMode () {
209
+ return this.selfPropsObj._showMode;
210
+ },
211
+ inputIcon () {
212
+ return this.isVisible ? "ios-arrow-up" : "ios-arrow-down";
213
+ },
214
+
248
215
  cascaderData: {
249
216
  get () {
250
217
  return loop(
@@ -266,34 +233,20 @@
266
233
  })
267
234
  : this.cascaderData;
268
235
  },
269
-
270
- // 是否多选类型
271
- multipleMode () {
272
- return ["regions", "cascaders"].includes(this.propsObj._type);
273
- },
274
- // 只有多选时有效
275
- isMultipleRow () {
276
- return this.multipleMode && (this.selfPropsObj._span === 24 || !this.selfPropsObj._span);
236
+ curValName () {
237
+ return this.$getTreeLinealDatas(this.curValList, this.cascaderData, "name").join("/");
277
238
  },
278
- // 只有单选时有效
279
- showMode () {
280
- return this.selfPropsObj._showMode;
281
- },
282
- inputIcon () {
283
- return this.isVisible ? "ios-arrow-up" : "ios-arrow-down";
239
+ showVal () {
240
+ return this.$isEmptyData(this.curValList)
241
+ ? this.emptyShowVal
242
+ : this.curValName;
284
243
  },
285
-
286
244
  // 多选用 名字组成的列表
287
245
  curValNameList () {
288
246
  return this.curValList.map(item =>
289
247
  this.$getTreeLinealDatas(item, this.cascaderData, "name").join("/")
290
248
  );
291
249
  },
292
- showVal () {
293
- return this.$isEmptyData(this.curValList)
294
- ? this.emptyShowVal
295
- : this.$getTreeLinealDatas(this.curValList, this.cascaderData, "name").join("/");
296
- },
297
250
  showMultipleVal () {
298
251
  return this.$isEmptyData(this.curValList)
299
252
  ? this.emptyShowVal
@@ -309,8 +262,12 @@
309
262
 
310
263
  cb();
311
264
  },
265
+ // 点击清除
266
+ clickClear () {
267
+ this.curValList = [];
268
+ },
312
269
 
313
- /* --------- 多选使用 -------- */
270
+ /* --------- 多选模式 -------- */
314
271
  clickInput (e) {
315
272
  if (!this.finalCanEdit) {
316
273
  e.stopPropagation();
@@ -343,28 +300,24 @@
343
300
  }
344
301
  },
345
302
  // 删除
346
- deleteItem (item, index) {
303
+ clickDeleteItem (item, index) {
347
304
  this.curValList.splice(index, 1);
348
305
  this.curValList = [...this.curValList];
349
306
  },
350
307
 
351
- /* -------- 单选使用 ------- */
308
+ /* -------- 单选模式 -弹窗方式 ------- */
352
309
  // 弹窗方式的 -打开模态框
353
310
  openModal () {
354
311
  if (this.finalCanEdit) {
355
- this.modalVallist = this.curValList;
356
312
  this.showModal = true;
357
313
  }
358
314
  },
359
315
  // 弹窗方式的 -关闭模态框
360
- changeShowModal (bool) {
316
+ toggleModal (bool) {
361
317
  this.showModal = bool;
362
318
  },
363
- // 弹窗方式的 -点击清除
364
- clickClear () {
365
- this.curValList = [];
366
- },
367
319
 
320
+ /* -------- 单选模式 -输入框方式 ------- */
368
321
  // 默认方式的
369
322
  clickCascader () {
370
323
  if (this.finalCanEdit) {
package/src/components/controls/base/DshCoordinates.vue CHANGED
@@ -7,47 +7,30 @@
7
7
  :transfer="true"
8
8
  >
9
9
  <!-- 编辑 -->
10
- <template v-if="canEdit">
11
- <div
12
- :class="{
13
- ...commonClass,
14
- 'DshCoordinates-edit': canEdit,
15
- }"
16
- @mouseenter="isHover = true"
17
- @mouseleave="isHover = false"
18
- @click.stop="clickInput"
19
- >
20
- <div class="text">
21
- {{ showVal }}
22
- </div>
23
-
24
- <!-- 图标 -->
25
- <template>
26
- <Icon
27
- v-if="!$isEmptyData(curVal) && selfPropsObj._clearable && isHover"
28
- class="icon-close"
29
- type="ios-close-circle"
30
- @click.stop="clickClear"
31
- />
32
- <Icon
33
- v-else
34
- class="icon-default"
35
- :type="inputIcon"
36
- />
37
- </template>
38
- </div>
39
- </template>
10
+ <bri-control-input
11
+ v-if="canEdit"
12
+ :class="{
13
+ ...commonClass,
14
+ 'DshCoordinates-edit': true
15
+ }"
16
+ :canEdit="finalCanEdit"
17
+ :value="curVal.name"
18
+ :inputIcon="inputIcon"
19
+ :propsObj="selfPropsObj"
20
+ @clear="clickClear"
21
+ @click.native="clickInput"
22
+ ></bri-control-input>
40
23
 
41
24
  <!-- 查看 -->
42
- <template v-else>
43
- <div :class="{
25
+ <div
26
+ v-else
27
+ :class="{
44
28
  ...commonClass,
45
- 'DshCoordinates-show': !isUnitShow,
46
- 'DshCoordinates-unit': isUnitShow
47
- }">
48
- {{ showVal }}
49
- </div>
50
- </template>
29
+ 'DshCoordinates-show': true
30
+ }"
31
+ >
32
+ {{ showVal }}
33
+ </div>
51
34
  </bri-tooltip>
52
35
 
53
36
  <!-- 模态框 -->
@@ -102,7 +85,7 @@
102
85
  <Row class="header-edit-row">
103
86
  <i-col span="16">
104
87
  <Input
105
- :value="cloneVal.name"
88
+ :value="newVal.name"
106
89
  :readonly="true"
107
90
  :clearable="true"
108
91
  @on-clear="clickModalClear"
@@ -134,7 +117,7 @@
134
117
 
135
118
  <i-col span="12">
136
119
  <Input
137
- :value="cloneVal.name"
120
+ :value="newVal.name"
138
121
  :readonly="true"
139
122
  @click.native="clickMapFitView"
140
123
  />
@@ -186,10 +169,8 @@
186
169
  ],
187
170
  data () {
188
171
  return {
189
- isHover: false,
190
-
191
172
  showModal: false,
192
- cloneVal: {
173
+ newVal: {
193
174
  name: "",
194
175
  lnglat: []
195
176
  },
@@ -219,7 +200,7 @@
219
200
  ...this.commonDealPropsObj
220
201
  };
221
202
  },
222
- kind () {
203
+ showType () {
223
204
  return this.selfPropsObj._showType;
224
205
  },
225
206
  inputIcon () {
@@ -258,14 +239,14 @@
258
239
  clickInput () {
259
240
  if (this.canEdit) {
260
241
  this.showModal = true;
261
- this.cloneVal = this.$deepCopy(this.curVal);
242
+ this.newVal = this.$deepCopy(this.curVal);
262
243
  this.getMap();
263
244
  }
264
245
  },
265
246
  // 点击确认
266
247
  clickConfirm () {
267
248
  this.showModal = false;
268
- this.curVal = this.cloneVal;
249
+ this.curVal = this.newVal;
269
250
  },
270
251
  // 点击删除
271
252
  clickClear () {
@@ -276,7 +257,7 @@
276
257
  },
277
258
  // 清除已选内容
278
259
  clickModalClear () {
279
- this.cloneVal = {
260
+ this.newVal = {
280
261
  name: "",
281
262
  lnglat: []
282
263
  }; // 清除当前标记
@@ -353,10 +334,10 @@
353
334
  this.mouseTool = new AMap.MouseTool(this.map);
354
335
  this.mouseTool.on("draw", this.handleMouseToolCallback);
355
336
  // 设置默认坐标
356
- if (!this.$isEmptyData(this.cloneVal)) {
337
+ if (!this.$isEmptyData(this.newVal)) {
357
338
  this.handleAddMarker(this.curLnglat, true);
358
339
 
359
- if (this.kind === "multipleMarker") { // 多选打开绘图功能
340
+ if (this.showType === "multipleMarker") { // 多选打开绘图功能
360
341
  this.finalCanEdit && this.handleOpenDraw();
361
342
  }
362
343
  } else {
@@ -365,10 +346,10 @@
365
346
  },
366
347
  handleMouseToolCallback (e) {
367
348
  if (e.obj.CLASS_NAME === "AMap.Marker") {
368
- if (this.kind === "marker") {
349
+ if (this.showType === "marker") {
369
350
  this.plot = e.obj;
370
351
  this.handleCloseDraw();
371
- } else if (this.kind === "multipleMarker") {
352
+ } else if (this.showType === "multipleMarker") {
372
353
  if (this.plot) {
373
354
  this.plot.push(e.obj);
374
355
  } else {
@@ -402,7 +383,7 @@
402
383
  }
403
384
  },
404
385
  // 打开绘图
405
- handleOpenDraw (type = this.kind) {
386
+ handleOpenDraw (type = this.showType) {
406
387
  switch (type) {
407
388
  case "marker": {
408
389
  this.mouseTool.marker(markerOpt);
@@ -435,7 +416,7 @@
435
416
  this.mouseTool.close();
436
417
  },
437
418
  // 添加图形
438
- handleAddMarker (location, centerView = true, type = this.kind) {
419
+ handleAddMarker (location, centerView = true, type = this.showType) {
439
420
  location = JSON.parse(JSON.stringify(location));
440
421
  // 分类型添加
441
422
  if (["polygon", "rectangle", "circle"].includes(type)) {
@@ -450,12 +431,12 @@
450
431
  !this.marker && (this.marker = new AMap.Marker());
451
432
  this.marker.setPosition(location);
452
433
  this.marker.setMap(this.map);
453
- if (this.kind === "marker") {
434
+ if (this.showType === "marker") {
454
435
  this.handleRmoveMarker();
455
436
  this.handleCloseDraw();
456
437
  this.curLnglat = [location];
457
438
  this.getRegeoCode();
458
- } else if (this.kind === "multipleMarker") {
439
+ } else if (this.showType === "multipleMarker") {
459
440
  this.curLnglat.push(location);
460
441
  this.getRegeoCode();
461
442
  }
@@ -478,7 +459,7 @@
478
459
  }
479
460
  },
480
461
  // 移除图形
481
- handleRmoveMarker (type = this.kind) {
462
+ handleRmoveMarker (type = this.showType) {
482
463
  if (["default"].includes(type)) {
483
464
  this.marker && this.map.remove(this.marker);
484
465
  this.plot && this.map.remove(this.plot);
@@ -507,7 +488,7 @@
507
488
  .then(response => {
508
489
  if (response.status === "1" && response.regeocode) {
509
490
  let address = response.regeocode.formatted_address;
510
- this.cloneVal.name = address;
491
+ this.newVal.name = address;
511
492
  }
512
493
  });
513
494
  }
package/src/components/controls/controlMixin.js CHANGED
@@ -83,9 +83,6 @@ export default {
83
83
  finalCanEdit () {
84
84
  return this.canEdit && (this.propsObj.canEdit == undefined ? true : this.propsObj.canEdit);
85
85
  },
86
- isUnitShow () {
87
- return !this.canEdit && this.inTable;
88
- },
89
86
  multipleMode () {
90
87
  return !!this.propsObj._multiple;
91
88
  },
@@ -110,26 +107,33 @@ export default {
110
107
  "bri-control-nodata": this.$isEmptyData(this.curVal)
111
108
  };
112
109
  },
113
- showAlign () {
114
- return !this.isUnitShow
115
- ? "flex-start"
116
- : this.propsObj._align === "right"
117
- ? "flex-end"
118
- : this.propsObj._align === "center"
119
- ? "center"
120
- : "flex-start";
121
- },
110
+ isFullRow () {
111
+ return this.propsObj._span === 24 || !this.propsObj._span;
112
+ },
113
+ // showAlign () {
114
+ // return !this.isUnitShow
115
+ // ? "flex-start"
116
+ // : this.propsObj._align === "right"
117
+ // ? "flex-end"
118
+ // : this.propsObj._align === "center"
119
+ // ? "center"
120
+ // : "flex-start";
121
+ // },
122
122
 
123
- // 部分控件或部分条件下 才使用的属性
123
+ /* 部分条件下 才使用的属性 */
124
124
  isCore () {
125
125
  return !!this.propsObj.isCore;
126
126
  },
127
- inTable () {
128
- return !!this.propsObj.inTable;
127
+ isInTable () {
128
+ return !!this.propsObj.isInTable;
129
+ },
130
+ isUnitShow () {
131
+ return !this.canEdit && this.isInTable;
129
132
  },
130
133
  isShare () {
131
134
  return !!this.propsObj.isShare;
132
135
  },
136
+ /* 部分控件下 才使用的属性 */
133
137
  compKey () {
134
138
  return this.propsObj.compKey;
135
139
  },
package/src/components/controls/senior/BriLabels.vue CHANGED
@@ -12,48 +12,19 @@
12
12
  @on-clickoutside="clickInput"
13
13
  >
14
14
  <!-- 可编辑 -->
15
- <div
15
+ <bri-control-input
16
16
  :class="{
17
17
  ...commonClass,
18
18
  'BriLabels-edit': true
19
19
  }"
20
- @mouseenter="isHover = true"
21
- @mouseleave="isHover = false"
22
- @click="clickInput"
23
- >
24
- <!-- 有值 -->
25
- <template v-if="!$isEmptyData(curValList)">
26
- <dsh-tags
27
- class="overflow"
28
- :list="curValList"
29
- :propsObj="{
30
- disabled: !finalCanEdit,
31
- closable: true
32
- }"
33
- :autoEllipsis="true"
34
- @delete="clickDeleteItem"
35
- ></dsh-tags>
36
- </template>
37
- <!-- 无值 -->
38
- <template v-else>
39
- {{ emptyShowVal }}
40
- </template>
41
-
42
- <!-- 图标 -->
43
- <template>
44
- <Icon
45
- v-if="!$isEmptyData(curValList) && selfPropsObj._clearable && isHover"
46
- class="icon-close"
47
- type="ios-close-circle"
48
- @click.stop="clickClear"
49
- />
50
- <Icon
51
- v-else
52
- class="icon-default"
53
- :type="inputIcon"
54
- />
55
- </template>
56
- </div>
20
+ :canEdit="finalCanEdit"
21
+ :value="curValList"
22
+ :inputIcon="inputIcon"
23
+ :propsObj="selfPropsObj"
24
+ @deleteItem="clickDeleteItem"
25
+ @clear="clickClear"
26
+ @click.native="clickInput"
27
+ ></bri-control-input>
57
28
 
58
29
  <template #list>
59
30
  <DropdownMenu class="BriLabels-dropdown-menu">
@@ -160,8 +131,6 @@
160
131
  ],
161
132
  data () {
162
133
  return {
163
- isHover: false,
164
-
165
134
  listData: [],
166
135
  isVisible: false,
167
136
  renderList: false
package/src/components/controls/senior/selectDepartments.vue CHANGED
@@ -8,50 +8,22 @@
8
8
  >
9
9
  <div @click.stop="clickInput">
10
10
  <slot>
11
- <!-- 编辑模式 -->
12
- <div
11
+ <!-- 编辑 -->
12
+ <bri-control-input
13
13
  v-if="canEdit"
14
14
  :class="{
15
15
  ...commonClass,
16
16
  'selectDepartments-edit': true
17
17
  }"
18
- @mouseenter="isHover = true"
19
- @mouseleave="isHover = false"
20
- >
21
- <!-- 有值 -->
22
- <template v-if="!$isEmptyData(curValList)">
23
- <dsh-tags
24
- class="text"
25
- :list="curValList"
26
- :propsObj="{
27
- disabled: !finalCanEdit,
28
- closable: true
29
- }"
30
- @delete="clickDeleteItem"
31
- ></dsh-tags>
32
- </template>
33
- <!-- 无值 -->
34
- <template v-else>
35
- {{ emptyShowVal }}
36
- </template>
18
+ :canEdit="finalCanEdit"
19
+ :value="curValList"
20
+ :inputIcon="inputIcon"
21
+ :propsObj="selfPropsObj"
22
+ @deleteItem="clickDeleteItem"
23
+ @clear="clickClear"
24
+ ></bri-control-input>
37
25
 
38
- <!-- 图标 -->
39
- <template>
40
- <Icon
41
- v-if="!$isEmptyData(curValList) && selfPropsObj._clearable && isHover"
42
- class="icon-close"
43
- type="ios-close-circle"
44
- @click.stop="clickClear"
45
- />
46
- <Icon
47
- v-else
48
- class="icon-default"
49
- :type="inputIcon"
50
- />
51
- </template>
52
- </div>
53
-
54
- <!-- 查看模式 -->
26
+ <!-- 查看 -->
55
27
  <div
56
28
  v-else
57
29
  :class="{
@@ -202,10 +174,8 @@
202
174
  props: {},
203
175
  data () {
204
176
  return {
205
- isHover: false,
206
-
207
- newValList: [],
208
177
  showModal: false,
178
+ newValList: [],
209
179
  loading: false,
210
180
  searchName: "", // 搜索名字
211
181
  departmentList: [],