修复useDispatch版本问题

README.md

@@ -1,22 +1 @@
-1.版本类型问题
-
-找到 import { useDispatch } from "react-redux";
-
-按住 Ctrl 点击 useDispatch 出来 useDispatch.d.ts类型声明文件
-（路径node_modules>react-redux>es>hooks>useDispatch.d.ts）
-
-找到最后面的 AnyAction，按住 Ctrl 点击 进入
-（路径node_modules>redux>index.d.ts）
-
-找到
-export interface Action<T = any> {
-  type: T
-}
-
-在type后面加一个 ?   即=>
-
-export interface Action<T = any> {
-  type?: T
-}
-
-
+react+ts 构建。部分插件下载有版本问题。在使用的组件内有标明怎么解决。

src/components/Z3upFiles/index.tsx

@@ -103,8 +103,8 @@ function Z3upFiles(
 
   // 列表删除某一个文件 待完善
   const delImgListFu = useCallback(
-    (id: number) => {
-      const newItems = fileList.filter(v => v.id !== id)
+    (index: number) => {
+      const newItems = fileList.filter((v, i) => i !== index)
       setFileList(newItems)
     },
     [fileList, setFileList]
@@ -117,8 +117,6 @@ function Z3upFiles(
 
   // 让父组件调用 回显数据
   const sonFilesShowFu = useCallback((arr: any) => {
-    console.log(123, arr)
-
     setFileList(arr)
   }, [])
 
@@ -151,7 +149,7 @@ function Z3upFiles(
         ) : null}
 
         <div className='Z3files'>
-          {fileList.map(v => (
+          {fileList.map((v, i) => (
             <div className='Z3filesRow' key={v.id}>
               <div className='Z3files1' title={v.fileName}>
                 {v.fileName}
@@ -181,7 +179,7 @@ function Z3upFiles(
                   title='删除后无法恢复，是否删除?'
                   okText='删除'
                   cancelText='取消'
-                  onConfirm={() => delImgListFu(v.id)}
+                  onConfirm={() => delImgListFu(i)}
                   okButtonProps={{ loading: false }}
                 >
                   <CloseOutlined rev={undefined} title='删除' hidden={isLook} />

src/pages/A1Camera/AddCamera/index.tsx

@@ -17,9 +17,10 @@ type Props = {
   upTableFu: () => void
   addTableFu: (info?: any) => void
   isLoc?: boolean //从业务订单的 新增/编辑-相机清单-新增 进来
+  existSn?: string[]
 }
 
-function AddCamera({ openInfo, closeFu, upTableFu, addTableFu, isLoc }: Props) {
+function AddCamera({ openInfo, closeFu, upTableFu, addTableFu, isLoc, existSn }: Props) {
   // 表单的ref
   const FormBoxRef = useRef<FormInstance>(null)
 
@@ -54,7 +55,13 @@ function AddCamera({ openInfo, closeFu, upTableFu, addTableFu, isLoc }: Props) {
       }
 
       if (isLoc) {
+        if (existSn && existSn.includes(value.cameraSn)) {
+          // 没有存入数据库的时候 自己校验 sn码的唯一性
+          return MessageFu.warning('SN码重复!')
+        }
+
         MessageFu.success('新增成功!')
+        obj.idxx = Date.now() + ''
         addTableFu(obj)
         closeFu()
       } else {
@@ -66,7 +73,7 @@ function AddCamera({ openInfo, closeFu, upTableFu, addTableFu, isLoc }: Props) {
         }
       }
     },
-    [addTableFu, cameraType, closeFu, isLoc, openInfo.id, openInfo.txt, upTableFu]
+    [addTableFu, cameraType, closeFu, existSn, isLoc, openInfo.id, openInfo.txt, upTableFu]
   )
 
   return (

src/pages/A2Abusiness/AddBusiness/index.tsx

@@ -23,6 +23,7 @@ type TableListType = {
   cameraSn: string
   cameraType: string
   id: number
+  idxx: string
   remark: string
 }
 
@@ -43,8 +44,8 @@ function AddBusiness({ topType, openInfo, closeFu, upTableFu, addTableFu }: Prop
 
   // 表格点击删除
   const delTableFu = useCallback(
-    (id: number) => {
-      setTableList(tableList.filter(v => v.id !== id))
+    (idxx: string) => {
+      setTableList(tableList.filter(v => v.idxx !== idxx))
     },
     [tableList]
   )
@@ -79,7 +80,7 @@ function AddBusiness({ topType, openInfo, closeFu, upTableFu, addTableFu }: Prop
       {
         title: '操作',
         render: (item: TableListType) => (
-          <MyPopconfirm txtK='删除' onConfirm={() => delTableFu(item.id)} />
+          <MyPopconfirm txtK='删除' onConfirm={() => delTableFu(item.idxx)} />
         )
       }
     ]
@@ -101,7 +102,12 @@ function AddBusiness({ topType, openInfo, closeFu, upTableFu, addTableFu }: Prop
       ZRichTextsRef1.current?.ritxtShowFu(JSON.parse(data.rtf))
 
       // 回显表格
-      setTableList(data.cameras)
+      setTableList(
+        data.cameras.map((v: any) => ({
+          ...v,
+          idxx: v.id
+        }))
+      )
 
       const obj = {
         ...data,
@@ -343,7 +349,7 @@ function AddBusiness({ topType, openInfo, closeFu, upTableFu, addTableFu }: Prop
             size='small'
             dataSource={tableList}
             columns={columns}
-            rowKey='cameraSn'
+            rowKey='idxx'
             pagination={false}
           />
           {/*  右下角的列表数量 */}
@@ -359,6 +365,7 @@ function AddBusiness({ topType, openInfo, closeFu, upTableFu, addTableFu }: Prop
           <div>
             <AddCamera
               isLoc={true}
+              existSn={tableList.map(v => v.cameraSn)}
               openInfo={tableAdd}
               closeFu={() => setTableAdd({ id: 0, txt: '' })}
               upTableFu={() => {}}

src/store/action/A1Camera.ts

@@ -3,7 +3,7 @@ import { AppDispatch } from '..'
 /**
  * 获取 相机列表 表格列表（存到仓库）
  */
-export const A1_APIgetlist = (data: any) => {
+export const A1_APIgetlist = (data: any): any => {
   return async (dispatch: AppDispatch) => {
     const res = await http.post('cms/camera/pageList', data)
     if (res.code === 0) {

src/store/action/A2Abusiness.ts

@@ -3,7 +3,7 @@ import { AppDispatch } from '..'
 /**
  * 获取 业务订单 表格列表（存到仓库）
  */
-export const A2A_APIgetlist = (data: any) => {
+export const A2A_APIgetlist = (data: any): any => {
   return async (dispatch: AppDispatch) => {
     const res = await http.post('cms/order/pageList', data)
     if (res.code === 0) {

src/store/action/A2Psychz.ts

@@ -1,55 +1,55 @@
-import http from "@/utils/http";
-import { AppDispatch } from "..";
+import http from '@/utils/http'
+import { AppDispatch } from '..'
 
 /**
  * 获取 机房管理 表格列表（存到仓库）
  */
-export const A2_APIgetlist = (data: any) => {
+export const A2_APIgetlist = (data: any): any => {
   return async (dispatch: AppDispatch) => {
-    const res = await http.post("cms/room/pageList", data);
+    const res = await http.post('cms/room/pageList', data)
     if (res.code === 0) {
       const obj = {
         list: res.data.records,
-        total: res.data.total,
-      };
+        total: res.data.total
+      }
       // console.log(123,obj);
 
-      dispatch({ type: "A2/getList", payload: obj });
+      dispatch({ type: 'A2/getList', payload: obj })
     }
-  };
-};
+  }
+}
 
 /**
  * 获取 机房管理 表格列表（导出表格）
  */
-export const A2_APIgetlistDerive = (data:any) => {
-  return http.post("cms/room/pageList", data);
-};
+export const A2_APIgetlistDerive = (data: any) => {
+  return http.post('cms/room/pageList', data)
+}
 
 /**
  * 删除表格单个
  */
 export const A2_APIremoves = (id: number) => {
-  return http.get(`cms/room/remove/${id}`);
-};
+  return http.get(`cms/room/remove/${id}`)
+}
 
 /**
  * 新增/编辑
  */
 export const A2_APIadd = (data: any) => {
-  return http.post("cms/room/save", data);
-};
+  return http.post('cms/room/save', data)
+}
 
 /**
  * 通过id获取详情
  */
-export const A2_APIgetInfo = (id:number) => {
-  return http.get(`cms/room/detail/${id}`);
-};
+export const A2_APIgetInfo = (id: number) => {
+  return http.get(`cms/room/detail/${id}`)
+}
 
 /**
  * 机房管理-站址地区下拉框
  */
 export const A2_APIgetCity = () => {
-  return http.get('cms/room/getCityTree');
-};
+  return http.get('cms/room/getCityTree')
+}

src/store/action/B1Plan.ts

@@ -1,65 +1,65 @@
-import http from "@/utils/http";
-import { AppDispatch } from "..";
+import http from '@/utils/http'
+import { AppDispatch } from '..'
 /**
  * 获取 进度统计 表格列表（存到仓库）-按机房
  */
-export const B1_APIgetlist = (data: any) => {
+export const B1_APIgetlist = (data: any): any => {
   return async (dispatch: AppDispatch) => {
-    const res = await http.post("cms/schedule/pageList", data);
+    const res = await http.post('cms/schedule/pageList', data)
     if (res.code === 0) {
       const obj = {
         list: res.data.records.map((v: any, index: number) => ({
           ...v,
-          idKey: v.id + "" + index,
+          idKey: v.id + '' + index
         })),
-        total: res.data.total,
-      };
-      dispatch({ type: "B1/getList", payload: obj });
+        total: res.data.total
+      }
+      dispatch({ type: 'B1/getList', payload: obj })
     }
-  };
-};
+  }
+}
 
 /**
  * 获取 机房管理 表格列表（导出表格）-按机房
  */
 export const B1_APIgetlistAll = (data: any) => {
-  return http.post("cms/schedule/pageList", data);
-};
+  return http.post('cms/schedule/pageList', data)
+}
 
 /**
  * 获取 进度统计 表格列表（存到仓库）-按区域
  */
-export const B1_APIgetlistArea = (data: any) => {
+export const B1_APIgetlistArea = (data: any): any => {
   return async (dispatch: AppDispatch) => {
-    const res = await http.post("cms/schedule/report/region", data);
+    const res = await http.post('cms/schedule/report/region', data)
     if (res.code === 0) {
-      const arr: any = res.data;
+      const arr: any = res.data
 
-      const arr2: any = [];
+      const arr2: any = []
 
       arr.forEach((v: any, i: number) => {
-        const cityTxt = `${v.province}${v.city ? "/" + v.city : ""}${
-          v.region ? "/" + v.region : ""
-        }`;
+        const cityTxt = `${v.province}${v.city ? '/' + v.city : ''}${
+          v.region ? '/' + v.region : ''
+        }`
         arr2.push({
           ...v,
           cityAll: cityTxt,
-          id: cityTxt ? cityTxt : i,
-        });
-      });
+          id: cityTxt ? cityTxt : i
+        })
+      })
 
       const obj = {
         list: arr2,
-        total: res.data.length,
-      };
-      dispatch({ type: "B1/getListArea", payload: obj });
+        total: res.data.length
+      }
+      dispatch({ type: 'B1/getListArea', payload: obj })
     }
-  };
-};
+  }
+}
 
 /**
  * 获取 区域 里面的 按日期查看 列表
  */
 export const B1_APIgetTimeList = (data: any) => {
-  return http.post("cms/schedule/report/trend", data);
-};
+  return http.post('cms/schedule/report/trend', data)
+}

src/store/action/B2Scene.ts

@@ -1,55 +1,55 @@
-import http from "@/utils/http";
-import { AppDispatch } from "..";
+import http from '@/utils/http'
+import { AppDispatch } from '..'
 /**
  * 获取 进度统计 表格列表（存到仓库）
  */
-export const B2_APIgetlist = (data: any) => {
+export const B2_APIgetlist = (data: any): any => {
   return async (dispatch: AppDispatch) => {
-    const res = await http.post("cms/scene/pageList", data);
+    const res = await http.post('cms/scene/pageList', data)
     if (res.code === 0) {
       const obj = {
         list: res.data.records,
-        total: res.data.total,
-      };
-      dispatch({ type: "B2/getList", payload: obj });
+        total: res.data.total
+      }
+      dispatch({ type: 'B2/getList', payload: obj })
     }
-  };
-};
+  }
+}
 
 /**
  * 获取 进度统计 表格列表（导出表格）
  */
 export const B2_APIgetlistAll = (data: any) => {
-  return http.post("cms/scene/pageList", data);
-};
+  return http.post('cms/scene/pageList', data)
+}
 
 /**
  * 删除 单个表格数据
  */
 export const B2_APIremove = (id: number) => {
-  return http.get(`cms/scene/remove/${id}`);
-};
+  return http.get(`cms/scene/remove/${id}`)
+}
 
 /**
  * 重置 单个表格数据
  */
 export const B2_APIreset = (id: number) => {
-  return http.get(`cms/scene/reset/${id}`);
-};
+  return http.get(`cms/scene/reset/${id}`)
+}
 
 /**
  * 审核
  */
 export const B2_APIAudit = (data: any) => {
-  return http.post("cms/scene/audit", data);
-};
+  return http.post('cms/scene/audit', data)
+}
 
 /**
  * 重复的场景
  */
 export const B2_APIlookReDo = () => {
-  return http.get("cms/scene/duplicateRoom");
-};
+  return http.get('cms/scene/duplicateRoom')
+}
 
 // /**
 //  * 查询机房编码是否存在
@@ -62,19 +62,19 @@ export const B2_APIlookReDo = () => {
  * 更新机房编码
  */
 export const B2_APIeditNum = (id: number, num: string) => {
-  return http.get(`cms/scene/update/${id}/${num}`);
-};
+  return http.get(`cms/scene/update/${id}/${num}`)
+}
 
 /**
  * 查询机房编码是否存在
  */
 export const B2_APInumIsOk = (num: string) => {
-  return http.get(`cms/scene/room/exist/${num}`);
-};
+  return http.get(`cms/scene/room/exist/${num}`)
+}
 
 /**
  * 场景码匹配
  */
 export const B2_APImateNum = (data: string[]) => {
-  return http.post("cms/scene/getListBySceneCodes", data);
-};
+  return http.post('cms/scene/getListBySceneCodes', data)
+}

src/store/action/B3Push.ts

@@ -1,31 +1,31 @@
-import http from "@/utils/http";
-import { AppDispatch } from "..";
+import http from '@/utils/http'
+import { AppDispatch } from '..'
 /**
  * 获取 进度统计 表格列表（存到仓库）
  */
-export const B3_APIgetlist = (data: any) => {
+export const B3_APIgetlist = (data: any): any => {
   return async (dispatch: AppDispatch) => {
-    const res = await http.post("cms/push/pageList", data);
+    const res = await http.post('cms/push/pageList', data)
     if (res.code === 0) {
       const obj = {
         list: res.data.records,
-        total: res.data.total,
-      };
-      dispatch({ type: "B3/getList", payload: obj });
+        total: res.data.total
+      }
+      dispatch({ type: 'B3/getList', payload: obj })
     }
-  };
-};
+  }
+}
 
 /**
  * 获取 进度统计 表格列表（导出表格）
  */
 export const B3_APIgetlistAll = (data: any) => {
-  return http.post("cms/push/pageList", data);
-};
+  return http.post('cms/push/pageList', data)
+}
 
 /**
  * 点击推送
  */
 export const B3_APIpush = (arr: string[]) => {
-  return http.post(`cms/push/send`, arr);
-};
+  return http.post(`cms/push/send`, arr)
+}

src/store/action/B4JsonPush.ts

@@ -1,24 +1,24 @@
-import http from "@/utils/http";
-import { AppDispatch } from "..";
+import http from '@/utils/http'
+import { AppDispatch } from '..'
 /**
  *Json推送 表格列表（存到仓库）
  */
-export const B4_APIgetlist = (data: any) => {
+export const B4_APIgetlist = (data: any): any => {
   return async (dispatch: AppDispatch) => {
-    const res = await http.post("cms/json/pageList", data);
+    const res = await http.post('cms/json/pageList', data)
     if (res.code === 0) {
       const obj = {
         list: res.data.records,
-        total: res.data.total,
-      };
-      dispatch({ type: "B4/getList", payload: obj });
+        total: res.data.total
+      }
+      dispatch({ type: 'B4/getList', payload: obj })
     }
-  };
-};
+  }
+}
 
 /**
  *Json推送 表格列表（导出表格）
  */
 export const B4_APIgetlistAll = (data: any) => {
-  return http.post("cms/json/pageList", data);
-};
+  return http.post('cms/json/pageList', data)
+}

src/store/action/C1User.ts

@@ -1,55 +1,53 @@
-import http from "@/utils/http";
-import { AppDispatch } from "..";
+import http from '@/utils/http'
+import { AppDispatch } from '..'
 /**
  * 获取 用户管理 表格列表（存到仓库）
  */
-export const C1_APIgetlist = (data: any, falg?: boolean) => {
+export const C1_APIgetlist = (data: any, falg?: boolean): any => {
   return async (dispatch: AppDispatch) => {
-    const res = await http.post("sys/user/pageList", data);
+    const res = await http.post('sys/user/pageList', data)
     if (res.code === 0) {
       const obj = {
         list: res.data.records,
-        total: res.data.total,
-      };
+        total: res.data.total
+      }
       if (falg) {
         dispatch({
-          type: "C1/getListAll",
+          type: 'C1/getListAll',
           payload: obj.list.map((v: any) => ({
             value: v.id,
-            label: `${v.userName} - ${v.roleName}${
-              v.realName ? " - " + v.realName : ""
-            }`,
-          })),
-        });
-      } else dispatch({ type: "C1/getList", payload: obj });
+            label: `${v.userName} - ${v.roleName}${v.realName ? ' - ' + v.realName : ''}`
+          }))
+        })
+      } else dispatch({ type: 'C1/getList', payload: obj })
     }
-  };
-};
+  }
+}
 
 /**
  * 重置密码
  */
 export const C1_APIpassReset = (id: number) => {
-  return http.get(`sys/user/resetPass/${id}`);
-};
+  return http.get(`sys/user/resetPass/${id}`)
+}
 
 /**
  * 删除用户
  */
 export const C1_APIremoves = (id: number) => {
-  return http.get(`sys/user/removes/${id}`);
-};
+  return http.get(`sys/user/removes/${id}`)
+}
 
 /**
  * 新增/编辑
  */
 export const C1_APIadd = (data: any) => {
-  return http.post("sys/user/save", data);
-};
+  return http.post('sys/user/save', data)
+}
 
 /**
  * 通过id获取详情
  */
 export const C1_APIgetInfo = (id: number) => {
-  return http.get(`sys/user/detail/${id}`);
-};
+  return http.get(`sys/user/detail/${id}`)
+}

src/store/action/C2Log.ts

@@ -1,17 +1,17 @@
-import http from "@/utils/http";
-import { AppDispatch } from "..";
+import http from '@/utils/http'
+import { AppDispatch } from '..'
 /**
  * 获取日志表格列表
  */
-export const getLogListAPI = (data: any) => {
+export const getLogListAPI = (data: any): any => {
   return async (dispatch: AppDispatch) => {
-    const res = await http.post("sys/log/list", data);
+    const res = await http.post('sys/log/list', data)
     if (res.code === 0) {
       const obj = {
         list: res.data.records,
-        total: res.data.total,
-      };
-      dispatch({ type: "log/getList", payload: obj });
+        total: res.data.total
+      }
+      dispatch({ type: 'log/getList', payload: obj })
     }
-  };
-};
+  }
+}