使用者角色- 許可權選擇 樹形表格+選擇框 三級選單
阿新 • • 發佈:2018-12-14
之前弄了個使用者角色許可權的表格,但是後面 又增加了一個需要三級的新需求,*******,所以對元件進行了新的修改
介面完整如下
這是搭建的demo 裝置管理下有裝置1裝置2兩個模組裝置1擁有增刪改的許可權,裝置2下擁有兩個模組裝置2-1裝置2-2 都擁有相應的模組,
相應的資料格式如下;
treeData:[ { isLeaf: 0, checked: false, id: 1, name: '使用者管理', indeterminate: false, checkAll: false, act: '全選', children: [ { isLeaf: 1, id: 11, name: '使用者列表', parentId: 1, checked: false, selectchecked: [111], checkAll: false, indeterminate: false, children: [], sonData: [ { isLeaf: 0, operation: '增加', parentId: 11, checked: false, id: 111 }, { isLeaf: 0, operation: '修改', parentId: 11, checked: false, id: 112 }, { isLeaf: 0, operation: '刪除', parentId: 11, checked: false, id: 113 } ] } ] }, { isLeaf: 3, checked: false, id: 2, name: '裝置管理', indeterminate: false, checkAll: false, act: '全選', children: [ { isLeaf: 1, id: 21, name: '裝置1', parentId: 2, checked: false, selectchecked: [211], checkAll: false, indeterminate: false, children:[], sonData: [ { isLeaf: 0, operation: '增加', parentId: 21, checked: false, id: 211 }, { isLeaf: 0, operation: '修改', parentId: 21, checked: false, id: 212 }, { isLeaf: 0, operation: '刪除', parentId: 21, checked: false, id: 213 } ] }, { isLeaf: 0, id: 22, act: '全選', name: '裝置2', parentId: 2, checked: false, selectchecked: [], checkAll: false, indeterminate: false, children:[ { isLeaf: 1, id: 23, name: '裝置2-1', parentId: 22, checked: false, selectchecked: [222], checkAll: false, indeterminate: false, children:[], sonData: [ { isLeaf: 0, operation: '增加', parentId: 23, checked: false, id: 221 }, { isLeaf: 0, operation: '修改', parentId: 23, checked: false, id: 222 }, { isLeaf: 0, operation: '刪除', parentId: 21, checked: false, id: 213 } ] }, { isLeaf: 1, id: 24, name: '裝置2-2', parentId: 22, checked: false, selectchecked: [224], checkAll: false, indeterminate: false, children:[], sonData: [ { isLeaf: 0, operation: '增加', parentId: 24, checked: false, id: 224 }, { isLeaf: 0, operation: '修改', parentId: 24, checked: false, id: 225 }, { isLeaf: 0, operation: '刪除', parentId: 24, checked: false, id: 2226 } ] } ] } ] } ]
這個資料格式讓後臺這樣子寫即可。
然後元件中要在defaultSelcet和cc函式中對三級的物件進行相應的處理,相關程式碼遲點整理再放到guthuo上