lw-cdp-ui 1.3.13 → 1.3.14

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.
@@ -1,19 +1,17 @@
1
1
  <template>
2
- <div>
3
- <el-date-picker :type="item.type || 'date'"
4
- :disabled="item.disabled"
5
- :format="item.format || 'YYYY-MM-DD'"
6
- :value-format="item.valueFormat"
7
- :placeholder="item.placeholder || $t('lwSearch.please_select')"
8
- :range-separator="item.rangeSeparator || $t('lwSearch.monthRange.rangeSeparator')"
9
- :start-placeholder="item.startPlaceholder || $t('lwSearch.monthRange.startPlaceholder')"
10
- :end-placeholder="item.endPlaceholder || $t('lwSearch.monthRange.endPlaceholder')"
11
- clearable
12
- v-model="value"
13
- :disabled-date="disabledDate"
14
- style="width: 100%">
15
- </el-date-picker>
16
- </div>
2
+ <el-date-picker :type="item.type || 'date'"
3
+ :disabled="item.disabled"
4
+ :format="item.format || 'YYYY-MM-DD'"
5
+ :value-format="item.valueFormat"
6
+ :placeholder="item.placeholder || $t('lwSearch.please_select')"
7
+ :range-separator="item.rangeSeparator || $t('lwSearch.monthRange.rangeSeparator')"
8
+ :start-placeholder="item.startPlaceholder || $t('lwSearch.monthRange.startPlaceholder')"
9
+ :end-placeholder="item.endPlaceholder || $t('lwSearch.monthRange.endPlaceholder')"
10
+ clearable
11
+ v-model="value"
12
+ :disabled-date="disabledDate"
13
+ style="width: 100%">
14
+ </el-date-picker>
17
15
  </template>
18
16
 
19
17
  <script>
@@ -1,18 +1,16 @@
1
1
  <template>
2
- <div>
3
- <el-date-picker :showTime="item.showTime"
4
- :format="item.format || 'YYYY-MM-DD HH:mm:ss'"
5
- :value-format="item.valueFormat"
6
- clearable
7
- v-model="value"
8
- style="width: 100%"
9
- type="datetimerange"
10
- :start-placeholder="item.startPlaceholder || $t('lwSearch.dateRange.startPlaceholder')"
11
- :end-placeholder="item.endPlaceholder || $t('lwSearch.dateRange.endPlaceholder')"
12
- :default-time="item.defaultTime || defaultTime(0)"
13
- size="">
14
- </el-date-picker>
15
- </div>
2
+ <el-date-picker :showTime="item.showTime"
3
+ :format="item.format || 'YYYY-MM-DD HH:mm:ss'"
4
+ :value-format="item.valueFormat || 'YYYY-MM-DD HH:mm:ss'"
5
+ clearable
6
+ v-model="value"
7
+ style="width: 100%"
8
+ type="datetimerange"
9
+ :start-placeholder="item.startPlaceholder || $t('lwSearch.dateRange.startPlaceholder')"
10
+ :end-placeholder="item.endPlaceholder || $t('lwSearch.dateRange.endPlaceholder')"
11
+ :default-time="item.defaultTime || defaultTime(0)"
12
+ size="">
13
+ </el-date-picker>
16
14
  </template>
17
15
 
18
16
  <script>
@@ -6,14 +6,12 @@
6
6
  @submit.prevent
7
7
  :label-align="labelAlign"
8
8
  style="width: 100%">
9
- <el-row :class="(options.length - expandNumber === 0) ? 'expand-row' : (options.length - expandNumber < columnNumber) ? '' : isExpandStatus ? ((options.length % columnNumber === 0) ? 'expand-row' : '') : (options.length >= expandNumber ? 'expand-row' : '')"
10
- type="flex"
11
- justify="start"
9
+ <el-row :class="[isExpandRow ? 'expand-row' : '']"
12
10
  :gutter="10">
13
11
  <template v-for="(item, index) in options"
14
12
  :key="item.prop">
15
- <el-col :class="(!isExpandStatus && item.isExpand) ? '' : (options.length - expandNumber < columnNumber) ? '' : (!isExpandStatus && index > (expandNumber - 1) ? 'hide' : '')"
16
- :span="columnNumber ? 24/columnNumber : (item.span || 8)">
13
+ <el-col :class="[isDefaultShow(index) ? '' : isExpandStatus ? '' : 'hide']"
14
+ :span="item?.span ? item.span : 6">
17
15
  <el-form-item :label-width="hideLabel ? 0 : labelWidth"
18
16
  :required="item.required"
19
17
  :label="hideLabel ? '' : $t(item.label)">
@@ -65,7 +63,7 @@
65
63
  {{$t('btn.query')}}
66
64
  </el-button>
67
65
 
68
- <div :class="options.length - expandNumber >= columnNumber ? 'expand-button' : 'hidden'"
66
+ <div :class="isExpandNumber ? 'expand-button' : 'hidden'"
69
67
  @click="handleExpandStatus()">
70
68
  <span>{{ isExpandStatus ? "收起" : "展开" }}</span>
71
69
  </div>
@@ -113,11 +111,6 @@ export default {
113
111
  type: String,
114
112
  default: "left",
115
113
  },
116
- columnNumber: {
117
- // 每行列数量
118
- type: Number,
119
- default: 4,
120
- },
121
114
  isSave: {
122
115
  // 是否保存功能
123
116
  type: Boolean,
@@ -138,11 +131,6 @@ export default {
138
131
  type: Boolean,
139
132
  default: false,
140
133
  },
141
- expandNumber: {
142
- // 默认收起展示数量
143
- type: Number,
144
- default: 4,
145
- },
146
134
  hasExpandAll: {
147
135
  // 默认收起展示数量
148
136
  type: Boolean,
@@ -170,8 +158,8 @@ export default {
170
158
  isSaveShow: false, // 是否展示保存操作
171
159
  isSelectShow: false, // 是否展示选择操作
172
160
  selectForm: "", // 当前选中数据
173
- currentExpandNumber: 4, // 当前收起展示数量
174
161
  isExpandAll: true,
162
+ span: 6,
175
163
  currentTemplate: {},
176
164
  variantList: [],
177
165
  varianId: [],
@@ -203,9 +191,26 @@ export default {
203
191
  deep: true,
204
192
  },
205
193
  },
194
+ computed: {
195
+ // 是否显示展开关闭按钮
196
+ isExpandNumber() {
197
+ let spans = this.options.reduce((sum, item) => sum + (item.span || this.span), 0)
198
+ return (spans - 24) >= 0;
199
+ },
200
+ // 是否行内显示按钮
201
+ isExpandRow() {
202
+ const spans = this.options.reduce((sum, item) => sum + (item.span || this.span), 0);
203
+ const remainder = spans % 24;
204
+
205
+ if (spans > 18) {
206
+ return !this.isExpandStatus || remainder === 0 || (remainder > 15 && remainder < 24);
207
+ }
208
+
209
+ return false
210
+ },
211
+ },
206
212
  mounted() {
207
213
  this.isExpandStatus = this.isExpand;
208
- this.currentExpandNumber = this.expandNumber || this.columnNumber;
209
214
  this.form = JSON.parse(JSON.stringify(this.modelValue));
210
215
  this.defaultForm =
211
216
  JSON.stringify(this.defaultForm) === "{}"
@@ -213,6 +218,11 @@ export default {
213
218
  : this.defaultForm;
214
219
  },
215
220
  methods: {
221
+ // 是否默认展示
222
+ isDefaultShow(index) {
223
+ let span = this.options.slice(0, index + 1).reduce((sum, item) => sum + (item.span || this.span), 0)
224
+ return span <= 24;
225
+ },
216
226
  // 切换展开状态
217
227
  handleExpandStatus() {
218
228
  this.isExpandStatus = !this.isExpandStatus;