open-source/eladmin-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

代码生成器优化

Browse Source
This commit is contained in:
dqjdda
2019-11-17 22:39:44 +08:00
parent ece50a3e54
commit a4d74a3a6f
7 changed files with 230 additions and 311 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/api/dict.js
View File

@@ -1,5 +1,12 @@
import request from '@/utils/request' import request from '@/utils/request'
export function getDicts() {
return request({
url: 'api/dict/all',
method: 'get'
})
}
export function add(data) { export function add(data) {
return request({ return request({
url: 'api/dict', url: 'api/dict',

4
src/api/genConfig.js
View File

@@ -1,8 +1,8 @@
import request from '@/utils/request' import request from '@/utils/request'
export function get() { export function get(tableName) {
return request({ return request({
url: 'api/genConfig', url: 'api/genConfig/' + tableName,
method: 'get' method: 'get'
}) })
} }

17
src/api/generator.js
View File

@@ -1,5 +1,13 @@
import request from '@/utils/request' import request from '@/utils/request'
// export function getAllTable() {
// return request({
// url: 'api/generator?tableName=' + tableName,
// data,
// method: 'post'
// })
// }
export function generator(data, tableName) { export function generator(data, tableName) {
return request({ return request({
url: 'api/generator?tableName=' + tableName, url: 'api/generator?tableName=' + tableName,
@@ -7,3 +15,12 @@ export function generator(data, tableName) {
method: 'post' method: 'post'
}) })
} }
export function save(data) {
return request({
url: 'api/generator',
data,
method: 'put'
})
}

28
src/router/routers.js
View File

@@ -72,21 +72,21 @@ export const constantRouterMap = [
meta: { title: '个人中心' } meta: { title: '个人中心' }
} }
] ]
},
{
path: '/generator',
component: Layout,
hidden: true,
redirect: 'noredirect',
children: [
{
path: 'config/:tableName',
component: () => import('@/views/generator/config'),
name: 'GeneratorIndex',
meta: { title: '生成配置' }
}
]
} }
// {
// path: '/generator',
// component: Layout,
// hidden: true,
// redirect: 'noredirect',
// children: [
// {
// path: 'config/:tableName',
// component: () => import('@/views/generator/config'),
// name: 'GeneratorIndex',
// meta: { title: '生成配置' }
// }
// ]
// }
// { path: '*', redirect: '/404', hidden: true } // { path: '*', redirect: '/404', hidden: true }
] ]

300
src/views/generator/config.vue
View File

@@ -1,119 +1,176 @@
<template> <template>
<el-tabs v-model="activeName" style="padding-left: 5px;"> <div class="app-container">
<el-tab-pane label="基本配置" name="first"> <el-row :gutter="15">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="90px"> <!--角色管理-->
<el-form-item label="模块名称" prop="moduleName"> <el-col style="margin-bottom: 10px">
<el-input v-model="form.moduleName"/> <el-card class="box-card" shadow="never">
</el-form-item> <div slot="header" class="clearfix">
<el-form-item label="至于包下" prop="pack"> <span class="role-span">字段配置</span>
<el-input v-model="form.pack"/> <el-button
</el-form-item> :loading="columnLoading"
<el-form-item label="前端路径" prop="path"> icon="el-icon-check"
<el-input v-model="form.path"/> size="mini"
</el-form-item> style="float: right; padding: 6px 9px"
<el-form-item label="作者名称" prop="author"> type="primary"
<el-input v-model="form.author"/> @click="saveColumnConfig">保存</el-button>
</el-form-item> </div>
<el-form-item label="去表前缀" prop="prefix"> <el-form size="small" label-width="90px">
<el-input v-model="form.prefix" placeholder="默认不去除表前缀"/> <el-table v-loading="loading" :data="data" :max-height="tableHeight" size="small" style="width: 100%;margin-bottom: 15px">
</el-form-item> <el-table-column prop="tableName" label="表名"/>
<!-- <el-form-item label="Api路径">--> <el-table-column prop="columnName" label="字段名称"/>
<!-- <el-input v-model="form.apiPath"/>--> <el-table-column prop="columnType" label="字段类型"/>
<!-- </el-form-item>--> <el-table-column prop="remark" label="字段描述">
<el-form-item label="是否覆盖" prop="cover"> <template slot-scope="scope">
<el-radio-group v-model="form.cover" size="mini"> <el-input v-model="data[scope.$index].remark" size="mini" class="edit-input"/>
<el-radio-button label="true">是</el-radio-button> </template>
<el-radio-button label="false">否</el-radio-button> </el-table-column>
</el-radio-group> <el-table-column align="center" label="必填">
</el-form-item> <template slot-scope="scope">
</el-form> <el-checkbox v-model="data[scope.$index].notNull"/>
</el-tab-pane> </template>
<el-tab-pane label="字段配置" name="second"> </el-table-column>
<el-form size="small" label-width="90px"> <el-table-column align="center" label="列表">
<el-table v-loading="loading" :data="data" :height="tableHeight" size="small" style="width: 100%;margin-bottom: 15px"> <template slot-scope="scope">
<el-table-column label="序号" width="80" align="center"> <el-checkbox v-model="data[scope.$index].listShow"/>
<template slot-scope="scope"> </template>
<div>{{ scope.$index + 1 }}</div> </el-table-column>
</template> <el-table-column align="center" label="表单">
</el-table-column> <template slot-scope="scope">
<el-table-column prop="columnName" label="字段名称"/> <el-checkbox v-model="data[scope.$index].formShow"/>
<el-table-column prop="columnType" label="字段类型"/> </template>
<el-table-column prop="columnComment" label="字段描述"> </el-table-column>
<template slot-scope="scope"> <el-table-column label="表单类型">
<el-input v-model="data[scope.$index].columnComment" size="mini" class="edit-input"/> <template slot-scope="scope">
</template> <el-select v-model="data[scope.$index].formType" filterable class="edit-input" clearable size="mini" placeholder="请选择">
</el-table-column> <el-option
<el-table-column align="center" prop="columnShow" label="必填"> label="文本框"
<template slot-scope="scope"> value="Input"/>
<el-switch <el-option
v-model="data[scope.$index].columnShow" label="文本域"
active-color="#409EFF" value="Textarea"/>
inactive-color="#F56C6C" <el-option
active-value="true" label="单选框"
inactive-value="false"/> value="Radio"/>
</template> <el-option
</el-table-column> label="下拉框"
<el-table-column align="center" prop="columnShow" label="表单"> value="Select"/>
<template slot-scope="scope"> <el-option
<el-switch label="复选框"
v-model="data[scope.$index].columnShow" value="Checkbox"/>
active-color="#409EFF" <el-option
inactive-color="#F56C6C" label="日期框"
active-value="true" value="Date"/>
inactive-value="false"/> </el-select>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="columnShow" label="列表"> <el-table-column label="查询方式">
<template slot-scope="scope"> <template slot-scope="scope">
<el-switch <el-select v-model="data[scope.$index].queryType" filterable class="edit-input" clearable size="mini" placeholder="请选择">
v-model="data[scope.$index].columnShow" <el-option
active-color="#409EFF" label="="
inactive-color="#F56C6C" value="="/>
active-value="true" <el-option
inactive-value="false"/> label="!="
</template> value="!="/>
</el-table-column> <el-option
<el-table-column label="查询方式"> label=">="
<template slot-scope="scope"> value=">="/>
<el-select v-model="data[scope.$index].columnQuery" class="edit-input" clearable size="mini" placeholder="请选择"> <el-option
<el-option label="<="
label="模糊查询" value="<="/>
value="1"/> <el-option
<el-option label="Like"
label="精确查询" value="Like"/>
value="2"/> </el-select>
</el-select> </template>
</template> </el-table-column>
</el-table-column> <el-table-column label="关联字典">
<el-table-column label="关联字典"> <template slot-scope="scope">
<template slot-scope="scope"> <el-select v-model="data[scope.$index].dictName" filterable class="edit-input" clearable size="mini" placeholder="请选择">
<el-select v-model="data[scope.$index].columnQuery" class="edit-input" clearable size="mini" placeholder="请选择"> <el-option v-for="item in dicts" :key="item.id" :label="item.remark === '' ? item.name : item.remark" :value="item.name"/>
<el-option </el-select>
label="模糊查询" </template>
value="1"/> </el-table-column>
<el-option <el-table-column label="实体关联">
label="精确查询" <template slot-scope="scope">
value="2"/> <el-select v-model="data[scope.$index].joinName" filterable class="edit-input" clearable size="mini" placeholder="请选择">
</el-select> <el-option
</template> label="模糊查询"
</el-table-column> value="1"/>
</el-table> <el-option
</el-form> label="精确查询"
</el-tab-pane> value="2"/>
</el-tabs> </el-select>
</template>
</el-table-column>
</el-table>
</el-form>
</el-card>
</el-col>
<el-col>
<el-card class="box-card" shadow="never">
<div slot="header" class="clearfix">
<span class="role-span">生成配置</span>
<el-button
:loading="configLoading"
icon="el-icon-check"
size="mini"
style="float: right; padding: 6px 9px"
type="primary"
@click="doSubmit">保存</el-button>
</div>
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="78px">
<el-form-item label="作者名称" prop="author">
<el-input v-model="form.author" style="width: 40%"/>
<span style="color: #C0C0C0;margin-left: 10px;">类上面的作者名称</span>
</el-form-item>
<el-form-item label="模块名称" prop="moduleName">
<el-input v-model="form.moduleName" style="width: 40%"/>
<span style="color: #C0C0C0;margin-left: 10px;">模块的名称，请选择项目中已存在的模块</span>
</el-form-item>
<el-form-item label="至于包下" prop="pack">
<el-input v-model="form.pack" style="width: 40%"/>
<span style="color: #C0C0C0;margin-left: 10px;">项目包的名称，生成的代码放到哪个包里面</span>
</el-form-item>
<el-form-item label="前端路径" prop="path">
<el-input v-model="form.path" style="width: 40%"/>
<span style="color: #C0C0C0;margin-left: 10px;">输入views文件夹下的目录，不存在即创建</span>
</el-form-item>
<el-form-item label="去表前缀" prop="prefix">
<el-input v-model="form.prefix" placeholder="默认不去除表前缀" style="width: 40%"/>
<span style="color: #C0C0C0;margin-left: 10px;">默认不去除表前缀，可自定义</span>
</el-form-item>
<!-- <el-form-item label="Api路径">-->
<!-- <el-input v-model="form.apiPath"/>-->
<!-- <span style="color: #C0C0C0;margin-left: 10px;">Sender mailbox</span>-->
<!-- </el-form-item>-->
<el-form-item label="是否覆盖" prop="cover">
<el-radio-group v-model="form.cover" size="mini" style="width: 40%">
<el-radio-button label="true">是</el-radio-button>
<el-radio-button label="false">否</el-radio-button>
</el-radio-group>
<span style="color: #C0C0C0;margin-left: 10px;">危险选型，请考虑后选择</span>
</el-form-item>
</el-form>
</el-card>
</el-col>
</el-row>
</div>
</template> </template>
<script> <script>
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { update, get } from '@/api/genConfig' import { update, get } from '@/api/genConfig'
import { save } from '@/api/generator'
import { getDicts } from '@/api/dict'
export default { export default {
name: 'GeneratorConfig', name: 'GeneratorConfig',
components: {}, components: {},
mixins: [initData], mixins: [initData],
data() { data() {
return { return {
activeName: 'second', tableName: '', tableHeight: 550, activeName: 'first', tableName: '', tableHeight: 550, columnLoading: false, configLoading: false, dicts: [],
form: { author: '', pack: '', path: '', moduleName: '', cover: 'false', apiPath: '', prefix: '' }, form: { id: null, tableName: '', author: '', pack: '', path: '', moduleName: '', cover: 'false', apiPath: '', prefix: '' },
rules: { rules: {
author: [ author: [
{ required: true, message: '作者不能为空', trigger: 'blur' } { required: true, message: '作者不能为空', trigger: 'blur' }
@@ -134,14 +191,17 @@ export default {
} }
}, },
created() { created() {
this.tableHeight = document.documentElement.clientHeight - 260 this.tableHeight = document.documentElement.clientHeight - 385
this.tableName = this.$route.params.tableName this.tableName = this.$route.params.tableName
this.$nextTick(() => { this.$nextTick(() => {
this.init() this.init()
get().then(data => { get(this.tableName).then(data => {
this.form = data this.form = data
this.form.cover = this.form.cover.toString() this.form.cover = this.form.cover.toString()
}) })
getDicts().then(data => {
this.dicts = data
})
}) })
}, },
methods: { methods: {
@@ -151,19 +211,37 @@ export default {
this.params = { tableName } this.params = { tableName }
return true return true
}, },
cancel() { saveColumnConfig() {
this.$refs['form'].resetFields() this.columnLoading = true
save(this.data).then(res => {
this.$notify({
title: '保存成功',
type: 'success',
duration: 2500
})
this.columnLoading = false
}).catch(err => {
this.columnLoading = false
console.log(err.response.data.message)
})
}, },
doSubmit() { doSubmit() {
this.$refs['form'].validate((valid) => { this.$refs['form'].validate((valid) => {
if (valid) { if (valid) {
this.configLoading = true
update(this.form).then(res => { update(this.form).then(res => {
this.$notify({
title: '保存成功',
type: 'success',
duration: 2500
})
this.form = res
this.form.cover = this.form.cover.toString()
this.configLoading = false
}).catch(err => { }).catch(err => {
this.cancel() this.configLoading = false
console.log(err.response.data.message) console.log(err.response.data.message)
}) })
} else {
return false
} }
}) })
} }

181
src/views/generator/generator.vue
View File

@@ -1,181 +0,0 @@
<template>
<div>
<el-button type="primary" icon="el-icon-position" size="mini" @click="toGen"/>
<el-dialog :visible.sync="dialog" :close-on-click-modal="false" :before-close="cancel" title="代码生成配置" append-to-body width="880px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="90px">
<el-form-item label="模块名称" prop="moduleName">
<el-input v-model="form.moduleName"/>
</el-form-item>
<el-form-item label="至于包下" prop="pack">
<el-input v-model="form.pack"/>
</el-form-item>
<el-form-item label="前端路径" prop="path">
<el-input v-model="form.path"/>
</el-form-item>
<el-table v-loading="loading" :data="data" size="small" style="width: 100%;margin-bottom: 15px">
<el-table-column label="序号" width="80" align="center">
<template slot-scope="scope">
<div>{{ scope.$index + 1 }}</div>
</template>
</el-table-column>
<el-table-column prop="columnName" label="字段名称"/>
<el-table-column prop="columnType" label="字段类型"/>
<el-table-column prop="columnComment" label="字段标题">
<template slot-scope="scope">
<el-input v-model="data[scope.$index].columnComment" class="edit-input"/>
</template>
</el-table-column>
<el-table-column label="查询方式">
<template slot-scope="scope">
<el-select v-model="data[scope.$index].columnQuery" class="edit-input" clearable placeholder="请选择">
<el-option
label="模糊查询"
value="1"/>
<el-option
label="精确查询"
value="2"/>
</el-select>
</template>
</el-table-column>
<el-table-column align="center" prop="columnShow" label="列表显示">
<template slot-scope="scope">
<el-tooltip :content="scope.row.columnShow === 'true' ?'显示':'不显示'" placement="top">
<el-switch
v-model="data[scope.$index].columnShow"
active-color="#13ce66"
inactive-color="#ff4949"
active-value="true"
inactive-value="false"/>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<el-form-item label="作者名称" prop="author">
<el-input v-model="form.author"/>
</el-form-item>
<el-form-item label="去表前缀" prop="prefix">
<el-input v-model="form.prefix" placeholder="默认不去除表前缀"/>
</el-form-item>
<!-- 可自定义显示配置 -->
<!-- <el-form-item label="Api路径">-->
<!-- <el-input v-model="form.apiPath"/>-->
<!-- </el-form-item>-->
<el-form-item label="是否覆盖" prop="cover">
<el-radio-group v-model="form.cover" size="mini">
<el-radio-button label="true">是</el-radio-button>
<el-radio-button label="false">否</el-radio-button>
</el-radio-group>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="cancel">取消</el-button>
<el-button :loading="genLoading" type="primary" @click="doSubmit">生成</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import initData from '@/mixins/initData'
import { update, get } from '@/api/genConfig'
import { generator } from '@/api/generator'
export default {
name: 'Generator',
mixins: [initData],
props: {
name: {
type: String,
required: true
}
},
data() {
return {
genLoading: false, dialog: false, columnQuery: '',
form: { author: '', pack: '', path: '', moduleName: '', cover: 'false', apiPath: '', prefix: '' },
rules: {
author: [
{ required: true, message: '作者不能为空', trigger: 'blur' }
],
pack: [
{ required: true, message: '包路径不能为空', trigger: 'blur' }
],
moduleName: [
{ required: true, message: '包路径不能为空', trigger: 'blur' }
],
path: [
{ required: true, message: '前端代码生成路径不能为空', trigger: 'blur' }
],
cover: [
{ required: true, message: '不能为空', trigger: 'blur' }
]
}
}
},
methods: {
toGen() {
this.dialog = true
this.$nextTick(() => {
this.init()
get().then(data => {
this.form = data
this.form.cover = this.form.cover.toString()
})
})
},
beforeInit() {
this.url = 'api/generator/columns'
const tableName = this.name
this.params = { tableName }
return true
},
cancel() {
this.dialog = false
this.genLoading = false
this.$refs['form'].resetFields()
this.form = { author: '', pack: '', path: '', moduleName: '', cover: 'false', apiPath: '', prefix: '' }
},
doSubmit() {
this.genLoading = true
this.$refs['form'].validate((valid) => {
if (valid) {
update(this.form).then(res => {
generator(this.data, this.name).then(res => {
this.$notify({
title: '生成成功',
type: 'success',
duration: 2500
})
this.cancel()
}).catch(err => {
this.cancel()
console.log(err.response.data.message)
})
}).catch(err => {
this.cancel()
console.log(err.response.data.message)
})
} else {
return false
}
})
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss">
.edit-input {
.el-input__inner {
border: none;
}
}
</style>
<style scoped>
/deep/ .el-dialog__body{
padding-bottom: 5px;
}
/deep/ .input-with-select .el-input-group__prepend {
background-color: #fff;
}
</style>

4
src/views/generator/index.vue
View File

@@ -25,7 +25,7 @@
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" style="margin-right: 2px" type="text">预览</el-button> <el-button size="mini" style="margin-right: 2px" type="text">预览</el-button>
<el-button size="mini" style="margin-left: -1px;margin-right: 2px" type="text"> <el-button size="mini" style="margin-left: -1px;margin-right: 2px" type="text">
<router-link :to="'/generator/config/' + scope.row.tableName"> <router-link :to="'/sys-tools/generator/config/' + scope.row.tableName">
编辑 编辑
</router-link> </router-link>
</el-button> </el-button>
@@ -47,10 +47,8 @@
<script> <script>
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { parseTime } from '@/utils/index' import { parseTime } from '@/utils/index'
import Generator from './generator'
export default { export default {
name: 'GeneratorIndex', name: 'GeneratorIndex',
components: { Generator },
mixins: [initData], mixins: [initData],
data() { data() {
return { return {