20260810172235

code/fms/fms-vue/src/components/ui/form/Form.vue

@@ -0,0 +1,32 @@
+<script setup lang="ts">
+import type { FormContext, GenericSchema } from "vee-validate"
+import { useForm } from "vee-validate"
+
+interface FormProps<T extends GenericSchema = GenericSchema> {
+  form?: FormContext<T>
+  validationSchema?: T
+  initialValues?: Record<string, unknown>
+  keepValuesOnUnmount?: boolean
+}
+
+const props = defineProps<FormProps>()
+const emit = defineEmits<{
+  submit: [values: Record<string, unknown>]
+}>()
+
+const form = props.form ?? useForm({
+  validationSchema: props.validationSchema,
+  initialValues: props.initialValues,
+  keepValuesOnUnmount: props.keepValuesOnUnmount,
+})
+
+const onSubmit = form.handleSubmit((values) => {
+  emit("submit", values)
+})
+</script>
+
+<template>
+  <form data-slot="form" @submit="onSubmit">
+    <slot />
+  </form>
+</template>

code/fms/fms-vue/src/components/ui/form/FormField.vue

@@ -0,0 +1,9 @@
+<script lang="ts" setup>
+import { Field } from "vee-validate"
+</script>
+
+<template>
+  <Field v-slot="{ field, errors: fieldErrors, meta }" v-bind="$attrs">
+    <slot v-bind="{ componentField: field, errors: fieldErrors, meta }" />
+  </Field>
+</template>

code/fms/fms-vue/src/components/ui/form/index.ts

@@ -1,7 +1,8 @@
+export { default as Form } from "./Form.vue"
+export { default as FormField } from "./FormField.vue"
 export { default as FormControl } from "./FormControl.vue"
 export { default as FormDescription } from "./FormDescription.vue"
 export { default as FormItem } from "./FormItem.vue"
 export { default as FormLabel } from "./FormLabel.vue"
 export { default as FormMessage } from "./FormMessage.vue"
 export { FORM_ITEM_INJECTION_KEY } from "./injectionKeys"
-export { Form, Field as FormField, FieldArray as FormFieldArray } from "vee-validate"