/*
 * Creator:     ML
 * CreatDate:   2020-02-28
 * descripts：  抗菌药物列表 搜索 数据列表 
 * */
import React from 'react';
import {
    Card, Table, Input, Form, Select, Row, Col, Pagination, Tabs,
    DatePicker, Button, Popconfirm, Icon, Divider, message, Modal, Tooltip,
} from 'antd';
import { Util, dayFormat } from 'tools/index';
import { $http } from 'containers/config/https';
import CommonPagination from 'components/pagination/index';
import { PAGE_NUM_MORE_STATUS } from 'tools/statusConstants';
import ColumnAuthoritysModel from 'pages/columnAuthority/ColumnAuthoritysModel';
import store from 'store'
import moment from 'moment';
// import '../style/index.less';

const { RangePicker } = DatePicker;
const Search = Input.Search;
const Option = Select.Option;
const TabPane = Tabs.TabPane;
const confirm = Modal.confirm;

class AntimicrobialListSearch extends React.Component {
    constructor(props) {
        super(props)
        var userData = JSON.parse(sessionStorage.getItem('userData'))
        this.state = {
            dataSource: [],
            total: 0,
            page: 1,
            pageSize: 10,
            userData: userData,
            size: 'small',
        }
    }

    componentDidMount() {
        this.getMainTableColumns()
        this.loadData(1)
        document.querySelector('.list-dom .ant-table-body').style.height = store.getState().tableHeight.y + 80 + 'px';
    }
    //动态表头
    onColumnRef = (ref) => {
        this.columnRef = ref;
    }
    // 获取主列表columns
    getMainTableColumns = () => {
        let data = {
            params: [{
                compontName: "AntibioticMedItem",
                reactCode: ['AntibioticMedItem'],
                type: 'C',
            }]
        }
        $http.post('urlS', this, {
            code: '01040073',
            data: data,
            success: function (res) {
                if (+res.errorCode === 0) {
                    let arr = res.result && res.result.C.length > 0 ? JSON.parse(JSON.stringify(res.result.C)).map(item => {
                        return {
                            align: item.align,
                            widthNum: parseInt(item.width),
                            width: item.width,
                            dataIndex: item.dataIndex,
                            title: <div onDoubleClick={() => this.columnRef.onOpenModel()}>{item.title}</div>,
                            display: item.display,
                            key: item.seqNo,
                        }
                    }) : '';
                    let filterArr = arr.filter(function (item) { return item.display === 'Y' });
                    // let seq = {
                    //     key: 1,
                    //     title: '序号',
                    //     dataIndex: 'key',
                    //     align: "center",
                    //     width: 50,
                    //     render: (text, record, index) => {
                    //         return this.state.tableData.findIndex((value, index) => {
                    //             return value === record;
                    //         }) + 1;
                    //     }
                    // }
                    // let seqArr = {
                    //     title: '操作',
                    //     key: 7,
                    //     align: "center",
                    //     width: 130,
                    //     display: "Y",
                    //     render: (text, record) => (
                    //         <span>
                    //             <Icon type="edit" style={{ color: '#108EE9' }}></Icon>
                    //             <span className='span' onClick={() => this.handleCompile(record)}>编辑</span>
                    //             {/* 分割线 */}
                    //             <Divider type="vertical" />
                    //             <Icon type="delete" style={{ color: 'rgba(240,65,52,1)' }}></Icon>
                    //             <Popconfirm title="删除不可恢复，你确定要删除吗?" onConfirm={() => this.handleDelete(record)} >
                    //                 <span className='span' style={{ color: 'rgba(240,65,52,1)' }}>删除</span>
                    //             </Popconfirm>
                    //         </span>
                    //     ),
                    // }
                    // filterArr.unshift(seq)
                    this.setState({ columns: filterArr, widthTotal: res.totalWidth })
                    // console.log("res.totalWidth",res.totalWidth)
                }
            }
        })
    }
    loadData(page, pageSize, e) {
        var params = {
            params: [{
                number: this.state.unionValue,
            }],
            pagination: [{
                pageSize: this.state.size == 'small' ? this.state.pageSize : PAGE_NUM_MORE_STATUS[0].code,
                currentPage: page
            }]

        }
        $http.post('urlDeault', this, {
            code: "03050204",
            data: params,
            success: function (res) {
                if (res.errorCode == '0') {
                    this.setState({
                        dataSource: res.result.data,
                        total: res.result.totalCount,
                        search: e,
                        loading: false
                    })
                }
            }
        });
    }

    onKeyDownLoadData(e) {
        if (e.keyCode == '13') {
            this.loadDatas()
        }
    }
    loadDatas=()=>{
        // this.setState({
        //     medID:"",
        // })
        this.loadData(1)
    }

    //点击行，渲染当前行样式
    onClickRow = (record) => {
        return {
            onClick: () => {
                this.setState({
                    medID: record.medItemID,
                })
                this.loadDetailData(record.medItemID)
                //将行数据传给父，供其他组件使用
                var { loadCommonMedId } = this.props;
                loadCommonMedId && loadCommonMedId(record)
            },
            onDoubleClick: () => {
            }
        };
    }

    clearInput() {
        this.setState({
            medID: '',
            record: ''
        })
    }

    //点击行，渲染当前行样式 
    setRowClassName = (record) => {
        return record.medItemID === this.state.medID ? 'clickRowStyle' : '';
    }

    loadDetailData(id) {
        var params = {
            params: [{ medID: id }]
        }
        $http.post('urlDeault', this, {
            code: "02020012",
            data: params,
            success: function (res) {
                if (res.errorCode == '0') {
                    var { loadDetailMsg } = this.props;
                    loadDetailMsg && loadDetailMsg(res.result)
                }
            }
        });
    }

    //分页切换
    onChange(e) {
        this.setState({ page: e }, () => {
            this.loadData(e);
        });
    }

    //分页切换
    changePageSize(current, pageSize) {
        this.setState({ pageSize: pageSize, page: current }, () => {
            this.loadData(current, pageSize, 'search');
        });
    }

    render() {
        var { subCat, status } = this.state;
        return <div className='common-order-list-body'>
            <div style={{ display: 'flex' }}>
                <Input placeholder='代码/描述回车查询' style={{ width: 180 }} onChange={Util.commonInputChange.bind(this, 'unionValue')}
                    onKeyDown={this.onKeyDownLoadData.bind(this)} />
                <Button type='primary' style={{ marginLeft: 10 }} onClick={this.loadDatas.bind(this, '1')}>查询</Button>
            </div>
            <div className="list-dom">
            <Table columns={this.state.columns} dataSource={this.state.dataSource}
                            style={{ marginTop: 10, height: store.getState().tableHeight.y + 80 + 'px' }}
                            loadData={this.loadData.bind(this)}
                            onRow={this.onClickRow}
                            rowClassName={this.setRowClassName}
                            rowKey={(data) => {
                                return data.medID
                            }}
                            scroll={{ x: 800 }}
                            pagination={false}>
                        </Table>
            </div>
            {/* <Pagination
                size="small"
                showQuickJumper
                showSizeChanger
                defaultCurrent={1}
                current={this.state.page}
                total={this.state.total}
                onShowSizeChange={this.changePageSize.bind(this)}
                onChange={this.onChange.bind(this)}
                style={{ textAlign: "right", marginTop: '13px' }}
            /> */}
            <CommonPagination size={this.state.size} current={this.state.page} total={this.state.total} search={this.state.search}
                onShowSizeChange={this.changePageSize.bind(this)} complete={false} dataSource={this.state.dataSource}
                loading={this.state.loading} onChange={this.onChange.bind(this)} />
            <ColumnAuthoritysModel
                clientWidth='800px'
                compontName='AntibioticMedItem'
                configType="C"
                onRef={this.onColumnRef}
                reloadData={this.getMainTableColumns}
            />
        </div>
    }

}
export default AntimicrobialListSearch;