Commit 462c3fe1c483b3baa5ef1dcd33ee1cbb3563e425
1 parent
71a1be23
feat(src/packages): 信息下的 下拉框组件修改切换单个或多个
Showing
3 changed files
with
19 additions
and
5 deletions
| @@ -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, |