//处方点评-医嘱明细
import React from 'react';
import { Card, Row, Col, Form, DatePicker, Select, Button, Tabs, Table, Input, message, Pagination  } from 'antd';
import { $http } from 'containers/config/https';
import store from 'store';
import CommonPagination from 'components/pagination/index';
import ColumnAuthoritysModel from 'pages/columnAuthority/ColumnAuthoritysModel';
const { Option } = Select;
const FormItem = Form.Item;
const TableDataForm = Form.create()(
    class extends React.Component {
        constructor() {
            super();
            this.state = {
                userInfo: JSON.parse(window.sessionStorage.userData),
                detailsId: '',//统计单ID
                TableDataEditField:[], //统计单明细数据
                checkData: {},
                pageSize: 20,
                page: 1,
                pageSize2: 20,
                page2: 1,
                total: '',
                detailTotal: 0,
                columns: [],
                modalColumns:[],
                modalColumnsWidth:'', //表格宽度
                stockID: '', //行id
                SelectData: [], //下拉数据
                PrescriptionNO: '',
                DetailData: {},//详情数据
                stickData: [],//药品列表数据
                diaryData: [],//点评日志数据
                stickdataAmt: '',
                diagnosisData: [],
            };
            this.modalColumnsTop = [
                {
                    key: 1,
                    title: '诊断',
                    dataIndex: 'diagDesc',
                    align: "left",
                    width: '100%'
                },
            ];
            // 统计单详细表头
            this.modalColumns = [

                {
                    key: 1,
                    title: '药品名称 ',
                    dataIndex: 'desc',
                    align: "center",
                    width: '150px'
                },
                {
                    key: 2,
                    title: '数量',
                    dataIndex: 'qty',
                    align: "center",
                    width: '50px'
                },
                {
                    key: 3,
                    title: '单位',
                    dataIndex: 'unit',
                    align: "center",
                    width: '100px'
                },
                {
                    key: 4,
                    title: '剂量',
                    dataIndex: 'dose',
                    align: "center",
                    width: '100px'
                },
                {
                    key: 5,
                    title: '频次',
                    dataIndex: 'frequence',
                    align: "center",
                    width: '100px'
                },
                {
                    key: 6,
                    title: '规格',
                    dataIndex: 'spec',
                    align: "center",
                    width: '150px'
                },
                {
                    key: 7,
                    title: '用法',
                    dataIndex: 'usage',
                    align: "center",
                    width: '100px'
                },
                {
                    key: 8,
                    title: '用药天数',
                    dataIndex: 'durQty',
                    align: "center",
                    width: '50px'
                },
                {
                    key: 9,
                    title: '剂型',
                    dataIndex: 'dosForm',
                    align: "center",
                    width: '100px'
                },
                {
                    key: 10,
                    title: '基本药物',
                    dataIndex: 'sp',
                    align: "center",
                    width: '150px'
                },
                {
                    key: 11,
                    title: '医生',
                    dataIndex: 'doctor',
                    align: "center",
                    width: '100px'
                },
                {
                    key: 12,
                    title: '医嘱开单日期',
                    dataIndex: 'orderDate',
                    align: "center",
                    width: '150px'
                },
                {
                    key: 13,
                    title: '医嘱备注',
                    dataIndex: 'rpAmt',
                    align: "center",
                    width: '150px'
                },
                {
                    key: 14,
                    title: '生产厂家',
                    dataIndex: 'manfDesc',
                    align: "center",
                    width: '150px'
                },
            ]
            this.columns = [

                {
                    key: 1,
                    title: '组号 ',
                    dataIndex: 'stockCode',
                    align: "center",
                    width: '150px'
                },
                {
                    key: 2,
                    title: '点评原因',
                    dataIndex: 'reason',
                    align: "center",
                    width: '150px'
                },
                {
                    key: 3,
                    title: '点评日期',
                    dataIndex: 'auditDate',
                    align: "center",
                    width: '150px'
                },
                {
                    key: 4,
                    title: '点评时间',
                    dataIndex: 'auditTime',
                    align: "center",
                    width: '100px'
                },
                {
                    key: 5,
                    title: '点评人',
                    dataIndex: 'auditUserName',
                    align: "center",
                    width: '100px'
                },
                {
                    key: 6,
                    title: '点评结果',
                    dataIndex: 'state',
                    align: "center",
                    width: '100px'
                },
                // {
                //     key: 7,
                //     title: '不合格警示值',
                //     dataIndex: 'purUnitDesc',
                //     align: "center",
                //     width: '150px'
                // },
                // {
                //     key: 8,
                //     title: '药师建议',
                //     dataIndex: 'baseQty',
                //     align: "center",
                //     width: '150px'
                // },
                // {
                //     key: 9,
                //     title: '药师备注',
                //     dataIndex: 'baseUnitDesc',
                //     align: "center",
                //     width: '100px'
                // },
                // {
                //     key: 10,
                //     title: '医生备注',
                //     dataIndex: 'sp',
                //     align: "center",
                //     width: '100px'
                // },
                // {
                //     key: 11,
                //     title: '有效',
                //     dataIndex: 'state',
                //     align: "center",
                //     width: '100px'
                // }
            ]
        }

        componentDidMount(){
            this.props.onRef(this);
            // this.getDetailTableColumns();
            let leftList = document.querySelectorAll('.tableDataHeight  .ant-table-body');
            if(leftList.length>0){
                leftList[0].style.height = (store.getState().tableHeight.y)/2 -44 + 'px';
            }
            let LogHeight = document.querySelectorAll('.LogHeight  .ant-table-body');
            if(LogHeight.length>0){
                LogHeight[0].style.height = (store.getState().tableHeight.y)/3- 2 + 'px';
            }
            let diagnosisHeight = document.querySelectorAll('.diagnosisHeight  .ant-table-body');
            if(diagnosisHeight.length>0){
                diagnosisHeight[0].style.height = (store.getState().tableHeight.y)/3- 2 + 'px';
            }
        }

        // 获取明细列表头数据
        getDetailTableColumns = () => {
            let {userInfo} = this.state;
            let data = {
                params: [{
                    compontName: 'TableDataFormList',
                    type: 'C',
                }]
            }
            $http.post('urlS', this, {
                code: '01040073',
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        let arr = res.result.C&&res.result.C.length > 0 ? JSON.parse(JSON.stringify(res.result.C)).map((item, index) => {
                            return  {
                                ...item,
                                key: index + 1,
                                title: <div onDoubleClick={() => { this.columnRef.onOpenModel();}}>{userInfo.language== 'EN' ? item.enDescripts : item.title}</div>
                            }
                        }) : '';
                        let filterArr = arr.filter(function(item){ return item.display === 'Y'});
                        // this.setState({modalColumns: filterArr, modalColumnsWidth: res.totalWidth})
                    }
                }
            });
        };

        componentWillReceiveProps(props){
            if(props.PrescriptionNO){
                this.setState({
                    PrescriptionNO: props.PrescriptionNO
                })
            }

        }
        componentWillUnmount() {
            this.setState({  page: 1,});
            // 组件销毁前将静止让setState修改state的状态，防止内存泄漏
            this.setState = (state,callback)=>{ return; }
        }
        //清空表格内容
        handleReset = () => {
            this.setState({stockID: ''})  ;
        };

        // 处方详情
        getPrescriptionData = (no) => {
            let {userInfo} = this.state;
            let data = {
                params: [{
                    presNo: no ? no : this.state.PrescriptionNO,
                }]
            }
            $http.post('urlS', this, {
                code: '02020303',
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        for(var i=0; i<res.data.length; i++){
                            res.data[i].key = i;
                        }
                        this.setState({DetailData: res.data})
                    }
                }
            });
        };

        // 药品列表
        getStockList = () => {
            let {userInfo} = this.state;
            let data = {
                params: [{
                    presNo: this.state.PrescriptionNO,
                }],
                pagination: [
                    {
                        pageSize:this.state.pageSize,
                        currentPage:this.state.page,
                        sort:"ID",
                        dir:"asc",
                    }
                ],
            }
            $http.post('urlS', this, {
                code: '02020305',
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        for(var i=0; i<res.rows.length; i++){
                            res.rows[i].key = i;
                        }
                        this.setState({stickData: res.rows, stickdataAmt: res.totalAmt})
                    }
                }
            });
        };
        // 药品列表
        getDiaryData = () => {
            let {userInfo} = this.state;
            let data = {
                params: [{
                    presNo: this.state.PrescriptionNO,
                }],
                // pagination: [
                //     {
                //         pageSize:this.state.pageSize2,
                //         currentPage:this.state.page2,
                //         sort:"ID",
                //         dir:"asc",
                //     }
                // ],
            }
            $http.post('urlS', this, {
                code: '02020304',
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        for(var i=0; i<res.rows.length; i++){
                            res.rows[i].key = i;
                        }
                        // let da = [];
                        // if(res.diag.length>0){
                        //     for(var k=0;k<res.diag.length; k++){
                        //         da.push({
                        //             data:res.diag[k].ICDDesc ? res.diag[k].ICDDesc : res.diag[k].diagDesc
                        //         })
                        //     }
                        //     console.log('412345646546',da)
                        //     this.setState({ diagnosisData: da})
                        // }
                        for(var k=0; k<res.diag.length; k++){
                            res.diag[k].key = k;
                        }
                        this.setState({diaryData: res.rows, diagnosisData: res.diag})
                    }
                }
            });
        };
        // 页码改变的回调，参数是改变后的页码及每页条数 统计单详情
        onChange = (page, pageSize) => {
            this.setState({page: page, pageSize: this.state.pageSize}, () => {
                // 重新调用查询方法
                // this.props.handelThis.callbackCheck(2,this.state.page2, this.state.pageSize2);
            });
        };

        onShowSizeChange = (current, size) => {
            this.setState({page: current, pageSize: size}, () => {
                // 重新调用查询方法
                this.onChange(current,size);
            })
        };
        // 页码改变的回调，参数是改变后的页码及每页条数 统计单详情
        onChange2 = (page, pageSize) => {
            this.setState({page2: page, pageSize2: this.state.pageSize2}, () => {
                // 重新调用查询方法
                // this.props.handelThis.callbackCheck(2,this.state.page2, this.state.pageSize2);
            });
        };

        onShowSizeChange2 = (current, size) => {
            this.setState({page2: current, pageSize2: size}, () => {
                // 重新调用查询方法
                this.onChange2(current,size);
            })
        };
        //组件权限编辑器
        onColumnRef = (ref) => {
            this.columnRef = ref;
        };
        // 表格行的类名
        setRowClassName = (record) => {
            return record.stockCode === this.state.stockID ? 'clickRowStyle' : '';
        };
        render() {
            const { getFieldDecorator } = this.props.form;
            let {modalColumns, modalColumnsWidth , columns} = this.state;
            const formItemLayout = {    // label 和input宽度
                labelCol: { span:7 },
                wrapperCol: { span: 17 },
            };
            const formItem = {    // label 和input宽度
                labelCol: { span:15 },
                wrapperCol: { span: 9 },
            };
            const formItemAmt = {    // label 和input宽度
                labelCol: { span:12 },
                wrapperCol: { span: 12 },
            };
            return (
                <div className="TableDataForm">
                    <Row style={{height: '30px'}}>
                        <Col span={4}>
                            <FormItem {...formItemLayout} label='处方号'>
                                {getFieldDecorator('No',{
                                    initialValue: this.state.DetailData.presNo ? this.state.DetailData.presNo : undefined,
                                })(
                                  <Input disabled/>
                                ) }
                            </FormItem>
                        </Col>
                        <Col span={3}>
                            <FormItem {...formItemLayout} label='登记号'>
                                {getFieldDecorator('patNo',{
                                    initialValue: this.state.DetailData.patNo ? this.state.DetailData.patNo : undefined,
                                })(
                                    <Input disabled/>
                                ) }
                            </FormItem>
                        </Col>
                        <Col span={2}>
                            <FormItem {...formItemLayout} label='姓名'>
                                {getFieldDecorator('name',{
                                    initialValue: this.state.DetailData.patName ? this.state.DetailData.patName : undefined,
                                })(
                                    <Input disabled/>
                                ) }
                            </FormItem>
                        </Col>
                        <Col span={2}>
                            <FormItem {...formItemLayout} label='性别'>
                                {getFieldDecorator('sex',{
                                    initialValue: this.state.DetailData.sex ? this.state.DetailData.sex : undefined,
                                })(
                                    <Input disabled/>
                                ) }
                            </FormItem>
                        </Col>
                        <Col span={2}>
                            <FormItem {...formItemLayout} label='年龄'>
                                {getFieldDecorator('age',{
                                    initialValue: this.state.DetailData.age ? this.state.DetailData.age : undefined,
                                })(
                                    <Input disabled/>
                                ) }
                            </FormItem>
                        </Col>
                        <Col span={2}>
                            <FormItem {...formItemLayout} label='费别'>
                                {getFieldDecorator('admReason',{
                                    initialValue: this.state.DetailData.admReason ? this.state.DetailData.admReason : undefined,
                                })(
                                    <Input disabled/>
                                ) }
                            </FormItem>
                        </Col>
                        <Col span={3}>
                            <FormItem {...formItemLayout} label='科室'>
                                {getFieldDecorator('admLoc',{
                                    initialValue: this.state.DetailData.admLoc ? this.state.DetailData.admLoc : undefined,
                                    rules:[{ required :false, message: '科室不能为空'}]
                                })(
                                    <Input disabled/>
                                ) }
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span={8} className='diagnosis'>
                            <Card
                                size="small"
                                title={<div className="card-title-left-icon"><div></div>诊断</div>}
                            >
                                {console.log('132123412',this.state.diagnosisData)}
                                <div>
                                    <Table
                                        columns={this.modalColumnsTop}
                                        dataSource={this.state.diagnosisData}
                                        pagination={false}
                                        bordered
                                        scroll={{ y:  (store.getState().tableHeight.y)/2- 50 + 'px' }}
                                        rowKey={record => record.key}
                                        className='diagnosisHeight'
                                    />
                                </div>
                            </Card>
                        </Col>
                        <Col span={16}>
                            <Row>
                                <Card
                                    size="small"
                                    title={<div className="card-title-left-icon"><div></div>点评日志</div>}
                                >
                                    <Col>
                                        <div>
                                            <Table
                                                columns={columns.length>0?columns:this.columns}
                                                dataSource={this.state.diaryData}
                                                pagination={false}
                                                bordered
                                                scroll={{x:modalColumnsWidth? modalColumnsWidth : 750, y: (store.getState().tableHeight.y)/2 + 'px' }}
                                                rowKey={record => record.key}
                                                className='LogHeight'

                                            />

                                            {/*<CommonPagination size='small' current={this.state.page2} total={this.state.detailTotal} search= 'search'*/}
                                                              {/*onShowSizeChange={this.onShowSizeChange2.bind(this)} complete={true} dataSource={this.state.TableDataEditField}*/}
                                                              {/*loading={this.state.loading} onChange={this.onChange2.bind(this)}  pageSize={true} />*/}
                                        </div>
                                    </Col>
                                </Card>
                            </Row>
                            <ColumnAuthoritysModel
                                clientWidth='800px'
                                compontName='TableDataFormList'
                                configType="C"
                                onRef={this.onColumnRef}
                                reloadData={this.getDetailTableColumns}
                            />
                        </Col>
                    </Row>
                    <Row>
                        <Card
                            size="small"
                            title={<div className="card-title-left-icon"><div></div>药品列表</div>}
                        >
                            <Col>
                                <Row>
                                    <Col span={2}>
                                        <FormItem {...formItemAmt} label='处方金额'>
                                            {getFieldDecorator('totalAmt',{
                                                initialValue: this.state.stickdataAmt ,
                                            })(
                                                <Input/>
                                            ) }
                                        </FormItem>
                                    </Col>
                                    <Col span={3}>
                                        <FormItem {...formItem} label='处方抗菌药金额'>
                                            {getFieldDecorator('KAmt',{
                                                initialValue: undefined,
                                            })(
                                                <Input/>
                                            ) }
                                        </FormItem>
                                    </Col>
                                </Row>

                                <div>
                                    <Table
                                        columns={modalColumns.length>0?modalColumns:this.modalColumns}
                                        dataSource={this.state.stickData}
                                        pagination={false}
                                        bordered
                                        scroll={{x:modalColumnsWidth? modalColumnsWidth : 1600, y: (store.getState().tableHeight.y)/2 + 'px' }}
                                        rowKey={record => record.key}
                                        className='tableDataHeight'
                                        rowClassName={this.setRowClassName}
                                        onRow={(record) => {
                                            return {
                                                // 单击行选中
                                                onClick: (e) => {
                                                    e.stopPropagation();
                                                    // this.resetFields();
                                                    if (this.state.stockID === '') {
                                                        // 保存行数据以及ID
                                                        this.setState({stockID: record.stockCode});
                                                        this.props.handelThis.setStockID(record.stockCode);
                                                    } else {
                                                        if (this.state.stockCode !== record.stockCode) {
                                                            this.setState({stockID: record.stockCode});
                                                            this.props.handelThis.setStockID(record.stockCode);
                                                        } else {
                                                            this.setState({ stockID: ''});
                                                        }
                                                    }
                                                }
                                            }
                                        }}
                                    />

                                    <CommonPagination size='small' current={this.state.page} total={this.state.total} search= 'search'
                                                      onShowSizeChange={this.onShowSizeChange.bind(this)} complete={true} dataSource={this.state.TableDataEditField}
                                                      loading={this.state.loading} onChange={this.onChange.bind(this)}  pageSize={true} />
                                </div>
                            </Col>
                        </Card>
                    </Row>
                </div>
            )
        }
    }
);
export default TableDataForm;
