diff --git a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/cameraModal.jsx b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/cameraModal.jsx index 4b2298f..2f889ee 100644 --- a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/cameraModal.jsx +++ b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/cameraModal.jsx @@ -153,9 +153,14 @@ function cameraModal (props) { }); } else if (clickNum == 4) { //级联摄像头 + let data = cascadeRef.current.cascadeList.map((v) => { + return { id: v.id, name: v.name, }; + }); + console.log(cascadeRef.current.cascadeList) + console.log(data) cascadeRef.current.cascadeCameraForm().then((values) => { console.log(values); - dispatch(equipmentWarehouse.postAddCascade(values)).then((res) => { + dispatch(equipmentWarehouse.postAddCascade({ ...values, camera: data })).then((res) => { console.log(res); if (res.success) { onReset(); @@ -217,8 +222,10 @@ function cameraModal (props) { ipcRef.current.toempty(); } else if (clickNum == 4) { cascadeRef.current.resetCascadeCamera(); + cascadeRef.current.toempty() } else { nvrRef.current.resetFluoriteCamera(); + ipcRef.current.toempty() } } @@ -578,7 +585,7 @@ function cameraModal (props) { ) : ( - + testComplete.current = false} /> )} diff --git a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/cascadeCamera.jsx b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/cascadeCamera.jsx index 2754a4f..815671e 100644 --- a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/cascadeCamera.jsx +++ b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/cascadeCamera.jsx @@ -1,23 +1,52 @@ import React, { useState, useRef, useEffect, useImperativeHandle } from "react"; import { connect } from "react-redux"; -import { Form, Row, Col, Checkbox, Radio, CheckboxGroup, } from "@douyinfe/semi-ui"; +import { Form, Row, Col, Checkbox, Radio, CheckboxGroup, Input } from "@douyinfe/semi-ui"; import { IconEdit, IconPlayCircle, } from "@douyinfe/semi-icons"; import "./cameraModal.less"; import PerfectScrollbar from "perfect-scrollbar"; let equipmentScrollbar; -function cascadeCamera ({ dRef, dispatch, actions, cameraData, parentCamera, testComplete }) { +function cascadeCamera ({ dRef, dispatch, actions, cameraData, parentCamera, testComplete, close }) { const form = useRef(); const { equipmentWarehouse } = actions; const [sip, setSip] = useState([]); - const [NVRcameraList, setNVRcameraList] = useState([]); //nvr视频流列表 - const [nvrCheckList, setNvrCheckList] = useState([]); //nvr视频流多选 + const [cascadeList, setCascadeList] = useState([]); //nvr视频流列表 + const [CheckList, setCheckList] = useState([]); //nvr视频流多选 const [isAllChoose, setIsAllChoose] = useState(false); //全选 - const cameraDataNvr = cameraData.nvr || ""; + const [formData, setFormData] = useState() //表单数据 useEffect(() => { dispatch(equipmentWarehouse.getCascadeSIP()).then((res) => { - setSip(res.payload.data); + setSip(res.payload.data); + if (cameraData) { + let sip=res.payload.data.find((item)=>item.streamid==cameraData.topSerialNo) + dispatch(equipmentWarehouse.getCascadeStream({ sip: sip.sipip })).then((res) => { + console.log(res.payload.data); + let oneData = res.payload.data[0]; + let modifyData = res.payload.data.find( + (item) => item.id == cameraData.gbId + ); + console.log(modifyData) + let data = res.payload.data.map((item, index) => { + if (item.camera) { + item.name = item.camera.name; + } + if (index == 0) { + item = modifyData; + } + if ( + + item.camera&&item.camera.name == cameraData.name + + ) { + item = oneData; + } + return item; + }) + setCascadeList(data) + setCheckList([data[0].id]) + }); + } }); const videoStreaming = document.getElementById("video_streaming"); if (videoStreaming && equipmentScrollbar) { @@ -26,32 +55,32 @@ function cascadeCamera ({ dRef, dispatch, actions, cameraData, parentCamera, tes }, []); useEffect(() => { - NVRcameraList + cascadeList ? (equipmentScrollbar = new PerfectScrollbar("#video_streaming", { suppressScrollX: true, })) : ""; - }, [NVRcameraList]); + }, [cascadeList]); useEffect(() => { //测试成功后获取级联视频流 - console.log(testComplete) if (testComplete) { - dispatch(equipmentWarehouse.getCascadeStream({ sip: "111" })).then((res) => { + dispatch(equipmentWarehouse.getCascadeStream({ sip: formData.sip })).then((res) => { console.log(res.payload.data); let chooseList = []; let data = res.payload.data.map((item, index) => { item.change = false; return item; }) - setNVRcameraList(data) + setCascadeList(data) for (let index = 0; index < data.length; index++) { chooseList.push(data[index].id); } - setNvrCheckList(chooseList); + setCheckList(chooseList); setIsAllChoose(true); }); } + close() }, [testComplete]) @@ -87,48 +116,49 @@ function cascadeCamera ({ dRef, dispatch, actions, cameraData, parentCamera, tes }, ]; - function NvrChangeName (e, index, name) { + function NvrChangeName (e, index, id) { //级联摄像头视频流获取修改名称 - let NvrchangeList = JSON.parse(JSON.stringify(NVRcameraList)); - if (cameraData.name == name) { - NvrchangeList[index].change = true; - setNVRcameraList(NvrchangeList); + let NvrchangeList = JSON.parse(JSON.stringify(cascadeList)); + if (!cameraData||cameraData.gbId==id) { + NvrchangeList[index].change = true; + setCascadeList(NvrchangeList); } e.stopPropagation(); } function nvronBlur (index) { //nvr摄像头名称修改失去焦点 - let NvrchangeList = JSON.parse(JSON.stringify(NVRcameraList)); + let NvrchangeList = JSON.parse(JSON.stringify(cascadeList)); NvrchangeList[index].change = false; - setNVRcameraList(NvrchangeList); + setCascadeList(NvrchangeList); } function inputchange (e, index) { //nvr摄像头名称修改 - let NvrchangeList = JSON.parse(JSON.stringify(NVRcameraList)); + let NvrchangeList = JSON.parse(JSON.stringify(cascadeList)); NvrchangeList[index].name = e; - setNVRcameraList(NvrchangeList); + setCascadeList(NvrchangeList); } function allChoose (e) { //全选/全不选 let chooseList = []; - if (NVRcameraList.length == nvrCheckList.length) { - setNvrCheckList([]); + if (cascadeList.length == CheckList.length) { + setCheckList([]); setIsAllChoose(false); } else { - for (let index = 0; index < NVRcameraList.length; index++) { - chooseList.push(NVRcameraList[index].id); + for (let index = 0; index < cascadeList.length; index++) { + chooseList.push(cascadeList[index].id); } - setNvrCheckList(chooseList); + setCheckList(chooseList); setIsAllChoose(true); } } function playVideo (e) { //nvr播放视频 console.log("22222222222222222"); + e.stopPropagation(); } - function onDisabled (name) { - if ((cameraDataNvr && cameraData.name == name) || !cameraDataNvr) { + function onDisabled (id) { + if (id==cameraData.gbId) { return false; } else { return true; @@ -140,6 +170,12 @@ function cascadeCamera ({ dRef, dispatch, actions, cameraData, parentCamera, tes //子组件暴露给父组件的方法 cascadeCameraForm: form.current.validate, resetCascadeCamera: form.current.reset, + cascadeList: cascadeList.filter((v) => + CheckList.some((e) => e == v.id) + ), + toempty: () => { + setCascadeList([]) + } })); return ( <> @@ -150,6 +186,7 @@ function cascadeCamera ({ dRef, dispatch, actions, cameraData, parentCamera, tes labelWidth="115px" onValueChange={(values) => { console.log(values); + setFormData(values) }} getFormApi={(formApi) => (form.current = formApi)} @@ -202,14 +239,14 @@ function cascadeCamera ({ dRef, dispatch, actions, cameraData, parentCamera, tes id="video_streaming" style={{ maxHeight: 300, position: "relative" }} > - {NVRcameraList.length > 0 ? ( + {cascadeList.length > 0 ? (
allChoose(e)} aria-label="全选" > @@ -223,17 +260,17 @@ function cascadeCamera ({ dRef, dispatch, actions, cameraData, parentCamera, tes type="pureCard" direction="vertical" aria-label="视频流获取" - value={nvrCheckList} + value={CheckList} onChange={(nvrCheck) => { - setNvrCheckList(nvrCheck); - if (NVRcameraList.length == nvrCheck.length) { + setCheckList(nvrCheck); + if (cascadeList.length == nvrCheck.length) { setIsAllChoose(true); } else { setIsAllChoose(false); } }}> - {NVRcameraList.length > 0 - ? NVRcameraList.map((item, index) => ( + {cascadeList.length > 0 + ? cascadeList.map((item, index) => (
- NvrChangeName(e, index, item.name) + NvrChangeName(e, index, item.id) } />
diff --git a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/nvrCamera.jsx b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/nvrCamera.jsx index cf90045..f93c456 100644 --- a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/nvrCamera.jsx +++ b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/nvrCamera.jsx @@ -68,8 +68,6 @@ function nvrCamera ({ dispatch, actions, nvrRef, cameraData, addNvr, nvrNumber } ) { item = oneData; } - // item.change = false; - // item.support = false; if (item.camera) { item.name = item.camera.name; } diff --git a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/camera.jsx b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/camera.jsx index a940fc3..eb05387 100644 --- a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/camera.jsx +++ b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/camera.jsx @@ -31,7 +31,7 @@ const CameraHeader = (props) => { const [setupp, setSetupp] = useState([]); const [venderList, setvenderList] = useState([]); //厂商信息 const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息 - const [search, setearch] = useState({}); //搜索条件 + const [search, setSearch] = useState({}); //搜索条件 const [rowId, setRowId] = useState(); //表格数据id const [cameraData, setCameraData] = useState({}); //表格数据 const [modify, setModify] = useState(false); //修改 @@ -123,16 +123,16 @@ const CameraHeader = (props) => { onClick={() => { if (deviceClickb.current) { if (row.type == "nvr") { - setearch({ ...searchb.current, nvrId: row.nvr.id }) + setSearch({ ...searchb.current, nvrId: row.nvr.id }) } else { - setearch({ ...searchb.current, externalDomain: row.externalDomain }) + setSearch({ ...searchb.current, externalDomain: row.externalDomain }) } deviceClickb.current = false } else { if (row.type == "nvr") { - setearch({ ...searchb.current, nvrId: null }) + setSearch({ ...searchb.current, nvrId: null }) } else { - setearch({ ...searchb.current, externalDomain: null }) + setSearch({ ...searchb.current, externalDomain: null }) } deviceClickb.current = true } @@ -205,7 +205,7 @@ const CameraHeader = (props) => { row.forbidden ) ).then(() => { - equipmentGetCamera(); + dispatch(equipmentWarehouse.getCamera(searchb.current)); }); }} > @@ -227,7 +227,7 @@ const CameraHeader = (props) => { row.forbidden ) ).then(() => { - equipmentGetCamera(); + dispatch(equipmentWarehouse.getCamera(searchb.current)); }); }} > @@ -244,7 +244,7 @@ const CameraHeader = (props) => { dispatch( equipmentWarehouse.delCamera(row.id) ).then(() => { - equipmentGetCamera(); + dispatch(equipmentWarehouse.getCamera(searchb.current)); }); }} > @@ -608,7 +608,7 @@ const CameraHeader = (props) => { }} onClick={() => { api.current.validate().then((v) => { - setearch(v); + setSearch(v); setQuery({ limit: 10, page: 0 }) searchb.current = { ...v, limit: 10, page: 0 } }); @@ -629,7 +629,7 @@ const CameraHeader = (props) => { }} onClick={() => { api.current.reset(); - setearch({}); + setSearch({}); }} > 重置 @@ -772,7 +772,7 @@ const CameraHeader = (props) => { setAddNvr(false) setNvrNumber("") setAxyData("") - equipmentGetCamera(); + dispatch(equipmentWarehouse.getCamera(searchb.current)); }} modalName={modalName} /> diff --git a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx index fba40db..4e2663d 100644 --- a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx +++ b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx @@ -27,6 +27,7 @@ const NvrHeader = (props) => { const [venderList, setvenderList] = useState([]); //厂商信息 const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息 const [search, setearch] = useState({}); //搜索条件 + const searchb = useRef(search) const [rowId, setRowId] = useState(); //表格数据id const [reminder, setReminder] = useState(false); //提醒弹框 const api = useRef(); @@ -117,7 +118,7 @@ const NvrHeader = (props) => { modalName="revise" venderList={venderList} close={() => { - equipmentGetNvr(); + dispatch(equipmentWarehouse.getNvr(searchb.current)); }} /> @@ -137,7 +138,7 @@ const NvrHeader = (props) => { position="topRight" onConfirm={() => { dispatch(equipmentWarehouse.delNvr(row.id)).then(() => { - equipmentGetNvr(); + dispatch(equipmentWarehouse.getNvr(searchb.current)); }); }} > @@ -453,6 +454,7 @@ const NvrHeader = (props) => { api.current.validate().then((v) => { setearch(v); setQuery({ limit: 10, page: 0 }) + searchb.current = { ...v, limit: 10, page: 0 } }); }} >