摄像头分页

code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/sideSheet.jsx

@@ -20,17 +20,12 @@ function SideSheets(props) {
     cameraSetup,
     rowId,
     venderList,
+    accessType,
   } = props;
   const { equipmentWarehouse } = actions;
   const [clickStyle, setclickStyle] = useState();
   const [nvrDetails, setNvrDetails] = useState("");
   const list = ["项目名称", "关联结构物", "关联测点", "关联监测因素"];
-  const type = [
-    { name: "萤石", key: "yingshi" },
-    { name: "NVR摄像头", key: "nvr" },
-    { name: "IPC 网络摄像头", key: "ipc" },
-    { name: "级联摄像头", key: "cascade" },
-  ];
   const information = {
     nvr: [
       {
@@ -38,7 +33,7 @@ function SideSheets(props) {
         basics: [
           { name: "设备名称：", key: "name" },
           { name: "设备编号：", key: "serialNo" },
-          { name: "接入方式：", key: "NJBJ858G68H" },
+          { name: "接入方式：", key: "type" },
           { name: "厂商：", key: "venderId" },
           { name: "添加账号：", key: "createUser" },
           { name: "添加时间：", key: "createTime" },
@@ -345,8 +340,8 @@ function SideSheets(props) {
                               <span
                                 style={{ fontWeight: "600", color: " #34383E" }}
                               >
-                                {item.key == "type"
+                                {item.key == "typ"
-                                  ? type.find((v) => v.key == nvrDetails.type)
+                                  ? accessType.find((v) => v.key == nvrDetails.type)
                                       .name
                                   : item.key == "venderId"
                                   ? venderList.find(

code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/camera.jsx

@@ -16,6 +16,7 @@ import CameraModal from "../components/cameraModal";
 import NvrModal from "../components/nvrModal";
 import Setup from "../components/setup";
 import SideSheets from "../components/sideSheet";
+import { accessType } from "./nvr";
 
 const CameraHeader = (props) => {
   const { dispatch, actions, user, loading, equipmentWarehouseCamera } = props;
@@ -26,7 +27,8 @@ const CameraHeader = (props) => {
   const [cameraSetup, setcameraSetup] = useState(false);
   const [setupp, setSetupp] = useState([]);
   const [venderList, setvenderList] = useState([]); //厂商信息
-  const [query, setQuery] = useState({ limit: 10, page: 0 });
+  const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息
+  const [search, setearch] = useState({}); //搜索条件
   const [rowId, setRowId] = useState(); //表格数据id
 
   const { equipmentWarehouse } = actions;
@@ -45,15 +47,17 @@ const CameraHeader = (props) => {
           JSON.stringify(["state", "type", "manufactor"])
         )
       : "";
+    console.log(equipmentWarehouseCamera);
   }, []);
 
   useEffect(() => {
     equipmentGetCamera();
-  }, []);
+  }, [query, search]);
 
   function equipmentGetCamera() {
-    dispatch(equipmentWarehouse.getCamera(query));
+    dispatch(equipmentWarehouse.getCamera({ ...query, ...search }));
   }
+
   const columns = [
     {
       title: "序号",
@@ -115,7 +119,7 @@ const CameraHeader = (props) => {
             <Button
               theme="borderless"
               onClick={() => {
-                console.log(row.id,!row.forbidden);
+                console.log(row.id, !row.forbidden);
                 dispatch(
                   equipmentWarehouse.putForbidden({
                     cameraId: row.id,
@@ -159,8 +163,12 @@ const CameraHeader = (props) => {
       },
       {
         title: "接入类型",
-        dataIndex: "cameraAbility.ability",
+        dataIndex: "cameraAbility.type",
         key: "type",
+        render: (_, r, index) => {
+          let manufactorName = data.find((item) => item.id == r.venderId);
+          return manufactorName ? manufactorName.name : "";
+        },
       },
       {
         title: "设备状态",
@@ -385,7 +393,7 @@ const CameraHeader = (props) => {
           >
             <Form.Input
               label="设备搜索："
-              field="name"
+              field="keyword"
               placeholder="请输入设备名称"
               labelPosition="left"
               style={screen}
@@ -393,7 +401,7 @@ const CameraHeader = (props) => {
             <Form.Select
               label="接入类型："
               labelPosition="left"
-              field="type1"
+              field="type"
               style={screen}
               placeholder="全部"
               showClear
@@ -463,19 +471,10 @@ const CameraHeader = (props) => {
                 marginRight: 20,
               }}
               onClick={() => {
-                api.current.validate().then((values) => {
+                api.current.validate().then((v) => {
-                  console.log(values);
+                  setearch(v);
-                  console.log(
-                    equipmentWarehouseNvr.data.filter((item) => {
-                      return (
-                        item.name.indexOf(values.name) > -1 &&
-                        item.venderId === values.venderId
-                      );
-                      // return item.venderId === values.venderId;
-                    })
-                  );
                 });
-                console.log(equipmentWarehouseCamera.data);
+                equipmentGetCamera();
               }}
             >
               搜素
@@ -606,6 +605,7 @@ const CameraHeader = (props) => {
             visible={true}
             rowId={rowId}
             venderList={venderList}
+            accessType={accessType}
             cameraSetup={cameraSetup}
             close={() => {
               setSideSheet(false);

code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx

@@ -7,6 +7,13 @@ import NvrModal from "../components/nvrModal";
 import Setup from "../components/setup";
 import SideSheets from "../components/sideSheet";
 
+export const accessType = [
+  { name: "萤石", key: "yingshi" },
+  { name: "NVR摄像头", key: "nvr" },
+  { name: "IPC 网络摄像头", key: "ipc" },
+  { name: "级联摄像头", key: "cascade" },
+];
+
 const NvrHeader = (props) => {
   const { dispatch, actions, user, loading, equipmentWarehouseNvr } = props;
   const { equipmentWarehouse } = actions;
@@ -475,6 +482,7 @@ const NvrHeader = (props) => {
           <SideSheets
             visible={true}
             rowId={rowId}
+            accessType={accessType}
             venderList={venderList}
             close={() => {
               setSideSheet(false);
@@ -488,6 +496,7 @@ const NvrHeader = (props) => {
   );
 };
 
+
 function mapStateToProps(state) {
   const { auth, global, members, equipmentWarehouseNvr } = state;
   return {