eats

src/components/Bar/index.jsx

@@ -54,7 +54,6 @@ export default (props) => {
         type: 'category',
         data: dataX,
         axisLabel: { interval: 0, rotate: 40 },
-        name: '合作社',
         nameTextStyle: {
           padding: [0, 20],
         },
@@ -62,49 +61,22 @@ export default (props) => {
       yAxis: [
         {
           type: 'value',
-          name: '台',
+          name: '设备数量',
           position: 'left',
           alignTicks: true,
           axisLine: {
             show: true,
-            lineStyle: {
-              color: colors[0],
-            },
-          },
-          axisLabel: {
-            formatter: '{value} 台',
           },
         },
         {
           type: 'value',
-          name: '亩',
+          name: '作业面积(亩)',
           position: 'right',
           alignTicks: true,
           axisLine: {
             show: true,
-            lineStyle: {
-              color: colors[1],
-            },
-          },
-          axisLabel: {
-            formatter: '{value} 亩',
           },
         },
-        // {
-        //   type: 'value',
-        //   name: '流量',
-        //   position: 'right',
-        //   alignTicks: true,
-        //   axisLine: {
-        //     show: true,
-        //     lineStyle: {
-        //       color: colors[2],
-        //     },
-        //   },
-        // axisLabel: {
-        //   formatter: '{value} ',
-        // },
-        // },
       ],
       dataZoom: {
         show: true,
@@ -116,21 +88,16 @@ export default (props) => {
       },
       series: [
         {
-          name: '设备',
+          name: '设备数量',
           data: dataLs,
           type: 'line',
         },
         {
-          name: '作业',
+          name: '作业面积',
           data: dataVal,
           type: 'bar',
           yAxisIndex: 1,
         },
-        // {
-        //   data: dataVal,
-        //   type: 'bar',
-        //   yAxisIndex: 2,
-        // },
       ],
     }),
     [dataLs, dataVal, dataX],

src/components/BarPerson/index.jsx

@@ -13,6 +13,7 @@ const labelOption = {
   },
 };
 
+const colors = ['#E94F05', '#5470C6', '#91CC75'];
 export default (props) => {
   const { opt, optP, title, h } = props;
   const dataL = [];
@@ -33,12 +34,10 @@ export default (props) => {
   // 亩
   const dataX = opt.map((it) => it.name);
   const dataVal = opt.map((it) => it.value);
-  // 人
-  const colors = ['#E94F05', '#5470C6', '#91CC75'];
 
   const option = useMemo(
     () => ({
-      color: colors,
+      colors,
       title: {
         text: title,
         left: 'center',
@@ -54,7 +53,6 @@ export default (props) => {
         type: 'category',
         data: dataX,
         axisLabel: { interval: 0, rotate: 40 },
-        name: '合作社',
         nameTextStyle: {
           padding: [0, 20],
         },
@@ -62,84 +60,40 @@ export default (props) => {
       yAxis: [
         {
           type: 'value',
-          name: '人',
+          name: '设备数量(台)',
           position: 'left',
           alignTicks: true,
           axisLine: {
             show: true,
-            lineStyle: {
-              color: colors[0],
-            },
-          },
-          axisLabel: {
-            formatter: '{value} 人',
           },
         },
         {
           type: 'value',
-          name: '亩',
+          name: '作业面积(亩)',
           position: 'right',
           alignTicks: true,
           axisLine: {
             show: true,
-            lineStyle: {
-              color: colors[1],
-            },
-          },
-          axisLabel: {
-            formatter: '{value} 亩',
           },
         },
-        // {
-        //   type: 'value',
-        //   name: '流量',
-        //   position: 'right',
-        //   alignTicks: true,
-        //   axisLine: {
-        //     show: true,
-        //     lineStyle: {
-        //       color: colors[2],
-        //     },
-        //   },
-        // axisLabel: {
-        //   formatter: '{value} ',
-        // },
-        // },
       ],
       dataZoom: {
         show: true,
         start: 0,
         end: 100,
       },
-      grid: {
-        height: '55%',
-      },
       series: [
         {
-          name: '人',
+          name: '设备数量',
           data: dataPerson,
           type: 'line',
-          showBackground: true,
         },
         {
-          name: '作业',
+          name: '作业面积',
           data: dataVal,
           type: 'bar',
           yAxisIndex: 1,
-          showBackground: true,
-          backgroundStyle: {
-            color: '#FFFF',
-          },
         },
-        // {
-        //   data: dataVal,
-        //   type: 'bar',
-        //   yAxisIndex: 2,
-        //   showBackground: true,
-        //   backgroundStyle: {
-        //     color: '#EE6666',
-        //   },
-        // },
       ],
     }),
     [dataPerson, dataVal, dataX],

src/components/WelcomeCard/style.less

@@ -1,18 +1,18 @@
 .wcard {
   display: flex;
   align-items: center;
+  justify-content: space-between;
+  width: 320px;
   padding: 16px 32px;
   background: #fff;
-  width: 320px;
 
   .wImg {
     width: 65px;
     height: 65px;
-    margin-right: 64px;
 
     svg {
       width: 100%;
-      height: 100%
+      height: 100%;
     }
   }
 
@@ -22,9 +22,9 @@
     // .title {}
 
     .value {
+      margin: 16px 0;
       color: rgb(26, 182, 202);
       font-size: 25px;
-      margin: 16px 0;
     }
 
     .percentage {
@@ -36,4 +36,4 @@
       }
     }
   }
-}
+}

src/pages/Welcome.jsx

@@ -23,111 +23,13 @@ import './Welcome.less';
 
 const Welcome = () => {
   const intl = useIntl();
-  const [topData, setTopData] = useState([
-    // {
-    //   icon: 'icon-show_gongsiguanli_fill',
-    //   color: '#8dc63f',
-    //   title: '合作社',
-    //   value: 2017 + '个',
-    //   // percentage: 5.6,
-    // },
-    // {
-    //   icon: 'icon-icon',
-    //   color: '#1cbbb4',
-    //   title: '人员',
-    //   value: 580239 + '个',
-    //   // percentage: 32.6,
-    // },
-    // {
-    //   icon: 'icon-tuolaji',
-    //   color: '#a5673f',
-    //   title: '设备',
-    //   value: 2000 + '台',
-    //   // percentage: 42.6,
-    // },
-    // {
-    //   icon: 'icon-dingdanguanli',
-    //   color: '#8799a3',
-    //   title: '作业',
-    //   value: 2075994 + '亩',
-    //   // percentage: -1.6,
-    // },
-  ]);
+  const [topData, setTopData] = useState([]);
 
   const [categoryData, setCategoryData] = useState([]);
   const [lineData, setLineData] = useState([]);
   const [personData, setPersonData] = useState([]);
   const [persondData, setPersDonData] = useState([]);
-  const centerData = [
-    {
-      title: '预约订单',
-      color: '#70d4d4',
-      keyList: [
-        '一月',
-        '二月',
-        '三月',
-        '四月',
-        '五月',
-        '六月',
-        '七月',
-        '八月',
-        '九月',
-        '十月',
-        '十一月',
-        '十二月',
-      ],
-      valueList: [320, 332, 301, 334, 390, 88, 320, 332, 301, 334, 390, 88],
-    },
-    {
-      title: '完成订单',
-      color: '#c3b6e6',
-      keyList: [
-        '一月',
-        '二月',
-        '三月',
-        '四月',
-        '五月',
-        '六月',
-        '七月',
-        '八月',
-        '九月',
-        '十月',
-        '十一月',
-        '十二月',
-      ],
-      valueList: [220, 182, 191, 234, 290, 256, 220, 182, 191, 234, 290, 356],
-    },
-  ];
 
-  const [machineryStatus, setMachineryStatus] = useState([
-    {
-      color: '#70d4d4',
-      keyList: ['预约', '作业', '闲置', '离线', '维修'],
-      valueList: [350, 900, 650, 180, 380],
-    },
-  ]);
-
-  const [workData, setWorkData] = useState([
-    { name: '收割机', value: 35 },
-    { name: '播种机', value: 35 },
-    { name: '农药机', value: 30 },
-    { name: '其他', value: 180 },
-  ]);
-  const [workAreaData, setWorkAreaData] = useState([
-    { name: '收割机', value: 350 },
-    { name: '播种机', value: 900 },
-    { name: '农药机', value: 650 },
-    { name: '其他', value: 180 },
-  ]);
-  const [dispatchList, setDispatchList] = useState([]);
-  const goDispatch = (val) => {
-    history.push(`../OrderManage/dispatch.jsx?id=${val.orderId}`);
-  };
-  useEffect(() => {
-    getDispatchList({ isWarn: true, pageSize: 500 }).then((res) => {
-      setDispatchList(res.records);
-    });
-  }, []);
   // 卡片展示
   useEffect(() => {
     getSummary2().then((res) => {
@@ -233,66 +135,6 @@ const Welcome = () => {
             </Card>
           </Col>
         </Row>
-        {/* <Row justify="space-between">
-          <Col span={16}>
-            <Card style={{ marginTop: '32px' }}>
-              <Bar h="500px" title="本年度预约订单数据概览" opt={centerData} />
-            </Card>
-          </Col>
-          <Col span={7}>
-            <Card title="待调度订单" style={{ marginTop: '32px', height: '548px' }}>
-              {dispatchList.length <= 8 ? (
-                <div style={{ height: '448px', width: '100%' }}>
-                  {dispatchList.map((item) => (
-                    <div
-                      style={{ height: '60px' }}
-                      key={item.orderId}
-                      onClick={() => goDispatch(item)}
-                    >
-                      {(item.personName || item.phone) +
-                        ' 于 ' +
-                        item.createDate +
-                        ' 下了一单请您尽快处理！'}
-                    </div>
-                  ))}
-                </div>
-              ) : (
-                <Swiper
-                  height={60}
-                  style={{ height: '448px' }}
-                  autoplay={{
-                    delay: 1500,
-                    disableOnInteraction: false,
-                  }}
-                  loop
-                  loopAdditionalSlides={8}
-                  modules={[Autoplay]}
-                  direction="vertical"
-                >
-                  {dispatchList.map((item) => (
-                    <SwiperSlide key={item.orderId} onClick={() => goDispatch(item)}>
-                      {(item.personName || item.phone) +
-                        ' 于 ' +
-                        item.createDate +
-                        ' 下了一单请您尽快处理！'}
-                    </SwiperSlide>
-                  ))}
-                </Swiper>
-              )}
-            </Card>
-          </Col>
-        </Row> */}
-        {/* <div className="flex bottom">
-          <Card className="flex-1 card">
-            <Bar h="300px" title="农机状态统计" opt={machineryStatus} />
-          </Card>
-          <Card className="flex-1 card">
-            <PieArea opt={workAreaData} />
-          </Card>
-          <Card className="flex-1 card">
-            <Pie opt={workData} />
-          </Card>
-        </div> */}
       </div>
     </PageContainer>
   );