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

const { api } = config;
const { excel } = api;
const { exportExcelURL } = excel;
const { RangePicker } = DatePicker;
const QuoteForm = ({ dispatch, quoteForm, loading }) => {
  const { list, total, filterParams, priceBtnFlag, supplier,inquiryUser } = quoteForm;
  const { MonthPicker } = DatePicker;
  const domain = 'quoteForm';

  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 format = (precision) => (value) => {
    return (
      <>{value ? numberUtils.round_half_up_format(value, precision) : ''}</>
    );
  };

  const tableProps = {
    rowKey: 'id',
    limit: stringUtils.queryURL('limit'),
    offset: stringUtils.queryURL('offset'),
    sortBy: stringUtils.queryURL('sortBy') || 'id',
    sortDirection: stringUtils.queryURL('sortDirection') || 'DESC',
    enableDoubleClick: false,
    scroll: {
      x: 4100,
      y: 500,
    },
    domain,
    dispatch,
    loading,
    showAdd: false,
    showDelete: false,
    showEdit: false,
    showView: false,
    enableSelection:false,
    total,
    dataSource: list,
    handleDownload: {
      requestUrl: `${exportExcelURL}/quote`,
      requestParam: window.location.search,
    },
    filter: [{
      title: '询价单编号',
      dataIndex: 'docNo',
      tag: <Input placeholder="请输入询价单编号" />,
      options: {
        initialValue: stringUtils.queryURL('docNo'),
      },
    }, {
      title: '供应商',
      dataIndex: 'suppName',
      tag: <Input placeholder="请输入供应商编号/名称" disabled={supplier.supplier} />,
      options: {
        initialValue: supplier.supplier ? supplier.suppName.trim() : stringUtils.queryURL('suppName'),
      },
    }, {
      title: '供货区域',
      dataIndex: 'suppCenterId',
      options: {
        rules: [
          {
            required: false,
            message: '必填',
          },
        ],
      },
      tag: <SuggestSelect apiName="regions"/>,
    }, {
      title: '物料',
      dataIndex: 'itemName',
      tag: <Input placeholder="请输入物料编号/物料名称" />,
      options: {
        initialValue: stringUtils.queryURL('itemName'),
      },
    }, {
      title: '询价月份',
      dataIndex: 'monthDate',
      tag: <MonthPicker style={{ width: '100%' }} />,
      options: {
        initialValue: stringUtils.queryURL('monthDate') ? moment(stringUtils.queryURL('monthDate')) : null,
      },
    }, {
      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: inquiryUser.inquiryUser ? inquiryUser.inquiryUserName: stringUtils.queryURL('createUser'),
      },
    }, {
      title: '报价状态',
      dataIndex: 'docStatus',
      tag: <UdcSelect domain="SRM" code="PQ_D_STATUS" />,
      options: {
        initialValue: stringUtils.queryURL('docStatus'),
      },
    }],
    columns: [{
      title: '询价单编号',
      dataIndex: 'peDocNo',
      width: 150,
      className: 'noWrap',
      sorter: true,
    }, {
      title: '物料编号',
      dataIndex: 'itemCode',
      width: 150,
      className: 'noWrap',
      sorter: true,
    }, {
      title: '物料名称',
      dataIndex: 'itemName',
      width: 150,
      className: 'alignLeft',
      sorter: true,
      render: (value, row, index) => {
        if (value) {
          return value.length > 10 ? (
            <Tooltip placement="bottom" title={value}> {value && `${value.slice(0, 10)}...`} </Tooltip>) : value;
        } else {
          return '';
        }
      },
    }, {
      title: '物料规格',
      dataIndex: 'itemSpec',
      width: 150,
    }, {
      title: '单位',
      dataIndex: 'uomName',
      width: 100,
    }, {
      title: '供应商名称',
      dataIndex: 'suppName',
      width: 200,
      className: 'alignLeft',
      sorter: true,
      render: (value, row, index) => {
        if (value) {
          return value.length > 10 ? <Tooltip placement="bottom" title={value}>
            {value && `${value.slice(0, 10)}...`}
          </Tooltip> : value;
        } else {
          return '无';
        }
      },
    }, {
      title: '供货区域',
      dataIndex: 'suppCenterName',
      width: 150,
      align: 'alignCenter',
      sorter: true,
    }, {
      title: '当期预估用量',
      dataIndex: 'estimatedNum',
      width: 120,
      className: 'alignRight',
      sorter: true,

    }, {
      title: '单次起订量',
      dataIndex: 'minNum',
      width: 120,
      className: 'alignRight',
      sorter: true,
    }, {
      title: '含税报价',
      dataIndex: 'price',
      width: 120,
      className: 'alignRight',
      sorter: true,
      render: format(4)
    }, {
      title: '含税议价',
      dataIndex: 'yjPrice',
      width: 120,
      className: 'alignRight',
      sorter: true,
      render: format(4)
    }, {
      title: '最高可供应量',
      dataIndex: 'maxProvideNum',
      width: 120,
      className: 'alignRight',
      sorter: true,
    }, {
      title: '报价状态',
      dataIndex: 'docStatusName',
      width: 120,
      className: 'noWrap',
    }, {
      title: '报价时间',
      dataIndex: 'priceTime',
      width: 180,
      className: 'noWrap',
      render: (value, row, index) => {
        return (<span>{dataUtils.dtm(value)}</span>);
      },
      sorter: true,
    }, {
      title: '价格生效日',
      dataIndex: 'fromDate',
      width: 120,
      className: 'noWrap',
      render: (value, row, index) => {
        return (<span>{dataUtils.ymd(value)}</span>);
      },
      sorter: true,
    }, {
      title: '价格失效日',
      dataIndex: 'toDate',
      width: 120,
      className: 'noWrap',
      render: (value, row, index) => {
        return (<span>{dataUtils.ymd(value)}</span>);
      },
      sorter: true,
    }, {
      title: '订货周期(天)',
      dataIndex: 'orderPeriod',
      width: 100,
      className: 'alignRight',
      sorter: true,
    }, {
      title: '配送时间(天)',
      dataIndex: 'deliveryPeriod',
      width: 100,
      className: 'alignRight',
      sorter: true,
    }, {
      title: '上月绩效',
      dataIndex: 'scoreGrade',
      align: 'alignCenter',
      width: 100,
    }, {
      title: '含税金额',
      dataIndex: 'amt',
      width: 100,
      className: 'alignRight',
      sorter: true,
      render: format(2)
    }, {
      title: '未税单价',
      dataIndex: 'netPrice',
      width: 100,
      className: 'alignRight',
      sorter: true,
      render: format(4)
    }, {
      title: '未税金额',
      dataIndex: 'netAmt',
      width: 100,
      className: 'alignRight',
      sorter: true,
      render: format(2)
    }, {
      title: '税额',
      dataIndex: 'taxAmt',
      width: 100,
      className: 'alignRight',
      sorter: true,
      render: format(2)
    }, {
      title: '税率(%)',
      dataIndex: 'taxRate',
      width: 100,
      className: 'alignRight',
      sorter: true,
    }, {
      title: '分配比例(%)',
      dataIndex: 'percent',
      width: 100,
      className: 'alignRight',
    }, {
      title: '分配数量',
      dataIndex: 'allowedNumber',
      width: 100,
      className: 'alignRight',
    }, {
      title: '分配金额',
      dataIndex: 'allowedAmt',
      width: 100,
      className: 'alignRight',
    }, {
      title: '备注',
      dataIndex: 'remark',
      width: 300,
      className: 'alignLeft',
      render: (value, row, index) => {
        if (value) {
          return value.length > 15 ? (
            <Tooltip placement="bottom" title={value}> {value && `${value.slice(0, 15)}...`} </Tooltip>) : value;
        } else {
          return '';
        }
      },
    }, {
      title: '报价附件',
      dataIndex: 'quoteAttch',
      width: 400,
      className: 'alignLeft',
      render: (value, row, index) => {
        return (
          <UploadEL size={'small'}
            api={`/api/source-mgmt/qo/iqo/sfs/token?clsPath=${row.attachRepo}&dataKey=${row.pqmId}`}
            dataKey={row.pqmId}
            listTypes={'text'}
            disabled={true} />
        )
      },
    }],
    buttons: [
      // {
      //   key: 'price',
      //   type: 'primary',
      //   name: '比价',
      //   requiredSelected: 1,
      //   hidden: !priceBtnFlag,
      //   cb: (selectedRowKeys, searchBarForm, selectedRows) => {
      //     // console.log("selectedRows==>",selectedRows);
      //     dispatch({
      //       type: `${domain}/getSingle`,
      //       payload: {
      //         mode: 'update',
      //         id: selectedRows[0].pqdId,
      //         itemId: selectedRows[0].itemId,
      //         suppCenterId: selectedRows[0].suppCenterId
      //       },
      //     });
      //   },
      // }
    ],
  };

  const handleChange = (key, index, newValue) => {
    // if(newValue===''){
    //   message.error('请填写关闭原因');
    //   return;
    // }
    dispatch({ type: `${domain}/updateCell`, payload: { key, index, value: newValue } });
  };

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

};

export default connect(({ quoteForm, loading }) => ({ quoteForm, loading }))(QuoteForm);
