import React from 'react'
import {
	WeaAlertPage,
	WeaLocaleProvider,
} from 'ecCom';
import {
	Spin
} from 'antd';

const getLabel = WeaLocaleProvider.getLabel;

class AlertPage extends React.Component {
	render() {
		return (
			<div style={{height:'100%'}}>
                <WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@haizln`}>
                    <div style={{ color: '#000' }}>
                        {getLabel(2012, '对不起，您暂时没有权限！')}
                    </div>
                </WeaAlertPage>
            </div>
		)
	}
}

class Loading extends React.Component {
	constructor(props) {
		super(props);
	}

	render() {
		const {
			size
		} = this.props;

		const style = {
			position: 'absolute',
			top: '50%',
			left: '50%',
			marginLeft: (size === 'lg') ? -16 : -8,
			marginTop: (size === 'lg') ? -16 : -8,
		}

		return (
			<div style={style}>
				<Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@5lak01`} spinning={true} size={size === 'lg' ? 'large' : ''}></Spin>
			</div>
		)
	}
}

//Icon组件参数：bgColor(背景色)必填，shape(形状)、pixel(像素)选填，默认为正方形和10px,
//onIconClick为图标点击的回调函数，回调的值为图标的状态值：0和1。0 -> 关闭，1 -> 开启。
//当不传onIconClick参数时，点击图标没有变化。
class Icon extends React.Component {
	constructor(props) {
		super(props);
	}

	handleClick = () => {
		const {
			iconState
		} = this.props;

		//当父组件没有传onIconClick参数时，不处理这个点击事件。
		if (!this.props.onIconClick) {
			return
		}

		//将图标的状态通过回调函数传回到父组件
		this.props.onIconClick(iconState === 0 ? 1 : 0);
	}

	render() {
		const {
			iconState, //图标的状态值
			bgColor,
			shape = 'square', //默认为正方形
			pixel = 10, //默认为10px
		} = this.props;

		const style = {
			backgroundColor: (iconState === 1) ? bgColor : '#C0C0C0', //图标开启时，使用bgColor作为背景色；当为关闭的状态，则将背景色置为灰色。
			width: pixel,
			height: pixel,
			cursor: 'pointer',
		}

		if (shape === 'circle') { //图标为圆形的情况
			Object.assign(style, {
				borderRadius: '50%'
			});
		}

		return (
			<div style={style} onClick={this.handleClick}></div>
		)
	}
}

import {
	WeaOrgTree,
} from 'ecCom';

class LeftTree extends React.Component {
	constructor(props) {
		super(props);
		this.tree = null;
		this.setRef = element => {
			this.tree = element;
		}
	}

	componentWillReceiveProps(nextProps) {
		if (this.props.triggerRefresh !== nextProps.triggerRefresh) {
			this.init();
		}
	}

	componentDidMount() {
		this.init()
	}

	init = () => {
		if (this.tree) this.tree.reset(() => this.tree.fetchData());
	}

	handleOrgTreeNodeClick = (event, ids, nodeids, nodes) => {
		const {
			handleOrgTreeNodeClick
		} = this.props;

		const {
			type,
			name
		} = nodes[0];

		handleOrgTreeNodeClick({
			id: ids[0],
			type,
			name
		});
	}

	render() {
		const {
			title,
			rightStr
		} = this.props;

		return (
			<div style={{height: '100%'}}>
		        <WeaOrgTree ecId={`${this && this.props && this.props.ecId || ''}_WeaOrgTree@sxce2p`} 
		            ref={this.setRef}
		            needSearch
		            noCache={true}
		            isLoadAllSub={true}
		            needDropMenu={false}
		            inputLeftDom = {`<b>${title}</b>`}
		            params={{rightStr:rightStr}}
		            treeNodeClick = {(event, ids, nodeids, nodes) => this.handleOrgTreeNodeClick(event, ids, nodeids, nodes)}
		        />
        	</div>
		)
	}
}

class Tip extends React.Component {
	constructor(props) {
		super(props);
	}

	render() {
		const {
			tip,
			icon
		} = this.props;

		return (
			<div style={{position: 'absolute', width: 600, top: '42%',left: '50%',marginLeft: -300,textAlign: 'center'}}>
				<i className={icon} style={{fontSize: 80, color: '#D9D9D9'}}/>
				<p>{tip}</p>
			</div>
		)
	}
}

class IconButton extends React.Component {
	constructor(props) {
		super(props);
	}

	render() {
		const {
			tableStore,
			handleIconBtnClick
		} = this.props;

		return (
			<div>
				{
					['icon-coms-plus','icon-coms-Loss'].map( (cln,index) => {
						let bgColor;
						if(index === 0){
							bgColor = '#34A2FF'
						}else{
							bgColor = tableStore.selectedRowKeys.length === 0 ? '#D9D9D9' : '#34A2FF';
						}
						return (
							<span style={{padding: '4px 5px', marginLeft:(index === 1) && 10, backgroundColor:bgColor }} onClick={() => handleIconBtnClick(index)}>
								<i className={cln} style={{color: '#FFF'}}/>
							</span>
						)
					})
				}
			</div>
		)
	}
}

export {
	AlertPage,
	Loading,
	Icon,
	LeftTree,
	Tip,
	IconButton,
}