From d2b61762b7c7815e343ad0d6c2673a6919f5e076 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=A8=9A=E5=B1=BF?= <1491182878@qq.com> Date: Wed, 8 Sep 2021 11:18:35 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E4=BB=A3=E7=A0=81=E7=94=9F?= =?UTF-8?q?=E6=88=90=E9=A1=B5=E9=9D=A2=E6=95=B0=E6=8D=AE=E7=BC=96=E8=BE=91?= =?UTF-8?q?=E4=BF=9D=E5=AD=98=E4=B9=8B=E5=90=8E=E6=80=BB=E6=98=AF=E8=B7=B3?= =?UTF-8?q?=E8=BD=AC=E7=AC=AC=E4=B8=80=E9=A1=B5=E7=9A=84=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ruoyi-ui/src/router/index.js | 320 +++++----- ruoyi-ui/src/views/tool/gen/editTable.vue | 464 +++++++-------- ruoyi-ui/src/views/tool/gen/index.vue | 683 +++++++++++----------- 3 files changed, 735 insertions(+), 732 deletions(-) diff --git a/ruoyi-ui/src/router/index.js b/ruoyi-ui/src/router/index.js index 6bfc48d58..a826980f2 100644 --- a/ruoyi-ui/src/router/index.js +++ b/ruoyi-ui/src/router/index.js @@ -1,160 +1,160 @@ -import Vue from 'vue' -import Router from 'vue-router' - -Vue.use(Router) - -/* Layout */ -import Layout from '@/layout' - -/** - * Note: 路由配置项 - * - * hidden: true // 当设置 true 的时候该路由不会再侧边栏出现 如401,login等页面,或者如一些编辑页面/edit/1 - * alwaysShow: true // 当你一个路由下面的 children 声明的路由大于1个时,自动会变成嵌套的模式--如组件页面 - * // 只有一个时,会将那个子路由当做根路由显示在侧边栏--如引导页面 - * // 若你想不管路由下面的 children 声明的个数都显示你的根路由 - * // 你可以设置 alwaysShow: true,这样它就会忽略之前定义的规则,一直显示根路由 - * redirect: noRedirect // 当设置 noRedirect 的时候该路由在面包屑导航中不可被点击 - * name:'router-name' // 设定路由的名字,一定要填写不然使用<keep-alive>时会出现各种问题 - * query: '{"id": 1, "name": "ry"}' // 访问路由的默认传递参数 - * meta : { - noCache: true // 如果设置为true,则不会被 <keep-alive> 缓存(默认 false) - title: 'title' // 设置该路由在侧边栏和面包屑中展示的名字 - icon: 'svg-name' // 设置该路由的图标,对应路径src/assets/icons/svg - breadcrumb: false // 如果设置为false,则不会在breadcrumb面包屑中显示 - activeMenu: '/system/user' // 当路由设置了该属性,则会高亮相对应的侧边栏。 - } - */ - -// 公共路由 -export const constantRoutes = [ - { - path: '/redirect', - component: Layout, - hidden: true, - children: [ - { - path: '/redirect/:path(.*)', - component: (resolve) => require(['@/views/redirect'], resolve) - } - ] - }, - { - path: '/login', - component: (resolve) => require(['@/views/login'], resolve), - hidden: true - }, - { - path: '/register', - component: (resolve) => require(['@/views/register'], resolve), - hidden: true - }, - { - path: '/404', - component: (resolve) => require(['@/views/error/404'], resolve), - hidden: true - }, - { - path: '/401', - component: (resolve) => require(['@/views/error/401'], resolve), - hidden: true - }, - { - path: '', - component: Layout, - redirect: 'index', - children: [ - { - path: 'index', - component: (resolve) => require(['@/views/index'], resolve), - name: 'Index', - meta: { title: '首页', icon: 'dashboard', affix: true } - } - ] - }, - { - path: '/user', - component: Layout, - hidden: true, - redirect: 'noredirect', - children: [ - { - path: 'profile', - component: (resolve) => require(['@/views/system/user/profile/index'], resolve), - name: 'Profile', - meta: { title: '个人中心', icon: 'user' } - } - ] - }, - { - path: '/system/user-auth', - component: Layout, - hidden: true, - children: [ - { - path: 'role/:userId(\\d+)', - component: (resolve) => require(['@/views/system/user/authRole'], resolve), - name: 'AuthRole', - meta: { title: '分配角色', activeMenu: '/system/user'} - } - ] - }, - { - path: '/system/role-auth', - component: Layout, - hidden: true, - children: [ - { - path: 'user/:roleId(\\d+)', - component: (resolve) => require(['@/views/system/role/authUser'], resolve), - name: 'AuthUser', - meta: { title: '分配用户', activeMenu: '/system/role'} - } - ] - }, - { - path: '/system/dict-data', - component: Layout, - hidden: true, - children: [ - { - path: 'index/:dictId(\\d+)', - component: (resolve) => require(['@/views/system/dict/data'], resolve), - name: 'Data', - meta: { title: '字典数据', activeMenu: '/system/dict'} - } - ] - }, - { - path: '/monitor/job-log', - component: Layout, - hidden: true, - children: [ - { - path: 'index', - component: (resolve) => require(['@/views/monitor/job/log'], resolve), - name: 'JobLog', - meta: { title: '调度日志', activeMenu: '/monitor/job'} - } - ] - }, - { - path: '/tool/gen-edit', - component: Layout, - hidden: true, - children: [ - { - path: 'index/:tableId(\\d+)', - component: (resolve) => require(['@/views/tool/gen/editTable'], resolve), - name: 'GenEdit', - meta: { title: '修改生成配置', activeMenu: '/tool/gen'} - } - ] - } -] - -export default new Router({ - mode: 'history', // 去掉url中的# - scrollBehavior: () => ({ y: 0 }), - routes: constantRoutes -}) +import Vue from 'vue' +import Router from 'vue-router' + +Vue.use(Router) + +/* Layout */ +import Layout from '@/layout' + +/** + * Note: 路由配置项 + * + * hidden: true // 当设置 true 的时候该路由不会再侧边栏出现 如401,login等页面,或者如一些编辑页面/edit/1 + * alwaysShow: true // 当你一个路由下面的 children 声明的路由大于1个时,自动会变成嵌套的模式--如组件页面 + * // 只有一个时,会将那个子路由当做根路由显示在侧边栏--如引导页面 + * // 若你想不管路由下面的 children 声明的个数都显示你的根路由 + * // 你可以设置 alwaysShow: true,这样它就会忽略之前定义的规则,一直显示根路由 + * redirect: noRedirect // 当设置 noRedirect 的时候该路由在面包屑导航中不可被点击 + * name:'router-name' // 设定路由的名字,一定要填写不然使用<keep-alive>时会出现各种问题 + * query: '{"id": 1, "name": "ry"}' // 访问路由的默认传递参数 + * meta : { + noCache: true // 如果设置为true,则不会被 <keep-alive> 缓存(默认 false) + title: 'title' // 设置该路由在侧边栏和面包屑中展示的名字 + icon: 'svg-name' // 设置该路由的图标,对应路径src/assets/icons/svg + breadcrumb: false // 如果设置为false,则不会在breadcrumb面包屑中显示 + activeMenu: '/system/user' // 当路由设置了该属性,则会高亮相对应的侧边栏。 + } + */ + +// 公共路由 +export const constantRoutes = [ + { + path: '/redirect', + component: Layout, + hidden: true, + children: [ + { + path: '/redirect/:path(.*)', + component: (resolve) => require(['@/views/redirect'], resolve) + } + ] + }, + { + path: '/login', + component: (resolve) => require(['@/views/login'], resolve), + hidden: true + }, + { + path: '/register', + component: (resolve) => require(['@/views/register'], resolve), + hidden: true + }, + { + path: '/404', + component: (resolve) => require(['@/views/error/404'], resolve), + hidden: true + }, + { + path: '/401', + component: (resolve) => require(['@/views/error/401'], resolve), + hidden: true + }, + { + path: '', + component: Layout, + redirect: 'index', + children: [ + { + path: 'index', + component: (resolve) => require(['@/views/index'], resolve), + name: 'Index', + meta: { title: '首页', icon: 'dashboard', affix: true } + } + ] + }, + { + path: '/user', + component: Layout, + hidden: true, + redirect: 'noredirect', + children: [ + { + path: 'profile', + component: (resolve) => require(['@/views/system/user/profile/index'], resolve), + name: 'Profile', + meta: { title: '个人中心', icon: 'user' } + } + ] + }, + { + path: '/system/user-auth', + component: Layout, + hidden: true, + children: [ + { + path: 'role/:userId(\\d+)', + component: (resolve) => require(['@/views/system/user/authRole'], resolve), + name: 'AuthRole', + meta: { title: '分配角色', activeMenu: '/system/user'} + } + ] + }, + { + path: '/system/role-auth', + component: Layout, + hidden: true, + children: [ + { + path: 'user/:roleId(\\d+)', + component: (resolve) => require(['@/views/system/role/authUser'], resolve), + name: 'AuthUser', + meta: { title: '分配用户', activeMenu: '/system/role'} + } + ] + }, + { + path: '/system/dict-data', + component: Layout, + hidden: true, + children: [ + { + path: 'index/:dictId(\\d+)', + component: (resolve) => require(['@/views/system/dict/data'], resolve), + name: 'Data', + meta: { title: '字典数据', activeMenu: '/system/dict'} + } + ] + }, + { + path: '/monitor/job-log', + component: Layout, + hidden: true, + children: [ + { + path: 'index', + component: (resolve) => require(['@/views/monitor/job/log'], resolve), + name: 'JobLog', + meta: { title: '调度日志', activeMenu: '/monitor/job'} + } + ] + }, + { + path: '/tool/gen-edit', + component: Layout, + hidden: true, + children: [ + { + path: 'index', + component: (resolve) => require(['@/views/tool/gen/editTable'], resolve), + name: 'GenEdit', + meta: { title: '修改生成配置', activeMenu: '/tool/gen'} + } + ] + } +] + +export default new Router({ + mode: 'history', // 去掉url中的# + scrollBehavior: () => ({ y: 0 }), + routes: constantRoutes +}) diff --git a/ruoyi-ui/src/views/tool/gen/editTable.vue b/ruoyi-ui/src/views/tool/gen/editTable.vue index 39071894e..a5c516838 100644 --- a/ruoyi-ui/src/views/tool/gen/editTable.vue +++ b/ruoyi-ui/src/views/tool/gen/editTable.vue @@ -1,232 +1,232 @@ -<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="cloum"> - <el-table ref="dragTable" :data="cloumns" row-key="columnId" :max-height="tableHeight"> - <el-table-column label="序号" type="index" min-width="5%" class-name="allowDrag" /> - <el-table-column - label="字段列名" - prop="columnName" - min-width="10%" - :show-overflow-tooltip="true" - /> - <el-table-column label="字段描述" min-width="10%"> - <template slot-scope="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 slot-scope="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-select> - </template> - </el-table-column> - <el-table-column label="java属性" min-width="10%"> - <template slot-scope="scope"> - <el-input v-model="scope.row.javaField"></el-input> - </template> - </el-table-column> - - <el-table-column label="插入" min-width="5%"> - <template slot-scope="scope"> - <el-checkbox true-label="1" v-model="scope.row.isInsert"></el-checkbox> - </template> - </el-table-column> - <el-table-column label="编辑" min-width="5%"> - <template slot-scope="scope"> - <el-checkbox true-label="1" v-model="scope.row.isEdit"></el-checkbox> - </template> - </el-table-column> - <el-table-column label="列表" min-width="5%"> - <template slot-scope="scope"> - <el-checkbox true-label="1" v-model="scope.row.isList"></el-checkbox> - </template> - </el-table-column> - <el-table-column label="查询" min-width="5%"> - <template slot-scope="scope"> - <el-checkbox true-label="1" v-model="scope.row.isQuery"></el-checkbox> - </template> - </el-table-column> - <el-table-column label="查询方式" min-width="10%"> - <template slot-scope="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="GTE" /> - <el-option label="<" value="LT" /> - <el-option label="<=" value="LTE" /> - <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 slot-scope="scope"> - <el-checkbox true-label="1" v-model="scope.row.isRequired"></el-checkbox> - </template> - </el-table-column> - <el-table-column label="显示类型" min-width="12%"> - <template slot-scope="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 slot-scope="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" :menus="menus"/> - </el-tab-pane> - </el-tabs> - <el-form label-width="100px"> - <el-form-item style="text-align: center;margin-left:-100px;margin-top:10px;"> - <el-button type="primary" @click="submitForm()">提交</el-button> - <el-button @click="close()">返回</el-button> - </el-form-item> - </el-form> - </el-card> -</template> -<script> -import { getGenTable, updateGenTable } from "@/api/tool/gen"; -import { optionselect as getDictOptionselect } from "@/api/system/dict/type"; -import { listMenu as getMenuTreeselect } from "@/api/system/menu"; -import basicInfoForm from "./basicInfoForm"; -import genInfoForm from "./genInfoForm"; -import Sortable from 'sortablejs' - -export default { - name: "GenEdit", - components: { - basicInfoForm, - genInfoForm - }, - data() { - return { - // 选中选项卡的 name - activeName: "cloum", - // 表格的高度 - tableHeight: document.documentElement.scrollHeight - 245 + "px", - // 表信息 - tables: [], - // 表列信息 - cloumns: [], - // 字典信息 - dictOptions: [], - // 菜单信息 - menus: [], - // 表详细信息 - info: {} - }; - }, - created() { - const tableId = this.$route.params && this.$route.params.tableId; - if (tableId) { - // 获取表详细信息 - getGenTable(tableId).then(res => { - this.cloumns = res.data.rows; - this.info = res.data.info; - this.tables = res.data.tables; - }); - /** 查询字典下拉列表 */ - getDictOptionselect().then(response => { - this.dictOptions = response.data; - }); - /** 查询菜单下拉列表 */ - getMenuTreeselect().then(response => { - this.menus = this.handleTree(response.data, "menuId"); - }); - } - }, - methods: { - /** 提交按钮 */ - submitForm() { - const basicForm = this.$refs.basicInfo.$refs.basicInfoForm; - const genForm = this.$refs.genInfo.$refs.genInfoForm; - Promise.all([basicForm, genForm].map(this.getFormPromise)).then(res => { - const validateResult = res.every(item => !!item); - if (validateResult) { - const genTable = Object.assign({}, basicForm.model, genForm.model); - genTable.columns = this.cloumns; - genTable.params = { - treeCode: genTable.treeCode, - treeName: genTable.treeName, - treeParentCode: genTable.treeParentCode, - parentMenuId: genTable.parentMenuId - }; - updateGenTable(genTable).then(res => { - this.msgSuccess(res.msg); - if (res.code === 200) { - this.close(); - } - }); - } else { - this.msgError("表单校验未通过,请重新检查提交内容"); - } - }); - }, - getFormPromise(form) { - return new Promise(resolve => { - form.validate(res => { - resolve(res); - }); - }); - }, - /** 关闭按钮 */ - close() { - this.$store.dispatch("tagsView/delView", this.$route); - this.$router.push({ path: "/tool/gen", query: { t: Date.now()}}) - } - }, - mounted() { - const el = this.$refs.dragTable.$el.querySelectorAll(".el-table__body-wrapper > table > tbody")[0]; - const sortable = Sortable.create(el, { - handle: ".allowDrag", - onEnd: evt => { - const targetRow = this.cloumns.splice(evt.oldIndex, 1)[0]; - this.cloumns.splice(evt.newIndex, 0, targetRow); - for (let index in this.cloumns) { - this.cloumns[index].sort = parseInt(index) + 1; - } - } - }); - } -}; -</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="cloum"> + <el-table ref="dragTable" :data="cloumns" row-key="columnId" :max-height="tableHeight"> + <el-table-column label="序号" type="index" min-width="5%" class-name="allowDrag" /> + <el-table-column + label="字段列名" + prop="columnName" + min-width="10%" + :show-overflow-tooltip="true" + /> + <el-table-column label="字段描述" min-width="10%"> + <template slot-scope="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 slot-scope="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-select> + </template> + </el-table-column> + <el-table-column label="java属性" min-width="10%"> + <template slot-scope="scope"> + <el-input v-model="scope.row.javaField"></el-input> + </template> + </el-table-column> + + <el-table-column label="插入" min-width="5%"> + <template slot-scope="scope"> + <el-checkbox true-label="1" v-model="scope.row.isInsert"></el-checkbox> + </template> + </el-table-column> + <el-table-column label="编辑" min-width="5%"> + <template slot-scope="scope"> + <el-checkbox true-label="1" v-model="scope.row.isEdit"></el-checkbox> + </template> + </el-table-column> + <el-table-column label="列表" min-width="5%"> + <template slot-scope="scope"> + <el-checkbox true-label="1" v-model="scope.row.isList"></el-checkbox> + </template> + </el-table-column> + <el-table-column label="查询" min-width="5%"> + <template slot-scope="scope"> + <el-checkbox true-label="1" v-model="scope.row.isQuery"></el-checkbox> + </template> + </el-table-column> + <el-table-column label="查询方式" min-width="10%"> + <template slot-scope="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="GTE" /> + <el-option label="<" value="LT" /> + <el-option label="<=" value="LTE" /> + <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 slot-scope="scope"> + <el-checkbox true-label="1" v-model="scope.row.isRequired"></el-checkbox> + </template> + </el-table-column> + <el-table-column label="显示类型" min-width="12%"> + <template slot-scope="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 slot-scope="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" :menus="menus"/> + </el-tab-pane> + </el-tabs> + <el-form label-width="100px"> + <el-form-item style="text-align: center;margin-left:-100px;margin-top:10px;"> + <el-button type="primary" @click="submitForm()">提交</el-button> + <el-button @click="close()">返回</el-button> + </el-form-item> + </el-form> + </el-card> +</template> +<script> +import { getGenTable, updateGenTable } from "@/api/tool/gen"; +import { optionselect as getDictOptionselect } from "@/api/system/dict/type"; +import { listMenu as getMenuTreeselect } from "@/api/system/menu"; +import basicInfoForm from "./basicInfoForm"; +import genInfoForm from "./genInfoForm"; +import Sortable from 'sortablejs' + +export default { + name: "GenEdit", + components: { + basicInfoForm, + genInfoForm + }, + data() { + return { + // 选中选项卡的 name + activeName: "cloum", + // 表格的高度 + tableHeight: document.documentElement.scrollHeight - 245 + "px", + // 表信息 + tables: [], + // 表列信息 + cloumns: [], + // 字典信息 + dictOptions: [], + // 菜单信息 + menus: [], + // 表详细信息 + info: {} + }; + }, + created() { + const tableId = this.$route.query && this.$route.query.tableId; + if (tableId) { + // 获取表详细信息 + getGenTable(tableId).then(res => { + this.cloumns = res.data.rows; + this.info = res.data.info; + this.tables = res.data.tables; + }); + /** 查询字典下拉列表 */ + getDictOptionselect().then(response => { + this.dictOptions = response.data; + }); + /** 查询菜单下拉列表 */ + getMenuTreeselect().then(response => { + this.menus = this.handleTree(response.data, "menuId"); + }); + } + }, + methods: { + /** 提交按钮 */ + submitForm() { + const basicForm = this.$refs.basicInfo.$refs.basicInfoForm; + const genForm = this.$refs.genInfo.$refs.genInfoForm; + Promise.all([basicForm, genForm].map(this.getFormPromise)).then(res => { + const validateResult = res.every(item => !!item); + if (validateResult) { + const genTable = Object.assign({}, basicForm.model, genForm.model); + genTable.columns = this.cloumns; + genTable.params = { + treeCode: genTable.treeCode, + treeName: genTable.treeName, + treeParentCode: genTable.treeParentCode, + parentMenuId: genTable.parentMenuId + }; + updateGenTable(genTable).then(res => { + this.msgSuccess(res.msg); + if (res.code === 200) { + this.close(); + } + }); + } else { + this.msgError("表单校验未通过,请重新检查提交内容"); + } + }); + }, + getFormPromise(form) { + return new Promise(resolve => { + form.validate(res => { + resolve(res); + }); + }); + }, + /** 关闭按钮 */ + close() { + this.$store.dispatch("tagsView/delView", this.$route); + this.$router.push({ path: "/tool/gen", query: { t: Date.now(), pageNum: this.$route.query.pageNum } }) + } + }, + mounted() { + const el = this.$refs.dragTable.$el.querySelectorAll(".el-table__body-wrapper > table > tbody")[0]; + const sortable = Sortable.create(el, { + handle: ".allowDrag", + onEnd: evt => { + const targetRow = this.cloumns.splice(evt.oldIndex, 1)[0]; + this.cloumns.splice(evt.newIndex, 0, targetRow); + for (let index in this.cloumns) { + this.cloumns[index].sort = parseInt(index) + 1; + } + } + }); + } +}; +</script> diff --git a/ruoyi-ui/src/views/tool/gen/index.vue b/ruoyi-ui/src/views/tool/gen/index.vue index e7eab3617..b69ce4498 100644 --- a/ruoyi-ui/src/views/tool/gen/index.vue +++ b/ruoyi-ui/src/views/tool/gen/index.vue @@ -1,340 +1,343 @@ -<template> - <div class="app-container"> - <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"> - <el-form-item label="表名称" prop="tableName"> - <el-input - v-model="queryParams.tableName" - placeholder="请输入表名称" - clearable - size="small" - @keyup.enter.native="handleQuery" - /> - </el-form-item> - <el-form-item label="表描述" prop="tableComment"> - <el-input - v-model="queryParams.tableComment" - placeholder="请输入表描述" - clearable - size="small" - @keyup.enter.native="handleQuery" - /> - </el-form-item> - <el-form-item label="创建时间"> - <el-date-picker - v-model="dateRange" - size="small" - style="width: 240px" - value-format="yyyy-MM-dd" - type="daterange" - range-separator="-" - start-placeholder="开始日期" - end-placeholder="结束日期" - ></el-date-picker> - </el-form-item> - <el-form-item> - <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> - <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> - </el-form-item> - </el-form> - - <el-row :gutter="10" class="mb8"> - <el-col :span="1.5"> - <el-button - type="primary" - plain - icon="el-icon-download" - size="mini" - @click="handleGenTable" - v-hasPermi="['tool:gen:code']" - >生成</el-button> - </el-col> - <el-col :span="1.5"> - <el-button - type="info" - plain - icon="el-icon-upload" - size="mini" - @click="openImportTable" - v-hasPermi="['tool:gen:import']" - >导入</el-button> - </el-col> - <el-col :span="1.5"> - <el-button - type="success" - plain - icon="el-icon-edit" - size="mini" - :disabled="single" - @click="handleEditTable" - v-hasPermi="['tool:gen:edit']" - >修改</el-button> - </el-col> - <el-col :span="1.5"> - <el-button - type="danger" - plain - icon="el-icon-delete" - size="mini" - :disabled="multiple" - @click="handleDelete" - v-hasPermi="['tool:gen:remove']" - >删除</el-button> - </el-col> - <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> - </el-row> - - <el-table v-loading="loading" :data="tableList" @selection-change="handleSelectionChange"> - <el-table-column type="selection" align="center" width="55"></el-table-column> - <el-table-column label="序号" type="index" width="50" align="center"> - <template slot-scope="scope"> - <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span> - </template> - </el-table-column> - <el-table-column - label="表名称" - align="center" - prop="tableName" - :show-overflow-tooltip="true" - width="120" - /> - <el-table-column - label="表描述" - align="center" - prop="tableComment" - :show-overflow-tooltip="true" - width="120" - /> - <el-table-column - label="实体" - align="center" - prop="className" - :show-overflow-tooltip="true" - width="120" - /> - <el-table-column label="创建时间" align="center" prop="createTime" width="160" /> - <el-table-column label="更新时间" align="center" prop="updateTime" width="160" /> - <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> - <template slot-scope="scope"> - <el-button - type="text" - size="small" - icon="el-icon-view" - @click="handlePreview(scope.row)" - v-hasPermi="['tool:gen:preview']" - >预览</el-button> - <el-button - type="text" - size="small" - icon="el-icon-edit" - @click="handleEditTable(scope.row)" - v-hasPermi="['tool:gen:edit']" - >编辑</el-button> - <el-button - type="text" - size="small" - icon="el-icon-delete" - @click="handleDelete(scope.row)" - v-hasPermi="['tool:gen:remove']" - >删除</el-button> - <el-button - type="text" - size="small" - icon="el-icon-refresh" - @click="handleSynchDb(scope.row)" - v-hasPermi="['tool:gen:edit']" - >同步</el-button> - <el-button - type="text" - size="small" - icon="el-icon-download" - @click="handleGenTable(scope.row)" - v-hasPermi="['tool:gen:code']" - >生成代码</el-button> - </template> - </el-table-column> - </el-table> - <pagination - v-show="total>0" - :total="total" - :page.sync="queryParams.pageNum" - :limit.sync="queryParams.pageSize" - @pagination="getList" - /> - <!-- 预览界面 --> - <el-dialog :title="preview.title" :visible.sync="preview.open" width="80%" top="5vh" append-to-body class="scrollbar"> - <el-tabs v-model="preview.activeName"> - <el-tab-pane - v-for="(value, key) in preview.data" - :label="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))" - :name="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))" - :key="key" - > - <pre><code class="hljs" v-html="highlightedCode(value, key)"></code></pre> - </el-tab-pane> - </el-tabs> - </el-dialog> - <import-table ref="import" @ok="handleQuery" /> - </div> -</template> - -<script> -import { listTable, previewTable, delTable, genCode, synchDb } from "@/api/tool/gen"; -import importTable from "./importTable"; -import { downLoadZip } from "@/utils/zipdownload"; -import hljs from "highlight.js/lib/highlight"; -import "highlight.js/styles/github-gist.css"; -hljs.registerLanguage("java", require("highlight.js/lib/languages/java")); -hljs.registerLanguage("xml", require("highlight.js/lib/languages/xml")); -hljs.registerLanguage("html", require("highlight.js/lib/languages/xml")); -hljs.registerLanguage("vue", require("highlight.js/lib/languages/xml")); -hljs.registerLanguage("javascript", require("highlight.js/lib/languages/javascript")); -hljs.registerLanguage("sql", require("highlight.js/lib/languages/sql")); - -export default { - name: "Gen", - components: { importTable }, - data() { - return { - // 遮罩层 - loading: true, - // 唯一标识符 - uniqueId: "", - // 选中数组 - ids: [], - // 选中表数组 - tableNames: [], - // 非单个禁用 - single: true, - // 非多个禁用 - multiple: true, - // 显示搜索条件 - showSearch: true, - // 总条数 - total: 0, - // 表数据 - tableList: [], - // 日期范围 - dateRange: "", - // 查询参数 - queryParams: { - pageNum: 1, - pageSize: 10, - tableName: undefined, - tableComment: undefined - }, - // 预览参数 - preview: { - open: false, - title: "代码预览", - data: {}, - activeName: "domain.java" - } - }; - }, - created() { - this.getList(); - }, - activated() { - const time = this.$route.query.t; - if (time != null && time != this.uniqueId) { - this.uniqueId = time; - this.resetQuery(); - } - }, - methods: { - /** 查询表集合 */ - getList() { - this.loading = true; - listTable(this.addDateRange(this.queryParams, this.dateRange)).then(response => { - this.tableList = response.rows; - this.total = response.total; - this.loading = false; - } - ); - }, - /** 搜索按钮操作 */ - handleQuery() { - this.queryParams.pageNum = 1; - this.getList(); - }, - /** 生成代码操作 */ - handleGenTable(row) { - const tableNames = row.tableName || this.tableNames; - if (tableNames == "") { - this.msgError("请选择要生成的数据"); - return; - } - if(row.genType === "1") { - genCode(row.tableName).then(response => { - this.msgSuccess("成功生成到自定义路径:" + row.genPath); - }); - } else { - downLoadZip("/tool/gen/batchGenCode?tables=" + tableNames, "ruoyi"); - } - }, - /** 同步数据库操作 */ - handleSynchDb(row) { - const tableName = row.tableName; - this.$confirm('确认要强制同步"' + tableName + '"表结构吗?', "警告", { - confirmButtonText: "确定", - cancelButtonText: "取消", - type: "warning" - }).then(function() { - return synchDb(tableName); - }).then(() => { - this.msgSuccess("同步成功"); - }).catch(() => {}); - }, - /** 打开导入表弹窗 */ - openImportTable() { - this.$refs.import.show(); - }, - /** 重置按钮操作 */ - resetQuery() { - this.dateRange = []; - this.resetForm("queryForm"); - this.handleQuery(); - }, - /** 预览按钮 */ - handlePreview(row) { - previewTable(row.tableId).then(response => { - this.preview.data = response.data; - this.preview.open = true; - }); - }, - /** 高亮显示 */ - highlightedCode(code, key) { - const vmName = key.substring(key.lastIndexOf("/") + 1, key.indexOf(".vm")); - var language = vmName.substring(vmName.indexOf(".") + 1, vmName.length); - const result = hljs.highlight(language, code || "", true); - return result.value || ' '; - }, - // 多选框选中数据 - handleSelectionChange(selection) { - this.ids = selection.map(item => item.tableId); - this.tableNames = selection.map(item => item.tableName); - this.single = selection.length != 1; - this.multiple = !selection.length; - }, - /** 修改按钮操作 */ - handleEditTable(row) { - const tableId = row.tableId || this.ids[0]; - this.$router.push("/tool/gen-edit/index/" + tableId); - }, - /** 删除按钮操作 */ - handleDelete(row) { - const tableIds = row.tableId || this.ids; - this.$confirm('是否确认删除表编号为"' + tableIds + '"的数据项?', "警告", { - confirmButtonText: "确定", - cancelButtonText: "取消", - type: "warning" - }).then(function() { - return delTable(tableIds); - }).then(() => { - this.getList(); - this.msgSuccess("删除成功"); - }).catch(() => {}); - } - } -}; -</script> \ No newline at end of file +<template> + <div class="app-container"> + <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"> + <el-form-item label="表名称" prop="tableName"> + <el-input + v-model="queryParams.tableName" + placeholder="请输入表名称" + clearable + size="small" + @keyup.enter.native="handleQuery" + /> + </el-form-item> + <el-form-item label="表描述" prop="tableComment"> + <el-input + v-model="queryParams.tableComment" + placeholder="请输入表描述" + clearable + size="small" + @keyup.enter.native="handleQuery" + /> + </el-form-item> + <el-form-item label="创建时间"> + <el-date-picker + v-model="dateRange" + size="small" + style="width: 240px" + value-format="yyyy-MM-dd" + type="daterange" + range-separator="-" + start-placeholder="开始日期" + end-placeholder="结束日期" + ></el-date-picker> + </el-form-item> + <el-form-item> + <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> + <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> + </el-form-item> + </el-form> + + <el-row :gutter="10" class="mb8"> + <el-col :span="1.5"> + <el-button + type="primary" + plain + icon="el-icon-download" + size="mini" + @click="handleGenTable" + v-hasPermi="['tool:gen:code']" + >生成</el-button> + </el-col> + <el-col :span="1.5"> + <el-button + type="info" + plain + icon="el-icon-upload" + size="mini" + @click="openImportTable" + v-hasPermi="['tool:gen:import']" + >导入</el-button> + </el-col> + <el-col :span="1.5"> + <el-button + type="success" + plain + icon="el-icon-edit" + size="mini" + :disabled="single" + @click="handleEditTable" + v-hasPermi="['tool:gen:edit']" + >修改</el-button> + </el-col> + <el-col :span="1.5"> + <el-button + type="danger" + plain + icon="el-icon-delete" + size="mini" + :disabled="multiple" + @click="handleDelete" + v-hasPermi="['tool:gen:remove']" + >删除</el-button> + </el-col> + <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> + </el-row> + + <el-table v-loading="loading" :data="tableList" @selection-change="handleSelectionChange"> + <el-table-column type="selection" align="center" width="55"></el-table-column> + <el-table-column label="序号" type="index" width="50" align="center"> + <template slot-scope="scope"> + <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span> + </template> + </el-table-column> + <el-table-column + label="表名称" + align="center" + prop="tableName" + :show-overflow-tooltip="true" + width="120" + /> + <el-table-column + label="表描述" + align="center" + prop="tableComment" + :show-overflow-tooltip="true" + width="120" + /> + <el-table-column + label="实体" + align="center" + prop="className" + :show-overflow-tooltip="true" + width="120" + /> + <el-table-column label="创建时间" align="center" prop="createTime" width="160" /> + <el-table-column label="更新时间" align="center" prop="updateTime" width="160" /> + <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> + <template slot-scope="scope"> + <el-button + type="text" + size="small" + icon="el-icon-view" + @click="handlePreview(scope.row)" + v-hasPermi="['tool:gen:preview']" + >预览</el-button> + <el-button + type="text" + size="small" + icon="el-icon-edit" + @click="handleEditTable(scope.row)" + v-hasPermi="['tool:gen:edit']" + >编辑</el-button> + <el-button + type="text" + size="small" + icon="el-icon-delete" + @click="handleDelete(scope.row)" + v-hasPermi="['tool:gen:remove']" + >删除</el-button> + <el-button + type="text" + size="small" + icon="el-icon-refresh" + @click="handleSynchDb(scope.row)" + v-hasPermi="['tool:gen:edit']" + >同步</el-button> + <el-button + type="text" + size="small" + icon="el-icon-download" + @click="handleGenTable(scope.row)" + v-hasPermi="['tool:gen:code']" + >生成代码</el-button> + </template> + </el-table-column> + </el-table> + <pagination + v-show="total>0" + :total="total" + :page.sync="queryParams.pageNum" + :limit.sync="queryParams.pageSize" + @pagination="getList" + /> + <!-- 预览界面 --> + <el-dialog :title="preview.title" :visible.sync="preview.open" width="80%" top="5vh" append-to-body class="scrollbar"> + <el-tabs v-model="preview.activeName"> + <el-tab-pane + v-for="(value, key) in preview.data" + :label="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))" + :name="key.substring(key.lastIndexOf('/')+1,key.indexOf('.vm'))" + :key="key" + > + <pre><code class="hljs" v-html="highlightedCode(value, key)"></code></pre> + </el-tab-pane> + </el-tabs> + </el-dialog> + <import-table ref="import" @ok="handleQuery" /> + </div> +</template> + +<script> +import { listTable, previewTable, delTable, genCode, synchDb } from "@/api/tool/gen"; +import importTable from "./importTable"; +import { downLoadZip } from "@/utils/zipdownload"; +import hljs from "highlight.js/lib/highlight"; +import "highlight.js/styles/github-gist.css"; +hljs.registerLanguage("java", require("highlight.js/lib/languages/java")); +hljs.registerLanguage("xml", require("highlight.js/lib/languages/xml")); +hljs.registerLanguage("html", require("highlight.js/lib/languages/xml")); +hljs.registerLanguage("vue", require("highlight.js/lib/languages/xml")); +hljs.registerLanguage("javascript", require("highlight.js/lib/languages/javascript")); +hljs.registerLanguage("sql", require("highlight.js/lib/languages/sql")); + +export default { + name: "Gen", + components: { importTable }, + data() { + return { + // 遮罩层 + loading: true, + // 唯一标识符 + uniqueId: "", + // 选中数组 + ids: [], + // 选中表数组 + tableNames: [], + // 非单个禁用 + single: true, + // 非多个禁用 + multiple: true, + // 显示搜索条件 + showSearch: true, + // 总条数 + total: 0, + // 表数据 + tableList: [], + // 日期范围 + dateRange: "", + // 查询参数 + queryParams: { + pageNum: 1, + pageSize: 10, + tableName: undefined, + tableComment: undefined + }, + // 预览参数 + preview: { + open: false, + title: "代码预览", + data: {}, + activeName: "domain.java" + } + }; + }, + created() { + this.getList(); + }, + activated() { + const time = this.$route.query.t; + if (time != null && time != this.uniqueId) { + this.uniqueId = time; + this.queryParams.pageNum = Number(this.$route.query.pageNum); + this.dateRange = []; + this.resetForm("queryForm"); + this.getList(); + } + }, + methods: { + /** 查询表集合 */ + getList() { + this.loading = true; + listTable(this.addDateRange(this.queryParams, this.dateRange)).then(response => { + this.tableList = response.rows; + this.total = response.total; + this.loading = false; + } + ); + }, + /** 搜索按钮操作 */ + handleQuery() { + this.queryParams.pageNum = 1; + this.getList(); + }, + /** 生成代码操作 */ + handleGenTable(row) { + const tableNames = row.tableName || this.tableNames; + if (tableNames == "") { + this.msgError("请选择要生成的数据"); + return; + } + if(row.genType === "1") { + genCode(row.tableName).then(response => { + this.msgSuccess("成功生成到自定义路径:" + row.genPath); + }); + } else { + downLoadZip("/tool/gen/batchGenCode?tables=" + tableNames, "ruoyi"); + } + }, + /** 同步数据库操作 */ + handleSynchDb(row) { + const tableName = row.tableName; + this.$confirm('确认要强制同步"' + tableName + '"表结构吗?', "警告", { + confirmButtonText: "确定", + cancelButtonText: "取消", + type: "warning" + }).then(function() { + return synchDb(tableName); + }).then(() => { + this.msgSuccess("同步成功"); + }).catch(() => {}); + }, + /** 打开导入表弹窗 */ + openImportTable() { + this.$refs.import.show(); + }, + /** 重置按钮操作 */ + resetQuery() { + this.dateRange = []; + this.resetForm("queryForm"); + this.handleQuery(); + }, + /** 预览按钮 */ + handlePreview(row) { + previewTable(row.tableId).then(response => { + this.preview.data = response.data; + this.preview.open = true; + }); + }, + /** 高亮显示 */ + highlightedCode(code, key) { + const vmName = key.substring(key.lastIndexOf("/") + 1, key.indexOf(".vm")); + var language = vmName.substring(vmName.indexOf(".") + 1, vmName.length); + const result = hljs.highlight(language, code || "", true); + return result.value || ' '; + }, + // 多选框选中数据 + handleSelectionChange(selection) { + this.ids = selection.map(item => item.tableId); + this.tableNames = selection.map(item => item.tableName); + this.single = selection.length != 1; + this.multiple = !selection.length; + }, + /** 修改按钮操作 */ + handleEditTable(row) { + const tableId = row.tableId || this.ids[0]; + this.$router.push({ path: '/tool/gen-edit/index', query: { tableId: tableId, pageNum: this.queryParams.pageNum } }); + }, + /** 删除按钮操作 */ + handleDelete(row) { + const tableIds = row.tableId || this.ids; + this.$confirm('是否确认删除表编号为"' + tableIds + '"的数据项?', "警告", { + confirmButtonText: "确定", + cancelButtonText: "取消", + type: "warning" + }).then(function() { + return delTable(tableIds); + }).then(() => { + this.getList(); + this.msgSuccess("删除成功"); + }).catch(() => {}); + } + } +}; +</script>