Commit 462c3fe1c483b3baa5ef1dcd33ee1cbb3563e425

Authored by fengwotao
1 parent 71a1be23

feat(src/packages): 信息下的 下拉框组件修改切换单个或多个

@@ -10,7 +10,7 @@ export const option = { @@ -10,7 +10,7 @@ export const option = {
10 // 时间组件展示类型,必须和 interactActions 中定义的数据一致 10 // 时间组件展示类型,必须和 interactActions 中定义的数据一致
11 [COMPONENT_INTERACT_EVENT_KET]: ComponentInteractEventEnum.DATA, 11 [COMPONENT_INTERACT_EVENT_KET]: ComponentInteractEventEnum.DATA,
12 // 默认值 12 // 默认值
13 - selectValue: [], 13 + selectValue: null,
14 // 暴露配置内容给用户 14 // 暴露配置内容给用户
15 dataset: [ 15 dataset: [
16 { 16 {
@@ -25,7 +25,8 @@ export const option = { @@ -25,7 +25,8 @@ export const option = {
25 label: '选项3', 25 label: '选项3',
26 value: '3' 26 value: '3'
27 } 27 }
28 - ] 28 + ],
  29 + multiple: false
29 } 30 }
30 31
31 export default class Config extends PublicConfigClass implements CreateComponentType { 32 export default class Config extends PublicConfigClass implements CreateComponentType {
@@ -2,7 +2,17 @@ @@ -2,7 +2,17 @@
2 <collapse-item name="下拉配置" :expanded="true"> 2 <collapse-item name="下拉配置" :expanded="true">
3 <setting-item-box name="默认值" :alone="true"> 3 <setting-item-box name="默认值" :alone="true">
4 <SettingItem name="选择项"> 4 <SettingItem name="选择项">
5 - <n-select filterable multiple size="small" v-model:value="optionData.selectValue" :options="optionData.dataset" /> 5 + <n-select
  6 + filterable
  7 + clearable
  8 + :multiple="optionData.multiple"
  9 + size="small"
  10 + v-model:value="optionData.selectValue"
  11 + :options="optionData.dataset"
  12 + />
  13 + </SettingItem>
  14 + <SettingItem name="是否多选">
  15 + <n-switch v-model:value="optionData.multiple" size="small"></n-switch>
6 </SettingItem> 16 </SettingItem>
7 </setting-item-box> 17 </setting-item-box>
8 </collapse-item> 18 </collapse-item>
1 <template> 1 <template>
2 <n-select 2 <n-select
3 - multiple 3 + clearable
  4 + :multiple="multiple"
4 v-model:value="option.value.selectValue" 5 v-model:value="option.value.selectValue"
5 :options="option.value.dataset" 6 :options="option.value.dataset"
6 :style="`width:${w}px;`" 7 :style="`width:${w}px;`"
@@ -25,6 +26,8 @@ const props = defineProps({ @@ -25,6 +26,8 @@ const props = defineProps({
25 26
26 const { w, h } = toRefs(props.chartConfig.attr) 27 const { w, h } = toRefs(props.chartConfig.attr)
27 28
  29 +const { multiple } = toRefs(props.chartConfig.option)
  30 +
28 const option = shallowReactive({ 31 const option = shallowReactive({
29 value: { 32 value: {
30 selectValue: props.chartConfig.option.selectValue, 33 selectValue: props.chartConfig.option.selectValue,
@@ -33,7 +36,7 @@ const option = shallowReactive({ @@ -33,7 +36,7 @@ const option = shallowReactive({
33 }) 36 })
34 37
35 // 监听事件改变 38 // 监听事件改变
36 -const onChange = (v: string[]) => { 39 +const onChange = (v: string[] | string) => {
37 // 存储到联动数据 40 // 存储到联动数据
38 useChartInteract( 41 useChartInteract(
39 props.chartConfig, 42 props.chartConfig,