import React from 'react';
import { connect } from 'dva';
import moment from 'moment';
import { Button, Row, Col, Form, Input,Select,Checkbox,Modal,Transfer,Spin ,Table,DatePicker,InputNumber} from 'antd';
import {
  extend,
  extendRule,
  initFilter,
  guid,
  extendGroupRule,
  initFilterGroup,
  extendInclude
} from "../../../utils/common";
const FormItem = Form.Item;
const Option = Select.Option;
const { TextArea } = Input;

class OrderPermitShowPage extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      data: {},
      btns:[],
    };
  };

  componentDidMount() {

  }

  componentWillReceiveProps(NextProps) {
    const reload=NextProps.editPage[NextProps.formId+'_reload'];
    if (reload ) {
      this.props.form.resetFields();
      this.loadData();
      this.props.dispatch({
        type: 'editPage/save',
        payload: {
          [this.props.formId + '_reload']: false
        },
      });
    };
  }

  loadData=()=> {
    const {data,formId,login,dispatch}=this.props;
    const {id}=data?data:{};

    if(id){
      const json = initFilter(this.props.login.OrgId);
      extendRule(json, 'ID', 1, id);
      extendInclude(json,'Nav_Provider');
      extendInclude(json,'Nav_OrderDetail.Nav_Product');
      this.props.dispatch({
        type: 'POOrderPermitShow/getOrder',
        payload: json,
        onComplete: (ret) => {
          if(ret){
            let sumMoney=0;
            let count=ret.Nav_OrderDetail?ret.Nav_OrderDetail.length:0;
            if(ret.Nav_OrderDetail) {
              ret.Nav_OrderDetail.map(t => {
                sumMoney += (t.UNIT_PRICE * t.QTY);
              });
            }

            this.setState({
              data: ret,
              detailCount:count,
              sumMoney:sumMoney,
            });
          }
        }
      });
    }

  };




  render() {
    const {form, location, dispatch, match,loading} = this.props;
    const {getFieldValue, getFieldDecorator, validateFields, validateFieldsAndScroll, setFieldsValue} = form;




    const tableColumns=[
      {title: '品名', dataIndex: 'Nav_Product.NAME', key: 'Nav_Product.NAME'},
      {title: '品号', dataIndex: 'Nav_Product.CODE', key: 'Nav_Product.CODE'},
      {title: '规格', dataIndex: 'Nav_Product.SPEC', key: 'Nav_Product.SPEC'},
      {title: '型号', dataIndex: 'Nav_Product.MODEL', key: 'Nav_Product.MODEL'},
      {title: '标准单价', dataIndex: 'Nav_Product.PRICE', key: 'Nav_Product.PRICE'},
      {title: '采购单价', dataIndex: 'UNIT_PRICE', key: 'UNIT_PRICE'},
      {title: '数量', dataIndex: 'QTY', key: 'QTY'},
      {title: '计划交期', dataIndex: 'DELIVERY_TIME', key: 'DELIVERY_TIME'},
    ];

    const formItemLayout = {
      labelCol: {span: 6},
      wrapperCol: {span: 14},
    };



    return (
      <div>
          <Form>
            <Row>
              <Col span={12}>
                <Form.Item
                  label={'采购单号'}
                  {...formItemLayout}
                >
                  {getFieldDecorator('CODE', {
                    initialValue: this.state.data.CODE,
                  })(<Input disabled={true}/>)}
                </Form.Item>
              </Col>
              <Col span={12}>
                <Form.Item
                  label={'供应商'}
                  {...formItemLayout}
                >
                  {getFieldDecorator('Nav_Provider_NAME', {
                    initialValue: (this.state.data.Nav_Provider==null?'':this.state.data.Nav_Provider.NAME),
                  })(<Input disabled={true}/>)}
                </Form.Item>
              </Col>

              <Col span={12}>
                <Form.Item
                  label={'备注'}
                  {...formItemLayout}
                >
                  {getFieldDecorator('REMARK', {
                    initialValue: this.state.data.REMARK,
                  })(<TextArea rows={4} disabled={true} />)}
                </Form.Item>
              </Col>
            </Row>
            <Row>
              <Col>
                <Table
                  rowKey="ID"
                  pagination={false}
                  dataSource={this.state.data.Nav_OrderDetail}
                  columns={tableColumns}
                />
                <label>共{this.state.detailCount}条记录，累计总价:{this.state.sumMoney}元</label>
              </Col>
            </Row>
          </Form>
      </div>
    );
  }

}

OrderPermitShowPage.propTypes = {
};

export default connect(({ login, loading, editPage }) => ({ login, loading, editPage }))(Form.create()(OrderPermitShowPage));
