完成代码生成功能
This commit is contained in:
izory
@@ -1,117 +0,0 @@
|
||||
<template>
|
||||
<!-- 导入表 -->
|
||||
<el-dialog title="导入表" :visible.sync="visible" width="800px" top="5vh" append-to-body>
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true">
|
||||
<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>
|
||||
<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>
|
||||
<el-table @row-click="clickRow" ref="table" :data="dbTableList" @selection-change="handleSelectionChange" height="260px">
|
||||
<el-table-column type="selection" width="55"></el-table-column>
|
||||
<el-table-column prop="tableName" label="表名称" :show-overflow-tooltip="true"></el-table-column>
|
||||
<el-table-column prop="tableComment" label="表描述" :show-overflow-tooltip="true"></el-table-column>
|
||||
<el-table-column prop="createTime" label="创建时间"></el-table-column>
|
||||
<el-table-column prop="updateTime" label="更新时间"></el-table-column>
|
||||
</el-table>
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-row>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="handleImportTable">确 定</el-button>
|
||||
<el-button @click="visible = false">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listDbTable, importTable } from "@/api/tool/gen";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
visible: false,
|
||||
// 选中数组值
|
||||
tables: [],
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 表数据
|
||||
dbTableList: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
tableName: undefined,
|
||||
tableComment: undefined
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 显示弹框
|
||||
show() {
|
||||
this.getList();
|
||||
this.visible = true;
|
||||
},
|
||||
clickRow(row) {
|
||||
this.$refs.table.toggleRowSelection(row);
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.tables = selection.map(item => item.tableName);
|
||||
},
|
||||
// 查询表数据
|
||||
getList() {
|
||||
listDbTable(this.queryParams).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.dbTableList = res.rows;
|
||||
this.total = res.total;
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 导入按钮操作 */
|
||||
handleImportTable() {
|
||||
importTable({ tables: this.tables.join(",") }).then(res => {
|
||||
this.msgSuccess(res.msg);
|
||||
if (res.code === 200) {
|
||||
this.visible = false;
|
||||
this.$emit("ok");
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
290
ZR.Vue/src/views/tool/gen/index.vue
Normal file
290
ZR.Vue/src/views/tool/gen/index.vue
Normal file
@@ -0,0 +1,290 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-card>
|
||||
<div>
|
||||
<el-form ref="codeform" :inline="true" :rules="rules" :model="codeform" size="small">
|
||||
<el-form-item label="数据库" prop="dbName">
|
||||
<el-select v-model="codeform.dbName" clearable placeholder="请选择" @change="handleShowTable">
|
||||
<el-option v-for="item in selectedDataBase" :key="item" :label="item" :value="item" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="表名">
|
||||
<el-input v-model="codeform.tableName" clearable placeholder="输入要查询的表名" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="项目命名空间：" prop="baseSpace">
|
||||
<el-tooltip class="item" effect="dark" content="系统会根据项目命名空间自动生成IService、Service、Models等子命名空间" placement="bottom">
|
||||
<el-input v-model="codeform.baseSpace" clearable placeholder="如Zr" />
|
||||
</el-tooltip>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="去掉表名前缀：">
|
||||
<el-tooltip class="item" effect="dark" content="表名直接变为类名，去掉表名前缀。" placement="bottom">
|
||||
<el-input v-model="codeform.replaceTableNameStr" clearable width="300" placeholder="例如：sys_" />
|
||||
</el-tooltip>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handleSearch()">查询</el-button>
|
||||
<el-button type="default" icon="el-icon-refresh" size="small" @click="loadTableData()">刷新</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-table ref="gridtable" v-loading="tableloading" :data="tableData" border stripe highlight-current-row height="500px" style="width: 100%;">
|
||||
<el-table-column prop="name" label="表名" sortable="custom" width="380" />
|
||||
<el-table-column prop="description" label="表描述" />
|
||||
<el-table-column label="操作" align="center" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" icon="el-icon-view" @click="handlePreview()">预览</el-button>
|
||||
<el-button type="text" icon="el-icon-download" @click="handleShowDialog(scope.row)" v-hasPermi="['tool:gen:code']">生成代码</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination background :current-page="pagination.pageNum" :page-sizes="[5,10,20,50,100, 200, 300, 400]" :page-size="pagination.pagesize" layout="total, sizes, prev, pager, next, jumper" :total="pagination.pageTotal" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
|
||||
</el-card>
|
||||
|
||||
<el-dialog :visible.sync="showGenerate" title="代码生成" width="800px">
|
||||
<el-form ref="codeGenerateForm" label-width="140px">
|
||||
<el-form-item label="要生成的文件">
|
||||
<el-checkbox-group v-model="checkedCodeGenerateForm">
|
||||
<el-checkbox :label="1">生成Model</el-checkbox>
|
||||
<el-checkbox :label="2">生成Dto</el-checkbox>
|
||||
<el-checkbox :label="3">生成Repository</el-checkbox>
|
||||
<el-checkbox :label="4">生成Service</el-checkbox>
|
||||
<el-checkbox :label="5">生成Controller</el-checkbox>
|
||||
<el-checkbox :label="6">生成Views和api</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="是否覆盖生成">
|
||||
<el-radio v-model="coverd" :label="true">是</el-radio>
|
||||
<el-radio v-model="coverd" :label="false">否</el-radio>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="生成查询的列">
|
||||
<el-table :data="columnData" height="300px">
|
||||
<el-table-column type="selection" width="60" />
|
||||
<el-table-column label="字段列名" prop="dbColumnName" />
|
||||
<el-table-column label="字段描述" prop="columnDescription">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-model="scope.row.columnDescription" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="表数据类型" prop="dataType" />
|
||||
<el-table-column label="C#类型">
|
||||
<template slot-scope="scope">
|
||||
<el-select v-model="scope.row.dataType">
|
||||
<el-option value="int">int</el-option>
|
||||
<el-option value="bigint">bigint</el-option>
|
||||
<el-option value="varchar">varchar</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="显示类型">
|
||||
<el-select v-model="selectType">
|
||||
<el-option value="input">文本框</el-option>
|
||||
<el-option value="textArea">文本域</el-option>
|
||||
<el-option value="select">下拉框</el-option>
|
||||
<el-option value="radio">单选框</el-option>
|
||||
<el-option value="datetime">日期控件</el-option>
|
||||
<el-option value="upload">图片上传</el-option>
|
||||
<el-option value="fileUpload">文件上传</el-option>
|
||||
</el-select>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</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>
|
||||
|
||||
<script>
|
||||
import {
|
||||
// createGetDBConn,
|
||||
codeGetDBList,
|
||||
codeGetTableList,
|
||||
codeGenerator,
|
||||
queryColumnInfo,
|
||||
} from "@/api/tool/gen";
|
||||
// import { downloadFile } from "@/utils/index";
|
||||
import { Loading } from "element-ui";
|
||||
|
||||
export default {
|
||||
name: "CodeGenerator",
|
||||
data() {
|
||||
return {
|
||||
codeform: {
|
||||
dbName: "",
|
||||
tableName: "",
|
||||
baseSpace: "",
|
||||
replaceTableNameStr: "",
|
||||
},
|
||||
showGenerate: false,
|
||||
checkedCodeGenerateForm: [1, 2, 3, 4, 5, 6],
|
||||
rules: {
|
||||
dbName: [
|
||||
{ required: true, message: "请选择数据库名称", trigger: "blur" },
|
||||
],
|
||||
replaceTableNameStr: [
|
||||
{ min: 0, max: 50, message: "长度小于50个字符", trigger: "blur" },
|
||||
],
|
||||
},
|
||||
tableData: [],
|
||||
tableloading: false,
|
||||
pagination: {
|
||||
pageNum: 1,
|
||||
pagesize: 20,
|
||||
pageTotal: 0,
|
||||
},
|
||||
// 选中行的表
|
||||
currentSelected: {},
|
||||
selectedDataBase: [],
|
||||
// 列信息
|
||||
columnData: [],
|
||||
// 选中的列
|
||||
checkedQueryColumn: [],
|
||||
//是否覆盖原先代码
|
||||
coverd: true,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.pagination.pageNum = 1;
|
||||
this.loadData();
|
||||
this.loadTableData();
|
||||
},
|
||||
methods: {
|
||||
loadData() {
|
||||
codeGetDBList().then((res) => {
|
||||
const { dbList, defaultDb } = res.data;
|
||||
this.codeform.dbName = defaultDb;
|
||||
this.selectedDataBase = dbList;
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 加载页面table数据
|
||||
*/
|
||||
loadTableData() {
|
||||
if (this.codeform.dbName !== "") {
|
||||
this.tableloading = true;
|
||||
var seachdata = {
|
||||
pageNum: this.pagination.pageNum,
|
||||
PageSize: this.pagination.pagesize,
|
||||
tableName: this.codeform.tableName,
|
||||
dbName: this.codeform.dbName,
|
||||
};
|
||||
codeGetTableList(seachdata).then((res) => {
|
||||
this.tableData = res.data.result;
|
||||
this.pagination.pageTotal = res.data.totalNum;
|
||||
this.tableloading = false;
|
||||
});
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 点击查询
|
||||
*/
|
||||
handleSearch() {
|
||||
this.$refs["codeform"].validate((valid) => {
|
||||
if (valid) {
|
||||
this.tableloading = true;
|
||||
this.pagination.pageNum = 1;
|
||||
this.loadTableData();
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleShowTable() {
|
||||
this.pagination.pageNum = 1;
|
||||
this.loadTableData();
|
||||
},
|
||||
handlePreview() {
|
||||
this.msgError("敬请期待");
|
||||
},
|
||||
handleShowDialog(row) {
|
||||
this.showGenerate = true;
|
||||
this.currentSelected = row;
|
||||
|
||||
queryColumnInfo({
|
||||
dbName: this.codeform.dbName,
|
||||
tableName: row.name,
|
||||
}).then((res) => {
|
||||
if (res.code === 200) {
|
||||
const columnData = res.data;
|
||||
this.columnData = columnData;
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 点击生成服务端代码
|
||||
*/
|
||||
handleGenerate: async function () {
|
||||
console.log(JSON.stringify(this.currentSelected));
|
||||
if (!this.currentSelected) {
|
||||
this.msgError("请先选择要生成代码的数据表");
|
||||
return false;
|
||||
}
|
||||
this.$refs["codeform"].validate((valid) => {
|
||||
if (valid) {
|
||||
var loadop = {
|
||||
lock: true,
|
||||
text: "正在生成代码...",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
};
|
||||
const pageLoading = Loading.service(loadop);
|
||||
|
||||
var seachdata = {
|
||||
dbName: this.codeform.dbName,
|
||||
tableName: this.currentSelected.name,
|
||||
baseSpace: this.codeform.baseSpace,
|
||||
replaceTableNameStr: this.codeform.replaceTableNameStr,
|
||||
genFiles: this.checkedCodeGenerateForm,
|
||||
coverd: this.coverd,
|
||||
queryColumn: this.checkedQueryColumn,
|
||||
};
|
||||
console.log(JSON.stringify(seachdata));
|
||||
|
||||
codeGenerator(seachdata)
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
// downloadFile(
|
||||
// defaultSettings.fileUrl + res.ResData[0],
|
||||
// res.ResData[1]
|
||||
// );
|
||||
this.showGenerate = false;
|
||||
this.msgSuccess("恭喜你，代码生成完成！");
|
||||
} else {
|
||||
this.msgError(res.msg);
|
||||
}
|
||||
pageLoading.close();
|
||||
})
|
||||
.catch((erre) => {
|
||||
pageLoading.close();
|
||||
});
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 选择每页显示数量
|
||||
*/
|
||||
handleSizeChange(val) {
|
||||
this.pagination.pagesize = val;
|
||||
this.pagination.pageNum = 1;
|
||||
this.loadTableData();
|
||||
},
|
||||
/**
|
||||
* 选择当页面
|
||||
*/
|
||||
handleCurrentChange(val) {
|
||||
this.pagination.pageNum = val;
|
||||
this.loadTableData();
|
||||
},
|
||||
cancel() {
|
||||
this.showGenerate = false;
|
||||
this.currentSelected = {};
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
Reference in New Issue
Block a user