1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
| <script setup lang="ts">
| import type { Recordable } from '../../../../../types/src';
|
| import type { SettingProps } from './types';
|
| import {
| Form,
| FormControl,
| FormDescription,
| FormField,
| FormItem,
| FormLabel,
| Switch,
| } from '../../../../../@core/ui-kit/shadcn-ui/src';
|
| withDefaults(defineProps<SettingProps>(), {
| formSchema: () => [],
| });
|
| const emit = defineEmits<{
| change: [Recordable<any>];
| }>();
|
| function handleChange(fieldName: string, value: boolean) {
| emit('change', { fieldName, value });
| }
| </script>
| <template>
| <Form class="space-y-8">
| <div class="space-y-4">
| <template v-for="item in formSchema" :key="item.fieldName">
| <FormField type="checkbox" :name="item.fieldName">
| <FormItem
| class="flex flex-row items-center justify-between rounded-lg border p-4"
| >
| <div class="space-y-0.5">
| <FormLabel class="text-base"> {{ item.label }} </FormLabel>
| <FormDescription>
| {{ item.description }}
| </FormDescription>
| </div>
| <FormControl>
| <Switch
| :model-value="item.value"
| @update:model-value="handleChange(item.fieldName, $event)"
| />
| </FormControl>
| </FormItem>
| </FormField>
| </template>
| </div>
| </Form>
| </template>
|
|
