lw-cdp-ui 1.1.8 → 1.1.10

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 (9) hide show
  1. package/dist/components/lwCronSelect/index.vue +4 -1
  2. package/dist/components/lwForm/index.vue +51 -38
  3. package/dist/components/lwUpload/index.vue +51 -14
  4. package/dist/lw-cdp-ui.esm.js +3201 -4753
  5. package/dist/lw-cdp-ui.esm.js.map +1 -1
  6. package/dist/lw-cdp-ui.umd.js +14 -19
  7. package/dist/lw-cdp-ui.umd.js.map +1 -1
  8. package/dist/style.css +1 -1
  9. package/package.json +12 -10
package/dist/components/lwCronSelect/index.vue CHANGED
@@ -93,7 +93,10 @@ import { ref, computed } from 'vue';
93
93
  export default {
94
94
  name: 'lwCronSelect',
95
95
  props: {
96
- disabled: Boolean,
96
+ disabled: {
97
+ type: Boolean,
98
+ default: false
99
+ },
97
100
  modelValue: {
98
101
  type: String,
99
102
  default: ''
package/dist/components/lwForm/index.vue CHANGED
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <el-skeleton v-if="renderLoading || Object.keys(form).length==0"
2
+ <el-skeleton v-if="renderLoading || Object.keys(form).length == 0"
3
3
  animated />
4
4
 
5
5
  <el-form v-else
@@ -29,7 +29,7 @@
29
29
  :prop="item?.options?.name ? `${item.name}.${item.options.name}` : item.name"
30
30
  :rules="rulesHandle(item)">
31
31
  <template #label>
32
- {{item.label}}
32
+ {{ item.label }}
33
33
  <el-tooltip v-if="item.tips"
34
34
  :content="item.tips">
35
35
  <el-icon><el-icon-question-filled /></el-icon>
@@ -37,7 +37,7 @@
37
37
  </template>
38
38
 
39
39
  <!-- input -->
40
- <template v-if="item.component=='input'">
40
+ <template v-if="item.component == 'input'">
41
41
  <template v-if="item?.options?.name">
42
42
  <el-input v-model="form[item.name][item.options.name]"
43
43
  :placeholder="item.options.placeholder"
@@ -47,7 +47,7 @@
47
47
  :maxlength="item.options.maxlength"
48
48
  show-word-limit>
49
49
  <template v-if="item.options.append"
50
- #append>{{item.options.append}}</template>
50
+ #append>{{ item.options.append }}</template>
51
51
  </el-input>
52
52
  </template>
53
53
  <template v-else>
@@ -59,35 +59,39 @@
59
59
  :maxlength="item.options.maxlength"
60
60
  show-word-limit>
61
61
  <template v-if="item.options.append"
62
- #append>{{item.options.append}}</template>
62
+ #append>{{ item.options.append }}</template>
63
63
  </el-input>
64
64
  </template>
65
65
  </template>
66
66
  <!-- upload -->
67
- <template v-else-if="item.component=='upload'">
67
+ <template v-else-if="item.component == 'upload'">
68
68
  <template v-for="(_item, _index) in item.options.items"
69
69
  :key="_index">
70
70
  <template v-if="item.name">
71
- <el-form-item :prop="_item.name">
71
+ <div style="margin-right: 5px;">
72
72
  <lw-upload v-model="form[item.name][_item.name]"
73
73
  :maxSize="_item.maxSize"
74
74
  :accept="_item.accept"
75
- :title="_item.label"></lw-upload>
76
- </el-form-item>
75
+ :title="_item.label"
76
+ :parseData="item.parseData"
77
+ :apiObj="item.apiObj"></lw-upload>
78
+ </div>
77
79
  </template>
78
80
  <template v-else>
79
- <el-form-item :prop="_item.name">
81
+ <div style="margin-right: 5px;">
80
82
  <lw-upload v-model="form[_item.name]"
81
83
  :maxSize="_item.maxSize"
82
84
  :accept="_item.accept"
83
- :title="_item.label"></lw-upload>
84
- </el-form-item>
85
+ :title="_item.label"
86
+ :parseData="item.parseData"
87
+ :apiObj="item.apiObj"></lw-upload>
88
+ </div>
85
89
  </template>
86
90
 
87
91
  </template>
88
92
  </template>
89
93
  <!-- checkbox -->
90
- <template v-else-if="item.component=='checkbox'">
94
+ <template v-else-if="item.component == 'checkbox'">
91
95
  <template v-if="item.name">
92
96
  <el-checkbox v-model="form[item.name][_item.name]"
93
97
  :label="_item.label"
@@ -102,16 +106,16 @@
102
106
  </template>
103
107
  </template>
104
108
  <!-- checkboxGroup -->
105
- <template v-else-if="item.component=='checkboxGroup'">
109
+ <template v-else-if="item.component == 'checkboxGroup'">
106
110
  <el-checkbox-group v-model="form[item.name]">
107
111
  <el-checkbox v-for="_item in item.options.items"
108
112
  :key="_item.value"
109
- :label="_item.value">{{_item.label}}</el-checkbox>
113
+ :label="_item.value">{{ _item.label }}</el-checkbox>
110
114
  </el-checkbox-group>
111
115
  </template>
112
116
 
113
117
  <!-- switch -->
114
- <template v-else-if="item.component=='switch'">
118
+ <template v-else-if="item.component == 'switch'">
115
119
  <template v-if="item?.options?.name">
116
120
  <el-switch v-model="form[item.name][item.options.name]" />
117
121
  </template>
@@ -120,7 +124,7 @@
120
124
  </template>
121
125
  </template>
122
126
  <!-- select -->
123
- <template v-else-if="item.component=='select'">
127
+ <template v-else-if="item.component == 'select'">
124
128
  <template v-if="item?.options?.name">
125
129
  <el-select v-model="form[item.name][item.options.name]"
126
130
  :multiple="item.options?.multiple"
@@ -156,21 +160,23 @@
156
160
 
157
161
  </template>
158
162
  <!-- cascader -->
159
- <template v-else-if="item.component=='cascader'">
163
+ <template v-else-if="item.component == 'cascader'">
160
164
  <template v-if="item?.options?.name">
161
165
  <el-cascader v-model="form[item.name][item.options.name]"
166
+ style="width: 100%;"
162
167
  :options="item.options.items"
163
168
  clearable></el-cascader>
164
169
  </template>
165
170
  <template v-else>
166
171
  <el-cascader v-model="form[item.name]"
172
+ style="width: 100%;"
167
173
  :options="item.options.items"
168
174
  clearable></el-cascader>
169
175
  </template>
170
176
 
171
177
  </template>
172
178
  <!-- date -->
173
- <template v-else-if="item.component=='date'">
179
+ <template v-else-if="item.component == 'date'">
174
180
  <template v-if="item?.options?.name">
175
181
  <el-date-picker v-model="form[item.name][item.options.name]"
176
182
  style="width: 100%;"
@@ -182,6 +188,7 @@
182
188
  :default-time="item.options.defaultTime"
183
189
  :disabled="item.options.disabled"
184
190
  :value-format="item.options.valueFormat"
191
+ :format="item.options.format"
185
192
  :placeholder="item.options.placeholder || '请选择'"></el-date-picker>
186
193
  </template>
187
194
  <template v-else>
@@ -195,52 +202,53 @@
195
202
  :default-time="item.options.defaultTime"
196
203
  :disabled="item.options.disabled"
197
204
  :value-format="item.options.valueFormat"
205
+ :format="item.options.format"
198
206
  :placeholder="item.options.placeholder || '请选择'"></el-date-picker>
199
207
  </template>
200
208
 
201
209
  </template>
202
210
  <!-- number -->
203
- <template v-else-if="item.component=='number'">
211
+ <template v-else-if="item.component == 'number'">
204
212
  <template v-if="item?.options?.name">
205
213
  <el-input-number v-model="form[item.name][item.options.name]"
206
- :disabled="item.options.disabled"
214
+ :disabled="item.options?.disabled"
207
215
  :min="item?.options?.min"
208
216
  :max="item?.options?.max"
209
217
  :step="item?.options?.step || 1"
210
218
  :precision="item?.options?.precision"
211
- :placeholder=" item?.options?.placeholder || ''"
219
+ :placeholder="item?.options?.placeholder || ''"
212
220
  :controls-position="item?.options?.controlsPosition || 'right'">
213
221
  <template v-if="item?.options?.suffix"
214
222
  #suffix>
215
- <span>{{item.options.suffix}}</span>
223
+ <span>{{ item.options.suffix }}</span>
216
224
  </template>
217
225
  </el-input-number>
218
226
  </template>
219
227
  <template v-else>
220
228
  <el-input-number v-model="form[item.name]"
221
- :disabled="item.options.disabled"
229
+ :disabled="item.options?.disabled"
222
230
  :min="item?.options?.min"
223
231
  :max="item?.options?.max"
224
232
  :step="item?.options?.step || 1"
225
233
  :precision="item?.options?.precision"
226
- :placeholder=" item?.options?.placeholder || ''"
234
+ :placeholder="item?.options?.placeholder || ''"
227
235
  :controls-position="item?.options?.controlsPosition || 'right'">
228
236
  <template v-if="item?.options?.suffix"
229
237
  #suffix>
230
- <span>{{item.options.suffix}}</span>
238
+ <span>{{ item.options.suffix }}</span>
231
239
  </template>
232
240
  </el-input-number>
233
241
  </template>
234
242
 
235
243
  </template>
236
244
  <!-- radio -->
237
- <template v-else-if="item.component=='radio'">
245
+ <template v-else-if="item.component == 'radio'">
238
246
  <template v-if="item?.options?.name">
239
247
  <el-radio-group v-model="form[item.name][item.options.name]"
240
248
  :disabled="item.options.disabled">
241
249
  <el-radio v-for="_item in item.options.items"
242
250
  :key="_item.value"
243
- :label="_item.value">{{_item.label}}</el-radio>
251
+ :label="_item.value">{{ _item.label }}</el-radio>
244
252
  </el-radio-group>
245
253
  </template>
246
254
  <template v-else>
@@ -248,13 +256,13 @@
248
256
  :disabled="item.options.disabled">
249
257
  <el-radio v-for="_item in item.options.items"
250
258
  :key="_item.value"
251
- :label="_item.value">{{_item.label}}</el-radio>
259
+ :label="_item.value">{{ _item.label }}</el-radio>
252
260
  </el-radio-group>
253
261
  </template>
254
262
 
255
263
  </template>
256
264
  <!-- color -->
257
- <template v-else-if="item.component=='color'">
265
+ <template v-else-if="item.component == 'color'">
258
266
  <template v-if="item?.options?.name">
259
267
  <el-color-picker v-model="form[item.name][item.options.name]" />
260
268
  </template>
@@ -264,7 +272,7 @@
264
272
 
265
273
  </template>
266
274
  <!-- rate -->
267
- <template v-else-if="item.component=='rate'">
275
+ <template v-else-if="item.component == 'rate'">
268
276
  <template v-if="item?.options?.name">
269
277
  <el-rate style="margin-top: 6px;"
270
278
  v-model="form[item.name][item.options.name]"></el-rate>
@@ -276,7 +284,7 @@
276
284
 
277
285
  </template>
278
286
  <!-- slider -->
279
- <template v-else-if="item.component=='slider'">
287
+ <template v-else-if="item.component == 'slider'">
280
288
  <template v-if="item?.options?.name">
281
289
  <el-slider v-model="form[item.name][item.options.name]"
282
290
  :marks="item.options.marks"></el-slider>
@@ -289,7 +297,7 @@
289
297
  </template>
290
298
 
291
299
  <!-- tags -->
292
- <template v-else-if="item.component=='tags'">
300
+ <template v-else-if="item.component == 'tags'">
293
301
  <div class="tags-list">
294
302
  <template v-if="item?.options?.name">
295
303
  <el-tag v-for="tag in form[item.name][item?.options?.name]"
@@ -328,12 +336,12 @@
328
336
  <!-- 没有组件是component值 就是插槽名称 -->
329
337
  <template v-else>
330
338
  <slot :name="item.component">
331
- <el-tag type="danger">[{{item.component}}]
339
+ <el-tag type="danger">[{{ item.component }}]
332
340
  没有这个默认组件也未自定义插槽内容</el-tag>
333
341
  </slot>
334
342
  </template>
335
343
  <div v-if="item.message"
336
- class="el-form-item-msg">{{item.message}}</div>
344
+ class="el-form-item-msg">{{ item.message }}</div>
337
345
  </el-form-item>
338
346
  </el-col>
339
347
  </template>
@@ -563,14 +571,19 @@ export default {
563
571
  }
564
572
  </script>
565
573
  <style lang="scss" scoped>
566
- .button-new-tag {
574
+ .button-new-tag
575
+ {
567
576
  margin-left: 10px;
568
577
  }
569
- .w-20 {
578
+
579
+ .w-20
580
+ {
570
581
  width: 100px;
571
582
  margin-left: 10px;
572
583
  }
573
- .title-name {
584
+
585
+ .title-name
586
+ {
574
587
  font-size: 18px;
575
588
  font-weight: bold;
576
589
  margin-bottom: 10px;
package/dist/components/lwUpload/index.vue CHANGED
@@ -1,6 +1,6 @@
1
1
  <template>
2
2
  <div class="lw-upload"
3
- :class="{'lw-upload-round':round}"
3
+ :class="{ 'lw-upload-round': round }"
4
4
  :style="style">
5
5
  <div v-if="file && file.status != 'success'"
6
6
  class="lw-upload__uploading">
@@ -13,7 +13,7 @@
13
13
  :src="file.tempFile"
14
14
  fit="cover"></el-image>
15
15
  </div>
16
- <div v-if="file && file.status=='success'"
16
+ <div v-if="file && file.status == 'success'"
17
17
  class="lw-upload__img">
18
18
  <el-image class="image"
19
19
  :src="file.url"
@@ -57,13 +57,12 @@
57
57
  <el-icon>
58
58
  <component :is="icon" />
59
59
  </el-icon>
60
- <h4 v-if="title">{{title}}</h4>
60
+ <h4 v-if="title">{{ title }}</h4>
61
61
  </div>
62
62
  </div>
63
63
  </slot>
64
64
  </el-upload>
65
- <span style="display:none!important"><el-input
66
- v-model="value"></el-input></span>
65
+ <span style="display:none!important"><el-input v-model="value"></el-input></span>
67
66
 
68
67
  </div>
69
68
  </template>
@@ -71,13 +70,33 @@
71
70
  <script>
72
71
  export default {
73
72
  name: 'lwUpload',
73
+ /**
74
+ * @property {String} modelValue - 绑定的值，默认为空字符串
75
+ * @property {Number} height - 上传组件的高度，默认为 148
76
+ * @property {Number} width - 上传组件的宽度，默认为 148
77
+ * @property {String} title - 上传组件的标题，默认为空字符串
78
+ * @property {String} icon - 上传按钮的图标，默认为 'el-icon-plus'
79
+ * @property {String|Function} action - 上传的地址或函数，默认为空函数
80
+ * @property {Object} apiObj - API 对象配置，默认为空对象
81
+ * @property {String} name - 表单提交的文件字段名，默认为 'file'
82
+ * @property {Object} data - 上传时附带的额外参数，默认为空对象
83
+ * @property {String} accept - 允许上传的文件类型，默认为 'image/gif, image/jpeg, image/png'
84
+ * @property {Number} maxSize - 文件的最大大小，默认为 10MB
85
+ * @property {Number} limit - 允许上传的最大文件数，默认为 1
86
+ * @property {Boolean} autoUpload - 是否自动上传，默认为 true
87
+ * @property {Boolean} showFileList - 是否显示已上传文件列表，默认为 false
88
+ * @property {Boolean} disabled - 是否禁用上传功能，默认为 false
89
+ * @property {Boolean} round - 是否显示圆角按钮，默认为 false
90
+ * @property {Function} onSuccess - 上传成功后的回调函数，默认为空函数
91
+ * @property {Function} parseData - 解析上传响应数据的函数，默认为解析状态码、文件名、图片远程地址和描述字段
92
+ */
74
93
  props: {
75
94
  modelValue: { type: String, default: "" },
76
95
  height: { type: Number, default: 148 },
77
96
  width: { type: Number, default: 148 },
78
97
  title: { type: String, default: "" },
79
98
  icon: { type: String, default: "el-icon-plus" },
80
- action: { type: String, default: () => {} },
99
+ action: { type: String, default: () => { } },
81
100
  apiObj: { type: Object, default: () => { } },
82
101
  name: { type: String, default: "file" },
83
102
  data: { type: Object, default: () => { } },
@@ -89,6 +108,16 @@ export default {
89
108
  disabled: { type: Boolean, default: false },
90
109
  round: { type: Boolean, default: false },
91
110
  onSuccess: { type: Function, default: () => { return true } },
111
+ parseData: {
112
+ type: Function, default: (res) => {
113
+ return {
114
+ code: 200,//分析状态字段结构
115
+ fileName: res.fileName,//分析文件名称
116
+ src: res.previewInfo.url, //分析图片远程地址结构
117
+ msg: res.message //分析描述字段结构
118
+ }
119
+ }
120
+ }
92
121
  },
93
122
 
94
123
  data() {
@@ -183,14 +212,6 @@ export default {
183
212
  file.uid = this.$tool.getUUID('file, 16')
184
213
  this.$refs.uploader.handleStart(file)
185
214
  },
186
- parseData(res) {
187
- return {
188
- code: 200, //分析状态字段结构
189
- fileName: res.fileName,//分析文件名称
190
- src: res.previewInfo.url, //分析图片远程地址结构
191
- msg: res.message //分析描述字段结构
192
- }
193
- },
194
215
  success(res, file) {
195
216
  //释放内存删除blob
196
217
  URL.revokeObjectURL(file.tempFile)
@@ -247,6 +268,7 @@ export default {
247
268
  .el-form-item.is-error .lw-upload .el-upload--picture-card {
248
269
  border-color: var(--el-color-danger);
249
270
  }
271
+
250
272
  .lw-upload .el-upload--picture-card {
251
273
  border-radius: 0;
252
274
  }
@@ -262,16 +284,19 @@ export default {
262
284
  height: 100%;
263
285
  position: relative;
264
286
  }
287
+
265
288
  .lw-upload__img .image {
266
289
  width: 100%;
267
290
  height: 100%;
268
291
  }
292
+
269
293
  .lw-upload__img-actions {
270
294
  position: absolute;
271
295
  top: 0;
272
296
  right: 0;
273
297
  display: none;
274
298
  }
299
+
275
300
  .lw-upload__img-actions span {
276
301
  display: flex;
277
302
  justify-content: center;
@@ -281,15 +306,19 @@ export default {
281
306
  cursor: pointer;
282
307
  color: #fff;
283
308
  }
309
+
284
310
  .lw-upload__img-actions span i {
285
311
  font-size: 12px;
286
312
  }
313
+
287
314
  .lw-upload__img-actions .del {
288
315
  background: #f56c6c;
289
316
  }
317
+
290
318
  .lw-upload__img:hover .lw-upload__img-actions {
291
319
  display: block;
292
320
  }
321
+
293
322
  .lw-upload__img-slot {
294
323
  display: flex;
295
324
  justify-content: center;
@@ -305,6 +334,7 @@ export default {
305
334
  height: 100%;
306
335
  position: relative;
307
336
  }
337
+
308
338
  .lw-upload__progress {
309
339
  position: absolute;
310
340
  width: 100%;
@@ -316,9 +346,11 @@ export default {
316
346
  z-index: 1;
317
347
  padding: 10px;
318
348
  }
349
+
319
350
  .lw-upload__progress .el-progress {
320
351
  width: 100%;
321
352
  }
353
+
322
354
  .lw-upload__uploading .image {
323
355
  width: 100%;
324
356
  height: 100%;
@@ -332,9 +364,11 @@ export default {
332
364
  align-items: center;
333
365
  flex-direction: column;
334
366
  }
367
+
335
368
  .lw-upload .file-empty i {
336
369
  font-size: 28px;
337
370
  }
371
+
338
372
  .lw-upload .file-empty h4 {
339
373
  font-size: 12px;
340
374
  font-weight: normal;
@@ -346,15 +380,18 @@ export default {
346
380
  border-radius: 50%;
347
381
  overflow: hidden;
348
382
  }
383
+
349
384
  .lw-upload.lw-upload-round .el-upload--picture-card {
350
385
  border-radius: 50%;
351
386
  }
387
+
352
388
  .lw-upload.lw-upload-round .lw-upload__img-actions {
353
389
  top: auto;
354
390
  left: 0;
355
391
  right: 0;
356
392
  bottom: 0;
357
393
  }
394
+
358
395
  .lw-upload.lw-upload-round .lw-upload__img-actions span {
359
396
  width: 100%;
360
397
  }