|
@@ -18,16 +18,17 @@
|
|
|
:label-col="formItemLayout.labelCol"
|
|
|
:wrapper-col="formItemLayout.wrapperCol"
|
|
|
>
|
|
|
- <div style="height: 500px;overflow-y: scroll;">
|
|
|
+ <div style="height: 500px;overflow-y: auto;">
|
|
|
<a-tree
|
|
|
- checkable
|
|
|
- @check="onCheck"
|
|
|
- @expand="onExpand"
|
|
|
- :expandedKeys="expandedKeys"
|
|
|
- :autoExpandParent="autoExpandParent"
|
|
|
- v-model="checkedKeys"
|
|
|
- :treeData="treeData"
|
|
|
- />
|
|
|
+ checkable
|
|
|
+ :selectable="false"
|
|
|
+ @check="onCheck"
|
|
|
+ @expand="onExpand"
|
|
|
+ :expandedKeys="expandedKeys"
|
|
|
+ :autoExpandParent="autoExpandParent"
|
|
|
+ v-model="checkedKeys"
|
|
|
+ :treeData="treeData"
|
|
|
+ />
|
|
|
</div>
|
|
|
<a-form-model-item :label-col="{span: 0}" :wrapper-col="{span: 24}" style="text-align: center;">
|
|
|
<a-button type="primary" id="roleMenuEdit-save" @click="handleSubmit()" :style="{ marginRight: '8px' }">保存</a-button>
|
|
@@ -65,11 +66,20 @@ export default {
|
|
|
return {
|
|
|
spinning: false,
|
|
|
treeData: [],
|
|
|
+ priceOptions:[
|
|
|
+ {label:'售价',value:'salesPrice'},
|
|
|
+ {label:'成本价',value:'costPrice'},
|
|
|
+ {label:'省级价',value:'provincePrice'},
|
|
|
+ {label:'市级价',value:'cityPrice'},
|
|
|
+ {label:'特约价',value:'specialPrice'}
|
|
|
+ ],
|
|
|
titleText: '',
|
|
|
expandedKeys: [],
|
|
|
autoExpandParent: true,
|
|
|
checkedKeys: [],
|
|
|
+ halfCheckedKeys: [],
|
|
|
checkedData: [],
|
|
|
+ authPriceData:[],
|
|
|
isshow: this.visible,
|
|
|
formItemLayout: {
|
|
|
labelCol: { span: 6 },
|
|
@@ -77,16 +87,18 @@ export default {
|
|
|
},
|
|
|
form: {},
|
|
|
rules: {},
|
|
|
+ authType: '1',
|
|
|
id: '' // 角色id
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
onExpand (expandedKeys) {
|
|
|
this.expandedKeys = expandedKeys
|
|
|
- this.autoExpandParent = false
|
|
|
+ // this.autoExpandParent = false
|
|
|
},
|
|
|
onCheck (checkedKeys, info) {
|
|
|
- this.checkedData = [...checkedKeys, ...info.halfCheckedKeys]
|
|
|
+ console.log(checkedKeys, info.halfCheckedKeys)
|
|
|
+ this.halfCheckedKeys = info.halfCheckedKeys
|
|
|
this.checkedKeys = checkedKeys
|
|
|
},
|
|
|
// 保存提交
|
|
@@ -94,12 +106,14 @@ export default {
|
|
|
const _this = this
|
|
|
this.$refs.ruleForm.validate(valid => {
|
|
|
if (valid) {
|
|
|
- if (this.checkedData.length == 0) {
|
|
|
+ if (this.checkedKeys.length == 0) {
|
|
|
return this.$message.warning('请先选择菜单')
|
|
|
}
|
|
|
- const arr = this.checkedData.join(',')
|
|
|
+ const arr = [...this.checkedKeys, ...this.halfCheckedKeys, ...this.checkedData].filter((x, index,self)=>self.indexOf(x)===index)
|
|
|
+ console.log(arr,this.checkedData)
|
|
|
+
|
|
|
_this.spinning = true
|
|
|
- addMenuPower({ id: this.id, menuIds: arr }).then(res => {
|
|
|
+ addMenuPower({ id: this.id, menuIds: arr.join(',') }).then(res => {
|
|
|
if (res.status == 200) {
|
|
|
_this.$message.success(res.message)
|
|
|
_this.$emit('refresh')
|
|
@@ -124,23 +138,80 @@ export default {
|
|
|
this.checkedKeys = []
|
|
|
this.expandedKeys = []
|
|
|
},
|
|
|
- // 选中已勾选菜单
|
|
|
+ isPriceNode(node){
|
|
|
+ const a = node.code.split('_')
|
|
|
+ const c = this.priceOptions.find(item => item.value == a[a.length-1])
|
|
|
+ return c
|
|
|
+ },
|
|
|
+ // 查找叶子节点
|
|
|
findLeaf (data, arr) {
|
|
|
+ const _this = this
|
|
|
for (let i = 0; i < data.length; i++) {
|
|
|
const node = data[i]
|
|
|
- if (node.children) {
|
|
|
+ if (node.children && node.children.length) {
|
|
|
this.findLeaf(node.children, arr)
|
|
|
} else {
|
|
|
+ if(_this.isPriceNode(node)){
|
|
|
+ data.splice(i,1)
|
|
|
+ }else{
|
|
|
+ const hasNode = arr.find(item => item == node.id)
|
|
|
+ const hasCheck = _this.checkedKeys.find(item => item == node.id)
|
|
|
+ if (hasNode && !hasCheck) {
|
|
|
+ this.expandedKeys.push(node.id)
|
|
|
+ this.checkedKeys.push(node.id)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 查找有价格权限的菜单
|
|
|
+ findPrice(data, arr){
|
|
|
+ const _this = this
|
|
|
+ for (let i = 0; i < data.length; i++) {
|
|
|
+ const node = data[i]
|
|
|
+ if(!_this.isPriceNode(node)){
|
|
|
+ // 删除此节点
|
|
|
+ node.checkable = false
|
|
|
+ if(!node.children||node.children.length==0){
|
|
|
+ data.splice(i,1)
|
|
|
+ }
|
|
|
+ }else{
|
|
|
node.class = 'leafNode'
|
|
|
- const hasNode = arr.find(item => {
|
|
|
- return item == node.id
|
|
|
- })
|
|
|
- if (hasNode) {
|
|
|
- this.expandedKeys.push(node.id)
|
|
|
- this.checkedKeys.push(node.id)
|
|
|
+ _this.expandedKeys.push(node.id)
|
|
|
+ // 已选节点勾选
|
|
|
+ const hasNode = arr.find(item => item == node.id)
|
|
|
+ const hasCheck = _this.checkedKeys.find(item => item == node.id)
|
|
|
+ if (hasNode && !hasCheck) {
|
|
|
+ _this.checkedKeys.push(node.id)
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ if (node.children && node.children.length) {
|
|
|
+ _this.findPrice(node.children, arr)
|
|
|
+ }
|
|
|
}
|
|
|
+ },
|
|
|
+ pageInit(){
|
|
|
+ this.id = this.nowData.role.id
|
|
|
+ this.titleText = (this.nowData.type == 1 ? '功能权限分配': '价格权限分配') + '(' + this.nowData.role.name + ')'
|
|
|
+ // 已选节点
|
|
|
+ const arr = this.nowData.role.menuIds
|
|
|
+ // 权限类型, 1功能权限设置,0 价格权限设置
|
|
|
+ this.authType = this.nowData.type
|
|
|
+ this.checkedData = arr ? arr.split(',') : []
|
|
|
+ // 找出叶子节点
|
|
|
+ const treeData = this.nowData.allMenuList
|
|
|
+ this.expandedKeys.push(treeData.id)
|
|
|
+ if(this.authType == 1){
|
|
|
+ this.findLeaf(treeData, this.checkedData)
|
|
|
+ }
|
|
|
+ if(this.authType == 0){
|
|
|
+ this.findPrice(treeData, this.checkedData)
|
|
|
+ }
|
|
|
+ this.checkedData = this.checkedData.filter(item => !this.checkedKeys.includes(item))
|
|
|
+ // console.log(this.checkedData)
|
|
|
+ // console.log(this.checkedKeys)
|
|
|
+ this.treeData = treeData
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
@@ -160,15 +231,7 @@ export default {
|
|
|
nowData: {
|
|
|
handler (newValue, oldValue) {
|
|
|
if (this.isshow && newValue) {
|
|
|
- this.id = this.nowData.role.id
|
|
|
- this.titleText = '分配权限' + '(' + this.nowData.role.name + ')'
|
|
|
- // 已选节点
|
|
|
- const arr = this.nowData.role.menuIds
|
|
|
- this.checkedData = arr ? arr.split(',') : []
|
|
|
- // 找出叶子节点
|
|
|
- this.findLeaf(this.nowData.allMenuList, this.checkedData)
|
|
|
- this.treeData = this.nowData.allMenuList
|
|
|
- console.log(this.treeData)
|
|
|
+ this.pageInit()
|
|
|
}
|
|
|
},
|
|
|
deep: true
|
|
@@ -177,7 +240,8 @@ export default {
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style >
|
|
|
+<style lang="less">
|
|
|
+.roleMenuEdit-modal{
|
|
|
.ant-modal-title{
|
|
|
padding-right: 30px;
|
|
|
}
|
|
@@ -202,5 +266,10 @@ export default {
|
|
|
}
|
|
|
.leafNode{
|
|
|
display: inline-block;
|
|
|
+ .ant-tree-node-content-wrapper{
|
|
|
+ color: red;
|
|
|
+ }
|
|
|
}
|
|
|
+}
|
|
|
+
|
|
|
</style>
|