/**
 * auth: 允许的权限
 * authExclude: 排除的权限
 *
 * auth的几种传值方式
 * 1.String
 *      例: auth="sysApp:page"
 *      直接传入字符串,对单项权限进行验证
 *
 * 2.Array
 *  2.1.单项权限
 *      例: auth={['sysApp:page']}
 *  2.2.并且关系多项权限
 *      例: auth={['sysApp:page', 'sysApp:add']}
 *      数组中传入多个字符串
 *      此时验证的是同时拥有"sysApp:page"和"sysApp:add"两项权限才会渲染
 *  2.3.或者关系多项权限
 *      例: auth={[['sysApp:page', 'sysApp:add'], ['sysApp:edit']]}
 *      二维数组结构,内部数组之间为并且关系
 *      此时验证的是"sysApp:page"&"sysApp:add"||"sysApp:edit"
 *      注意:或者的条件必须包括在数组中,暴露在外则判定为并且
 *  2.4.可直接传入布尔值
 *      例: auth={['sysApp:page', 1 === 1]}
 *          auth={[['sysApp:page', 'sysApp:add'], [1 === 1]]}
 *
 * 3.Json
 *  如果觉得多项权限时每次都要写应用编号比较繁琐,可对Array形式进行简化
 *  3.1.单项权限
 *      例: auth={{ sysApp: 'page' }}
 *  3.2.并且关系多项权限
 *      例: auth={{ sysApp: ['page', 'add'] }}
 *  3.3.或者关系多项权限
 *      例: auth={{ sysApp: [['page', 'add'], ['edit']]}}
 *  3.4.可直接传入布尔值
 *      例: auth={{ sysApp: ['page', 1 === 1] }}
 *          auth={{ sysApp: [['page', 'add'], [1 === 1]] }}
 *
 */

import React, { Component } from 'react'
import store from 'store'
import auth from './handler'

const { getState, subscribe } = store

const stroePath = 'user'

export default class Auth extends Component {
    state = getState(stroePath)

    constructor(props) {
        super(props)

        this.unsubscribe = subscribe(stroePath, () => {
            this.setState(getState(stroePath))
        })
    }

    componentWillUnmount() {
        this.unsubscribe()
    }

    render() {
        const flag = auth.call(this.state, this.props.auth, this.props.force)

        if (flag) {
            return this.props.children || <></>
        }

        return <></>
    }
}
