| 提交 | 用户 | 时间 | ||
| 820397 | 1 | <template> |
| H | 2 | <ContentWrap v-loading="formLoading"> |
| 3 | <el-tabs v-model="activeName"> | |
| 4 | <el-tab-pane label="基本信息" name="basicInfo"> | |
| 5 | <basic-info-form ref="basicInfoRef" :table="formData.table" /> | |
| 6 | </el-tab-pane> | |
| 7 | <el-tab-pane label="字段信息" name="colum"> | |
| 8 | <colum-info-form ref="columInfoRef" :columns="formData.columns" /> | |
| 9 | </el-tab-pane> | |
| 10 | <el-tab-pane label="生成信息" name="generateInfo"> | |
| 11 | <generate-info-form | |
| 12 | ref="generateInfoRef" | |
| 13 | :table="formData.table" | |
| 14 | :columns="formData.columns" | |
| 15 | /> | |
| 16 | </el-tab-pane> | |
| 17 | </el-tabs> | |
| 18 | <el-form> | |
| 19 | <el-form-item style="float: right"> | |
| 20 | <el-button :loading="formLoading" type="primary" @click="submitForm">保存</el-button> | |
| 21 | <el-button @click="close">返回</el-button> | |
| 22 | </el-form-item> | |
| 23 | </el-form> | |
| 24 | </ContentWrap> | |
| 25 | </template> | |
| 26 | <script lang="ts" setup> | |
| 27 | import { useTagsViewStore } from '@/store/modules/tagsView' | |
| 28 | import { BasicInfoForm, ColumInfoForm, GenerateInfoForm } from './components' | |
| 29 | import * as CodegenApi from '@/api/infra/codegen' | |
| 30 | ||
| 31 | defineOptions({ name: 'InfraCodegenEditTable' }) | |
| 32 | ||
| 33 | const { t } = useI18n() // 国际化 | |
| 34 | const message = useMessage() // 消息弹窗 | |
| 35 | const { push, currentRoute } = useRouter() // 路由 | |
| 36 | const { query } = useRoute() // 查询参数 | |
| 37 | const { delView } = useTagsViewStore() // 视图操作 | |
| 38 | ||
| 39 | const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用 | |
| 40 | const activeName = ref('colum') // Tag 激活的窗口 | |
| 41 | const basicInfoRef = ref<ComponentRef<typeof BasicInfoForm>>() | |
| 42 | const columInfoRef = ref<ComponentRef<typeof ColumInfoForm>>() | |
| 43 | const generateInfoRef = ref<ComponentRef<typeof GenerateInfoForm>>() | |
| 44 | const formData = ref<CodegenApi.CodegenUpdateReqVO>({ | |
| 45 | table: {}, | |
| 46 | columns: [] | |
| 47 | }) | |
| 48 | ||
| 49 | /** 获得详情 */ | |
| 50 | const getDetail = async () => { | |
| 51 | const id = query.id as unknown as number | |
| 52 | if (!id) { | |
| 53 | return | |
| 54 | } | |
| 55 | formLoading.value = true | |
| 56 | try { | |
| 57 | formData.value = await CodegenApi.getCodegenTable(id) | |
| 58 | } finally { | |
| 59 | formLoading.value = false | |
| 60 | } | |
| 61 | } | |
| 62 | ||
| 63 | /** 提交按钮 */ | |
| 64 | const submitForm = async () => { | |
| 65 | // 参数校验 | |
| 66 | if (!unref(formData)) return | |
| 67 | await unref(basicInfoRef)?.validate() | |
| 68 | await unref(generateInfoRef)?.validate() | |
| 69 | try { | |
| 70 | // 提交请求 | |
| 71 | await CodegenApi.updateCodegenTable(formData.value) | |
| 72 | message.success(t('common.updateSuccess')) | |
| 73 | close() | |
| 74 | } catch {} | |
| 75 | } | |
| 76 | ||
| 77 | /** 关闭按钮 */ | |
| 78 | const close = () => { | |
| 79 | delView(unref(currentRoute)) | |
| 80 | push('/infra/codegen') | |
| 81 | } | |
| 82 | ||
| 83 | /** 初始化 */ | |
| 84 | onMounted(() => { | |
| 85 | getDetail() | |
| 86 | }) | |
| 87 | </script> | |
