machinery-admin/src/pages/OrderManage/OrderList/index.jsx

import React, { useState, useEffect } from 'react';
import { Select } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import moment from 'moment';
import PageTable from '@/components/PageTable';
import { getOrderList } from '@/services/order'
import MachinetySelect from '@/components/MachinetySelect';
import { getMachineryTypeList } from '@/services/machineryType';
import { getCooperativeList } from '@/services/cooperative';

const { Option } = Select;
const formatterTime = (val) => {
  return val ? moment(val).format('YYYY-MM-DD') : '';
};
const orderStates = (item) => {
  if (item.payStatus === 0) {
    return '待付款'
  } else if (item.payStatus === 1 && item.workStatus === 0 && item.dispatchStatus === 0) {
    return '已付款'
  } else if (item.workStatus == 0 && item.dispatchStatus === 1) {
    return '待作业'
  } else if (item.payStatus === 1 && (item.workStatus === 1 || item.workStatus === 2)) {
    return '进行中'
  } else if (item.workStatus === 3 && item.isEvaluated === 0) {
    return '待评价'
  } if (item.workStatus === 3 && item.isEvaluated === 1) {
    return '已完成'
  } else if (item.payStatus === 3) {
    return '退单申请中'
  } else if (item.status === 9) {
    return '已退单'
  } else {
    return '异常'
  }
}
export default (props) => {
  const [machineryTypeList, setMachineryTypeList] = useState([]);
  const [cooperativeList, setCooperativeList] = useState([]);
  useEffect(() => {
    getCooperativeList({ pageSize: 999 }).then((res) => {
      setCooperativeList(res.records);
    }).catch((err) => {
      console.log(err.message)
    });
    getMachineryTypeList({ pageSize: 999 }).then((res) => {
      setMachineryTypeList(res.records);
    }).catch((err) => {
      console.log(err.message)
    });
  }, []);
  const columns = [
    {
      title: '订单号',
      dataIndex: 'orderNo',
      key: 'orderNo',
    },
    {
      title: '合作社',
      dataIndex: 'orgId',
      key: 'orgId',
      hideInTable: true,
      renderFormItem: (item, field, form) => {
        return (
          <Select>
            {cooperativeList.map((item) => (
              <Option value={item.orgId} key={item.orgId}>
                {item.name}
              </Option>
            ))}
          </Select>
        )
      }
    },
    {
      title: '农机',
      dataIndex: 'machineryId',
      key: 'machineryId',
      hideInTable: true,
      renderFormItem: (item, field, form) => {
        return (
          <MachinetySelect />
        )
      }
    },
    {
      title: '农机型号',
      dataIndex: 'typeId',
      key: 'typeId',
      hideInTable: true,
      renderFormItem: (item, field, form) => {
        return (
          <Select>
            {machineryTypeList.map((item) => (
              <Option value={item.typeId} key={item.typeId}>
                {item.name}
              </Option>
            ))}
          </Select>
        )
      }
    },
    {
      title: '合作社名',
      dataIndex: 'orgName',
      key: 'orgName',
      search: false
    },
    {
      title: '农机名',
      dataIndex: 'machineryName',
      key: 'machineryName',
      search: false
    },
    {
      title: '农机型号',
      dataIndex: 'typeName',
      key: 'typeName',
      search: false
    },
    {
      title: '下单人',
      dataIndex: 'personName',
      key: 'personName',
    },
    {
      title: '手机号',
      dataIndex: 'phone',
      key: 'phone',
    },
    {
      title: '需求时间',
      dataIndex: 'appointmentDate',
      key: 'appointmentDate',
      render: (t) => formatterTime(t),
      search: false
    },
    {
      title: '下单面积',
      dataIndex: 'amount',
      key: 'amount',
      search: false,
    },
    {
      title: '费用',
      dataIndex: 'charges',
      key: 'charges',
      render: (t) => t / 100,
      search: false
    },
    {
      title: '下单时间',
      dataIndex: 'createDate',
      key: 'createDate',
      search: false,
      render: (t) => formatterTime(t),
    },

    {
      title: '状态',
      dataIndex: 'status',
      key: 'status',
      search: false,
      render: (t, render) => orderStates(render)
    },
    //操作如果是需求多台机器则需调度 状态为待确认时 状态栏显示调度按钮跳到调度页面
    // 如果是申请退款 则出现处理按钮 显示需求时间 如果未到则退款并且改变已分配农机手状态和农机状态
    // 如果已经服务过了 则可以打电话给农户咨询具体情况看是否退部分款项
  ];

  return (
    <PageHeaderWrapper>
      <PageTable
        request={getOrderList}
        // expfunc={exportPersonList}
        columns={columns}
        rowKey="orderId"
        options={false}
        scroll={{ x: 1500 }}
      />
    </PageHeaderWrapper>
  );
};