smallchill
4 years ago
parent
91761522c2
commit
a628f9ea25
4 changed files with 1118 additions and 153 deletions
@ -0,0 +1,111 @@ |
||||
import request from '@/router/axios'; |
||||
|
||||
export const getList = (current, size, params) => { |
||||
return request({ |
||||
url: '/api/blade-develop/model/list', |
||||
method: 'get', |
||||
params: { |
||||
...params, |
||||
current, |
||||
size, |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const getDetail = (id) => { |
||||
return request({ |
||||
url: '/api/blade-develop/model/detail', |
||||
method: 'get', |
||||
params: { |
||||
id |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const remove = (ids) => { |
||||
return request({ |
||||
url: '/api/blade-develop/model/remove', |
||||
method: 'post', |
||||
params: { |
||||
ids, |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const add = (row) => { |
||||
return request({ |
||||
url: '/api/blade-develop/model/submit', |
||||
method: 'post', |
||||
data: row |
||||
}) |
||||
} |
||||
|
||||
export const update = (row) => { |
||||
return request({ |
||||
url: '/api/blade-develop/model/submit', |
||||
method: 'post', |
||||
data: row |
||||
}) |
||||
} |
||||
|
||||
export const getTableList = (datasourceId) => { |
||||
return request({ |
||||
url: '/api/blade-develop/model/table-list', |
||||
method: 'get', |
||||
params: { |
||||
datasourceId, |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const getTableInfo = (modelId, datasourceId) => { |
||||
return request({ |
||||
url: '/api/blade-develop/model/table-info', |
||||
method: 'get', |
||||
params: { |
||||
modelId, |
||||
datasourceId, |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const getTableInfoByName = (tableName, datasourceId) => { |
||||
return request({ |
||||
url: '/api/blade-develop/model/table-info', |
||||
method: 'get', |
||||
params: { |
||||
tableName, |
||||
datasourceId, |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const getModelPrototype = (modelId, datasourceId) => { |
||||
return request({ |
||||
url: '/api/blade-develop/model/model-prototype', |
||||
method: 'get', |
||||
params: { |
||||
modelId, |
||||
datasourceId, |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const submitModelPrototype = (row) => { |
||||
return request({ |
||||
url: '/api/blade-develop/model-prototype/submit-list', |
||||
method: 'post', |
||||
data: row |
||||
}) |
||||
} |
||||
|
||||
|
||||
export const prototypeDetail = (modelId) => { |
||||
return request({ |
||||
url: '/api/blade-develop/model-prototype/select', |
||||
method: 'get', |
||||
params: { |
||||
modelId, |
||||
} |
||||
}) |
||||
} |
||||
@ -0,0 +1,312 @@ |
||||
export const switchDic = [ |
||||
{ |
||||
label: "", |
||||
value: 0 |
||||
}, |
||||
{ |
||||
label: "", |
||||
value: 1 |
||||
} |
||||
]; |
||||
|
||||
export const entityDic = [ |
||||
{ |
||||
label: "String", |
||||
value: "java.lang.String" |
||||
}, |
||||
{ |
||||
label: "Integer", |
||||
value: "java.lang.Integer" |
||||
}, |
||||
{ |
||||
label: "Long", |
||||
value: "java.lang.Long" |
||||
}, |
||||
{ |
||||
label: "Double", |
||||
value: "java.lang.Double" |
||||
}, |
||||
{ |
||||
label: "BigDecimal", |
||||
value: "java.math.BigDecimal" |
||||
}, |
||||
{ |
||||
label: "Boolean", |
||||
value: "java.lang.Boolean" |
||||
}, |
||||
{ |
||||
label: "Date", |
||||
value: "java.util.Date" |
||||
} |
||||
]; |
||||
|
||||
export const componentDic = [ |
||||
{ |
||||
label: "单行文本", |
||||
value: "input" |
||||
}, |
||||
{ |
||||
label: "多行文本", |
||||
value: "textarea" |
||||
}, |
||||
{ |
||||
label: "下拉选项", |
||||
value: "select" |
||||
}, |
||||
{ |
||||
label: "树形下拉选项", |
||||
value: "tree" |
||||
}, |
||||
{ |
||||
label: "单选框", |
||||
value: "radio" |
||||
}, |
||||
{ |
||||
label: "多选框", |
||||
value: "checkbox" |
||||
}, |
||||
{ |
||||
label: "开关框", |
||||
value: "switch" |
||||
}, |
||||
{ |
||||
label: "日期框", |
||||
value: "date" |
||||
} |
||||
]; |
||||
|
||||
export const queryDic = [ |
||||
{ |
||||
label: "等于", |
||||
value: "equal" |
||||
}, |
||||
{ |
||||
label: "不等于", |
||||
value: "notequal" |
||||
}, |
||||
{ |
||||
label: "大于", |
||||
value: "gt" |
||||
}, |
||||
{ |
||||
label: "大于等于", |
||||
value: "ge" |
||||
}, |
||||
{ |
||||
label: "小于", |
||||
value: "lt" |
||||
}, |
||||
{ |
||||
label: "小于等于", |
||||
value: "le" |
||||
}, |
||||
{ |
||||
label: "区间", |
||||
value: "between" |
||||
}, |
||||
{ |
||||
label: "模糊", |
||||
value: "like" |
||||
}, |
||||
{ |
||||
label: "左模糊", |
||||
value: "likeleft" |
||||
}, |
||||
{ |
||||
label: "右模糊", |
||||
value: "likeright" |
||||
} |
||||
]; |
||||
|
||||
export const templateDic = [ |
||||
{ |
||||
label: "单表", |
||||
value: "crud" |
||||
}, |
||||
{ |
||||
label: "主子表", |
||||
value: "sub" |
||||
}, |
||||
{ |
||||
label: "树表", |
||||
value: "tree" |
||||
} |
||||
]; |
||||
|
||||
export const option = { |
||||
height: 'auto', |
||||
searchShow: true, |
||||
searchMenuSpan: 6, |
||||
tip: false, |
||||
border: true, |
||||
index: true, |
||||
viewBtn: true, |
||||
selection: true, |
||||
menuWidth: 250, |
||||
column: [ |
||||
{ |
||||
label: "数据源", |
||||
prop: "datasourceId", |
||||
search: true, |
||||
span: 24, |
||||
type: "select", |
||||
dicUrl: "/api/blade-develop/datasource/select", |
||||
props: { |
||||
label: "name", |
||||
value: "id" |
||||
}, |
||||
rules: [{ |
||||
required: true, |
||||
message: "请选择数据源", |
||||
trigger: "blur" |
||||
}] |
||||
}, |
||||
{ |
||||
label: "物理表名", |
||||
prop: "modelTable", |
||||
type: "tree", |
||||
slot: true, |
||||
dicData: [], |
||||
props: { |
||||
label: "comment", |
||||
value: "name" |
||||
}, |
||||
rules: [{ |
||||
required: true, |
||||
message: "请输入数据库表名", |
||||
trigger: "blur" |
||||
}] |
||||
}, |
||||
{ |
||||
label: "模型类名", |
||||
prop: "modelClass", |
||||
rules: [{ |
||||
required: true, |
||||
message: "请输入模型类名", |
||||
trigger: "blur" |
||||
}] |
||||
}, |
||||
{ |
||||
label: "模型名称", |
||||
prop: "modelName", |
||||
search: true, |
||||
rules: [{ |
||||
required: true, |
||||
message: "请输入模型名称", |
||||
trigger: "blur" |
||||
}] |
||||
}, |
||||
{ |
||||
label: "模型编号", |
||||
prop: "modelCode", |
||||
search: true, |
||||
rules: [{ |
||||
required: true, |
||||
message: "请输入模型编号", |
||||
trigger: "blur" |
||||
}] |
||||
}, |
||||
{ |
||||
label: "模型备注", |
||||
prop: "modelRemark", |
||||
hide: true, |
||||
span: 24, |
||||
}, |
||||
] |
||||
}; |
||||
|
||||
export const optionModel = { |
||||
border: true, |
||||
index: true, |
||||
addBtn: false, |
||||
editBtn: false, |
||||
addRowBtn: false, |
||||
cellBtn: false, |
||||
cancelBtn: false, |
||||
tip: false, |
||||
menu: false, |
||||
selection: true, |
||||
column: [{ |
||||
label: '物理列名', |
||||
prop: 'jdbcName', |
||||
}, { |
||||
label: '物理类型', |
||||
prop: 'jdbcType', |
||||
}, { |
||||
label: '实体列名', |
||||
prop: 'propertyName', |
||||
cell: true, |
||||
}, { |
||||
label: '实体类型', |
||||
prop: 'propertyEntity', |
||||
type: "select", |
||||
dicData: entityDic, |
||||
cell: true, |
||||
}, { |
||||
label: '字段说明', |
||||
prop: 'comment', |
||||
cell: true, |
||||
}, { |
||||
label: '列表显示', |
||||
prop: 'isList', |
||||
type: 'switch', |
||||
dicData: switchDic, |
||||
align: 'center', |
||||
width: 80, |
||||
cell: true, |
||||
}, { |
||||
label: '表单显示', |
||||
prop: 'isForm', |
||||
type: 'switch', |
||||
dicData: switchDic, |
||||
align: 'center', |
||||
width: 80, |
||||
cell: true, |
||||
}, { |
||||
label: '独占一行', |
||||
prop: 'isRow', |
||||
type: 'switch', |
||||
dicData: switchDic, |
||||
align: 'center', |
||||
width: 80, |
||||
cell: true, |
||||
}, { |
||||
label: '必填', |
||||
prop: 'isRequired', |
||||
type: 'switch', |
||||
dicData: switchDic, |
||||
align: 'center', |
||||
width: 80, |
||||
cell: true, |
||||
}, { |
||||
label: '组件类型', |
||||
prop: 'componentType', |
||||
type: "select", |
||||
dicData: componentDic, |
||||
cell: true, |
||||
}, { |
||||
label: '字典编码', |
||||
prop: 'dictCode', |
||||
type: "select", |
||||
dicUrl: "/api/blade-system/dict/select", |
||||
props: { |
||||
label: "dictValue", |
||||
value: "code" |
||||
}, |
||||
cell: true, |
||||
}, { |
||||
label: '查询配置', |
||||
prop: 'isQuery', |
||||
type: 'switch', |
||||
dicData: switchDic, |
||||
align: 'center', |
||||
width: 80, |
||||
cell: true, |
||||
}, { |
||||
label: '查询类型', |
||||
prop: 'queryType', |
||||
type: "select", |
||||
dicData: queryDic, |
||||
cell: true, |
||||
}] |
||||
}; |
||||
@ -0,0 +1,349 @@ |
||||
<template> |
||||
<basic-container> |
||||
<avue-crud :option="option" |
||||
:table-loading="loading" |
||||
:data="data" |
||||
:page="page" |
||||
:permission="permissionList" |
||||
:before-open="beforeOpen" |
||||
v-model="form" |
||||
v-loading.fullscreen.lock="fullscreenLoading" |
||||
ref="crud" |
||||
@row-update="rowUpdate" |
||||
@row-save="rowSave" |
||||
@row-del="rowDel" |
||||
@search-change="searchChange" |
||||
@search-reset="searchReset" |
||||
@selection-change="selectionChange" |
||||
@current-change="currentChange" |
||||
@size-change="sizeChange" |
||||
@on-load="onLoad"> |
||||
<template slot="menuLeft"> |
||||
<el-button type="danger" |
||||
size="small" |
||||
icon="el-icon-delete" |
||||
plain |
||||
@click="handleDelete">删 除 |
||||
</el-button> |
||||
</template> |
||||
<template slot-scope="{row}" slot="menu"> |
||||
<el-button type="text" |
||||
icon="el-icon-setting" |
||||
size="small" |
||||
plain |
||||
class="none-border" |
||||
@click.stop="handleModel(row)">模型配置 |
||||
</el-button> |
||||
</template> |
||||
<template slot-scope="{row}" slot="modelTable"> |
||||
<el-tag>{{ row.modelTable }}</el-tag> |
||||
</template> |
||||
</avue-crud> |
||||
<el-dialog title="数据库模型配置" |
||||
:visible.sync="modelBox" |
||||
:fullscreen="true" |
||||
append-to-body> |
||||
<avue-crud ref="crudModel" :option="optionModel" :table-loading="loading" :data="fields"></avue-crud> |
||||
<span slot="footer" class="dialog-footer"> |
||||
<el-button type="danger" @click="modelBox = false">关 闭</el-button> |
||||
<el-button type="primary" @click="handleSubmit">提 交</el-button> |
||||
</span> |
||||
</el-dialog> |
||||
</basic-container> |
||||
</template> |
||||
|
||||
<script> |
||||
import { |
||||
getList, |
||||
getDetail, |
||||
add, |
||||
update, |
||||
remove, |
||||
getTableList, |
||||
getTableInfoByName, |
||||
getModelPrototype, |
||||
submitModelPrototype |
||||
} from "@/api/tool/model"; |
||||
import {entityDic, option, optionModel} from "@/const/tool/model"; |
||||
import {validatenull} from "@/util/validate"; |
||||
import {mapGetters} from "vuex"; |
||||
|
||||
export default { |
||||
data() { |
||||
return { |
||||
form: {}, |
||||
query: {}, |
||||
loading: true, |
||||
loadingOption: { |
||||
lock: true, |
||||
text: 'Loading', |
||||
spinner: 'el-icon-loading', |
||||
background: 'rgba(0, 0, 0, 0)' |
||||
}, |
||||
fullscreenLoading: false, |
||||
page: { |
||||
pageSize: 10, |
||||
currentPage: 1, |
||||
total: 0 |
||||
}, |
||||
selectionList: [], |
||||
modelBox: false, |
||||
modelId: 0, |
||||
datasourceId: 1, |
||||
tableInfo: {}, |
||||
active: 0, |
||||
stepStart: 0, |
||||
stepEnd: 4, |
||||
data: [], |
||||
option: option, |
||||
optionModel: optionModel, |
||||
formStep: {}, |
||||
fields: [], |
||||
selectionModelList: [], |
||||
}; |
||||
}, |
||||
watch: { |
||||
'form.datasourceId'() { |
||||
if (!validatenull(this.form.datasourceId)) { |
||||
const fullLoading = this.$loading(this.loadingOption); |
||||
getTableList(this.form.datasourceId).then(res => { |
||||
const column = this.findObject(this.option.column, "modelTable"); |
||||
column.dicData = res.data.data; |
||||
fullLoading.close(); |
||||
}).catch(() => { |
||||
fullLoading.close(); |
||||
}) |
||||
} |
||||
}, |
||||
'form.modelTable'() { |
||||
if (!validatenull(this.form.modelTable)) { |
||||
const fullLoading = this.$loading(this.loadingOption); |
||||
getTableInfoByName(this.form.modelTable, this.form.datasourceId).then(res => { |
||||
const result = res.data; |
||||
if (result.success) { |
||||
const {comment, entityName} = result.data; |
||||
if (validatenull(this.form.modelClass)) { |
||||
this.form.modelClass = entityName; |
||||
} |
||||
if (validatenull(this.form.modelName)) { |
||||
this.form.modelName = comment; |
||||
} |
||||
if (validatenull(this.form.modelCode)) { |
||||
this.form.modelCode = entityName.replace(/^\S/, s => s.toLowerCase()); |
||||
} |
||||
fullLoading.close(); |
||||
} |
||||
}); |
||||
} |
||||
} |
||||
}, |
||||
computed: { |
||||
...mapGetters(["permission"]), |
||||
permissionList() { |
||||
return { |
||||
addBtn: true, |
||||
delBtn: true, |
||||
editBtn: true, |
||||
viewBtn: false |
||||
}; |
||||
}, |
||||
ids() { |
||||
let ids = []; |
||||
this.selectionList.forEach(ele => { |
||||
ids.push(ele.id); |
||||
}); |
||||
return ids.join(","); |
||||
}, |
||||
}, |
||||
methods: { |
||||
rowSave(row, done, loading) { |
||||
add(row).then(() => { |
||||
done(); |
||||
this.onLoad(this.page); |
||||
this.$message({ |
||||
type: "success", |
||||
message: "操作成功!" |
||||
}); |
||||
}, error => { |
||||
loading(); |
||||
window.console.log(error); |
||||
}); |
||||
}, |
||||
rowUpdate(row, index, done, loading) { |
||||
update(row).then(() => { |
||||
done(); |
||||
this.onLoad(this.page); |
||||
this.$message({ |
||||
type: "success", |
||||
message: "操作成功!" |
||||
}); |
||||
}, error => { |
||||
loading(); |
||||
window.console.log(error); |
||||
}); |
||||
}, |
||||
rowDel(row) { |
||||
this.$confirm("确定将选择数据删除?", { |
||||
confirmButtonText: "确定", |
||||
cancelButtonText: "取消", |
||||
type: "warning" |
||||
}) |
||||
.then(() => { |
||||
return remove(row.id); |
||||
}) |
||||
.then(() => { |
||||
this.onLoad(this.page); |
||||
this.$message({ |
||||
type: "success", |
||||
message: "操作成功!" |
||||
}); |
||||
}); |
||||
}, |
||||
handleDelete() { |
||||
if (this.selectionList.length === 0) { |
||||
this.$message.warning("请选择至少一条数据"); |
||||
return; |
||||
} |
||||
this.$confirm("确定将选择数据删除?", { |
||||
confirmButtonText: "确定", |
||||
cancelButtonText: "取消", |
||||
type: "warning" |
||||
}) |
||||
.then(() => { |
||||
return remove(this.ids); |
||||
}) |
||||
.then(() => { |
||||
this.onLoad(this.page); |
||||
this.$message({ |
||||
type: "success", |
||||
message: "操作成功!" |
||||
}); |
||||
this.$refs.crud.toggleSelection(); |
||||
}); |
||||
}, |
||||
beforeOpen(done, type) { |
||||
if (["edit", "view"].includes(type)) { |
||||
getDetail(this.form.id).then(res => { |
||||
this.form = res.data.data; |
||||
}); |
||||
} |
||||
done(); |
||||
}, |
||||
searchReset() { |
||||
this.query = {}; |
||||
this.onLoad(this.page); |
||||
}, |
||||
searchChange(params, done) { |
||||
this.query = params; |
||||
this.onLoad(this.page, params); |
||||
done(); |
||||
}, |
||||
selectionChange(list) { |
||||
this.selectionList = list; |
||||
}, |
||||
selectionModelChange(list) { |
||||
this.selectionModelList = list; |
||||
}, |
||||
selectionClear() { |
||||
this.selectionList = []; |
||||
this.$refs.crud.toggleSelection(); |
||||
}, |
||||
currentChange(currentPage) { |
||||
this.page.currentPage = currentPage; |
||||
}, |
||||
sizeChange(pageSize) { |
||||
this.page.pageSize = pageSize; |
||||
}, |
||||
onLoad(page, params = {}) { |
||||
this.loading = true; |
||||
getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => { |
||||
const data = res.data.data; |
||||
this.page.total = data.total; |
||||
this.data = data.records; |
||||
this.loading = false; |
||||
this.selectionClear(); |
||||
}); |
||||
}, |
||||
handleModel(row) { |
||||
this.fields = []; |
||||
this.modelBox = true; |
||||
this.loading = true; |
||||
this.modelId = row.id; |
||||
this.datasourceId = row.datasourceId; |
||||
getModelPrototype(this.modelId, this.datasourceId).then(res => { |
||||
const result = res.data; |
||||
if (result.success) { |
||||
this.fields = result.data; |
||||
this.fields.forEach(item => { |
||||
item.$cellEdit = true; |
||||
item.modelId = this.modelId; |
||||
// 首次加载配置默认值 |
||||
if (validatenull(item.id)) { |
||||
item.isList = 1; |
||||
item.isForm = 1; |
||||
item.isRow = 0; |
||||
item.isRequired = 0; |
||||
item.isQuery = 0; |
||||
item.componentType = "input"; |
||||
} |
||||
if (!validatenull(item.name)) { |
||||
item.jdbcName = item.name; |
||||
item.jdbcType = item.propertyType; |
||||
// 根据字段物理类型自动适配实体类型 |
||||
if (item.propertyType === "LocalDateTime") { |
||||
item.propertyType = "Date"; |
||||
item.propertyEntity = "java.util.Date"; |
||||
} else { |
||||
entityDic.forEach(d => { |
||||
if (d.label === item.propertyType) { |
||||
item.propertyType = d.label; |
||||
item.propertyEntity = d.value; |
||||
} |
||||
}); |
||||
} |
||||
} |
||||
}); |
||||
this.loading = false; |
||||
} |
||||
}); |
||||
}, |
||||
handleSubmit() { |
||||
console.log(this.fields); |
||||
this.$confirm("确定提交模型配置?", { |
||||
confirmButtonText: "确定", |
||||
cancelButtonText: "取消", |
||||
type: "warning" |
||||
}).then(() => { |
||||
this.fields.forEach(item => { |
||||
entityDic.forEach(d => { |
||||
if (d.value === item.propertyEntity) { |
||||
item.propertyType = d.label; |
||||
} |
||||
}); |
||||
}); |
||||
submitModelPrototype(this.fields).then(res => { |
||||
const result = res.data; |
||||
if (result.success) { |
||||
this.$message.success(result.msg); |
||||
this.modelBox = false; |
||||
} else { |
||||
this.$message.error(result.msg); |
||||
} |
||||
}) |
||||
}); |
||||
|
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style> |
||||
.none-border { |
||||
border: 0; |
||||
background-color: transparent !important; |
||||
} |
||||
|
||||
.step-div { |
||||
margin-top: 30px; |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue