// 住院费用

import React from 'react';
import { Select, Input, Row, Col, Button, message, Form, Table, Tabs, Card } from 'antd';
import { $http } from 'containers/config/https';
import { ArraySome } from '../../../tools/index';
import TipHeader from './component/TipHeader'
import './style/style.less'
import store from '../../../store';
import ReadCard from '../../../components/readcard/ReadCard';
import RangeDatePicker from 'components/rangePicker/index';
import CommonPagination from 'components/pagination/index';
import ListOfHospitalizationExpenses from './ListOfHospitalizationExpenses';
import AccDeposit from './AccDeposit';
import ColumnAuthoritysModel from 'pages/columnAuthority/ColumnAuthoritysModel';

// 组件const
const { Option } = Select;
const dateFormat = 'YYYY-MM-DD' || undefined;
const { TabPane } = Tabs;
const cost_type = require('../../../assets/images/icon_Inquire.png')
let patientData;

// const EditableContext = React.createContext();

// class EditableCell extends React.Component {
//     getInput = () => {
//         if (this.props.inputType === 'number') {
//             return <InputNumber style={{ width: "80%" }} />;
//         }
//         return <Input placeholder="请输入" style={{ width: "80%" }} />;
//     };

//     renderCell = ({ getFieldDecorator }) => {
//         const {
//             editing,
//             dataIndex,
//             title,
//             inputType,
//             record,
//             index,
//             children,
//             ...restProps
//         } = this.props;
//         return (
//             <td {...restProps}>
//                 {editing ? (
//                     <Form.Item style={{ margin: 0 }}>
//                         {getFieldDecorator(dataIndex, {
//                             initialValue: record[dataIndex],
//                             rules: [{ required: true, message: '不能为空' }],
//                         })(this.getInput())}
//                     </Form.Item>
//                 ) : (
//                         children
//                     )}
//             </td>
//         );
//     };

//     render() {
//         return <EditableContext.Consumer>{this.renderCell}</EditableContext.Consumer>;
//     }
// }

class HospPayRecodFind extends React.Component {

    constructor(props) {
        super(props)
        patientData = window.sessionStorage.patientData ? JSON.parse(window.sessionStorage.patientData) : {}
        this.state = {
            userInfo: {}, // 用户数据
            dataTable1: [], // table数据 主列表table
            dataTable2: [], // table数据 
            dataTable3: [], // table数据 
            selectListData1: [],
            selectListData2: [],
            selectListData3: [],
            totalTop: 0,
            pageTop: 1,
            pageSizeTop: 20,
            // 表格数据总条数1
            total1: 0,
            page1: 1,
            pageSize1: 20,
            StartDateTop: undefined,  // //开始日期
            EndDateTop: undefined,  // //结束日期
            StartDate1: undefined,  // //开始日期
            EndDate1: undefined,  // //结束日期
            // 表格数据总条数2
            total2: 0,
            page2: 1,
            pageSize2: 10,
            admID: '',
            cardType: '', // 卡类型
            cardTypeData: [], // 卡类型
            cardNo: '', // 卡号
            patNo: '',
            select1: '',
            select2: '',
            select3: '',
            nameNo: '',
            execID: [],
            payRecordID: '',
            modalShow: false,
            columnsTop: [],
            columns1: [],
            columns2: [],
            columns3: [],
            selectedRowKeys: [],
            money: {},
            bqType: '',
            jsType: '',
            settlement:'',
            chargeStatus: '',
            bqData: [],
            bedData: [],
            jsTypeData: [],
            settlementData:[],
            time1: '1',
            allMoney: 0,
            readModeI: true,
            readModeR: true,
            languageData: {}, // 国际化语言包
            language: {},   // 国际化语言
            languageCode: JSON.parse(window.sessionStorage.userData).language, // 国际化语言标识
            ColumnAuthority: '',
            activeKey: '0', //Tab选择
            medicalNo: '',  // 住院号
            bednumber: '',
            payRecordData: {},
            widthTotal: 0,
            accType: "all",
            loading: false,
            tableLoading: false
        }

    }
    componentDidMount() {

        // 数据加载成功关闭loading
        // this.child.handleLoading()

        this.cardTypeList() //卡类型

        this.jsList() //结算

        this.bqList() //病区

        this.cloumData()

        this.ordList1() //国际化

        this.settlementList()

        document.getElementById('patNo').focus();
    }

    // 费用类型table
    ordList1 = () => {
        let data = {
            params: [{
                "reactCode": ["HospPayRecodFind"],
                "compontName": "HospPayRecodFind",
                "type": "C"

            }]
        }
        $http.post('urlS', this, {
            code: "01040073",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    this.setState({
                        languageData: res.result.language || {},  // 国际化语言包
                    }, () => {
                        this.LanCNEN(this.state.languageCode)
                    })
                }
            }
        });
    }

    LanCNEN = (code) => {
        let { languageData } = this.state
        this.setState({
            language: languageData[code]
        })
    }

    onColumnRef = (ref) => {
        this.columnRef = ref;
    }

    clearn = () => {
        this.setState({
            userInfo: {}, // 用户数据
            dataTable1: [], // table数据 主列表table
            dataTable2: [], // table数据 折扣记账系数配置列表
            dataTable3: [], // table数据 不属于折扣内明细
            totalTop: 0,
            pageTop: 1,
            pageSizeTop: 20,
            // 表格数据总条数1
            total1: 0,
            page1: 1,
            pageSize1: 20,
            StartDateTop: undefined,  // //开始日期
            EndDateTop: undefined,  // //结束日期
            StartDate1: undefined,  // //开始日期
            EndDate1: undefined,  // //结束日期
            // 表格数据总条数2
            total2: 0,
            page2: 1,
            pageSize2: 10,
            cardNo: '', // 卡号
            patNo: '',
            select1: '',
            select2: '',
            select3: '',
            nameNo: '',
            execID: [],
            payRecordID: '',
            modalShow: false,
            selectedRowKeys: [],
            money: {},
            bqType: '',
            jsType: '',
            chargeStatus: '',
            time1: '1',
            allMoney: 0,
            readModeI: true,
            readModeR: true,
            admID: '',
            payRecordData: {},
            editingKey: ""
        })
    }

    // 获取所在编辑的行
    isEditing = record => record.key === this.state.editingKey;

    // 取消
    handleOperationCancel = () => {
        this.setState({ editingKey: '' });
    }

    // 编辑
    handleCompile = (record, index) => {
        this.setState({ editingKey: record.key });
    }

    // 保存
    handleSave = (form, record, index) => {
        let dataSource = this.state.dataTable1 && this.state.dataTable1.length > 0 ? JSON.parse(JSON.stringify(this.state.dataTable1)).map((item, index) => {
            return {
                actual: item.actual,
                id: item.payRecordID,
                payRecordID: item.payRecordID
            }
        }) : [];
        // form.validateFields((error, row) => {
        //     if (error) {
        //         return;
        //     }

        // })
        let data = {
            params: dataSource
        }
        $http.post('urlADS', this, {
            code: '05100380', // 单个保存 05100377
            data: data,
            success: function (res) {
                if (+res.errorCode === 0) {
                    message.success(res.errorMessage);
                    this.dataTableTopData();
                    // this.setState({ editingKey: "" }, () => {
                    // this.dataTableTopData();
                    // })
                }
            }
        })
    }

    // 数据配置
    cloumData = () => {
        var data1 = {
            params: [{
                compontName: "HospPayRecodFind",
                type: 'C',
            }]
        }

        $http.post('urlS', this, {
            code: "01040073",
            data: data1,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    for (var i = 0; i < res.result.C.length; i++) {
                        if (res.result.C[i].dataIndex == 'patName') {
                            res.result.C[i].fixed = 'left'
                            res.result.C[i].width = 60
                        }
                        if (res.result.C[i].dataIndex == 'patNo') {
                            res.result.C[i].fixed = 'left'
                            res.result.C[i].width = 150

                        }
                        if (res.result.C[i].dataIndex == 'diagnose') {
                            res.result.C[i].ellipsis = true

                        }

                    }
                    let arr = [{
                        descripts: '实收金额',
                        enDescripts: "net receipts",
                        dataIndex: 'actual',
                        align: "center",
                        width: 150,
                        fixed: 'right',
                        render: (text, record) => (
                            record.flag == "Y" ?
                            <div>
                                <Input
                                    type="number"
                                    className="input-number input-botder-bottom"
                                    style={{ width: '80%' }} value={record.actual}
                                    onClick={this.handleStopPropagation}
                                    onChange={(e) => this.handleCompileNum(record, e)}
                                /> 
                            </div>: <div>{record.actual}</div>
                        )
                        // render: 
                    }, {
                        // descripts: '操作',
                        // enDescripts: "operation",
                        // dataIndex: 'operation',
                        // key: '6',
                        // align: "center",
                        // width: 130,
                        // fixed: 'right',
                        // render: (text, record, index) => {
                        //     const editable = this.isEditing(record);
                        //     return editable ? (
                        //         <span>
                        //             <EditableContext.Consumer>
                        //                 {form => (
                        //                     <span className='span' onClick={() => this.handleSave(form, record, index)} style={{ marginRight: 8 }}>
                        //                         保存
                        //                     </span>
                        //                 )}
                        //             </EditableContext.Consumer>
                        //             <Divider type="vertical" />
                        //             <Popconfirm title="请确认是否已保存修改的数据，取消后可能会照成数据丢失。" onConfirm={() => this.handleOperationCancel(record, index)}>
                        //                 <span className='span' style={{ color: 'rgba(240,65,52,1)' }}>
                        //                     取消
                        //                 </span>
                        //             </Popconfirm>
                        //         </span>
                        //     ) : (
                        //             <span>
                        //                 <span className='span' onClick={() => this.handleCompile(record, index)}>编辑</span>
                        //             </span>
                        //         )
                        // }
                    }]

                    let resC = [...res.result.C, ...arr];

                    for (var i = 0; i < resC.length; i++) {
                        resC[i].key = i;
                    }

                    this.setState({
                        columns1: resC, // 费用类型table
                        widthTotal: res.totalWidth
                    }, () => {
                        this.columns1(this.state.columns1)
                    });
                }
            }
        });

    }

    // 点击input框时阻止事件冒泡
    handleStopPropagation = (e) => {
        e.stopPropagation();
    }

    // 修改实际金额
    handleCompileNum = (record, e) => {
        let dataSource = JSON.parse(JSON.stringify(this.state.dataTable1));
        for (var i = 0; i < dataSource.length; i++) {
            if (dataSource[i].payRecordID === record.payRecordID) {
                dataSource[i].actual = e.target.value;
                break;
            }
        }
        this.setState({ dataTable1: dataSource })
    }

    // 数据配置
    columns1(resC) {

        let { languageCode } = this.state
        for (var i = 0; i < resC.length; i++) {
            resC[i].key = i;
        }
        if (languageCode === "EN") {
            resC.map((item, i) => {
                item.title = item.enDescripts
            })
        }

        if (languageCode === "CN") {
            resC.map((item, i) => {
                item.title = item.descripts
            })
        }

        this.setState({
            columns1: resC, // 费用类型table
        });
    }

    // 数据配置
    columnsTop(resC) {

        let { languageCode } = this.state
        for (var i = 0; i < resC.length; i++) {
            resC[i].key = i;
        }
        if (languageCode === "EN") {
            resC.map((item, i) => {
                item.title = item.enDescripts
            })
        }

        if (languageCode === "CN") {
            resC.map((item, i) => {
                item.title = item.descripts
            })
        }

        this.setState({
            columnsTop: resC, // 费用类型table
        });
    }

    //卡类型
    cardTypeList = () => {
        var data = {
            params: [{
                hospID: JSON.parse(window.sessionStorage.userData).hospID, //医院id 
            }]
        }

        $http.post('urlS', this, {
            code: "01040059",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    let cardDeffault = res.cardType.filter((item) => {
                        return item.defaultFlag === 'Y';
                    })
                    this.setState({
                        cardType: cardDeffault[0].id, // 默认卡
                        cardTypeData: res.cardType,  // 用户数据
                    }, () => {
                        this.CardTypeChange(this.state.cardType)
                    });
                }
            }
        });
    }

    //1.1.49.住院费用明细相关下拉框（病区）
    bqList = () => {
        var data = {
            params: [{
                "hospID": JSON.parse(window.sessionStorage.userData).hospID || '', //医院id 
                "type": "W",
                "status": "1",
            }]
        }

        $http.post('urlS', this, {
            code: "04020008",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {

                    this.setState({
                        bqData: res.result.Data || [], // 数据
                    });
                    for (var i = 0; i < res.result.Data.length; i++) {
                        if (res.result.Data[i].id == JSON.parse(window.sessionStorage.userData).locID) {
                            this.setState({
                                bqType: res.result.Data[i].id
                            }, () => this.BedChange(res.result.Data[i].id))
                            break;
                        }

                    }

                }
            }
        });
    }

    //1.1.49.住院费用明细相关下拉框（结算）
    jsList = () => {
        var data = {
            params: [{
                "hospID": JSON.parse(window.sessionStorage.userData).hospID || '', //医院id 
            }]
        }

        $http.post('urlS', this, {
            code: "05100129",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {

                    this.setState({
                        jsTypeData: res.data || [], // 数据
                    });
                }
            }
        });
    }
    settlementList = () => {
        var data = {
            params: [{
                "hospID": JSON.parse(window.sessionStorage.userData).hospID || '', //医院id 
            }]
        }

        $http.post('urlS', this, {
            code: "05100097",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {

                    this.setState({
                        settlementData: res.InvStatusArr || [], // 数据
                    });
                }
            }
        });
    }
    // 回车查询登记号
    patNodownE = (e, type) => {
        if (e.keyCode === 13) {
            this.searchUser(type)
            this.dataTableTopData() // 就诊信息
        }
    }


    // 读卡 --- 根据卡号取病人信息
    handleReadCard = (value, event) => {
        let { readModeI, readModeR, cardType } = this.state
        if (event.keyCode) {
            if (readModeI) {
                this.searchUser('cardNo'); // 重新调用查询接口
            }
            return false
        }
        if (readModeR) {
            this.readCard.ReadCard(cardType, "R", (json) => {
                let patNo = json && json.patInfo ? json.patInfo.patNo : ''
                this.setState({ patNo , cardNo: json.cardNo }, () => {

                    //this.searchUser('cardNo'); // 重新调用查询接口
                    if (patNo)
					{
						this.searchUser('patNo'); // 重新调用查询接口
					}else{
						this.searchUser('cardNo'); // 重新调用查询接口
					}
                })
            })
        }

    }

    // 读卡
    searchUser = (type) => {
        var data;
        let { cardType, cardNo, patNo, cardTypeData } = this.state
        if (!type) {   // 查询全部
            data = {
                params: [{
                    "number": patNo || '', // 登记号/身份证号
                    "cardTypeID": cardType,   //卡类型id
                    "cardNo": cardNo,    //卡号
                }]
            }
        }

        if (type === 'patNo') {
            data = {
                params: [{
                    "number": patNo || '', // 登记号/身份证号
                    "cardTypeID": "",   //卡类型id
                    "cardNo": "",    //卡号
                }]
            }

            if (patNo === '') {
                return false
            }
        }

        if (type === 'cardNo') {
            data = {
                params: [{
                    "number": '', // 登记号/身份证号
                    "cardTypeID": cardType || '',     //卡类型id
                    "cardNo": cardNo || '', //卡号
                }]
            }

            if (cardNo === '') {
                return false
            }
            if (cardType === '') {
                message.error('请选择卡类型')
                return false
            }


            let cardTypeFilter = cardTypeData.filter(function (item) {
                return item.id == cardType;
            })

            let zeroLength = cardTypeFilter[0].cardLength

            if (zeroLength && zeroLength != '' && parseFloat(zeroLength) != 0) {
                this.setState({
                    cardNo: ArraySome.addPreZero(cardNo, zeroLength)
                })
                data = {
                    params: [{
                        "number": '', // 登记号/身份证号
                        "cardTypeID": cardType || '',     //卡类型id
                        "cardNo": ArraySome.addPreZero(cardNo, zeroLength) || '', //卡号
                    }]
                }
            }
        }
        $http.post('urlS', this, {
            code: "03040004",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    this.setState({
                        userInfo: res.data || {},  // 用户数据
                        patNo: res.data.patNo || '',  // ID
                    }, () => {

                    });

                }
            }
        });
    }

    // 查询条件 --- 病区
    bqType = (e) => {
        this.setState({ bqType: e }, () => {
            this.BedChange(e)
            this.dataTableTopData();
        });
    }

    // 查询条件 --- 结算
    jsType = (e) => {
        this.setState({ jsType: e });
    }
    settlementType = (e) => {
        console.log(e,"zxz22")
        this.setState({ settlement: e });
    }
    // 查询条件 --- 时间类型
    time1 = (e) => {
        this.setState({ time1: e });
    }

    // 查询条件 --- 结算类型
    chargeStatus = (e) => {
        this.setState({ chargeStatus: e });
    }

    // 查询条件 --- 登记号
    patNo = (e) => {
        this.setState({ patNo: e.target.value });
    }
    // 住院号
    medicalNo = (e) => {
        this.setState({ medicalNo: e.target.value });
    }

    // 查询条件 --- 卡类型·
    cardType = (e) => {
        this.setState({ cardType: e }, () => {
            this.CardTypeChange(e)
        });
    }
    // 查询条件 --- 卡号
    cardNo = (e) => {
        let { readModeI } = this.state
        if (!readModeI) {
            return false
        }
        this.setState({ cardNo: e.target.value });
    }

    // Card
    CardTypeChange = (e) => {
        if (!e) {
            return false
        }
        let { cardTypeData } = this.state
        let readMode = cardTypeData.filter((item, i) => {
            return item.id == e;
        })

        switch (readMode[0] && readMode[0].readMode) {
            // 只可input
            case 'I':
                this.setState({
                    readModeI: true,
                    readModeR: false,
                    cardNo: "",

                })
                break;
            // 只可读卡
            case 'R':
                this.setState({
                    readModeR: true,
                    readModeI: false,
                    cardNo: "",
                })
                break;
            // 皆可
            default:
                this.setState({
                    readModeI: true,
                    readModeR: true,
                    cardNo: "",
                })
                break;
        }

    }

    // 查询条件
    select1 = (e) => {
        this.setState({ select1: e });
    }

    // 查询条件 
    select2 = (e) => {
        this.setState({ select2: e });
    }

    // 查询条件 
    select3 = (e) => {
        this.setState({ select3: e });
    }


    // 查询条件
    nameNo = (e) => {
        this.setState({ nameNo: e.target.value });
    }

    // 回车查询nameNo
    nameNodownE = (e) => {
        if (e.keyCode === 13) {
            this.dataTable1Data()
        }
    }

    // 时间
    onChangeTimeTop = (date, dateString) => {
        this.setState({
            StartDateTop: dateString[0],    //开始日期
            EndDateTop: dateString[1],  //结束日期
        })

    }

    startChange(date) {
        this.setState({
            StartDateTop: date,
        })
    }

    endChange(date) {
        this.setState({
            EndDateTop: date,
        })
    }




    // 时间
    onChangeTime1 = (date, dateString) => {
        this.setState({
            StartDate1: dateString[0],    //开始日期
            EndDate1: dateString[1],  //结束日期
        })

    }

    startChange1(date) {
        this.setState({
            StartDate1: date,
        })
    }

    endChange1(date) {
        this.setState({
            EndDate1: date,
        })
    }
    // // 1.1.52.住院费用明细相关接口
    dataTableTopData = (e) => {
        this.setState({ tableLoading: true, loading: true })
        let { pageSize1, page1, StartDateTop, EndDateTop, time1, bqType, jsType, cardType, cardNo, patNo, chargeStatus, dataTableTop, medicalNo, accType, bednumber,settlement } = this.state
        var data = {
            params: [{
                "number": patNo || '', // 登记号/身份证号
                "cardTypeID": cardType,   //卡类型id
                "cardNo": cardNo,    //卡号
                hospID: JSON.parse(window.sessionStorage.userData).hospID || '', //医院id 
                medicalNo: medicalNo,
                "stopDate": EndDateTop,
                "startDate": StartDateTop,
                "condition": time1,
                "wardID": bqType, //病区
                "payReasonID": jsType,  //费别
                "chargeStatus": chargeStatus,
                "bedID": bednumber,// 床号
               "settlementType":settlement,
                accType
                

            }],
            pagination: [{
                pageSize: pageSize1,
                currentPage: page1,
            }]
        }

        $http.post('urlS', this, {
            code: "05300029",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    let temRecord = {}
                    for (var i = 0; i < res.data.length; i++) {
                        res.data[i].key = i;
                        if (res.data[i].patID == patientData.patID) {
                            patNo = res.data[i].patNo
                            temRecord = res.data[i]
                        }
                    }
                    this.setState({
                        dataTable1: res.data,
                        total1: res.total,
                        payRecordID: "",
                        admID: "",
                        payRecordData: {},
                        tableLoading: false,
                        loading: false
                    });

                } else {
                    this.setState({
                        dataTable1: [],
                        total1: 0,
                        payRecordID: "",
                        admID: "",
                        payRecordData: {},
                        tableLoading: false,
                        loading: false
                    });
                }
            },
            error: () => {
                this.setState({
                    dataTable1: [],
                    total1: 0,
                    payRecordID: "",
                    admID: "",
                    payRecordData: {},
                    tableLoading: false,
                    loading: false
                });
            }
        });

    }
    // 操作行
    onClickRowPublic1 = (record) => {
        return {
            // 单击行选中
            onClick: () => {
                this.setState({ payRecordID: record.payRecordID, admID: record.admID, patNo: record.patNo, payRecordData: record }, () => {
                    this.searchUser('patNo')
                    this.setState({ patNo: '' })
                })

            }
        }
    }
    // 选中行操作
    setRowClassNamePublic1 = (record) => {

        return record.payRecordID === this.state.payRecordID ? 'clickRowStyle' : '';
    }
    //查询床位
    BedChange = (locID) => {
        let data = {
            params: [{
                locID: locID,
            }]
        }
        $http.post('urlS', this, {
            code: "01050021",
            data: data,
            success: function (res) {
                if (+res.errorCode === 0) {
                    this.setState({ bedData: res.result.Data })
                }
            }
        })
    }
    // 选中行操作
    setRowClassNamePublic2 = (record) => {
        return record.execID === this.state.execID ? 'clickRowStyle' : '';
    }
    // 调用公共组件的连接 事 件
    onRef = (ref) => {
        this.child = ref
    }

    hospRef = (ref) => {
        this.onHospRef = ref
    }

    // 显示分页总条数
    showTotal(total) {
        return `共 ${total} 条`;
    }


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

    onChangeTop = (page, pageSize) => {
        this.setState({ pageTop: page, pageSizeTop: pageSize }, () => {
            // 重新调用查询方法
            this.dataTableTopData();
        })
    }

    // 条数改变的回调
    onShowSizeChangeTop = (current, size) => {
        this.setState({ pageTop: 1, pageSizeTop: size }, () => {
            // 重新调用查询方法
            this.dataTableTopData();
        })

    }

    // 页码改变的回调，参数是改变后的页码及每页条
    onChange2 = (page, pageSize) => {
        this.setState({ page2: page, pageSize2: pageSize }, () => {
            // 重新调用查询方法
            this.dataTable2Data();
        })
    }

    // 条数改变的回调
    onShowSizeChange2 = (current, size) => {
        this.setState({ page2: 1, pageSize2: size }, () => {
            // 重新调用查询方法
            this.dataTable2Data();
        })

    }


    // 弹框关闭
    handleCancel = () => {
        this.setState({
            modalShow: false
        })
    }

    // 查询条件 --- 床位
    bednum = (e) => {
        this.setState({ bednumber: e });
    }
    Selectbednum = (e) => {
        this.setState({ bednumber: e }, () => this.dataTableTopData());
    }
    //checkChange
    onSelectChange = (selectedRowKeys, selectedRows) => {
        this.setState({
            selectedRowKeys: selectedRowKeys,
        }, () => {
            this.onClickRowPublic2(selectedRows)
        })

    }

    //确认modal
    rowSelection = () => {
        let { execID } = this.state
        if (execID.length > 0) {
            this.setState({ modalShow: true })
        } else {
            message.warning('请选择执行记录')
        }

    }

    // 切换tabs的回调
    callback = (key) => {
        let { pageSizeTop, pageTop, StartDateTop, EndDateTop, time1, bqType, jsType, cardType, cardNo, patNo, chargeStatus, dataTableTop, medicalNo } = this.state
        this.setState({ activeKey: key });
    }

    getAdmID = () => {
        return this.state.admID;
    }

    // 实际金额录入
    handleAccTypeChange = e => {
        this.setState({ accType: e })
    }

    // 付款记录明细 -- 条数改变的回调
    handleLeftShowSizeChange = (current, size) => {
        this.setState({ page1: 1, pageSize1: size }, () => {
            this.dataTableTopData();
        });
    }

    // 付款记录明细 -- 页码改变的回调
    handleLeftChange = (page, pageSize) => {
        this.setState({ page1:page, pageSize1: pageSize }, () => {
            this.dataTableTopData();
        });
    }

    render() {
        // 组件所需参数
        // const paramTop = {

        //     // 数据总条数
        //     total: this.state.totalTop,
        //     // 数据页数
        //     page: this.state.pageTop,
        // }

        // 组件所需参数
        // const param = {
        //     // 表头配置
        //     columns: this.state.columns1,
        //     // 表格数据
        //     data: this.state.dataTable1,
        //     // 数据总条数
        //     total: this.state.total1,
        //     // 数据页数
        //     page: this.state.page1,
        //     pageSize: '20',
        //     // x: 1600,
        //     //height: 600,
        //     y: store.getState().tableHeight.y + 10 + 'px',
        //     x: 1100,
        //     isOnRow: true,
        //     rowClassName: true
        // }

        // 组件所需参数
        // const param2 = {
        //     // 表头配置
        //     columns: this.state.columnsTop,
        //     // 表格数据
        //     data: this.state.dataTable2,
        //     // 数据总条数
        //     total: this.state.total2,
        //     // 数据页数
        //     page: this.state.page2,
        // }

        // let rowSelection = {
        //     selectedRowKeys: this.state.selectedRowKeys,
        //     onChange: this.onSelectChange,
        // };

        // const components = {
        //     body: {
        //         cell: EditableCell,
        //     },
        // };

        // const columns = this.state.columns1.map(col => {
        //     if (!col.editable) {
        //         return col;
        //     }
        //     return {
        //         ...col,
        //         onCell: record => ({
        //             record,
        //             inputType: col.dataIndex === 'age' ? 'number' : 'text',
        //             dataIndex: col.dataIndex,
        //             title: col.title,
        //             editing: this.isEditing(record),
        //         }),
        //     };
        // });
        let { language, activeKey, widthTotal, total1, loading, page1, dataTable1, tableLoading } = this.state
        return (
            <div style={{ background: '#e8e8e8', height: '100%', overflow: 'hidden' }} className='hospital-zation-express'>
                <ReadCard ref={r => this.readCard = r} />
                {/* <div >
                    <TipHeader userInfo={this.state.userInfo} key={this.state.userInfo.patID} />
                </div> */}
                <Row>
                    <Col span={5}>
                        <Card style={{ width: '100%', padding: '0' }} className='pd0'
                            title={<span><img src={cost_type} style={{ marginRight: 5 }} />{language.HospPayRecodFindvisitrecords && language.HospPayRecodFindvisitrecords.descripts} </span>}>
                            <div style={{ padding: 12, paddingBottom: "32px", position: "relative" }}>
                                <div style={{ lineHeight: '32px', height: "380px", overflow: "auto" }}>
                                    <Row className='mB10'>
                                        <Col span={25}>
                                            <Input.Group>
                                                <Input className='express-input-disable' style={{ width: '35%', textAlign: 'center' }} value={language.HospPayRecodFindPatientinformation && language.HospPayRecodFindPatientinformation.descripts + '：'} disabled />
                                                <Input id='patNo' style={{ width: '64.9%' }} allowClear placeholder={language.HospPayRecodFindPatientinformation && language.HospPayRecodFindPatientinformation.message} className='input' value={this.state.patNo} onChange={(event) => { this.patNo(event) }} onKeyUp={(e) => { this.patNodownE(e, 'patNo'); }} />
                                            </Input.Group>
                                        </Col>
                                    </Row>
                                    <Row className='mB10'>
                                        <Col span={25}>
                                            <Input.Group>
                                                <Input className='express-input-disable' style={{ width: '35%', textAlign: 'center' }} value={language.HospPayRecodFindInpatientNo && language.HospPayRecodFindInpatientNo.descripts + '：'} disabled />
                                                <Input allowClear style={{ width: '64.9%' }} placeholder={language.HospPayRecodFindInpatientNo && language.HospPayRecodFindInpatientNo.message} className='input' value={this.state.medicalNo} onChange={(event) => { this.medicalNo(event) }} onPressEnter={this.dataTableTopData} />
                                            </Input.Group>
                                        </Col>
                                    </Row>
                                    <Row className='mB10'>
                                        <Col span={25}>
                                            <Input.Group>
                                                <Input className='express-input-disable' style={{ width: '35%', textAlign: 'center' }} value={language.HospPayRecodFindVisitingward && language.HospPayRecodFindVisitingward.descripts + '：'} disabled />
                                                <Select className='express-select-border' allowClear style={{ width: '64.9%' }} placeholder={language.HospPayRecodFindVisitingward && language.HospPayRecodFindVisitingward.message} value={this.state.bqType} onChange={(event) => { this.bqType(event) }}  >
                                                    <Option value=''>{language.HospPayRecodFindVisitingward && language.HospPayRecodFindVisitingward.message}</Option>
                                                    {this.state.bqData.map(item => <Option title={item.descripts + '^' + item.descriptsSPCode} key={item.id} value={item.id}  >{item.descripts}</Option>)}
                                                </Select>
                                            </Input.Group>
                                        </Col>
                                    </Row>
                                    <Row className='mB10'>
                                        <Col span={25}>
                                            <Input.Group>
                                                <Input className='express-input-disable' style={{ width: '35%', textAlign: 'center' }} value={language.HospPayRecodFindBednumber && language.HospPayRecodFindBednumber.descripts + '：'} disabled />
                                                <Select className='express-select-border' allowClear showSearch style={{ width: '64.9%' }} placeholder={language.HospPayRecodFindBednumber && language.HospPayRecodFindBednumber.message} value={this.state.bednumber} onChange={(event) => { this.bednum(event) }}
                                                    filterOption={(input, options) => options.props.title.toLowerCase().indexOf(input.toLowerCase()) >= 0} onSelect={this.Selectbednum}>
                                                    {this.state.bedData.map(item => <Option title={item.bedDesc} key={item.bedCBID} value={item.bedCBID}  >{item.bedDesc}</Option>)}
                                                </Select>
                                            </Input.Group>
                                        </Col>
                                    </Row>
                                    <Row className='mB10'>
                                        <Col span={25}>
                                            <Input.Group>
                                                <Input className='express-input-disable' style={{ width: '35%', textAlign: 'center' }} value={language.HospPayRecodFindSettlementtype && language.HospPayRecodFindSettlementtype.descripts + '：'} disabled />
                                                <Select className='express-select-border' allowClear style={{ width: '64.9%' }} placeholder={language.HospPayRecodFindVisitingward && language.HospPayRecodFindVisitingward.message} value={this.state.jsType} onChange={(event) => { this.jsType(event) }}  >
                                                    <Option value=''>{language.HospPayRecodFindVisitingward && language.HospPayRecodFindVisitingward.message}</Option>
                                                    {this.state.jsTypeData.map(item => <Option title={item.descripts + '^' + item.descriptsSPCode} key={item.id} value={item.id}  >{item.descripts}</Option>)}
                                                </Select>
                                            </Input.Group>
                                        </Col>
                                    </Row>
                                    <Row className='mB10'>
                                        <Col span={25}>
                                            <Input.Group>
                                                <Input className='express-input-disable' style={{ width: '35%', textAlign: 'center' }} value={'结算类型：'} disabled />
                                                <Select className='express-select-border' allowClear style={{ width: '64.9%' }} placeholder={language.HospPayRecodFindVisitingward && language.HospPayRecodFindVisitingward.message} value={this.state.accType} onChange={this.handleAccTypeChange}  >
                                                    <Option value='all'>全部</Option>
                                                    <Option value='Y'>是</Option>
                                                    <Option value='N'>否</Option>
                                                </Select>
                                            </Input.Group>
                                        </Col>
                                    </Row>
                                    <Row className='mB10'>
                                        <Col span={25}>
                                            <Input.Group>
                                                <Input className='express-input-disable' style={{ width: '35%', textAlign: 'center' }} value={'结算状态 '} disabled />
                                                <Select className='express-select-border' allowClear style={{ width: '64.9%' }} placeholder={language.HospPayRecodFindVisitingward && language.HospPayRecodFindVisitingward.message} value={this.state.settlement} onChange={(event) => { this.settlementType(event) }}  >
                                                    <Option value=''>{language.HospPayRecodFindVisitingward && language.HospPayRecodFindVisitingward.message}</Option>
                                                    {this.state.settlementData.map(item => <Option title={item.Descripts + '^' + item.descriptsSPCode} key={item.ID} value={item.ID}  >{item.Descripts}</Option>)}
                                                </Select>
                                            </Input.Group>
                                        </Col>
                                    </Row>
                                    <Row className='mB10'>
                                        <Col span={25}>
                                            <Input.Group style={{ display: 'flex' }}>
                                                <div style={{ width: '25%' }}><Select className='express-select-right' style={{ width: '100%' }} allowClear placeholder="请选择时间" value={this.state.time1} onChange={(event) => { this.time1(event) }}  >
                                                    <Option value='1'>收费日期</Option>
                                                    <Option value='2'>入院日期</Option>
                                                    <Option value='3'>出院日期</Option>
                                                </Select></div>
                                                <div><RangeDatePicker className='express-select-border' format='YYYY-MM-DD' style={{ width: '100%' }}
                                                    startChange={this.startChange.bind(this)} endChange={this.endChange.bind(this)} /></div>
                                            </Input.Group>
                                        </Col>
                                    </Row>
                                </div>
                                <Row style={{ textAlign: 'center', position: "absolute", bottom: 0, left: 0, width: "100%" }}>
                                    <Button type='primary' style={{ marginRight: '2px', width: 150 }} onClick={() => this.dataTableTopData()} >{language.HospPayRecodFindquery && language.HospPayRecodFindquery.descripts}</Button>
                                </Row>
                            </div>
                        </Card>
                    </Col>
                    <Col span={19}>
                        <div>
                            <Card style={{ marginTop: 10 }} >
                                <Tabs onChange={this.callback} activeKey={activeKey}  >
                                    <TabPane tab={language.HospPayRecodFindDoctolist && language.HospPayRecodFindDoctolist.descripts} key="0">
                                        <Card style={{ width: '100%', padding: '0', height: store.getState().tableHeight.y + 170 + 'px' }} className='pd0' >
                                            <Row >
                                                <Col span={24}>
                                                    <div style={{ padding: 5 }}>
                                                        <div >
                                                            {/* handelThis将夫组件的属性与方法给子组件访问 */}
                                                            {/* <PubilcTablePagination
                                                                param={param}
                                                                handelThis={this}
                                                                onRef={this.onRef}
                                                                onClickRowPublic={this.onClickRowPublic1}
                                                                setRowClassNamePublic={this.setRowClassNamePublic1}
                                                            /> */}
                                                            {/* <EditableContext.Provider value={this.props.form}> */}
                                                            <div style={{ marginTop: "8px", marginBottom: "12px", textAlign: "right", paddingRight: "26px" }}>
                                                                <Button type="primary" style={{ width: "120px" }} onClick={this.handleSave}>保 存</Button>
                                                            </div>
                                                            <Table
                                                                // components={components}
                                                                style={{height: store.getState().tableHeight.y + 55 + "px" }}
                                                                bordered
                                                                dataSource={dataTable1}
                                                                columns={this.state.columns1}
                                                                scroll={{ x: widthTotal, y: store.getState().tableHeight.y + 10 }}
                                                                className="table-body-height"
                                                                pagination={false}
                                                                loading={tableLoading}
                                                                onRow={this.onClickRowPublic1}
                                                                rowClassName={this.setRowClassNamePublic1}
                                                                onHeaderRow={() => {
                                                                    return {
                                                                        onDoubleClick: () => {
                                                                            this.columnRef.onOpenModel()
                                                                        },
                                                                    };
                                                                }}
                                                            />
                                                            <CommonPagination current={page1} total={total1} search="search" pageSize="20"
                                                                onShowSizeChange={this.handleLeftShowSizeChange} complete={true} dataSource={dataTable1} size='small'
                                                                loading={loading} onChange={this.handleLeftChange} />
                                                            {/* </EditableContext.Provider> */}
                                                        </div>
                                                        <ColumnAuthoritysModel
                                                            clientWidth='900px'
                                                            compontName='HospPayRecodFind'
                                                            configType="C"
                                                            onRef={this.onColumnRef}
                                                            reloadData={this.cloumData}
                                                        />
                                                    </div>
                                                </Col>
                                            </Row>
                                        </Card>
                                    </TabPane>
                                    <TabPane tab="住院费用总清单" key="1">
                                        <Card >
                                            <Row >
                                                <Col span={10}>
                                                    <div >
                                                        <TipHeader userInfo={this.state.userInfo} key={this.state.userInfo.patID + this.state.userInfo.accTSubID} />
                                                    </div>
                                                </Col>
                                                <Col span={14} >
                                                    <Row>
                                                        <Col span={4} style={{ textAlign: 'center', background: '#F7FBFF', marginLeft: 10 }}>
                                                            <div className='payBox'>
                                                                <p className='p2' style={{ color: '#007AFF' }}>￥<span>{this.state.payRecordData.patBillTotalAmt || '0'}</span></p>
                                                                <p>{language.HospPayRecodFindpatBillTotalAmt && language.HospPayRecodFindpatBillTotalAmt.descripts}</p>
                                                            </div>
                                                        </Col>
                                                        <Col span={4} style={{ textAlign: 'center', background: '#F7FBFF', marginLeft: 10 }}>
                                                            <div className='payBox'>
                                                                <p className='p2' style={{ color: '#007AFF' }}>￥<span>{this.state.payRecordData.patBillDiscountAmt || '0'}</span></p>
                                                                <p>{language.HospPayRecodFindDiscount && language.HospPayRecodFindDiscount.descripts}</p>
                                                            </div>
                                                        </Col>
                                                        <Col span={4} style={{ textAlign: 'center', background: '#F7FBFF', marginLeft: 10 }}>
                                                            <div className='payBox'>
                                                                <p className='p2' style={{ color: '#007AFF' }}>￥<span>{this.state.payRecordData.patBillPatAmt || '0'}</span></p>
                                                                <p>{language.HospPayRecodFindPersonalexpense && language.HospPayRecodFindPersonalexpense.descripts}</p>
                                                            </div>
                                                        </Col>
                                                        <Col span={4} style={{ textAlign: 'center', background: '#F7FBFF', marginLeft: 10 }}>
                                                            <div className='payBox'>
                                                                <p className='p2' style={{ color: '#007AFF' }}>￥<span>{this.state.payRecordData.admDeposit || '0'}</span></p>
                                                                <p>{language.HospPayRecodFindDepositvisit && language.HospPayRecodFindDepositvisit.descripts}</p>
                                                            </div>
                                                        </Col>
                                                    </Row>
                                                </Col>
                                            </Row>
                                        </Card>
                                        <ListOfHospitalizationExpenses isPersonalInformation="false" admID={this.state.admID} />
                                    </TabPane>
                                    <TabPane tab="住院押金列表" key="2">
                                        <Card >
                                            <Row >
                                                <Col span={10}>
                                                    <div >
                                                        <TipHeader userInfo={this.state.userInfo} key={this.state.userInfo.patID + this.state.userInfo.accTSubID} />
                                                    </div>
                                                </Col>
                                                <Col span={14} >
                                                    <Row>
                                                        <Col span={4} style={{ textAlign: 'center', background: '#F7FBFF', marginLeft: 10 }}>
                                                            <div className='payBox'>
                                                                <p className='p2' style={{ color: '#007AFF' }}>￥<span>{this.state.payRecordData.patBillTotalAmt || '0'}</span></p>
                                                                <p>{language.HospPayRecodFindpatBillTotalAmt && language.HospPayRecodFindpatBillTotalAmt.descripts}</p>
                                                            </div>
                                                        </Col>
                                                        <Col span={4} style={{ textAlign: 'center', background: '#F7FBFF', marginLeft: 10 }}>
                                                            <div className='payBox'>
                                                                <p className='p2' style={{ color: '#007AFF' }}>￥<span>{this.state.payRecordData.patBillDiscountAmt || '0'}</span></p>
                                                                <p>{language.HospPayRecodFindDiscount && language.HospPayRecodFindDiscount.descripts}</p>
                                                            </div>
                                                        </Col>
                                                        <Col span={4} style={{ textAlign: 'center', background: '#F7FBFF', marginLeft: 10 }}>
                                                            <div className='payBox'>
                                                                <p className='p2' style={{ color: '#007AFF' }}>￥<span>{this.state.payRecordData.patBillPatAmt || '0'}</span></p>
                                                                <p>{language.HospPayRecodFindPersonalexpense && language.HospPayRecodFindPersonalexpense.descripts}</p>
                                                            </div>
                                                        </Col>
                                                        <Col span={4} style={{ textAlign: 'center', background: '#F7FBFF', marginLeft: 10 }}>
                                                            <div className='payBox'>
                                                                <p className='p2' style={{ color: '#007AFF' }}>￥<span>{this.state.payRecordData.admDeposit || '0'}</span></p>
                                                                <p>{language.HospPayRecodFindDepositvisit && language.HospPayRecodFindDepositvisit.descripts}</p>
                                                            </div>
                                                        </Col>
                                                    </Row>
                                                </Col>
                                            </Row>
                                        </Card>
                                        <AccDeposit isPersonalInformation="false" admID={this.state.admID} />
                                    </TabPane>
                                    {/*<TabPane tab="住院费用日清单" key="2">
                                        <OneDayHospitalizationExpenses onRef={this.hospRef} />
                                    </TabPane>
                                    <TabPane tab="押金催款单" key="3">
                                        <Depositpayment />
                                    </TabPane>
                                   */}
                                </Tabs>
                            </Card>
                        </div>
                    </Col>
                </Row>
            </div >


        )
    }
}
const HospPayRecodFindForm = Form.create()(HospPayRecodFind);
export default HospPayRecodFindForm;