admin/exchange_admin_vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
hucan
2025-02-06 18:13:42 +08:00
commit f4eb06d284
492 changed files with 40280 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/views/dev-tools/build/index.vue Normal file
View File

@ -0,0 +1,36 @@
<template>
<BasicLayout>
<template #wrapper>
<el-card class="box-card">
<div v-loading="loading" :style="'height:'+ height">
<iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
</div>
</el-card>
</template>
</BasicLayout>
</template>
<script>
export default {
components: {
},
data() {
return {
src: process.env.VUE_APP_BASE_API + '/form-generator/index.html',
height: document.documentElement.clientHeight - 94.5 + 'px;',
loading: true
}
},
mounted: function() {
setTimeout(() => {
this.loading = false
}, 230)
const that = this
window.onresize = function temp() {
that.height = document.documentElement.clientHeight - 94.5 + 'px;'
}
}
}
</script>

101
src/views/dev-tools/gen/basicInfoForm.vue Normal file
View File

@ -0,0 +1,101 @@
<template>
<el-form ref="basicInfoForm" :model="info" :rules="rules" label-width="150px">
<el-row>
<el-col :span="12">
<el-form-item prop="tableName">
<span slot="label">
数据表名称
<el-tooltip content="数据库表名称，针对gorm对应的table()使用，⚠️这里必须是蛇形结构" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-input v-model="info.tableName" placeholder="请输入表名称" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="tableComment">
<span slot="label">
菜单名称
<el-tooltip content="同步的数据库表名称，生成配置数据时，用作菜单名称" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-input v-model="info.tableComment" placeholder="请输入菜单名称" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="className">
<span slot="label">
结构体模型名称
<el-tooltip content="结构体模型名称，代码中的struct名称定义使用" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-input v-model="info.className" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="作者名称" prop="functionAuthor">
<el-input v-model="info.functionAuthor" placeholder="请输入作者名称" />
</el-form-item>
</el-col>
<!-- <el-col :span="12">
<el-form-item prop="isLogicalDelete">
<span slot="label">
是否逻辑删除
<el-tooltip content="目前只支持逻辑删除" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-radio-group v-model="info.isLogicalDelete">
<el-radio label="1">是</el-radio>
<el-radio label="0">否</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item v-if="info.isLogicalDelete == '1'" label="逻辑删除字段" prop="logicalDeleteColumn">
<el-input v-model="info.logicalDeleteColumn" placeholder="请输入" />
</el-form-item>
</el-col> -->
<el-col :span="24">
<el-form-item label="备注" prop="remark">
<el-input v-model="info.remark" type="textarea" :rows="3" />
</el-form-item>
</el-col>
</el-row>
</el-form>
</template>
<script>
export default {
name: 'BasicInfoForm',
props: {
info: {
type: Object,
default: null
}
},
data() {
return {
rules: {
tableName: [
{ required: true, message: '请输入表名称', trigger: 'blur' },
{ pattern: /^[a-z\._]*$/g, trigger: 'blur', message: '只允许小写字母,例如 sys_demo 格式' }
],
tableComment: [
{ required: true, message: '请输入菜单名称', trigger: 'blur' }
],
className: [
{ required: true, message: '请输入模型名称', trigger: 'blur' },
{ pattern: /^[A-Z][A-z0-9]*$/g, trigger: 'blur', message: '必须以大写字母开头,例如 SysDemo 格式' }
],
functionAuthor: [
{ required: true, message: '请输入作者', trigger: 'blur' },
{ pattern: /^[A-Za-z]+$/, trigger: 'blur', message: '校验规则: 只允许输入字母 a-z 或大写 A-Z' }
]
}
}
}
}
</script>

348
src/views/dev-tools/gen/editTable.vue Normal file
View File

@ -0,0 +1,348 @@
<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-alert
title="⚠️表字段中的id、create_by、update_by、created_at、updated_at、deleted_at的字段在此列表中已经隐藏"
type="warning"
show-icon
/>
<el-table :data="columns" :max-height="tableHeight" style="width: 100%">
<el-table-column fixed label="序号" type="index" width="50" />
<el-table-column
fixed
label="字段列名"
prop="columnName"
width="150"
:show-overflow-tooltip="true"
/>
<el-table-column fixed label="字段描述" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.columnComment" />
</template>
</el-table-column>
<el-table-column
label="物理类型"
prop="columnType"
width="120"
:show-overflow-tooltip="true"
/>
<el-table-column label="go类型" width="120">
<template slot-scope="scope">
<el-select v-model="scope.row.goType">
<el-option label="int64" value="int64" />
<el-option label="string" value="string" />
<!-- <el-option label="int" value="int" />
<el-option label="bool" value="bool" /> -->
</el-select>
</template>
</el-table-column>
<el-table-column label="go属性" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.goField" />
</template>
</el-table-column>
<el-table-column label="json属性" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.jsonField" />
</template>
</el-table-column>
<el-table-column label="编辑" width="50">
<template slot-scope="scope">
<el-checkbox v-model="scope.row.isInsert" true-label="1" false-label="0" />
</template>
</el-table-column>
<!-- <el-table-column label="编辑" width="70" :render-header="renderHeadeUpdate" :cell-style="{'text-align':'center'}">
<template slot-scope="scope">
<el-checkbox v-model="scope.row.isEdit" true-label="1" false-label="0" />
</template>
</el-table-column> -->
<el-table-column label="列表" width="70" :render-header="renderHeadeList" :cell-style="{'text-align':'center'}">
<template slot-scope="scope">
<el-checkbox v-model="scope.row.isList" true-label="1" false-label="0" />
</template>
</el-table-column>
<el-table-column label="查询" width="70" :render-header="renderHeadeSearch" :cell-style="{'text-align':'center'}">
<template slot-scope="scope">
<el-checkbox v-model="scope.row.isQuery" true-label="1" false-label="0" />
</template>
</el-table-column>
<el-table-column label="查询方式" width="120">
<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="必填" width="50">
<template slot-scope="scope">
<el-checkbox v-model="scope.row.isRequired" true-label="1" />
</template>
</el-table-column>
<el-table-column label="显示类型" width="140">
<template slot-scope="scope">
<el-select v-model="scope.row.htmlType">
<el-option label="文本框" value="input" />
<el-option label="下拉框" value="select" />
<el-option label="单选框" value="radio" />
<!-- <el-option label="文件选择" value="file" /> -->
<!-- <el-option label="复选框" value="checkbox" />
<el-option label="日期控件" value="datetime" />-->
<el-option label="文本域" value="textarea" />
</el-select>
</template>
</el-table-column>
<el-table-column label="字典类型" width="160">
<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-column label="关系表" width="160">
<template slot-scope="scope">
<el-select v-model="scope.row.fkTableName" clearable filterable placeholder="请选择" @change="handleChangeConfig(scope.row,scope.$index)">
<el-option
v-for="table in tableTree"
:key="table.tableName"
:label="table.tableName"
:value="table.tableName"
>
<span style="float: left">{{ table.tableName }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ table.tableComment }}</span>
</el-option>
</el-select>
</template>
</el-table-column>
<el-table-column label="关系表key" width="150">
<template slot-scope="scope">
<el-select v-model="scope.row.fkLabelId" clearable filterable placeholder="请选择">
<el-option
v-for="column in scope.row.fkCol"
:key="column.columnName"
:label="column.columnName"
:value="column.jsonField"
>
<span style="float: left">{{ column.jsonField }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ column.columnComment }}</span>
</el-option>
</el-select>
</template>
</el-table-column>
<el-table-column label="关系表value" width="150">
<template slot-scope="scope">
<el-select v-model="scope.row.fkLabelName" clearable filterable placeholder="请选择">
<el-option
v-for="column in scope.row.fkCol"
:key="column.columnName"
:label="column.columnName"
:value="column.jsonField"
>
<span style="float: left">{{ column.jsonField }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ column.columnComment }}</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" />
</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, getTableTree } from '@/api/tools/gen'
// import { listTable } from '@/api/tools/gen'
import { optionselect as getDictOptionselect } from '@/api/admin/dict/type'
import basicInfoForm from './basicInfoForm'
import genInfoForm from './genInfoForm'
export default {
name: 'GenEdit',
components: {
basicInfoForm,
genInfoForm
},
data() {
return {
// 选中选项卡的 name
activeName: 'cloum',
// 表格的高度
tableHeight: document.documentElement.scrollHeight - 245 + 'px',
// 表列信息
columns: [],
tableTree: [],
// 字典信息
dictOptions: [],
// 表详细信息
info: {}
}
},
beforeCreate() {
getTableTree().then(response => {
this.tableTree = response.data
this.tableTree.unshift({ tableId: 0, className: '请选择' })
})
const { tableId } = this.$route.query
if (tableId) {
// 获取表详细信息
getGenTable(tableId).then(res => {
this.columns = res.data.list
this.info = res.data.info
this.info.isDataScope = this.info.isDataScope.toString()
this.info.isActions = this.info.isActions.toString()
this.info.isAuth = this.info.isAuth.toString()
this.columns.forEach(item => {
this.tableTree.filter(function(e) {
if (e.tableId === item.fkTableNameClass) {
item.fkCol = e.columns || [{ columnId: 0, columnName: '请选择' }]
// item.fkCol.unshift({ columnId: 0, columnName: '请选择' })
}
})
})
})
/** 查询字典下拉列表 */
getDictOptionselect().then(response => {
this.dictOptions = response.data
})
}
},
methods: {
renderHeadeUpdate(h, { column, $index }) {
// h 是一个渲染函数 column 是一个对象表示当前列 $index 第几列
return h('div', [
h('span', column.label + ' ', { align: 'center', marginTop: '0px' }),
h(
'el-popover',
{ props: { placement: 'top-start', width: '270', trigger: 'hover' }},
[
h('p', '是否在表单编辑时能够编辑，打√表示需要', { class: 'text-align: center; margin: 0' }),
// 生成 i 标签 ，添加icon 设置 样式，slot 必填
h('i', { class: 'el-icon-question', style: 'color:#ccc,padding-top:5px', slot: 'reference' })
]
)
])
},
renderHeadeList(h, { column, $index }) {
// h 是一个渲染函数 column 是一个对象表示当前列 $index 第几列
return h('div', [
h('span', column.label + ' ', { align: 'center', marginTop: '0px' }),
h(
'el-popover',
{ props: { placement: 'top-start', width: '260', trigger: 'hover' }},
[
h('p', '是否在列表中展示，打√表示需要展示', { class: 'text-align: center; margin: 0' }),
h('i', { class: 'el-icon-question', style: 'color:#ccc,padding-top:5px', slot: 'reference' })
]
)
])
},
renderHeadeSearch(h, { column, $index }) {
return h('div', [
h('span', column.label + ' ', { align: 'center', marginTop: '0px' }),
h(
'el-popover',
{ props: { placement: 'top-start', width: '270', trigger: 'hover' }},
[
h('p', '是都当做搜索条件，打√表示做为搜索条件', { class: 'text-align: center; margin: 0' }),
h('i', { class: 'el-icon-question', style: 'color:#ccc,padding-top:5px', slot: 'reference' })
]
)
])
},
handleChangeConfig(row, index) {
this.tableTree.filter(function(item) {
if (item.tableName === row.fkTableName) {
row.fkCol = item.columns
// row.fkCol.unshift({ columnId: 0, columnName: '请选择' })
}
})
},
/** 提交按钮 */
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.columns
genTable.params = {
treeCode: genTable.treeCode,
treeName: genTable.treeName,
treeParentCode: genTable.treeParentCode
}
genTable.isDataScope = JSON.parse(genTable.isDataScope)
genTable.isActions = JSON.parse(genTable.isActions)
genTable.isAuth = JSON.parse(genTable.isAuth)
updateGenTable(genTable).then(res => {
this.msgSuccess(res.msg)
if (res.code === 200) {
this.close()
}
})
} else {
this.msgError('表单校验未通过，请重新检查提交内容')
}
})
},
getTables() {
getTableTree().then(response => {
this.tableTree = response.data
this.tableTree.unshift({ tableId: 0, className: '请选择' })
})
},
getTablesCol(tableName) {
return this.tableTree.filter(function(item) {
if (item.tableName === tableName) {
return item.columns
}
})
},
getFormPromise(form) {
return new Promise(resolve => {
form.validate(res => {
resolve(res)
})
})
},
/** 关闭按钮 */
close() {
this.$store.dispatch('tagsView/delView', this.$route)
this.$router.push({ path: '/dev-tools/gen', query: { t: Date.now() }})
}
}
}
</script>

219
src/views/dev-tools/gen/genInfoForm.vue Normal file
View File

@ -0,0 +1,219 @@
<template>
<el-form ref="genInfoForm" :model="info" :rules="rules" label-width="150px">
<el-row>
<el-col :span="12">
<el-form-item prop="tplCategory">
<span slot="label">生成模板</span>
<el-select v-model="info.tplCategory">
<el-option label="关系表（增删改查）" value="crud" />
<!-- <el-option label="关系表（增删改查）" value="mcrud" />
<el-option label="树表（增删改查）" value="tree" /> -->
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="packageName">
<span slot="label">
应用名
<el-tooltip content="应用名，例如：在app文件夹下将该功能发到那个应用中，默认：admin" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-input v-model="info.packageName" />
</el-form-item>
</el-col>
<!-- <el-col :span="12">
<el-form-item prop="moduleFrontName">
<span slot="label">
前端文件名
<el-tooltip content="前端项目文件名，例如 sys-user.js " placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-input v-model="info.moduleFrontName" />
</el-form-item>
</el-col> -->
<el-col :span="12">
<el-form-item prop="businessName">
<span slot="label">
业务名
<el-tooltip content="可理解为功能英文名，例如 user" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-input v-model="info.businessName" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="functionName">
<span slot="label">
功能描述
<el-tooltip content="同步的数据库表备注，用作类描述，例如：用户" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-input v-model="info.functionName" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="moduleName">
<span slot="label">
接口路径
<el-tooltip content="接口路径，例如：api/v1/{sys-user}" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-input v-model="info.moduleName">
<template slot="prepend">api/{version}/</template>
<template slot="append">...</template>
</el-input>
</el-form-item>
<!-- <el-alert
title="接口地址示例"
description="[get]api/{version}/{接口路径} \r\n [post]"
type="success"
show-icon
/> -->
</el-col>
<!-- <el-col :span="12">
<el-form-item prop="isDataScope">
<span slot="label">
是否认证
<el-tooltip content="是指是否使用用户和角色验证中间件" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-select v-model="info.isAuth">
<el-option label="true" value="1" />
<el-option label="false" value="2" />
</el-select>
</el-form-item>
</el-col> -->
<!-- <el-col :span="12">
<el-form-item prop="isDataScope">
<span slot="label">
数据权限
<el-tooltip content="暂不支持" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-select v-model="info.isDataScope" disabled>
<el-option label="true" value="1" />
<el-option label="false" value="2" />
</el-select>
</el-form-item>
</el-col> -->
<!-- <el-col :span="12">
<el-form-item prop="isActions">
<span slot="label">
是否actions
<el-tooltip content="系统通用增删改查中间件方法" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-select v-model="info.isActions" disabled>
<el-option label="false" value="2" />
</el-select>
</el-form-item>
</el-col> -->
</el-row>
<el-row v-show="info.tplCategory == 'tree'">
<h4 class="form-header">其他信息</h4>
<el-col :span="12">
<el-form-item>
<span slot="label">
树编码字段
<el-tooltip content="树显示的编码字段名， 如：dept_id" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-select v-model="info.treeCode" placeholder="请选择">
<el-option
v-for="column in info.columns"
:key="column.columnName"
:label="column.columnName + '：' + column.columnComment"
:value="column.columnName"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item>
<span slot="label">
树父编码字段
<el-tooltip content="树显示的父编码字段名， 如：parent_Id" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-select v-model="info.treeParentCode" placeholder="请选择">
<el-option
v-for="column in info.columns"
:key="column.columnName"
:label="column.columnName + '：' + column.columnComment"
:value="column.columnName"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item>
<span slot="label">
树名称字段
<el-tooltip content="树节点的显示名称字段名， 如：dept_name" placement="top">
<i class="el-icon-question" />
</el-tooltip>
</span>
<el-select v-model="info.treeName" placeholder="请选择">
<el-option
v-for="column in info.columns"
:key="column.columnName"
:label="column.columnName + '：' + column.columnComment"
:value="column.columnName"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
</template>
<script>
export default {
name: 'BasicInfoForm',
props: {
info: {
type: Object,
default: null
}
},
data() {
return {
rules: {
tplCategory: [
{ required: true, message: '请选择生成模板', trigger: 'blur' }
],
packageName: [
{ required: true, message: '请输入生成包路径', trigger: 'blur' },
{ pattern: /^[a-z]*$/g, trigger: 'blur', message: '只允许小写字母,例如 system 格式' }
],
moduleName: [
{ required: true, message: '请输入生成模块名', trigger: 'blur' },
{ pattern: /^[a-z\-]*[a-z]$/g, trigger: 'blur', message: '只允许小写字母,例如 sys-demo 格式' }
],
businessName: [
{ required: true, message: '请输入生成业务名', trigger: 'blur' },
{ pattern: /^[a-z][A-Za-z]+$/, trigger: 'blur', message: '校验规则: 只允许输入字母 a-z 或大写 A-Z ，并且小写字母开头' }
],
functionName: [
{ required: true, message: '请输入生成功能名', trigger: 'blur' }
]
}
}
},
created() {}
}
</script>

121
src/views/dev-tools/gen/importTable.vue Normal file
View File

@ -0,0 +1,121 @@
<template>
<!-- 导入表 -->
<el-dialog title="导入表" :visible.sync="visible" width="800px" top="5vh">
<el-form ref="queryForm" :model="queryParams" :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 ref="table" :data="dbTableList" height="260px" @row-click="clickRow" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" />
<el-table-column prop="tableName" label="表名称" />
<el-table-column prop="tableComment" label="表描述" />
<el-table-column prop="createdAt" label="创建时间" />
<el-table-column prop="updatedAt" label="更新时间" />
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageIndex"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</el-row>
<div slot="footer" class="dialog-footer">
<el-button type="primary" :loading="loading" @click="handleImportTable">确 定</el-button>
<el-button @click="visible = false">取 消</el-button>
</div>
</el-dialog>
</template>
<script>
import { listDbTable, importTable } from '@/api/tools/gen'
export default {
data() {
return {
loading: false,
// 遮罩层
visible: false,
// 选中数组值
tables: [],
// 总条数
total: 0,
// 表数据
dbTableList: [],
// 查询参数
queryParams: {
pageIndex: 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.data.list
this.total = res.data.count
}
})
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageIndex = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm('queryForm')
this.handleQuery()
},
/** 导入按钮操作 */
handleImportTable() {
this.loading = true
this.visible = true
importTable({ tables: this.tables.join(',') }).then(res => {
this.msgSuccess(res.msg)
if (res.code === 200) {
this.visible = false
this.$emit('ok')
}
this.loading = false
})
}
}
}
</script>

421
src/views/dev-tools/gen/index.vue Normal file
View File

@ -0,0 +1,421 @@
<template>
<BasicLayout>
<template #wrapper>
<el-card class="box-card">
<el-form ref="queryForm" :model="queryParams" :inline="true" label-position="left">
<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 :gutter="10" class="mb8">
<el-col :span="1.5">
<!-- <el-button
type="primary"
icon="el-icon-download"
size="mini"
@click="handleGenTable"
>生成</el-button> -->
</el-col>
<el-col :span="1.5">
<el-button
type="info"
icon="el-icon-upload"
size="mini"
@click="openImportTable"
>导入</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleEditTable"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
>删除</el-button>
</el-col>
</el-row>
<el-table v-loading="loading" :data="tableList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" />
<el-table-column label="序号" align="center" prop="tableId" width="50px" />
<el-table-column
label="表名称"
align="center"
prop="tableName"
:show-overflow-tooltip="true"
width="130"
/>
<el-table-column
label="菜单名称"
align="center"
prop="tableComment"
:show-overflow-tooltip="true"
width="130"
/>
<el-table-column
label="模型名称"
align="center"
prop="className"
:show-overflow-tooltip="true"
width="130"
/>
<el-table-column label="创建时间" align="center" prop="createdAt" width="165">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createdAt) }}</span>
</template>
</el-table-column>
<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-edit"
@click="handleEditTable(scope.row)"
>编辑</el-button>
<el-button
type="text"
size="small"
icon="el-icon-view"
@click="handlePreview(scope.row)"
>预览</el-button>
<el-button
slot="reference"
type="text"
size="small"
icon="el-icon-view"
@click="handleToProject(scope.row)"
>代码生成</el-button>
<el-button
slot="reference"
type="text"
size="small"
icon="el-icon-view"
@click="handleToDB(scope.row)"
>生成配置</el-button>
<el-button
slot="reference"
type="text"
size="small"
icon="el-icon-view"
@click="handleToApiFile(scope.row)"
>生成迁移脚本</el-button>
<el-button
slot="reference"
type="text"
size="small"
icon="el-icon-delete"
@click="handleSingleDelete(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageIndex"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</el-card>
<!-- 预览界面 -->
<el-dialog class="preview" :title="preview.title" :visible.sync="preview.open" :close-on-click-modal="false" fullscreen>
<div class="el-dialog-container">
<div class="tag-group">
<!-- eslint-disable-next-line vue/valid-v-for -->
<el-tag v-for="(value, key) in preview.data" @click="codeChange(key)">
<template>
{{ key.substring(key.lastIndexOf('/')+1,key.indexOf('.go.template')) }}
</template>
</el-tag>
</div>
<div id="codemirror">
<codemirror ref="cmEditor" :value="codestr" :options="cmOptions" />
</div>
<!-- <el-tabs v-model="preview.activeName" tab-position="left">
<el-tab-pane
v-for="(value, key) in preview.data"
:key="key"
:label="key.substring(key.lastIndexOf('/')+1,key.indexOf('.template'))"
:name="key.substring(key.lastIndexOf('/')+1,key.indexOf('.template'))"
>
<pre class="pre"/>
</el-tab-pane>
</el-tabs> -->
</div>
</el-dialog>
<import-table ref="importTB" @ok="handleQuery" />
</template>
</BasicLayout>
</template>
<script>
import { listTable, previewTable, delTable, toDBTable, toProjectTableCheckRole, apiToFile } from '@/api/tools/gen'
import importTable from './importTable'
import { downLoadFile } from '@/utils/zipdownload'
import { codemirror } from 'vue-codemirror'
import 'codemirror/theme/material-palenight.css'
require('codemirror/mode/javascript/javascript')
import 'codemirror/mode/javascript/javascript'
import 'codemirror/mode/go/go'
import 'codemirror/mode/vue/vue'
export default {
name: 'Gen',
components: { importTable, codemirror },
data() {
return {
cmOptions: {
tabSize: 4,
theme: 'material-palenight',
mode: 'text/javascript',
lineNumbers: true,
line: true
// more CodeMirror options...
},
codestr: '',
// 遮罩层
loading: true,
// 唯一标识符
uniqueId: '',
// 选中数组
ids: [],
// 选中表数组
tableNames: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 总条数
total: 0,
// 表数据
tableList: [],
// 日期范围
dateRange: '',
// 查询参数
queryParams: {
pageIndex: 1,
pageSize: 10,
tableName: undefined,
tableComment: undefined
},
// 预览参数
preview: {
open: false,
title: '代码预览',
data: {},
activeName: 'api.go'
}
}
},
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.data.list
this.total = response.data.count
this.loading = false
}
)
},
codeChange(e) {
if (e.indexOf('js') > -1) {
this.cmOptions.mode = 'text/javascript'
}
if (e.indexOf('model') > -1 || e.indexOf('router') > -1 || e.indexOf('api') > -1 || e.indexOf('service') > -1 || e.indexOf('dto') > -1) {
this.cmOptions.mode = 'text/x-go'
}
if (e.indexOf('vue') > -1) {
this.cmOptions.mode = 'text/x-vue'
}
this.codestr = this.preview.data[e]
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageIndex = 1
this.getList()
},
/** 生成代码操作 */
handleGenTable(row) {
const ids = row.tableId || this.ids
if (ids === '') {
this.msgError('请选择要生成的数据')
return
}
downLoadFile('/api/v1/gen/gencode/' + ids)
},
/** 打开导入表弹窗 */
openImportTable() {
this.$refs.importTB.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
this.codeChange('template/api.go.template')
})
},
handleToProject(row) {
toProjectTableCheckRole(row.tableId, false).then((response) => {
this.msgSuccess(response.msg)
}).catch(function() {})
},
handleToApiFile(row) {
apiToFile(row.tableId, true).then((response) => {
this.msgSuccess(response.msg)
}).catch(function() {})
},
handleToDB(row) {
toDBTable(row.tableId).then((response) => {
this.msgSuccess(response.msg)
}).catch(function() {})
},
// 多选框选中数据
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: '/dev-tools/editTable', query: { tableId: tableId }})
},
/** 删除按钮操作 */
handleDelete(row) {
const tableIds = row.tableId || this.ids
this.$confirm('是否确认删除表编号为"' + tableIds + '"的数据项?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return delTable(tableIds)
}).then((response) => {
if (response.code === 200) {
this.msgSuccess(response.msg)
this.open = false
this.getList()
} else {
this.msgError(response.msg)
}
}).catch(function() {})
},
handleSingleDelete(row) {
const tableIds = row.tableId || this.ids
delTable(tableIds).then((response) => {
if (response.code === 200) {
this.msgSuccess(response.msg)
this.open = false
this.getList()
} else {
this.msgError(response.msg)
}
}).catch(function() {})
}
}
}
</script>
<style lang="scss" scoped>
.el-dialog-container ::v-deep{
overflow: hidden;
.el-scrollbar__view{
height: 100%;
}
.pre{
height: 546px;
overflow: hidden;
.el-scrollbar{
height: 100%;
}
}
.el-scrollbar__wrap::-webkit-scrollbar{
display: none;
}
}
::v-deep .el-dialog__body{
padding: 0 20px;
margin:0;
}
.tag-group {
margin: 0 0 10px -10px;
}
.tag-group .el-tag{
margin-left: 10px;
}
.el-tag {
cursor: pointer;
}
</style>
<style lang="scss">
#codemirror {
height: auto;
margin: 0;
overflow: auto;
}
.CodeMirror {
border: 1px solid #eee;
height: 600px;
}
</style>

38
src/views/dev-tools/swagger/index.vue Normal file
View File

@ -0,0 +1,38 @@
<template>
<BasicLayout>
<template #wrapper>
<el-card class="box-card">
<div v-loading="loading" :style="'height:' + height">
<iframe
:src="src"
frameborder="no"
style="width: 100%; height: 100%"
scrolling="auto"
/>
</div>
</el-card>
</template>
</BasicLayout>
</template>
<script>
export default {
name: 'Swagger',
components: {},
data() {
return {
src: process.env.VUE_APP_BASE_API + '/swagger/admin/index.html',
height: document.documentElement.clientHeight - 94.5 + 'px;',
loading: true
}
},
mounted: function() {
setTimeout(() => {
this.loading = false
}, 230)
const that = this
window.onresize = function temp() {
that.height = document.documentElement.clientHeight - 94.5 + 'px;'
}
}
}
</script>