BasicForm.vue 1.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. <script setup lang="ts">
  2. import type { PropType } from 'vue'
  3. import type { BasicForm } from '@/types/form'
  4. const props = defineProps({
  5. formConfig: {
  6. required: true,
  7. type: Object as PropType<BasicForm>
  8. },
  9. formData: {
  10. required: true,
  11. type: Object
  12. }
  13. })
  14. const formData = computed(() => {
  15. if (props.formData.id) {
  16. return props.formData
  17. } else {
  18. const res = props.formData
  19. props.formConfig?.formItems.forEach(item => {
  20. res[item.name] = item.value
  21. })
  22. return res
  23. }
  24. })
  25. // !props.formData.id &&
  26. // props.formConfig?.formItems.forEach(item => {
  27. // props.formData[item.name] = item.value
  28. // })
  29. </script>
  30. <template>
  31. <el-row :gutter="20">
  32. <el-col :span="item.span || formConfig.span || 12" v-for="(item, index) in formConfig.formItems" :key="index">
  33. <el-form-item :label="item.label" :rules="item.rules" :prop="item.name">
  34. <form-comp :item="item" v-model="formData[item.name]"></form-comp>
  35. </el-form-item>
  36. </el-col>
  37. </el-row>
  38. </template>
  39. <style lang="scss" scoped></style>