47 lines
992 B
Vue
47 lines
992 B
Vue
<template>
|
|
<a-form :model="model" :rules="rules" layout="vertical" ref="formRef">
|
|
<a-row :gutter="16">
|
|
<a-col :span="item.span || 6" v-for="(item, index) in formItems" :key="index">
|
|
<a-form-item :label="item.label" :name="item.name" :rules="item.rules">
|
|
<component style="width: 100%" :is="item.type" v-model:value="model[item.name]" :disabled="allDisabled" v-bind="item.attrs" />
|
|
</a-form-item>
|
|
</a-col>
|
|
</a-row>
|
|
</a-form>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, watch } from 'vue'
|
|
|
|
const props = defineProps({
|
|
formItems: {
|
|
type: Array,
|
|
required: true
|
|
},
|
|
model: {
|
|
type: Object,
|
|
required: true
|
|
},
|
|
rules: {
|
|
type: Object,
|
|
default: () => ({})
|
|
},
|
|
allDisabled: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
})
|
|
|
|
const formRef = ref()
|
|
|
|
// Expose validate method
|
|
defineExpose({
|
|
validate: () => formRef.value.validate(),
|
|
resetFields: () => formRef.value.resetFields()
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
/* Add your styles here */
|
|
</style>
|