//住院收费未结算
import React from 'react'
import { DatePicker, Table, Button, Row, Col, Select, Card } from 'antd'
import moment from 'moment';
import { $http } from '../../../containers/config/https'
const { Option } = Select;
import store from '../../../store';
import CommonPagination from '../../../components/pagination/index';
import ColumnAuthoritysModel from '../../../pages/columnAuthority/ColumnAuthoritysModel';
import '../style/index.less';

export default class OutpatientSettlement extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            startDate: moment(new Date),
            endDate: moment(new Date),
            user: [],
            userID: JSON.parse(window.sessionStorage.userData).userID,
            tableData: [],
            showLoading: true,
            total: 0,
            page: 1,
            pageSize: 50,
            ColumnAuthority: '',
            columns: [], //表格列表
            languageTable1: {}, // 国际化Table1
            languageTable2: {}, // 国际化Table2
            languageData: {}, // 国际化语言包
            language: {},   // 国际化语言
            languageCode: JSON.parse(window.sessionStorage.userData).language, // 国际化语言标识
        }

    }

    //初始化数据
    componentDidMount() {
        this.tableList("InvHospitalizedSettlement", "InvHospitalizedSettlement");
        this.handleQuery()
    }

    //基础数据
    handleQuery = () => {
        let { startDate, endDate, page, pageSize } = this.state;
        let data = {}
        data = {
            params: [{
                "startDate": startDate,
                "endDate": endDate,
                "hospID": JSON.parse(window.sessionStorage.userData).hospID,
            }],
            pagination: [{
                pageSize: pageSize,
                currentPage: page,
                sortColumn: 'code',
                sortOrder: 'asc'
            }]
        }
        $http.post('urlDeanlt', this, {
            code: '05100157',
            data: data,
            success: function (res) {
                if (+res.errorCode === 0 && res.result) {
                    for (var i = 0; i < res.result.length; i++) {
                        res.result[i].key = i;
                    }
                    this.setState({ tableData: res.result.SettlementArr, total: res.result.TotalCount, loading: false })
                } else {
                    this.setState({ tableData: [], total: 0, loading: false })
                }
            }
        })
    }
    // 获取主列表columns
    tableList = (reactCode, compontName) => {
        var data = {
            params: [{
                "reactCode": [reactCode],
                "compontName": compontName,
                "type": "C"

            }]
        }
        $http.post('urlS', this, {
            code: '01040073',
            data: data,
            success: function (res) {
                if (+res.errorCode === 0) {
                    let resC = res.result.C
                    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
                        })
                    }
                    let arr = res.result && resC.length > 0 ? JSON.parse(JSON.stringify(resC)).map(item => {
                        return {
                            align: item.align,
                            widthNum: parseInt(item.width),
                            width: item.width,
                            dataIndex: item.dataIndex,
                            title: <div onDoubleClick={this.setState({ ColumnAuthority: compontName }), () => this.columnRef.onOpenModel()}>{item.title}</div>,
                            display: item.display,
                            key: item.seqNo,
                        }
                    }) : '';

                    let filterArr = arr.filter(function (item) { return item.display === 'Y' });
                    this.setState({
                        columns: filterArr,
                        languageTable1: res.result.B || {},  // 国际化Table1
                        languageTable2: res.result.C || {},  // 国际化Table2
                        languageData: res.result.language || {},  // 国际化语言包
                    }, () => {
                        this.LanCNEN(this.state.languageCode)
                        //   this.listAdd(filterArr.length+1, 0,languageCode);
                    })
                }
            }
        })
    }
    LanCNEN = (code) => {
        let { languageData } = this.state
        this.setState({
            language: languageData[code]
        })
    }
    onColumnRef = (ref) => {
        this.columnRef = ref;
    }
    // 调用公共组件的连接事件
    onRef = (ref) => {
        this.child = ref
    }

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

    // 查询条件 --- 开始日期
    onChangeStartDate = (e) => {
        this.setState({ startDate: e });
    }
    //查询条件 --- 结束日期
    onChangeEndDate = (e) => {
        this.setState({ endDate: e });
    }
    // 提供修改page和pageSize的回调函数
    compilePage(page, pageSize) {
        // 修改page，或者pageSize
        this.setState({ page: page, pageSize: pageSize }, () => {
            // 重新调用查询方法
            this.handleQuery();
        })
    }
    // 显示分页总条数
    showTotal(total) {
        return `共 ${total} 条`;
    }
    // 条数改变的回调
    onShowSizeChange = (current, size) => {
        this.compilePage(1, size);
    }
    // 页码改变的回调，参数是改变后的页码及每页条
    onChange = (page, pageSize) => {
        this.compilePage(page, pageSize);
    }
    render() {
        let { language } = this.state
        return (
            <div style={{ width: '100%', height: '100%', background: '#F5F7FE' }} className='hosptial-adm-body'>
                <Card bodyStyle={{ padding: '10px' }}>
                    <Col span={4} className='common-col-ul'>
                        <span className='common-span-ui'>{language.InvHospitalizedSettlementstartDate && language.InvHospitalizedSettlementstartDate.descripts}：</span>
                        <DatePicker format="YYYY-MM-DD" style={{ marginRight: '20px' }} value={this.state.startDate} onChange={this.onChangeStartDate} />
                    </Col>
                    <Col span={4} className='common-col-ul'>
                        <span className='common-span-ui'>{language.InvHospitalizedSettlementendDate && language.InvHospitalizedSettlementendDate.descripts}：</span>
                        <DatePicker format="YYYY-MM-DD" style={{ marginRight: '20px' }} value={this.state.endDate} onChange={this.onChangeEndDate} />
                    </Col>

                    <Col span={4}>
                        <Button style={{ marginRight: '20px' }} type='primary' onClick={this.handleQuery}>{language.InvHospitalizedSettlementhandleQuery && language.InvHospitalizedSettlementhandleQuery.descripts}</Button>
                        <Button>{language.InvHospitalizedSettlementExport && language.InvHospitalizedSettlementExport.descripts}</Button>
                    </Col>
                    {/* <Row style={{ minHeight: '80px', padding: '0 24px' }}>
                        <Col span={18} style={{ marginTop: '24px' }}>
                            {language.InvHospitalizedSettlementstartDate && language.InvHospitalizedSettlementstartDate.descripts}：
                            <DatePicker format="YYYY-MM-DD" style={{ marginRight: '20px' }} value={this.state.startDate} onChange={this.onChangeStartDate} />
                            {language.InvHospitalizedSettlementendDate && language.InvHospitalizedSettlementendDate.descripts}：
                            <DatePicker format="YYYY-MM-DD" style={{ marginRight: '20px' }} value={this.state.endDate} onChange={this.onChangeEndDate} />
                            <Button style={{ marginRight: '20px' }} onClick={this.handleQuery}>{language.InvHospitalizedSettlementhandleQuery && language.InvHospitalizedSettlementhandleQuery.descripts}</Button>
                            <Button>{language.InvHospitalizedSettlementExport && language.InvHospitalizedSettlementExport.descripts}</Button>
                        </Col>
                    </Row> */}
                </Card>

                <Card style={{ marginTop: 10 }} bodyStyle={{ padding: '10px' }}>
                    <Table
                        style={{ height: store.getState().tableHeight.y + 110 + 'px' }}
                        scroll={{ x: 900, y: store.getState().tableHeight.y + 110 }}
                        dataSource={this.state.tableData}
                        columns={this.state.columns}
                        className='TableA'
                        pagination={false}
                        // scroll={{ x: 900, y: store.getState().tableHeight.y }}
                        bordered
                        loading={this.state.loading}
                    />
                    <CommonPagination size="small" current={this.state.page} total={this.state.total} search='search'
                        onShowSizeChange={this.apponShowSizeChange} complete={true} dataSource={this.state.tableData}
                        onChange={this.appPageChange} />
                    <ColumnAuthoritysModel
                        clientWidth='900px'
                        compontName='InvHospitalizedSettlement'
                        configType="C"
                        onRef={this.onColumnRef}
                        reloadData={() => { this.tableList("InvHospitalizedSettlement") }}
                    />
                </Card>
            </div>
        )
    }
}