ls
/
flowable_management
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

字典管理

master
蔡玲玲 2 months ago
parent
87ce921497
commit
f436ae7e61
3 changed files with 507 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 77
      base-vue/src/views/modules/sys/dict-add-or-update.vue
  2. 318
      base-vue/src/views/modules/sys/dict.vue
  3. 112
      base-vue/src/views/modules/sys/dictDetail-add-or-update.vue

77
base-vue/src/views/modules/sys/dict-add-or-update.vue
View File

@ -0,0 +1,77 @@
<template>
<el-dialog
:title="dataForm.dict_id === null ? '新增字典' : '修改字典'"
:close-on-click-modal="false"
:visible.sync="visible">
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
<el-form-item label="字典编码" prop="code">
<el-input v-model="dataForm.code" placeholder="字典编码"></el-input>
</el-form-item>
<el-form-item label="字典名称" prop="name">
<el-input v-model="dataForm.name" placeholder="字典名称"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
</span>
</el-dialog>
</template>
<script>
export default {
data () {
return {
visible: false,
dataForm: {
dict_id: null,
code: '',
name: ''
},
dataRule: {
code: [
{ required: true, message: '字典编码不能为空', trigger: 'blur' }
]
}
}
},
methods: {
init (row) {
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (row) {
this.dataForm = row
}
})
},
// 表单提交
dataFormSubmit () {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
this.$http({
url: this.$http.adornUrl('/api/dict'),
method: !this.dataForm.dict_id ? 'put' :'post',
data: this.$http.adornData(this.dataForm)
}).then(({data}) => {
if (data && data.code === 200) {
this.$message({
message: '操作成功',
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
} else {
this.$message.error(data.msg)
}
})
}
})
}
}
}
</script>

318
base-vue/src/views/modules/sys/dict.vue
View File

@ -0,0 +1,318 @@
<template>
<div class="mod-dict">
<el-row :gutter="10">
<el-col :xs="13" :sm="13" :md="13" :lg="13" :xl="13" style="margin-bottom: 10px">
<el-card>
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item>
<el-input v-model="dataForm.blurry" placeholder="输入名称或者描述搜索" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button @click="getDataList()">查询</el-button>
<el-button v-if="isAuth('sys:dict:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
<el-button v-if="isAuth('sys:dict:delete')" type="danger" @click="deleteHandle()" :disabled="dataListSelections.length <= 0">批量删除</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
border
v-loading="dataListLoading"
highlight-current-row
style="width: 100%;"
@selection-change="selectionChangeHandle"
@current-change="handleCurrentChange">
<el-table-column
type="selection"
header-align="center"
align="center"
width="50">
</el-table-column>
<el-table-column
prop="code"
header-align="center"
align="center"
label="编码">
</el-table-column>
<el-table-column
prop="name"
header-align="center"
align="center"
label="名称">
</el-table-column>
<el-table-column
fixed="right"
header-align="center"
align="center"
width="150"
label="操作">
<template slot-scope="scope">
<el-button v-if="isAuth('sys:dict:update')" type="text" size="small" @click="addOrUpdateHandle(scope.row)">修改</el-button>
<el-button v-if="isAuth('sys:dict:delete')" type="text" size="small" @click="deleteHandle(scope.row.dict_id)">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="sizeChangeHandle"
@current-change="currentChangeHandle"
:current-page="pageIndex"
:page-sizes="[10, 20, 50, 100]"
:page-size="pageSize"
:total="totalPage"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
</el-card>
</el-col>
<el-col :xs="11" :sm="11" :md="11" :lg="11" :xl="11">
<el-card>
<div slot="header" class="card-title">
<span>字典详情</span>
<el-button v-if="isAuth('sys:dict:add')" style="float: right;" type="primary" @click="detailAddOrUpdateHandle()">新增</el-button>
</div>
<div v-if="query.code === ''">
<div class="my-code">点击字典查看详情</div>
</div>
<div v-else>
<el-table
:data="detailList"
border
v-loading="detailListLoading"
highlight-current-row
style="width: 100%;">
<el-table-column prop="code" label="所属字典" min-width="150" show-overflow-tooltip />
<el-table-column prop="label" label="字典标签" align="center" width="120" show-overflow-tooltip />
<el-table-column prop="value" label="字典值" align="center" width="60" />
<el-table-column prop="dict_sort" label="排序" align="center" width="65" />
<el-table-column prop="para1" label="参数1" align="center" width="65" />
<el-table-column prop="para2" label="参数2" align="center" width="65" />
<el-table-column prop="para3" label="参数3" align="center" width="65" />
<el-table-column
label="操作"
align="center"
width="115px"
fixed="right"
>
<template slot-scope="scope">
<el-button v-if="isAuth('sys:dict:update')" type="text" size="small" @click="detailAddOrUpdateHandle(scope.row)">修改</el-button>
<el-button v-if="isAuth('sys:dict:delete')" type="text" size="small" @click="detailDeleteHandle(scope.row.dict_id)">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="detailSizeChangeHandle"
@current-change="detailCurrentChangeHandle"
:current-page="detailPageIndex"
:page-sizes="[10, 20, 50, 100]"
:page-size="detailPageSize"
:total="detailTotalPage"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
</div>
</el-card>
</el-col>
</el-row>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
<detail-add-or-update v-if="detailAddOrUpdateVisible" ref="detailAddOrUpdate" @refreshDataList="getDetailList"></detail-add-or-update>
</div>
</template>
<script>
import AddOrUpdate from './dict-add-or-update'
import DetailAddOrUpdate from './dictDetail-add-or-update'
export default {
data () {
return {
dataForm: {
blurry: ''
},
dataList: [],
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
dataListSelections: [],
addOrUpdateVisible: false,
query: {code: ''},
detailList: [],
detailPageIndex: 1,
detailPageSize: 10,
detailTotalPage: 0,
detailListLoading: false,
detailListSelections: [],
detailAddOrUpdateVisible: false
}
},
components: {
AddOrUpdate,
DetailAddOrUpdate
},
activated () {
this.getDataList()
},
methods: {
// 获取数据列表
getDataList () {
this.dataListLoading = true
this.$http({
url: this.$http.adornUrl('/api/dict'),
method: 'get',
params: this.$http.adornParams({
'page': this.pageIndex,
'size': this.pageSize,
'sort': 'id,desc',
'blurry': this.dataForm.blurry
})
}).then(({data}) => {
if (data && data.code === 200) {
this.dataList = data.content
this.totalPage = data.totalElements
} else {
this.dataList = []
this.totalPage = 0
}
this.dataListLoading = false
})
},
// 每页数
sizeChangeHandle (val) {
this.pageSize = val
this.pageIndex = 1
this.getDataList()
},
// 当前页
currentChangeHandle (val) {
this.pageIndex = val
this.getDataList()
},
// 多选
selectionChangeHandle (val) {
this.dataListSelections = val
},
// 新增 / 修改
addOrUpdateHandle (row) {
this.addOrUpdateVisible = true
this.$nextTick(() => {
this.$refs.addOrUpdate.init(row)
})
},
// 删除
deleteHandle (id) {
var ids = id ? [id] : this.dataListSelections.map(item => {
return item.dict_id
})
this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl('/api/dict/'),
method: 'DELETE',
data: this.$http.adornData(ids)
}).then(({data}) => {
if (data) {
this.$message({
message: '操作成功',
type: 'success',
duration: 1500,
onClose: () => {
this.getDataList()
}
})
} else {
this.$message.error(data.msg)
}
})
}).catch(() => {})
},
// 选中字典后，设置字典详情数据
handleCurrentChange(val) {
if (val) {
this.query = val
this.getDetailList()
}
},
// 获取字典详情列表
getDetailList () {
this.detailListLoading = true
this.$http({
url: this.$http.adornUrl('/api/dict/dictDetail'),
method: 'get',
params: this.$http.adornParams({
'page': this.detailPageIndex,
'size': this.detailPageSize,
'sort': 'dict_id,desc',
'code': this.query.code
})
}).then(({data}) => {
if (data && data.code === 200) {
this.detailList = data.content
this.detailTotalPage = data.totalElements
} else {
this.detailList = []
this.detailTotalPage = 0
}
this.detailListLoading = false
})
},
// 每页数
detailSizeChangeHandle (val) {
this.detailPageSize = val
this.detailPageIndex = 1
this.getDetailList()
},
// 当前页
detailCurrentChangeHandle (val) {
this.detailPageIndex = val
this.getDetailList()
},
// 字典详情新增 / 修改
detailAddOrUpdateHandle (row) {
this.detailAddOrUpdateVisible = true
this.$nextTick(() => {
this.$refs.detailAddOrUpdate.init(row)
})
},
// 删除
detailDeleteHandle (id) {
this.$confirm(`确定对${id}进行删除操作?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl(`/api/dict/dictDetail/${id}`),
method: 'DELETE',
data: this.$http.adornData()
}).then(({data}) => {
if (data) {
this.$message({
message: '操作成功',
type: 'success',
duration: 1500,
onClose: () => {
this.getDetailList()
}
})
} else {
this.$message.error(data.msg)
}
})
}).catch(() => {})
}
}
}
</script>
<style scoped>
.grid-content {
width: 100%;
border: 1px solid #dfe6ec;
padding: 20px;
}
.card-title {
display: flex;
justify-content: space-between;
align-items: center;
}
</style>

112
base-vue/src/views/modules/sys/dictDetail-add-or-update.vue
View File

@ -0,0 +1,112 @@
<template>
<el-dialog
:title="dataForm.dict_id === null ? '新增字典详情' : '修改字典详情'"
:close-on-click-modal="false"
:visible.sync="visible">
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
<el-form-item label="字典标签" prop="label">
<el-input v-model="dataForm.label" placeholder="字典标签"></el-input>
</el-form-item>
<el-form-item label="字典值" prop="value">
<el-input v-model="dataForm.value" placeholder="字典值"></el-input>
</el-form-item>
<el-form-item label="排序" prop="dict_sort">
<el-input-number
v-model.number="dataForm.dict_sort"
:min="0"
:max="999"
controls-position="right"
/>
</el-form-item>
<el-form-item label="参数1" prop="para1">
<el-input v-model="dataForm.para1" placeholder="参数1"></el-input>
</el-form-item>
<el-form-item label="参数2" prop="para2">
<el-input v-model="dataForm.para2" placeholder="参数2"></el-input>
</el-form-item>
<el-form-item label="参数3" prop="para3">
<el-input v-model="dataForm.para3" placeholder="参数3"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
</span>
</el-dialog>
</template>
<script>
export default {
data () {
return {
visible: false,
dataForm: {
dict_id: null,
label: null,
value: null,
dict_sort: null,
para1: null,
para2: null,
para3: null,
name: null,
dictType: null,
createId: null,
createName: null,
createTime: null,
updateId: null,
updateName: null,
updateTime: null
},
dataRule: {
label: [
{ required: true, message: '字典标签不能为空', trigger: 'blur' }
],
value: [
{ required: true, message: '字典值不能为空', trigger: 'blur' }
],
dict_sort: [
{ required: true, message: '排序不能为空', trigger: 'blur', type: 'number' }
]
}
}
},
methods: {
init (row) {
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (row) {
this.dataForm = row
}
})
},
// 表单提交
dataFormSubmit () {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
this.$http({
url: this.$http.adornUrl('/api/dict/dictDetail'),
method: 'post',
data: this.$http.adornData(this.dataForm)
}).then(({data}) => {
if (data) {
this.$message({
message: '操作成功',
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
} else {
this.$message.error(data.msg)
}
})
}
})
}
}
}
</script>
Write Preview
Loading…
Cancel
Save