lw-cdp-ui 1.4.20 → 1.4.22

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.
@@ -43,6 +43,7 @@
43
43
  :props="item?.options?.props"
44
44
  :separator="item?.options?.separator"
45
45
  :disabled="item?.options?.disabled"
46
+ :placeholder="item?.options?.placeholder"
46
47
  :options="item?.options.items"
47
48
  clearable></el-cascader>
48
49
  </template>
@@ -298,4 +299,4 @@ export default {
298
299
  right: 0;
299
300
  }
300
301
  }
301
- </style>
302
+ </style>
@@ -4,16 +4,24 @@
4
4
  <el-form ref="searchForm" :model="form" @submit.prevent :label-align="labelAlign" style="width: 100%">
5
5
  <el-row :class="[isExpandRow ? 'expand-row' : '']" :gutter="10">
6
6
  <template v-for="(item, index) in defaultOptions" :key="item.prop">
7
- <el-col :class="[isDefaultShow(index) ? '' : isExpandStatus ? '' : 'hide']"
7
+ <el-col
8
+ :class="[isDefaultShow(index) ? '' : isExpandStatus ? '' : 'hide']"
8
9
  :span="item?.span ? item.span : 6">
9
- <el-form-item :label-width="hideLabel ? 0 : labelWidth" :required="item.required"
10
+ <el-form-item
11
+ :label-width="hideLabel ? 0 : labelWidth"
12
+ :required="item.required"
10
13
  :label="hideLabel ? '' : $t(item.label)">
11
-
12
14
  <!-- cascader 组个组件有问题 动态加载下拉文字不会显示 -->
13
15
  <template v-if="item.component == 'cascader'">
14
- <el-cascader v-model="form[item.name]" style="width: 100%;" :props="item?.options?.props"
15
- :separator="item?.options?.separator" :disabled="item?.options?.disabled"
16
- :options="item?.options.items" clearable></el-cascader>
16
+ <el-cascader
17
+ v-model="form[item.name]"
18
+ style="width: 100%"
19
+ :props="item?.options?.props"
20
+ :separator="item?.options?.separator"
21
+ :disabled="item?.options?.disabled"
22
+ :placeholder="item?.options?.placeholder"
23
+ :options="item?.options.items"
24
+ clearable></el-cascader>
17
25
  </template>
18
26
  <!-- 动态组件 -->
19
27
  <template v-else-if="componentType.includes(item.component)">
@@ -33,7 +41,7 @@
33
41
  </el-button>
34
42
 
35
43
  <div :class="isExpandNumber ? 'expand-button' : 'hidden'" @click="handleExpandStatus()">
36
- <span>{{ isExpandStatus ? "收起" : "展开" }}</span>
44
+ <span>{{ isExpandStatus ? '收起' : '展开' }}</span>
37
45
  </div>
38
46
  </div>
39
47
  </el-form>
@@ -171,7 +179,7 @@ export default {
171
179
  },
172
180
  // 用来兼容旧配置
173
181
  defaultOptions() {
174
- return this.options.map(item => {
182
+ return this.options.map((item) => {
175
183
  const { label, span, prop: name, renderType: component, placeholder = label, ...other } = item || {}
176
184
  const componentObj = { label, name, component, span }
177
185
 
@@ -195,7 +203,7 @@ export default {
195
203
  ...componentObj,
196
204
  options: {
197
205
  ...baseOptions,
198
- items: item.options?.map(x => ({
206
+ items: item.options?.map((x) => ({
199
207
  label: x[item.labelKey || 'label'],
200
208
  value: x[item.valueKey || 'value']
201
209
  }))
@@ -212,11 +220,13 @@ export default {
212
220
  }
213
221
 
214
222
  case 'input':
215
- default:
216
223
  return {
217
224
  ...componentObj,
218
225
  options: baseOptions
219
226
  }
227
+ // 未定义的类型不要在定义 采用lwFormMini组件配置同样的参数
228
+ default:
229
+ return item
220
230
  }
221
231
  })
222
232
  }
@@ -241,7 +251,7 @@ export default {
241
251
  // 触发提交
242
252
  submitForm(formEl) {
243
253
  if (!this.$refs[formEl]) return
244
- this.$refs[formEl].validate(valid => {
254
+ this.$refs[formEl].validate((valid) => {
245
255
  if (valid) {
246
256
  console.log(this.form)
247
257
  this.$emit('search')
@@ -360,7 +370,7 @@ export default {
360
370
  padding-right: 5px;
361
371
  cursor: pointer;
362
372
 
363
- &>span {
373
+ & > span {
364
374
  color: #505050;
365
375
  font-size: 12px;
366
376
  }
@@ -386,13 +396,13 @@ export default {
386
396
  width: 84px;
387
397
  height: 30px;
388
398
 
389
- &>span {
399
+ & > span {
390
400
  padding-right: 10px;
391
401
  padding-left: 10px;
392
402
  border-right: 1px solid #fff;
393
403
  }
394
404
 
395
- &>i {
405
+ & > i {
396
406
  padding-left: 10px;
397
407
  }
398
408
  }
@@ -419,9 +429,8 @@ export default {
419
429
  width: 100%;
420
430
 
421
431
  .el-select__tags {
422
-
423
432
  // max-width: calc(100% - 0px) !important;
424
- &>span {
433
+ & > span {
425
434
  max-width: 100%;
426
435
 
427
436
  .el-tag--info {
@@ -434,7 +443,6 @@ export default {
434
443
  }
435
444
 
436
445
  &:nth-child(2) {
437
-
438
446
  // display: none;
439
447
  .arco-select__tags-text {
440
448
  max-width: 100% !important;
@@ -454,7 +462,7 @@ export default {
454
462
  display: flex;
455
463
  flex-wrap: nowrap;
456
464
 
457
- &>span {
465
+ & > span {
458
466
  display: flex;
459
467
  flex-wrap: nowrap;
460
468
  }
@@ -1,27 +1,28 @@
1
1
  <template>
2
- <el-table :data="dataList || []"
3
- stripe
4
- ref="table"
5
- :columns="config.formItems || []"
6
- :max-height="maxHeight"
7
- :row-key="config.rowKey || 'tableUUID'"
8
- :tree-props="config?.treeProps || { children: 'children', hasChildren: 'hasChildren' }"
9
- style="width: 100%">
10
- <el-table-column v-for="(item, index) in config?.formItems || []"
11
- :width="item.width"
12
- :min-width="item.minWidth"
13
- :key="index"
14
- :label="item.label"
15
- :prop="getPropName(item)"
16
- :align="item.align ?? 'left'"
17
- :fixed="item.fixed"
18
- :sortable="item.sortable"
19
- :show-overflow-tooltip="item.tooltip"
20
- :filters="item.filters ? getFilters(item.name) : null"
21
- :filter-method="item.filters ? filterHandler : null">
2
+ <el-table
3
+ :data="dataList || []"
4
+ stripe
5
+ ref="table"
6
+ :columns="config.formItems || []"
7
+ :max-height="maxHeight"
8
+ :row-key="config.rowKey || 'tableUUID'"
9
+ :tree-props="config?.treeProps || { children: 'children', hasChildren: 'hasChildren' }"
10
+ style="width: 100%">
11
+ <el-table-column
12
+ v-for="(item, index) in config?.formItems || []"
13
+ :width="item.width"
14
+ :min-width="item.minWidth"
15
+ :key="index"
16
+ :label="item.label"
17
+ :prop="getPropName(item)"
18
+ :align="item.align ?? 'left'"
19
+ :fixed="item.fixed"
20
+ :sortable="item.sortable"
21
+ :show-overflow-tooltip="item.tooltip"
22
+ :filters="item.filters ? getFilters(item.name) : null"
23
+ :filter-method="item.filters ? filterHandler : null">
22
24
  <template #header>
23
- <div class="table-name"
24
- :style="{ justifyContent: item.align || 'flex-start'}">
25
+ <div class="table-name" :style="{ justifyContent: item.align || 'flex-start' }">
25
26
  <span v-if="item?.rules">*</span>
26
27
  {{ item.label }}
27
28
  </div>
@@ -29,64 +30,70 @@
29
30
  <template #default="{ row, $index, column }">
30
31
  <!-- cascader 组个组件有问题 动态加载下拉文字不会显示 -->
31
32
  <template v-if="item.component == 'cascader'">
32
- <el-cascader v-model="row[item.name]"
33
- style="width: 100%;"
34
- :props="item?.options?.props"
35
- :separator="item?.options?.separator"
36
- :disabled="item?.options?.disabled"
37
- :options="item?.options.items"
38
- clearable></el-cascader>
33
+ <el-cascader
34
+ v-model="row[item.name]"
35
+ style="width: 100%"
36
+ :props="item?.options?.props"
37
+ :separator="item?.options?.separator"
38
+ :disabled="item?.options?.disabled"
39
+ :placeholder="item?.options?.placeholder"
40
+ :options="item?.options.items"
41
+ clearable></el-cascader>
39
42
  </template>
40
43
  <!-- 动态组件 -->
41
44
  <template v-else-if="componentType.includes(item.component)">
42
- <FormComponent v-model="row[item.name]"
43
- :size="config.size || 'small'"
44
- :item="item"
45
- :disabled="isDisabled(item, row)" />
45
+ <FormComponent
46
+ v-model="row[item.name]"
47
+ :size="config.size || 'small'"
48
+ :item="item"
49
+ :disabled="isDisabled(item, row)" />
46
50
  </template>
47
51
 
48
52
  <!-- 特殊组件处理 -->
49
53
  <template v-else-if="item.component === 'upload'">
50
- <el-col v-for="(_item, _index) in item.options.items"
51
- :key="_index">
52
- <lw-upload v-model="row[_item.name]"
53
- :height="_item?.height || item.height"
54
- :width="_item?.width || item.width"
55
- :maxSize="_item.maxSize"
56
- :iconSize="_item.iconSize"
57
- :accept="_item.accept"
58
- :title="_item.label"
59
- :parseData="item.parseData"
60
- :disabled="_item?.disabled"
61
- :multiple="_item?.multiple"
62
- :limit="_item?.limit"
63
- :returnFile="_item?.returnFile"
64
- :tip="_item?.tip"
65
- :apiObj="item.apiObj" />
54
+ <el-col v-for="(_item, _index) in item.options.items" :key="_index">
55
+ <lw-upload
56
+ v-model="row[_item.name]"
57
+ :height="_item?.height || item.height"
58
+ :width="_item?.width || item.width"
59
+ :maxSize="_item.maxSize"
60
+ :iconSize="_item.iconSize"
61
+ :accept="_item.accept"
62
+ :title="_item.label"
63
+ :parseData="item.parseData"
64
+ :disabled="_item?.disabled"
65
+ :multiple="_item?.multiple"
66
+ :limit="_item?.limit"
67
+ :returnFile="_item?.returnFile"
68
+ :tip="_item?.tip"
69
+ :apiObj="item.apiObj" />
66
70
  <div class="error-tips">{{ row['errorMsg']?.[_item.name] }}</div>
67
71
  </el-col>
68
72
  </template>
69
73
 
70
74
  <template v-else-if="item.component === 'tags'">
71
75
  <div class="tags-list">
72
- <el-tag v-for="tag in row[item.name]"
73
- :key="tag"
74
- closable
75
- :disable-transitions="false"
76
- @close="tagClose(tag, row[item.name])">
76
+ <el-tag
77
+ v-for="tag in row[item.name]"
78
+ :key="tag"
79
+ closable
80
+ :disable-transitions="false"
81
+ @close="tagClose(tag, row[item.name])">
77
82
  {{ tag }}
78
83
  </el-tag>
79
- <el-input v-if="row?.tagVisible"
80
- v-model="tagValue"
81
- class="w-20"
82
- :size="config.size || 'small'"
83
- @keyup.enter="tagInputConfirm(item, row)"
84
- @blur="tagInputConfirm(item, row)" />
85
- <el-button v-else
86
- class="button-new-tag"
87
- :size="config.size || 'small'"
88
- :disabled="isDisabled(item, row)"
89
- @click="row.tagVisible = true">
84
+ <el-input
85
+ v-if="row?.tagVisible"
86
+ v-model="tagValue"
87
+ class="w-20"
88
+ :size="config.size || 'small'"
89
+ @keyup.enter="tagInputConfirm(item, row)"
90
+ @blur="tagInputConfirm(item, row)" />
91
+ <el-button
92
+ v-else
93
+ class="button-new-tag"
94
+ :size="config.size || 'small'"
95
+ :disabled="isDisabled(item, row)"
96
+ @click="row.tagVisible = true">
90
97
  + 添加
91
98
  </el-button>
92
99
  </div>
@@ -95,87 +102,74 @@
95
102
  <!-- 按钮 -->
96
103
  <template v-else-if="item.component == 'operation'">
97
104
  <!-- 默认新增/删除 -->
98
- <span v-for="o in item.options.addDelete"
99
- :key="o"
100
- v-show="o.isShow ? o.isShow(row) : true">
101
- <el-tooltip v-if="o.icon"
102
- :content="o.label"
103
- placement="top">
104
- <el-button type="primary"
105
- :size="config.size || 'small'"
106
- @click="o.clickFun ? o.clickFun(row, $index, column, tableData) : clickFun(o.type, row, $index)"
107
- :disabled="isDisabled(o, row)"
108
- :icon="o.icon"
109
- circle></el-button>
105
+ <span v-for="o in item.options.addDelete" :key="o" v-show="o.isShow ? o.isShow(row) : true">
106
+ <el-tooltip v-if="o.icon" :content="o.label" placement="top">
107
+ <el-button
108
+ type="primary"
109
+ :size="config.size || 'small'"
110
+ @click="o.clickFun ? o.clickFun(row, $index, column, tableData) : clickFun(o.type, row, $index)"
111
+ :disabled="isDisabled(o, row)"
112
+ :icon="o.icon"
113
+ circle></el-button>
110
114
  </el-tooltip>
111
- <el-button v-else
112
- type="primary"
113
- text
114
- :size="config.size || 'small'"
115
- @click="o.clickFun ? o.clickFun(row, $index, column, tableData) : clickFun(o.type, row, $index)"
116
- :disabled="isDisabled(o, row)">
115
+ <el-button
116
+ v-else
117
+ type="primary"
118
+ text
119
+ :size="config.size || 'small'"
120
+ @click="o.clickFun ? o.clickFun(row, $index, column, tableData) : clickFun(o.type, row, $index)"
121
+ :disabled="isDisabled(o, row)">
117
122
  {{ o.label }}
118
123
  </el-button>
119
124
  </span>
120
125
 
121
126
  <!-- 自定义按钮 省略号 -->
122
127
  <el-dropdown v-if="item.options?.items && item.options.items.length > 0">
123
- <el-button :size="config.size || 'small'"
124
- type="primary"
125
- :disabled="isDisabled(item, row)"
126
- link>
127
- <el-icon class="more-btn"
128
- size="16"><el-icon-more-filled /></el-icon>
128
+ <el-button :size="config.size || 'small'" type="primary" :disabled="isDisabled(item, row)" link>
129
+ <el-icon class="more-btn" size="16"><el-icon-more-filled /></el-icon>
129
130
  </el-button>
130
131
 
131
132
  <template #dropdown>
132
133
  <el-dropdown-menu>
133
- <el-dropdown-item v-for="o in item.options.items.filter(o => !o.isShow || o.isShow(row))"
134
- :key="o"
135
- @click="o.clickFun(row, $index, column, tableData)">
134
+ <el-dropdown-item
135
+ v-for="o in item.options.items.filter((o) => !o.isShow || o.isShow(row))"
136
+ :key="o"
137
+ @click="o.clickFun(row, $index, column, tableData)">
136
138
  {{ o.label }}
137
139
  </el-dropdown-item>
138
140
  </el-dropdown-menu>
139
141
  </template>
140
-
141
142
  </el-dropdown>
142
143
  </template>
143
144
 
144
145
  <!-- 没有组件是component值 就是插槽名称 -->
145
146
  <template v-else>
146
- <slot :name="item.component"
147
- :row="row">
148
- <el-tag type="danger">[{{item.component}}]
149
- 没有这个默认组件也未自定义插槽内容</el-tag>
147
+ <slot :name="item.component" :row="row">
148
+ <el-tag type="danger">[{{ item.component }}] 没有这个默认组件也未自定义插槽内容</el-tag>
150
149
  </slot>
151
150
  </template>
152
- <div v-if="item.message"
153
- class="el-row-item-msg">{{item.message}}</div>
151
+ <div v-if="item.message" class="el-row-item-msg">{{ item.message }}</div>
154
152
 
155
153
  <!-- 错误提示 -->
156
- <div v-if="row.errorMsg"
157
- class="error-tips">
154
+ <div v-if="row.errorMsg" class="error-tips">
158
155
  {{ row['errorMsg'][item?.name] }}
159
156
  </div>
160
157
  </template>
161
158
  </el-table-column>
162
159
  </el-table>
163
- <div v-if="isPagination && tableData.length > pageSize"
164
- class="pagination-body">
165
- <el-pagination size="small"
166
- background
167
- :page-size="pageSize"
168
- v-model:current-page="currentPage"
169
- layout="prev, pager, next"
170
- :total="tableData.length" />
160
+ <div v-if="isPagination && tableData.length > pageSize" class="pagination-body">
161
+ <el-pagination
162
+ size="small"
163
+ background
164
+ :page-size="pageSize"
165
+ v-model:current-page="currentPage"
166
+ layout="prev, pager, next"
167
+ :total="tableData.length" />
171
168
  </div>
172
- <div v-if="!isView && showAddBtn"
173
- class="btn-list">
174
- <el-button type="primary"
175
- class="add-btn"
176
- plain
177
- icon="el-icon-plus"
178
- @click="addItem()">{{ $t('btn.add') }}</el-button>
169
+ <div v-if="!isView && showAddBtn" class="btn-list">
170
+ <el-button type="primary" class="add-btn" plain icon="el-icon-plus" @click="addItem()">{{
171
+ $t('btn.add')
172
+ }}</el-button>
179
173
  <slot name="deleteBtn"></slot>
180
174
  </div>
181
175
  </template>
@@ -190,17 +184,17 @@ export default {
190
184
  FormComponent
191
185
  },
192
186
  props: {
193
- modelValue: {type: Object, default: () => {}},
194
- config: {type: Object, default: () => {}},
187
+ modelValue: { type: Object, default: () => {} },
188
+ config: { type: Object, default: () => {} },
195
189
  // 需要携带参数
196
- itemConfig: {type: Object, default: () => {}},
197
- maxHeight: {type: String, default: 'calc(100vh - 280px)'},
190
+ itemConfig: { type: Object, default: () => {} },
191
+ maxHeight: { type: String, default: 'calc(100vh - 280px)' },
198
192
  // 是否是查看模式
199
- isView: {type: Boolean, default: false},
193
+ isView: { type: Boolean, default: false },
200
194
  // 是否分页
201
- isPagination: {type: Boolean, default: false},
195
+ isPagination: { type: Boolean, default: false },
202
196
  // 是否显示添加
203
- showAddBtn: {type: Boolean, default: true}
197
+ showAddBtn: { type: Boolean, default: true }
204
198
  },
205
199
  inject: ['componentType'],
206
200
  data() {
@@ -281,7 +275,7 @@ export default {
281
275
 
282
276
  return result
283
277
  }
284
- array?.forEach(obj => {
278
+ array?.forEach((obj) => {
285
279
  list.push(getObj(obj))
286
280
  })
287
281
 
@@ -289,7 +283,7 @@ export default {
289
283
  },
290
284
  unflattenObject(array) {
291
285
  let list = []
292
- array?.forEach(obj => {
286
+ array?.forEach((obj) => {
293
287
  const result = {}
294
288
  for (let key in obj) {
295
289
  if (obj.hasOwnProperty(key)) {
@@ -321,13 +315,13 @@ export default {
321
315
  isValue(tableData, formItems) {
322
316
  // 校验 tableData 中的字段
323
317
  const validationMessages = []
324
- tableData.forEach(data => {
325
- formItems.forEach(item => {
318
+ tableData.forEach((data) => {
319
+ formItems.forEach((item) => {
326
320
  if (item.rules && item.rules.length > 0) {
327
- item.rules.forEach(rule => {
321
+ item.rules.forEach((rule) => {
328
322
  let isVal = false
329
323
  if (item.component == 'checkbox' || item.component == 'upload') {
330
- item.options.items.forEach(option => {
324
+ item.options.items.forEach((option) => {
331
325
  if (this.isEmpty(data[option.name])) {
332
326
  if (!data?.errorMsg) {
333
327
  data.errorMsg = {}
@@ -372,16 +366,16 @@ export default {
372
366
  return false
373
367
  }
374
368
 
375
- formItems.forEach(item => {
369
+ formItems.forEach((item) => {
376
370
  if (item.component == 'checkbox' || item.component == 'upload') {
377
371
  if (item.name) {
378
372
  const value = []
379
- item.options.items.forEach(option => {
373
+ item.options.items.forEach((option) => {
380
374
  value.push(option.value)
381
375
  })
382
376
  form[item.name] = value
383
377
  } else if (item?.options?.items) {
384
- item.options.items.forEach(option => {
378
+ item.options.items.forEach((option) => {
385
379
  form[option.name] = option.value
386
380
  })
387
381
  }
@@ -434,7 +428,7 @@ export default {
434
428
  },
435
429
  //合并深结构对象
436
430
  deepMerge(obj1, obj2) {
437
- obj2.forEach(item => {
431
+ obj2.forEach((item) => {
438
432
  if (obj2.hasOwnProperty(key)) {
439
433
  // 确保 obj1[key] 和 obj2[key] 不是 null 或 undefined
440
434
  const isObj1Valid = obj1[key] !== null && obj1[key] !== undefined
@@ -483,12 +477,12 @@ export default {
483
477
  },
484
478
  getFilters(name) {
485
479
  let list = []
486
- this.tableData.forEach(item => {
480
+ this.tableData.forEach((item) => {
487
481
  if (!list.includes(item[name])) {
488
482
  list.push(item[name])
489
483
  }
490
484
  })
491
- return list.map(item => ({
485
+ return list.map((item) => ({
492
486
  text: item,
493
487
  value: item
494
488
  }))
@@ -544,4 +538,4 @@ export default {
544
538
  display: flex;
545
539
  justify-content: flex-end;
546
540
  }
547
- </style>
541
+ </style>