/*
 * Creator:     ML
 * CreatDate:   2019-12-27
 * descripts：  治疗室----治疗历史信息
 * */
import React from 'react';
import { Form, Row, Col, Input, Select, Button, DatePicker, Modal, Table, Icon, Card, message, Divider, Tooltip, Checkbox } from 'antd';
import moment from 'moment';
import { $http } from 'containers/config/https';
import store from 'store'
import PatInfo from './PatInfo';
import '../style/index.less'
import TreatmentContent from './TreatmentContent';
import CommonPagination from 'components/pagination/index';
import ColumnAuthoritysModel from 'pages/columnAuthority/ColumnAuthoritysModel';
const FormItem = Form.Item;
const paddRightCol = {
    paddingRight: "0px"
}
const formItemLayout = { // label 和input宽度
    labelCol: { span: 9 },
    wrapperCol: { span: 15 },
}
const TreatmentHistoryModal = Form.create()(
    class TreatmentHistoryModal extends React.Component {
        constructor(props) {
            super(props)
            this.state = {
                visible: false,
                baseParms: {},
                edit: -1,
                params: {},
                id: "",
                search: "",
                size: "small",
                listData: []
            }
        }
        componentDidMount() {
            this.props.OnHisRef(this);
            this.getMainTableColumns();
        }
        onContent = (ref) => {
            this.onHisContent = ref
        }
        //获取历史治疗数据
        getHisData = (record, e) => {
            let { page, pageSize, } = this.state;
            let data = {}
            data = {
                params: [{
                    ID: record && record.cureAppID || "",
                }],
                pagination: [{
                    pageSize: pageSize,
                    currentPage: page,
                }]
            }
            $http.post('urlS', this, {
                code: '01040169',
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        this.setState({
                            listData: res.result.dataArr,
                            rowIds: res.result.dataArr[0].ID,
                            appointmentID: res.result.dataArr[0].appointmentID,
                            // record:res.result.dataArr[0],
                            total: res.result.TotalCount,
                            records: this.props.record,
                            search: e
                        }, () => {
                            // console.log(" this.addContent", this.onHisContent)
                            this.onHisContent.getHisContent(res.result.dataArr[0].ID)
                            this.onHisContent.handleOnOpenChangeStop()
                            this.onHisContent.handleOnOpenChangeStart()
                        });
                    } else {

                    }
                }
            })
        }
        //动态表头
        onColumnRef = (ref) => {
            this.columnRef = ref;
        }
        // 获取主列表columns --服务组列表
        getMainTableColumns = () => {
            let data = {
                params: [{
                    compontName: "GetPatientTreatmentRecords",
                    reactCode: ['GetPatientTreatmentRecords'],
                    type: 'C',
                }]
            }
            $http.post('urlS', this, {
                code: '01040073',
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        let arr = res.result && res.result.C.length > 0 ? JSON.parse(JSON.stringify(res.result.C)).map(item => {
                            return {
                                align: item.align,
                                widthNum: parseInt(item.width),
                                width: item.width,
                                dataIndex: item.dataIndex,
                                title: <div onDoubleClick={() => this.columnRef.onOpenModel()}>{item.title}</div>,
                                display: item.display,
                                key: item.seqNo,
                                // render: (text, record) => {
                                //    if (item.code == "status") {
                                //      return (
                                //      <span>{record.status=="Y"?"生效":"失效"}</span>
                                //      )
                                //    }
                                //    return text
                                //  }
                            }
                        }) : '';
                        let filterArr = arr.filter(function (item) { return item.display === 'Y' });
                        this.setState({ columns: filterArr, widthTotal: res.totalWidth })
                        // console.log("res.totalWidth",res.totalWidth)
                    }
                }
            })
        }
        onPat = (ref) => {
            this.onChildPat = ref
        }
        showModal = (record, localeProvider) => {
            this.setState({
                visible: true,
                record,
                localeProvider,
            }, () => {
                this.getHisData(record, "search")
                setTimeout(() => {
                    this.onChildPat.getInfo()
                    this.onHisContent.initialForm()
                    if (document.querySelector('.hisDoms .ant-table-body')) {
                        document.querySelector('.hisDoms .ant-table-body').style.height = store.getState().tableHeight.y - 268 + 'px'
                        document.querySelector('.hisDoms .ant-table-body').style.maxHeight = store.getState().tableHeight.y - 268 + 'px'
                        document.querySelector('.hisDoms .ant-table-body').style.overflow = 'auto'
                    }
                }, 100)
            })

        }
        //国际化
        setMessage(name, message) {
            return this.state.localeProvider ? this.state.localeProvider[name][message] : ''
        }
        handleCancel = () => {
            this.props.form.resetFields();
            this.setState({ visible: false, params: {}, edit: -1, id: "" });
        }
        //点击查询后 表格行
        setRowClassNames = (record) => {
            return record.ID === this.state.rowIds ? 'clickRowStyle' : '';
        }
        //点击Row ---列表
        onClickRow = (record) => {
            return {
                onClick: () => {
                    if (this.state.rowIds === "") {
                        this.setState({
                            rowIds: record.ID,
                            appointmentID: record.appointmentID,
                            // record,
                            records: this.props.record,
                        }, () => {
                            // console.log(" this.addContent", this.onHisContent)
                            this.onHisContent.getHisContent(record.ID)
                            this.onHisContent.handleOnOpenChangeStop()
                            this.onHisContent.handleOnOpenChangeStart()
                        });

                    } else {
                        if (this.state.rowIds !== record.ID) {
                            this.setState({
                                rowIds: record.ID,
                                appointmentID: record.appointmentID,
                                // record,
                                records: this.props.record,
                            }, () => {
                                // console.log(" this.addContent", this.onHisContent)
                                this.onHisContent.getHisContent(record.ID)
                                this.onHisContent.handleOnOpenChangeStop()
                                this.onHisContent.handleOnOpenChangeStart()
                            });
                        } else {
                            // this.setState({
                            //     rowIds: "",
                            //     record: {},
                            // })
                        }
                    }
                },
            };
        }
        // 显示分页总条数
        showTotal(total) {
            return `共 ${total} 条`;
        }

        // 修改page和pageSize 跳转至---
        onChange = (e, pageSize) => {
            this.setState({ page: e, pageSize: this.state.pageSize }, () => {
                // 重新调用查询方法
                let { record } = this.state;
                this.getHisData(record);
            })
        }
        //下拉选择页数
        onShowSizeChange = (page, pageSize) => {
            this.setState({ page: 1, pageSize: pageSize }, () => {
                // 重新调用查询方法
                let { record } = this.state;
                this.getHisData(record, "search");
            })
        }
        
        render() {
            const { getFieldDecorator, } = this.props.form;
            const { columns, widthTotal } = this.state

            return (
                <div className="hisDom">
                    <Modal
                        className='addEditDom'
                        width='900px'
                        visible={this.state.visible}
                        title={this.state.localeProvider && this.state.localeProvider.BookRecordPreviousTreatmentRecords ? this.setMessage('BookRecordPreviousTreatmentRecords', 'descripts') : "历次治疗记录单"}
                        onOk={this.handleOk}
                        okText='保存'
                        cancelText='打印'
                        onCancel={this.handleCancel}
                        footer={null}
                    >
                        <div className="departments-header">
                            <Card><PatInfo onPat={this.onPat} localeProvider={this.state.localeProvider} record={this.state.record}></PatInfo></Card>
                            {
                                this.state.listData && this.state.listData.length > 0 ? <Card><Row>
                                    <Col span={10}>
                                        <Card>
                                        <div className="hisDoms">
                                            <Table
                                                scroll={{ x: (columns && columns.length > 0 ? widthTotal : 4000), y: store.getState().tableHeight.y + 64 }}
                                                columns={columns}
                                                dataSource={this.state.listData}
                                                pagination={false}
                                                rowKey={record => record.key}
                                                onRow={this.onClickRow}
                                                rowClassName={this.setRowClassNames}
                                                bordered
                                                style={{ height: store.getState().tableHeight.y - 218 + 'px', overflow: "overlay" }}
                                            />
                                            <CommonPagination size={this.state.size} page={this.state.page} current={this.state.page} total={this.state.total} search={this.state.search}
                                                onShowSizeChange={this.onShowSizeChange.bind(this)} complete={true} dataSource={this.state.listData}
                                                onChange={this.onChange.bind(this)} complete={false}/>
                                            <ColumnAuthoritysModel
                                                clientWidth='800px'
                                                compontName='GetPatientTreatmentRecords'
                                                configType="C"
                                                onRef={this.onColumnRef}
                                                reloadData={this.getMainTableColumns}
                                            />
                                        </div></Card>
                                    </Col>
                                    <Col span={14}>
                                        <Card style={{height:'51vh'}}><TreatmentContent localeProvider={this.state.localeProvider} records={this.state.records} appointmentID={this.state.appointmentID} onContent={this.onContent} rowIds={this.state.rowIds}></TreatmentContent></Card>
                                    </Col>
                                </Row></Card> : <Row>
                                        <Col>
                                            <p>暂无历次记录</p>
                                        </Col>
                                    </Row>
                            }

                        </div>
                    </Modal>
                </div>
            )
        }
    })
export default TreatmentHistoryModal    