JLNTV_IPD/tmagic-editor
4
0
Fork 0
mirror of https://github.com/Tencent/tmagic-editor.git synced 2025-06-20 23:44:23 +08:00
Code Issues Projects Releases Wiki Activity

feat(form): checkboxGroup options支持函数配置

Browse Source
This commit is contained in:
roymondchen 2022-10-11 18:47:20 +08:00 committed by jia000
parent 32a24ad578
commit 6d432ba1da
2 changed files with 19 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
packages/form/src/fields/CheckboxGroup.vue
View File

@ -1,20 +1,19 @@
<template> <template>
<TMagicCheckboxGroup v-model="model[name]" :size="size" :disabled="disabled" @change="changeHandler"> <TMagicCheckboxGroup v-model="model[name]" :size="size" :disabled="disabled" @change="changeHandler">
<TMagicCheckbox <TMagicCheckbox v-for="option in options" :label="option.value" :key="option.value" :disabled="option.disabled"
v-for="option in config.options"
:label="option.value"
:key="option.value"
:disabled="option.disabled"
>{{ option.text }} >{{ option.text }}
</TMagicCheckbox> </TMagicCheckbox>
</TMagicCheckboxGroup> </TMagicCheckboxGroup>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { computed, inject } from 'vue';
import { TMagicCheckbox, TMagicCheckboxGroup } from '@tmagic/design'; import { TMagicCheckbox, TMagicCheckboxGroup } from '@tmagic/design';
import { CheckboxGroupConfig } from '../schema'; import { CheckboxGroupConfig, FormState } from '../schema';
import { useAddField } from '../utils/useAddField'; import { useAddField } from '../utils/useAddField';
import { filterFunction } from '..';
const props = defineProps<{ const props = defineProps<{
config: CheckboxGroupConfig; config: CheckboxGroupConfig;
@ -39,4 +38,11 @@ if (props.model && !props.model[props.name]) {
const changeHandler = (v: Array<string | number | boolean>) => { const changeHandler = (v: Array<string | number | boolean>) => {
emit('change', v); emit('change', v);
}; };
const mForm = inject<FormState | undefined>('mForm');
const options = computed(() => {
if (Array.isArray(props.config.options)) return props.config.options;
if (typeof props.config.options === 'function') return filterFunction(mForm, props.config.options, props);
return [];
});
</script> </script>

12
packages/form/src/schema.ts
View File

@ -408,11 +408,13 @@ export interface ColorPickConfig extends FormItem {
*/ */
export interface CheckboxGroupConfig extends FormItem { export interface CheckboxGroupConfig extends FormItem {
type: 'checkbox-group'; type: 'checkbox-group';
options: { options:
value: any; | {
text: string; value: any;
disabled?: boolean; text: string;
}[]; disabled?: boolean;
}[]
| Function;
} }
/** /**