upp

src/components/FileLookCom/index.tsx

@@ -1,36 +1,41 @@
-import React from "react";
+import React, { useCallback } from "react";
 import styles from "./index.module.scss";
 import FileViewer from "react-file-viewer";
 import { useSelector } from "react-redux";
 import store, { RootState } from "@/store";
 import { CloseOutlined } from "@ant-design/icons";
+import { MessageFu } from "@/utils/message";
 
 function FileLookCom() {
   const { fileLookUrl } = useSelector((state: RootState) => state.A0Layout);
 
+  const closePageFu = useCallback(() => {
+    store.dispatch({
+      type: "layout/fileLookUrl",
+      payload: { url: "", name: "" },
+    });
+  }, []);
+
+  const errFu = useCallback(() => {
+    MessageFu.warning("不支持或文件格式错误!");
+    closePageFu();
+  }, [closePageFu]);
+
   return (
     <>
       {fileLookUrl.url ? (
         <div className={styles.FileLookCom}>
           {/* 关闭按钮 */}
-          <div
-            className="FileLookClose"
-            onClick={() =>
-              store.dispatch({
-                type: "layout/fileLookUrl",
-                payload: { url: "", name: "" },
-              })
-            }
-          >
+          <div className="FileLookClose" onClick={closePageFu}>
             <CloseOutlined rev={undefined} />
           </div>
 
           <FileViewer
             fileType={fileLookUrl.name.replace(".", "")}
             filePath={fileLookUrl.url}
-            // onError={}
-            // errorComponent={console.log("出现错误")}
-            // unsupportedComponent={console.log("不支持")}
+            onError={errFu}
+            errorComponent={errFu}
+            unsupportedComponent={errFu}
           />
         </div>
       ) : null}

src/utils/authFilesLook.ts

@@ -45,11 +45,7 @@ export const urlChangeFu = async (
             flag: true,
           },
         });
-      } else if (
-        type &&
-        name &&
-        [".doc", ".docx", ".ppt", ".pptx", ".xls", ".xlsx"].includes(type)
-      ) {
+      } else if (type && name && [".docx", ".xlsx"].includes(type)) {
         store.dispatch({
           type: "layout/fileLookUrl",
           payload: { url: srcRes, name: type },