free-sun
/
FS-IOT
15
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'dev_trial' of https://gitea.anxinyun.cn/free-sun/FS-IOT into dev_trial

release_1.3.0
wenlele 3 years ago
parent
9c70d13519 a479033da9
commit
0a69db2d33
1 changed files with 94 additions and 32 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 126
      code/VideoAccess-VCMP/web/client/src/sections/openness/containers/mirroringDetail.jsx

126
code/VideoAccess-VCMP/web/client/src/sections/openness/containers/mirroringDetail.jsx
View File

@ -1,7 +1,7 @@
import React, { useEffect, useState, useRef } from 'react'; import React, { useEffect, useState, useRef } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import '../style.less' import '../style.less'
import { Tree, Popconfirm, Typography, Input, Switch, Modal, Checkbox, CheckboxGroup, Select, Toast,Button } from "@douyinfe/semi-ui" import { Tree, Popconfirm, Typography, Input, Switch, Modal, Checkbox, CheckboxGroup, Select, Toast, Button } from "@douyinfe/semi-ui"
import VideoScreen from '../components/videoScreen'; import VideoScreen from '../components/videoScreen';
import { set } from 'nprogress'; import { set } from 'nprogress';
@ -110,7 +110,8 @@ const MirroringDetail = (props) => {
const [plainOptions, setPlainOptions] = useState([]);//摄像头选择 const [plainOptions, setPlainOptions] = useState([]);//摄像头选择
const [checkedList, setCheckedList] = useState([]);//选中的摄像头列表 const [checkedList, setCheckedList] = useState([]);//选中的摄像头列表
const [mykeyword, setMykeyword] = useState('');//摄像头搜索 const [mykeyword, setMykeyword] = useState('');//摄像头搜索
const [allCameraList, setAllCameraList] = useState([])//标签组的摄像头列表 const [allCameraList, setAllCameraList] = useState([])//所有的摄像头
const [labelCameraList, setLabelCameraList] = useState([])//标签组的摄像头
const [showCameraList, setShowCameraList] = useState([])//展示的摄像头列表 const [showCameraList, setShowCameraList] = useState([])//展示的摄像头列表
const [saveShowList, setSaveShowList] = useState([])//展示的摄像头列表 const [saveShowList, setSaveShowList] = useState([])//展示的摄像头列表
const [addCamera, setAddCamera] = useState(false);//添加视频弹框 const [addCamera, setAddCamera] = useState(false);//添加视频弹框
@ -184,30 +185,30 @@ const MirroringDetail = (props) => {
setCheckall(checkedList.length === showCameraList.length); setCheckall(checkedList.length === showCameraList.length);
} }
function topublish (publish) {//编辑镜像信息 function topublish (publish) {//编辑镜像信息
let filterGroupnum=0 let filterGroupnum = 0
let cantopublish=true let cantopublish = true
for (let i = 0; i < filterGroup.length; i++) { for (let i = 0; i < filterGroup.length; i++) {
for (let j = 0; j < filterGroup.length; j++) { for (let j = 0; j < filterGroup.length; j++) {
if(filterGroup[i].name==filterGroup[j].name){ if (filterGroup[i].name == filterGroup[j].name) {
filterGroupnum++ filterGroupnum++
} }
} }
} }
if(filterGroupnum>filterGroup.length){ if (filterGroupnum > filterGroup.length) {
cantopublish=false cantopublish = false
let opts = { let opts = {
content: '筛选项名称不能重复，请修改', content: '筛选项名称不能重复，请修改',
duration: 3, duration: 3,
}; };
Toast.error(opts) Toast.error(opts)
}else{ } else {
for (let k = 0; k < filterGroup.length; k++) { for (let k = 0; k < filterGroup.length; k++) {
let filtersarr=[] let filtersarr = []
for (let l = 0; l < filterGroup[k].filters.length; l++) { for (let l = 0; l < filterGroup[k].filters.length; l++) {
filtersarr.push(filterGroup[k].filters[l].name) filtersarr.push(filterGroup[k].filters[l].name)
} }
if(Array.from(new Set(filtersarr)).length<filterGroup[k].filters.length){ if (Array.from(new Set(filtersarr)).length < filterGroup[k].filters.length) {
cantopublish=false cantopublish = false
Toast.error({ Toast.error({
content: '标签组名称不能重复，请修改', content: '标签组名称不能重复，请修改',
duration: 3, duration: 3,
@ -215,7 +216,7 @@ const MirroringDetail = (props) => {
} }
} }
} }
if(cantopublish){ if (cantopublish) {
let mirrordata = { let mirrordata = {
mirrorId: mirrorId, mirrorId: mirrorId,
template: template, template: template,
@ -378,8 +379,8 @@ const MirroringDetail = (props) => {
setEditKey('') setEditKey('')
} }
function cameraAdd (item) {//添加摄像头 function cameraAdd (item) {//添加摄像头
let myItemArr=[] let myItemArr = []
if(item.children){ if (item.children) {
for (let q = 0; q < item.children.length; q++) { for (let q = 0; q < item.children.length; q++) {
myItemArr.push(item.children[q].cameraId) myItemArr.push(item.children[q].cameraId)
} }
@ -395,9 +396,9 @@ const MirroringDetail = (props) => {
if (treeData[j].children[k].children[l].children[p].cameraId) { if (treeData[j].children[k].children[l].children[p].cameraId) {
for (let i = 0; i < myplainOptions.length; i++) { for (let i = 0; i < myplainOptions.length; i++) {
if (myplainOptions[i].value == treeData[j].children[k].children[l].children[p].cameraId) { if (myplainOptions[i].value == treeData[j].children[k].children[l].children[p].cameraId) {
if(myItemArr.indexOf(myplainOptions[i].value)==-1){ if (myItemArr.indexOf(myplainOptions[i].value) == -1) {
myplainOptions.splice(i, 1) myplainOptions.splice(i, 1)
} }
} }
} }
} }
@ -406,7 +407,7 @@ const MirroringDetail = (props) => {
else if (treeData[j].children[k].children[l].cameraId) {//有没有摄像头 else if (treeData[j].children[k].children[l].cameraId) {//有没有摄像头
for (let i = 0; i < myplainOptions.length; i++) { for (let i = 0; i < myplainOptions.length; i++) {
if (myplainOptions[i].value == treeData[j].children[k].children[l].cameraId) { if (myplainOptions[i].value == treeData[j].children[k].children[l].cameraId) {
if(myItemArr.indexOf(myplainOptions[i].value)==-1){ if (myItemArr.indexOf(myplainOptions[i].value) == -1) {
myplainOptions.splice(i, 1) myplainOptions.splice(i, 1)
} }
} }
@ -417,7 +418,7 @@ const MirroringDetail = (props) => {
else if (treeData[j].children[k].cameraId) {//有没有摄像头 else if (treeData[j].children[k].cameraId) {//有没有摄像头
for (let i = 0; i < myplainOptions.length; i++) { for (let i = 0; i < myplainOptions.length; i++) {
if (myplainOptions[i].value == treeData[j].children[k].cameraId) { if (myplainOptions[i].value == treeData[j].children[k].cameraId) {
if(myItemArr.indexOf(myplainOptions[i].value)==-1){ if (myItemArr.indexOf(myplainOptions[i].value) == -1) {
myplainOptions.splice(i, 1) myplainOptions.splice(i, 1)
} }
} }
@ -583,7 +584,7 @@ const MirroringDetail = (props) => {
let mainData = JSON.parse(JSON.stringify(treeData)) let mainData = JSON.parse(JSON.stringify(treeData))
let nodeKeyArr = addCameraKey.split('-') let nodeKeyArr = addCameraKey.split('-')
if (nodeKeyArr.length == 1) { if (nodeKeyArr.length == 1) {
mainData[nodeKeyArr[0]].children=[] mainData[nodeKeyArr[0]].children = []
for (let q = 0; q < plainOptions.length; q++) { for (let q = 0; q < plainOptions.length; q++) {
for (let w = 0; w < checkedList.length; w++) { for (let w = 0; w < checkedList.length; w++) {
if (plainOptions[q].value == checkedList[w]) { if (plainOptions[q].value == checkedList[w]) {
@ -631,7 +632,7 @@ const MirroringDetail = (props) => {
} }
} }
} else if (nodeKeyArr.length == 2) { } else if (nodeKeyArr.length == 2) {
mainData[nodeKeyArr[0]].children[nodeKeyArr[1]].children=[] mainData[nodeKeyArr[0]].children[nodeKeyArr[1]].children = []
for (let q = 0; q < plainOptions.length; q++) { for (let q = 0; q < plainOptions.length; q++) {
for (let w = 0; w < checkedList.length; w++) { for (let w = 0; w < checkedList.length; w++) {
if (plainOptions[q].value == checkedList[w]) { if (plainOptions[q].value == checkedList[w]) {
@ -683,7 +684,7 @@ const MirroringDetail = (props) => {
} }
} }
} else if (nodeKeyArr.length == 3) { } else if (nodeKeyArr.length == 3) {
mainData[nodeKeyArr[0]].children[nodeKeyArr[1]].children[nodeKeyArr[2]].children=[] mainData[nodeKeyArr[0]].children[nodeKeyArr[1]].children[nodeKeyArr[2]].children = []
for (let q = 0; q < plainOptions.length; q++) { for (let q = 0; q < plainOptions.length; q++) {
for (let w = 0; w < checkedList.length; w++) { for (let w = 0; w < checkedList.length; w++) {
if (plainOptions[q].value == checkedList[w]) { if (plainOptions[q].value == checkedList[w]) {
@ -749,6 +750,61 @@ const MirroringDetail = (props) => {
setAddScreen(true) setAddScreen(true)
} }
function addLabelGroup (index) {//标签组弹框 function addLabelGroup (index) {//标签组弹框
let myAllCameraList=[]
for (let j = 0; j < treeData.length; j++) {//第一级
if (treeData[j].children) {//有没有子集
for (let k = 0; k < treeData[j].children.length; k++) {//第二级
if (treeData[j].children[k].children) {//有没有子集
for (let l = 0; l < treeData[j].children[k].children.length; l++) {//第三级
if (treeData[j].children[k].children[l].children) {//有没有子集
for (let p = 0; p < treeData[j].children[k].children[l].children.length; p++) {//第四级
if (treeData[j].children[k].children[l].children[p].cameraId) {
for (let i = 0; i < allCameraList.length; i++) {
if (allCameraList[i].id == treeData[j].children[k].children[l].children[p].cameraId) {
myAllCameraList.push(allCameraList[i])
}
}
}
}
}
else if (treeData[j].children[k].children[l].cameraId) {//有没有摄像头
for (let i = 0; i < allCameraList.length; i++) {
if (allCameraList[i].value == treeData[j].children[k].children[l].cameraId) {
myAllCameraList.push(allCameraList[i])
}
}
}
}
}
else if (treeData[j].children[k].cameraId) {//有没有摄像头
for (let i = 0; i < allCameraList.length; i++) {
if (allCameraList[i].value == treeData[j].children[k].cameraId) {
myAllCameraList.push(allCameraList[i])
}
}
}
}
}
}
let myFilterGroupList=JSON.parse(JSON.stringify(filterGroup))
for (let i = 0; i < myFilterGroupList.length; i++) {
if(myFilterGroupList[i].filters){
for (let j = 0; j < myFilterGroupList[i].filters.length; j++) {
let idArr=JSON.parse(JSON.stringify(myFilterGroupList[i].filters[j].cameraIds))
let newArr=[]
for (let k = 0; k < idArr.length; k++) {
for (let l = 0; l < myAllCameraList.length; l++) {
if(idArr[k]==myAllCameraList[l].id){
newArr.push(idArr[k])
}
}
}
myFilterGroupList[i].filters[j].cameraIds=newArr
}
}
}
setFilterGroup(myFilterGroupList)
setLabelCameraList(myAllCameraList)
setAddLabelNum(index) setAddLabelNum(index)
setAddLabel(true) setAddLabel(true)
} }
@ -1022,7 +1078,7 @@ const MirroringDetail = (props) => {
<div style={{ display: chooseNum == "1" ? "block" : "none", fontSize: 12 }} className="hasHeader"> <div style={{ display: chooseNum == "1" ? "block" : "none", fontSize: 12 }} className="hasHeader">
<div style={{ height: 41, display: 'flex', alignItems: 'center', justifyContent: 'space-between', borderBottom: '1px solid rgba(226,226,226,0.2)' }}> <div style={{ height: 41, display: 'flex', alignItems: 'center', justifyContent: 'space-between', borderBottom: '1px solid rgba(226,226,226,0.2)' }}>
<div style={{ marginLeft: 20 }}>header</div> <div style={{ marginLeft: 20 }}>header</div>
<div style={{ marginRight: 13 }}><Switch checked={showHeader} onChange={(v, e) => setShowHeader(v)} size="small" aria-label="是否有头部"></Switch></div> <div style={{ marginRight: 13 }}><Switch checked={showHeader} onChange={(v, e) => {setShowHeader(v);sethasModify(true)}} size="small" aria-label="是否有头部"></Switch></div>
</div> </div>
<div style={{ height: 41, display: 'flex', alignItems: 'center', justifyContent: 'space-between', borderBottom: '1px solid rgba(226,226,226,0.2)', cursor: 'pointer' }} onClick={() => { setComingVisible(true) }}> <div style={{ height: 41, display: 'flex', alignItems: 'center', justifyContent: 'space-between', borderBottom: '1px solid rgba(226,226,226,0.2)', cursor: 'pointer' }} onClick={() => { setComingVisible(true) }}>
<div style={{ marginLeft: 20 }}>自定义样式</div> <div style={{ marginLeft: 20 }}>自定义样式</div>
@ -1099,13 +1155,20 @@ const MirroringDetail = (props) => {
style={{ width: '100%' }} style={{ width: '100%' }}
/> />
</div> </div>
<div style={{ width: 12, height: 12, cursor: 'pointer', marginLeft: 4, display: 'flex' }} onClick={() => { screenDel(index) }}> <Popconfirm
<img title="是否确认删除该选项组？"
src="/assets/images/imageImg/nodeDel.png" arrowPointAtCenter={false}
alt="设置" showArrow={true}
style={{ width: '100%' }} position="topRight"
/> onConfirm={() => screenDel(index)}>
</div> <div style={{ width: 12, height: 12, cursor: 'pointer', marginLeft: 4, display: 'flex' }}>
<img
src="/assets/images/imageImg/nodeDel.png"
alt="设置"
style={{ width: '100%' }}
/>
</div>
</Popconfirm>
<div style={{ width: 12, height: 12, cursor: 'pointer', marginLeft: 4, display: 'flex' }} onClick={() => { addLabelGroup(index) }}> <div style={{ width: 12, height: 12, cursor: 'pointer', marginLeft: 4, display: 'flex' }} onClick={() => { addLabelGroup(index) }}>
<img <img
src="/assets/images/imageImg/install.png" src="/assets/images/imageImg/install.png"
@ -1178,7 +1241,7 @@ const MirroringDetail = (props) => {
<div style={{ padding: '0px 20px 10px 10px' }}> <div style={{ padding: '0px 20px 10px 10px' }}>
<Select multiple value={item.cameraIds} style={{ width: '234px' }} onChange={(val) => { addFiltersCamera(val, index) }} maxTagCount={2} size='large'> <Select multiple value={item.cameraIds} style={{ width: '234px' }} onChange={(val) => { addFiltersCamera(val, index) }} maxTagCount={2} size='large'>
{ {
allCameraList.map((itm, idx) => { labelCameraList.map((itm, idx) => {
return ( return (
<Select.Option value={itm.id} key={idx}>{itm.label}</Select.Option> <Select.Option value={itm.id} key={idx}>{itm.label}</Select.Option>
) )
@ -1209,7 +1272,6 @@ const MirroringDetail = (props) => {
width={610} width={610}
onCancel={() => { onCancel={() => {
setComingVisible(false) setComingVisible(false)
history.goBack()
}} }}
okText="确定" okText="确定"
cancelText="取消" cancelText="取消"

Write Preview
Loading…
Cancel
Save