//押金催款单打印
import React from 'react'
import { Table, Button, Row, Col, Input, Select, message, Card } from 'antd';
import { $loadTemplate } from '../../lodop/Common/Print';
import { $http } from '../../../containers/config/https';
import store from '../../../store';
// import '../charges/style/style.less';
import ColumnAuthoritysModel from 'pages/columnAuthority/ColumnAuthoritysModel';
import CommonPagination from 'components/pagination/index';
import '../style/index.less';
const { Option } = Select;
let sessionData;
export default class OPDepositpayment extends React.Component {
    constructor(props) {
        super(props)
        sessionData = window.sessionStorage.userData ? JSON.parse(window.sessionStorage.userData) : {}
        this.state = {
            data: [],
            AdmReasonArr: [],
            LocArr: [],
            wardID: undefined,
            patID: '',
            admReasonID: undefined,
            balance: '',
            // 表格数据
            tableData: [],
            showLoading: true,
            // 表格数据总条数
            total: 0,
            page: 1,
            pageSize: 50,
            columns: [],
            languageTable1: {}, // 国际化Table1
            languageTable2: {}, // 国际化Table2
            languageData: {}, // 国际化语言包
            language: {},   // 国际化语言
            languageCode: JSON.parse(window.sessionStorage.userData).language, // 国际化语言标识
            selectedRows: [],

        }
    }

    //初始化数据
    componentDidMount() {
        this.tableList();
        //this.child.handleLoading()
        //病区下拉框
        this.getAdmReasonData()
        //费别下拉框
        this.getLocData()
        this.handleQuery()
    }
    onColumnRef = (ref) => {
        this.columnRef = ref;
    }
    // 获取主列表columns
    tableList = (reactCode, compontName) => {
        var data = {
            params: [{
                "reactCode": ["OPDepositpayment"],
                "compontName": "OPDepositpayment",
                "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.columnRef.onOpenModel()}>{item.title}</div>,
                            display: item.display,
                            key: item.seqNo,
                            render: (text, record) => {
                                 return (<span style={{ color: ((record.balance)&&(record.admReasonCode)) &&((record.balance<0)&&(record.admReasonCode=='ZF'))?'red':''}}>{text}</span>)
                            }
                        }
                    }) : '';
                    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)
                    })
                }
            }
        })
    }

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

    //基础数据
    handleQuery = () => {
        let { wardID, patID, admReasonID, balance, page, pageSize } = this.state;
        let data = {}
        data = {
            params: [{
                "wardID": wardID,
                "patID": patID,
                "admReasonID": admReasonID || '',
                "balance": balance
            }],
            pagination: [{
                pageSize: pageSize,
                currentPage: page,
                sortColumn: 'code',
                sortOrder: 'asc'
            }]
        }
        $http.post('urlS', this, {
            code: '05100151',
            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.Data, total: res.result.TotalCount, loading: false })
                } else {
                    this.setState({ tableData: [], total: 0, loading: false })
                }
            }
        })
    }

    //费别下拉框
    getAdmReasonData = () => {
        $http.post("urlS", this, {
            code: '05100129',
            data: {
                params: [{
                    "hospID": JSON.parse(window.sessionStorage.userData).hospID, //医院id 
                }]
            },
            success: function (res) {
                if (+res.errorCode === 0) {
                    this.setState({ AdmReasonArr: res.data })
                }
            }
        })
    }

    //病区下拉框
    getLocData = () => {
        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({
                        LocArr: 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({
                                wardID: res.result.Data[i].id
                            })
                        }

                    }
                }
            }
        });
    }

    // 查询条件 --- 病区
    onChangeWardID = (e) => {
        this.setState({ wardID: e }, () => this.handleQuery());
    }
    // 查询条件 --- 病人ID
    onChangePatID = (e) => {
        this.setState({ patID: e.target.value });
    }
    // 查询条件 --- 费别
    onChangeAdmReasonID = (e) => {
        this.setState({ admReasonID: e });
    }
    // 查询条件 --- 金额
    onChangeBalance = (e) => {
        this.setState({ balance: e.target.value });
    }
    // 调用公共组件的连接事件
    onRef = (ref) => {
        this.child = ref
    }
    // 提供修改page和pageSize的回调函数 
    compilePage(page, pageSize) {
        // 修改page，或者pageSize
        this.setState({ page: page, pageSize: pageSize }, () => {
            // 重新调用查询方法
            this.handleQuery();
        })
    }
    PrintXYPrescButtom = () => {
        if (this.state.selectedRows.length > 0) {
            for (var i = 0; i < this.state.selectedRows.length; i++) {
                this.PrintXYPresc(this.state.selectedRows[i]);
            }
        } else {
            message.error('请选择打印数据')
        }
    }
    //打印催款单
    PrintXYPresc = (val) => {
        let data = {
            params: [{
                "name": val.name,
                "advanceAmt": val.payAmtAll,
                "usedAmt": val.patAmtAll,
                "balance": val.balance,
                "admID": val.ID
            }]
        }
        $http.post('urlS', this, {
            code: "05100705",
            data: data,
            success: function (res) {
                if (res.errorCode === '0') {
                    //加载模板
                    $loadTemplate("YJCKD", res.result[0].printStr);
                }
            }
        })
    }

    // table行样式
    setRowClassNameSelect = (record) => {
        let config = {
            '完全': 'aclCodeW',
            '部分': 'aclCodeB',
            '预警': 'aclCodeY',
        }
        return config[record.aclCode];
        // return record.admID === this.state.selecteId ? 'redTable' : '';
    }


    selectRowKeys(selectedRowKeys, selectedRows) {
        this.setState({
            selectedRowKeys: selectedRowKeys,
            selectedRows: selectedRows
        })
    }

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

    // 条数改变的回调
    apponShowSizeChange = (current, size) => {
        this.setState({
            page: current,
            pageSize: size,
        }, () => {
            // 重新调用查询方法
            this.handleQuery();
        });
    }
    render() {
        let { AdmReasonArr, LocArr, language } = this.state;
        // 费别
        let admReason = AdmReasonArr && AdmReasonArr.map((item, index) => {
            return (<Option key={index} title={item.descripts} value={item.id}>{item.descripts}</Option>)
        })
        let loc = LocArr && LocArr.map((item, index) => {
            return (<Option key={index} title={item.descripts + '^' + item.descriptsSPCode} key={item.id} value={item.id}  >{item.descripts}</Option>)
        })
        const rowSelection = {
            onChange: (selectedRowKeys, selectedRows) => {
                this.setState({ selectedRows })
            },
        };
        return (
            <div style={{ width: '100%', height: '100%', background: '#F5F7FE' }} className='hosptial-adm-body'>
                <Card className="department-header" bodyStyle={{ padding: '10px' }}>
                    <Col span={4} className='common-col-ul'>
                        <span className='common-span-ui'>{language.OPDepositpaymentward && language.OPDepositpaymentward.descripts}：</span>
                        <Select className='common-right-ui' placeholder={language.OPDepositpaymentward && language.OPDepositpaymentward.message} value={this.state.wardID} onChange={this.onChangeWardID} style={{ width: '150px' }}>{loc}</Select>
                    </Col>
                    <Col span={4} className='common-col-ul'>
                        <span className='common-span-ui'>{language.OPDepositpaymentpatNo && language.OPDepositpaymentpatNo.descripts}：</span>
                        <Input value={this.state.patID} onChange={this.onChangePatID} style={{ width: '150px' }} />
                    </Col>
                    <Col span={4} className='common-col-ul'>
                        <span className='common-span-ui'>{language.OPDepositpaymentadmReasonDesc && language.OPDepositpaymentadmReasonDesc.descripts}：</span>
                        <Select className='common-right-ui' allowClear placeholder={language.OPDepositpaymentadmReasonDesc && language.OPDepositpaymentadmReasonDesc.message} value={this.state.admReasonID} onChange={this.onChangeAdmReasonID} style={{ width: '150px' }}>{admReason}</Select>
                    </Col>
                    <Col span={4} className='common-col-ul'>
                        <span className='common-span-ui'>{language.OPDepositpaymentlessThanAmount && language.OPDepositpaymentlessThanAmount.descripts}：</span>
                        <Input value={this.state.balance} onChange={this.onChangeBalance} style={{ width: '150px' }} />
                    </Col>
                    <Col span={1}>
                        <Button style={{ marginRight: '20px' }} type="primary" onClick={this.handleQuery}>{language.OPDepositpaymentquery && language.OPDepositpaymentquery.descripts}</Button>
                    </Col>
                    <Col span={1}>
                        <Button onClick={this.PrintXYPrescButtom}>打印</Button>
                    </Col>
                </Card>

                <Card style={{ marginTop: 10 }} bodyStyle={{ padding: '10px' }}>
                    <Table
                        scroll={{ y: store.getState().tableHeight.y - 10, x: 1100 }}
                        dataSource={this.state.tableData}
                        columns={this.state.columns}
                        pagination={false}
                        bordered
                        rowSelection={rowSelection}
                        rowClassName={this.setRowClassNameSelect}
                        className="table-body-height"
                        rowKey={(data) => {
                            return data.id
                        }}
                    />
                    <CommonPagination size="large" 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='OPDepositpayment'
                        configType="C"
                        onRef={this.onColumnRef}
                        reloadData={this.tableList}
                    />

                </Card>
            </div>
        )
    }
}