// 会诊统计明细
import React from 'react';
import { Tooltip,Select,Pagination,Input, message, Modal, DatePicker , Table} from 'antd';
import { $http } from 'containers/config/https';
import CommonPagination from 'components/pagination/index';
import moment from 'moment';
// 用户数据
let userData ; 
export default class ConsultationStatisticDetail extends React.Component {
    constructor(props) {
        userData = sessionStorage.userData ? JSON.parse(sessionStorage.userData) : {}; 
        super(props);
        this.state = {
            visible: false, // 弹框显示状态
            tableData:[],   // table数据
            total: 0,       // 分页数据
            page: 1,
            pageSize: 10,
            showLoading: false
        },
        // 会诊查询的数据表头
        this.columns = [{
            key: 1,
            title: '姓名',
            dataIndex: 'patName',
            align: "center",
            width: '5%'
        },
        {
            key: 2,
            title: '就诊科室',
            dataIndex: 'admLocDesc',
            align: "center",
            width: '5%'
        },
        {
            key: 3,
            title: '病区',
            dataIndex: 'admWardDesc',
            align: "center",
            width: '5%'
        },
        {
            key: 4,
            title: '床号',
            dataIndex: 'bedNo',
            align: "center",
            width: '6%'
        },
        {
            key: 5,
            title: '诊断',
            dataIndex: 'admDiag',
            align: "center",
            width: '6.5%'
        },
        {
            key: 6,
            title: '会诊类型',
            dataIndex: 'conType',
            align: "center",
            width: '6%'
        },
        {
            key: 7,
            title: '请会诊科室',
            dataIndex: 'conApplyLocDesc',
            align: "center",
            width: '6.5%'
        },
        {
            key: 8,
            title: '请会诊医师',
            dataIndex: 'conAppUserDesc',
            align: "center",
            width: '6%'
        },
        {
            key: 9,
            title: '申请时间',
            dataIndex: 'conApplyTime',
            align: "center",
            width: '5.5%'
        },
        {
            key: 10,
            title: '会诊医院',
            dataIndex: 'conHospDesc',
            align: "center",
            width: '8%'
        },
        {
            key: 11,
            title: '会诊科室',
            dataIndex: 'locDesc',
            align: "center",
            width: '5%'
        },
        {
            key: 12,
            title: '会诊医师',
            dataIndex: 'conItemUserDesc',
            align: "center",
            width: '5%'
        },{
            key: 13,
            title: '接收时间',
            dataIndex: 'conType',
            align: "center",
            width: '5%'
        },{
            key: 14,
            title: '完成时间',
            dataIndex: 'conNature',
            align: "center",
            width: '5%'
        },
        {
            key: 15,
            title: '会诊状态',
            dataIndex: 'conStatus',
            align: "center",
            width: '5%'
        },
        {
            key: 16,
            title: '会诊地点',
            dataIndex: 'conRequirePlace',
            align: "center",
            width: '5%'
        },
        {
            key: 17,
            title: '病情摘要',
            dataIndex: 'conPatCondition',
            align: "center",
            width: '5%',
            onCell: () => {
                return {
                  style: {
                    maxWidth: 150,
                    overflow: 'hidden',
                    whiteSpace: 'nowrap',
                    textOverflow:'ellipsis',
                    cursor:'pointer'
                  }
                }
              },
              render: (text) => <Tooltip placement="topLeft" title={text}>{text}</Tooltip>
        },
        {
            key: 18,
            title: '会诊目的',
            dataIndex: 'conAims',
            align: "center",
            width: '5%',
            onCell: () => {
                return {
                  style: {
                    maxWidth: 150,
                    overflow: 'hidden',
                    whiteSpace: 'nowrap',
                    textOverflow:'ellipsis',
                    cursor:'pointer'
                  }
                }
              },
              render: (text) => <Tooltip placement="topLeft" title={text}>{text}</Tooltip>
        }]            
    }
           
    componentWillReceiveProps(nextProps) {
        
    }
    componentDidMount() {      
        this.props.onRef(this);
    }
    // 显示弹框
    showModal = () => {
        // console.log(this.props.params)
        this.setState({
            visible: true,
        },() => this.getDetail());
    }
        
    // 获取详细信息
    getDetail = () => {
        const params = this.props.params;
        let data = {
            'params': [{
                hospID: userData.hospID,
                locID: params.recordLocID,
                startDate: params.startDate,
                stopDate: params.stopDate,
                type: params.type,
                power: "itemList",
                conItemUserID: params.conItemUserID,

                conTypeCode: params.conTypeCode
            }],
            'pagination':[{
                pageSize:this.state.pageSize,
                currentPage:this.state.current,
                sortColumn:"applyDate",
                sortOrder:"asc"
                }]                
        };    
        $http.post('urlADS', this, {
            code: "04090021",
            data: data,
            success: function (res) {
                if (+res.errorCode == '0') { 
                    let tableData=res.result.Data;
                    for (let i=0;i<tableData.length-1;i++)
                    {
                        tableData[i].key = i
                    } 
                    this.setState({
                        tableData,
                        total: res.result.TotalCount
                    }) ;                   
                }
                // console.log(this.state.tableData)
            },
            error: function (error) {
                message.error('失败：' + error);
            }
        });
    }
            

    // 关闭弹框
    handleCancel = () => {
        this.setState({
            visible: false,
        });
    }
        
    // 页码改变的回调，参数是改变后的页码及每页条数 会诊历史分页
    onChange = (page, pageSize) => {
        this.setState({ page: page, pageSize: pageSize }, () => {
            // 重新调用查询方法
            this.getDetail();
        });
    };

    onShowSizeChange = (current, size) => {
        this.setState({ page: 1, pageSize: size }, () => {
            // 重新调用查询方法
            this.onChange(current,size);
        })
    };

        
    // 显示分页总条数
    showTotal(total) {
        return `共 ${total} 条`;
    }
    render(){
        return(
            <Modal
                width={'80%'}
                title="会诊明细"
                visible={this.state.visible}
                onCancel={this.handleCancel}
                footer={null}
            >
                <div className='colors' style={{ width: '100%', height: '100%' }}>
                    <div style={{ width: '100%', padding: 12, overflow: 'hidden' }}>
                        <div style={{overflowX: 'auto',overflowY:'hidden' }}>
                            <Table
                                style={{height: '400px', maxHeight: '400px', overflow: 'scroll'}}
                                dataSource={this.state.tableData}
                                columns={this.columns}
                                pagination={false}
                                rowKey={(row) => {
                                    return row.key
                                }}
                                loading={this.state.showLoading}
                                bordered
                            />
                            {/* 分页: total--总条数  defaultCurrent--默认的当前页 hideOnSinglePage--只有一页时隐藏分页器 */}
                            <CommonPagination 
                                size='small'
                                current={this.state.page} 
                                total={this.state.total} 
                                search='search'
                                onShowSizeChange={this.onShowSizeChange.bind(this)} 
                                complete={true} 
                                dataSource={this.state.tableData}
                                onChange={this.onChange.bind(this)} 
                            />
                            {/* <Pagination
                                showTotal={() => this.showTotal(this.state.total)}
                                size="small"
                                showQuickJumper
                                showSizeChanger
                                defaultCurrent={1}
                                current={this.state.page}
                                total={this.state.total ? this.state.total : 0}
                                onChange={this.onChange}
                                onShowSizeChange={this.onShowSizeChange}
                                style={{ textAlign: "right",marginTop: '13px'}}
                            />                         */}
                        </div>
                    </div>
                </div>                
            </Modal>
        )
    }
}
