github.com/e154/smart-home@v0.17.2-0.20240311175135-e530a6e5cd45/static_source/admin/src/views/Plugins/components/Form.vue (about) 1 <script setup lang="ts"> 2 import {PropType, reactive, ref, watch} from 'vue' 3 import {Form} from '@/components/Form' 4 import {useI18n} from '@/hooks/web/useI18n' 5 import {useForm} from '@/hooks/web/useForm' 6 import {useValidator} from '@/hooks/web/useValidator' 7 import {FormSchema} from '@/types/form' 8 import {Plugin} from './Types.ts' 9 10 const {register, elFormRef, methods} = useForm() 11 const {t} = useI18n() 12 13 const form = ref<Nullable<Plugin>>(null) 14 const props = defineProps({ 15 currentRow: { 16 type: Object as PropType<Nullable<Plugin>>, 17 default: () => null 18 } 19 }) 20 21 const schema = reactive<FormSchema[]>([ 22 { 23 field: 'name', 24 label: t('plugins.name'), 25 component: 'Input', 26 colProps: { 27 span: 24 28 }, 29 componentProps: { 30 disabled: true, 31 placeholder: t('plugins.name') 32 } 33 }, 34 { 35 field: 'version', 36 label: t('plugins.version'), 37 component: 'Input', 38 colProps: { 39 span: 24 40 }, 41 componentProps: { 42 disabled: true, 43 placeholder: t('plugins.version') 44 } 45 }, 46 { 47 field: 'enabled', 48 label: t('plugins.enabled'), 49 component: 'Switch', 50 colProps: { 51 span: 24 52 }, 53 }, 54 { 55 field: 'system', 56 label: t('plugins.system'), 57 component: 'Switch', 58 componentProps: { 59 disabled: true, 60 }, 61 colProps: { 62 span: 24 63 }, 64 }, 65 { 66 field: 'triggers', 67 label: t('plugins.trigger'), 68 component: 'Switch', 69 componentProps: { 70 disabled: true, 71 }, 72 colProps: { 73 span: 24 74 }, 75 }, 76 { 77 field: 'actors', 78 label: t('actors'), 79 component: 'Switch', 80 componentProps: { 81 disabled: true, 82 }, 83 colProps: { 84 span: 24 85 }, 86 }, 87 { 88 field: 'actorCustomAttrs', 89 label: t('plugins.actorCustomAttrs'), 90 component: 'Switch', 91 componentProps: { 92 disabled: true, 93 }, 94 colProps: { 95 span: 24 96 }, 97 }, 98 { 99 field: 'actorCustomActions', 100 label: t('plugins.actorCustomActions'), 101 component: 'Switch', 102 componentProps: { 103 disabled: true, 104 }, 105 colProps: { 106 span: 24 107 }, 108 }, 109 { 110 field: 'actorCustomStates', 111 label: t('plugins.actorCustomStates'), 112 component: 'Switch', 113 componentProps: { 114 disabled: true, 115 }, 116 colProps: { 117 span: 24 118 }, 119 }, 120 { 121 field: 'actorCustomSetts', 122 label: t('plugins.actorCustomSettings'), 123 component: 'Switch', 124 componentProps: { 125 disabled: true, 126 }, 127 colProps: { 128 span: 24 129 }, 130 }, 131 ]) 132 133 watch( 134 () => props.currentRow, 135 (currentRow) => { 136 if (!currentRow) return 137 const {setValues, setSchema} = methods 138 setValues(currentRow) 139 }, 140 { 141 deep: true, 142 immediate: true 143 } 144 ) 145 146 defineExpose({ 147 elFormRef, 148 getFormData: methods.getFormData 149 }) 150 </script> 151 152 <template> 153 <Form 154 :schema="schema" 155 label-position="top" 156 @register="register" 157 /> 158 </template>