demo-web-ui
This commit is contained in:
liupopo
248
demo-web-ui/src/views/dictManage/dictCommon.vue
Normal file
248
demo-web-ui/src/views/dictManage/dictCommon.vue
Normal file
@@ -0,0 +1,248 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<div v-show="viewState == 1">
|
||||
<div class="tab-header">
|
||||
<el-form ref="form" :inline="true" :model="form" label-width="80px">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="14">
|
||||
<el-form-item label="数据value">
|
||||
<el-input v-model="page.params.dictValue" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="10">
|
||||
<el-form-item style="float: right;">
|
||||
<el-button type="primary" @click="onSearch()">查 询</el-button>
|
||||
<el-button @click="add()">添 加</el-button>
|
||||
<el-button @click="closeDict">返 回</el-button>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-table :data="tableData" border style="width: 100%;">
|
||||
<el-table-column label="序号" width="50px" type="index" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" width="280px">
|
||||
<template slot-scope="scope">
|
||||
<!-- <el-button type="primary" size="mini" @click="add(scope.row)">-->
|
||||
<!-- 添加子级-->
|
||||
<!-- </el-button>-->
|
||||
<el-button type="primary" size="mini" @click="editRow(scope.row)">
|
||||
修改
|
||||
</el-button>
|
||||
<el-button type="danger" size="mini" @click.native.prevent="deleteRow(scope.row)">
|
||||
删除
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" @click="handleMap(scope.row)">
|
||||
映射
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="dictType" label="字典分类编码" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="groupName" label="数据分组" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="dictKey" label="数据key" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="dictValue" label="数据value" align="center">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination :total="page.total" :page.sync="page.current" :limit.sync="page.size" @pagination="pagination"/>
|
||||
|
||||
<!-- 分类编辑 -->
|
||||
<el-dialog :title="dialogTitle + '字典数据'" :visible.sync="editDialog" width="50%">
|
||||
<table class="e-table" cellspacing="0">
|
||||
<tr>
|
||||
<td>字典分类编码</td>
|
||||
<td>
|
||||
{{ form.dictType }}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>数据分组</td>
|
||||
<td>
|
||||
<el-input v-model="form.groupName"></el-input>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>数据key</td>
|
||||
<td>
|
||||
<el-input v-model="form.dictKey"></el-input>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>数据value</td>
|
||||
<td>
|
||||
<el-input v-model="form.dictValue"></el-input>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="save()">保 存</el-button>
|
||||
<el-button @click="editDialog = false">关 闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<dictMap v-show="viewState == 2" ref="divAdd" @doback="resetState"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { deldictCommon, dictCommonList, putdictCommon, savedictCommon } from '@/api/system/dictType/dictCommon.js'
|
||||
import dictMap from './dictMap'
|
||||
export default {
|
||||
components: {
|
||||
dictMap
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
editDialog: false,
|
||||
dialogTitle: '',
|
||||
viewState: 1,
|
||||
form: {
|
||||
dictKey: '',
|
||||
dictType: '',
|
||||
groupName: '',
|
||||
dictValue: '',
|
||||
parentSid: ''
|
||||
},
|
||||
page: {
|
||||
total: 0, // 默认数据总数
|
||||
current: 1, // 默认开始页面
|
||||
size: 10, // 每页的数据条数
|
||||
params: {
|
||||
dictKey: '',
|
||||
dictType: '',
|
||||
dictValue: '',
|
||||
parentSid: '',
|
||||
sidPath: '',
|
||||
}
|
||||
},
|
||||
tableData: []
|
||||
}
|
||||
},
|
||||
props: ['dictData'],
|
||||
watch: {
|
||||
dictData: {
|
||||
handler(val) {
|
||||
this.form.parentSid = val.sid
|
||||
this.form.dictType = val.dictType
|
||||
this.form.groupName = val.groupName
|
||||
this.page.params.parentSid = val.sid
|
||||
this.page.params.dictType = val.dictType
|
||||
this.getPageList(this.page)
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// if (this.$route.query.sid) {
|
||||
// sessionStorage.setItem('dictType', this.$route.query.dictType);
|
||||
// sessionStorage.setItem('parentSid', this.$route.query.sid);
|
||||
// this.page.params.dictType = this.$route.query.dictType
|
||||
// this.page.params.parentSid = this.$route.query.sid
|
||||
// this.form.dictType = this.$route.query.dictType;
|
||||
// this.form.parentSid = this.$route.query.sid
|
||||
// } else {
|
||||
// this.page.params.dictType = sessionStorage.getItem('dictType');
|
||||
// this.page.params.parentSid = sessionStorage.getItem('parentSid');
|
||||
// this.form.dictType = sessionStorage.getItem('dictType');
|
||||
// this.form.parentSid = sessionStorage.getItem('parentSid');
|
||||
// }
|
||||
this.getPageList(this.page)
|
||||
},
|
||||
methods: {
|
||||
pagination(val) { // 分页
|
||||
this.page.current = val.pageNum
|
||||
this.page.size = val.pageSize
|
||||
this.getPageList(this.page)
|
||||
},
|
||||
onSearch() { // 查询
|
||||
this.getPageList(this.page)
|
||||
},
|
||||
resetSearch() { // 重置
|
||||
this.getPageList(this.page)
|
||||
},
|
||||
getPageList(data) { // 获取列表
|
||||
dictCommonList(data).then((res) => {
|
||||
this.tableData = res.data.records
|
||||
this.page.total = res.data.total
|
||||
})
|
||||
},
|
||||
add(row) {
|
||||
if (row) {
|
||||
this.form.dictType = row.dictType
|
||||
this.form.parentSid = row.sid
|
||||
} else {
|
||||
this.form.parentSid = 0
|
||||
// this.form.dictType = row.dictType
|
||||
}
|
||||
this.dialogTitle = '新增'
|
||||
this.editDialog = true
|
||||
this.form.dictKey = ''
|
||||
this.form.groupName = ''
|
||||
this.form.dictValue = ''
|
||||
this.form.sid = ''
|
||||
},
|
||||
closeDict() {
|
||||
this.form.parentSid = ''
|
||||
this.form.dictType = ''
|
||||
this.form.groupName = ''
|
||||
this.page.params.parentSid = ''
|
||||
this.page.params.dictType = ''
|
||||
this.$emit('doback')
|
||||
},
|
||||
editRow(row) {
|
||||
this.dialogTitle = '编辑'
|
||||
this.editDialog = true
|
||||
this.form = Object.assign({}, row)
|
||||
},
|
||||
save() {
|
||||
if (this.form.sid) {
|
||||
putdictCommon(this.form).then(res => {
|
||||
this.editDialog = false
|
||||
this.getPageList(this.page)
|
||||
this.$message({
|
||||
message: res.msg,
|
||||
type: 'success'
|
||||
})
|
||||
})
|
||||
} else {
|
||||
savedictCommon(this.form).then(res => {
|
||||
this.editDialog = false
|
||||
this.getPageList(this.page)
|
||||
this.$message({
|
||||
message: res.msg,
|
||||
type: 'success'
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
deleteRow(row) {
|
||||
this.$confirm('确定要删除该数据吗, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
deldictCommon({ sid: row.sid }).then(res => {
|
||||
this.getPageList(this.page)
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功!'
|
||||
})
|
||||
})
|
||||
})
|
||||
},
|
||||
handleMap(row) {
|
||||
this.viewState = 2
|
||||
this.$refs['divAdd'].showAdd(row)
|
||||
},
|
||||
resetState() {
|
||||
this.viewState = 1
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
200
demo-web-ui/src/views/dictManage/dictManage.vue
Normal file
200
demo-web-ui/src/views/dictManage/dictManage.vue
Normal file
@@ -0,0 +1,200 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<div v-show="viewState == 1">
|
||||
<div class="tab-header">
|
||||
<el-form ref="form" :inline="true" :model="form" label-width="80px">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="分类名称">
|
||||
<el-input clearable v-model="page.params.dictTypeName"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="说明">
|
||||
<el-input clearable v-model="page.params.remarks"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="10">
|
||||
<el-form-item style="float: right;">
|
||||
<el-button type="primary" @click="onSearch()">查询</el-button>
|
||||
<el-button @click="add()">添加</el-button>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-table :data="tableData" border style="width: 100%;">
|
||||
<el-table-column label="序号" width="50px" type="index" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" width="300px">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="primary" size="mini" @click="guanli(scope.row)">
|
||||
管理
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" @click="editRow(scope.row)">
|
||||
修改
|
||||
</el-button>
|
||||
<el-button type="danger" size="mini" @click.native.prevent="deleteRow(scope.row)">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="dictTypeCode" label="字典分类编码" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="dictTypeName" label="字典分类名称" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="remarks" label="说明" align="center">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination :total="page.total" :page.sync="page.current" :limit.sync="page.size" @pagination="pagination"/>
|
||||
<!-- 分类编辑 -->
|
||||
<el-dialog :title="dialogTitle + '字典分类'" :visible.sync="editDialog" width="50%">
|
||||
<el-form>
|
||||
<table class="e-table" cellspacing="0">
|
||||
<tr>
|
||||
<td>数据字典code</td>
|
||||
<td>
|
||||
<el-input v-model="form.dictTypeCode"></el-input>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>数据分类名称</td>
|
||||
<td>
|
||||
<el-input v-model="form.dictTypeName"></el-input>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>说明</td>
|
||||
<td>
|
||||
<el-input type="textarea" v-model="form.remarks"></el-input>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="save()">保 存</el-button>
|
||||
<el-button @click="editDialog = false">关 闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<dict-common @doback="resetState" :dictData='dictData' v-show="viewState == 2"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { pageList, saveDictType, putDictType, delDictType } from '@/api/system/dictType/index.js'
|
||||
import dictCommon from './dictCommon.vue'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
editDialog: false,
|
||||
dialogTitle: '',
|
||||
form: {},
|
||||
formBackup: Object.assign({}, this.form),
|
||||
page: {
|
||||
total: 0, // 默认数据总数
|
||||
current: 1, // 默认开始页面
|
||||
size: 10, // 每页的数据条数
|
||||
params: {
|
||||
dictTypeName: '',
|
||||
dictTypeCode: ''
|
||||
}
|
||||
},
|
||||
tableData: [],
|
||||
viewState: 1,
|
||||
dictData: {}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
dictCommon
|
||||
},
|
||||
mounted() {
|
||||
this.getPageList(this.page)
|
||||
},
|
||||
methods: {
|
||||
pagination(val) { // 分页
|
||||
this.page.current = val.pageNum
|
||||
this.page.size = val.pageSize
|
||||
this.getPageList(this.page)
|
||||
},
|
||||
onSearch() { // 查询
|
||||
this.getPageList()
|
||||
},
|
||||
resetSearch() { // 重置
|
||||
this.page.current = 1
|
||||
this.getPageList()
|
||||
},
|
||||
getPageList() { // 获取列表
|
||||
pageList(this.page).then((res) => {
|
||||
if (res.success) {
|
||||
this.tableData = res.data.records
|
||||
this.page.total = res.data.total
|
||||
} else {
|
||||
this.tableData = []
|
||||
this.page.total = 0
|
||||
}
|
||||
})
|
||||
},
|
||||
add() {
|
||||
this.dialogTitle = '新增'
|
||||
this.editDialog = true
|
||||
this.form = Object.assign({}, this.formBackup)
|
||||
},
|
||||
editRow(row) {
|
||||
this.dialogTitle = '编辑'
|
||||
this.editDialog = true
|
||||
this.form = Object.assign({}, row)
|
||||
},
|
||||
save() {
|
||||
if (this.form.sid) {
|
||||
putDictType(this.form).then(res => {
|
||||
this.editDialog = false
|
||||
this.getPageList(this.page)
|
||||
this.$message({
|
||||
message: res.msg,
|
||||
type: 'success'
|
||||
})
|
||||
})
|
||||
} else {
|
||||
saveDictType(this.form).then(res => {
|
||||
this.editDialog = false
|
||||
this.getPageList(this.page)
|
||||
this.$message({
|
||||
message: res.msg,
|
||||
type: 'success'
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
deleteRow(row) {
|
||||
this.$confirm('确定要删除该条数据吗, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
delDictType({ sid: row.sid }).then(res => {
|
||||
this.getPageList(this.page)
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功!'
|
||||
})
|
||||
})
|
||||
})
|
||||
},
|
||||
guanli(row) {
|
||||
this.dictData = { dictType: row.dictTypeCode }
|
||||
this.viewState = 2
|
||||
},
|
||||
resetState() {
|
||||
this.viewState = 1
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped="scoped">
|
||||
.my-tabs {
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
155
demo-web-ui/src/views/dictManage/dictMap.vue
Normal file
155
demo-web-ui/src/views/dictManage/dictMap.vue
Normal file
@@ -0,0 +1,155 @@
|
||||
<template>
|
||||
<div class="app-app-container">
|
||||
<div class="tab-header webtop">
|
||||
<!--标题-->
|
||||
<div>{{ viewTitle }}</div>
|
||||
<!--start 添加修改按钮-->
|
||||
<div>
|
||||
<el-button type="primary" size="small" :disabled="submitdisabled" @click="save()">保存
|
||||
</el-button>
|
||||
<el-button type="info" size="small" @click="handleReturn()">关闭</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="listconadd">
|
||||
<el-form ref="form_obj" class="formadd" :model="formobj">
|
||||
<div class="title">
|
||||
<div>[{{ dictionariesKey }}+{{dictionariesValue}}]映射列表</div>
|
||||
<el-button type="primary" size="mini" @click="Add">添加</el-button>
|
||||
</div>
|
||||
<el-table :key="tableKey" :data="formobj.listDtos" :index="index" border style="width: 100%">
|
||||
<el-table-column fixed width="80px" label="序号" type="index" :index="index + 1" align="center"/>
|
||||
<el-table-column fixed prop="name" label="操作" width="100px" align="center" header-align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="danger" @click="dataDelete(scope.$index)">删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="映射来源" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-select v-model="scope.row.map_sourceValue" filterable placeholder="" @change="changeSource($event, scope.row)">
|
||||
<el-option v-for="item in mappingsource_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictValue"></el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="映射实体名称" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-model="scope.row.map_object" placeholder="" clearable/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="映射项目类别" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-model="scope.row.map_item" placeholder="" clearable/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="映射项目编码" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-model="scope.row.map_itemKey" placeholder="" clearable/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="映射项目值" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-model="scope.row.map_itemValue" placeholder="" clearable/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { typeValues } from '@/api/system/roleAdminister/index'
|
||||
import { saveMappingList, selectMappingListInfo } from '@/api/system/dictType/index.js'
|
||||
export default {
|
||||
data() {
|
||||
return{
|
||||
viewTitle: '数据字典-映射管理',
|
||||
tableKey: 0,
|
||||
index: 0,
|
||||
dictionariesKey: '',
|
||||
dictionariesValue: '',
|
||||
mappingsource_list: [],
|
||||
formobj: {
|
||||
userSid: '',
|
||||
dictSid: '',
|
||||
listDtos: []
|
||||
},
|
||||
submitdisabled: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showAdd(row) {
|
||||
this.formobj.dictSid = row.sid
|
||||
this.dictionariesKey = row.dictType
|
||||
this.dictionariesValue = row.dictValue
|
||||
this.formobj.userSid = window.sessionStorage.getItem('userSid')
|
||||
typeValues({ type: 'sys_mappingsource' }).then((resp) => {
|
||||
if (resp.success) {
|
||||
this.mappingsource_list = resp.data
|
||||
}
|
||||
})
|
||||
selectMappingListInfo({ dictSid: row.sid }).then((resp) => {
|
||||
if (resp.success) {
|
||||
this.formobj.listDtos = resp.data
|
||||
}
|
||||
})
|
||||
},
|
||||
Add() {
|
||||
this.formobj.listDtos.push({
|
||||
map_item: '',
|
||||
map_itemKey: '',
|
||||
map_itemValue: '',
|
||||
map_object: '',
|
||||
map_sourceKey: '',
|
||||
map_sourceValue: '',
|
||||
sid: ''
|
||||
})
|
||||
},
|
||||
changeSource(value, row) {
|
||||
let bb = null
|
||||
this.mappingsource_list.forEach((e) => {
|
||||
if (e.dictValue === value) {
|
||||
bb = {
|
||||
value: e.dictValue,
|
||||
key: e.dictKey
|
||||
}
|
||||
}
|
||||
})
|
||||
row.map_sourceKey = bb.key
|
||||
},
|
||||
dataDelete(index) {
|
||||
this.formobj.listDtos.splice(index, 1)
|
||||
},
|
||||
save() {
|
||||
if (this.formobj.listDtos.length === 0) {
|
||||
this.$message({ showClose: true, type: 'error', message: '映射列表不能为空' })
|
||||
return
|
||||
}
|
||||
saveMappingList(this.formobj).then((res) => {
|
||||
if (res.success) {
|
||||
this.$message({ showClose: true, type: 'success', message: '保存成功' })
|
||||
this.handleReturn()
|
||||
}
|
||||
})
|
||||
},
|
||||
handleReturn() {
|
||||
this.formobj = {
|
||||
userSid: '',
|
||||
dictSid: '',
|
||||
listDtos: []
|
||||
}
|
||||
this.$emit('doback')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.title {
|
||||
padding: 7px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user