import React from 'react';
import { connect } from 'dva';
import { Input, DatePicker, Modal } from 'antd';
import { DataTable, SuggestSelect, UdcSelect } from '@components';
import { stringUtils, dataUtils } from '@utils';
import { numberUtils } from '@utils';
import moment from 'moment';

const confirm = Modal.confirm;
const { RangePicker } = DatePicker;

const PriceList = ({ dispatch, priceList, loading }) => {
  const { list, total, historyBtn, adjustBtn } = priceList;
  const domain = 'priceList';

  const dateFormat = 'YYYY-MM-DD';
  const effectDateFrom = stringUtils.queryURL('effectDateFrom');
  const effectDateTo = stringUtils.queryURL('effectDateTo');
  const invalidDateFrom = stringUtils.queryURL('invalidDateFrom');
  const invalidDateTo = stringUtils.queryURL('invalidDateTo');
  const createDateFrom = stringUtils.queryURL('createDateFrom');
  const createDateTo = stringUtils.queryURL('createDateTo');
  const suppCenter = stringUtils.queryURL('suppCenter') ? stringUtils.queryURL('suppCenter').split('%2C') : [];

  const tableProps = {
    rowKey: 'id',
    limit: stringUtils.queryURL('limit'),
    offset: stringUtils.queryURL('offset'),
    sortDirection: stringUtils.queryURL('sortDirection') || 'DESC',
    scroll: {
      x: 1800,
      y: 500
    },
    domain,
    dispatch,
    loading,
    total,
    dataSource: list,
    enableDoubleClick: false,
    showAdd: false,
    showDelete: false,
    showEdit: false,
    filter: [{
      title: '物料',
      dataIndex: 'itemCode',
      tag: <Input placeholder="请输入名称/编号" />,
      options: {
        initialValue: stringUtils.queryURL('itemCode'),
      },
    }, {
      title: '供应商',
      dataIndex: 'suppCode',
      tag: <Input placeholder="请输入名称/编号" />,
      options: {
        initialValue: stringUtils.queryURL('suppCode'),
      },
    }, {
      title: '供货区域',
      dataIndex: 'suppCenter',
      tag: <SuggestSelect apiName="regions" mode="multiple" />,
      options: {
        initialValue: suppCenter,
      },
    }, {
      title: '价格生效日',
      dataIndex: 'effectDate',
      options: {
        initialValue: effectDateFrom ? [moment(effectDateFrom, dateFormat), moment(effectDateTo, dateFormat)] : []
      },
      tag: <RangePicker format="YYYY-MM-DD" style={{ width: '100%' }} />,
    }, {
      title: '价格失效日',
      dataIndex: 'invalidDate',
      options: {
        initialValue: invalidDateFrom ? [moment(invalidDateFrom, dateFormat), moment(invalidDateTo, dateFormat)] : []
      },
      tag: <RangePicker format="YYYY-MM-DD" style={{ width: '100%' }} />,
    }, {
      title: '调整人',
      dataIndex: 'createUser',
      tag: <Input placeholder="请输入名称/编号" />,
      options: {
        initialValue: stringUtils.queryURL('createUser'),
      },
    }, {
      title: '调整时间',
      dataIndex: 'createDate',
      options: {
        initialValue: createDateFrom ? [moment(createDateFrom, dateFormat), moment(createDateTo, dateFormat)] : []
      },
      tag: <RangePicker format="YYYY-MM-DD" style={{ width: '100%' }} />,
    }, {
      title: '状态',
      dataIndex: 'status',
      tag: <UdcSelect domain="SRM" code="ADJUST_STATUS" />,
      options: {
        initialValue: stringUtils.queryURL('status'),
      },
    }, {
      title: '任务节点',
      dataIndex: 'activeTaskKey',
      options: {
        initialValue: stringUtils.queryURL('activeTaskKey'),
      },
      tag: <SuggestSelect apiName="taskDefs" params={{ defKeys: ['PriceAdjust'] }} optionKey="code" />,
    }, {
      title: '流程状态',
      dataIndex: 'bpmStatus',
      options: {
        initialValue: stringUtils.queryURL('bpmStatus'),
      },
      tag: <UdcSelect domain="SRM" code="TRANSACT_STATUS" />,
    }],
    columns: [{
      title: '物料编号',
      dataIndex: 'itemCode',
      className: 'alignCenter',
      width: 120,
    }, {
      title: '物料名称',
      dataIndex: 'itemName',
      className: 'alignLeft',
      width: 150,
    }, {
      title: '供货区域',
      dataIndex: 'suppCenterName',
      className: 'alignCenter',
      width: 150,
    }, {
      title: '供应商',
      dataIndex: 'suppName',
      className: 'alignLeft',
      width: 150,
    }, {
      title: '价格期间',
      dataIndex: 'pricePeriod',
      className: 'alignCenter',
      width: 200,
      render: (value, row, index) => {
        return (<span>{dataUtils.ymd(row.validDateFrom)}-{dataUtils.ymd(row.validDateTo)}</span>);
      },
    }, {
      title: '原价',
      dataIndex: 'taxPrice',
      className: 'alignRight',
      width: 100,
      render: (value) => {
        return (
          numberUtils.round_half_up_format(value, 4)
        );
      },
    }, {
      title: '调整价',
      dataIndex: 'adjustPrice',
      className: 'alignRight',
      width: 100,
      render: (value) => {
        return (
          numberUtils.round_half_up_format(value, 4)
        );
      },
    }, {
      title: '调整人',
      dataIndex: 'createUser',
      className: 'alignLeft',
      width: 100,
    }, {
      title: '调整时间',
      dataIndex: 'createTime',
      className: 'alignCenter',
      width: 150,
    }, {
      title: '状态',
      dataIndex: 'statusName',
      className: 'alignCenter',
      width: 100,
    }, {
      title: '当前任务',
      dataIndex: 'activeTaskName',
      className: 'alignLeft',
      width: 150,
    }],
    buttons: [{
      key: 'approve',
      type: 'primary',
      name: '审批',
      requiredSelected: 1,
      hidden: historyBtn,
      disabled: historyBtn,
      cb: (selectedKeys) => {
        dispatch({
          type: `${domain}/getSingle`,
          payload: {
            id: selectedKeys[0],
            mode: 'approval',
          },
        });
      },
    }, {
      key: 'cancel',
      type: 'primary',
      name: '取消',
      requiredSelected: 1,
      hidden: adjustBtn,
      disabled: adjustBtn,
      cb: (selectedKeys) => {
        confirm({
          title: '确定要取消吗?',
          okText: '确定',
          okType: 'danger',
          cancelText: '取消',
          onOk() {
            dispatch({
              type: `${domain}/delete`,
              payload: {
                id: selectedKeys[0],
              },
            });
          },
        });

      },
    }],
  };

  return (
    <div className="content-inner">
      <DataTable {...tableProps} />
    </div>
  );
};

export default connect(({ priceList, loading }) => ({ priceList, loading }))(PriceList);
