// 物资入库制单明细录入列表
import React from 'react';
import { Card, Row, Col, Form, Icon, Table, Button, DatePicker, Select, Input, message, Popconfirm } from 'antd';
import ColumnAuthoritysModel from 'pages/columnAuthority/ColumnAuthoritysModel';
import { $http } from 'containers/config/https';
import store from 'store';
import Moment from 'moment';
import '../style/index.less';
import FormModalData from './../../../common/FormModalData';
import { Resizable } from 'react-resizable';
import { handleExcel } from 'tools/handleExcel.js';

const ResizeableTitle = props => {
    const { onResize, width, ...restProps } = props;

    if (!width) {
        return <th {...restProps} />;
    }

    return (
        <Resizable
            width={width}
            height={0}
            onResize={onResize}
            draggableOpts={{ enableUserSelectHack: false }}
        >
            <th {...restProps} />
        </Resizable>
    );
};
const { Option } = Select;
const { TextArea } = Input;
const DetailEntryList = Form.create()(
    class extends React.Component {
        constructor() {
            super();
            this.state = {
                show: false,
                unitData: [], // 单位下拉框数据
                modalData: [], // 弹框列表数据
                ModalRowData: {}, // 弹框双击选中行数据
                data: [], // 列表数据
                detailInfo: [], // 入库制单回显至明细列表数据
                stockID: '', // 回显的描述id
                rowId: "", // 药品名称模态框选中行ID
                mainInfo: [],
                columns: [],
                modificationList: false,  //默认隐藏修改表头弹窗
                detailWidthTotal: '',
                rowKey: '',
                userInfo: {},
                SelectData: {},
                inOperLocID: '',
                stkCatID: '',
                language: JSON.parse(window.sessionStorage.userData),
                ChineseEnglishSize: {},
                modalColumns: [],
                parameterCode: '',
                modalColumnsWidth: '',
                rpTotal: 0, //进价金额总和
                spTotal: 0, //售价金额总和
            };
            this.columns = [
                {
                    key: 1,
                    title: '药品代码',
                    dataIndex: 'stockCode',
                    align: "center",
                    width: '150px'
                },
                {
                    key: 2,
                    title: '药品名称',
                    dataIndex: 'stockDesc',
                    align: "center",
                    width: '300px',
                },
                {
                    key: 3,
                    title: '包装规格',
                    dataIndex: 'stockSpec',
                    align: "center",
                    width: '150px',
                },
                {
                    key: 5,
                    title: '生产厂家',
                    dataIndex: 'manfDesc',
                    align: "center",
                    width: '300px',
                },
                {
                    key: 6,
                    title: '批号',
                    dataIndex: 'batNo',
                    align: "center",
                    width: '150px',
                },
                {
                    key: 7,
                    title: '剂型',
                    dataIndex: 'formDesc',
                    align: "center",
                    width: '150px',
                },
                {
                    key: 8,
                    title: '数量',
                    dataIndex: 'qty',
                    align: "center",
                    width: '100px',
                },
                {
                    key: 9,
                    title: '单位',
                    dataIndex: 'unitDesc',
                    align: "center",
                    width: '100px',
                },
                {
                    key: 10,
                    title: '进价',
                    dataIndex: 'rp',
                    align: "center",
                    width: '100px',
                },
                {
                    key: 11,
                    title: '售价',
                    dataIndex: 'sp',
                    align: "center",
                    width: '100px',
                },
                {
                    key: 12,
                    title: '发票号',
                    dataIndex: 'invNo',
                    align: "center",
                    width: '100px',
                },
                {
                    key: 13,
                    title: '发票日期',
                    dataIndex: 'invDate',
                    align: "center",
                    width: '100px',
                },
                {
                    key: 14,
                    title: '发票金额',
                    dataIndex: 'invAmt',
                    align: "center",
                    width: '100px',
                },
                {
                    key: 15,
                    title: '进价金额',
                    dataIndex: 'rpAmt',
                    align: "center",
                    width: '100px',
                },
                {
                    key: 16,
                    title: '售价金额',
                    dataIndex: 'spAmt',
                    align: "center",
                    width: '100px',
                }, {
                    title: '操作',
                    key: 17,
                    fixed: 'right',
                    align: "center",
                    width: '100px',
                    render: (text, record) => (
                        <span>
                            <Popconfirm title='删除不可恢复，你确定要删除吗?' onCancel={this.handlePopconfirm} onConfirm={(e) => this.handleDelete(record, e)} onClick={this.handlePopconfirm} >
                                <span className='span' style={{ color: 'rgba(240,65,52,1)' }}>删除</span>
                            </Popconfirm>
                        </span>
                    ),
                }
            ];
            this.modalColumns = [
                {
                    key: 1,
                    title: '库存项代码',
                    dataIndex: 'stockCode',
                    align: "center",
                    width: '22%'
                },
                {
                    key: 2,
                    title: '库存项描述',
                    dataIndex: 'stockDesc',
                    align: "center",
                    width: '24%',
                },
                {
                    key: 5,
                    title: '库存分类',
                    dataIndex: 'stkSubCatDesc',
                    align: "center",
                    width: '16%',
                },
                {
                    key: 3,
                    title: '包装规格',
                    dataIndex: 'stockSpec',
                    align: "center",
                    width: '12%',
                },
                {
                    key: 6,
                    title: '基本单位',
                    dataIndex: 'baseUnitDesc',
                    align: "center",
                    width: '12%',
                },
                {
                    key: 7,
                    title: '入库单位',
                    dataIndex: 'purUnitDesc',
                    align: "center",
                }
            ];
            this.myRef1 = React.createRef();
            this.myRef2 = React.createRef();
            this.myRef3 = React.createRef();
            this.myRef4 = React.createRef();
            this.myRef5 = React.createRef();
            this.myRef6 = React.createRef();
            this.myRef7 = React.createRef();
            this.myRef8 = React.createRef();
            this.myRef9 = React.createRef();
            this.myRef10 = React.createRef();
            this.myRef11 = React.createRef();
            this.myRef12 = React.createRef();
            this.myRef13 = React.createRef();
            this.myRef14 = React.createRef();
        }
        components = {
            header: {
                cell: ResizeableTitle,
            },
        };
        componentDidMount() {
            this.props.onRef(this);
            this.getDetailTableColumns();
            this.getTableColumns();
            let listData = document.querySelectorAll('.WadetailsHeight  .ant-table-body');
            if (listData.length > 0) {
                listData[0].style.height = store.getState().tableHeight.y - 55 + 'px';
            }
        }

        componentWillReceiveProps(props) {
            this.setState({
                SelectData: props.SelectData,
                inOperLocID: props.inOperLocID,
                stkCatID: props.stkCatID,
            })
            if (props.detailInfo !== this.state.detailInfo) {
                let arr = [...props.detailInfo];
                this.setState({ data: arr, detailInfo: props.detailInfo, mainInfo: props.mainInfo }, () => {
                    let spNum = 0;
                    let rpNum = 0;
                    for (var f = 0; f < arr.length; f++) {
                        spNum = +arr[f].spAmt + spNum;
                        rpNum = +arr[f].rpAmt + rpNum;
                    }
                    this.setState({ rpTotal: rpNum.toFixed(2), spTotal: spNum.toFixed(2) })
                });
            }
        }


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

        // 获取明系列表头数据
        getDetailTableColumns = () => {
            let { language } = this.state;
            let data = {
                params: [{
                    reactCode: ['MaterialStorageOrderMaking'],
                    compontName: 'MaterialWarehouseList',
                    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.setState({ parameterCode: 'MaterialWarehouseList' }, () => {
                                        this.columnRef.onOpenModel();
                                    })
                                }}>{language.language == 'EN' ? item.enDescripts : item.title}</div>,
                                ellipsis: true
                            }
                        }) : '';
                        let filterArr = arr.filter(function (item) { return item.display === 'Y' });
                        let obj = {
                            title: language.language == 'EN' ? 'Operation' : '操作',
                            key: 170,
                            fixed: 'right',
                            align: "center",
                            width: '100px',
                            render: (text, record) => (
                                <span>
                                    <Popconfirm title={language.language == 'EN' ? 'Delete can not be restored, are you sure you want to delete it?' : '删除不可恢复，你确定要删除吗?'} onCancel={this.handlePopconfirm} onConfirm={(e) => this.handleDelete(record, e)} onClick={this.handlePopconfirm} >
                                        <span className='span' style={{ color: 'rgba(240,65,52,1)' }}>{language.language == 'EN' ? 'Delete' : '删除'}</span>
                                    </Popconfirm>
                                </span>
                            ),
                        };
                        filterArr.push(obj);
                        this.setState({ columns: filterArr, detailWidthTotal: res.totalWidth, ChineseEnglishSize: language.language == 'EN' ? res.result.language.EN : res.result.language.CN }, () => {
                            this.props.handleThis.getDetailTableColumns(this.state.ChineseEnglishSize)
                        })
                    }
                }
            })
        };

        // 获取columns
        getTableColumns = () => {
            let { language } = this.state;
            let data = {
                params: [{
                    compontName: 'Order',
                    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.setState({ parameterCode: 'Order' }, () => {
                                        this.columnRef.onOpenModel();
                                    })
                                }}>{language.language == 'EN' ? item.enDescripts : item.title}</div>,
                                ellipsis: true
                            }
                        }) : '';
                        let filterArr = arr.filter(function (item) { return item.display === 'Y' });
                        this.setState({ modalColumns: filterArr, modalColumnsWidth: res.totalWidth })
                    }
                }
            });
        };

        // 点击删除时阻止事件冒泡
        handlePopconfirm = (e) => {
            e.stopPropagation();
        };

        onRef = (ref) => {
            this.child = ref;
        }

        // 保存成功后清空data数据
        deleteData() {
            this.setState({ data: [], detailInfo: [], rpTotal: 0, spTotal: 0, });
        }

        // 收起明细录入
        packUpHandle = () => {
            this.setState({ show: !this.state.show, span: 24 })
        }

        // 获取单位下拉框数据
        getUnitData(id) {
            let data = {
                params: [
                    {
                        stockID: id, // 库存项Id
                    }
                ]
            }
            $http.post('urlS', this, {
                code: "02020043",
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        this.setState({ unitData: res.result })
                    } else {
                        this.setState({ unitData: [] })
                    }
                }
            })
        }

        // 获取除下拉框之外的数据
        getInputValue(id, inOperLocID) {
            let data = {
                params: [
                    {
                        stockID: id, // 库存项Id
                        inOperLocID: inOperLocID
                    }
                ]
            }
            $http.post('urlS', this, {
                code: "02020049",
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        this.setState({ userInfo: res.result[0] });
                        this.props.form.setFieldsValue({
                            manfID: res.result[0].manfID,
                            unitID: res.result[0].unitID
                        });
                    }
                }
            })
        }



        // 操作弹框
        onClickRowPublic = (record) => {
            return {
                // 单击行选中
                onClick: () => {
                    if (this.state.rowId === '') {
                        // 保存行数据以及ID
                        this.setState({ rowId: record.key })
                    } else {
                        if (this.state.rowId !== record.key) {
                            this.setState({ rowId: record.key })
                        }
                    }
                },
                onDoubleClick: () => {
                    this.confirmSelection(record);
                }
            }
        }

        setRowClassNamePublic = (record) => {
            return record.key === this.state.rowId ? 'clickRowStyle' : '';
        }

        // 双击选中行数据的回调
        confirmSelection = (record) => {
            this.resetFields();
            this.setState({ ModalRowData: record }, () => {
                // 关闭弹窗
                this.child.handleCancel();
                // 获取单位下拉框数据
                this.getUnitData(record.stockID);
                this.getInputValue(record.stockID, this.props.handleThis.state.inOperLocID);
                this.props.form.setFieldsValue({ stockDesc: record.stockDesc, unitID: undefined });
                this.handleOnSelect(1)
            })
        }

        // 获取焦点的方法--描述
        stockDescOnFocus = () => {
            let { ChineseEnglishSize } = this.state;
            let inOperLocID = this.props.handleThis.getInOperLocID();
            if (!inOperLocID) {
                message.info(ChineseEnglishSize.MaterialStorageOrderMakingdelete ? ChineseEnglishSize.MaterialStorageOrderMakingdelete.descripts : '请先选择入库科室');
            }
        }

        // 当描述失去焦点的时候
        stastockDescOnBlure = (e) => {
            if (this.state.ModalRowData && (e.target.value !== this.state.ModalRowData.stockDesc)) {
                this.props.form.setFieldsValue({ stockDesc: undefined });
            }
        }

        // 新增明细录入
        addHandle = (obj) => {
            let { ChineseEnglishSize } = this.state;
            let statusID = this.props.handleThis.state.userInfo ? this.props.handleThis.state.userInfo.stateID : '';
            if (+statusID < 20 || statusID === undefined) {
                let arr = [...this.state.data];
                if (obj.key) {
                    for (let i = 0, len = arr.length; i < len; i++) {
                        if (arr[i].key === obj.key) {
                            arr[i] = obj;
                        }
                    }
                } else {
                    arr.push(obj);
                    for (let i = 0; i < arr.length; i++) {
                        !arr[i].key ? arr[i].key = i + 'detail' : '';
                    }
                }
                this.setState({ data: arr }, () => {
                    let spNum = 0;
                    let rpNum = 0;
                    for (var f = 0; f < arr.length; f++) {
                        spNum = +arr[f].spAmt + spNum;
                        rpNum = +arr[f].rpAmt + rpNum;
                    }
                    this.setState({ rpTotal: rpNum.toFixed(2), spTotal: spNum.toFixed(2) })
                    this.childDesc.resetFields();
                    this.resetFields();
                    console.log('statusID', statusID)
                    if (+statusID < 20) {
                        this.props.handleThis.saveHandle();
                    }
                });
                // }
                // })
            } else {
                message.error(ChineseEnglishSize.MaterialStorageOrderMakingoperatedTips ? ChineseEnglishSize.MaterialStorageOrderMakingoperatedTips.descripts : "当单据状态为保存时才可以进行操作");
            }
        }

        // 重置表单
        resetFields = () => {
            this.props.form.resetFields(); //清空所有
            this.setState({ userInfo: {}, rowKey: '', stockID: '' });
        }

        // 删除
        handleDelete = (record, e) => {
            let { ChineseEnglishSize } = this.state;
            e.stopPropagation();
            if (record.inOperDetailID) {
                // 当inOperDetailID存在的话则删除接口明细、不存在的话切割数组当中的一个对象
                let statusID = this.props.handleThis.state.userInfo ? this.props.handleThis.state.userInfo.statusID : '';
                if (+statusID < 20 || statusID === undefined) {
                    let data = {
                        params: [
                            {
                                inOperDetailID: record.inOperDetailID,
                            }
                        ]
                    };
                    $http.post('urlS', this, {
                        code: "02060009",
                        data: data,
                        success: function (res) {
                            if (+res.errorCode === 0) {
                                message.success(res.errorMessage);
                                this.deleteRow(record.key);
                                if (record.key === this.state.rowKey) {
                                    this.resetFields()
                                }
                            }
                        }
                    });

                } else {
                    message.error(ChineseEnglishSize.MaterialStorageOrderMakingoperatedTips ? ChineseEnglishSize.MaterialStorageOrderMakingoperatedTips.descripts : "当单据状态为保存时才可以进行操作");
                }
            } else {
                this.setState({ userInfo: {}, rowKey: '', stockID: '' });
                this.deleteRow(record.key);
            }
        }

        // 本地删除数据
        deleteRow(key) {
            const dataSource = JSON.parse(JSON.stringify(this.state.data));
            this.setState({ data: dataSource.filter(item => item.key !== key) }, () => {
                let spNum = 0;
                let rpNum = 0;
                for (var f = 0; f < this.state.data.length; f++) {
                    spNum = +this.state.data[f].spAmt + spNum;
                    rpNum = +this.state.data[f].rpAmt + rpNum;
                }
                this.setState({ rpTotal: rpNum.toFixed(2), spTotal: spNum.toFixed(2) })
            });
        }

        // 设置行属性
        onClickRow = (record) => {
            return {
                // 单击行选中
                onClick: (e) => {
                    e.stopPropagation();
                    // this.resetFields();
                    if (this.state.rowKey === '') {
                        // 保存行数据以及ID
                        this.setState({ rowKey: record.key, userInfo: record, stockID: record.stockID, unitData: record.unit });
                        // this.getUnitData(record.stockID);
                    } else {
                        if (this.state.rowKey !== record.key) {
                            this.setState({ rowKey: record.key, userInfo: record, stockID: record.stockID, unitData: record.unit });
                            // this.getUnitData(record.stockID);
                        } else {
                            this.setState({ rowKey: '', userInfo: {}, stockID: '', unitData: [] });
                            this.childDesc.resetFields();
                        }
                    }
                }
            }
        }

        // 表格行的类名
        setRowClassName = (record) => {
            return record.key === this.state.rowKey ? 'clickRowStyle' : '';
        }

        // 下拉框选中事件
        handleOnSelect = (num) => {
            switch (num) {
                case 1:
                    setTimeout(() => {
                        this.myRef2.current.focus();
                    }, 300)
                    break;
                case 2:
                    setTimeout(() => {
                        this.myRef3.current.focus();
                    }, 300)
                    break;
                case 3:
                    setTimeout(() => {
                        this.myRef4.current.focus();
                    }, 300)
                    break;
                case 4:
                    setTimeout(() => {
                        this.myRef5.current.focus();
                    }, 300)
                    break;
                case 5:
                    setTimeout(() => {
                        this.myRef6.current.focus();
                    }, 300)
                    break;
                case 6:
                    setTimeout(() => {
                        this.myRef7.current.focus();
                    }, 300)
                    break;
                case 7:
                    setTimeout(() => {
                        this.myRef8.current.focus();
                    }, 300)
                    break;
                case 8:
                    setTimeout(() => {
                        this.myRef9.current.focus();
                    }, 300)
                    break;
                case 9:
                    setTimeout(() => {
                        this.myRef10.current.focus();
                    }, 300)
                    break;
                case 10:
                    setTimeout(() => {
                        this.myRef11.current.focus();
                    }, 300)
                    break;
                case 11:
                    setTimeout(() => {
                        this.myRef12.current.focus();
                    }, 300)
                    break;
                case 12:
                    setTimeout(() => {
                        this.myRef13.current.focus();
                    }, 300)
                    break;
                default:
                    setTimeout(() => {
                        this.myRef14.current.buttonNode.focus();
                    }, 300)
            }
        }

        handleOnKeydown = (e) => {
            let { ChineseEnglishSize } = this.state;
            var e = window.event || e;
            let scroll_height = 50;
            let id = '';
            let oneArr = this.state.modalData && this.state.modalData.length > 0 ? this.state.modalData : [];
            switch (e.keyCode) {
                case 13:
                    if (this.state.rowId) {
                        let obj = {}
                        for (var i = 0; i < oneArr.length; i++) {
                            if (oneArr[i].key === this.state.rowId) {
                                obj = i > 0 ? oneArr[i] : oneArr[0];
                                break;
                            }
                        }
                        this.confirmSelection(obj);
                    } else {
                        message.info(ChineseEnglishSize.MaterialStorageOrderMakingselectOperatedDataTips ? ChineseEnglishSize.MaterialStorageOrderMakingselectOperatedDataTips.descripts : "请选择一条需要操作的数据")
                    }
                    break;
                case 38: //上
                    if (this.state.rowId) {
                        for (var i = 0; i < oneArr.length; i++) {
                            if (oneArr[i].key === this.state.rowId) {
                                id = i > 0 ? oneArr[i - 1].key : oneArr[0].key;
                                break;
                            }
                        }
                        this.setState({ rowId: id })
                        setTimeout(() => {
                            var gundong = document.getElementById("gundong");
                            gundong.scrollTop = gundong.scrollTop - scroll_height;
                        }, 300)
                    } else {
                        this.setState({ rowId: oneArr[0].key })
                    }
                    break;
                case 40: //下
                    if (this.state.rowId) {
                        for (let i = 0; i < oneArr.length; i++) {
                            if (oneArr[i].key === this.state.rowId) {
                                id = i + 1 >= oneArr.length ? oneArr[oneArr.length - 1].key : oneArr[i + 1].key;
                                break;
                            }
                        }
                        this.setState({ rowId: id })
                        setTimeout(() => {
                            var gundong = document.getElementById("gundong");
                            gundong.scrollTop = gundong.scrollTop + scroll_height;
                        }, 300)
                    } else {
                        this.setState({ rowId: oneArr[0].key })
                    }
                    break;
            }
        };

        initialDataObj = () => {
            var initialObj = {};
            let { userInfo } = this.state;
            initialObj.stockDesc = userInfo.stockDesc;
            initialObj.manfID = userInfo.manfID;
            initialObj.batNo = userInfo.batNo;
            initialObj.expDate = userInfo.expDate;
            initialObj.qty = userInfo.qty;
            initialObj.unitID = userInfo.unitID;
            initialObj.rp = userInfo.rp;
            initialObj.sp = userInfo.sp;
            initialObj.invNo = userInfo.invNo;
            initialObj.invDate = userInfo.invDate;
            initialObj.qualityNo = userInfo.qualityNo;
            initialObj.produceDate = userInfo.produceDate;
            initialObj.remark = userInfo.remark;
            return initialObj;
        };

        //检查表单是否有未保持数据
        checkFormData = () => {
            let newObjData = {};
            let stockDesc = this.props.form.getFieldValue('stockDesc');
            let manfID = this.props.form.getFieldValue('manfID');
            let batNo = this.props.form.getFieldValue('batNo');
            let expDate = this.props.form.getFieldValue('expDate');
            let qty = this.props.form.getFieldValue('qty');
            let unitID = this.props.form.getFieldValue('unitID');
            let rp = this.props.form.getFieldValue('rp');
            let sp = this.props.form.getFieldValue('sp');
            let invNo = this.props.form.getFieldValue('invNo');
            let invDate = this.props.form.getFieldValue('invDate');
            let qualityNo = this.props.form.getFieldValue('qualityNo');
            let produceDate = this.props.form.getFieldValue('produceDate');
            let remark = this.props.form.getFieldValue('remark');
            if (batNo == undefined) {
                newObjData.batNo = '';
            } else {
                newObjData.batNo = batNo;
            }
            if (manfID == undefined) {
                newObjData.manfID = '';
            } else {
                newObjData.manfID = manfID;
            }
            if (expDate == undefined) {
                newObjData.expDate = '';
            } else {
                newObjData.expDate = Moment(expDate).format('YYYY-MM-DD');
            }
            if (invNo == undefined) {
                newObjData.invNo = '';
            } else {
                newObjData.invNo = invNo;
            }
            if (invDate == undefined) {
                newObjData.invDate = '';
            } else {
                newObjData.invDate = Moment(invDate).format('YYYY-MM-DD');
            }
            if (qualityNo == undefined) {
                newObjData.qualityNo = '';
            } else {
                newObjData.qualityNo = qualityNo;
            }
            if (produceDate == undefined) {
                newObjData.produceDate = '';
            } else {
                newObjData.produceDate = Moment(produceDate).format('YYYY-MM-DD');
            }
            if (qty == undefined) {
                newObjData.qty = '';
            } else {
                newObjData.qty = qty;
            }
            if (remark == undefined) {
                newObjData.remark = '';
            } else {
                newObjData.remark = remark;
            }
            if (rp == undefined) {
                newObjData.rp = '';
            } else {
                newObjData.rp = rp;
            }
            if (sp == undefined) {
                newObjData.sp = '';
            } else {
                newObjData.sp = sp;
            }
            if (stockDesc == undefined) {
                newObjData.stockDesc = '';
            } else {
                newObjData.stockDesc = stockDesc;
            }
            if (unitID == undefined) {
                newObjData.unitID = '';
            } else {
                newObjData.unitID = unitID;
            }
            return newObjData;
        };

        //药品名称为空时清除表单数据
        clearData = (val) => {
            if (!val.target.value) {
                this.setState({ userInfo: {} });
                this.props.form.setFieldsValue({
                    manfID: undefined,
                    unitID: undefined
                });
            }
        };

        //组件权限编辑器
        childDesc = (ref) => {
            this.childDesc = ref;
        };

        //表头拖动
        handleResize = index => (e, { size }) => {
            this.setState(({ columns }) => {
                const nextColumns = [...columns];
                nextColumns[index] = {
                    ...nextColumns[index],
                    width: parseInt(size.width),
                };
                return { columns: nextColumns };
            });
        };

        // 导出
        exportTableData = () => {
            let { data } = this.state;
            let columns = JSON.parse(JSON.stringify(this.state.columns));
            if (!(data && data.length > 0)) {
                message.info("明细列表有数据时才支持导出功能。");
                return;
            }
            for (var i = 0; i < columns.length; i++) {
                columns[i].title = columns[i] && columns[i].descripts ? columns[i].descripts : columns[i].label;
            }
            handleExcel.exportExcel(columns, data, '物资入库明细列表');
        }

        render() {
            const formItemInput = {
                labelCol: {
                    xs: { span: 12 },
                    sm: { span: 10 },
                    md: { span: 8 }
                },
                wrapperCol: {
                    xs: { span: 12 },
                    sm: { span: 14 },
                    md: { span: 16 }
                },
            };
            const formItemInputText = {
                labelCol: {
                    xs: { span: 6 },
                    sm: { span: 7 },
                    md: { span: 4 }
                },
                wrapperCol: {
                    xs: { span: 18 },
                    sm: { span: 17 },
                    md: { span: 20 }
                },
            };
            const { getFieldDecorator } = this.props.form;
            let userInfo = this.state.userInfo ? this.state.userInfo : {};
            let { ChineseEnglishSize } = this.state;
            //别名接口需要的参数
            let parameData = {
                locID: this.state.inOperLocID ? this.state.inOperLocID : JSON.parse(window.sessionStorage.userData).locID ? JSON.parse(window.sessionStorage.userData).locID : '',
                stkCatID: this.state.stkCatID ? this.state.stkCatID : undefined
            }
            let { detailWidthTotal } = this.state;
            const columns = this.state.columns.map((col, index) => ({
                ...col,
                key: index,
                onHeaderCell: column => ({
                    width: parseInt(column.width),
                    onResize: this.handleResize(index),
                }),
            }));
            return (
                <div className="detail-entry-list">
                    <Row>
                        <Col span={10} style={{ display: this.state.show ? 'none' : '' }} className={!this.state.show ? "animate-wrap active down-in" : "animate-wrap"}>
                            <Card
                                size="small"
                                title={<div className="card-title-left-icon"><div></div>{ChineseEnglishSize.MaterialStorageOrderMakingentryDetails ? ChineseEnglishSize.MaterialStorageOrderMakingentryDetails.descripts : '明细录入'}</div>}
                                className="detail-entering"
                                extra={<span style={{ color: '#666' }} className='span' onClick={() => {
                                    this.setState({ parameterCode: 'materialWarehouseCheck' }, () => {
                                        this.columnRef.onOpenModel();
                                    })
                                }}><Icon type="setting" title={ChineseEnglishSize.MaterialStorageOrderMakingcolumnSettings ? ChineseEnglishSize.MaterialStorageOrderMakingcolumnSettings.descripts : '列权限设置'} /></span>}
                            >
                                <div style={{ height: store.getState().tableHeight.y - 74 + 'px', overflow: 'auto' }} className="card-detail-left">

                                    <FormModalData APICode='02060014' stockCode='02060013' parameter='MaterialWarehouseFormList' parameData={parameData} unitData={this.state.unitData} SelectData={this.state.SelectData} rowKey={this.state.rowKey} userInfo={this.state.userInfo} handelThis={this} onRef={this.childDesc} inOperLocID={this.state.inOperLocID} />
                                </div>
                            </Card>
                        </Col>
                        <Col span={this.state.show ? 24 : 14}>
                            <Card
                                size="small"
                                title={<span><Icon onClick={this.packUpHandle} type={this.state.show ? 'double-right' : 'double-left'} />{ChineseEnglishSize.MaterialStorageOrderMakingdetailListing ? ChineseEnglishSize.MaterialStorageOrderMakingdetailListing.descripts : '明细列表'}</span>}
                                extra={<span style={{ color: '#666' }} className='span' onClick={() => this.columnRef.onOpenModel()}><Icon type="setting" title={ChineseEnglishSize.MaterialStorageOrderMakingcolumnSettings ? ChineseEnglishSize.MaterialStorageOrderMakingcolumnSettings.descripts : '列权限设置'} /></span>}
                            >
                                <div style={{ height: store.getState().tableHeight.y - 108 + 'px' }}>
                                    <Table
                                        columns={columns.length > 0 ? columns : this.columns}
                                        components={this.components}
                                        dataSource={this.state.data}
                                        pagination={false}
                                        bordered
                                        scroll={{ x: detailWidthTotal ? detailWidthTotal : 2000, y: store.getState().tableHeight.y - 159 }}
                                        onRow={this.onClickRow}
                                        rowClassName={this.setRowClassName}
                                        className="th-style WadetailsHeight"
                                    />
                                </div>
                                <Col style={{ fontSize: '15px', fontWeight: '700', marginLeft: '18px' }}>
                                    <span >{ChineseEnglishSize.WarehousingOrderMakingrpTotal ? ChineseEnglishSize.WarehousingOrderMakingrpTotal.descripts : '进价金额总价'}：</span><span>{this.state.rpTotal} </span>
                                    <span style={{ marginLeft: '50px' }}> {ChineseEnglishSize.WarehousingOrderMakingspTotal ? ChineseEnglishSize.WarehousingOrderMakingspTotal.descripts : '售价金额总价'} ：</span><span>{this.state.spTotal}</span>
                                    <span style={{ marginLeft: '50px' }}> 总条数 ：</span><span>{this.state.data && this.state.data.length ? this.state.data.length : 0}</span>
                                </Col>
                            </Card>
                        </Col>
                    </Row>
                    <ColumnAuthoritysModel
                        clientWidth='800px'
                        compontName={this.state.parameterCode}
                        configType="C"
                        onRef={this.onColumnRef}
                        reloadData={() => {
                            if (this.state.parameterCode == 'MaterialWarehouseList') {
                                this.getDetailTableColumns()
                            } else if (this.state.parameterCode == 'Order') {
                                this.getTableColumns()
                            }
                        }
                        }
                    />
                </div>
            )
        }
    }
);

export default DetailEntryList;