From e181f04c642204e79749af93fa921875ff6c21ba Mon Sep 17 00:00:00 2001 From: baoshiwei <baoshiwei@shlanbao.cn> Date: 星期二, 20 五月 2025 10:46:35 +0800 Subject: [PATCH] refactor(qms): 重构趋势图展示逻辑 --- src/views/tool/gen/editTable.vue | 295 ++++++++++++++++++++++++++++++---------------------------- 1 files changed, 152 insertions(+), 143 deletions(-) diff --git a/src/views/tool/gen/editTable.vue b/src/views/tool/gen/editTable.vue index be1b392..bbb0889 100644 --- a/src/views/tool/gen/editTable.vue +++ b/src/views/tool/gen/editTable.vue @@ -1,11 +1,125 @@ +<template> + <el-card> + <el-tabs v-model="activeName"> + <el-tab-pane label="鍩烘湰淇℃伅" name="basic"> + <basic-info-form ref="basicInfo" :info="info" /> + </el-tab-pane> + <el-tab-pane label="瀛楁淇℃伅" name="columnInfo"> + <el-table ref="dragTable" :data="columns" row-key="columnId" :max-height="tableHeight"> + <el-table-column label="搴忓彿" type="index" min-width="5%" /> + <el-table-column label="瀛楁鍒楀悕" prop="columnName" min-width="10%" :show-overflow-tooltip="true" /> + <el-table-column label="瀛楁鎻忚堪" min-width="10%"> + <template #default="scope"> + <el-input v-model="scope.row.columnComment"></el-input> + </template> + </el-table-column> + <el-table-column label="鐗╃悊绫诲瀷" prop="columnType" min-width="10%" :show-overflow-tooltip="true" /> + <el-table-column label="Java绫诲瀷" min-width="11%"> + <template #default="scope"> + <el-select v-model="scope.row.javaType"> + <el-option label="Long" value="Long" /> + <el-option label="String" value="String" /> + <el-option label="Integer" value="Integer" /> + <el-option label="Double" value="Double" /> + <el-option label="BigDecimal" value="BigDecimal" /> + <el-option label="Date" value="Date" /> + <el-option label="Boolean" value="Boolean" /> + </el-select> + </template> + </el-table-column> + <el-table-column label="java灞炴��" min-width="10%"> + <template #default="scope"> + <el-input v-model="scope.row.javaField"></el-input> + </template> + </el-table-column> + + <el-table-column label="鎻掑叆" min-width="5%"> + <template #default="scope"> + <el-checkbox v-model="scope.row.isInsert" true-value="1" false-value="0"></el-checkbox> + </template> + </el-table-column> + <el-table-column label="缂栬緫" min-width="5%"> + <template #default="scope"> + <el-checkbox v-model="scope.row.isEdit" true-value="1" false-value="0"></el-checkbox> + </template> + </el-table-column> + <el-table-column label="鍒楄〃" min-width="5%"> + <template #default="scope"> + <el-checkbox v-model="scope.row.isList" true-value="1" false-value="0"></el-checkbox> + </template> + </el-table-column> + <el-table-column label="鏌ヨ" min-width="5%"> + <template #default="scope"> + <el-checkbox v-model="scope.row.isQuery" true-value="1" false-value="0"></el-checkbox> + </template> + </el-table-column> + <el-table-column label="鏌ヨ鏂瑰紡" min-width="10%"> + <template #default="scope"> + <el-select v-model="scope.row.queryType"> + <el-option label="=" value="EQ" /> + <el-option label="!=" value="NE" /> + <el-option label=">" value="GT" /> + <el-option label=">=" value="GE" /> + <el-option label="<" value="LT" /> + <el-option label="<=" value="LE" /> + <el-option label="LIKE" value="LIKE" /> + <el-option label="BETWEEN" value="BETWEEN" /> + </el-select> + </template> + </el-table-column> + <el-table-column label="蹇呭~" min-width="5%"> + <template #default="scope"> + <el-checkbox v-model="scope.row.isRequired" true-value="1" false-value="0"></el-checkbox> + </template> + </el-table-column> + <el-table-column label="鏄剧ず绫诲瀷" min-width="12%"> + <template #default="scope"> + <el-select v-model="scope.row.htmlType"> + <el-option label="鏂囨湰妗�" value="input" /> + <el-option label="鏂囨湰鍩�" value="textarea" /> + <el-option label="涓嬫媺妗�" value="select" /> + <el-option label="鍗曢�夋" value="radio" /> + <el-option label="澶嶉�夋" value="checkbox" /> + <el-option label="鏃ユ湡鎺т欢" value="datetime" /> + <el-option label="鍥剧墖涓婁紶" value="imageUpload" /> + <el-option label="鏂囦欢涓婁紶" value="fileUpload" /> + <el-option label="瀵屾枃鏈帶浠�" value="editor" /> + </el-select> + </template> + </el-table-column> + <el-table-column label="瀛楀吀绫诲瀷" min-width="12%"> + <template #default="scope"> + <el-select v-model="scope.row.dictType" clearable filterable placeholder="璇烽�夋嫨"> + <el-option v-for="dict in dictOptions" :key="dict.dictType" :label="dict.dictName" :value="dict.dictType"> + <span style="float: left">{{ dict.dictName }}</span> + <span style="float: right; color: #8492a6; font-size: 13px">{{ dict.dictType }}</span> + </el-option> + </el-select> + </template> + </el-table-column> + </el-table> + </el-tab-pane> + <el-tab-pane label="鐢熸垚淇℃伅" name="genInfo"> + <gen-info-form ref="genInfo" :info="info" :tables="tables" /> + </el-tab-pane> + </el-tabs> + <el-form label-width="100px"> + <div style="text-align: center; margin-left: -100px; margin-top: 10px"> + <el-button type="primary" @click="submitForm()">鎻愪氦</el-button> + <el-button @click="close()">杩斿洖</el-button> + </div> + </el-form> + </el-card> +</template> + <script setup name="GenEdit" lang="ts"> import { getGenTable, updateGenTable } from '@/api/tool/gen'; import { DbColumnVO, DbTableVO } from '@/api/tool/gen/types'; import { optionselect as getDictOptionselect } from '@/api/system/dict/type'; import { DictTypeVO } from '@/api/system/dict/type/types'; -import basicInfoForm from './basicInfoForm.vue'; -import genInfoForm from "./genInfoForm.vue"; -import { ComponentInternalInstance } from "vue"; +import BasicInfoForm from './basicInfoForm.vue'; +import GenInfoForm from './genInfoForm.vue'; +import { RouteLocationNormalized } from 'vue-router'; const route = useRoute(); const { proxy } = getCurrentInstance() as ComponentInternalInstance; @@ -17,16 +131,16 @@ const dictOptions = ref<DictTypeVO[]>([]); const info = ref<Partial<DbTableVO>>({}); -const basicInfo = ref(basicInfoForm); -const genInfo = ref(genInfoForm); +const basicInfo = ref<InstanceType<typeof BasicInfoForm>>(); +const genInfo = ref<InstanceType<typeof GenInfoForm>>(); /** 鎻愪氦鎸夐挳 */ const submitForm = () => { - const basicForm = basicInfo.value.$refs.basicInfoForm; - const genForm = genInfo.value.$refs.genInfoForm; + const basicForm = basicInfo.value?.$refs.basicInfoForm; + const genForm = genInfo.value?.$refs.genInfoForm; - Promise.all([basicForm, genForm].map(getFormPromise)).then(async res => { - const validateResult = res.every(item => !!item); + Promise.all([basicForm, genForm].map(getFormPromise)).then(async (res) => { + const validateResult = res.every((item) => !!item); if (validateResult) { const genTable: any = Object.assign({}, info.value); genTable.columns = columns.value; @@ -35,155 +149,50 @@ treeName: info.value.treeName, treeParentCode: info.value.treeParentCode, parentMenuId: info.value.parentMenuId - }; - console.log(genTable) - const response = await updateGenTable(genTable); - proxy?.$modal.msgSuccess(response.msg); - if (response.code === 200) { - close(); - } + }; + const response = await updateGenTable(genTable); + proxy?.$modal.msgSuccess(response.msg); + if (response.code === 200) { + close(); + } } else { - proxy?.$modal.msgError("琛ㄥ崟鏍¢獙鏈�氳繃锛岃閲嶆柊妫�鏌ユ彁浜ゅ唴瀹�"); + proxy?.$modal.msgError('琛ㄥ崟鏍¢獙鏈�氳繃锛岃閲嶆柊妫�鏌ユ彁浜ゅ唴瀹�'); } }); -} +}; const getFormPromise = (form: any) => { - return new Promise(resolve => { + return new Promise((resolve) => { form.validate((res: any) => { resolve(res); }); }); -} +}; const close = () => { - const obj = { path: "/tool/gen", query: { t: Date.now(), pageNum: route.query.pageNum } }; + const obj: RouteLocationNormalized = { + path: '/tool/gen', + fullPath: '', + hash: '', + matched: [], + meta: undefined, + name: undefined, + params: undefined, + redirectedFrom: undefined, + query: { t: Date.now().toString(), pageNum: route.query.pageNum } + }; proxy?.$tab.closeOpenPage(obj); -} +}; (async () => { - const tableId = route.params && route.params.tableId as string; + const tableId = route.params && (route.params.tableId as string); if (tableId) { // 鑾峰彇琛ㄨ缁嗕俊鎭� - const res = await getGenTable(tableId); - columns.value = res.data.rows; - info.value = res.data.info; - tables.value = res.data.tables; + const res = await getGenTable(tableId); + columns.value = res.data.rows; + info.value = res.data.info; + tables.value = res.data.tables; /** 鏌ヨ瀛楀吀涓嬫媺鍒楄〃 */ - const response = await getDictOptionselect(); - dictOptions.value = response.data; + const response = await getDictOptionselect(); + dictOptions.value = response.data; } })(); </script> - -<template> - <el-card> - <el-tabs v-model="activeName"> - <el-tab-pane label="鍩烘湰淇℃伅" name="basic"> - <basic-info-form ref="basicInfo" :info="info" /> - </el-tab-pane> - <el-tab-pane label="瀛楁淇℃伅" name="columnInfo"> - <el-table ref="dragTable" :data="columns" row-key="columnId" :max-height="tableHeight"> - <el-table-column label="搴忓彿" type="index" min-width="5%" /> - <el-table-column label="瀛楁鍒楀悕" prop="columnName" min-width="10%" :show-overflow-tooltip="true" /> - <el-table-column label="瀛楁鎻忚堪" min-width="10%"> - <template #default="scope"> - <el-input v-model="scope.row.columnComment"></el-input> - </template> - </el-table-column> - <el-table-column label="鐗╃悊绫诲瀷" prop="columnType" min-width="10%" :show-overflow-tooltip="true" /> - <el-table-column label="Java绫诲瀷" min-width="11%"> - <template #default="scope"> - <el-select v-model="scope.row.javaType"> - <el-option label="Long" value="Long" /> - <el-option label="String" value="String" /> - <el-option label="Integer" value="Integer" /> - <el-option label="Double" value="Double" /> - <el-option label="BigDecimal" value="BigDecimal" /> - <el-option label="Date" value="Date" /> - <el-option label="Boolean" value="Boolean" /> - </el-select> - </template> - </el-table-column> - <el-table-column label="java灞炴��" min-width="10%"> - <template #default="scope"> - <el-input v-model="scope.row.javaField"></el-input> - </template> - </el-table-column> - - <el-table-column label="鎻掑叆" min-width="5%"> - <template #default="scope"> - <el-checkbox true-label="1" false-label="0" v-model="scope.row.isInsert"></el-checkbox> - </template> - </el-table-column> - <el-table-column label="缂栬緫" min-width="5%"> - <template #default="scope"> - <el-checkbox true-label="1" false-label="0" v-model="scope.row.isEdit"></el-checkbox> - </template> - </el-table-column> - <el-table-column label="鍒楄〃" min-width="5%"> - <template #default="scope"> - <el-checkbox true-label="1" false-label="0" v-model="scope.row.isList"></el-checkbox> - </template> - </el-table-column> - <el-table-column label="鏌ヨ" min-width="5%"> - <template #default="scope"> - <el-checkbox true-label="1" false-label="0" v-model="scope.row.isQuery"></el-checkbox> - </template> - </el-table-column> - <el-table-column label="鏌ヨ鏂瑰紡" min-width="10%"> - <template #default="scope"> - <el-select v-model="scope.row.queryType"> - <el-option label="=" value="EQ" /> - <el-option label="!=" value="NE" /> - <el-option label=">" value="GT" /> - <el-option label=">=" value="GE" /> - <el-option label="<" value="LT" /> - <el-option label="<=" value="LE" /> - <el-option label="LIKE" value="LIKE" /> - <el-option label="BETWEEN" value="BETWEEN" /> - </el-select> - </template> - </el-table-column> - <el-table-column label="蹇呭~" min-width="5%"> - <template #default="scope"> - <el-checkbox true-label="1" false-label="0" v-model="scope.row.isRequired"></el-checkbox> - </template> - </el-table-column> - <el-table-column label="鏄剧ず绫诲瀷" min-width="12%"> - <template #default="scope"> - <el-select v-model="scope.row.htmlType"> - <el-option label="鏂囨湰妗�" value="input" /> - <el-option label="鏂囨湰鍩�" value="textarea" /> - <el-option label="涓嬫媺妗�" value="select" /> - <el-option label="鍗曢�夋" value="radio" /> - <el-option label="澶嶉�夋" value="checkbox" /> - <el-option label="鏃ユ湡鎺т欢" value="datetime" /> - <el-option label="鍥剧墖涓婁紶" value="imageUpload" /> - <el-option label="鏂囦欢涓婁紶" value="fileUpload" /> - <el-option label="瀵屾枃鏈帶浠�" value="editor" /> - </el-select> - </template> - </el-table-column> - <el-table-column label="瀛楀吀绫诲瀷" min-width="12%"> - <template #default="scope"> - <el-select v-model="scope.row.dictType" clearable filterable placeholder="璇烽�夋嫨"> - <el-option v-for="dict in dictOptions" :key="dict.dictType" :label="dict.dictName" :value="dict.dictType"> - <span style="float: left">{{ dict.dictName }}</span> - <span style="float: right; color: #8492a6; font-size: 13px">{{ dict.dictType }}</span> - </el-option> - </el-select> - </template> - </el-table-column> - </el-table> - </el-tab-pane> - <el-tab-pane label="鐢熸垚淇℃伅" name="genInfo"> - <gen-info-form ref="genInfo" :info="info" :tables="tables" /> - </el-tab-pane> - </el-tabs> - <el-form label-width="100px"> - <div style="text-align: center;margin-left:-100px;margin-top:10px;"> - <el-button type="primary" @click="submitForm()">鎻愪氦</el-button> - <el-button @click="close()">杩斿洖</el-button> - </div> - </el-form> - </el-card> -</template> -- Gitblit v1.9.3