@cmstops/pro-compo 3.9.2-alpha.4 → 3.9.2-alpha.6

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 (3) hide show
  1. package/es/baseFilter/component.js +71 -14
  2. package/lib/baseFilter/component.js +69 -12
  3. package/package.json +1 -1
package/es/baseFilter/component.js CHANGED
@@ -1,5 +1,5 @@
1
- import { defineComponent, ref, computed, watch, nextTick, toRaw, openBlock, createElementBlock, Fragment, createElementVNode, withModifiers, createVNode, withCtx, renderList, createBlock, unref, normalizeStyle, createCommentVNode, renderSlot } from "vue";
2
- import { InputSearch, Select, Option, RangePicker } from "@arco-design/web-vue";
1
+ import { defineComponent, ref, computed, watch, nextTick, toRaw, openBlock, createElementBlock, Fragment, createElementVNode, withModifiers, createVNode, withCtx, renderList, createBlock, renderSlot, unref, createTextVNode, toDisplayString, normalizeStyle, createCommentVNode } from "vue";
2
+ import { InputGroup, Select, Option, Input, InputSearch, RangePicker, RadioGroup, Radio } from "@arco-design/web-vue";
3
3
  import _sfc_main$2 from "./components/filterItem.js";
4
4
  import _sfc_main$1 from "./components/FilterGroup.js";
5
5
  const _sfc_main = defineComponent({
@@ -37,9 +37,11 @@ const _sfc_main = defineComponent({
37
37
  });
38
38
  return _columns;
39
39
  });
40
- const getOptions = (item) => {
41
- return item.options ? item.options : [];
42
- };
40
+ const getOptions = computed(() => {
41
+ return (item) => {
42
+ return item.options ? item.options : [];
43
+ };
44
+ });
43
45
  const hasValue = computed(() => {
44
46
  return (key) => {
45
47
  var _a, _b;
@@ -76,7 +78,10 @@ const _sfc_main = defineComponent({
76
78
  _form[column.range] = rangeTemp[column.range];
77
79
  } else if (column.component === "select") {
78
80
  _form[column.key] = column.defaultValue || null;
79
- } else {
81
+ } else if (column.component === "input-group") {
82
+ _form[column.selectKey] = column.selectDefaultValue || "";
83
+ _form[column.inputKey] = column.inputDefaultValue || "";
84
+ } else if (column.component) {
80
85
  _form[column.key] = column.defaultValue || "";
81
86
  }
82
87
  });
@@ -178,17 +183,48 @@ const _sfc_main = defineComponent({
178
183
  active: hasValue.value(item.key)
179
184
  }, {
180
185
  default: withCtx(() => [
181
- item.component === "input" ? (openBlock(), createBlock(unref(InputSearch), {
182
- key: 0,
186
+ item.slot ? renderSlot(_ctx.$slots, item.slot, { key: 0 }) : item.component === "input-group" ? (openBlock(), createBlock(unref(InputGroup), { key: 1 }, {
187
+ default: withCtx(() => [
188
+ createVNode(unref(Select), {
189
+ modelValue: form.value[item.selectKey],
190
+ "onUpdate:modelValue": ($event) => form.value[item.selectKey] = $event,
191
+ "default-active-first-option": "",
192
+ style: { "width": "100px" }
193
+ }, {
194
+ default: withCtx(() => [
195
+ (openBlock(true), createElementBlock(Fragment, null, renderList(item.selectOptions, (option, idx) => {
196
+ return openBlock(), createBlock(unref(Option), {
197
+ key: idx,
198
+ value: option.value
199
+ }, {
200
+ default: withCtx(() => [
201
+ createTextVNode(toDisplayString(option.label), 1)
202
+ ]),
203
+ _: 2
204
+ }, 1032, ["value"]);
205
+ }), 128))
206
+ ]),
207
+ _: 2
208
+ }, 1032, ["modelValue", "onUpdate:modelValue"]),
209
+ createVNode(unref(Input), {
210
+ modelValue: form.value[item.inputKey],
211
+ "onUpdate:modelValue": ($event) => form.value[item.inputKey] = $event,
212
+ placeholder: item.placeholder ? item.placeholder : `\u8BF7\u8F93\u5165${item.inputLabel}`,
213
+ style: { "width": "180px" }
214
+ }, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder"])
215
+ ]),
216
+ _: 2
217
+ }, 1024)) : item.component === "input" ? (openBlock(), createBlock(unref(InputSearch), {
218
+ key: 2,
183
219
  modelValue: form.value[item.key],
184
220
  "onUpdate:modelValue": ($event) => form.value[item.key] = $event,
185
221
  style: normalizeStyle({ width: styleWidth(columnsMap.value[item.key]) }),
186
222
  "allow-clear": "",
187
223
  size: "medium",
188
- placeholder: `\u8BF7\u8F93\u5165${item.label}`
224
+ placeholder: item.placeholder ? item.placeholder : `\u8BF7\u8F93\u5165${item.label}`
189
225
  }, null, 8, ["modelValue", "onUpdate:modelValue", "style", "placeholder"])) : createCommentVNode("v-if", true),
190
226
  item.component === "select" ? (openBlock(), createBlock(unref(Select), {
191
- key: 1,
227
+ key: 3,
192
228
  modelValue: form.value[item.key],
193
229
  "onUpdate:modelValue": ($event) => form.value[item.key] = $event,
194
230
  "popup-container": "#base-filter-popup-container",
@@ -196,13 +232,13 @@ const _sfc_main = defineComponent({
196
232
  "allow-search": item.allowSearch,
197
233
  "default-active-first-option": false,
198
234
  style: normalizeStyle({ width: styleWidth(columnsMap.value[item.key]) }),
199
- placeholder: `\u8BF7\u9009\u62E9${item.label}`,
235
+ placeholder: item.placeholder ? item.placeholder : `\u8BF7\u9009\u62E9${item.label}`,
200
236
  onSearch: ($event) => handleSelectSearch($event, item),
201
237
  onPopupVisibleChange: ($event) => handleSelectPopupChange($event, item),
202
238
  onChange: ($event) => handleSelectChange($event, item)
203
239
  }, {
204
240
  default: withCtx(() => [
205
- (openBlock(true), createElementBlock(Fragment, null, renderList(getOptions(item), (opt) => {
241
+ (openBlock(true), createElementBlock(Fragment, null, renderList(getOptions.value(item), (opt) => {
206
242
  return openBlock(), createBlock(unref(Option), {
207
243
  key: opt.value,
208
244
  label: opt.label,
@@ -213,7 +249,7 @@ const _sfc_main = defineComponent({
213
249
  _: 2
214
250
  }, 1032, ["modelValue", "onUpdate:modelValue", "allow-search", "style", "placeholder", "onSearch", "onPopupVisibleChange", "onChange"])) : createCommentVNode("v-if", true),
215
251
  item.component === "range-picker" ? (openBlock(), createBlock(unref(RangePicker), {
216
- key: 2,
252
+ key: 4,
217
253
  modelValue: form.value[item.key].range,
218
254
  "onUpdate:modelValue": ($event) => form.value[item.key].range = $event,
219
255
  style: normalizeStyle({ width: styleWidth(form.value[item.key]) }),
@@ -224,7 +260,28 @@ const _sfc_main = defineComponent({
224
260
  "popup-container": "#base-filter-popup-container",
225
261
  onClick: _cache[1] || (_cache[1] = withModifiers(() => {
226
262
  }, ["stop"]))
227
- }, null, 8, ["modelValue", "onUpdate:modelValue", "style"])) : createCommentVNode("v-if", true)
263
+ }, null, 8, ["modelValue", "onUpdate:modelValue", "style"])) : createCommentVNode("v-if", true),
264
+ item.component === "radio" ? (openBlock(), createBlock(unref(RadioGroup), {
265
+ key: 5,
266
+ modelValue: form.value[item.key],
267
+ "onUpdate:modelValue": ($event) => form.value[item.key] = $event,
268
+ type: "button"
269
+ }, {
270
+ default: withCtx(() => [
271
+ (openBlock(true), createElementBlock(Fragment, null, renderList(item.options || [], (option, idx) => {
272
+ return openBlock(), createBlock(unref(Radio), {
273
+ key: idx,
274
+ value: option.value
275
+ }, {
276
+ default: withCtx(() => [
277
+ createTextVNode(toDisplayString(option.label), 1)
278
+ ]),
279
+ _: 2
280
+ }, 1032, ["value"]);
281
+ }), 128))
282
+ ]),
283
+ _: 2
284
+ }, 1032, ["modelValue", "onUpdate:modelValue"])) : createCommentVNode("v-if", true)
228
285
  ]),
229
286
  _: 2
230
287
  }, 1032, ["active"]);
package/lib/baseFilter/component.js CHANGED
@@ -38,9 +38,11 @@ const _sfc_main = vue.defineComponent({
38
38
  });
39
39
  return _columns;
40
40
  });
41
- const getOptions = (item) => {
42
- return item.options ? item.options : [];
43
- };
41
+ const getOptions = vue.computed(() => {
42
+ return (item) => {
43
+ return item.options ? item.options : [];
44
+ };
45
+ });
44
46
  const hasValue = vue.computed(() => {
45
47
  return (key) => {
46
48
  var _a, _b;
@@ -77,7 +79,10 @@ const _sfc_main = vue.defineComponent({
77
79
  _form[column.range] = rangeTemp[column.range];
78
80
  } else if (column.component === "select") {
79
81
  _form[column.key] = column.defaultValue || null;
80
- } else {
82
+ } else if (column.component === "input-group") {
83
+ _form[column.selectKey] = column.selectDefaultValue || "";
84
+ _form[column.inputKey] = column.inputDefaultValue || "";
85
+ } else if (column.component) {
81
86
  _form[column.key] = column.defaultValue || "";
82
87
  }
83
88
  });
@@ -179,17 +184,48 @@ const _sfc_main = vue.defineComponent({
179
184
  active: hasValue.value(item.key)
180
185
  }, {
181
186
  default: vue.withCtx(() => [
182
- item.component === "input" ? (vue.openBlock(), vue.createBlock(vue.unref(webVue.InputSearch), {
183
- key: 0,
187
+ item.slot ? vue.renderSlot(_ctx.$slots, item.slot, { key: 0 }) : item.component === "input-group" ? (vue.openBlock(), vue.createBlock(vue.unref(webVue.InputGroup), { key: 1 }, {
188
+ default: vue.withCtx(() => [
189
+ vue.createVNode(vue.unref(webVue.Select), {
190
+ modelValue: form.value[item.selectKey],
191
+ "onUpdate:modelValue": ($event) => form.value[item.selectKey] = $event,
192
+ "default-active-first-option": "",
193
+ style: { "width": "100px" }
194
+ }, {
195
+ default: vue.withCtx(() => [
196
+ (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(item.selectOptions, (option, idx) => {
197
+ return vue.openBlock(), vue.createBlock(vue.unref(webVue.Option), {
198
+ key: idx,
199
+ value: option.value
200
+ }, {
201
+ default: vue.withCtx(() => [
202
+ vue.createTextVNode(vue.toDisplayString(option.label), 1)
203
+ ]),
204
+ _: 2
205
+ }, 1032, ["value"]);
206
+ }), 128))
207
+ ]),
208
+ _: 2
209
+ }, 1032, ["modelValue", "onUpdate:modelValue"]),
210
+ vue.createVNode(vue.unref(webVue.Input), {
211
+ modelValue: form.value[item.inputKey],
212
+ "onUpdate:modelValue": ($event) => form.value[item.inputKey] = $event,
213
+ placeholder: item.placeholder ? item.placeholder : `\u8BF7\u8F93\u5165${item.inputLabel}`,
214
+ style: { "width": "180px" }
215
+ }, null, 8, ["modelValue", "onUpdate:modelValue", "placeholder"])
216
+ ]),
217
+ _: 2
218
+ }, 1024)) : item.component === "input" ? (vue.openBlock(), vue.createBlock(vue.unref(webVue.InputSearch), {
219
+ key: 2,
184
220
  modelValue: form.value[item.key],
185
221
  "onUpdate:modelValue": ($event) => form.value[item.key] = $event,
186
222
  style: vue.normalizeStyle({ width: styleWidth(columnsMap.value[item.key]) }),
187
223
  "allow-clear": "",
188
224
  size: "medium",
189
- placeholder: `\u8BF7\u8F93\u5165${item.label}`
225
+ placeholder: item.placeholder ? item.placeholder : `\u8BF7\u8F93\u5165${item.label}`
190
226
  }, null, 8, ["modelValue", "onUpdate:modelValue", "style", "placeholder"])) : vue.createCommentVNode("v-if", true),
191
227
  item.component === "select" ? (vue.openBlock(), vue.createBlock(vue.unref(webVue.Select), {
192
- key: 1,
228
+ key: 3,
193
229
  modelValue: form.value[item.key],
194
230
  "onUpdate:modelValue": ($event) => form.value[item.key] = $event,
195
231
  "popup-container": "#base-filter-popup-container",
@@ -197,13 +233,13 @@ const _sfc_main = vue.defineComponent({
197
233
  "allow-search": item.allowSearch,
198
234
  "default-active-first-option": false,
199
235
  style: vue.normalizeStyle({ width: styleWidth(columnsMap.value[item.key]) }),
200
- placeholder: `\u8BF7\u9009\u62E9${item.label}`,
236
+ placeholder: item.placeholder ? item.placeholder : `\u8BF7\u9009\u62E9${item.label}`,
201
237
  onSearch: ($event) => handleSelectSearch($event, item),
202
238
  onPopupVisibleChange: ($event) => handleSelectPopupChange($event, item),
203
239
  onChange: ($event) => handleSelectChange($event, item)
204
240
  }, {
205
241
  default: vue.withCtx(() => [
206
- (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(getOptions(item), (opt) => {
242
+ (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(getOptions.value(item), (opt) => {
207
243
  return vue.openBlock(), vue.createBlock(vue.unref(webVue.Option), {
208
244
  key: opt.value,
209
245
  label: opt.label,
@@ -214,7 +250,7 @@ const _sfc_main = vue.defineComponent({
214
250
  _: 2
215
251
  }, 1032, ["modelValue", "onUpdate:modelValue", "allow-search", "style", "placeholder", "onSearch", "onPopupVisibleChange", "onChange"])) : vue.createCommentVNode("v-if", true),
216
252
  item.component === "range-picker" ? (vue.openBlock(), vue.createBlock(vue.unref(webVue.RangePicker), {
217
- key: 2,
253
+ key: 4,
218
254
  modelValue: form.value[item.key].range,
219
255
  "onUpdate:modelValue": ($event) => form.value[item.key].range = $event,
220
256
  style: vue.normalizeStyle({ width: styleWidth(form.value[item.key]) }),
@@ -225,7 +261,28 @@ const _sfc_main = vue.defineComponent({
225
261
  "popup-container": "#base-filter-popup-container",
226
262
  onClick: _cache[1] || (_cache[1] = vue.withModifiers(() => {
227
263
  }, ["stop"]))
228
- }, null, 8, ["modelValue", "onUpdate:modelValue", "style"])) : vue.createCommentVNode("v-if", true)
264
+ }, null, 8, ["modelValue", "onUpdate:modelValue", "style"])) : vue.createCommentVNode("v-if", true),
265
+ item.component === "radio" ? (vue.openBlock(), vue.createBlock(vue.unref(webVue.RadioGroup), {
266
+ key: 5,
267
+ modelValue: form.value[item.key],
268
+ "onUpdate:modelValue": ($event) => form.value[item.key] = $event,
269
+ type: "button"
270
+ }, {
271
+ default: vue.withCtx(() => [
272
+ (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(item.options || [], (option, idx) => {
273
+ return vue.openBlock(), vue.createBlock(vue.unref(webVue.Radio), {
274
+ key: idx,
275
+ value: option.value
276
+ }, {
277
+ default: vue.withCtx(() => [
278
+ vue.createTextVNode(vue.toDisplayString(option.label), 1)
279
+ ]),
280
+ _: 2
281
+ }, 1032, ["value"]);
282
+ }), 128))
283
+ ]),
284
+ _: 2
285
+ }, 1032, ["modelValue", "onUpdate:modelValue"])) : vue.createCommentVNode("v-if", true)
229
286
  ]),
230
287
  _: 2
231
288
  }, 1032, ["active"]);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cmstops/pro-compo",
3
- "version": "3.9.2-alpha.4",
3
+ "version": "3.9.2-alpha.6",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "vue",