修改物业费详情pdf展示

src/pages/PropertyManagement/ChargeDetail.tsx

 import React, { useState, useEffect } from 'react';
 import styles from './ChargeDetail.less';
-import { Pagination, Tooltip } from 'antd';
+import { Pagination, Tooltip, Spin } from 'antd';
 
 import { useIntl, connect } from 'umi';
 
@@ -12,19 +12,39 @@ import { timestampToTime } from '../../utils/time';
 import TitleBack from '../../components/TitleBack/TitleBack';
 
 const ChargeDetail = (props: any) => {
-  const { CurData } = props;
+  const { CurData, dispatch, FileImg } = props;
 
   const [scale, setState] = useState(1.3);
   const [pages, setPages] = useState(1);
   const [curpage, setCurpage] = useState(1);
 
+  const [loading, setLoading] = useState(false);
+
   useEffect(() => {
-    console.log(CurData);
-    if (!CurData) {
+    if (CurData) {
+      dispatch({
+        type: 'Contract/RA',
+        playload: {
+          index: 47,
+          body: {
+            type: 'tosAccountPreview',
+            fileName: CurData.billName,
+            extends: CurData.communityName,
+          },
+        },
+      });
+      setLoading(true);
+    } else {
       history.back();
     }
   }, []);
 
+  useEffect(() => {
+    if (FileImg) {
+      setLoading(false);
+    }
+  }, [FileImg]);
+
   const pdfpages = (pages: any) => {
     setPages(pages);
   };
@@ -64,7 +84,7 @@ const ChargeDetail = (props: any) => {
           <div className={styles.box4}>
             <Pagination simple defaultCurrent={curpage} total={pages * 10} onChange={pageChange} />
           </div>
-          <>
+          <Spin spinning={loading}>
             <Tooltip title={scale == 1.3 ? '点击放大查看' : '还原视图'}>
               <div className={scale == 1.3 ? styles.box3out : null}>
                 <div className={scale == 1.3 ? styles.box3 : styles.box3of} onClick={lookup}>
@@ -72,7 +92,7 @@ const ChargeDetail = (props: any) => {
                     // key="pdfjs"
                     file={
                       // 'data:application/pdf;base64,' + stringSplit(CurData.billFileUrl, 'm/cash')
-                      stringSplit(CurData.billFileUrl, 'm/cash')
+                      stringSplit(CurData.billFileUrl || FileImg[0].fileUrl, 'm/cash')
                     }
                     // workerSrc="//cdnjs.cloudflare.com/ajax/libs/pdf.js/2.2.228/pdf.worker.js"
                     scale={scale}
@@ -82,7 +102,7 @@ const ChargeDetail = (props: any) => {
                 </div>
               </div>
             </Tooltip>
-          </>
+          </Spin>
         </>
       ) : null}
     </div>
@@ -91,8 +111,10 @@ const ChargeDetail = (props: any) => {
 
 function mapStateToProps(state: any) {
   const { CurData } = state.PropertyManagement;
+  const { FileImg } = state.Contract;
   return {
     CurData,
+    FileImg,
   };
 }
 export default connect(mapStateToProps)(ChargeDetail);