import React from 'react';
import './index.less'
import { Checkbox ,Button } from 'antd';
import Btitle from '@/components/BTitle'
import Api from '@/service/api'
export default class Edit extends React.Component {
    constructor(props){
        super(props)
        this.state={
            lst1:[],
            lst2:[],
            dom:''
        }
    }
    async componentDidMount(){
        const res = await Api.post('dbefrr/init',{},false,true);
        if(res.retcod=='E0006'){
            this.props.history.push('/business/noa')
        }else if(res.retcod==SUCCESS){
            const rol_inr = this.props.match.params.id;
            const res1 = await Api.post('dbefrr/recp_selfrr0',{params:{rol_inr}})
            if(res1.retcod==SUCCESS){
                this.setState({lst1:res1.data.recp_frrlst})
                this.walkLst();
            }
        }
    }
    onSubmit = async()=>{
        let recp_frrlst = []
        this.state.lst2.map((val)=>{
            val.map((item)=>{
                recp_frrlst.push(item)
            })
        })
        const rol_inr = this.props.match.params.id;
        const res = await Api.post('dbefrr/mdlbut_submit',{params:{rol_inr},data:{recp_frrlst}})
        if(res.retcod=='00000'){
            this.props.history.go(-1)
        }
    }
    goback=()=>{
        this.props.history.go(-1)
    }
    //选项选中或取消处理
    checkchange = (index1,index2)=>{
        let arr = this.state.lst2;
        const flag = arr[index1][index2]
        if(flag.typ==null||flag.typ==1){
            arr[index1][index2].typ=0;
        }else if(flag.typ==0){
            arr[index1][index2].typ=1;
        }
        this.setState({lst2:arr})
        console.log(this.state.lst2[index1][index2])
    }
    //遍历列表
    walkLst =async ()=>{
        let result=await Promise.all(this.state.lst1.map(async (val,index)=>{
            return (async ()=>{
                const rol_inr = this.props.match.params.id;
                const res = await Api.post('dbefrr/recp_selfrr0',{params:{rol_inr,pnt_inr:val.frminr}})
                  return res.data.recp_frrlst;
            })()
     }))
     this.walkDom(result)
     this.setState({lst2:result})
     console.log(this.state.lst2)
    }
    //渲染列表
    walkDom = (result)=>{
        const dom = this.state.lst1.map((val,index)=>{
            const child = result.map((cval,cindex)=>{
                if(cindex==index){
                    const item = cval.map((ival,iindex)=>{
                        return (
                            <div className="check"><Checkbox className="checkitem" defaultChecked={ival.typ==0?true:false} onChange={()=>{this.checkchange(index,iindex)}} key={ival.frminr}>{ival.dsp}</Checkbox></div>
                        )
                    })
                    return item
                }
            })
            return (<div className="box">
                        <div className="title">{val.dsp}</div>
                        <div className="checkbox">
                            {child}
                        </div>
                    </div>)
        })
        this.setState({dom})
    }
    render() {
        return (
		<div className='allocation'>
            <Btitle btitle="角色权限配置" hasBack={true} />
            {this.state.dom}
            <div className="btnbox">
                <Button type='primary' size="small" onClick={this.onSubmit}>提交</Button>
                <Button size="small" onClick={this.goback}>取消</Button>
            </div>
        </div>);
    }
}