import React, { useState, useEffect, useReducer } from "react"; import { Button, Tree, message } from "antd"; import { roleTree, adminDataqueryAll } from "@/services/system"; import { doFetch } from "@/utils/doFetch"; import { useRequest } from "umi"; const TreeNode = Tree.TreeNode; const initState = { pcTree: [], pcCheckedKeys: [], pcHalfCheckedKeys: [], appTree: [], appCheckedKeys: [], appHalfCheckedKeys: [], daauthTree: [], daauthCheckkedKeys: [], daauthHalfCheckedKeys: [], }; function reducer(state, action) { let { type } = action, newState = {}; switch (type) { case "changePc": newState = { ...state, pcCheckedKeys: [...action.checkedKeys], pcHalfCheckedKeys: [...action.halfCheckedKeys], }; break; case "changeApp": newState = { ...state, appCheckedKeys: [...action.checkedKeys], appHalfCheckedKeys: [...action.halfCheckedKeys], }; break; case "changeDaauth": newState = { ...state, daauthCheckkedKeys: [...action.checkedKeys], daauthHalfCheckedKeys: [...action.halfCheckedKeys], }; break; case "reset": newState = { ...state, pcTree: [...action.pcTree], pcCheckedKeys: [...action.pcCheckedKeys], pcHalfCheckedKeys: [...action.pcHalfCheckedKeys], appTree: [...action.appTree], appCheckedKeys: [...action.appCheckedKeys], appHalfCheckedKeys: [...action.appHalfCheckedKeys], }; break; case "daauth": newState = { ...state, daauthTree: action.nodeList ? [...action.nodeList] : [], daauthCheckkedKeys: action.havepremIdList ? [...action.havepremIdList] : [], daauthHalfCheckedKeys: action.haveParentIdList ? [...action.haveParentIdList] : [], }; break; } return newState; } const Permissiontree = (props) => { const { id, close, treeType } = props, [state, dispatch] = useReducer(reducer, initState), { pcTree, pcCheckedKeys, pcHalfCheckedKeys, appTree, appCheckedKeys, appHalfCheckedKeys, daauthCheckkedKeys, daauthHalfCheckedKeys, daauthTree, } = state; const loop = (data) => { return data.map((item) => { if (item.children) { return ( <TreeNode key={item.key} title={item.title}> {loop(item.children)} </TreeNode> ); } return <TreeNode key={item.key} title={item.title} />; }); }, pcCheck = (checkedKeys, info) => { dispatch({ type: "changePc", checkedKeys, halfCheckedKeys: info.halfCheckedKeys, }); }, appCheck = (checkedKeys, info) => { dispatch({ type: "changeApp", checkedKeys, halfCheckedKeys: info.halfCheckedKeys, }); }, daauthCheck = (checkedKeys, info) => { dispatch({ type: "changeDaauth", checkedKeys, halfCheckedKeys: info.halfCheckedKeys, }); }, { run, loading } = useRequest(doFetch, { manual: true, formatResult: (res) => res, onSuccess: (result, params) => { if (result.code == "0000") { close(); } }, }); useEffect(() => { resetData(); }, []); function resetData() { if (!id) { return; } if (treeType == "auth") { roleTree({ roleId: id }).then((res) => { if (res.code == "0000") { let data = res?.data || {}; const { pcTree, pcCheckedKeys, pcHalfCheckedKeys, appTree, appCheckedKeys, appHalfCheckedKeys, } = data; dispatch({ type: "reset", pcTree, pcCheckedKeys, pcHalfCheckedKeys, appTree, appCheckedKeys, appHalfCheckedKeys, }); } }); } else { // adminDataqueryAll({ roleId: id }).then(res => { // if (res.code == "0000") { // let data = res?.data || {}; // const { nodeList, havepremIdList, haveParentIdList } = data; // dispatch({ type: "daauth", nodeList, havepremIdList, haveParentIdList }) // } // }) } } const saveData = () => { run({ url: treeType == "auth" ? "/ngic-auth/sysRolePermission/save" : "/ngic-auth/sysRoleDataPermission/save", params: treeType == "auth" ? { roleId: id, permissionIds: [...pcCheckedKeys, ...pcHalfCheckedKeys], appPermissionIds: [...appCheckedKeys, ...appHalfCheckedKeys], } : { roleId: id, roleDataPermissionIds: [ ...daauthCheckkedKeys, ...daauthHalfCheckedKeys, ], }, }); }; return ( <div> <div style={{ width: "100%", display: "flex", overflow: "hidden", minHeight: 100, }} > {treeType == "auth" ? ( <> <div style={{ flex: 1, minHeight: 100 }}> <div style={{ marginBottom: 10 }}>PC端权限:</div> <Tree checkable defaultExpandAll={false} checkedKeys={pcCheckedKeys} onCheck={pcCheck} > {loop(pcTree || [])} </Tree> </div> {/* <div style={{ flex: 1, minHeight: 100 }}> <div style={{ marginBottom: 10 }}>app权限:</div> <Tree checkable defaultExpandAll={false} checkedKeys={appCheckedKeys} onCheck={appCheck} > {loop(appTree || [])} </Tree> </div> */} </> ) : ( <Tree checkable defaultExpandAll={false} checkedKeys={daauthCheckkedKeys} onCheck={daauthCheck} > {loop(daauthTree || [])} </Tree> )} </div> <Button loading={loading} type="primary" style={{ width: "100%", marginTop: 15 }} onClick={saveData} > 提交 </Button> </div> ); }; export default Permissiontree;