fix

src/pages/TaskManage/Popup/WorkOrderModal.js

@@ -11,7 +11,7 @@ import { connect, useLocation, useParams, useRequest } from '@umijs/max';
 import { Button, Col, Row, Steps } from 'antd';
 import dayjs from 'dayjs';
 import { useEffect, useState } from 'react';
-import { PhotoProvider, PhotoView } from 'react-photo-view';
+import ReactZmage from 'react-zmage';
 import SubTitle from '../components/SubTitle';
 import { OrderStatus, OrderType } from '../constent';
 import styles from './WorkOrderModal.less';
@@ -199,23 +199,32 @@ const WorkOrderModal = (props) => {
 
   const renderImg = () => {
     return (
-      <PhotoProvider>
-        <Col className={styles.fontS24} span={20}>
-          {orderInfo?.MandateImages?.map((photo) => (
-            <PhotoView src={photo.src}>
-              <img
+      <Col span={18}>
+        {orderInfo?.MandateImages?.length > 0 &&
+          orderInfo?.MandateImages?.map((item, index) => {
+            return (
+              <ReactZmage
+                key={index}
+                controller={{
+                  close: true,
+                  flip: true,
+                  zoom: true,
+                  pagination: true,
+                  download: false,
+                }}
+                backdrop="rgba(255,255,255,0.5)"
                 style={{
                   maxWidth: `${Math.floor(
-                    100 / (orderInfo?.MandateImages?.length || 1),
+                    100 / orderInfo?.MandateImages?.length,
                   )}%`,
                 }}
-                src={photo.src}
-                alt=""
+                src={item.src}
+                set={orderInfo?.MandateImages}
+                defaultPage={index}
               />
-            </PhotoView>
-          ))}
-        </Col>
-      </PhotoProvider>
+            );
+          })}
+      </Col>
     );
   };