bri-components 1.4.53 → 1.4.54

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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "bri-components",
3
- "version": "1.4.53",
3
+ "version": "1.4.54",
4
4
  "author": "dengshanghui",
5
5
  "description": "a component lib for vue project",
6
6
  "main": "src/index.js",
@@ -29,7 +29,7 @@
29
29
  >
30
30
  <!-- 有值 -->
31
31
  <template v-if="!$isEmptyData(curValList)">
32
- <!-- 高度自由时 单元格-表格字段内,详情页-独占一行宽度时 -->
32
+ <!-- 高度自由时 -->
33
33
  <div
34
34
  v-if="isHeightAuto"
35
35
  :class="{
@@ -43,6 +43,7 @@
43
43
  {{ showVal }}
44
44
  </div>
45
45
 
46
+ <!-- 高度不自由(不换行) -->
46
47
  <bri-tooltip
47
48
  v-else
48
49
  :content="showVal"
@@ -103,7 +104,7 @@
103
104
  >
104
105
  <!-- 有值 -->
105
106
  <template v-if="!$isEmptyData(curValList)">
106
- <!-- 高度自由时 单元格-表格字段内,详情页-独占一行宽度时 -->
107
+ <!-- 高度自由时 -->
107
108
  <dsh-tags
108
109
  v-if="isHeightAuto"
109
110
  :class="{
@@ -114,6 +115,7 @@
114
115
  :list="curValObjList"
115
116
  ></dsh-tags>
116
117
 
118
+ <!-- 高度不自由(不换行) -->
117
119
  <bri-tooltip
118
120
  v-else
119
121
  :content="showMulVal"
@@ -1,14 +1,15 @@
1
1
  <template>
2
- <div class="DshCoordinates">
2
+ <!-- 单选模式 编辑 -->
3
+ <div
4
+ v-if="!multipleMode && canEdit"
5
+ class="DshCoordinates"
6
+ >
3
7
  <bri-tooltip
4
8
  :content="showVal"
5
- placement="top"
6
- maxWidth="200"
7
9
  :transfer="true"
8
10
  >
9
11
  <!-- 编辑 -->
10
12
  <dsh-control-input
11
- v-if="canEdit"
12
13
  :class="commonClass"
13
14
  :value="curVal"
14
15
  :disabled="disabled"
@@ -16,21 +17,10 @@
16
17
  @clear="clickClear"
17
18
  @click.native="clickInput"
18
19
  ></dsh-control-input>
19
-
20
- <!-- 查看 -->
21
- <div
22
- v-else
23
- :class="{
24
- ...commonClass
25
- }"
26
- >
27
- <span class="text"> {{ showVal }}</span>
28
- </div>
29
20
  </bri-tooltip>
30
21
 
31
22
  <!-- 模态框 -->
32
23
  <Modal
33
- v-if="canEdit"
34
24
  class="DshCoordinates-modal"
35
25
  v-model="showModal"
36
26
  :styles="modalStyles"
@@ -138,6 +128,48 @@
138
128
  ></div>
139
129
  </Modal>
140
130
  </div>
131
+
132
+ <!-- 单选模式 查看 -->
133
+ <div
134
+ v-else-if="!multipleMode && !canEdit"
135
+ class="DshCoordinates-show"
136
+ >
137
+ <!-- 有值 -->
138
+ <template v-if="!$isEmptyData(curVal)">
139
+ <!-- 高度自由时 -->
140
+ <div
141
+ v-if="isHeightAuto"
142
+ :class="{
143
+ ...commonClass,
144
+ 'DshCoordinates-show-auto': true
145
+ }"
146
+ >
147
+ {{ showVal }}
148
+ </div>
149
+
150
+ <!-- 高度不自由(不换行) -->
151
+ <bri-tooltip
152
+ v-else
153
+ :content="showVal"
154
+ :transfer="true"
155
+ >
156
+ <div :class="{
157
+ ...commonClass,
158
+ 'DshCoordinates-show-ellipsis': true
159
+ }">
160
+ {{ showVal }}
161
+ </div>
162
+ </bri-tooltip>
163
+ </template>
164
+
165
+ <!-- 无值 -->
166
+ <div
167
+ v-else
168
+ :class="commonClass"
169
+ >
170
+ {{ emptyShowVal }}
171
+ </div>
172
+ </div>
141
173
  </template>
142
174
 
143
175
  <script>
@@ -477,8 +509,10 @@
477
509
  </script>
478
510
 
479
511
  <style lang="less">
512
+ @import url("../control.less");
513
+
480
514
  .DshCoordinates {
481
- width: 100%;
515
+ #control-show();
482
516
 
483
517
  &-modal {
484
518
  &-header {
@@ -1,59 +1,83 @@
1
1
  <template>
2
- <!-- 单选模式 -->
2
+ <!-- 单选模式 编辑 -->
3
3
  <div
4
- v-if="!multipleMode"
4
+ v-if="!multipleMode && canEdit"
5
5
  class="DshDate"
6
6
  >
7
- <template v-if="show">
8
- <!-- 编辑 -->
9
- <template v-if="canEdit">
10
- <!-- 时间子类型 -->
11
- <template v-if="['time'].includes(subType)">
12
- <TimePicker
13
- class="DshDate-edit"
14
- v-model="curValDate"
15
- :type="subType"
16
- :placeholder="selfPropsObj._placeholder"
17
- :disabled="disabled"
18
- :clearable="clearable"
19
- :transfer="selfPropsObj._transfer"
20
- @on-change="change"
21
- ></TimePicker>
22
- </template>
23
-
24
- <!-- 日期、日期时间、年、月 -->
25
- <template v-else>
26
- <DatePicker
27
- class="DshDate-edit"
28
- v-model="curValDate"
29
- :type="subType"
30
- :placeholder="selfPropsObj._placeholder"
31
- :disabled="disabled"
32
- :clearable="clearable"
33
- :options="options"
34
- :transfer="selfPropsObj._transfer"
35
- @on-change="change"
36
- ></DatePicker>
37
- </template>
7
+ <template v-if="canEdit">
8
+ <!-- 时间子类型 -->
9
+ <template v-if="['time'].includes(subType)">
10
+ <TimePicker
11
+ class="DshDate-edit"
12
+ v-model="curValDate"
13
+ :type="subType"
14
+ :placeholder="selfPropsObj._placeholder"
15
+ :disabled="disabled"
16
+ :clearable="clearable"
17
+ :transfer="selfPropsObj._transfer"
18
+ @on-change="change"
19
+ ></TimePicker>
38
20
  </template>
39
21
 
40
- <!-- 查看 -->
22
+ <!-- 日期、日期时间、年、月 -->
41
23
  <template v-else>
42
- <bri-tooltip
43
- :content="showVal"
44
- maxWidth="200"
45
- :transfer="true"
46
- >
47
- <div :class="{
48
- ...commonClass
49
- }">
50
- {{ showVal }}
51
- </div>
52
- </bri-tooltip>
24
+ <DatePicker
25
+ class="DshDate-edit"
26
+ v-model="curValDate"
27
+ :type="subType"
28
+ :placeholder="selfPropsObj._placeholder"
29
+ :disabled="disabled"
30
+ :clearable="clearable"
31
+ :options="options"
32
+ :transfer="selfPropsObj._transfer"
33
+ @on-change="change"
34
+ ></DatePicker>
53
35
  </template>
54
36
  </template>
55
37
  </div>
56
38
 
39
+ <!-- 单选模式 查看 -->
40
+ <div
41
+ v-else-if="!multipleMode && !canEdit"
42
+ class="DshDate-show"
43
+ >
44
+ <!-- 有值 -->
45
+ <template v-if="!$isEmptyData(curVal)">
46
+ <!-- 高度自由时 -->
47
+ <div
48
+ v-if="isHeightAuto"
49
+ :class="{
50
+ ...commonClass,
51
+ 'DshDate-show-auto': true
52
+ }"
53
+ >
54
+ {{ showVal }}
55
+ </div>
56
+
57
+ <!-- 高度不自由(不换行) -->
58
+ <bri-tooltip
59
+ v-else
60
+ :content="showVal"
61
+ :transfer="true"
62
+ >
63
+ <div :class="{
64
+ ...commonClass,
65
+ 'DshDate-show-ellipsis': true
66
+ }">
67
+ {{ showVal }}
68
+ </div>
69
+ </bri-tooltip>
70
+ </template>
71
+
72
+ <!-- 无值 -->
73
+ <div
74
+ v-else
75
+ :class="commonClass"
76
+ >
77
+ {{ emptyShowVal }}
78
+ </div>
79
+ </div>
80
+
57
81
  <!-- 多选模式 -->
58
82
  <dsh-daterange
59
83
  v-else
@@ -78,9 +102,7 @@
78
102
  },
79
103
  props: {},
80
104
  data () {
81
- return {
82
- show: true
83
- };
105
+ return {};
84
106
  },
85
107
  computed: {
86
108
  selfPropsObj () {
@@ -126,22 +148,15 @@
126
148
  }
127
149
  },
128
150
  created () {},
129
- methods: {},
130
- watch: {
131
- "subType" () {
132
- this.show = false;
133
- this.$nextTick(() => {
134
- this.value[this.controlKey] = this.selfPropsObj._default;
135
- this.show = true;
136
- });
137
- }
138
- }
151
+ methods: {}
139
152
  };
140
153
  </script>
141
154
 
142
155
  <style lang="less">
156
+ @import url("../../control.less");
157
+
143
158
  .DshDate {
144
- width: 100%;
159
+ #control-show();
145
160
 
146
161
  &-edit {
147
162
  width: 100%;
@@ -44,12 +44,12 @@
44
44
  >
45
45
  <!-- 有值 -->
46
46
  <template v-if="!$isEmptyData(curVal)">
47
- <!-- 高度自由时(单元格-内容高度自由,详情页-独占一行) -->
47
+ <!-- 高度自由时 -->
48
48
  <template v-if="isHeightAuto">
49
49
  <a
50
50
  v-if="subType === 'url'"
51
51
  :class="{
52
- ...commonClass2,
52
+ ...commonClass,
53
53
  'DshInput-show-auto': true,
54
54
  'DshInput-show-auto-url': true
55
55
  }"
@@ -61,7 +61,7 @@
61
61
  <div
62
62
  v-else
63
63
  :class="{
64
- ...commonClass2,
64
+ ...commonClass,
65
65
  'DshInput-show-auto': true,
66
66
  'DshInput-show-auto-detail': isDetailShow,
67
67
  'DshInput-show-auto-text': ['text', 'textarea'].includes(subType)
@@ -70,7 +70,7 @@
70
70
  ></div>
71
71
  </template>
72
72
 
73
- <!-- 单元格的查看 和 详情页的查看 -->
73
+ <!-- 高度不自由(不换行) -->
74
74
  <bri-tooltip
75
75
  v-else
76
76
  :content="showVal"
@@ -80,7 +80,7 @@
80
80
  <a
81
81
  v-if="subType === 'url'"
82
82
  :class="{
83
- ...commonClass2,
83
+ ...commonClass,
84
84
  'DshInput-show-ellipsis': true,
85
85
  'DshInput-show-ellipsis-url': true
86
86
  }"
@@ -92,7 +92,7 @@
92
92
  <div
93
93
  v-else
94
94
  :class="{
95
- ...commonClass2,
95
+ ...commonClass,
96
96
  'DshInput-show-ellipsis': true
97
97
  }"
98
98
  >
@@ -104,7 +104,7 @@
104
104
  <!-- 无值 -->
105
105
  <div
106
106
  v-else
107
- :class="commonClass2"
107
+ :class="commonClass"
108
108
  >
109
109
  {{ emptyShowVal }}
110
110
  </div>
@@ -1,60 +1,54 @@
1
1
  <template>
2
- <!-- 单选模式 -->
2
+ <!-- 单选模式 编辑 -->
3
3
  <div
4
- v-if="!multipleMode"
4
+ v-if="!multipleMode && canEdit"
5
5
  class="DshNumber"
6
6
  >
7
- <!-- 编辑 -->
8
- <template v-if="canEdit">
9
- <BriInputNumber
10
- class="DshNumber-edit"
11
- v-model="curVal"
12
- :placeholder="selfPropsObj._placeholder"
13
- :disabled="disabled"
14
- :formatter="formatterFunc"
15
- :max="maxNum"
16
- :min="minNum"
17
- :precision="digit"
18
- >
19
- <div
20
- v-if="unitStr"
21
- slot="suffix"
22
- class="DshNumber-edit-suffix"
23
- >
24
- {{ unitStr }}
25
- </div>
26
- </BriInputNumber>
27
- </template>
28
-
29
- <!-- 查看 -->
30
- <template v-else>
31
- <!-- 单元格的查看-进度条模式 -->
7
+ <BriInputNumber
8
+ class="DshNumber-edit"
9
+ v-model="curVal"
10
+ :placeholder="selfPropsObj._placeholder"
11
+ :disabled="disabled"
12
+ :formatter="formatterFunc"
13
+ :max="maxNum"
14
+ :min="minNum"
15
+ :precision="digit"
16
+ >
32
17
  <div
33
- v-if="selfPropsObj._showProgress"
34
- :class="{
35
- 'DshNumber-show': true,
36
- [`DshNumber-show-${unitAlign}`]: true
37
- }"
18
+ v-if="unitStr"
19
+ slot="suffix"
20
+ class="DshNumber-edit-suffix"
38
21
  >
39
- <Progress
40
- :percent="progressNum"
41
- :stroke-width="strokeWidth"
42
- :stroke-color="[statusColor, statusColor]"
43
- >
44
- <span>{{ progressStr }}</span>
45
- </Progress>
22
+ {{ unitStr }}
46
23
  </div>
24
+ </BriInputNumber>
25
+ </div>
47
26
 
48
- <!-- 单元格的查看-非进度条模式 详情页的查看 -->
49
- <div
50
- v-else
51
- :class="{
52
- ...commonClass,
53
- }"
54
- >
55
- {{ showVal }}
56
- </div>
57
- </template>
27
+ <!-- 单选模式 查看 -->
28
+ <div
29
+ v-else-if="!multipleMode && !canEdit"
30
+ :class="{
31
+ 'DshNumber-show': true,
32
+ [`DshNumber-show-${unitAlign}`]: true
33
+ }"
34
+ >
35
+ <!-- 进度条模式 -->
36
+ <Progress
37
+ v-if="showProgress"
38
+ :percent="progressNum"
39
+ :stroke-width="strokeWidth"
40
+ :stroke-color="[statusColor, statusColor]"
41
+ >
42
+ <span>{{ progressStr }}</span>
43
+ </Progress>
44
+
45
+ <!-- 非进度条模式 -->
46
+ <div
47
+ v-else
48
+ :class="commonClass"
49
+ >
50
+ {{ showVal }}
51
+ </div>
58
52
  </div>
59
53
 
60
54
  <!-- 多选模式 -->
@@ -90,10 +90,11 @@
90
90
  ...commonClass,
91
91
  'DshCheckbox-show-auto': true
92
92
  }"
93
- :list="curValObjList"
94
93
  itemClass="DshCheckbox-show-auto-tag"
94
+ :list="curValObjList"
95
95
  ></dsh-tags>
96
96
 
97
+ <!-- 高度不自由(不换行) -->
97
98
  <bri-tooltip
98
99
  v-else
99
100
  :content="showMulVal"
@@ -104,8 +105,8 @@
104
105
  ...commonClass,
105
106
  'DshCheckbox-show-ellipsis': true
106
107
  }"
107
- :list="curValObjList"
108
108
  itemClass="DshCheckbox-show-ellipsis-tag"
109
+ :list="curValObjList"
109
110
  ></dsh-tags>
110
111
  </bri-tooltip>
111
112
  </template>
@@ -96,10 +96,11 @@
96
96
  ...commonClass,
97
97
  'DshSelect-show-auto': true
98
98
  }"
99
- :list="[curValObj]"
100
99
  itemClass="DshSelect-show-auto-tag"
100
+ :list="[curValObj]"
101
101
  ></dsh-tags>
102
102
 
103
+ <!-- 高度不自由(不换行) -->
103
104
  <bri-tooltip
104
105
  v-else
105
106
  :content="showVal"
@@ -110,8 +111,8 @@
110
111
  ...commonClass,
111
112
  'DshSelect-show-ellipsis': true
112
113
  }"
113
- :list="[curValObj]"
114
114
  itemClass="DshSelect-show-ellipsis-tag"
115
+ :list="[curValObj]"
115
116
  ></dsh-tags>
116
117
  </bri-tooltip>
117
118
  </template>
@@ -30,7 +30,7 @@
30
30
  >
31
31
  <!-- 有值 -->
32
32
  <template v-if="!$isEmptyData(curVal)">
33
- <!-- 高度自由时 单元格-表格字段内,详情页-独占一行宽度时 -->
33
+ <!-- 高度自由时 -->
34
34
  <dsh-tags
35
35
  v-if="isHeightAuto"
36
36
  :class="{
@@ -41,6 +41,7 @@
41
41
  itemClass="DshSwitch-show-auto-tag"
42
42
  ></dsh-tags>
43
43
 
44
+ <!-- 高度不自由(不换行) -->
44
45
  <bri-tooltip
45
46
  v-else
46
47
  :content="showVal"
@@ -17,6 +17,15 @@
17
17
 
18
18
  &-tag {
19
19
  .dsh-ellipsis();
20
+ display: inline-block;
21
+ max-width: 100%;
22
+ height: 24px;
23
+ min-height: 24px;
24
+ padding: 4px 8px;
25
+ margin: 2px 0px;
26
+ border-radius: 4px;
27
+ line-height: 16px;
28
+ font-size: 12px;
20
29
  }
21
30
  }
22
31
  }
@@ -33,7 +33,7 @@ const componentNameMap = {
33
33
 
34
34
  users: "selectUsers",
35
35
  departments: "selectDepartments",
36
- labels: "BriLabels",
36
+ labels: "DshLabels",
37
37
  package: "DshPackage",
38
38
  flatTable: "flatTable",
39
39
  cascaderTable: "cascaderTable",
@@ -66,7 +66,7 @@ const pathMap = {
66
66
  senior: {
67
67
  selectUsers: "./senior/selectUsers/selectUsers.vue",
68
68
  selectDepartments: "./senior/selectDepartments.vue",
69
- BriLabels: "./senior/BriLabels.vue",
69
+ DshLabels: "./senior/DshLabels.vue",
70
70
  DshPackage: "./senior/DshPackage.vue",
71
71
  flatTable: "./senior/flatTable.vue",
72
72
  cascaderTable: "./senior/cascaderTable"
@@ -163,16 +163,6 @@ export default {
163
163
  "bri-control-nodata": this.$isEmptyData(this.curVal)
164
164
  };
165
165
  },
166
- commonClass2 () {
167
- return {
168
- "bri-control-edit": this.canEdit && !this.disabled,
169
- "bri-control-disabled": this.canEdit && this.disabled,
170
- "bri-control-unit": this.isUnitShow,
171
- "bri-control-show": this.isDetailShow,
172
- [`control-show-${this.showStatusMode}${this.isTagShow ? "-tag" : ""}`]: this.isDetailShow,
173
- "bri-control-nodata": this.$isEmptyData(this.curVal)
174
- };
175
- },
176
166
 
177
167
  /* ----- 单元格相关 ----- */
178
168
  unitAlign () {
@@ -56,6 +56,10 @@ export default {
56
56
  ? this.$numToSeparator
57
57
  : value => `${value}`;
58
58
  },
59
+
60
+ showProgress () {
61
+ return this.selfPropsObj._showProgress;
62
+ },
59
63
  // 进度条方式使用(此处先这样,实际是进度条使用要受0-100的数值范围限制)
60
64
  strokeWidth () {
61
65
  return this.selfPropsObj._strokeWidth;
@@ -1,118 +1,140 @@
1
- <!-- 动态标签 -->
2
1
  <template>
3
- <div class="BriLabels">
4
- <!-- 编辑页 -->
5
- <template v-if="canEdit">
6
- <Dropdown
7
- class="BriLabels-dropdown"
8
- trigger="custom"
9
- placement="bottom-start"
10
- :visible="isVisible"
11
- transfer
12
- @on-clickoutside="clickInput"
13
- >
14
- <!-- 可编辑 -->
15
- <dsh-control-input
16
- :class="commonClass"
17
- :value="curValList"
18
- :disabled="disabled"
19
- :propsObj="selfPropsObj"
20
- @deleteItem="clickDeleteItem"
21
- @clear="clickClear"
22
- @click.native="clickInput"
23
- ></dsh-control-input>
2
+ <!-- 编辑 -->
3
+ <div
4
+ v-if="canEdit"
5
+ class="DshLabels"
6
+ >
7
+ <Dropdown
8
+ class="DshLabels-dropdown"
9
+ trigger="custom"
10
+ placement="bottom-start"
11
+ :visible="isVisible"
12
+ transfer
13
+ @on-clickoutside="clickInput"
14
+ >
15
+ <!-- 可编辑 -->
16
+ <dsh-control-input
17
+ :class="commonClass"
18
+ :value="curValList"
19
+ :disabled="disabled"
20
+ :heightAuto="isHeightAuto"
21
+ :propsObj="selfPropsObj"
22
+ @deleteItem="clickDeleteItem"
23
+ @clear="clickClear"
24
+ @click.native="clickInput"
25
+ ></dsh-control-input>
24
26
 
25
- <template #list>
26
- <DropdownMenu class="BriLabels-dropdown-menu">
27
- <DropdownItem
28
- v-for="listItem in listData"
29
- :key="listItem._key"
30
- :class="{
31
- 'item': true,
32
- 'item-active': !!curValList.find(item => item._key === listItem._key)
33
- }"
34
- @click.native="clickItem(listItem)"
35
- >
27
+ <template #list>
28
+ <DropdownMenu class="DshLabels-dropdown-menu">
29
+ <DropdownItem
30
+ v-for="listItem in listData"
31
+ :key="listItem._key"
32
+ :class="{
33
+ 'item': true,
34
+ 'item-active': !!curValList.find(item => item._key === listItem._key)
35
+ }"
36
+ @click.native="clickItem(listItem)"
37
+ >
36
38
 
37
- <div
38
- v-if="listItem.isEdit"
39
- class="item-edit"
39
+ <div
40
+ v-if="listItem.isEdit"
41
+ class="item-edit"
42
+ >
43
+ <Input
44
+ v-model="listItem.name"
45
+ @click.native="clickEditInput($event)"
40
46
  >
41
- <Input
42
- v-model="listItem.name"
43
- @click.native="clickEditInput($event)"
44
- >
45
- <template #suffix>
46
- <Icon
47
- color="#3DB8C5"
48
- custom="bri bri-duigou"
49
- @click.native.stop="clickConfirm(listItem)"
50
- />
51
- </template>
52
- </Input>
53
- </div>
47
+ <template #suffix>
48
+ <Icon
49
+ color="#3DB8C5"
50
+ custom="bri bri-duigou"
51
+ @click.native.stop="clickConfirm(listItem)"
52
+ />
53
+ </template>
54
+ </Input>
55
+ </div>
54
56
 
55
- <div
56
- v-else
57
- class="item-show"
58
- >
59
- {{ listItem.name }}
60
- <span class="item-show-icons">
61
- <Icon
62
- v-if="!listItem.coreLabel"
63
- class="item-show-icons-edit"
64
- custom="bri bri-bianji"
65
- @click.stop="clickEditIcon(listItem)"
66
- />
67
- <!-- 暂时不需要删除 -->
68
- <!-- <Icon
57
+ <div
58
+ v-else
59
+ class="item-show"
60
+ >
61
+ {{ listItem.name }}
62
+ <span class="item-show-icons">
63
+ <Icon
64
+ v-if="!listItem.coreLabel"
65
+ class="item-show-icons-edit"
66
+ custom="bri bri-bianji"
67
+ @click.stop="clickEditIcon(listItem)"
68
+ />
69
+ <!-- 暂时不需要删除 -->
70
+ <!-- <Icon
69
71
  class="item-show-icons-del"
70
72
  custom="bri bri-shanchu"
71
73
  /> -->
72
- </span>
73
- </div>
74
- </DropdownItem>
74
+ </span>
75
+ </div>
76
+ </DropdownItem>
75
77
 
76
- <div
77
- v-if="!onlySelect"
78
- class="btns"
79
- >
80
- <bri-button
81
- class="btns-add"
82
- :propsObj="{
78
+ <div
79
+ v-if="!onlySelect"
80
+ class="btns"
81
+ >
82
+ <bri-button
83
+ class="btns-add"
84
+ :propsObj="{
83
85
  btnType: 'default',
84
86
  icon:'md-add'
85
87
  }"
86
- @click.native.stop="clickAddItem"
87
- >添加选项</bri-button>
88
- </div>
89
- </DropdownMenu>
90
- </template>
91
- </Dropdown>
92
- </template>
88
+ @click.native.stop="clickAddItem"
89
+ >添加选项</bri-button>
90
+ </div>
91
+ </DropdownMenu>
92
+ </template>
93
+ </Dropdown>
94
+ </div>
93
95
 
94
- <!-- 查看 -->
95
- <template v-else>
96
+ <!-- 查看 -->
97
+ <div
98
+ v-else
99
+ class="DshLabels-show"
100
+ >
101
+ <!-- 有值 -->
102
+ <template v-if="!$isEmptyData(curValList)">
103
+ <!-- 高度自由时 -->
104
+ <dsh-tags
105
+ v-if="isHeightAuto"
106
+ :class="{
107
+ ...commonClass,
108
+ 'DshLabels-show-auto': true
109
+ }"
110
+ itemClass="DshLabels-show-auto-tag"
111
+ :list="curValList"
112
+ ></dsh-tags>
113
+
114
+ <!-- 高度不自由(不换行) -->
96
115
  <bri-tooltip
97
- :content="showVal"
98
- maxWidth="200"
116
+ v-else
117
+ :content="showMulVal"
99
118
  :transfer="true"
100
119
  >
101
- <div :class="{
102
- ...commonClass
103
- }">
104
- <dsh-tags
105
- v-if="!$isEmptyData(curValList)"
106
- class="text"
107
- :list="curValList"
108
- ></dsh-tags>
109
-
110
- <template v-else>
111
- {{ emptyShowVal }}
112
- </template>
113
- </div>
120
+ <dsh-tags
121
+ :class="{
122
+ ...commonClass,
123
+ 'DshLabels-show-ellipsis': true
124
+ }"
125
+ itemClass="DshLabels-show-ellipsis-tag"
126
+ :list="curValList"
127
+ ></dsh-tags>
114
128
  </bri-tooltip>
115
129
  </template>
130
+
131
+ <!-- 无值 -->
132
+ <div
133
+ v-else
134
+ :class="commonClass"
135
+ >
136
+ {{ emptyShowVal }}
137
+ </div>
116
138
  </div>
117
139
  </template>
118
140
 
@@ -120,7 +142,7 @@
120
142
  import controlMixin from "../mixins/controlMixin.js";
121
143
 
122
144
  export default {
123
- name: "BriLabels",
145
+ name: "DshLabels",
124
146
  mixins: [
125
147
  controlMixin
126
148
  ],
@@ -153,7 +175,7 @@
153
175
  return this.selfPropsObj._originLabels;
154
176
  },
155
177
 
156
- showVal () {
178
+ showMulVal () {
157
179
  return this.$isEmptyData(this.curValList)
158
180
  ? this.emptyShowVal
159
181
  : this.curValList.map(item => item.name).join("、");
@@ -246,8 +268,10 @@
246
268
  </script>
247
269
 
248
270
  <style lang="less">
249
- .BriLabels {
250
- width: 100%;
271
+ @import url("../control.less");
272
+
273
+ .DshLabels {
274
+ #control-show();
251
275
 
252
276
  &-dropdown {
253
277
  width: 100%;
@@ -6,8 +6,6 @@
6
6
  >
7
7
  <bri-tooltip
8
8
  :content="showVal"
9
- placement="top"
10
- maxWidth="200"
11
9
  :transfer="true"
12
10
  >
13
11
  <div @click="clickInput">
@@ -135,8 +133,6 @@
135
133
  <bri-tooltip
136
134
  v-else
137
135
  :content="showVal"
138
- placement="top"
139
- maxWidth="200"
140
136
  :transfer="true"
141
137
  >
142
138
  <dsh-tags
@@ -323,23 +319,19 @@
323
319
  };
324
320
  </script>
325
321
 
326
- <style lang="less" scoped>
322
+ <style lang="less">
327
323
  @import url("../control.less");
328
324
 
329
325
  .selectDepartments {
330
- width: 100%;
331
-
332
326
  #control-show();
327
+
333
328
  &-show {
334
329
  &-auto,
335
330
  &-ellipsis {
336
331
  margin: 2px 0px;
337
332
  }
338
333
  }
339
- }
340
- </style>
341
- <style lang="less">
342
- .selectDepartments {
334
+
343
335
  // 提示框的
344
336
  &-tip {
345
337
  &-modal {
@@ -6,8 +6,6 @@
6
6
  >
7
7
  <bri-tooltip
8
8
  :content="showVal"
9
- placement="top"
10
- maxWidth="200"
11
9
  :transfer="true"
12
10
  >
13
11
  <div @click="clickInput">
@@ -190,7 +188,7 @@
190
188
  class="selectUsers-show-unit-img"
191
189
  />
192
190
  <span
193
- :key="item._key + 'img'"
191
+ :key="item._key + 'span'"
194
192
  class="selectUsers-show-unit-text"
195
193
  >
196
194
  {{ getShowName(item) }}
@@ -202,8 +200,6 @@
202
200
  <bri-tooltip
203
201
  v-else
204
202
  :content="showVal"
205
- placement="top"
206
- maxWidth="200"
207
203
  :transfer="true"
208
204
  >
209
205
  <div :class="{
@@ -245,8 +241,6 @@
245
241
  <bri-tooltip
246
242
  v-else
247
243
  :content="showVal"
248
- placement="top"
249
- maxWidth="200"
250
244
  :transfer="true"
251
245
  >
252
246
  <dsh-tags
@@ -539,9 +533,8 @@
539
533
  @import url("../../control.less");
540
534
 
541
535
  .selectUsers {
542
- width: 100%;
543
-
544
536
  #control-show();
537
+
545
538
  &-show {
546
539
  &-auto,
547
540
  &-ellipsis {
@@ -567,10 +560,7 @@
567
560
  }
568
561
  }
569
562
  }
570
- }
571
- </style>
572
- <style lang="less">
573
- .selectUsers {
563
+
574
564
  // 提示框的
575
565
  &-tip {
576
566
  &-modal {