// 门诊护士工作量
import React from 'react';
import { Select, Row, Col, Button, Spin, DatePicker, message } from 'antd';
import { $http } from '../../../containers/config/https';
import store from 'store';
import moment from 'moment';
import { Util, dayFormat } from 'tools/index';
import RangeDatePicker from 'components/rangePicker/index';
import PubilcTablePagination from '../../common/PubilcTablePagination.jsx'; // 公共table组件


const { Option } = Select;
let user;

export default class OutpatientWorkload extends React.Component {

	constructor(props) {
		super(props);
		var date = new Date()
		this.state = {
			tableData: [],//表格列数据
			columns: [],//列
			total: 0,	// 表格数据总条数
			showLoading: true,
			page: 1,
			pageSize: 10,
			headerHeight: 0,
			admDateFrom: moment(date).format(dayFormat),   //开始日期
            admDateTo: moment(date).format(dayFormat),               // 结束日期
			tableType: 'C',
			cardTypeList :[],
		};
		user = window.sessionStorage.userData ? JSON.parse(window.sessionStorage.userData) : {};
	}

	componentDidMount() {
		this.initData()
		this.loadColumn("OPNurWorkloadStistic")
	}

	componentWillUnmount() {
		// 组件销毁前将静止让setState修改state的状态
		this.setState = (state, callback) => { return; }
	}

	initData() {
		// this.handleQuery();
		 this.loadColumn();
		this.child.handleLoading();
		// 组件加载完毕关闭loading
		this.setState({ showLoading: false });
		var box = document.querySelector(".department-header");
		if (box) { //此处在加一层判断，更加严密，如果box存在的情况下获取
			this.setState({ headerHeight: box.offsetHeight })
		}
	}

	 //点击医嘱
	 onSelectOrd(index, e) {
        let ordChecked = this.state.ordChecked;
        let ordCheckedStatus = this.state.ordCheckedStatus;
        ordChecked[this.state.ordList[index].execID] = !ordChecked[this.state.ordList[index].execID];
        ordCheckedStatus[this.state.ordList[index].execID] = this.state.ordList[index].ordBilledCode
        this.setState({
            ordChecked: ordChecked
        })
	}
	
	startChange(date) {
        this.setState({
            admDateFrom: date,
        })
	}
	
	endChange(date) {
        this.setState({
            admDateTo: date,
        })
    }

 //查询列头数据
 loadColumn = (compontName) => {
	let data = {
		params: [{
			compontName: compontName ? compontName : this.state.compontName,
			type: "C",
			reactCode: [compontName ? compontName : this.state.compontName]
		}]
	}
	$http.post('urlDeault', this, {
		code: "01040073",
		data: data,
		success: (res) => {
			if (res.errorCode == 0) {
				let column = res.result.C;
				if (user.language == 'EN') {
					for (let i = 0; i < column.length; i++) {
						column[i].title = column[i].enDescripts
					}
				}
				var arr = Object.keys(res.result.language.EN);
				if (arr.length > 0) {
					this.setState({
						[(compontName ? compontName : this.state.compontName) + "Column"]: res.result.C,
						ENObj: res.result.language.EN,
						CNObj: res.result.language.CN
					})
				} else {
					this.setState({
						[(compontName ? compontName : this.state.compontName) + "Column"]: res.result.C,
					})
				}
				if (+res.errorCode === 0) {
					let resData = res.result[this.state.tableType];
					this.setState({
						columns: resData,
						tableWidth: res.totalWidth
					}
						, () => {
							//  this.handleQuery();
						})
				}

			}
		}
	})
}


	//查询列头数据
	// loadColumn = () => {
	// 	let data = {
	// 		params: [{
	// 			compontName: "OPNurWorkloadStistic",
	// 			type: this.state.tableType,
	// 		}]
	// 	}
	// 	$http.post('urlDeault', this, {
	// 		code: "01040073",
	// 		data: data,
	// 		success: (res) => {
	// 			if (+res.errorCode === 0) {
	// 				let resData = res.result[this.state.tableType];
	// 				this.setState({
	// 					columns: resData,
	// 					tableWidth: res.totalWidth
	// 				}
	// 					, () => {
	// 						//  this.handleQuery();
	// 					})
	// 			}
	// 		}
	// 	})
	// }



	//查询门诊护士工作量
	handleQuery = () => {
		let data = {
			params: [{
				startDate: moment(this.state.stDate).format('YYYY-MM-DD'),
				stopDate: moment(this.state.endDate).format('YYYY-MM-DD'),
			}],
			pagination: [{
				pageSize: this.state.pageSize,
				currentPage: this.state.page,
				sortColumn: 'code',
				sortOrder: 'asc'
			}]
		};
		// console.log(data)
		$http.post('urlS', this, {
			code: '04080011',
			data: data,
			success: (res) => {
				if (res.errorCode === "0") {
					this.setState({
						total: res.result.TotalCount,
						tableData: res.result.Data,
					});
					this.child.handleLoading();
				} else {
					this.setState({
						total: 0,
						tableData: []
					});
					this.child.handleLoading();
				}
			}
		});
		this.child.handleLoading();
	}


	// 调用公共组件的连接事件
	onRef = (ref) => {
		this.child = ref
	}



	// 提供修改page和pageSize的回调函数
	compilePage(page, pageSize) {
		// 修改page，或者pageSize
		this.setState({ page: page, pageSize: pageSize }, () => {
			// 重新调用查询方法
			//this.handleQuery();
		})
	}


	render() {
		// 组件所需参数
		const param = {
			// 表头配置
			columns: this.state.columns,
			// 表格数据
			data: this.state.tableData,
			// 数据总条数
			total: this.state.total,
			// 当前页数
			page: this.state.page,
			// 表格的宽度
			x: this.state.tableWidth
			// x: 900,
			// y: store.getState().tableHeight.y + 81 - this.state.headerHeight,
			// height: store.getState().tableHeight.y + 126 - this.state.headerHeight + 'px',
		}

		const cardType = [];
        this.state.cardTypeList.map((item) => {
            cardType.push(
                <Option key={item.id} value={item.id} cardlength={item.cardLength}>
                    {user.language == 'CN' ? item.descripts : item.enDescripts} 
                </Option>
            )
        })

        var language = user.language
        var languageObj = {}
        if(language == "EN" ){
            languageObj = this.state.ENObj
        }else{
            languageObj = this.state.CNObj
        }

		return (
			<Spin tip="加载中..." spinning={this.state.showLoading} className="department">
				<div style={{ width: '100%', height: '100%' }}>
					<div className="department-header">
						<Row style={{ minHeight: '80px', padding: '0 24px 24px 24px'}}>
							<Col span={24}>
							 {/* {languageObj  && languageObj.OPNurWorkloadStisticStartingtime != null ? languageObj.OPNurWorkloadStisticStartingtime.descripts : ""}:<DatePicker
									style={{ width: '150px', margin: '23px 15px 0 0' }}
									allowClear
									onChange={(date) => this.setState({ stDate: moment(date, 'YYYY-MM-DD') })}
									defaultValue={moment()}
								/>
							{languageObj  && languageObj.OPNurWorkloadStisticEnddate != null ? languageObj.OPNurWorkloadStisticEnddate.descripts : ""}<DatePicker
									style={{ width: '150px', margin: '23px 15px 0 0' }}
									allowClear
									onChange={(date) => this.setState({ endDate: moment(date, 'YYYY-MM-DD') })}
									defaultValue={moment()}
								/>  */}
								 <span style={{ display: 'inline-block', margin: '23px 15px 0 0' }}>
								   <RangeDatePicker style={{ width: '150px', margin: '23px 15px 0px 0' }}  format='YYYY-MM-DD'  label={languageObj  && languageObj.OPNurWorkloadStisticStartingtime!=null?languageObj.OPNurWorkloadStisticStartingtime.descripts:""} width={300}
								   startDate={this.state.admDateFrom} endDate={this.state.admDateTo}
                                    startChange={this.startChange.bind(this)} endChange={this.endChange.bind(this)} /> 
									</span>
								{/* <RangeDatePicker style={{ width: '150px', margin: '23px 15px 0px 0' }}  format='YYYY-MM-DD'  label={languageObj  && languageObj.OPNurWorkloadStisticStartingtime!=null?languageObj.OPNurWorkloadStisticStartingtime.descripts:""} labelwidth="70px" totalwidth="350" width="280px" 
								   startDate={this.state.admDateFrom} endDate={this.state.admDateTo}
                                    startChange={this.startChange.bind(this)} endChange={this.endChange.bind(this)} />  */}

								<Button onClick={this.handleQuery} style={{ margin: '23px 15px 0px 0', background: 'rgba(255,255,255,1)' }}>{languageObj  && languageObj.OPNurWorkloadStisticQuery != null ? languageObj.OPNurWorkloadStisticQuery.descripts : ""}</Button>
								<Button type='primary' style={{ margin: '23px 15px 0px 0' }}>{languageObj  && languageObj.OPNurWorkloadStisticprint != null ? languageObj.OPNurWorkloadStisticprint.descripts : ""}</Button>
							</Col>
						</Row>
					</div>
					<div style={{ widht: '100%', height: '10px', background: '#f0f2f5' } }></div>
					<div style={{ padding: 24 }}>
						{/* handelThis将夫组件的属性与方法给子组件访问 */}
						<PubilcTablePagination param={param} handelThis={this} onRef={this.onRef} />
					</div>

				</div>
			</Spin>
		)
	}
}