11 changed files with 30701 additions and 10120 deletions
@ -0,0 +1,8 @@
|
||||
### 2023年7月1日 （zyh新增） |
||||
- 新增一个BXG模块里的代码生成器 .这个生成器后端部分暂时还有一些报错 |
||||
- 菜单SQL请让后端放进vue-pro的menu表： |
||||
``` |
||||
INSERT INTO `vue_pro`.`system_menu` (`id`, `name`, `permission`, `menu_type`, `hidden`, `sort`, `parent_id`, `path`, `icon`, `component`, `status`, `creator`, `create_time`, `updater`, `update_time`, `deleted`) VALUES (1884, 'BXG生成器', '', 2, 0, 0, 1600, 'generator', 'people', 'bxg/tools/generator/index', 0, '1', '2023-06-28 12:00:09', '1', '2023-06-28 12:05:21', b'0'); |
||||
INSERT INTO `vue_pro`.`system_menu` (`id`, `name`, `permission`, `menu_type`, `hidden`, `sort`, `parent_id`, `path`, `icon`, `component`, `status`, `creator`, `create_time`, `updater`, `update_time`, `deleted`) VALUES (1885, 'genconfig', '', 2, 0, 0, 1600, 'generator/config/:tableName', '#', 'bxg/tools/generator/config', 0, '1', '2023-06-28 14:43:47', '1', '2023-06-28 15:09:27', b'0'); |
||||
INSERT INTO `vue_pro`.`system_menu` (`id`, `name`, `permission`, `menu_type`, `hidden`, `sort`, `parent_id`, `path`, `icon`, `component`, `status`, `creator`, `create_time`, `updater`, `update_time`, `deleted`) VALUES (1886, 'preview', '', 2, 0, 0, 1600, 'generator/config/:tableName', '#', 'bxg/tools/generator/config', 0, '1', '2023-06-28 14:56:46', '1', '2023-06-28 15:09:45', b'0'); |
||||
``` |
||||
@ -0,0 +1,325 @@
|
||||
<template> |
||||
<div class="app-container"> |
||||
<el-row :gutter="15"> |
||||
<el-col style="margin-bottom: 10px"> |
||||
<el-card class="box-card" shadow="never"> |
||||
<div slot="header" class="clearfix"> |
||||
<span class="role-span">字段配置：{{ tableName }}</span> |
||||
<el-button |
||||
:loading="genLoading" |
||||
icon="el-icon-s-promotion" |
||||
size="mini" |
||||
style="float: right; padding: 6px 9px;" |
||||
type="success" |
||||
@click="toGen" |
||||
>保存&生成</el-button> |
||||
<el-button |
||||
:loading="columnLoading" |
||||
icon="el-icon-check" |
||||
size="mini" |
||||
style="float: right; padding: 6px 9px;margin-right: 9px" |
||||
type="primary" |
||||
@click="saveColumnConfig" |
||||
>保存</el-button> |
||||
<el-tooltip class="item" effect="dark" content="数据库中表字段变动时使用该功能" placement="top-start"> |
||||
<el-button |
||||
:loading="syncLoading" |
||||
icon="el-icon-refresh" |
||||
size="mini" |
||||
style="float: right; padding: 6px 9px;" |
||||
type="info" |
||||
@click="sync" |
||||
>同步</el-button> |
||||
</el-tooltip> |
||||
</div> |
||||
<el-form size="small" label-width="90px"> |
||||
<el-table v-loading="loading" :data="data" :max-height="tableHeight" size="small" style="width: 100%;margin-bottom: 15px"> |
||||
<el-table-column prop="columnName" label="字段名称" /> |
||||
<el-table-column prop="columnType" label="字段类型" /> |
||||
<el-table-column prop="remark" label="字段描述"> |
||||
<template slot-scope="scope"> |
||||
<el-input v-model="data[scope.$index].remark" size="mini" class="edit-input" /> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column align="center" label="必填" width="70px"> |
||||
<template slot-scope="scope"> |
||||
<el-checkbox v-model="data[scope.$index].notNull" /> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column align="center" label="列表" width="70px"> |
||||
<template slot-scope="scope"> |
||||
<el-checkbox v-model="data[scope.$index].listShow" /> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column align="center" label="表单" width="70px"> |
||||
<template slot-scope="scope"> |
||||
<el-checkbox v-model="data[scope.$index].formShow" /> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="表单类型"> |
||||
<template slot-scope="scope"> |
||||
<el-select v-model="data[scope.$index].formType" filterable class="edit-input" clearable size="mini" placeholder="请选择"> |
||||
<el-option |
||||
label="文本框" |
||||
value="Input" |
||||
/> |
||||
<el-option |
||||
label="文本域" |
||||
value="Textarea" |
||||
/> |
||||
<el-option |
||||
label="单选框" |
||||
value="Radio" |
||||
/> |
||||
<el-option |
||||
label="下拉框" |
||||
value="Select" |
||||
/> |
||||
<el-option |
||||
label="日期框" |
||||
value="Date" |
||||
/> |
||||
</el-select> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="查询方式"> |
||||
<template slot-scope="scope"> |
||||
<el-select v-model="data[scope.$index].queryType" filterable class="edit-input" clearable size="mini" placeholder="请选择"> |
||||
<el-option |
||||
label="=" |
||||
value="=" |
||||
/> |
||||
<el-option |
||||
label="!=" |
||||
value="!=" |
||||
/> |
||||
<el-option |
||||
label=">=" |
||||
value=">=" |
||||
/> |
||||
<el-option |
||||
label="<=" |
||||
value="<=" |
||||
/> |
||||
<el-option |
||||
label="Like" |
||||
value="Like" |
||||
/> |
||||
<el-option |
||||
label="NotNull" |
||||
value="NotNull" |
||||
/> |
||||
<el-option |
||||
label="BetWeen" |
||||
value="BetWeen" |
||||
/> |
||||
</el-select> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="日期注解"> |
||||
<template slot-scope="scope"> |
||||
<el-select v-model="data[scope.$index].dateAnnotation" filterable class="edit-input" clearable size="mini" placeholder="请选择"> |
||||
<el-option |
||||
label="自动创建时间" |
||||
value="CreationTimestamp" |
||||
/> |
||||
<el-option |
||||
label="自动更新时间" |
||||
value="UpdateTimestamp" |
||||
/> |
||||
</el-select> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="关联字典"> |
||||
<template slot-scope="scope"> |
||||
<el-select v-model="data[scope.$index].dictName" filterable 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-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="apiAlias"> |
||||
<el-input v-model="form.apiAlias" 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="接口目录">--> |
||||
<!-- <el-input v-model="form.apiPath" style="width: 40%" />--> |
||||
<!-- <span style="color: #C0C0C0;margin-left: 10px;">Api存放路径[src/api]，为空则自动生成路径</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="是否覆盖" 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> |
||||
|
||||
<script> |
||||
import crud from '@/mixins/crud' |
||||
import { update, get } from '@/api/generator/genConfig' |
||||
import { save, sync, generator } from '@/api/generator/generator' |
||||
import { getDicts } from '@/api/system/dict/data' |
||||
export default { |
||||
name: 'GeneratorConfig', |
||||
components: {}, |
||||
mixins: [crud], |
||||
data() { |
||||
return { |
||||
activeName: 'first', tableName: '', tableHeight: 550, columnLoading: false, configLoading: false, dicts: [], syncLoading: false, genLoading: false, |
||||
form: { id: null, tableName: '', author: '', pack: '', path: '', moduleName: '', cover: 'false', apiPath: '', prefix: '', apiAlias: null }, |
||||
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' } |
||||
], |
||||
apiAlias: [ |
||||
{ required: true, message: '接口名称不能为空', trigger: 'blur' } |
||||
], |
||||
cover: [ |
||||
{ required: true, message: '不能为空', trigger: 'blur' } |
||||
] |
||||
} |
||||
} |
||||
}, |
||||
created() { |
||||
this.tableHeight = document.documentElement.clientHeight - 385 |
||||
this.tableName = this.$route.params.tableName |
||||
this.$nextTick(() => { |
||||
this.init() |
||||
get(this.tableName).then(data => { |
||||
this.form = data |
||||
this.form.cover = this.form.cover.toString() |
||||
}) |
||||
getDicts().then(data => { |
||||
this.dicts = data |
||||
}) |
||||
}) |
||||
}, |
||||
methods: { |
||||
beforeInit() { |
||||
this.url = 'bxg/api/generator/columns' |
||||
const tableName = this.tableName |
||||
this.params = { tableName } |
||||
return true |
||||
}, |
||||
saveColumnConfig() { |
||||
this.columnLoading = true |
||||
save(this.data).then(res => { |
||||
this.notify('保存成功', 'success') |
||||
this.columnLoading = false |
||||
}).catch(err => { |
||||
this.columnLoading = false |
||||
console.log(err.response.data.message) |
||||
}) |
||||
}, |
||||
doSubmit() { |
||||
this.$refs['form'].validate((valid) => { |
||||
if (valid) { |
||||
this.configLoading = true |
||||
update(this.form).then(res => { |
||||
this.notify('保存成功', 'success') |
||||
this.form = res |
||||
this.form.cover = this.form.cover.toString() |
||||
this.configLoading = false |
||||
}).catch(err => { |
||||
this.configLoading = false |
||||
console.log(err.response.data.message) |
||||
}) |
||||
} |
||||
}) |
||||
}, |
||||
sync() { |
||||
this.syncLoading = true |
||||
sync([this.tableName]).then(() => { |
||||
this.init() |
||||
this.notify('同步成功', 'success') |
||||
this.syncLoading = false |
||||
}).then(() => { |
||||
this.syncLoading = false |
||||
}) |
||||
}, |
||||
toGen() { |
||||
this.genLoading = true |
||||
save(this.data).then(res => { |
||||
this.notify('保存成功', 'success') |
||||
// 生成代码 |
||||
generator(this.tableName, 0).then(data => { |
||||
this.genLoading = false |
||||
this.notify('生成成功', 'success') |
||||
}).catch(err => { |
||||
this.genLoading = false |
||||
console.log(err.response.data.message) |
||||
}) |
||||
}).catch(err => { |
||||
this.genLoading = false |
||||
console.log(err.response.data.message) |
||||
}) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style rel="stylesheet/scss" lang="scss"> |
||||
.edit-input { |
||||
.el-input__inner { |
||||
border: 1px solid #e5e6e7; |
||||
} |
||||
} |
||||
</style> |
||||
|
||||
<style scoped> |
||||
/deep/ .input-with-select .el-input-group__prepend { |
||||
background-color: #fff; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,122 @@
|
||||
<template> |
||||
<div class="app-container"> |
||||
<!--工具栏--> |
||||
<div class="head-container"> |
||||
<div v-if="crud.props.searchToggle"> |
||||
<el-input v-model="query.name" clearable size="small" placeholder="请输入表名" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" /> |
||||
<rrOperation :crud="crud" /> |
||||
</div> |
||||
<crudOperation> |
||||
<el-tooltip slot="right" class="item" effect="dark" content="数据库中表字段变动时使用该功能" placement="top-start"> |
||||
<el-button |
||||
class="filter-item" |
||||
size="mini" |
||||
type="success" |
||||
icon="el-icon-refresh" |
||||
:loading="syncLoading" |
||||
:disabled="crud.selections.length === 0" |
||||
@click="sync" |
||||
>同步</el-button> |
||||
</el-tooltip> |
||||
</crudOperation> |
||||
</div> |
||||
<!--表格渲染--> |
||||
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;height:calc(100vh - 300px);overflow-y: scroll;" @selection-change="crud.selectionChangeHandler"> |
||||
<el-table-column type="selection" width="55" /> |
||||
<el-table-column v-if="columns.visible('tableName')" :show-overflow-tooltip="true" prop="tableName" label="表名" /> |
||||
<el-table-column v-if="columns.visible('engine')" :show-overflow-tooltip="true" prop="engine" label="数据库引擎" /> |
||||
<el-table-column v-if="columns.visible('coding')" :show-overflow-tooltip="true" prop="coding" label="字符编码集" /> |
||||
<el-table-column v-if="columns.visible('remark')" :show-overflow-tooltip="true" prop="remark" label="备注" /> |
||||
<el-table-column v-if="columns.visible('createTime')" prop="createTime" label="创建日期"> |
||||
<template slot-scope="scope"> |
||||
<span>{{ parseTime(scope.row.createTime) }}</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="操作" width="160px" align="center" fixed="right"> |
||||
<template slot-scope="scope"> |
||||
<el-button size="mini" style="margin-right: 2px" type="text"> |
||||
<router-link :to="'/bxg/sys-tools/generator/preview/' + scope.row.tableName"> |
||||
预览 |
||||
</router-link> |
||||
</el-button> |
||||
<el-button size="mini" style="margin-left: -1px;margin-right: 2px" type="text" @click="toDownload(scope.row.tableName)">下载</el-button> |
||||
<el-button size="mini" style="margin-left: -1px;margin-right: 2px" type="text"> |
||||
<router-link :to="'/bxg/sys-tools/generator/config/' + scope.row.tableName"> |
||||
配置 |
||||
</router-link> |
||||
</el-button> |
||||
<el-button type="text" style="margin-left: -1px" size="mini" @click="toGen(scope.row.tableName)">生成</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
<!--分页组件--> |
||||
<el-footer style="height:60px;width:100%;background-color:#f6f6f6"> |
||||
<div style="float:left"></div> |
||||
<pagination style="float:right;margin-top:15px" /> |
||||
</el-footer> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
|
||||
import { generator, sync } from '@/api/generator/generator' |
||||
import { downloadFile } from '@/utils/index' |
||||
import CRUD, { presenter, header } from '@crud/crud' |
||||
import rrOperation from '@crud/RR.operation' |
||||
import crudOperation from '@crud/CRUD.operation' |
||||
import pagination from '@crud/Pagination' |
||||
|
||||
// crud交由presenter持有 |
||||
const defaultCrud = CRUD({ url: 'bxg/api/generator/tables' }) |
||||
export default { |
||||
name: 'GeneratorIndex', |
||||
components: { pagination, crudOperation, rrOperation }, |
||||
mixins: [presenter(defaultCrud), header()], |
||||
data() { |
||||
return { |
||||
syncLoading: false |
||||
} |
||||
}, |
||||
created() { |
||||
this.crud.optShow = { add: false, edit: false, del: false, download: false } |
||||
}, |
||||
methods: { |
||||
toGen(tableName) { |
||||
// 生成代码 |
||||
generator(tableName, 0).then(data => { |
||||
this.$notify({ |
||||
title: '生成成功', |
||||
type: 'success', |
||||
duration: 2500 |
||||
}) |
||||
}) |
||||
}, |
||||
toDownload(tableName) { |
||||
// 打包下载 |
||||
generator(tableName, 2).then(data => { |
||||
downloadFile(data, tableName, 'zip') |
||||
}) |
||||
}, |
||||
sync() { |
||||
const tables = [] |
||||
this.crud.selections.forEach(val => { |
||||
tables.push(val.tableName) |
||||
}) |
||||
this.syncLoading = true |
||||
sync(tables).then(() => { |
||||
this.crud.refresh() |
||||
this.crud.notify('同步成功', CRUD.NOTIFICATION_TYPE.SUCCESS) |
||||
this.syncLoading = false |
||||
}).then(() => { |
||||
this.syncLoading = false |
||||
}) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped> |
||||
.app-container{ |
||||
padding-bottom: 0px; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,30 @@
|
||||
<template> |
||||
<el-tabs v-model="activeName" type="card"> |
||||
<el-tab-pane v-for="item in data" :key="item.name" :lazy="true" :label="item.name" :name="item.name"> |
||||
<Java :value="item.content" :height="height" /> |
||||
</el-tab-pane> |
||||
</el-tabs> |
||||
</template> |
||||
|
||||
<script> |
||||
import Java from '@/components/JavaEdit/index' |
||||
import { generator } from '@/api/generator/generator' |
||||
export default { |
||||
name: 'Preview', |
||||
components: { Java }, |
||||
data() { |
||||
return { |
||||
data: null, height: '', activeName: 'Entity' |
||||
} |
||||
}, |
||||
created() { |
||||
this.height = document.documentElement.clientHeight - 180 + 'px' |
||||
const tableName = this.$route.params.tableName |
||||
generator(tableName, 1).then(data => { |
||||
this.data = data |
||||
}).catch(() => { |
||||
this.$router.go(-1) |
||||
}) |
||||
} |
||||
} |
||||
</script> |
||||
Loading…
Reference in new issue