diff --git a/code/VideoAccess-VCMP/web/client/src/components/index.js b/code/VideoAccess-VCMP/web/client/src/components/index.js index 5e7f4a7..9f703c5 100644 --- a/code/VideoAccess-VCMP/web/client/src/components/index.js +++ b/code/VideoAccess-VCMP/web/client/src/components/index.js @@ -4,6 +4,7 @@ import Coming from './coming' import ReminderBox from './reminderBox' import VideoPlay from './videoPlayer/videoPlay' import VideoPlayModal from './videoPlayer/videoPlayModal' +import Setup from './setup' export { SimpleFileDownButton, @@ -11,4 +12,5 @@ export { ReminderBox, VideoPlay, VideoPlayModal, + Setup }; diff --git a/code/VideoAccess-VCMP/web/client/src/components/setup.jsx b/code/VideoAccess-VCMP/web/client/src/components/setup.jsx new file mode 100644 index 0000000..9ff3a55 --- /dev/null +++ b/code/VideoAccess-VCMP/web/client/src/components/setup.jsx @@ -0,0 +1,121 @@ +import React, { useState, useEffect } from "react"; +import { + Modal, + CheckboxGroup, + Checkbox, +} from "@douyinfe/semi-ui"; + +function Setup(props) { + const { + close, + tableType, + tableList + } = props; + const [check, setCheck] = useState([]); + + const checkboxcss = { width: "25%", height: 16, margin: "0 0 20px 0" }; + + useEffect(() => { + //获取是否勾选信息 + const checkItem = localStorage.getItem(tableType); + setCheck(checkItem?JSON.parse(checkItem) : []) + ischeck(); + }, []); + function ischeck(value) { + if (check.length >= 8) { + if (check.includes(value)) { + return false; + } else { + return true; + } + } + } + + return ( + + 表格属性设置 + + {check.length}/8 + + + } + visible={true} + style={{ width: 600 }} + onOk={() => { + localStorage.setItem(tableType, JSON.stringify(check)); + close(); + }} + onCancel={() => { + close(); + }} + > + { + setCheck(check); + ischeck(); + }} + > + {tableList.map((item,index)=>{ + return( +
+
+ {item.title} +
+
+ {item.list.map((itm) => { + return ( + + {itm.name} + + ); + })} +
+
+ )})} +
+
+ ); +} + +export default Setup; diff --git a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/setup.jsx b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/setup.jsx deleted file mode 100644 index 1100342..0000000 --- a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/setup.jsx +++ /dev/null @@ -1,191 +0,0 @@ -import React, { useState, useEffect } from "react"; -import { - Modal, - CheckboxGroup, - Checkbox, -} from "@douyinfe/semi-ui"; - -function Setup(props) { - const { - visible, - close, - SETUPS, - CAMERAS, - cameraSetup, - } = props; - const [check, setCheck] = useState([]); - - const checkboxcss = { width: "25%", height: 16, margin: "0 0 20px 0" }; - - useEffect(() => { - //获取是否勾选信息 - const nvrItem = localStorage.getItem(SETUPS); - const cameraItem = localStorage.getItem(CAMERAS); - if (cameraSetup) { - setCheck(cameraItem ? JSON.parse(cameraItem) : []); - } else { - setCheck(nvrItem ? JSON.parse(nvrItem) : []); - } - ischeck(); - }, []); - - const equipmentNVR = [ - { name: "设备厂家", value: "manufactor" }, - { name: "添加账号", value: "accountNumber" }, - { name: "通道数", value: "passageway" }, - { name: "端口", value: "port" }, - { name: "设备状态", value: "state" }, - { name: "创建时间", value: "time" }, - ]; - const projectNVR = [ - { name: "项目名称", value: "name" }, - { name: "pcode", value: "pcode" }, - { name: "结构物", value: "structure" }, - ]; - const equipmentCamera = [ - { name: "设备厂家", value: "manufactor" }, - { name: "接入类型", value: "type" }, - { name: "设备状态", value: "state" }, - { name: "云台支持", value: "support" }, - { name: "内存卡信息", value: "memoryCard" }, - { name: "设备创建时间", value: "time" }, - { name: "设备添加账号", value: "account" }, - ]; - const projectCamera = [ - { name: "项目名称", value: "name" }, - { name: "pcode", value: "pcode" }, - { name: "结构物", value: "structure" }, - { name: "测点", value: "measuringPoint" }, - { name: "监测因素", value: "factor" }, - ]; - - function ischeck(value) { - if (check.length >= 8) { - if (check.includes(value)) { - return false; - } else { - return true; - } - } - } - - return ( - - 表格属性设置 - - {check.length}/8 - - - } - visible={visible} - style={{ width: 600 }} - onOk={() => { - cameraSetup - ? localStorage.setItem(CAMERAS, JSON.stringify(check)) - : localStorage.setItem(SETUPS, JSON.stringify(check)); - close(); - }} - onCancel={() => { - close(); - }} - > - { - setCheck(check); - ischeck(); - }} - > -
-
- 设备信息 -
-
- {(cameraSetup ? equipmentCamera : equipmentNVR).map((item) => { - return ( - - {item.name} - - ); - })} -
-
- -
-
- 项目信息 -
-
- {(cameraSetup ? projectCamera : projectNVR).map((item) => { - return ( - - {item.name} - - ); - })} -
-
-
-
- ); -} - -export default Setup; 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 22f4e02..39d19c4 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 @@ -17,7 +17,7 @@ import { SimpleFileDownButton, VideoPlayModal } from "$components"; import "../style.less"; import CameraModal from "../components/cameraModal"; import RemarksModal from "../components/remarksModal"; -import Setup from "../components/setup"; +import {Setup} from "$components"; import SideSheets from "../components/sideSheet"; import { skeletonScreen } from "../components/skeletonScreen"; import { accessType } from "./nvr"; @@ -51,7 +51,30 @@ const CameraHeader = (props) => { const page = useRef(query.page); const deviceClickb = useRef(true) const CAMERAS = "cameras"; - + const tableList = [//表格属性 + { + title:'设备信息', + list:[ + { name: "设备厂家", value: "manufactor" }, + { name: "接入类型", value: "type" }, + { name: "设备状态", value: "state" }, + { name: "云台支持", value: "support" }, + { name: "内存卡信息", value: "memoryCard" }, + { name: "设备创建时间", value: "time" }, + { name: "设备添加账号", value: "account" }, + ] + }, + { + title:'项目信息', + list:[ + { name: "项目名称", value: "name" }, + { name: "pcode", value: "pcode" }, + { name: "结构物", value: "structure" }, + { name: "测点", value: "measuringPoint" }, + { name: "监测因素", value: "factor" }, + ] + }, + ]; useEffect(() => { //安心云传参 let isAxyData = props.location.search @@ -771,9 +794,8 @@ const CameraHeader = (props) => { {setup ? ( { setSetup(false); attribute(venderList); 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 a84b557..21a9f58 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 @@ -5,7 +5,7 @@ import { Button, Form, Table, Pagination, Skeleton, Popconfirm, Popover, Tag, } import "../style.less"; import { ApiTable } from "$utils"; import NvrModal from "../components/nvrModal"; -import Setup from "../components/setup"; +import {Setup} from "$components"; import SideSheets from "../components/sideSheet"; import { skeletonScreen } from "../components/skeletonScreen"; import { ReminderBox } from "../../../components/index"; @@ -36,6 +36,27 @@ const NvrHeader = (props) => { const SETUPS = "setups"; const USER = "user" + props.user.id const nvrRef = useRef(); //获取子组件的设备编号 + const tableList = [//表格属性 + { + title:'设备信息', + list:[ + { name: "设备厂家", value: "manufactor" }, + { name: "添加账号", value: "accountNumber" }, + { name: "通道数", value: "passageway" }, + { name: "端口", value: "port" }, + { name: "设备状态", value: "state" }, + { name: "创建时间", value: "time" }, + ] + }, + { + title:'项目信息', + list:[ + { name: "项目名称", value: "name" }, + { name: "pcode", value: "pcode" }, + { name: "结构物", value: "structure" }, + ] + }, + ]; useEffect(() => { dispatch(actions.equipmentWarehouse.getVender()).then((res) => { @@ -575,8 +596,8 @@ const NvrHeader = (props) => { {setup ? ( { setSetup(false); attribute(venderList); diff --git a/code/VideoAccess-VCMP/web/client/src/sections/offline/components/setup.jsx b/code/VideoAccess-VCMP/web/client/src/sections/offline/components/setup.jsx deleted file mode 100644 index 99ddc86..0000000 --- a/code/VideoAccess-VCMP/web/client/src/sections/offline/components/setup.jsx +++ /dev/null @@ -1,138 +0,0 @@ -import React, { useState, useEffect } from "react"; -import { - Modal, - CheckboxGroup, - Checkbox, -} from "@douyinfe/semi-ui"; - -function Setup(props) { - const { - visible, - close, - CODE,//错误码 - PIGEON,//信鸽 - pigeonSetup, - } = props; - const [check, setCheck] = useState([]); - - const checkboxcss = { width: "25%", height: 16, margin: "0 0 20px 0" }; - - useEffect(() => { - //获取是否勾选信息 - const codeItem = localStorage.getItem(CODE); - const pigeonItem = localStorage.getItem(PIGEON); - if (pigeonSetup) { - setCheck(pigeonItem ? JSON.parse(pigeonItem) : []); - } else { - setCheck(codeItem ? JSON.parse(codeItem) : []); - } - ischeck(); - }, []); - - const equipmentCode = [//状态码管理 - { name: "常规解决方案", value: "manufactor" }, - { name: "状态频率", value: "accountNumber" }, - ]; - const equipmentCarrierpigeon = [//信鸽服务 - { name: "策略类型", value: "manufactor" }, - { name: "推送机制", value: "type" }, - { name: "监听设备数量", value: "state" }, - { name: "累计推送次数", value: "support" }, - ]; - - function ischeck(value) { - if (check.length >= 8) { - if (check.includes(value)) { - return false; - } else { - return true; - } - } - } - - return ( - - 表格属性设置 - - {check.length}/8 - - - } - visible={visible} - style={{ width: 600 }} - onOk={() => { - pigeonSetup - ? localStorage.setItem(PIGEON, JSON.stringify(check)) - : localStorage.setItem(CODE, JSON.stringify(check)); - close(); - }} - onCancel={() => { - close(); - }} - > - { - setCheck(check); - ischeck(); - }} - > -
-
- {pigeonSetup?'推送信息':'状态码信息'} -
-
- {(pigeonSetup ? equipmentCarrierpigeon : equipmentCode).map((item) => { - return ( - - {item.name} - - ); - })} -
-
-
-
- ); -} - -export default Setup; diff --git a/code/VideoAccess-VCMP/web/client/src/sections/offline/containers/carrierpigeon.jsx b/code/VideoAccess-VCMP/web/client/src/sections/offline/containers/carrierpigeon.jsx index e86ffea..def979f 100644 --- a/code/VideoAccess-VCMP/web/client/src/sections/offline/containers/carrierpigeon.jsx +++ b/code/VideoAccess-VCMP/web/client/src/sections/offline/containers/carrierpigeon.jsx @@ -4,7 +4,7 @@ import moment from "moment"; import { Button, Form, Table, Pagination, Skeleton, Popconfirm, Popover, Tag, } from "@douyinfe/semi-ui"; import "../style.less"; import { ApiTable } from "$utils"; -import Setup from "../components/setup"; +import {Setup} from "$components"; // import SideSheets from "../components/sideSheet"; // import { skeletonScreen } from "../components/skeletonScreen"; // import { ReminderBox } from "../../../components/index"; @@ -34,7 +34,15 @@ const Carrierpigeon = (props) => { const PIGEON = "pigeon"; const USER = "user" + props.user.id const nvrRef = useRef(); //获取子组件的设备编号 - + const tableList = [//表格属性 + { + title:'状态码信息', + list:[ + { name: "常规解决方案", value: "manufactor" }, + { name: "状态频率", value: "accountNumber" }, + ] + }, + ]; useEffect(() => { dispatch(actions.equipmentWarehouse.getVender()).then((res) => { setvenderList(res.payload.data); @@ -535,9 +543,8 @@ const Carrierpigeon = (props) => { {setup ? ( { setSetup(false); attribute(venderList); diff --git a/code/VideoAccess-VCMP/web/client/src/sections/offline/containers/statuscode.jsx b/code/VideoAccess-VCMP/web/client/src/sections/offline/containers/statuscode.jsx index eeb8b53..318398f 100644 --- a/code/VideoAccess-VCMP/web/client/src/sections/offline/containers/statuscode.jsx +++ b/code/VideoAccess-VCMP/web/client/src/sections/offline/containers/statuscode.jsx @@ -3,8 +3,8 @@ import { connect } from "react-redux"; import moment from "moment"; import { Button, Form, Table, Pagination, Skeleton, Popconfirm, Popover, Tag, } from "@douyinfe/semi-ui"; import "../style.less"; -import { ApiTable } from "$utils"; -import Setup from "../components/setup"; +import {Setup} from "$components"; + // import SideSheets from "../components/sideSheet"; // import { skeletonScreen } from "../components/skeletonScreen"; // import { ReminderBox } from "../../../components/index"; @@ -34,7 +34,15 @@ const Statuscode = (props) => { const CODE = "code"; const USER = "user" + props.user.id const nvrRef = useRef(); //获取子组件的设备编号 - + const tableList = [//表格属性 + { + title:'状态码信息', + list:[ + { name: "常规解决方案", value: "manufactor" }, + { name: "状态频率", value: "accountNumber" }, + ] + }, + ]; useEffect(() => { dispatch(actions.equipmentWarehouse.getVender()).then((res) => { setvenderList(res.payload.data); @@ -443,7 +451,7 @@ const Statuscode = (props) => { >
{ {setup ? ( { setSetup(false); attribute(venderList);