//会诊申请单处理
import React from 'react';
import { Row, Col, Select, List, Input, Icon, Tabs, DatePicker, Button, Form, Pagination } from 'antd';
import { $http } from '../../../containers/config/https';
import store from '../../../store';
import moment from 'moment';
import './index.less';
import CommonPagination from 'components/pagination/index';

const { Option } = Select;
const { TabPane } = Tabs;
const FormItem = Form.Item;
let user ;

const formItemLayout = {    // label 和input宽度
    labelCol: { span: 5 },
    wrapperCol: { span: 18 },
};
const formItemSwitch = {    // label 和input宽度
    labelCol: { span: 15 },
    wrapperCol: { span: 8 },
};
const ConsultationProcessleft = Form.create()(
    class extends React.Component {
        constructor(props) {
            user = window.sessionStorage.userData ? JSON.parse(window.sessionStorage.userData) : {};
            super(props)
            this.state = {
                // type:'applyList',
                status: '',
                searchInputLo: '',
                stopDate: '',
                startDate: '',
                selectData: [],//会诊类型下拉框数据
                loading: true,//表格loading
                total: 0,// 分页数据
                page: 1,
                pageSize: 10,
                data: [],
                rowId: "",//表格行id 设置颜色
                consultID: '',
                itemDataID: '',
                btnStatus:'',
                //  显示隐藏
                isShow: true,
                size: 'small',
               // applyListNodisable: ''

            };            
        }

        componentDidMount() {
            this.getSelectData();
            this.props.onRef(this);
            this.handleQuery();
        }
        componentWillUnmount() {
            this.setState = (state, callback) => {
                return
            }
        }

        // 调用公共组件的连接事件
        onRef = (ref) => {
            this.child = ref
        }
        // 获取下拉框数据
        getSelectData() {
            let data = {
                params: [
                    {
                        hospID: user.hospID,
                        locID: user.locID,
                        groupID: user.groupID,
                        userID: user.userID,
                        type: 'apply'
                    }
                ]
            }
            $http.post('urlS', this, {
                code: "04090011",
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        this.setState({ 
                            selectData: res.result,
                            handleStartDate:res.result.handleStartDate,
                            handleStopDate:res.result.handleStopDate
                    },() =>{
                        this.handleQuery();
                    })
                    } else {
                        this.setState({ selectData: {} })
                    }
                }
            
            })
        }
        toLeftSearch = (val) => {
           // console.log(val)
            // this.handleQuery()
        }
        onCardEnter = (e) => {
            this.handleQuery();
           
        }
        //查询
        handleQuery = () => {
            let startDate = this.props.form.getFieldValue('startDate');
            let stopDate = this.props.form.getFieldValue('stopDate');
            let { page, pageSize } = this.state;
            let data = {
                params: [{
                    type: this.props.type,
                    admID: '',
                    patNo: this.state.searchInputLo,
                    startDate: startDate ? moment(startDate).format('YYYY-MM-DD') : '',
                    stopDate: stopDate ? moment(stopDate).format('YYYY-MM-DD') : '',
                    locID: user.locID,
                    userID: user.userID,
                    conStatusCode: this.state.status
                }],
                pagination: [{
                    pageSize: pageSize,
                    currentPage: page,
                    sortColumn: 'applyDate',
                    sortOrder: 'desc'
                }]
            }
            $http.post('urlS', this, {
                code: "04090013",
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        this.setState({ itemDataID: "", data: res.result.Data, total: res.result.TotalCount, loading: false })
                    }
                }
            })
            this.props.onChangeType(this.props.type)
        }
        // 查询条件 --- 记录状态
        onChangeStatus = (value) => {
            this.setState({ status: value },
                () =>{
                    //console.log(this.state.status);
                   this.handleQuery();
                });
        }


        callback = (key) => {
            const type = key == 1 ? 'applyList' : 'handleList';

            // key === 1 ? this.setState({
            //     applyList: key
            // }) : null
 
            this.props.onChangeType(type, () => {
                this.handleQuery()
            })
            /*  let type = (key == 1)?'applyList':'handleList';
             this.setState({ type },() => {
                this.handleQuery(this.state.type)
             }); */
        }
        handleDateTimeChange = (e) => {
            this.setState({ startDate: e });
        }
        stopDateTimeChange = (e) => {
            this.setState({ stopDate: e });
        }
        searchInputLo = (e) => {
            this.setState({ searchInputLo: e.target.value })
        }
        //点击行，渲染当前行样式
        onClickRow = (record) => {
            this.props.handThis(record);

        }

        //设置点击row颜色 --左侧表格
        setRowClassName = (record) => {
            return record.conItemID === this.state.itemDataID ? 'clickRowStyle' : '';
        }
    
        handleOnChange = (page, pageSize) => {
           this.setState({page, pageSize}, () => {
               this.handleQuery()
           })
        }
       // 显示分页总条数
        showTotal(total) {
            return `共 ${total} 条`;
        }

        // 显示隐藏

        handleIsShow = () => {
               // console.log('xainshi')
            this.setState({
                isShow: !this.state.isShow
            })
        }

        render() {
            const { getFieldDecorator } = this.props.form;
            return (

                <div className='consultationProcessleft'>
                    <Form>
                        <Row>
                        <Col>
                            <Row  style={{ width: "100%", paddingLeft: "8px", height: '50px', backgroundColor: '#11b982', lineHeight: '50px' }}>
                                <Col span={10}>
                                    <span>申请单列表</span>
                                </Col>
                                <Col span={5} offset={9}>
                                        {/* <Icon   type="double-left" /> */}
                                        <Icon  type="arrow-down" onClick={this.handleIsShow}>显示隐藏</Icon >
                                </Col>
                            </Row>
                            <Tabs defaultActiveKey="1" onChange={this.callback}>
                                <TabPane tab="申请列表" key="1">
                                </TabPane>
                                <TabPane tab="会诊列表" key="2">

                                </TabPane>
                            </Tabs>
                         <div style={{display:(this.state.isShow?"block":"none")}}>
                                <Row style={{width: "100%", paddingTop: "8px", marginLeft: '6px' }}>
                                        <Col className="startDate">
                                            <FormItem {...formItemLayout} label="开始日期">
                                                {getFieldDecorator('startDate', {
                                                    initialValue: moment(moment().format(this.state.handleStartDate), 'YYYY-MM-DD'),
                                                    rules: [{ required: true }]
                                                })(
                                                    <DatePicker disabledDate={(curDate) => {
                                                        return curDate && curDate > moment().endOf('day');
                                                    }} />
                                                )}
                                            </FormItem>
                                        </Col>
                                    </Row>
                                    <Row style={{ width: "100%", paddingTop: "8px", marginLeft: '6px' }}>
                                        <Col className="stopDate">
                                            <FormItem {...formItemLayout} label="结束日期">
                                                {getFieldDecorator('stopDate', {
                                                    initialValue: moment(moment().format(this.state.handleStopDate), 'YYYY-MM-DD'),
                                                    rules: [{ required: true }]
                                                })(
                                                    <DatePicker disabledDate={(curDate) => {
                                                        return curDate && curDate < moment().endOf('day');
                                                    }} />
                                                )}
                                            </FormItem>
                                        </Col>
                                    </Row>
                                    <Row style={{ width: "100%", paddingTop: "8px", paddingLeft: "20px" }}>
                                        <span>会诊状态</span>
                                        <Select showSearch optionFilterProp="title" allowClear value={this.state.status} onChange={this.onChangeStatus} style={{ width: "71%", marginLeft: '10px' }} placeholder="请选择记录状态">
                                            {this.state.selectData.conStatusAry && this.state.selectData.conStatusAry.map(item => {
                                                return <Option key={item.id} value={item.code} title={item.descripts + '^' + item.descriptsSPCode}>{item.descripts}</Option>
                                            })}
                                        </Select>
                                    </Row>
                                    <Row style={{ width: "100%", paddingTop: "8px", paddingLeft: "8px" }}>
                                        <Input
                                            onPressEnter={this.onCardEnter}
                                            placeholder="患者ID"
                                            style={{ width: "65%" }}
                                            onChange={this.searchInputLo}

                                        />
                                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<Button type="primary" onClick={this.handleQuery.bind(this, this.state.type)} >查询</Button>
                                    </Row>
                                    
                                </div>

                            
                        </Col>
                        </Row>
                    </Form>
                    <Row style={{ height: "100%", margin: '6px 15px', borderTop: '1px solid #e8e8e8' }}>
                        <List
                            itemLayout="vertical"
                            size="large"
                            pagination={false}
                            className="aaaaaa"
                            dataSource={this.state.data}
                            footer={
                                <div>
                                    {/*<b style={{position: 'absolute', top: '310px',left: '200px'}}>一共{this.state.total}条</b>*/}
                                </div>
                            }
                            renderItem={item => (
                                <List.Item
                                    key={item.conItemID}
                                    onClick={() => { this.onClickRow(item); this.setState({ itemDataID: item.conItemID }) }}
                                    className={this.setRowClassName(item)}
                                >
                                    <Row className="listcenter">
                                        <div className="listTitle">
                                            <b>{item.patName}</b>
                                            <b style={{ marginLeft: '100px' }}>{item.locDesc}</b>
                                            <b style={{ float: 'right', color: '#64a982' }}>{item.conStatus}</b></div>
                                        <div style={{ margin: '5px 0' }}>
                                            <span>{item.lolDesc}</span>
                                            <span style={{ float: 'right' }}>{item.conItemRequireUserDesc}</span>
                                        </div>
                                        <div>
                                            <span>{item.conApplyDateTime}</span>
                                            <span style={{ marginLeft: '40px' }}>{item.conType}</span>
                                            {item.timeoutFlag == 'Y' ? <span style={{ float: 'right', color: 'red' }}>超时</span> : ''}
                                        </div>
                                    </Row>
                                </List.Item>
                            )}
                        />
                     
                    </Row>
                <div className="page">
                <CommonPagination size={this.state.size} current={this.state.page} total={this.state.total} search={this.state.search}
                                onShowSizeChange={this.handleOnChange.bind(this)} complete={false} dataSource={this.state.data}
                                loading={this.state.loading} onChange={this.handleOnChange.bind(this)} />
               </div>
            </div>
            )
        }
    }
);
export default ConsultationProcessleft;