优化代码生成功能、新增自定义路径代码生成

This commit is contained in:
不做码农
2022-01-04 22:07:00 +08:00
parent df1cae2857
commit d50c034624
12 changed files with 164 additions and 159 deletions

View File

@@ -8,12 +8,13 @@
<gen-info-form ref="genInfo" :info="info" :tables="tables" :menus="menus" :columns="columns" />
</el-tab-pane>
<el-tab-pane label="字段信息" name="cloum">
<el-table ref="dragTable" :data="columns" row-key="columnId" :max-height="tableHeight">
<el-table ref="dragTable" v-loading="loading" :data="columns" 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" :ref='scope.row.columnId' @keydown.native="nextFocus(scope.row,scope.$index, $event)"></el-input>
<el-input v-model="scope.row.columnComment" :ref='scope.row.columnId' @keydown.native="nextFocus(scope.row,scope.$index, $event)">
</el-input>
</template>
</el-table-column>
<el-table-column label="物理类型" prop="columnType" min-width="10%" :show-overflow-tooltip="true" />
@@ -93,7 +94,8 @@
</el-table-column>
<el-table-column label="字典类型" min-width="12%">
<template slot-scope="scope">
<el-select v-model="scope.row.dictType" clearable filterable placeholder="请选择" v-if="scope.row.htmlType == 'select' || scope.row.htmlType == 'radio' || scope.row.htmlType =='checkbox'">
<el-select v-model="scope.row.dictType" clearable filterable placeholder="请选择"
v-if="scope.row.htmlType == 'select' || scope.row.htmlType == 'radio' || scope.row.htmlType =='checkbox'">
<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>
@@ -143,6 +145,7 @@ export default {
menus: [],
// 表详细信息
info: {},
loading: true,
};
},
created() {
@@ -155,7 +158,8 @@ export default {
if (tableId) {
// 获取表详细信息
getGenTable(tableId).then((res) => {
this.columns = res.data.columns;
this.loading = false;
this.columns = res.data.info.columns;
this.info = res.data.info;
this.tables = res.data.tables; //子表
});
@@ -178,16 +182,18 @@ export default {
if (validateResult) {
const genTable = Object.assign({}, basicForm.model, genForm.model);
genTable.columns = this.columns;
// 额外参数拼接
genTable.params = {
treeCode: genTable.treeCode,
treeName: genTable.treeName,
treeParentCode: genTable.treeParentCode,
parentMenuId: genTable.parentMenuId,
sortField: genTable.sortField,
sortType: genTable.sortType
sortField: genTable.sortField,
sortType: genTable.sortType,
checkedBtn: genTable.checkedBtn.toString(),
};
console.log("genForm", genTable);
updateGenTable(genTable).then((res) => {
this.msgSuccess(res.msg);
if (res.code === 200) {

View File

@@ -5,10 +5,10 @@
<el-form-item prop="tplCategory">
<span slot="label">生成模板</span>
<el-select v-model="info.tplCategory" @change="tplSelectChange">
<el-option label="单表(增删改查)" value="crud" />
<el-option label="单表(增删改查)" value="crud" />
<!-- <el-option label="单表查询" value="select" /> -->
<el-option label="树表(增删改查)" value="tree" />
<!-- <el-option label="导航查询" value="subNav"></el-option> -->
<!-- <el-option label="导航查询" value="subNav"></el-option> -->
<!-- <el-option label="主子表(增删改查)" value="sub" /> -->
</el-select>
</el-form-item>
@@ -34,7 +34,7 @@
<i class="el-icon-question"></i>
</el-tooltip>
</span>
<el-input v-model="info.moduleName" auto-complete=""/>
<el-input v-model="info.moduleName" auto-complete="" />
</el-form-item>
</el-col>
@@ -94,12 +94,12 @@
<el-form-item prop="genType">
<span slot="label">
生成代码方式
<!-- <el-tooltip content="默认为zip压缩包下载,也可以自定义生成路径" placement="top">
<el-tooltip content="默认为zip压缩包下载" placement="top">
<i class="el-icon-question"></i>
</el-tooltip> -->
</el-tooltip>
</span>
<el-radio v-model="info.genType" label="0">zip压缩包</el-radio>
<!-- <el-radio v-model="info.genType" label="1">自定义路径</el-radio> -->
<el-radio v-model="info.genType" label="1">自定义路径</el-radio>
</el-form-item>
</el-col>
@@ -124,6 +124,24 @@
</el-input>
</el-form-item>
</el-col>
<el-col :lg="24">
<el-form-item label="显示按钮">
<el-checkbox-group v-model="checkedBtn" @change="checkedBtnSelect">
<el-checkbox :label="1" disabled>
<el-tag type="primary">添加</el-tag>
</el-checkbox>
<el-checkbox :label="2" disabled>
<el-tag type="success">修改</el-tag>
</el-checkbox>
<el-checkbox :label="3" disabled>
<el-tag type="danger">删除</el-tag>
</el-checkbox>
<el-checkbox :label="4">
<el-tag type="warning">导出</el-tag>
</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-col>
</el-row>
<el-row v-show="info.tplCategory == 'tree'">
@@ -234,6 +252,7 @@ export default {
},
data() {
return {
checkedBtn: [],
subColumns: [],
rules: {
tplCategory: [
@@ -265,6 +284,10 @@ export default {
"info.subTableName": function (val) {
this.setSubTableColumns(val);
},
"info.checkedBtn": function (val) {
console.log(val + ',checkedBtn');
this.checkedBtn = val;
},
},
methods: {
/** 转换菜单数据结构 */
@@ -282,6 +305,9 @@ export default {
subSelectChange(value) {
this.info.subTableFkName = "";
},
checkedBtnSelect(value) {
this.info.checkedBtn = value;
},
/** 选择生成模板触发 */
tplSelectChange(value) {
if (value !== "sub") {
@@ -291,7 +317,6 @@ export default {
},
/** 设置关联外键 */
setSubTableColumns(value) {
console.log(value);
if (value == null || value == undefined || value == "") {
return;
}

View File

@@ -37,11 +37,11 @@
<el-table-column prop="updateTime" label="更新时间" />
<el-table-column label="操作" align="center" width="350">
<template slot-scope="scope">
<el-button type="text" icon="el-icon-view" @click="handleShowDialog(scope.row, 'preview')" v-hasPermi="['tool:gen:preview']">预览</el-button>
<el-button type="text" icon="el-icon-view" @click="handlePreview(scope.row)" v-hasPermi="['tool:gen:preview']">预览</el-button>
<el-button type="text" icon="el-icon-edit" @click="handleEditTable(scope.row)" v-hasPermi="['tool:gen:edit']">编辑</el-button>
<el-button type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['tool:gen:remove']">删除</el-button>
<el-button type="text" icon="el-icon-refresh" @click="handleSynchDb(scope.row)" v-hasPermi="['tool:gen:edit']">同步</el-button>
<el-button type="text" icon="el-icon-download" @click="handleShowDialog(scope.row, 'generate')" v-hasPermi="['tool:gen:code']">生成代码
<el-button type="text" icon="el-icon-download" @click="handleGenTable(scope.row)" v-hasPermi="['tool:gen:code']">生成代码
</el-button>
</template>
</el-table-column>
@@ -59,35 +59,6 @@
</el-tabs>
</el-dialog>
<import-table ref="import" @ok="handleSearch" />
<el-dialog :visible.sync="showGenerate" :title="preview.title" width="800px">
<el-form ref="codeGenerateForm" label-width="140px">
<el-form-item label="显示按钮">
<el-checkbox-group v-model="checkedBtnForm">
<el-checkbox :label="1" :disabled=true>
<el-tag type="primary">添加</el-tag>
</el-checkbox>
<el-checkbox :label="2" :disabled=true>
<el-tag type="success">修改</el-tag>
</el-checkbox>
<el-checkbox :label="3" :disabled=true>
<el-tag type="danger">删除</el-tag>
</el-checkbox>
<el-checkbox :label="4">
<el-tag type="warning">导出</el-tag>
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="数据库类型">
<el-radio v-model="dbType" :label="0">mySql</el-radio>
<el-radio v-model="dbType" :label="1">sqlServer</el-radio>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleGenerate"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
@@ -122,8 +93,6 @@ export default {
activeName: "0",
},
showGenerate: false,
// 显示的button
checkedBtnForm: [1, 2, 3],
rules: {},
// 表数据
tableData: [],
@@ -171,39 +140,26 @@ export default {
},
// 代码预览
handlePreview(row) {
var seachdata = {
tableId: this.currentSelected.tableId,
checkedBtn: this.checkedBtnForm,
dbType: this.dbType,
};
previewTable(row.tableId, seachdata).then((res) => {
if (res.code === 200) {
this.showGenerate = false;
this.preview.open = true;
this.preview.data = res.data;
this.$refs["codeform"].validate((valid) => {
if (!valid) {
this.msgError("请先完成表格");
return;
}
previewTable(row.tableId).then((res) => {
if (res.code === 200) {
this.showGenerate = false;
this.preview.open = true;
this.preview.data = res.data;
}
});
});
},
// 打开对话框、预览、生成
handleShowDialog(row, type) {
this.showGenerate = true;
if (type == "generate") {
this.preview.title = "代码生成";
}
if (type == "preview") {
this.preview.title = "预览";
}
this.currentSelected = row;
},
/**
* 点击生成服务端代码
*/
handleGenerate: async function () {
handleGenTable(row) {
console.log(JSON.stringify(this.currentSelected));
if (this.preview.title == "预览") {
this.handlePreview(this.currentSelected);
return;
}
this.currentSelected = row;
if (!this.currentSelected) {
this.msgError("请先选择要生成代码的数据表");
return false;
@@ -221,8 +177,6 @@ export default {
var seachdata = {
tableId: this.currentSelected.tableId,
tableName: this.currentSelected.name,
checkedBtn: this.checkedBtnForm,
dbType: this.dbType,
// queryColumn: this.checkedQueryColumn,
};
console.log(JSON.stringify(seachdata));
@@ -232,8 +186,12 @@ export default {
const { code, data } = res;
if (code == 200) {
this.showGenerate = false;
this.msgSuccess("恭喜你,代码生成完成!");
this.download(data.path);
if (row.genType === "1") {
this.msgSuccess("成功生成到自定义路径:" + row.genPath);
} else {
this.msgSuccess("恭喜你,代码生成完成!");
this.download(data.path);
}
} else {
this.msgError(res.msg);
}
@@ -251,7 +209,7 @@ export default {
this.showGenerate = false;
this.currentSelected = {};
},
// 导入代码生成
/** 打开导入表弹窗 */
openImportTable() {
this.$refs.import.show();
},