<template>
|
<a-form-model style="margin-top: 8px" :autoFormCreate="(form)=>{this.form = form}">
|
<a-modal title="分配-菜单" destroyOnClose :visible="visible" @cancel="handleCancel">
|
<!-- :default-expanded-keys="true"
|
:default-selected-keys="defaultSelectedKeys"
|
:default-checked-keys="defaultCheckedKeys"
|
-->
|
<a-tree
|
defaultExpandAll
|
checkable
|
:tree-data="treeData"
|
v-model="defaultSelectedKeys"
|
:replace-fields="replaceFields"
|
@select="onSelect"
|
@check="onCheck"
|
/>
|
<template slot="footer">
|
<a-button key="cancel" @click="handleCancel">
|
取消
|
</a-button>
|
<a-button key="forward" type="primary" @click="handleOk">
|
完成
|
</a-button>
|
</template>
|
</a-modal>
|
</a-form-model>
|
</template>
|
|
<script lang="ts">
|
|
import {
|
Component,
|
Prop,
|
Vue,
|
Emit,
|
Model,
|
Watch,
|
} from 'vue-property-decorator';
|
import { get, post } from "@/util/request";
|
|
@Component({
|
components: {},
|
})
|
export default class UpdateTaskForm extends Vue {
|
@Prop({
|
type: Boolean,
|
default: false,
|
})
|
|
|
private visible!: boolean;
|
// 数据
|
private treeData:any =[
|
// {
|
// name: 'parent 1',
|
// key: '0-0',
|
// child: [
|
// {
|
// name: '张晨成',
|
// key: '0-0-0',
|
// },
|
// {
|
// name: 'parent 1-1',
|
// key: '0-0-1',
|
// },
|
// ],
|
// },
|
// {
|
// name: 'parent 2',
|
// key: '0-1',
|
// child: [
|
// {
|
// name: '张晨成',
|
// key: '0-1-0',
|
// },
|
// {
|
// name: 'parent 1-1',
|
// key: '0-1-1',
|
// },
|
// ],
|
// },
|
]
|
|
private defaultSelectedKeys:any[] = [];
|
private defaultCheckedKeys:any[] = [];
|
|
private replaceFields:any = {
|
children: 'child',
|
title: 'name',
|
}
|
|
private idList:any;
|
|
@Prop({
|
type: Object,
|
default() {
|
return {};
|
},
|
})
|
private record!: any;
|
|
private form: any = null;
|
|
private formVals: any = {
|
target: '0',
|
template: '0',
|
type: '1',
|
time: '',
|
frequency: 'month',
|
};
|
|
private currentStep: number = 0;
|
|
private formLayout = {
|
labelCol: {
|
span: 7,
|
},
|
wrapperCol: {
|
span: 13,
|
},
|
};
|
|
private onSelect(selectedKeys: any, info: any) {
|
|
}
|
private onCheck(checkedKeys: any, info: any) {
|
|
this.idList = checkedKeys
|
|
}
|
// 请求菜单列表数据
|
private menuData() {
|
get('manageMenu/getAllManageMenu', {}).then((res) => {
|
const menuData =res.data.data
|
for (let i = 0; i < menuData.length; i++) {
|
// const element = res.data.data[i];
|
this.treeData.push({
|
name:menuData[i].name,
|
key:menuData[i].id
|
})
|
|
this.treeData[i].child = []
|
if(menuData[i].children && menuData[i].children.length){
|
for (let j = 0; j < menuData[i].children.length; j++) {
|
this.treeData[i].child.push({
|
name:menuData[i].children[j].name,
|
key:menuData[i].children[j].id,
|
})
|
|
}
|
}
|
}
|
|
})
|
.catch((err)=>{
|
console.log(err);
|
})
|
}
|
|
private handleBackward(): void {
|
this.currentStep--;
|
}
|
|
private handleNext(): void {
|
this.form.validateFields((err: any, fieldsValue: any) => {
|
if (err) {
|
return;
|
}
|
this.formVals = { ...this.formVals, ...fieldsValue };
|
this.currentStep++;
|
});
|
}
|
|
private handleCancel(): void {
|
this.updateVisible(false);
|
this.defaultSelectedKeys = []
|
this.defaultCheckedKeys = []
|
}
|
|
// 更新
|
private handleOk(): void {
|
post('manageRole/updateRoleMenu', {menuIds:this.idList,id:this.record.id}).then((res) => {
|
if (res.data.code === 0) {
|
this.updateVisible(false);
|
this.onOk();
|
this.$message.success(res.data.message)
|
this.defaultSelectedKeys = []
|
this.defaultCheckedKeys = []
|
} else {
|
this.$message.warning(res.data.message)
|
}
|
});
|
}
|
|
@Emit('ok')
|
private onOk() {
|
|
}
|
|
private updateVisible(visible: boolean): void {
|
this.$emit('update:visible', visible);
|
}
|
|
private mounted(): void {
|
this.currentStep = 0;
|
|
this.menuData()
|
setTimeout(()=>{
|
this.roleMenuData()
|
},300)
|
}
|
|
@Watch('visible')
|
private roleMenuData(newVal: boolean,oldVal: boolean){
|
this.defaultSelectedKeys = []
|
this.defaultCheckedKeys = []
|
if (newVal) {
|
get('manageMenu/getManageChildMenuByRoleId',{
|
roleId: this.record.id
|
}).then((res)=>{
|
this.defaultSelectedKeys = res.data.data
|
this.defaultCheckedKeys = res.data.data
|
}).catch((err)=>{
|
console.log(err);
|
})
|
}else {
|
}
|
}
|
private recordChange(value: any, oldValue: any): void {
|
this.formVals = {
|
...value,
|
...this.formVals,
|
};
|
this.currentStep = 0;
|
}
|
|
}
|
</script>
|
