Merge branch 'develop' of http://120.55.44.4:10080/xujunjie/gt_client_pad into develop

src/components/PageContent/index.less

@@ -6,9 +6,11 @@
 
   .close {
     position: absolute;
-    top: 20px;
+    top: 22px;
     right: 20px;
-    font-size: 24px;
+    font-size: 28px;
+
+    color: #4a4a4a;
     cursor: pointer;
   }
 }

src/global.less

@@ -192,6 +192,14 @@ input[type='reset'] {
 .ant-table-placeholder {
   background: transparent !important;
 }
+.ant-table,
+.ant-table-container,
+.ant-table-wrapper table {
+  border-radius: 0 !important;
+}
+.ant-table-container {
+  border: none !important;
+}
 .ant-table-cell::before {
   display: none;
 }
@@ -200,10 +208,15 @@ input[type='reset'] {
 }
 .ant-table-thead > tr > th,
 .ant-table-tbody > tr > td {
+  border-radius: 0 !important;
   padding: 8px 25px !important;
   font-size: 20px !important;
   color: #4a4a4a !important;
   line-height: 28px !important;
   font-weight: normal !important;
   vertical-align: middle;
+  border: none !important;
+}
+.ant-table-tbody > tr:nth-child(even) {
+  background: rgba(145, 192, 238, 0.16);
 }

src/pages/EqSelfInspection/List/index.js

@@ -2,24 +2,14 @@ import PageContent from '@/components/PageContent';
 import PageTitle from '@/components/PageTitle';
 import { GetTokenFromUrl, UnityAction } from '@/utils/utils';
 import { connect, history, useParams } from '@umijs/max';
-import { Button, Col, DatePicker, Form, Row, Select, Table } from 'antd';
 import dayjs from 'dayjs';
-import { Fragment, useEffect, useState } from 'react';
-
-const FormItem = Form.Item;
-const { Option } = Select;
-const statusList = [
-  { key: 1, value: '0', label: '正常' },
-  { key: 2, value: '1', label: '异常' },
-];
+import { Fragment, useEffect } from 'react';
+import styles from './index.less';
 
 function List(props) {
   const { loading, list, processList = [], dispatch } = props;
 
   const { projectId } = useParams();
-  const [form] = Form.useForm();
-  const [pagination, setPagination] = useState({ pageSize: 10, current: 1 });
-  const [groupId, setGroupId] = useState('');
 
   const getColumns = () => {
     return [
@@ -77,150 +67,57 @@ function List(props) {
     ];
   };
 
-  const getRecord = async (pagination) => {
-    form.validateFields().then((fieldsValue) => {
-      fieldsValue.projectId = projectId;
-      fieldsValue.auto = 1;
-      fieldsValue.startDate = dayjs(fieldsValue.startDate).format('YYYY-MM-DD');
-      fieldsValue.endDate = dayjs(fieldsValue.endDate).format('YYYY-MM-DD');
-      fieldsValue.pageSize = pagination.pageSize;
-      fieldsValue.currentPage = pagination.current;
-      dispatch({
-        type: 'patrolArtificialRecord/queryPatrol',
-        payload: { ...fieldsValue },
-        callback: (data) => {
-          setPagination(data.pagination);
-        },
-      });
-    });
-  };
-
-  const handleSearch = (e) => {
-    e?.preventDefault();
-    getRecord(pagination);
-  };
-  const TableOnChange = (tempPagination) => {
-    getRecord(tempPagination);
-  };
-  const goToDetail = (record, e) => {
-    e.stopPropagation();
+  const goToDetail = (record) => {
     UnityAction.sendMsg('reportDetail', '');
     history.push(
-      `/self-inspection/detail/${projectId}/${record.Id}?JWT-TOKEN=${GetTokenFromUrl()}`,
+      `/self-inspection/detail/${projectId}/${
+        record.Id
+      }?JWT-TOKEN=${GetTokenFromUrl()}`,
     );
   };
 
   useEffect(() => {
-    UnityAction.sendMsg('type', 2);
-    handleSearch();
-
-    dispatch({
-      type: 'patrolArtificialRecord/queryRouteInfoList',
-      payload: { ProjectId: projectId },
-    });
+    let params = {};
+    params.projectId = projectId;
+    params.auto = 1;
+    params.startDate = dayjs().subtract(1).format('YYYY-MM-DD');
+    params.endDate = dayjs().format('YYYY-MM-DD');
+    params.pageSize = 100;
+    params.currentPage = 1;
     dispatch({
-      type: 'patrolArtificialRecord/queryProcessSection',
-      payload: projectId,
+      type: 'patrolArtificialRecord/queryPatrol',
+      payload: params,
     });
-
-    UnityAction.addEventListener('group_id', (e) => {
-      setGroupId(e);
-    });
-
-    return () => {
-      UnityAction.off('group_id');
-    };
   }, []);
   return (
     <PageContent closeable={false}>
       <PageTitle returnable>自检记录</PageTitle>
-      <Form
-        layout="vertical"
-        labelAlign="left"
-        labelCol={{ span: 8 }}
-        wrapperCol={{ span: 16 }}
-        onSubmit={handleSearch}
-        form={form}
-      >
-        <Row gutter={16}>
-          <Col span={12}>
-            <FormItem
-              label="开始时间"
-              name="startDate"
-              initialValue={dayjs().subtract(1, 'M')}
-            >
-              <div style={{ width: '95%' }}>
-                <DatePicker allowClear={false} placeholder="选择开始日期" />
+
+      <div className={styles.list}>
+        {list.map((item) => (
+          <div className={styles.item} onClick={() => goToDetail(item)}>
+            {item.Status == 0 ? (
+              <div className={`${styles.status}`}>正常</div>
+            ) : (
+              <div className={`${styles.status} ${styles.statusError}`}>
+                异常
               </div>
-            </FormItem>
-          </Col>
-          <Col span={12}>
-            <FormItem label="结束时间" name="endDate" initialValue={dayjs()}>
-              <div style={{ width: '95%' }}>
-                <DatePicker allowClear={false} placeholder="选择结束日期" />
+            )}
+            <div className={styles.info}>
+              <div className={styles.time}>
+                <i></i>自检时间：{dayjs(item.CreatedTime).format('MM-DD HH:mm')}
               </div>
-            </FormItem>
-          </Col>
-        </Row>
-        <Row gutter={16}>
-          <Col span={12}>
-            <FormItem label="状态" name="status">
-              <Select
-                placeholder="选择状态"
-                allowClear
-                style={{ width: '95%' }}
-              >
-                {statusList.map((item) => {
-                  return (
-                    <Option key={item.key} value={item.value}>
-                      {item.label}
-                    </Option>
-                  );
-                })}
-              </Select>
-            </FormItem>
-          </Col>
-          <Col span={12}>
-            <FormItem label="工艺段" name="groupId">
-              <Select
-                placeholder="选择工艺段"
-                allowClear
-                style={{ width: '95%' }}
-              >
-                {processList?.map((item) => {
-                  return (
-                    <Option key={item.id} value={item.group_id}>
-                      {item.name}
-                    </Option>
-                  );
-                })}
-              </Select>
-            </FormItem>
-          </Col>
-        </Row>
-        <div style={{ overflow: 'hidden' }}>
-          <Button
-            type="primary"
-            htmlType="submit"
-            style={{ float: 'right', marginBottom: 10 }}
-          >
-            查询
-          </Button>
-        </div>
-      </Form>
-      <div className="table-total">当前列表总数 {pagination?.total || 0}</div>
-      <Table
-        bordered
-        loading={loading}
-        columns={getColumns()}
-        dataSource={list.filter((item) => {
-          if (!groupId) return true;
-          if (groupId == item.RouteInfo.GroupID) return true;
-          return false;
-        })}
-        pagination={pagination}
-        onChange={TableOnChange}
-      />
+              {/* <div className={styles.desc}>
+                <i></i>
+                发现异常
+                <span className={styles.number}>4</span>
+                <span>项</span>
+              </div> */}
+            </div>
+            <div className={styles.btn}></div>
+          </div>
+        ))}
+      </div>
     </PageContent>
   );
 }

src/pages/EqSelfInspection/List/index.less

@@ -1,6 +1,68 @@
-.clickRow {
-  background-color: #225ea8;
-}
-.ant-table-tbody > .clickRow:hover > td {
-  background-color: #225ea8;
+.list {
+  margin-top: 40px;
+  .item {
+    padding: 94px 20px 56px;
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 14px;
+    background: #ffffff;
+    box-shadow: 0px 0px 8px 14px rgba(0, 0, 0, 0.03);
+    border-radius: 8px;
+    align-items: center;
+  }
+  .status {
+    width: 100px;
+    height: 100px;
+    font-size: 26px;
+    font-weight: 400;
+    color: #000000;
+    text-align: center;
+    line-height: 100px;
+    background: url('@/assets/circle-success.png') no-repeat center;
+  }
+  .statusError {
+    background-image: url('@/assets/circle-error.png');
+  }
+  .info {
+    flex: 1;
+    padding-left: 100px;
+    i {
+      width: 10px;
+      height: 10px;
+      display: inline-block;
+      vertical-align: middle;
+      border-radius: 50%;
+      margin-right: 10px;
+      background-color: rgba(74, 144, 226, 1);
+    }
+  }
+  .time {
+    font-size: 18px;
+    font-weight: 400;
+    color: #4a4a4a;
+    line-height: 24px;
+  }
+  .desc {
+    font-size: 24px;
+    font-weight: 400;
+    color: #4a4a4a;
+    line-height: 34px;
+    .number {
+      font-size: 40px;
+      font-weight: 500;
+      color: #f5a623;
+      line-height: 56px;
+      margin-left: 8px;
+    }
+
+    span {
+      font-size: 22px;
+      color: #000000;
+    }
+  }
+  .btn {
+    width: 17px;
+    height: 26px;
+    background: url('@/assets/arr-right.png') no-repeat center;
+  }
 }

src/pages/EqSelfInspection/index.js

@@ -1,7 +1,6 @@
 import PageContent from '@/components/PageContent';
 import PageTitle from '@/components/PageTitle';
 import { GetTokenFromUrl, UnityAction } from '@/utils/utils';
-import { DiffFilled, FundFilled } from '@ant-design/icons';
 import { connect, history, useLocation, useParams } from '@umijs/max';
 import { Button, Form, Modal, Select, Spin, message } from 'antd';
 import dayjs from 'dayjs';
@@ -112,46 +111,49 @@ const EqSelfInspection = (props) => {
     <PageContent>
       <PageTitle>系统自检</PageTitle>
       <Spin spinning={loading} tip="正在自检中...">
-        <div className={`${styles.itemMain} card-box`} style={{ padding: 20 }}>
-          <div style={{ position: 'relative', display: 'flex' }}>
-            <div style={{ fontSize: 24 }}>
-              自检间隔：{autoReport?.RouteInfo?.PlanDur}h
-            </div>
-            <div className={styles.icon}>
-              <DiffFilled
-                style={{ cursor: 'pointer', marginRight: 20 }}
-                onClick={() => {
-                  history.push(
-                    `/self-inspection/list/${projectId}`,
-                  );
-                }}
-              />
-              <FundFilled
-                onClick={() => {
-                  history.push(
-                    `/self-inspection/statistics/${projectId}?JWT-TOKEN=${GetTokenFromUrl()}`,
-                  );
-                }}
-              />
-            </div>
+        <div
+          className={`${styles.itemMain} card-box`}
+          style={{ padding: '10px 20px' }}
+        >
+          <div style={{ fontSize: 20, color: 'rgba(110, 110, 110, 1)' }}>
+            自检间隔：{autoReport?.RouteInfo?.PlanDur}h
+          </div>
+
+          <div className={styles.icon}>
+            <div
+              className={styles.iconDiffFilled}
+              onClick={() => {
+                history.push(`/self-inspection/list/${projectId}`);
+              }}
+            ></div>
+            <div
+              className={styles.iconFundFilled}
+              onClick={() => {
+                history.push(
+                  `/self-inspection/statistics/${projectId}?JWT-TOKEN=${GetTokenFromUrl()}`,
+                );
+              }}
+            ></div>
           </div>
           <div className={styles.logoInfo}>
             <div className={styles.logo} />
-            <div style={{ display: 'flex', fontSize: 20 }}>
+            <div className={styles.logoTitle}>
               <div>系统自检发现</div>
               <div
                 style={{
-                  color: autoReport?.warningTotalNum === 0 ? '#333' : '#FE5850',
-                  margin: '0 6px 0 6px',
+                  color:
+                    autoReport?.warningTotalNum === 0
+                      ? '#333'
+                      : 'rgba(254, 88, 80, 1)',
+                  margin: '0 6px',
                 }}
               >
                 {autoReport?.warningTotalNum === 0
                   ? '暂无'
-                  : autoReport?.warningTotalNum || 0}
+                  : autoReport?.warningTotalNum + '项异常'}
               </div>
-              <div>项异常</div>
             </div>
-            <div style={{ fontSize: 20 }}>
+            <div className={styles.logoTime}>
               {autoReport?.CreatedTime
                 ? dayjs(autoReport?.CreatedTime).format('YYYY-MM-DD HH:mm')
                 : ''}
@@ -160,17 +162,10 @@ const EqSelfInspection = (props) => {
               <Button type="primary" onClick={HandleInspection}>
                 一键自检
               </Button>
-              <div
-                style={{
-                  position: 'absolute',
-                  display: 'flex',
-                  alignItems: 'flex-end',
-                  right: 0,
-                  height: '100%',
-                }}
-              >
-                <div>系统自检中</div>
-              </div>
+            </div>
+            <div className={styles.logoFont}>
+              系统自检中
+              <div className={styles.iconSetting}></div>
             </div>
           </div>
         </div>
@@ -192,20 +187,19 @@ const EqSelfInspection = (props) => {
             <WarningItem label={item.label} status={item.status} />
           ))}
         </Item>
-        <div className={styles.reportBtn}>
-          <Button
-            type="primary"
-            onClick={() => {
-              history.push(
-                `/self-inspection/detail/${projectId}/${
-                  autoReport?.Id
-                }?JWT-TOKEN=${GetTokenFromUrl()}`,
-              );
-            }}
-          >
-            查看自检报告
-          </Button>
-        </div>
+        <Button
+          className={styles.reportBtn}
+          type="primary"
+          onClick={() => {
+            history.push(
+              `/self-inspection/detail/${projectId}/${
+                autoReport?.Id
+              }?JWT-TOKEN=${GetTokenFromUrl()}`,
+            );
+          }}
+        >
+          查看自检报告
+        </Button>
 
         <Modal
           title="选择巡检路线"
@@ -253,11 +247,7 @@ const Item = (props) => {
   const renderRight = (status) => {
     switch (status) {
       case 0:
-        return (
-          <div className={styles.right} style={{ color: '#52c41a' }}>
-            正常
-          </div>
-        );
+        return <div className={`${styles.iconSuccess} ${styles.right}`}></div>;
       case 1:
         return (
           <div className={styles.right} style={{ color: '#FE5850' }}>
@@ -268,22 +258,13 @@ const Item = (props) => {
         return;
       // return <SyncOutlined className={styles.right} spin />;
       default:
-        return (
-          <div className={styles.right} style={{ color: '#52c41a' }}>
-            正常
-          </div>
-        );
+        return <div className={`${styles.iconSuccess} ${styles.right}`}></div>;
     }
   };
   return (
-    <div
-      className={`${styles.itemMain} card-box`}
-      style={{
-        paddingBottom: children ? 20 : 0,
-      }}
-    >
-      <div className={styles.item}>
-        <span>{name}</span>
+    <div className={`${styles.itemMain} card-box`}>
+      <div className={styles.item} style={{ height: children ? 60 : '' }}>
+        <span className={styles.itemName}>{name}</span>
         <span className={styles.warningText}>{warningText}</span>
         {renderRight(status)}
       </div>
@@ -297,16 +278,18 @@ const WarningItem = (props) => {
   return (
     <div className={styles.warningItem}>
       <span>{label}</span>
-      <div
-        style={{
-          color: status === 1 ? '#FE5850' : '#52c41a',
-          fontSize: 20,
-          position: 'absolute',
-          right: 20,
-        }}
-      >
-        {status === 0 ? '正常' : '异常'}
-      </div>
+
+      {status === 0 ? (
+        <div className={styles.iconSuccess}></div>
+      ) : (
+        <span
+          style={{
+            color: '#FE5850',
+          }}
+        >
+          异常
+        </span>
+      )}
     </div>
   );
 };

src/pages/EqSelfInspection/index.less

@@ -1,10 +1,18 @@
 .icon {
   position: absolute;
-  right: 0;
-  font-size: 24px;
-  color: #40a9ff;
-  i {
-    margin-left: 10px;
+  top: 10px;
+  right: 18px;
+  display: flex;
+  .iconDiffFilled,
+  .iconFundFilled {
+    width: 28px;
+    height: 31px;
+    cursor: pointer;
+    background: url('@/assets/iconDiffFilled.png') no-repeat;
+  }
+  .iconFundFilled {
+    margin-left: 20px;
+    background-image: url('@/assets/iconFundFilled.png');
   }
 }
 .logoInfo {
@@ -12,11 +20,44 @@
   flex-direction: column;
   justify-content: center;
   align-items: center;
+  position: relative;
   .logo {
     background: url('@/assets/defense.png') no-repeat center;
     background-size: 100% 100%;
     width: 144px;
     height: 159px;
+    margin-bottom: 6px;
+  }
+  .logoTitle {
+    font-size: 20px;
+    font-weight: 400;
+    color: #6e6e6e;
+    line-height: 28px;
+    display: flex;
+  }
+  .logoTime {
+    font-size: 16px;
+    font-weight: 400;
+    color: #6e6e6e;
+    line-height: 22px;
+    margin-top: 6px;
+  }
+  .logoFont {
+    position: absolute;
+    display: flex;
+    align-items: center;
+    right: 0;
+    bottom: 0;
+    font-size: 20px;
+    font-weight: 400;
+    color: #6e6e6e;
+    line-height: 28px;
+    .iconSetting {
+      margin-left: 8px;
+      width: 20px;
+      height: 20px;
+      background: url('@/assets/icon-setting.png') no-repeat;
+    }
   }
 }
 .insbtn {
@@ -35,27 +76,30 @@
   }
 }
 .item {
-  // border: 2px;
-  // border-radius: 12px;
-  // background-color: rgba(240, 248, 255, 0.549);
-  min-height: 60px;
+  height: 80px;
   display: flex;
   align-items: center;
   position: relative;
-  span:first-child {
-    margin-left: 10px;
-    font-size: 22px;
-  }
+  padding: 0 20px;
   .right {
     position: absolute;
     right: 0;
     margin-right: 10px;
-    font-size: 24px;
+    font-size: 20px;
   }
   .warningText {
+    margin-left: 40px;
     font-size: 20px;
+    font-weight: 400;
     color: #fe5850;
-    margin-left: 40px;
+    line-height: 28px;
+  }
+  .itemName {
+    font-size: 20px;
+    font-weight: 500;
+    color: #4a4a4a;
+    line-height: 28px;
+    font-weight: bold;
   }
 }
 .warningItem {
@@ -63,14 +107,29 @@
   height: 60px;
   display: flex;
   align-items: center;
-  margin: 0 60px 0 60px;
+  justify-content: space-between;
+  padding: 0 20px;
+  border-bottom: 1px solid rgba(219, 219, 219, 1);
+  &:last-child {
+    border-bottom: none;
+  }
   span {
     font-size: 20px;
   }
 }
+.iconSuccess {
+  width: 28px;
+  height: 22px;
+  background: url('@/assets/icon-success.png') no-repeat;
+}
 .reportBtn {
-  display: flex;
-  justify-content: center;
+  margin-top: 40px;
+  width: 100%;
+  height: 70px;
+  display: block;
+  font-size: 22px;
+  font-weight: 400;
+  color: #ffffff;
 }
 .itemMain {
   background-size: 100% 100%;
@@ -92,7 +151,7 @@
   flex: 1;
   font-size: 26px;
   .num {
-    color: #F5AF3A;
+    color: #f5af3a;
     font-size: 30px;
     margin-bottom: 14px;
     font-weight: bold;

src/pages/Smart/OptimizationTasks.js

@@ -125,6 +125,7 @@ const Produce = ({ projectId, queryMandate }) => {
               style={{ width: '100%' }}
               columns={columns}
               dataSource={data}
+              pagination={false}
             />
           </div>
         </>
@@ -207,7 +208,12 @@ const Cost = ({ projectId }) => {
           >
             <h3 className={styles.left}>任务内容</h3>
 
-            <Table className="table2" columns={columns} dataSource={data} />
+            <Table
+              className="table2"
+              columns={columns}
+              dataSource={data}
+              pagination={false}
+            />
           </div>
         </>
       )}

src/pages/Smart/OptimizationTasks.less

@@ -79,8 +79,10 @@
   text-align: center;
   float: right;
 }
-:global {
-  .table2 .ant-table-thead {
-    background: rgba(245, 166, 35, 0.14);
+.table2 {
+  :global {
+    .ant-table-thead {
+      background: rgba(245, 166, 35, 0.14);
+    }
   }
 }

src/pages/TaskManage/Detail/TaskDetail/TaskDetail.tsx

@@ -98,14 +98,21 @@ function TaskDetail(props: IPropsType) {
       <div className={`${styles.cardContainer} card-box`}>
         <div className={styles.normalInfo}>
           <Row className={styles.infoRow}>
-            <Col span={16}>时间：{mandateDetail?.CreateTime}</Col>
+            <Col className={styles.fontS18} span={16}>
+              时间：{mandateDetail?.CreateTime}
+            </Col>
             {/*// @ts-ignore*/}
-            <Col span={8}>任务类别：{mandateDetail?.MandateClass?.label}</Col>
+            <Col className={styles.fontS18} span={8}>
+              {/*//@ts-ignore*/}
+              任务类别：{mandateDetail?.MandateClass?.label}
+            </Col>
           </Row>
           <Row>
-            {/*// @ts-ignore*/}
-            <Col span={16}>任务状态：{mandateDetail?.Status?.label}</Col>
-            <Col span={8}>
+            <Col className={styles.fontS18} span={16}>
+              {/*//@ts-ignore*/}
+              任务状态：{mandateDetail?.Status?.label}
+            </Col>
+            <Col className={styles.fontS18} span={8}>
               {/*// @ts-ignore*/}
               任务负责人：{mandateDetail?.ResponsiblePeople?.CName}
             </Col>
@@ -113,45 +120,61 @@ function TaskDetail(props: IPropsType) {
         </div>
         <div className={styles.detailInfo}>
           <Row className={styles.infoRow}>
-            <Col span={4}>任务总结</Col>
-            <Col>{mandateDetail?.Summary}</Col>
+            <Col className={styles.fontS18} span={4}>
+              任务总结
+            </Col>
+            <Col className={styles.fontS18}>{mandateDetail?.Summary}</Col>
           </Row>
           <Row>
-            <Col span={4}>任务内容</Col>
-            <Col span={20}>
+            <Col className={styles.fontS18} span={4}>
+              任务内容
+            </Col>
+            <Col className={styles.fontS18} span={20}>
               <Col>{mandateDetail?.Detail}</Col>
               {/*<Table />*/}
             </Col>
           </Row>
         </div>
         <div className={styles.relatedOrder}>
-          <h3 style={{ marginLeft: '15px' }}>关联工单</h3>
+          <div
+            className={styles.fontS22}
+            style={{ marginLeft: '15px', marginBottom: '15px' }}
+          >
+            关联工单
+          </div>
           {handledWorkOrder.map((order) => {
             return (
               <div key={order.Id} className={styles.workOrderCard}>
                 <div className={styles.leftInfo}>
                   <Row className={styles.infoRow}>
-                    <Col span={12}>工单编号：{order.Id}</Col>
-                    <Col span={12}>时间：{order.CreateTime}</Col>
+                    <Col className={styles.fontS18} span={12}>
+                      工单编号：{order.Id}
+                    </Col>
+                    <Col className={styles.fontS18} span={12}>
+                      时间：{order.CreateTime}
+                    </Col>
                   </Row>
                   <Row>
-                    <Col span={12}>
+                    <Col className={styles.fontS18} span={12}>
                       工单状态：
                       <span style={{ color: '#5697e4' }}>
                         {/*// @ts-ignore*/}
                         {order.Status?.label}
                       </span>
                     </Col>
-                    {/*// @ts-ignore*/}
-                    <Col span={12}>工单负责人：{order.Responsible?.CName}</Col>
+                    <Col className={styles.fontS18} span={12}>
+                      {/*// @ts-ignore*/}
+                      工单负责人：{order.Responsible?.CName}
+                    </Col>
                   </Row>
                 </div>
                 <Divider type="vertical" style={{ height: '40px' }} />
                 <div className={styles.rightButton}>
                   <Button
+                    className={styles.fontS18}
                     style={{ color: '#5697e4' }}
                     type="text"
-                    ghost
+                    size="large"
                     onClick={() => {
                       // @ts-ignore
                       goTaskOrder(order.Id, order.RecordType?.value);

src/pages/TaskManage/Detail/TaskDetail/taskDetail.less

@@ -1,24 +1,24 @@
-.cardContainer{
+.cardContainer {
   margin-top: 15px;
   padding: 20px 20px;
   background-color: white;
 
-  .normalInfo{
+  .normalInfo {
     padding: 15px 15px;
     background-color: #fdf2df;
   }
 
-  .infoRow{
+  .infoRow {
     margin-bottom: 15px;
   }
 
 
-  .detailInfo{
+  .detailInfo {
     padding: 15px 15px;
     border-bottom: 1px solid gray;
   }
 
-  .relatedOrder{
+  .relatedOrder {
     margin-top: 15px;
   }
 
@@ -43,6 +43,24 @@
       align-items: center;
     }
   }
+}
 
+.fontS24 {
+  font-size: 24px;
+}
 
-}
+.fontS22 {
+  font-size: 22px;
+}
+
+.fontS20 {
+  font-size: 20px;
+}
+
+.fontS18 {
+  font-size: 18px;
+}
+
+.fontS16 {
+  font-size: 16px;
+}

src/pages/TaskManage/Detail/TaskList/TaskList.tsx

@@ -178,24 +178,32 @@ const TaskList: React.FC<IPropsType> = (props) => {
             <div key={order.Id} className={styles.workOrderCard}>
               <div className={styles.leftInfo}>
                 <Row style={{ marginBottom: '15px' }}>
-                  <Col span={12}>工单编号：{order.Id}</Col>
-                  <Col span={12}>时间：{order.CreateTime}</Col>
+                  <Col className={styles.fontS18} span={12}>
+                    工单编号：{order.Id}
+                  </Col>
+                  <Col className={styles.fontS18} span={12}>
+                    时间：{order.CreateTime}
+                  </Col>
                 </Row>
                 <Row>
-                  <Col span={12}>
+                  <Col className={styles.fontS18} span={12}>
                     工单状态：
                     <span style={{ color: '#5697e4' }}>
                       {order.Status?.label}
                     </span>
                   </Col>
-                  <Col span={12}>工单负责人：{order.Responsible?.CName}</Col>
+                  <Col className={styles.fontS18} span={12}>
+                    工单负责人：{order.Responsible?.CName}
+                  </Col>
                 </Row>
               </div>
               <Divider type="vertical" style={{ height: '40px' }} />
               <div className={styles.rightButton}>
                 <Button
+                  size='large'
+                  className={styles.fontS18}
                   style={{ color: '#5697e4' }}
-                  type='text'
+                  type="text"
                   onClick={() => {
                     goTaskOrder(order.Id, order.RecordType?.value);
                   }}
@@ -213,15 +221,21 @@ const TaskList: React.FC<IPropsType> = (props) => {
       <List.Item>
         <div className={`${styles.cardContainer} card-box`}>
           <Row justify="space-between" style={{ marginBottom: '20px' }}>
-            <Col>时间：{formatItem.CreateTime}</Col>
-            <Col>任务类别：{formatItem.MandateClass?.label}</Col>
-            <Col>任务负责人：{formatItem.ResponsiblePeople?.CName || '-'}</Col>
+            <Col className={styles.fontS18}>时间：{formatItem.CreateTime}</Col>
+            <Col className={styles.fontS18}>
+              任务类别：{formatItem.MandateClass?.label}
+            </Col>
+            <Col className={styles.fontS18}>
+              任务负责人：{formatItem.ResponsiblePeople?.CName || '-'}
+            </Col>
           </Row>
           <Row
             justify="space-between"
             style={{ paddingBottom: '10px', borderBottom: '1px solid gray' }}
           >
-            <Col>任务状态：{formatItem.Status?.label || '-'}</Col>
+            <Col className={styles.fontS18}>
+              任务状态：{formatItem.Status?.label || '-'}
+            </Col>
             <Col>
               <div
                 style={{
@@ -229,8 +243,10 @@ const TaskList: React.FC<IPropsType> = (props) => {
                 }}
               >
                 <Button
+                  className={styles.fontS18}
                   style={{ color: 'white' }}
                   type="text"
+                  size="large"
                   onClick={() => {
                     goTaskDetail(item);
                   }}

src/pages/TaskManage/Detail/TaskList/taskList.less

@@ -1,20 +1,31 @@
 .cardContainer {
   width: 100%;
-  padding: 20px;
+  padding: 20px 20px 10px 20px;
   background-color: white;
 
   .collapseLabel {
     width: 100%;
-
+    .ant-collapse-arrow{
+      font-size: 18px;
+    }
     :global {
+      .ant-collapse-item{
+        margin-bottom: 0;
+      }
       .ant-collapse-header {
         justify-content: center;
         flex-direction: row-reverse;
+        align-items: center;
+        margin-top: 10px;
 
         .ant-collapse-header-text {
+          font-size: 18px;
           flex: unset;
           margin-inline-end: unset;
         }
+        .ant-collapse-arrow{
+          font-size: 18px;
+        }
       }
     }
 
@@ -41,3 +52,15 @@
     }
   }
 }
+
+.fontS20{
+  font-size: 20px;
+}
+
+.fontS18{
+  font-size: 18px;
+}
+
+.fontS16{
+  font-size: 16px;
+}

src/pages/TaskManage/Detail/TaskOrder/TaskOrder.tsx

@@ -2,7 +2,7 @@ import PageContent from '@/components/PageContent';
 import PageTitle from '@/components/PageTitle';
 import { IUserType } from '@/pages/TaskManage/Detail/TaskList/taskList.types';
 import SubTitle from '@/pages/TaskManage/components/SubTitle';
-import { CraftOrderStatus, MaintainOrderStatus, RepairOrderStatus } from "@/pages/TaskManage/constent";
+import { OrderStatus } from '@/pages/TaskManage/constent';
 import {
   getCraftRecordList,
   getMaintainRecordList,
@@ -11,7 +11,7 @@ import {
 import { useLocation } from '@@/exports';
 import { connect, useRequest } from '@umijs/max';
 import { Col, Row } from 'antd';
-import { DefaultOptionType } from "rc-select/es/Select";
+import { DefaultOptionType } from 'rc-select/es/Select';
 import React, { useEffect, useState } from 'react';
 import styles from './taskOrder.less';
 
@@ -50,10 +50,11 @@ const TaskOrder: React.FC<IPropsType> = (props) => {
         PlanTime: temp.PlanTime,
         RepairTime: '-',
         Reason: temp.Note,
-        Repairman: userList.find((item) => item.ID === temp.MaintenancePerson) || '-',
+        Repairman:
+          userList.find((item) => item.ID === temp.MaintenancePerson) || '-',
         OrderStatus:
-          MaintainOrderStatus.find((item) => item.value === temp.Status) || '-',
-      }
+          OrderStatus.find((item) => item.value === temp.Status) || '-',
+      };
       setOrderInfo(tempDetail);
     },
   });
@@ -62,7 +63,6 @@ const TaskOrder: React.FC<IPropsType> = (props) => {
   const { run: getRepairDetail } = useRequest(getRepairRecordList, {
     manual: true,
     formatResult: (result: any) => {
-
       const temp = result.data.list[0];
       const tempDetail: IOrderInfo = {
         CreateTime: temp.CreateTime,
@@ -71,7 +71,8 @@ const TaskOrder: React.FC<IPropsType> = (props) => {
         Reason: temp.Reason,
         Repairman: userList.find((item) => item.ID === temp.Repairman) || '-',
         OrderStatus:
-          RepairOrderStatus.find((item) => item.value === temp.AcceptanceStatus) || '-',
+          OrderStatus.find((item) => item.value === temp.AcceptanceStatus) ||
+          '-',
       };
       setOrderInfo(tempDetail);
     },
@@ -89,8 +90,8 @@ const TaskOrder: React.FC<IPropsType> = (props) => {
         Reason: temp.detail,
         Repairman: userList.find((item) => item.ID === temp.operator_id) || '-',
         OrderStatus:
-          CraftOrderStatus.find((item) => item.value === temp.status) || '-',
-      }
+          OrderStatus.find((item) => item.value === temp.status) || '-',
+      };
       setOrderInfo(tempDetail);
     },
   });
@@ -118,38 +119,54 @@ const TaskOrder: React.FC<IPropsType> = (props) => {
     }
   }, []);
 
-
   return (
     <PageContent>
       <PageTitle returnable>工单详情</PageTitle>
       <div className={styles.selfCardBox}>
         <div className={styles.orderInfo}>
-          <SubTitle title="工单信息" statusStr="已完成" radius />
+          <SubTitle
+            title="工单信息"
+            // @ts-ignore
+            showStatus={orderInfo?.OrderStatus.value === 2}
+            radius
+          />
           <div style={{ padding: '15px' }}>
             <Row className={styles.rowMargin}>
-              <Col span={16}>时间：{'-'}</Col>
-              <Col span={8}>
+              <Col className={styles.fontS18} span={16}>
+                时间：{'-'}
+              </Col>
+              <Col className={styles.fontS18} span={8}>
                 {/*// @ts-ignore*/}
                 工单负责人：{orderInfo?.Repairman?.CName || '-'}
               </Col>
             </Row>
             <Row className={styles.rowMargin}>
-              {/*// @ts-ignore*/}
-              <Col span={16}>工单状态：{orderInfo?.OrderStatus?.label}</Col>
-              <Col span={8}>派单人员：{'-'}</Col>
+              <Col className={styles.fontS18} span={16}>
+                {/*// @ts-ignore*/}
+                工单状态：{orderInfo?.OrderStatus?.label}
+              </Col>
+              <Col className={styles.fontS18} span={8}>
+                派单人员：{'-'}
+              </Col>
             </Row>
             <Row className={styles.rowMargin}>
-              <Col>派单时间：{orderInfo?.CreateTime || '-'}</Col>
+              <Col className={styles.fontS18}>
+                派单时间：{orderInfo?.CreateTime || '-'}
+              </Col>
             </Row>
             <Row className={styles.rowMargin}>
-              <Col>计划完成时间：{orderInfo?.PlanTime || '-'}</Col>
+              <Col className={styles.fontS18}>
+                计划完成时间：{orderInfo?.PlanTime || '-'}
+              </Col>
             </Row>
             <Row className={styles.rowMargin}>
-              <Col>实际完成时间：{orderInfo?.RepairTime || '-'}</Col>
+              <Col className={styles.fontS18}>
+                实际完成时间：{orderInfo?.RepairTime || '-'}
+              </Col>
             </Row>
             <Row>
-              <Col span={4}>工单详情：</Col>
-              <Col span={20}>
+              <Col className={styles.fontS18}>工单详情：</Col>
+              <Col className={styles.fontS18} span={20}>
                 {orderInfo?.Reason}
                 {/*<Table />*/}
               </Col>
@@ -160,10 +177,10 @@ const TaskOrder: React.FC<IPropsType> = (props) => {
         {/*  <SubTitle title="维修内容" />*/}
         {/*  <div style={{ padding: '15px' }}>*/}
         {/*    <Row className={styles.rowMargin}>*/}
-        {/*      <Col>是否润滑加油：否</Col>*/}
+        {/*      <Col className={styles.fontS18}>是否润滑加油：否</Col>*/}
         {/*    </Row>*/}
         {/*    <Row>*/}
-        {/*      <Col>是否清洁：否</Col>*/}
+        {/*      <Col className={styles.fontS18} >是否清洁：否</Col>*/}
         {/*    </Row>*/}
         {/*  </div>*/}
         {/*</div>*/}

src/pages/TaskManage/Detail/TaskOrder/taskOrder.less

@@ -13,3 +13,23 @@
 .rowMargin {
   margin-bottom: 15px;
 }
+
+.fontS24 {
+  font-size: 24px;
+}
+
+.fontS22 {
+  font-size: 22px;
+}
+
+.fontS20 {
+  font-size: 20px;
+}
+
+.fontS18 {
+  font-size: 18px;
+}
+
+.fontS16 {
+  font-size: 16px;
+}

src/pages/TaskManage/components/SubTitle.tsx

@@ -3,10 +3,17 @@ import React from 'react';
 interface IPropsType {
   title: string;
   statusStr?: string;
+  showStatus?: boolean;
   radius?: boolean;
 }
 
-const SubTitle: React.FC<IPropsType> = ({ title, statusStr='', radius=false }) => {
+const SubTitle: React.FC<IPropsType> = ({
+  title,
+  statusStr = '',
+  showStatus = false,
+  radius = false,
+}) => {
+  const img = require('@/assets/TaskManage/yiwancheng.png');
   return (
     <div
       style={{
@@ -15,19 +22,31 @@ const SubTitle: React.FC<IPropsType> = ({ title, statusStr='', radius=false }) =
         display: 'flex',
         justifyContent: 'space-between',
         alignItems: 'center',
-        paddingLeft: '10px',
+        paddingLeft: '20px',
         paddingRight: '10px',
         backgroundColor: '#d9e7f9',
-        fontSize: '18px',
-        height: '40px',
+        fontSize: '20px',
+        height: '66px',
         borderRadius: radius ? '8px 8px 0 0 ' : 'unset',
       }}
     >
       <div>
-        <span style={{ border: '2px solid #4a90e2', marginRight: '5px' }} />
+        <span style={{ border: '2px solid #4a90e2', marginRight: '8px' }} />
         {title}
       </div>
-      <div>{statusStr}</div>
+      {showStatus && (
+        <div>
+          <img
+            src={img}
+            alt="status"
+            style={{
+              position: 'absolute',
+              right: '10px',
+              top: '34px',
+            }}
+          />
+        </div>
+      )}
     </div>
   );
 };

src/pages/TaskManage/components/TopFilter.tsx

@@ -1,6 +1,7 @@
 import { ITopFilter } from '@/pages/TaskManage/Detail/TaskList/taskList.types';
-import { Divider, Select } from 'antd';
-import { useState } from 'react';
+import { Col,  Row, Select } from 'antd';
+import {  useState } from "react";
+import '../index.less'
 
 interface IProps {
   filters: ITopFilter[];
@@ -9,13 +10,18 @@ interface IProps {
 
 const TopFilter: React.FC<IProps> = ({ filters, onChange }) => {
   const [values, setValues] = useState<any[]>([]);
+
   return (
-    <div style={{ display: 'flex', justifyContent: 'center' }}>
+    <Row justify="space-around">
       {filters.map((item, index) => {
         return (
-          <div key={item.key}>
+          <Col
+            key={item.key}
+            span={Math.floor(22 / filters.length)}
+            style={{ textAlign: 'center' }}
+          >
             <Select
-              style={{ width: 120 }}
+              className='antdSelect'
               size="large"
               bordered={false}
               placeholder={item.placeholder}
@@ -32,13 +38,10 @@ const TopFilter: React.FC<IProps> = ({ filters, onChange }) => {
                 onChange(temp);
               }}
             />
-            {filters.length > 1 && index !== filters.length - 1 && (
-              <Divider type="vertical" style={{ margin: '0 30px' }} />
-            )}
-          </div>
+          </Col>
         );
       })}
-    </div>
+    </Row>
   );
 };
 

src/pages/TaskManage/index.less

@@ -2,9 +2,10 @@
   border: none;
 
   .listItem {
-    margin: 20px 10px;
-    height: 10vh;
+    margin: 20px 20px 20px 0;
+    height: 12vh;
     box-shadow: 0 0 6px 3px rgba(0, 150, 255, 10%);
+    border-radius: 10px;
 
     .itemCount {
       display: flex;
@@ -15,7 +16,35 @@
       .countNumber {
         color: #f5a623;
         font-size: 24px;
+        margin-bottom: 6px;
       }
     }
   }
 }
+
+.antdSelect .ant-select-selection-item,
+.antdSelect .ant-select-selection-placeholder,
+.ant-select-item-option-content
+{
+  font-size: 20px;
+}
+
+.antdSelect .ant-select-selection-placeholder{
+  color: rgba(0,0,0,0.75);
+}
+
+.ant-select-dropdown{
+  width: unset;
+}
+
+.fontS20{
+  font-size: 20px;
+}
+
+.fontS18{
+  font-size: 18px;
+}
+
+.fontS16{
+  font-size: 16px;
+}

src/pages/TaskManage/index.tsx

@@ -49,10 +49,10 @@ const TaskManage: React.FC<IPropTypes> = (props) => {
           goTaskList(item.value);
         }}
       >
-        <List.Item.Meta title={item.label} />
+        <List.Item.Meta title={<span className={styles.fontS20}>{item.label}</span>} />
         <div className={styles.itemCount}>
           <div className={styles.countNumber}>{mandateCount[index]}</div>
-          <div>任务数量</div>
+          <div className={styles.fontS16}>任务数量</div>
         </div>
         <RightOutlined />
       </List.Item>