Prechádzať zdrojové kódy

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

Renxy 1 rok pred
rodič
commit
aadefd1699

BIN
src/assets/TaskManage/viewOrder.png


BIN
src/assets/TaskManage/viewOrder@2x.png


BIN
src/assets/arr-right2.png


+ 13 - 4
src/global.less

@@ -248,7 +248,9 @@ input[type='reset'] {
   padding-bottom: 0;
 }
 
-.ant-table,
+.ant-table {
+  background: #fff;
+}
 .ant-table-cell,
 .ant-table-placeholder {
   background: transparent !important;
@@ -273,14 +275,21 @@ input[type='reset'] {
   border-radius: 0;
   padding: 0.12rem 0.18rem;
   font-size: 0.28rem;
-  color: #fff;
-  line-height: 1;
+  color: rgba(97, 93, 93, 1);
+  line-height: 0.32rem;
   font-weight: normal;
   vertical-align: middle;
-  border: 0 none !important;
   border-radius: 0 !important;
 }
 
+.ant-table-wrapper .ant-table-thead > tr > th {
+  border: 0 none !important;
+  color: #fff;
+}
+.ant-table-wrapper .ant-table-tbody > tr > td {
+  border-bottom: 1px solid rgba(188, 186, 186, 1);
+}
+
 // .ant-table-tbody > tr:nth-child(even) {
 //   background: rgba(145, 192, 238, 0.16);
 // }

+ 3 - 0
src/pages/Controller/index.js

@@ -16,18 +16,21 @@ const HardwareController = (props) => {
         onClick={() => UnityAction.sendMsg('innerItem', 'scada')}
       >
         工艺监控
+        <div className={styles.arr}></div>
       </div>
       <div
         className={`card-box ${styles.itemLong}`}
         onClick={() => UnityAction.sendMsg('innerItem', 'sensor')}
       >
         感知监控
+        <div className={styles.arr}></div>
       </div>
       <div
         className={`card-box ${styles.itemLong}`}
         onClick={() => UnityAction.sendMsg('innerItem', 'locate')}
       >
         室内定位
+        <div className={styles.arr}></div>
       </div>
     </PageContent>
   );

+ 18 - 2
src/pages/Controller/index.less

@@ -28,14 +28,30 @@
   justify-content: space-between;
 }
 .itemLong {
-  padding: 0.4rem 0.6rem;
+  padding: 0.6rem 0.4rem 0.6rem 1rem;
   font-size: 0.32rem;
   margin-top: 0.28rem;
   display: flex;
   align-items: center;
+  justify-content: space-between;
+  font-family: Source Han Sans, Source Han Sans;
+  color: #615d5d;
+  line-height: 32px;
+  letter-spacing: 0.04rem;
+  box-shadow: 0.01rem 0.06rem 0.1rem 0rem rgba(0, 0, 0, 0.1);
+  .arr {
+    width: 0.14rem;
+    height: 0.22rem;
+    background: url('@/assets/arr-right2.png') no-repeat center;
+    background-size: 100% 100%;
+  }
 }
 .item {
-  .itemLong;
+  padding: 0.4rem 0.6rem;
+  font-size: 0.32rem;
+  margin-top: 0.28rem;
+  display: flex;
+  align-items: center;
   width: 48%;
 }
 .icon {

+ 9 - 10
src/pages/EqSelfInspection/components/Detail.js

@@ -141,6 +141,7 @@ function Detail(props) {
         </Row>
       </div>
       <div style={{ padding: 20, background: '#fff' }}>
+        <ModuleTitle title="设备自检" />
         {/* 设备自检报告 */}
         <ReportCom
           sendMessageToUnity={sendMessageToUnity}
@@ -150,7 +151,7 @@ function Detail(props) {
           key="extend"
           type={'extend'}
           userList={userList}
-          title={<ModuleTitle title="设备自检报告" />}
+          title={'设备自检报告'}
         ></ReportCom>
 
         {/* 液位异常 */}
@@ -161,7 +162,7 @@ function Detail(props) {
           key="liquid"
           type={'liquid'}
           userList={userList}
-          title={<ModuleTitle title="液位异常" />}
+          title={'液位异常'}
         />
         {/* 加药流量校验 */}
         {/* <FlowCom
@@ -185,6 +186,7 @@ function Detail(props) {
         </div>
         {/* 安全隐患自检报告"> */}
         <div className={styles.content}>
+          <ModuleTitle title="安全隐患自检报告" />
           {/* 环境异常 */}
           <ReportCom
             sendMessageToUnity={sendMessageToUnity}
@@ -195,7 +197,7 @@ function Detail(props) {
             key="sensor"
             type={'sensor'}
             userList={userList}
-            title={<ModuleTitle title="环境异常" />}
+            title={'环境异常'}
           ></ReportCom>
           {/* 液位异常 */}
           {/* <LiquidLevelCom
@@ -209,10 +211,7 @@ function Detail(props) {
           /> */}
 
           {/* 安防检测异常 */}
-          <ReportDumCom
-            data={dumuList}
-            title={<ModuleTitle title="安防检测异常" />}
-          />
+          <ReportDumCom data={dumuList} title={'安防检测异常'} />
 
           {/* 电器检测异常 */}
           <ReportCom
@@ -223,7 +222,7 @@ function Detail(props) {
             key="extend"
             type={'extend'}
             userList={userList}
-            title={<ModuleTitle title="电气检测异常" />}
+            title={'电气检测异常'}
           ></ReportCom>
 
           {/* 密闭空间检测异常 */}
@@ -235,7 +234,7 @@ function Detail(props) {
             key="extend"
             type={'extend'}
             userList={userList}
-            title={<ModuleTitle title="密闭空间检测异常" />}
+            title={'密闭空间检测异常'}
           ></ReportCom>
         </div>
       </div>
@@ -1175,7 +1174,7 @@ function ReportDumCom(props) {
     },
   ];
   return (
-    <div>
+    <div style={{ marginBottom: '0.3rem' }}>
       <div className={styles.tabBarExtraContent}>
         <div className={styles.text} style={{ width: '60%' }}>
           {title}

+ 12 - 6
src/pages/EqSelfInspection/components/PatrolReportDetail.less

@@ -23,12 +23,13 @@
   display: inline-block;
 }
 .detailCard {
-  margin: 0.1rem 0 0.1rem 0;
+  // margin: 0.2rem 0;
+  margin-bottom: 0.3rem;
 }
 .text {
-  .tabBarExtraContent;
   font-size: 0.26rem;
-  text-align: center;
+  text-align: left;
+  color: #1755ff;
 }
 .abnormal {
   // margin: 0.1rem 0 0.1rem 0;
@@ -45,6 +46,7 @@
   align-items: center;
   height: 100%;
   position: relative;
+  margin-bottom: 0.1rem;
 }
 .tableTop {
   position: relative;
@@ -52,6 +54,10 @@
   display: flex;
   justify-content: space-between;
   align-items: center;
+  font-size: 0.28rem;
+  font-family: Source Han Sans, Source Han Sans;
+  color: #1755ff;
+  line-height: 0.3rem;
 }
 .card {
   background: #fff;
@@ -117,14 +123,14 @@
   margin-bottom: 0.1rem;
 }
 .tableStatus {
-  color: #4a90e2;
+  color: #1755ff;
   font-size: 0.28rem;
   position: absolute;
   right: 0.1rem;
+  top: 0;
+  line-height: 1;
 }
 .content {
   margin-top: 0.5rem;
   position: relative;
 }
-:global {
-}

+ 3 - 3
src/pages/EqSelfInspection/index.js

@@ -126,9 +126,9 @@ const EqSelfInspection = (props) => {
         <div className="content-title">
           <div
             className={`${styles.itemMain} card-box`}
-            style={{ padding: '0.15rem 0.24rem', position: 'relative' }}
+            style={{ padding: '0.2rem 0.24rem', position: 'relative' }}
           >
-            <div style={{ fontSize: 28, color: 'rgb(110, 110, 110)' }}>
+            <div style={{ fontSize: "0.28rem", color: 'rgb(110, 110, 110)' }}>
               自检间隔:{autoReport?.RouteInfo?.PlanDur}分钟
             </div>
 
@@ -284,7 +284,7 @@ const Item = (props) => {
   };
   return (
     <div className={`${styles.itemMain} card-box`}>
-      <div className={styles.item} style={{ height: children ? 80 : '' }}>
+      <div className={styles.item} style={{ height: children ? "0.8rem" : '' }}>
         <span className={styles.itemName}>{name}</span>
         {/* <span className={styles.warningText}>{warningText}</span> */}
         {renderRight(status)}

+ 1 - 3
src/pages/EqSelfInspection/index.less

@@ -9,6 +9,7 @@
     height: 0.41rem;
     cursor: pointer;
     background: url('@/assets/iconDiffFilled.png') no-repeat;
+    background-size: 100% 100%;
   }
   .iconFundFilled {
     margin-left: 0.28rem;
@@ -70,7 +71,6 @@
   :global {
     .ant-btn-primary {
       font-size: 0.24rem;
-      width: 1.4rem;
       height: 0.46rem;
       cursor: pointer;
     }
@@ -145,11 +145,9 @@
 .itemMain {
   background-size: 100% 100%;
   border: 0.01rem;
-  border-radius: 0.12rem;
   margin-bottom: 0.2rem;
   margin-top: 0.2rem;
   padding: 0 0.1rem;
-  border-radius: 20px 0 20px 0;
   box-shadow: 0.01rem 0.06rem 0.1rem 0rem rgba(0, 0, 0, 0.1);
 }
 .itemMain2 {

+ 82 - 63
src/pages/TaskManage/Detail/TaskList/TaskList.tsx

@@ -17,12 +17,11 @@ import { connect, useLocation, useRequest } from '@umijs/max';
 import TopFilter from '@/pages/TaskManage/components/TopFilter';
 import { IMandateType } from '@/pages/TaskManage/index.types';
 import { useNavigate } from '@@/exports';
-import { DownOutlined } from '@ant-design/icons';
+import { CaretDownFilled } from '@ant-design/icons';
 import {
   Col,
   Collapse,
   CollapseProps,
-  Divider,
   Form,
   Input,
   List,
@@ -217,38 +216,39 @@ const TaskList: React.FC<IPropsType> = (props) => {
       {
         key: '1',
         label: (
-          <span style={{ color: '#5697e4' }}>关联工单({workOrder.length})</span>
+          <span style={{ color: '#ffffff', marginRight: '0.1rem' }}>
+            关联工单({workOrder.length})
+          </span>
         ),
         children: workOrder.map((order) => {
           return (
             <div key={order.Id} className={styles.workOrderCard}>
               <div className={styles.leftInfo}>
-                <Row style={{ marginBottom: '15px' }}>
-                  <Col className={styles.fontS24} span={12}>
+                <Row style={{ marginBottom: '0.15rem' }}>
+                  <Col className={styles.fontS32} span={12}>
                     工单类型:{order.RecordType?.label || '-'}
                   </Col>
-                  <Col className={styles.fontS24} span={12}>
+                  <Col className={styles.fontS32} span={12}>
                     时间:{order.CreateTime}
                   </Col>
                 </Row>
                 <Row>
-                  <Col className={styles.fontS24} span={12}>
+                  <Col className={styles.fontS32} span={12}>
                     工单状态:
                     <span style={{ color: '#5697e4' }}>
                       {order.Status?.label}
                     </span>
                   </Col>
-                  <Col className={styles.fontS24} span={12}>
+                  <Col className={styles.fontS32} span={12}>
                     工单负责人:{order.Responsible?.CName}
                   </Col>
                 </Row>
               </div>
-              <Divider type="vertical" style={{ height: '40px' }} />
+
               <div className={styles.rightButtonContainer}>
                 <div
                   className={styles.rightButton}
                   style={{
-                    color: '#5697e4',
                     marginBottom: `${
                       order.Status?.value === 0 ? '0.15rem' : '0'
                     }`,
@@ -266,7 +266,6 @@ const TaskList: React.FC<IPropsType> = (props) => {
                 {order.Status?.value === 0 && (
                   <div
                     className={styles.rightButton}
-                    style={{ color: '#5697e4' }}
                     onClick={() => {
                       withdrawOrder(order);
                     }}
@@ -283,59 +282,79 @@ const TaskList: React.FC<IPropsType> = (props) => {
 
     return (
       <List.Item style={{ borderBottom: '0' }}>
-        <div className={`${styles.cardContainer} card-box`}>
-          <Row justify="space-between" style={{ marginBottom: '20px' }}>
-            <Col className={styles.fontS24}>时间:{formatItem.CreateTime}</Col>
-            <Col className={styles.fontS24}>
-              任务类别:{formatItem.MandateClass?.label}
-            </Col>
-            <Col className={styles.fontS24}>
-              任务负责人:{formatItem.ResponsiblePeople?.CName || '-'}
-            </Col>
-          </Row>
-          <Row
-            justify="space-between"
+        <div className={`${styles.cardContainer} `}>
+          <span
             style={{
-              paddingBottom: '10px',
-              borderBottom: '1px solid #D5D5D5',
+              width: '0.2rem',
+              height: '2.05rem',
+              position: 'absolute',
+              background: 'rgba(23, 85, 255, 0.20)',
             }}
-          >
-            <Col className={styles.fontS24}>
-              任务状态:{formatItem.Status?.label || '-'}
-            </Col>
-            <Col>
-              <div
-                className={styles.fontS24}
-                style={{
-                  backgroundColor: '#f5a623',
-                  color: 'white',
-                  width: '150px',
-                  height: '50px',
-                  display: 'flex',
-                  justifyContent: 'center',
-                  alignItems: 'center',
-                }}
-                onClick={() => {
-                  goTaskDetail(item);
-                }}
-              >
-                任务详情
-              </div>
-            </Col>
-          </Row>
-          <Row>
-            <Collapse
-              className={styles.collapseLabel}
-              ghost
-              expandIcon={({ isActive }) => (
-                <DownOutlined
-                  style={{ color: '#5697e4' }}
-                  rotate={isActive ? 180 : 0}
-                />
-              )}
-              items={collapseData}
-            />
-          </Row>
+          />
+          <div className={styles.cardInfo}>
+            <Row
+              justify="start"
+              style={{
+                padding: '0.2rem 0.2rem 0 0.4rem',
+                maxHeight: '0.7rem',
+              }}
+            >
+              <Col span={12} className={styles.fontS32}>
+                时间: {formatItem.CreateTime}
+              </Col>
+              <Col className={styles.fontS32}>
+                任务类别: {formatItem.MandateClass?.label}
+              </Col>
+            </Row>
+            <Row
+              justify="start"
+              style={{
+                padding: '0.2rem 0.2rem 0 0.4rem',
+                maxHeight: '0.75rem',
+              }}
+            >
+              <Col span={12} className={styles.fontS32}>
+                任务负责人: {formatItem.ResponsiblePeople?.CName || '-'}
+              </Col>
+              <Col span={8} className={styles.fontS32}>
+                任务状态: {formatItem.Status?.label || '-'}
+              </Col>
+              <Col>
+                <div
+                  className={styles.fontS32}
+                  style={{
+                    backgroundColor: '#f5a623',
+                    color: 'white',
+                    width: '2rem',
+                    letterSpacing: '0.05rem',
+                    height: '0.55rem',
+                    display: 'flex',
+                    justifyContent: 'center',
+                    alignItems: 'center',
+                    borderRadius: '0.5rem',
+                  }}
+                  onClick={() => {
+                    goTaskDetail(item);
+                  }}
+                >
+                  任务详情
+                </div>
+              </Col>
+            </Row>
+            <Row>
+              <Collapse
+                className={styles.collapseLabel}
+                ghost
+                expandIcon={({ isActive }) => (
+                  <CaretDownFilled
+                    style={{ color: '#ffffff' }}
+                    rotate={isActive ? 180 : 0}
+                  />
+                )}
+                items={collapseData}
+              />
+            </Row>
+          </div>
         </div>
       </List.Item>
     );
@@ -349,7 +368,7 @@ const TaskList: React.FC<IPropsType> = (props) => {
       <TopFilter filters={topFiltersConfig} onChange={onTopFilterChange} />
 
       <ScrollLoading
-        height={180}
+        height={190}
         loading={loading || loadData}
         pagination={pagination}
         handleLoadData={(current: number) =>

+ 46 - 13
src/pages/TaskManage/Detail/TaskList/taskList.less

@@ -1,42 +1,64 @@
 .cardContainer {
-  width: 100%;
-  padding: 0.2rem 0.2rem 0.1rem 0.2rem;
-  margin-left: 0.05rem;
+  display: flex;
+  flex-grow: 1;
+  margin-left: 0.1rem;
+  margin-right: 0.2rem;
   background-color: white;
+  background: #ffffff;
+  box-shadow: 0rem 0rem 0.2rem 0 rgba(0, 0, 0, 0.15);
+
+  .cardInfo {
+    width: 100%;
+  }
 
   .collapseLabel {
     width: 100%;
     .ant-collapse-arrow {
-      font-size: 0.24rem;
+      font-size: 0.32rem;
     }
     :global {
       .ant-collapse-item {
         margin-bottom: 0;
       }
+
+      .ant-collapse-item:last-child > .ant-collapse-header {
+        border-radius: 0;
+      }
+
       .ant-collapse-header {
+        height: 0.5rem;
+        background: url('@/assets/TaskManage/viewOrder@2x.png') no-repeat center;
+        background-size: 25% 100%;
         justify-content: center;
         flex-direction: row-reverse;
         align-items: center;
         margin-top: 0.1rem;
+        border-bottom: 0.02rem solid #1755ff;
 
         .ant-collapse-header-text {
-          font-size: 0.24rem;
+          font-size: 0.32rem;
           flex: unset;
           margin-inline-end: unset;
         }
         .ant-collapse-arrow {
-          font-size: 0.24rem;
+          font-size: 0.32rem;
         }
       }
+      .ant-collapse-content-box {
+        padding: 0;
+      }
+
+      .ant-collapse-item > .ant-collapse-content > .ant-collapse-content-box {
+        padding-block: 0;
+      }
     }
 
     .workOrderCard {
-      margin-bottom: 0.2rem;
-      padding: 0.2rem 0.1rem;
-      border-radius: 0.08rem;
-      background-color: #e5effa;
+      margin-bottom: 0.1rem;
+      padding: 0.2rem;
       display: flex;
       align-items: center;
+      background-color: rgba(23, 85, 255, 0.06);
 
       .leftInfo {
         width: 80%;
@@ -47,15 +69,22 @@
         display: flex;
         flex-direction: column;
         justify-content: space-between;
+        align-items: center;
       }
 
       .rightButton {
-        width: 100%;
-        color: #5697e4;
-        font-size: 0.24rem;
+        background-color: #fff;
+        border-radius: 0.5rem;
+        width: 1.5rem;
+        letter-spacing: 0.05rem;
+        color: rgba(23, 85, 255, 1);
+        font-size: 0.32rem;
         text-align: center;
       }
     }
+    .workOrderCard:last-child {
+      margin-bottom: 0;
+    }
   }
 }
 
@@ -116,6 +145,10 @@
   }
 }
 
+.fontS32 {
+  font-size: 0.32rem;
+}
+
 .fontS28 {
   font-size: 0.28rem;
 }

+ 58 - 37
src/pages/TaskManage/components/TopFilter.tsx

@@ -1,6 +1,7 @@
 import { ITopFilter } from '@/pages/TaskManage/Detail/TaskList/taskList.types';
-import { Col, Row, Select } from 'antd';
+import { Col, Divider, Row, Select } from 'antd';
 
+import { CaretDownFilled } from '@ant-design/icons';
 import { useState } from 'react';
 import '../index.less';
 
@@ -15,44 +16,64 @@ const TopFilter: React.FC<IProps> = ({ filters, onChange }) => {
   );
 
   return (
-    <Row justify="space-around" style={{ margin: '30px 0 20px' }}>
+    <Row
+      justify="space-around"
+      style={{
+        margin: '0.3rem 0 0.1rem 0',
+        borderBottom: '0.01rem solid #BCBABA',
+        padding: '0.1rem 0',
+      }}
+    >
       {filters.map((item, index) => {
         return (
-          <Col
-            key={item.key}
-            span={Math.floor(22 / filters.length)}
-            style={{ textAlign: 'center' }}
-          >
-            <Select
-              className="antdSelect"
-              size="large"
-              bordered={false}
-              placeholder={item.placeholder}
-              options={item.options}
-              popupMatchSelectWidth={250}
-              allowClear
-              onChange={(value) => {
-                const temp = filters.map((f, i) => {
-                  if (index === i) {
-                    return value !== undefined ? value : null;
-                  }
-                  return values[i] || null;
-                });
-                setValues(temp);
-                onChange(temp);
-              }}
-              onClear={() => {
-                const temp = filters.map((f, i) => {
-                  if (index === i) {
-                    return null;
-                  }
-                  return values[i];
-                });
-                setValues(temp);
-                onChange(temp);
-              }}
-            />
-          </Col>
+          <>
+            <Col
+              key={item.key}
+              span={Math.floor(22 / filters.length)}
+              style={{ textAlign: 'center' }}
+            >
+              <Select
+                className="antdSelect"
+                size="large"
+                bordered={false}
+                placeholder={item.placeholder}
+                options={item.options}
+                popupMatchSelectWidth={250}
+                allowClear
+                suffixIcon={<CaretDownFilled />}
+                onChange={(value) => {
+                  const temp = filters.map((f, i) => {
+                    if (index === i) {
+                      return value !== undefined ? value : null;
+                    }
+                    return values[i] || null;
+                  });
+                  setValues(temp);
+                  onChange(temp);
+                }}
+                onClear={() => {
+                  const temp = filters.map((f, i) => {
+                    if (index === i) {
+                      return null;
+                    }
+                    return values[i];
+                  });
+                  setValues(temp);
+                  onChange(temp);
+                }}
+              />
+            </Col>
+            {index !== filters.length - 1 && (
+              <Divider
+                type="vertical"
+                style={{
+                  width: '0.01rem',
+                  height: '0.4rem',
+                  background: '#BCBABA',
+                }}
+              />
+            )}
+          </>
         );
       })}
     </Row>

+ 7 - 2
src/pages/TaskManage/index.less

@@ -57,15 +57,20 @@
 .antdSelect .ant-select-selection-item,
 .antdSelect .ant-select-selection-placeholder,
 .ant-select-item-option-content {
-  font-size: 0.28rem;
+  font-size: 0.36rem;
   color: black;
   margin-right: 0.1rem;
 }
+
+.antdSelect .ant-select-selector {
+  margin-right: 0.3rem !important;
+}
+
 .ant-select-item-option {
   padding: 0.08rem !important;
 }
 .ant-select-arrow {
-  font-size: 0.24rem !important;
+  font-size: 0.36rem !important;
   color: black !important;
 }
 

+ 2 - 1
src/pages/TaskManage/index.tsx

@@ -8,9 +8,10 @@ import { List, Spin } from 'antd';
 import { BaseOptionType } from 'rc-select/es/Select';
 import { useEffect, useState } from 'react';
 import { useNavigate } from 'umi';
+import { IUserType } from './Detail/TaskList/taskList.types';
 import { MandateType, OrderType } from './constent';
 
-const TaskManage = (props) => {
+const TaskManage = (props: any) => {
   const { userList, dispatch } = props;
   const { projectID } = useParams();
   const project_id = Number(projectID === '' ? '0' : projectID);