<template>
|
<basic-container>
|
<!-- <avue-crud :option="optionParent" :table-loading="loading" :data="dataParent" :page="pageParent" ref="crud"
|
v-model="formParent" :permission="permissionList" :before-open="beforeOpen" @row-del="rowDel"
|
@row-update="rowUpdate" @row-save="rowSave" @row-click="handleRowClick" @search-change="searchChange"
|
@search-reset="searchReset" @selection-change="selectionChange" @current-change="currentChange"
|
@size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoadParent">
|
<template slot="menuLeft">
|
<el-button type="danger" size="small" icon="el-icon-delete" v-if="permission.dictbiz_delete" plain
|
@click="handleDelete">删 除
|
</el-button>
|
</template>
|
<template slot-scope="scope" slot="menu">
|
<el-button type="text" icon="el-icon-setting" size="small" @click.stop="handleRowClick(scope.row)"
|
v-if="userInfo.role_name.includes('admin')">字典配置
|
</el-button>
|
</template>
|
<template slot-scope="{row}" slot="code">
|
<el-tag @click="handleRowClick(row)" style="cursor:pointer">{{ row.code }}</el-tag>
|
</template>
|
<template slot-scope="{row}" slot="isSealed">
|
<el-tag>{{ row.isSealed === 0 ? '否' : '是' }}</el-tag>
|
</template>
|
</avue-crud> -->
|
|
|
<!-- <el-dialog :title="`[${dictValue}]字典配置`" append-to-body :visible.sync="box" width="1000px"> -->
|
<avue-crud :option="optionChild" :table-loading="loadingChild" :page="pageChild" :data="dataChild" ref="crudChild"
|
v-model="formChild" :permission="permissionList" :before-open="beforeOpenChild" :before-close="beforeCloseChild"
|
@row-del="rowDelChild" @row-update="rowUpdateChild" @row-save="rowSaveChild" @search-change="searchChangeChild"
|
@search-reset="searchResetChild" @selection-change="selectionChangeChild" @current-change="currentChangeChild"
|
@size-change="sizeChangeChild" @refresh-change="refreshChangeChild" @on-load="onLoadChild">
|
<template slot="menuLeft">
|
<el-button type="danger" size="small" icon="el-icon-delete" v-if="permission.dict_delete" plain
|
@click="handleDelete">删 除
|
</el-button>
|
</template>
|
<!-- <template slot-scope="scope" slot="menu">
|
<el-button type="text" icon="el-icon-circle-plus-outline" size="small"
|
@click.stop="handleAdd(scope.row,scope.index)" v-if="userInfo.role_name.includes('admin')">新增子项
|
</el-button>
|
</template> -->
|
<template slot-scope="{row, size}" slot="isSealed">
|
<el-tag :size="size">{{ row.isSealed === 0 ? '否' : '是' }}</el-tag>
|
</template>
|
</avue-crud>
|
<!-- </el-dialog> -->
|
</basic-container>
|
</template>
|
|
<script>
|
import {
|
getParentList,
|
getChildList,
|
remove,
|
update,
|
add,
|
getDict,
|
getDictTree
|
} from "@/api/system/dictbiz"
|
import {
|
optionParent,
|
optionChild
|
} from "@/option/system/dictCategory"
|
import {
|
mapGetters
|
} from "vuex"
|
|
export default {
|
data () {
|
return {
|
dictValue: '暂无',
|
parentId: '1722966265111248897',
|
formParent: {},
|
formChild: {},
|
selectionList: [],
|
query: {},
|
box: false,
|
loading: true,
|
loadingChild: true,
|
pageParent: {
|
pageSize: 10,
|
pageSizes: [10, 30, 50, 100, 200],
|
currentPage: 1,
|
total: 0
|
},
|
pageChild: {
|
pageSize: 10,
|
pageSizes: [10, 30, 50, 100, 200],
|
currentPage: 1,
|
total: 0
|
},
|
dataParent: [],
|
dataChild: [],
|
optionParent: optionParent,
|
optionChild: {
|
...optionChild,
|
labelWidth: 120,
|
searchLabelWidth: 96,
|
searchShow: true,
|
searchMenuSpan: 3,
|
menuWidth: 160,
|
},
|
}
|
},
|
computed: {
|
...mapGetters(["userInfo", "permission"]),
|
permissionList () {
|
return {
|
addBtn: this.vaildData(this.permission.dictbiz_add, false),
|
delBtn: this.vaildData(this.permission.dictbiz_delete, false),
|
editBtn: this.vaildData(this.permission.dictbiz_edit, false),
|
viewBtn: false,
|
}
|
},
|
ids () {
|
let ids = []
|
this.selectionList.forEach(ele => {
|
ids.push(ele.id)
|
})
|
return ids.join(",")
|
}
|
},
|
mounted () {
|
// this.initData();
|
},
|
methods: {
|
initData () {
|
getDictTree().then(res => {
|
const column = this.findObject(this.optionChild.column, "parentId")
|
column.dicData = res.data.data
|
})
|
},
|
handleAdd (row) {
|
this.formChild.dictValue = ""
|
this.formChild.dictKey = ""
|
this.formChild.sort = 0
|
this.formChild.isSealed = 0
|
this.formChild.remark = ""
|
this.formChild.parentId = row.id
|
this.$refs.crudChild.rowAdd()
|
},
|
rowSave (row, done, loading) {
|
const form = {
|
...row,
|
dictKey: -1,
|
}
|
add(form).then(() => {
|
this.onLoadParent(this.pageParent)
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
})
|
done()
|
}, error => {
|
window.console.log(error)
|
loading()
|
})
|
},
|
rowUpdate (row, index, done, loading) {
|
update(row).then(() => {
|
this.onLoadParent(this.pageParent)
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
})
|
this.onLoadChild(this.pageChild)
|
done()
|
}, error => {
|
window.console.log(error)
|
loading()
|
})
|
},
|
rowDel (row) {
|
this.$confirm("确定将选择数据删除?", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
})
|
.then(() => {
|
return remove(row.id)
|
})
|
.then(() => {
|
this.onLoadParent(this.pageParent)
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
})
|
})
|
},
|
handleRowClick (row) {
|
this.query = {}
|
this.parentId = row.id
|
this.dictValue = row.dictValue
|
|
const code = this.findObject(this.optionChild.column, "code")
|
code.value = row.code
|
const parentId = this.findObject(this.optionChild.column, "parentId")
|
parentId.value = row.id
|
|
this.formChild.code = row.code
|
this.formChild.parentId = row.id
|
|
this.box = true
|
this.onLoadChild(this.pageChild)
|
},
|
searchReset () {
|
this.query = {}
|
this.onLoadParent(this.pageParent)
|
},
|
searchChange (params, done) {
|
this.query = params
|
this.pageParent.currentPage = 1
|
this.onLoadParent(this.pageParent, params)
|
done()
|
},
|
selectionChange (list) {
|
this.selectionList = list
|
},
|
selectionClear () {
|
this.selectionList = []
|
this.$refs.crud.toggleSelection()
|
},
|
handleDelete () {
|
if (this.selectionList.length === 0) {
|
this.$message.warning("请选择至少一条数据")
|
return
|
}
|
this.$confirm("确定将选择数据删除?", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
})
|
.then(() => {
|
return remove(this.ids)
|
})
|
.then(() => {
|
this.onLoadParent(this.pageParent)
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
})
|
this.$refs.crud.toggleSelection()
|
})
|
},
|
beforeOpen (done, type) {
|
if (["edit", "view"].includes(type)) {
|
getDict(this.formParent.id).then(res => {
|
this.formParent = res.data.data
|
})
|
}
|
done()
|
},
|
currentChange (currentPage) {
|
this.pageParent.currentPage = currentPage
|
},
|
sizeChange (pageSize) {
|
this.pageParent.pageSize = pageSize
|
},
|
refreshChange () {
|
this.onLoadParent(this.pageParent, this.query)
|
},
|
rowSaveChild (row, done, loading) {
|
row.code = "articleType"
|
row.parentId = "1722966265111248897"
|
add(row).then(() => {
|
this.onLoadChild(this.pageChild)
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
})
|
done()
|
}, error => {
|
window.console.log(error)
|
loading()
|
})
|
},
|
rowUpdateChild (row, index, done, loading) {
|
update(row).then(() => {
|
this.onLoadChild(this.pageChild)
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
})
|
done()
|
}, error => {
|
window.console.log(error)
|
loading()
|
})
|
},
|
rowDelChild (row) {
|
this.$confirm("确定将选择数据删除?", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
})
|
.then(() => {
|
return remove(row.id)
|
})
|
.then(() => {
|
this.onLoadChild(this.pageChild)
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
})
|
})
|
},
|
searchResetChild () {
|
this.query = {}
|
this.onLoadChild(this.pageChild)
|
},
|
searchChangeChild (params, done) {
|
this.query = params
|
this.pageChild.currentPage = 1
|
this.onLoadChild(this.pageChild, params)
|
done()
|
},
|
selectionChangeChild (list) {
|
this.selectionList = list
|
},
|
selectionClearChild () {
|
this.selectionList = []
|
this.$refs.crudChild.toggleSelection()
|
},
|
handleDeleteChild () {
|
if (this.selectionList.length === 0) {
|
this.$message.warning("请选择至少一条数据")
|
return
|
}
|
this.$confirm("确定将选择数据删除?", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
})
|
.then(() => {
|
return remove(this.ids)
|
})
|
.then(() => {
|
this.onLoadChild(this.pageChild)
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
})
|
this.$refs.crudChild.toggleSelection()
|
})
|
},
|
beforeOpenChild (done, type) {
|
if (["add", "edit"].includes(type)) {
|
this.initData()
|
}
|
if (["edit", "view"].includes(type)) {
|
getDict(this.formChild.id).then(res => {
|
this.formChild = res.data.data
|
})
|
}
|
done()
|
},
|
beforeCloseChild (done) {
|
this.$refs.crudChild.value.parentId = this.parentId
|
this.$refs.crudChild.option.column.filter(item => {
|
if (item.prop === "parentId") {
|
item.value = this.parentId
|
}
|
})
|
done()
|
},
|
currentChangeChild (currentPage) {
|
this.pageChild.currentPage = currentPage
|
},
|
sizeChangeChild (pageSize) {
|
this.pageChild.pageSize = pageSize
|
},
|
refreshChangeChild () {
|
this.onLoadChild(this.pageChild, this.query)
|
},
|
onLoadParent (page, params = {}) {
|
this.loading = true
|
getParentList(
|
page.currentPage,
|
page.pageSize,
|
Object.assign(params, this.query)
|
).then(res => {
|
const data = res.data.data
|
this.pageParent.total = data.total
|
this.dataParent = data.records
|
this.loading = false
|
this.selectionClear()
|
})
|
},
|
onLoadChild (page, params = {}) {
|
this.loadingChild = true
|
getChildList(
|
page.currentPage,
|
page.pageSize,
|
this.parentId,
|
Object.assign(params, this.query)
|
).then(res => {
|
this.dataChild = res.data.data
|
this.loadingChild = false
|
this.selectionClear()
|
})
|
}
|
}
|
}
|
</script>
|
