|
|
@ -17,12 +17,77 @@ const MirroringDetail = (props) => { |
|
|
} |
|
|
} |
|
|
else { |
|
|
else { |
|
|
setTemplate(searcharr[0].split('=')[1])//主题颜色 |
|
|
setTemplate(searcharr[0].split('=')[1])//主题颜色 |
|
|
setMirrorId(searcharr[2].split('=')[1])//id |
|
|
dispatch(openness.getMirrorDetail(searcharr[1].split('=')[1])).then((res) => { |
|
|
|
|
|
let filterGrouplist = res.payload.data.filterGroup |
|
|
|
|
|
for (let i = 0; i < filterGrouplist.length; i++) { |
|
|
|
|
|
filterGrouplist[i].num = i |
|
|
|
|
|
if (filterGrouplist[i].filters.length > 0) { |
|
|
|
|
|
for (let j = 0; j < filterGrouplist[i].filters.length; j++) { |
|
|
|
|
|
filterGrouplist[i].filters[j].num = j |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
setFilterGroup(filterGrouplist); |
|
|
|
|
|
setMirrorId(res.payload.data.id);//id |
|
|
|
|
|
setShowHeader(res.payload.data.showHeader); |
|
|
|
|
|
setHeaderName(res.payload.data.title); |
|
|
|
|
|
let mytreeData = res.payload.data.tree |
|
|
|
|
|
for (let i = 0; i < mytreeData.length; i++) {//第一层 |
|
|
|
|
|
mytreeData[i].value = mytreeData[i].key |
|
|
|
|
|
for (let j = 0; j < mytreeData[i].children.length; j++) {//第二层 |
|
|
|
|
|
mytreeData[i].children[j].value = mytreeData[i].children[j].key |
|
|
|
|
|
if (mytreeData[i].children[j].camera) { |
|
|
|
|
|
if (mytreeData[i].children[j].camera.type == 'yingshi') { |
|
|
|
|
|
mytreeData[i].children[j].camera.content = mytreeData[i].children[j].camera.cameraRemarks.map(v => v.remark), |
|
|
|
|
|
mytreeData[i].children[j].camera.yingshiToken = mytreeData[i].children[j].camera.secretYingshi.token |
|
|
|
|
|
} |
|
|
|
|
|
else { |
|
|
|
|
|
mytreeData[i].children[j].camera.content = mytreeData[i].children[j].camera.cameraRemarks.map(v => v.remark), |
|
|
|
|
|
mytreeData[i].children[j].camera.yingshiToken = null |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
else { |
|
|
|
|
|
for (let k = 0; k < mytreeData[i].children[j].children.length; k++) {//第三层 |
|
|
|
|
|
mytreeData[i].children[j].children[k].value = mytreeData[i].children[j].children[k].key |
|
|
|
|
|
if (mytreeData[i].children[j].children[k].camera) { |
|
|
|
|
|
if (mytreeData[i].children[j].children[k].camera.type == 'yingshi') { |
|
|
|
|
|
mytreeData[i].children[j].children[k].camera.content = mytreeData[i].children[j].children[k].camera.cameraRemarks.map(v => v.remark), |
|
|
|
|
|
mytreeData[i].children[j].children[k].camera.yingshiToken = mytreeData[i].children[j].children[k].camera.secretYingshi.token |
|
|
|
|
|
} |
|
|
|
|
|
else { |
|
|
|
|
|
mytreeData[i].children[j].children[k].camera.content = mytreeData[i].children[j].children[k].camera.cameraRemarks.map(v => v.remark), |
|
|
|
|
|
mytreeData[i].children[j].children[k].camera.yingshiToken = null |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
else { |
|
|
|
|
|
for (let l = 0; l < mytreeData[i].children[j].children[k].children.length; l++) { |
|
|
|
|
|
mytreeData[i].children[j].children[k].children[l].value = mytreeData[i].children[j].children[k].children[l].key |
|
|
|
|
|
if (mytreeData[i].children[j].children[k].children[l].camera) { |
|
|
|
|
|
if (mytreeData[i].children[j].children[k].children[l].camera.type == 'yingshi') { |
|
|
|
|
|
mytreeData[i].children[j].children[k].children[l].camera.content = mytreeData[i].children[j].children[k].children[l].camera.cameraRemarks.map(v => v.remark), |
|
|
|
|
|
mytreeData[i].children[j].children[k].children[l].camera.yingshiToken = mytreeData[i].children[j].children[k].children[l].camera.secretYingshi.token |
|
|
|
|
|
} |
|
|
|
|
|
else { |
|
|
|
|
|
mytreeData[i].children[j].children[k].children[l].camera.content = mytreeData[i].children[j].children[k].children[l].camera.cameraRemarks.map(v => v.remark), |
|
|
|
|
|
mytreeData[i].children[j].children[k].children[l].camera.yingshiToken = null |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
setTreeData(mytreeData); |
|
|
|
|
|
}) |
|
|
} |
|
|
} |
|
|
equipmentGetCamera(); |
|
|
equipmentGetCamera(); |
|
|
}, []); |
|
|
}, []); |
|
|
|
|
|
const [hasModify, sethasModify] = useState(false)//有没有进行修改 |
|
|
const [showHeader, setShowHeader] = useState(false)//是否展示头部 |
|
|
const [showHeader, setShowHeader] = useState(false)//是否展示头部 |
|
|
const [mirrorId, setMirrorId] = useState(null)//id |
|
|
const [mirrorId, setMirrorId] = useState(null)//id |
|
|
|
|
|
const [backVisible, setBackVisible] = useState(false)//返回上一页是否修改过 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const [template, setTemplate] = useState('')//主题颜色 |
|
|
const [template, setTemplate] = useState('')//主题颜色 |
|
|
const [chooseNum, setChooseNum] = useState(0);//当前选择tab |
|
|
const [chooseNum, setChooseNum] = useState(0);//当前选择tab |
|
|
@ -128,7 +193,7 @@ const MirroringDetail = (props) => { |
|
|
filterGroup: filterGroup |
|
|
filterGroup: filterGroup |
|
|
} |
|
|
} |
|
|
dispatch(openness.putMirror(mirrordata)).then((res) => { |
|
|
dispatch(openness.putMirror(mirrordata)).then((res) => { |
|
|
console.log('res',res); |
|
|
history.goBack() |
|
|
}) |
|
|
}) |
|
|
} |
|
|
} |
|
|
function nodeDelete (item) {//删除树状子节点 |
|
|
function nodeDelete (item) {//删除树状子节点 |
|
|
@ -183,6 +248,7 @@ const MirroringDetail = (props) => { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
sethasModify(true) |
|
|
setAddCamera(false) |
|
|
setAddCamera(false) |
|
|
setTreeData(mainData) |
|
|
setTreeData(mainData) |
|
|
} |
|
|
} |
|
|
@ -240,6 +306,7 @@ const MirroringDetail = (props) => { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
sethasModify(true) |
|
|
setTreeData(mainData) |
|
|
setTreeData(mainData) |
|
|
} |
|
|
} |
|
|
function changeLable (value, item) {//编辑摄像头名称 |
|
|
function changeLable (value, item) {//编辑摄像头名称 |
|
|
@ -270,6 +337,7 @@ const MirroringDetail = (props) => { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
sethasModify(true) |
|
|
setTreeData(mainData) |
|
|
setTreeData(mainData) |
|
|
} |
|
|
} |
|
|
function lableBlur () { |
|
|
function lableBlur () { |
|
|
@ -277,7 +345,6 @@ const MirroringDetail = (props) => { |
|
|
} |
|
|
} |
|
|
function cameraAdd (item) {//添加摄像头 |
|
|
function cameraAdd (item) {//添加摄像头 |
|
|
let myplainOptions = JSON.parse(JSON.stringify(plainOptions)) |
|
|
let myplainOptions = JSON.parse(JSON.stringify(plainOptions)) |
|
|
for (let i = 0; i < myplainOptions.length; i++) {//摄像头列表 |
|
|
|
|
|
for (let j = 0; j < treeData.length; j++) {//第一级 |
|
|
for (let j = 0; j < treeData.length; j++) {//第一级 |
|
|
if (treeData[j].children) {//有没有子集 |
|
|
if (treeData[j].children) {//有没有子集 |
|
|
for (let k = 0; k < treeData[j].children.length; k++) {//第二级 |
|
|
for (let k = 0; k < treeData[j].children.length; k++) {//第二级 |
|
|
@ -286,20 +353,25 @@ const MirroringDetail = (props) => { |
|
|
if (treeData[j].children[k].children[l].children) {//有没有子集 |
|
|
if (treeData[j].children[k].children[l].children) {//有没有子集 |
|
|
for (let p = 0; p < treeData[j].children[k].children[l].children.length; p++) { |
|
|
for (let p = 0; p < treeData[j].children[k].children[l].children.length; p++) { |
|
|
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++) { |
|
|
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) { |
|
|
myplainOptions.splice(i, 1) |
|
|
myplainOptions.splice(i, 1) |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
} |
|
|
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++) { |
|
|
if (myplainOptions[i].value == treeData[j].children[k].children[l].cameraId) { |
|
|
if (myplainOptions[i].value == treeData[j].children[k].children[l].cameraId) { |
|
|
myplainOptions.splice(i, 1) |
|
|
myplainOptions.splice(i, 1) |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
} |
|
|
else if (treeData[j].children[k].cameraId) {//有没有摄像头 |
|
|
else if (treeData[j].children[k].cameraId) {//有没有摄像头 |
|
|
|
|
|
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) { |
|
|
myplainOptions.splice(i, 1) |
|
|
myplainOptions.splice(i, 1) |
|
|
} |
|
|
} |
|
|
@ -411,8 +483,13 @@ const MirroringDetail = (props) => { |
|
|
) |
|
|
) |
|
|
}; |
|
|
}; |
|
|
function toback () {//返回上一个页面 |
|
|
function toback () {//返回上一个页面 |
|
|
|
|
|
if (hasModify) { |
|
|
|
|
|
setBackVisible(true) |
|
|
|
|
|
} |
|
|
|
|
|
else { |
|
|
history.goBack() |
|
|
history.goBack() |
|
|
} |
|
|
} |
|
|
|
|
|
} |
|
|
function tochange (index) {//节点样式功能切换 |
|
|
function tochange (index) {//节点样式功能切换 |
|
|
setChooseNum(index); |
|
|
setChooseNum(index); |
|
|
setAddCamera(false); |
|
|
setAddCamera(false); |
|
|
@ -438,6 +515,7 @@ const MirroringDetail = (props) => { |
|
|
key: '0', |
|
|
key: '0', |
|
|
}) |
|
|
}) |
|
|
} |
|
|
} |
|
|
|
|
|
sethasModify(true) |
|
|
setTreeData(mainData) |
|
|
setTreeData(mainData) |
|
|
} |
|
|
} |
|
|
function searchCamera () {//查询摄像头 |
|
|
function searchCamera () {//查询摄像头 |
|
|
@ -611,7 +689,7 @@ const MirroringDetail = (props) => { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
console.log('mainDatamainDatamainData',mainData); |
|
|
sethasModify(true) |
|
|
setTreeData(mainData); |
|
|
setTreeData(mainData); |
|
|
setAddCamera(false); |
|
|
setAddCamera(false); |
|
|
setMykeyword('') |
|
|
setMykeyword('') |
|
|
@ -642,22 +720,26 @@ const MirroringDetail = (props) => { |
|
|
filters: [] |
|
|
filters: [] |
|
|
}) |
|
|
}) |
|
|
} |
|
|
} |
|
|
|
|
|
sethasModify(true) |
|
|
setFilterGroup(filterGroupList) |
|
|
setFilterGroup(filterGroupList) |
|
|
} |
|
|
} |
|
|
function switchOnChange (val, index) {//筛选项是否禁用 |
|
|
function switchOnChange (val, index) {//筛选项是否禁用 |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
filterGroupList[index].forbidden = val |
|
|
filterGroupList[index].forbidden = val |
|
|
setFilterGroup(filterGroupList) |
|
|
setFilterGroup(filterGroupList) |
|
|
|
|
|
sethasModify(true) |
|
|
} |
|
|
} |
|
|
function screenDel (index) {//筛选项删除 |
|
|
function screenDel (index) {//筛选项删除 |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
filterGroupList.splice(index, 1) |
|
|
filterGroupList.splice(index, 1) |
|
|
setFilterGroup(filterGroupList) |
|
|
setFilterGroup(filterGroupList) |
|
|
|
|
|
sethasModify(true) |
|
|
} |
|
|
} |
|
|
function toEditscreen (val, index) {//编辑筛选项名称 |
|
|
function toEditscreen (val, index) {//编辑筛选项名称 |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
filterGroupList[index].name = val |
|
|
filterGroupList[index].name = val |
|
|
setFilterGroup(filterGroupList) |
|
|
setFilterGroup(filterGroupList) |
|
|
|
|
|
sethasModify(true) |
|
|
} |
|
|
} |
|
|
function toAddLabel () {//添加标签组 |
|
|
function toAddLabel () {//添加标签组 |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
@ -675,22 +757,26 @@ const MirroringDetail = (props) => { |
|
|
cameraIds: [] |
|
|
cameraIds: [] |
|
|
}) |
|
|
}) |
|
|
} |
|
|
} |
|
|
|
|
|
sethasModify(true) |
|
|
setFilterGroup(filterGroupList) |
|
|
setFilterGroup(filterGroupList) |
|
|
} |
|
|
} |
|
|
function labelDel (index) {//标签组删除 |
|
|
function labelDel (index) {//标签组删除 |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
filterGroupList[addLabelNum].filters.splice(index, 1) |
|
|
filterGroupList[addLabelNum].filters.splice(index, 1) |
|
|
setFilterGroup(filterGroupList) |
|
|
setFilterGroup(filterGroupList) |
|
|
|
|
|
sethasModify(true) |
|
|
} |
|
|
} |
|
|
function addFiltersCamera (val, index) { |
|
|
function addFiltersCamera (val, index) {//标签组添加摄像头 |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
filterGroupList[addLabelNum].filters[index].cameraIds = val |
|
|
filterGroupList[addLabelNum].filters[index].cameraIds = val |
|
|
setFilterGroup(filterGroupList) |
|
|
setFilterGroup(filterGroupList) |
|
|
|
|
|
sethasModify(true) |
|
|
} |
|
|
} |
|
|
function toEditLabel (val, index) { |
|
|
function toEditLabel (val, index) {//标签组名称修改 |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
let filterGroupList = JSON.parse(JSON.stringify(filterGroup)) |
|
|
filterGroupList[addLabelNum].filters[index].name = val |
|
|
filterGroupList[addLabelNum].filters[index].name = val |
|
|
setFilterGroup(filterGroupList) |
|
|
setFilterGroup(filterGroupList) |
|
|
|
|
|
sethasModify(true) |
|
|
} |
|
|
} |
|
|
return ( |
|
|
return ( |
|
|
<div style={{ background: 'rgb(246, 250, 255)', height: '100%', width: '100%' }}> |
|
|
<div style={{ background: 'rgb(246, 250, 255)', height: '100%', width: '100%' }}> |
|
|
@ -732,7 +818,7 @@ const MirroringDetail = (props) => { |
|
|
style={{ width: '100%' }} |
|
|
style={{ width: '100%' }} |
|
|
/> |
|
|
/> |
|
|
</div> |
|
|
</div> |
|
|
<div style={{ width: 22, height: 22, marginRight: 30, cursor: 'pointer' }} onClick={()=>{topublish(false)}}> |
|
|
<div style={{ width: 22, height: 22, marginRight: 30, cursor: hasModify ? 'pointer' : 'not-allowed' }} onClick={() => { hasModify ? topublish(false) : '' }}> |
|
|
<img |
|
|
<img |
|
|
src="/assets/images/imageImg/save.png" |
|
|
src="/assets/images/imageImg/save.png" |
|
|
alt="设置" |
|
|
alt="设置" |
|
|
@ -848,7 +934,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 onChange={(v, e) => setShowHeader(v)} size="small" aria-label="是否有头部"></Switch></div> |
|
|
<div style={{ marginRight: 13 }}><Switch checked={showHeader} onChange={(v, e) => setShowHeader(v)} 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> |
|
|
@ -1042,6 +1128,23 @@ const MirroringDetail = (props) => { |
|
|
> |
|
|
> |
|
|
开发中，敬请期待~ |
|
|
开发中，敬请期待~ |
|
|
</Modal> |
|
|
</Modal> |
|
|
|
|
|
<Modal |
|
|
|
|
|
title="提醒" |
|
|
|
|
|
visible={backVisible} |
|
|
|
|
|
onOk={() => { |
|
|
|
|
|
topublish(false) |
|
|
|
|
|
setBackVisible(false) |
|
|
|
|
|
}} |
|
|
|
|
|
width={610} |
|
|
|
|
|
onCancel={() => { |
|
|
|
|
|
setBackVisible(false) |
|
|
|
|
|
}} |
|
|
|
|
|
okText="确定" |
|
|
|
|
|
cancelText="取消" |
|
|
|
|
|
closeOnEsc={true} |
|
|
|
|
|
> |
|
|
|
|
|
是否保存修改？~ |
|
|
|
|
|
</Modal> |
|
|
</div> |
|
|
</div> |
|
|
) |
|
|
) |
|
|
} |
|
|
} |
|
|
|
