From 64d172717748c383a5c88348037354bffd60f966 Mon Sep 17 00:00:00 2001 From: gaoluyang <2820782392@qq.com> Date: 星期二, 27 五月 2025 17:52:03 +0800 Subject: [PATCH] 页面样式修改 --- src/views/tool/gen/genInfoForm.vue | 305 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 305 insertions(+), 0 deletions(-) diff --git a/src/views/tool/gen/genInfoForm.vue b/src/views/tool/gen/genInfoForm.vue new file mode 100644 index 0000000..75046e8 --- /dev/null +++ b/src/views/tool/gen/genInfoForm.vue @@ -0,0 +1,305 @@ +<template> + <el-form ref="genInfoForm" :model="info" :rules="rules" label-width="150px"> + <el-row> + <el-col :span="12"> + <el-form-item prop="tplCategory"> + <template #label>鐢熸垚妯℃澘</template> + <el-select v-model="info.tplCategory" @change="tplSelectChange"> + <el-option label="鍗曡〃锛堝鍒犳敼鏌ワ級" value="crud" /> + <el-option label="鏍戣〃锛堝鍒犳敼鏌ワ級" value="tree" /> + <el-option label="涓诲瓙琛紙澧炲垹鏀规煡锛�" value="sub" /> + </el-select> + </el-form-item> + </el-col> + + <el-col :span="12"> + <el-form-item prop="tplWebType"> + <template #label>鍓嶇绫诲瀷</template> + <el-select v-model="info.tplWebType"> + <el-option label="Vue2 Element UI 妯$増" value="element-ui" /> + <el-option label="Vue3 Element Plus 妯$増" value="element-plus" /> + </el-select> + </el-form-item> + </el-col> + + <el-col :span="12"> + <el-form-item prop="packageName"> + <template #label> + 鐢熸垚鍖呰矾寰� + <el-tooltip content="鐢熸垚鍦ㄥ摢涓猨ava鍖呬笅锛屼緥濡� com.ruoyi.system" placement="top"> + <el-icon><question-filled /></el-icon> + </el-tooltip> + </template> + <el-input v-model="info.packageName" /> + </el-form-item> + </el-col> + + <el-col :span="12"> + <el-form-item prop="moduleName"> + <template #label> + 鐢熸垚妯″潡鍚� + <el-tooltip content="鍙悊瑙d负瀛愮郴缁熷悕锛屼緥濡� system" placement="top"> + <el-icon><question-filled /></el-icon> + </el-tooltip> + </template> + <el-input v-model="info.moduleName" /> + </el-form-item> + </el-col> + + <el-col :span="12"> + <el-form-item prop="businessName"> + <template #label> + 鐢熸垚涓氬姟鍚� + <el-tooltip content="鍙悊瑙d负鍔熻兘鑻辨枃鍚嶏紝渚嬪 user" placement="top"> + <el-icon><question-filled /></el-icon> + </el-tooltip> + </template> + <el-input v-model="info.businessName" /> + </el-form-item> + </el-col> + + <el-col :span="12"> + <el-form-item prop="functionName"> + <template #label> + 鐢熸垚鍔熻兘鍚� + <el-tooltip content="鐢ㄤ綔绫绘弿杩帮紝渚嬪 鐢ㄦ埛" placement="top"> + <el-icon><question-filled /></el-icon> + </el-tooltip> + </template> + <el-input v-model="info.functionName" /> + </el-form-item> + </el-col> + + <el-col :span="12"> + <el-form-item prop="genType"> + <template #label> + 鐢熸垚浠g爜鏂瑰紡 + <el-tooltip content="榛樿涓簔ip鍘嬬缉鍖呬笅杞斤紝涔熷彲浠ヨ嚜瀹氫箟鐢熸垚璺緞" placement="top"> + <el-icon><question-filled /></el-icon> + </el-tooltip> + </template> + <el-radio v-model="info.genType" value="0">zip鍘嬬缉鍖�</el-radio> + <el-radio v-model="info.genType" value="1">鑷畾涔夎矾寰�</el-radio> + </el-form-item> + </el-col> + + <el-col :span="12"> + <el-form-item> + <template #label> + 涓婄骇鑿滃崟 + <el-tooltip content="鍒嗛厤鍒版寚瀹氳彍鍗曚笅锛屼緥濡� 绯荤粺绠$悊" placement="top"> + <el-icon><question-filled /></el-icon> + </el-tooltip> + </template> + <el-tree-select + v-model="info.parentMenuId" + :data="menuOptions" + :props="{ value: 'menuId', label: 'menuName', children: 'children' }" + value-key="menuId" + placeholder="璇烽�夋嫨绯荤粺鑿滃崟" + check-strictly + /> + </el-form-item> + </el-col> + + <el-col :span="24" v-if="info.genType == '1'"> + <el-form-item prop="genPath"> + <template #label> + 鑷畾涔夎矾寰� + <el-tooltip content="濉啓纾佺洏缁濆璺緞锛岃嫢涓嶅~鍐欙紝鍒欑敓鎴愬埌褰撳墠Web椤圭洰涓�" placement="top"> + <el-icon><question-filled /></el-icon> + </el-tooltip> + </template> + <el-input v-model="info.genPath"> + <template #append> + <el-dropdown> + <el-button type="primary"> + 鏈�杩戣矾寰勫揩閫熼�夋嫨 + <i class="el-icon-arrow-down el-icon--right"></i> + </el-button> + <template #dropdown> + <el-dropdown-menu> + <el-dropdown-item @click="info.genPath = '/'">鎭㈠榛樿鐨勭敓鎴愬熀纭�璺緞</el-dropdown-item> + </el-dropdown-menu> + </template> + </el-dropdown> + </template> + </el-input> + </el-form-item> + </el-col> + </el-row> + + <template v-if="info.tplCategory == 'tree'"> + <h4 class="form-header">鍏朵粬淇℃伅</h4> + <el-row v-show="info.tplCategory == 'tree'"> + <el-col :span="12"> + <el-form-item> + <template #label> + 鏍戠紪鐮佸瓧娈� + <el-tooltip content="鏍戞樉绀虹殑缂栫爜瀛楁鍚嶏紝 濡傦細dept_id" placement="top"> + <el-icon><question-filled /></el-icon> + </el-tooltip> + </template> + <el-select v-model="info.treeCode" placeholder="璇烽�夋嫨"> + <el-option + v-for="(column, index) in info.columns" + :key="index" + :label="column.columnName + '锛�' + column.columnComment" + :value="column.columnName" + ></el-option> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item> + <template #label> + 鏍戠埗缂栫爜瀛楁 + <el-tooltip content="鏍戞樉绀虹殑鐖剁紪鐮佸瓧娈靛悕锛� 濡傦細parent_Id" placement="top"> + <el-icon><question-filled /></el-icon> + </el-tooltip> + </template> + <el-select v-model="info.treeParentCode" placeholder="璇烽�夋嫨"> + <el-option + v-for="(column, index) in info.columns" + :key="index" + :label="column.columnName + '锛�' + column.columnComment" + :value="column.columnName" + ></el-option> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item> + <template #label> + 鏍戝悕绉板瓧娈� + <el-tooltip content="鏍戣妭鐐圭殑鏄剧ず鍚嶇О瀛楁鍚嶏紝 濡傦細dept_name" placement="top"> + <el-icon><question-filled /></el-icon> + </el-tooltip> + </template> + <el-select v-model="info.treeName" placeholder="璇烽�夋嫨"> + <el-option + v-for="(column, index) in info.columns" + :key="index" + :label="column.columnName + '锛�' + column.columnComment" + :value="column.columnName" + ></el-option> + </el-select> + </el-form-item> + </el-col> + </el-row> + </template> + + <template v-if="info.tplCategory == 'sub'"> + <h4 class="form-header">鍏宠仈淇℃伅</h4> + <el-row> + <el-col :span="12"> + <el-form-item> + <template #label> + 鍏宠仈瀛愯〃鐨勮〃鍚� + <el-tooltip content="鍏宠仈瀛愯〃鐨勮〃鍚嶏紝 濡傦細sys_user" placement="top"> + <el-icon><question-filled /></el-icon> + </el-tooltip> + </template> + <el-select v-model="info.subTableName" placeholder="璇烽�夋嫨" @change="subSelectChange"> + <el-option + v-for="(table, index) in tables" + :key="index" + :label="table.tableName + '锛�' + table.tableComment" + :value="table.tableName" + ></el-option> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item> + <template #label> + 瀛愯〃鍏宠仈鐨勫閿悕 + <el-tooltip content="瀛愯〃鍏宠仈鐨勫閿悕锛� 濡傦細user_id" placement="top"> + <el-icon><question-filled /></el-icon> + </el-tooltip> + </template> + <el-select v-model="info.subTableFkName" placeholder="璇烽�夋嫨"> + <el-option + v-for="(column, index) in subColumns" + :key="index" + :label="column.columnName + '锛�' + column.columnComment" + :value="column.columnName" + ></el-option> + </el-select> + </el-form-item> + </el-col> + </el-row> + </template> + + </el-form> +</template> + +<script setup> +import { listMenu } from "@/api/system/menu" + +const subColumns = ref([]) +const menuOptions = ref([]) +const { proxy } = getCurrentInstance() + +const props = defineProps({ + info: { + type: Object, + default: null + }, + tables: { + type: Array, + default: null + } +}) + +// 琛ㄥ崟鏍¢獙 +const rules = ref({ + tplCategory: [{ required: true, message: "璇烽�夋嫨鐢熸垚妯℃澘", trigger: "blur" }], + packageName: [{ required: true, message: "璇疯緭鍏ョ敓鎴愬寘璺緞", trigger: "blur" }], + moduleName: [{ required: true, message: "璇疯緭鍏ョ敓鎴愭ā鍧楀悕", trigger: "blur" }], + businessName: [{ required: true, message: "璇疯緭鍏ョ敓鎴愪笟鍔″悕", trigger: "blur" }], + functionName: [{ required: true, message: "璇疯緭鍏ョ敓鎴愬姛鑳藉悕", trigger: "blur" }] +}) + +function subSelectChange(value) { + props.info.subTableFkName = "" +} + +function tplSelectChange(value) { + if (value !== "sub") { + props.info.subTableName = "" + props.info.subTableFkName = "" + } +} + +function setSubTableColumns(value) { + for (var item in props.tables) { + const name = props.tables[item].tableName + if (value === name) { + subColumns.value = props.tables[item].columns + break + } + } +} + +/** 鏌ヨ鑿滃崟涓嬫媺鏍戠粨鏋� */ +function getMenuTreeselect() { + listMenu().then(response => { + menuOptions.value = proxy.handleTree(response.data, "menuId") + }) +} + +onMounted(() => { + getMenuTreeselect() +}) + +watch(() => props.info.subTableName, val => { + setSubTableColumns(val) +}) + +watch(() => props.info.tplWebType, val => { + if (val === '') { + props.info.tplWebType = "element-plus" + } +}) +</script> -- Gitblit v1.9.3