40 lines
1.0 KiB
Vue
40 lines
1.0 KiB
Vue
<template>
|
|
<div class="form-section">
|
|
<FormLayout ref="formLayoutRef" v-bind="$attrs">
|
|
<template v-for="(_, slotName) in $slots" :key="slotName" #[slotName]="slotProps">
|
|
<slot :name="slotName" v-bind="slotProps" />
|
|
</template>
|
|
</FormLayout>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {ref} from 'vue';
|
|
import FormLayout from './FormLayout.vue';
|
|
|
|
defineOptions({
|
|
name: 'FormSectionLayout',
|
|
inheritAttrs: false,
|
|
});
|
|
|
|
const formLayoutRef = ref(null);
|
|
|
|
defineExpose({
|
|
get formRef() {
|
|
return formLayoutRef.value?.formRef;
|
|
},
|
|
validate: (...args) => formLayoutRef.value?.validate(...args),
|
|
validateField: (...args) => formLayoutRef.value?.validateField(...args),
|
|
resetFields: (...args) => formLayoutRef.value?.resetFields(...args),
|
|
clearValidate: (...args) => formLayoutRef.value?.clearValidate(...args),
|
|
scrollToField: (...args) => formLayoutRef.value?.scrollToField(...args),
|
|
});
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.form-section {
|
|
flex-shrink: 0;
|
|
margin-bottom: 1rem;
|
|
}
|
|
</style>
|