فهرست منبع

Merge branch 'develop' of http://120.55.44.4:10080/xujunjie/gt_client_pad into develop
解决冲突
# Conflicts:
# src/pages/DeviceManager/storage.js

Renxy 1 سال پیش
والد
کامیت
6f79bebb00

+ 1 - 0
.umirc.ts

@@ -18,6 +18,7 @@ export default defineConfig({
     { 'http-equiv': 'expires', content: '0' },
     { 'http-equiv': 'X-UA-Compatible', content: 'IE=EmulateIE9' },
     { name: 'transparent', content: 'true' },
+    { name: 'viewport', content: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' },
   ],
   proxy: {
     '/api': {

+ 3 - 3
src/pages/DeviceManager/storage.js

@@ -7,13 +7,13 @@ import PageTitle from '@/components/PageTitle';
 import { queryMainChartList } from '@/services/StorageManagement';
 import { useParams, useRequest } from '@umijs/max';
 import { Empty, Spin } from 'antd';
-import moment from 'moment';
+import dayjs from 'dayjs';
 import { useRef } from 'react';
 import styles from './index.less';
 
 const StorageOverview = () => {
   const { projectId } = useParams();
-  const yearRef = useRef(Number(moment().format('YYYY')));
+  const yearRef = useRef(Number(dayjs().format('YYYY')));
   const monthRef = useRef(0);
   const statistics = [
     {
@@ -38,7 +38,7 @@ const StorageOverview = () => {
     },
   ];
 
-  const { data, run, loading } = useRequest(
+  const { data, loading } = useRequest(
     () =>
       queryMainChartList({
         project_id: Number(projectId),

+ 1 - 1
src/pages/Home/index.js

@@ -123,7 +123,7 @@ const SelfInspection = connect(({ eqSelfInspection, loading }) => ({
 
   const renderStatus = () => {
     if (loading) return <LoadingOutlined />;
-    if (autoReport.warningTotalNum) {
+    if (autoReport.Status > 0) {
       return <span style={{ color: '#FE5850' }}>异常</span>;
     }
     return <span style={{ color: '#F5A623' }}>正常</span>;

+ 77 - 76
src/pages/TaskManage/Detail/TaskDetail/TaskDetail.tsx

@@ -22,8 +22,9 @@ import { UpOutlined } from '@ant-design/icons';
 import { connect, useRequest } from '@umijs/max';
 import { Col, Collapse, CollapseProps, Divider, Row, Table } from 'antd';
 import type { ColumnsType } from 'antd/es/table';
-import moment from 'moment';
+import dayjs from 'dayjs';
 import { useEffect, useState } from 'react';
+// @ts-ignore
 import ReactZmage from 'react-zmage';
 import { useNavigate } from 'umi';
 import styles from './taskDetail.less';
@@ -54,40 +55,30 @@ function TaskDetail(props: IPropsType) {
     {
       title: '详情',
       dataIndex: 'detail',
+      key: 'key',
       render: (value, record) => {
         return (
-          <div
-            key={value.key}
-            style={{ display: 'flex', alignItems: 'center' }}
-          >
-            <div style={{ width: value.image === '' ? '100%' : '200px' }}>
-              {value.text}
-            </div>
-            <div>
-              <ReactZmage
-                controller={{
-                  // 关闭按钮
-                  close: true,
-                  // 缩放按钮
-                  zoom: false,
-                  // 下载按钮
-                  download: false,
-                  // 翻页按钮
-                  flip: false,
-                  // 多页指示
-                  pagination: false,
-                }}
-                backdrop="rgba(255,255,255,0.5)"
-                style={{ width: '320px', marginLeft: '20px' }}
-                src={value.image}
-              />
-            </div>
+          <div style={{ display: 'flex', alignItems: 'center' }}>
+            <div style={{ width: '100%' }}>{value.text}</div>
           </div>
         );
       },
     },
   ];
 
+  const base64ToImageUrl = (base64String: string) => {
+    const byteCharacters = atob(base64String);
+    const byteArrays = [];
+
+    for (let i = 0; i < byteCharacters.length; i++) {
+      byteArrays.push(byteCharacters.charCodeAt(i));
+    }
+
+    const byteArray = new Uint8Array(byteArrays);
+    const blob = new Blob([byteArray], { type: 'image/png' });
+    return URL.createObjectURL(blob);
+  };
+
   const { refresh: refreshDetail } = useRequest(getMandateDetail, {
     defaultParams: [
       {
@@ -95,7 +86,7 @@ function TaskDetail(props: IPropsType) {
         project_id,
       },
     ],
-    formatResult: (result) => {
+    formatResult: async (result) => {
       const tempMandate: IMandateDetailType = {
         ...result.data,
         Status: MandateStatus.find((item) => item.value === result.data.Status),
@@ -108,12 +99,12 @@ function TaskDetail(props: IPropsType) {
         ResponsiblePeople: userList.find(
           (item) => item.ID === result.data.ResponsiblePeople,
         ),
-        CreateTime: moment(result.data.CreateTime).format('YYYY-MM-DD HH:mm'),
+        CreateTime: dayjs(result.data.CreateTime).format('YYYY-MM-DD HH:mm'),
       };
       const workOrder = result.data.Records.map((item: IWorkOrderType) => {
         return {
           ...item,
-          CreateTime: moment(item.CreateTime).format('YYYY-MM-DD HH:mm'),
+          CreateTime: dayjs(item.CreateTime).format('YYYY-MM-DD HH:mm'),
           Status: OrderStatus.find((status) => status.value === item.Status),
           RecordType: OrderType.find((type) => type.value === item.RecordType),
           Responsible: userList.find((user) => user.ID === item.Responsible),
@@ -135,7 +126,13 @@ function TaskDetail(props: IPropsType) {
                 <div className={styles.leftInfo}>
                   <Row style={{ marginBottom: '15px' }}>
                     <Col className={styles.fontS24} span={12}>
-                      工单编号:{record.Id || '-'}
+                      {/*// @ts-ignore*/}
+                      工单类型:
+                      {record.RecordType === 1
+                        ? '工艺'
+                        : record.RecordType === 2
+                        ? '维修'
+                        : '保养'}
                     </Col>
                     <Col className={styles.fontS24} span={12}>
                       时间:{record.CreateTime || '-'}
@@ -178,6 +175,18 @@ function TaskDetail(props: IPropsType) {
         },
       ];
 
+      if (
+        tempMandate.MandateClass &&
+        tempMandate.ExtendId &&
+        /* @ts-ignore */
+        tempMandate.MandateClass.value === 7
+      ) {
+        const image = await getDiagnosticDetail(tempMandate.ExtendId);
+        if (image?.event_bg) {
+          tempMandate.img = base64ToImageUrl(image.event_bg);
+        }
+      }
+
       setMandateDetail(tempMandate);
       setHandledWorkOrder(tempOrder);
       if (children && children.length) {
@@ -199,54 +208,18 @@ function TaskDetail(props: IPropsType) {
     if (!mandateChild.length) {
       return;
     }
-    const requestList: any = [];
-    for (let i = 0; i < mandateChild.length; i++) {
-      const child: IMandateChildTypes = mandateChild[i];
-      if (child.ExtendId !== 0) {
-        requestList.push(getDiagnosticDetail(child.ExtendId));
-      }
-    }
 
-    Promise.all(requestList)
-      .then((res) => {
-        const images: {
-          id: number;
-          img: string;
-        }[] = [];
-        for (let i = 0; i < res.length; i++) {
-          images.push({
-            id: res[i].id,
-            img: base64ToImageUrl(res[i].event_bg),
-          });
-        }
-        const dataSource = mandateChild.map((item) => {
-          const img = images.find((i) => i.id === item.ExtendId);
-          return {
-            detail: {
-              text: item.Title + item.Content,
-              image: img !== undefined ? img.img : '',
-              key: item.ExtendId,
-            },
-          };
-        });
-        setMandateTable(dataSource);
-      })
-      .catch((err) => console.log(err));
+    const dataSource = mandateChild.map((item, index) => {
+      return {
+        detail: {
+          text: item.Title + item.Content,
+          key: item.Title + index + item.Content,
+        },
+      };
+    });
+    setMandateTable(dataSource);
   }, [mandateChild]);
 
-  function base64ToImageUrl(base64String: string) {
-    const byteCharacters = atob(base64String);
-    const byteArrays = [];
-
-    for (let i = 0; i < byteCharacters.length; i++) {
-      byteArrays.push(byteCharacters.charCodeAt(i));
-    }
-
-    const byteArray = new Uint8Array(byteArrays);
-    const blob = new Blob([byteArray], { type: 'image/png' });
-    return URL.createObjectURL(blob);
-  }
-
   const goTaskOrder = (orderID: number, orderType: number) => {
     navigate(
       `/task-manage/list/order-detail?project_id=${project_id}&order_id=${orderID}&order_type=${orderType}`,
@@ -286,6 +259,33 @@ function TaskDetail(props: IPropsType) {
             </Col>
             <Col className={styles.fontS24}>{mandateDetail?.Summary}</Col>
           </Row>
+          {mandateDetail?.img && (
+            <Row className={styles.infoRow}>
+              <Col className={styles.fontS24} span={4}>
+                预警图片
+              </Col>
+              <Col className={styles.fontS24}>
+                <ReactZmage
+                  controller={{
+                    // 关闭按钮
+                    close: true,
+                    // 缩放按钮
+                    zoom: false,
+                    // 下载按钮
+                    download: false,
+                    // 翻页按钮
+                    flip: false,
+                    // 多页指示
+                    pagination: false,
+                  }}
+                  backdrop="rgba(255,255,255,0.5)"
+                  style={{ width: '350px' }}
+                  src={mandateDetail?.img}
+                />
+              </Col>
+            </Row>
+          )}
+
           <Row>
             <Col className={styles.fontS24} span={4}>
               任务内容
@@ -293,6 +293,7 @@ function TaskDetail(props: IPropsType) {
             <Col className={styles.fontS24} span={20}>
               {/*{mandateDetail?.Detail}*/}
               <Table
+                rowKey="key"
                 columns={columnDef}
                 dataSource={mandateTable}
                 pagination={false}

+ 1 - 1
src/pages/TaskManage/Detail/TaskDetail/taskDetail.types.ts

@@ -11,5 +11,5 @@ export interface IMandateChildTypes {
 }
 
 export interface IColumn {
-  detail: {text: string, image: string, key: number};
+  detail: {text: string, key: string};
 }

+ 60 - 62
src/pages/TaskManage/Detail/TaskList/TaskList.tsx

@@ -18,20 +18,11 @@ 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 {
-  Button,
-  Col,
-  Collapse,
-  CollapseProps,
-  Divider,
-  List,
-  Row,
-  Spin,
-} from 'antd';
+import { Col, Collapse, CollapseProps, Divider, List, Row, Spin } from 'antd';
 
 import { getMandateList } from '@/services/TaskManage';
-import moment from 'moment';
-import { useEffect, useState } from 'react';
+import dayjs from 'dayjs';
+import { useEffect, useRef, useState } from 'react';
 import styles from './taskList.less';
 
 const TaskList: React.FC<IPropsType> = (props) => {
@@ -44,44 +35,62 @@ const TaskList: React.FC<IPropsType> = (props) => {
 
   const navigate = useNavigate();
 
-  // 用于展示的任务列表
-  const [mandateListShow, setMandateListShow] = useState<IMandateType[]>([]);
   // 顶部选择器配置
   const [topFiltersConfig, setTopFiltersConfig] = useState<ITopFilter[]>([]);
   const [mandateList, setMandateList] = useState<IMandateType[]>([]);
-  const [mandatePage, setMandatePage] = useState({
-    pageSize: 20,
-    total: 0,
-    current: 1,
-  });
   const [currentParams, setCurrentParams] = useState({
     project_id,
     mandate_type: mandateType,
     pageSize: 20,
-    currentPage: 2,
+    currentPage: 1,
   });
+  const [isLoadAll, setIsLoadAll] = useState(false);
+
+  const bottomAreaOfList = useRef<HTMLDivElement>(null);
 
   const { run: getList, loading: loadData } = useRequest(getMandateList, {
     defaultParams: [
       {
-        project_id,
-        mandate_type: mandateType,
-        pageSize: mandatePage.pageSize,
-        currentPage: mandatePage.current,
+        ...currentParams,
       },
     ],
     formatResult: (result) => {
+      const pageInfo = result.data.pagination;
       if (result.data.pagination.current === 1) {
         setMandateList(result.data.list);
       } else {
-        setMandateList([...mandateList, ...result.data.list]);
+        if (mandateList.length < pageInfo.total) {
+          setMandateList([...mandateList, ...result.data.list]);
+        }
+      }
+      if (pageInfo.current * pageInfo.pageSize >= pageInfo.total) {
+        setIsLoadAll(true);
       }
-      const pageInfo = result.data.pagination;
       pageInfo.current += 1;
-      setMandatePage(pageInfo);
+      setCurrentParams({
+        ...currentParams,
+        currentPage: pageInfo.current,
+      });
     },
   });
 
+  const handleScroll = () => {
+    if (bottomAreaOfList.current === null) {
+      return;
+    }
+    const rect = bottomAreaOfList.current.getBoundingClientRect();
+    const isVisible =
+      rect.top >= 0 &&
+      rect.left >= 0 &&
+      rect.bottom <=
+        (window.innerHeight || document.documentElement.clientHeight) &&
+      rect.right <= (window.innerWidth || document.documentElement.clientWidth);
+
+    if (isVisible) {
+      getList(currentParams);
+    }
+  };
+
   // 获取用户
   useEffect(() => {
     if (userList.length === 0) {
@@ -92,13 +101,17 @@ const TaskList: React.FC<IPropsType> = (props) => {
     }
   }, []);
 
-  // 首次获取任务数据
-
+  // 监听滚动事件
   useEffect(() => {
-    setMandateListShow(mandateList);
-  }, [mandateList]);
+    // 组件挂载时添加滚动事件监听
+    window.addEventListener('scroll', handleScroll);
+    // 组件卸载时移除滚动事件监听
+    return () => {
+      window.removeEventListener('scroll', handleScroll);
+    };
+  }, [loadData, currentParams]);
 
-  // 顶部下拉过滤器配置
+  // 配置顶部下拉过滤器
   useEffect(() => {
     const filters: ITopFilter[] = [];
     filters.push({
@@ -126,10 +139,8 @@ const TaskList: React.FC<IPropsType> = (props) => {
         };
       }),
     });
+
     setTopFiltersConfig(filters);
-    // setMandateListShow(
-    //   mandateList.filter((item) => item.MandateType === mandateType),
-    // );
   }, [mandateType]);
 
   /**
@@ -143,7 +154,7 @@ const TaskList: React.FC<IPropsType> = (props) => {
     const params: any = {
       project_id,
       mandate_type: mandateType,
-      pageSize: mandatePage.pageSize,
+      pageSize: 20,
       currentPage: 1,
     };
     for (let i = 0; i < value.length; i++) {
@@ -151,31 +162,18 @@ const TaskList: React.FC<IPropsType> = (props) => {
         params[topFiltersConfig[i].key] = value[i];
       }
     }
-    getList(params);
-    params.currentPage += 1;
     setCurrentParams(params);
+    getList(params);
   };
 
-  const loadMoreMandate =
-    !loadData && mandateListShow.length > mandatePage.total ? (
-      <div
-        style={{
-          textAlign: 'center',
-          marginTop: 12,
-          height: 32,
-          lineHeight: '32px',
-          fontSize: '28px',
-        }}
-      >
-        <Button
-          type="text"
-          size="large"
-          style={{ fontSize: '28px', height: '56px', width: '160px' }}
-        >
-          加载更多
-        </Button>
-      </div>
-    ) : null;
+  const loadMoreMandate = !isLoadAll && !loadData ? (
+    <div
+      ref={bottomAreaOfList}
+      style={{
+        height: '1px',
+      }}
+    />
+  ) : null;
 
   const goTaskDetail = (mandate: IMandateType) => {
     navigate(
@@ -203,7 +201,7 @@ const TaskList: React.FC<IPropsType> = (props) => {
       ResponsiblePeople: userList.find(
         (user) => user.ID === item.ResponsiblePeople,
       ),
-      CreateTime: moment(item.CreateTime).format('YYYY-MM-DD HH:mm'),
+      CreateTime: dayjs(item.CreateTime).format('YYYY-MM-DD HH:mm'),
     };
 
     const workOrder = item.Records.map((record) => {
@@ -213,7 +211,7 @@ const TaskList: React.FC<IPropsType> = (props) => {
         Status: OrderStatus.find((status) => status.value === record.Status),
         RecordType: OrderType.find((type) => type.value === record.RecordType),
         Responsible: userList.find((user) => user.ID === record.Responsible),
-        CreateTime: moment(record.CreateTime).format('YYYY-MM-DD HH:mm'),
+        CreateTime: dayjs(record.CreateTime).format('YYYY-MM-DD HH:mm'),
       };
     });
 
@@ -264,7 +262,7 @@ const TaskList: React.FC<IPropsType> = (props) => {
     ];
 
     return (
-      <List.Item>
+      <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>
@@ -332,7 +330,7 @@ const TaskList: React.FC<IPropsType> = (props) => {
       <Spin spinning={loading || loadData}>
         <List
           itemLayout="horizontal"
-          dataSource={mandateListShow}
+          dataSource={mandateList}
           renderItem={buildTaskList}
           loadMore={loadMoreMandate}
         />

+ 1 - 1
src/pages/TaskManage/Detail/TaskList/taskList.types.ts

@@ -1,4 +1,3 @@
-import { IMandateType } from '@/pages/TaskManage/index.types';
 import { DefaultOptionType } from 'rc-select/es/Select';
 
 export interface IPropsType {
@@ -47,6 +46,7 @@ export interface IMandateDetailType {
   OperationLog: string;
   OperationPeople: number;
   ExtendId: number;
+  img?: string;
 }
 
 export interface IUserType {

+ 19 - 12
src/pages/TaskManage/Detail/TaskOrder/TaskOrder.tsx

@@ -11,7 +11,7 @@ import {
 import { useLocation } from '@@/exports';
 import { connect, useRequest } from '@umijs/max';
 import { Col, Row } from 'antd';
-import moment from 'moment';
+import dayjs from 'dayjs';
 import { DefaultOptionType } from 'rc-select/es/Select';
 import React, { useEffect, useState } from 'react';
 import styles from './taskOrder.less';
@@ -54,9 +54,9 @@ const TaskOrder: React.FC<IPropsType> = (props) => {
     formatResult: (result) => {
       const temp = result.data.list[0];
       const tempDetail = {
-        CreateTime: moment(temp.CreateTime).format('YYYY-MM-DD HH:mm'),
-        PlanTime: moment(temp.PlanTime).format('YYYY-MM-DD HH:mm'),
-        RepairTime: moment(temp.RepairTime).format('YYYY-MM-DD HH:mm') || '-',
+        CreateTime: dayjs(temp.CreateTime).format('YYYY-MM-DD HH:mm'),
+        PlanTime: dayjs(temp.PlanTime).format('YYYY-MM-DD HH:mm'),
+        RepairTime: dayjs(temp.RepairTime).format('YYYY-MM-DD HH:mm') || '-',
         Reason: temp.Note,
         Lubrication: temp.Lubrication,
         Fasten: temp.Fasten,
@@ -67,8 +67,9 @@ const TaskOrder: React.FC<IPropsType> = (props) => {
         Repairman:
           userList.find((item) => item.ID === temp.MaintenancePerson) || '-',
         DispatchMan:
-          userList.find((item) => (item.ID = temp.Operators[0]?.Operator?.ID)) ||
-          '-',
+          userList.find(
+            (item) => (item.ID = temp.Operators[0]?.Operator?.ID),
+          ) || '-',
         OrderStatus:
           OrderStatus.find((item) => item.value === temp.Status) || '-',
       };
@@ -81,10 +82,16 @@ const TaskOrder: React.FC<IPropsType> = (props) => {
     manual: true,
     formatResult: (result: any) => {
       const temp = result.data.list[0];
+      if (temp === undefined) {
+        return;
+      }
       const tempDetail: IOrderInfo = {
-        CreateTime: moment(temp.CreateTime).format('YYYY-MM-DD HH:mm'),
-        PlanTime: moment(temp.PlanTime).format('YYYY-MM-DD HH:mm'),
-        RepairTime: temp.RepairTime && moment(temp.RepairTime).format('YYYY-MM-DD HH:mm') || '-',
+        CreateTime: dayjs(temp.CreateTime).format('YYYY-MM-DD HH:mm'),
+        PlanTime: dayjs(temp.PlanTime).format('YYYY-MM-DD HH:mm'),
+        RepairTime:
+          (temp.RepairTime &&
+            dayjs(temp.RepairTime).format('YYYY-MM-DD HH:mm')) ||
+          '-',
         Reason: temp.Reason,
         Repairman: userList.find((item) => item.ID === temp.Repairman) || '-',
         DispatchMan:
@@ -105,11 +112,11 @@ const TaskOrder: React.FC<IPropsType> = (props) => {
     formatResult: (result) => {
       const temp = result.data.list[0];
       const tempDetail = {
-        CreateTime: moment(temp.start_time).format('YYYY-MM-DD HH:mm'),
-        PlanTime: moment(temp.plan_end_time).format('YYYY-MM-DD HH:mm'),
+        CreateTime: dayjs(temp.start_time).format('YYYY-MM-DD HH:mm'),
+        PlanTime: dayjs(temp.plan_end_time).format('YYYY-MM-DD HH:mm'),
         RepairTime:
           (temp.actual_end_time &&
-            moment(temp.actual_end_time).format('YYYY-MM-DD HH:mm')) ||
+            dayjs(temp.actual_end_time).format('YYYY-MM-DD HH:mm')) ||
           '-',
         Reason: temp.detail,
         Repairman: userList.find((item) => item.ID === temp.checker_id) || '-',

+ 1 - 1
src/pages/TaskManage/index.less

@@ -3,7 +3,7 @@
 
   .listItem {
     margin: 20px 20px 20px 0;
-    height: 12vh;
+    height: 120px;
     box-shadow: 0 0 6px 3px rgba(0, 150, 255, 10%);
     border-radius: 10px;
     background-color: #ffffff;