.

src/pages/JobStatistics/Job/index.jsx

@@ -1,3 +1,151 @@
+import React, { useState, useEffect, useRef } from 'react';
+import { DatePicker, Select } from 'antd';
+import { PageHeaderWrapper } from '@ant-design/pro-layout';
+import moment from 'moment';
+import PageTable from '@/components/PageTable';
+import { getJobList } from '@/services/job'
+import MachinetySelect from '@/components/MachinetySelect';
+import { getMachineryTypeList } from '@/services/machineryType';
+import { getCooperativeList } from '@/services/cooperative';
+
+const formatterTime = (val) => {
+  return val ? moment(val).format('YYYY-MM-DD HH:mm') : '';
+};
+const { Option } = Select;
+const { RangePicker } = DatePicker;
+
 export default (props) => {
-  return <div>作业统计</div>;
+  const [start, setStartDate] = useState()
+  const [end, setEndDate] = useState()
+
+  const [machineryTypeList, setMachineryTypeList] = useState([]);
+  const [cooperativeList, setCooperativeList] = useState([]);
+
+  const handelChange = (date, dateStrings) => {
+    setStartDate(dateStrings[0])
+    setEndDate(dateStrings[1])
+  }
+  const ref = useRef();
+  const Reset = () => {
+    setStartDate()
+    setEndDate()
+    ref.current.reload();
+  }
+
+  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: 'machineryId',
+      key: 'machineryId',
+      hideInTable: true,
+      renderFormItem: (item, field, form) => {
+        return (
+          <MachinetySelect />
+        )
+      }
+    },
+    {
+      title: '农机型号',
+      dataIndex: 'machineryTypeId',
+      key: 'machineryTypeId',
+      hideInTable: true,
+      renderFormItem: (item, field, form) => {
+        return (
+          <Select>
+            {machineryTypeList.map((item) => (
+              <Option value={item.typeId} key={item.typeId}>
+                {item.name}
+              </Option>
+            ))}
+          </Select>
+        )
+      }
+    },
+    {
+      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: 'machineryName',
+      key: 'machineryName',
+      search: false
+    },
+    {
+      title: '农机型号',
+      dataIndex: 'machineryTypeName',
+      key: 'machineryTypeName',
+      search: false
+    },
+    {
+      title: '合作社名',
+      dataIndex: 'orgName',
+      key: 'orgName',
+      search: false
+    },
+    {
+      title: '农机手',
+      dataIndex: 'workerName',
+      key: 'workerName',
+    },
+    {
+      title: '作业面积',
+      dataIndex: 'area',
+      key: 'area',
+      search: false,
+    },
+    {
+      title: '作业时间',//结束时间
+      dataIndex: 'endDate',
+      key: 'endDate',
+      render: (t, render) => formatterTime(render.startDate) + ' ~ ' + formatterTime(render.endDate),
+      renderFormItem: (_, record) => <RangePicker placeholder={['开始日期', '结束日期']} format='YYYY-MM-DD' onChange={handelChange} />
+    },
+  ];
+
+  return (
+    <PageHeaderWrapper>
+      <PageTable
+        actionRef={ref}
+        request={getJobList}
+        // expfunc={exportPersonList}
+        columns={columns}
+        rowKey="jobId"
+        params={{ start, end }}
+        onReset={Reset}
+        options={false}
+      />
+    </PageHeaderWrapper>
+  );
 };

src/services/job.js

@@ -0,0 +1,8 @@
+import request from '@/utils/request';
+
+/**
+ * 查询农机列表
+ * @param {*} params
+ * @returns
+ */
+export const getJobList = (params) => request('/work-job', { params });