|
|
@ -43,6 +43,7 @@ const Control = (props) => { |
|
|
|
const [toolShow, setToolShow] = useState([]); //工具展示 |
|
|
|
const [tableSetup, setTableSetup] = useState([]); //单一表格设置信息 |
|
|
|
const [exhibition, setExhibition] = useState({ workbench: [] }); //页面结构 |
|
|
|
const [workData, setWorkData] = useState({}); //我的工作台数据 |
|
|
|
|
|
|
|
|
|
|
|
const FormApi = useRef() |
|
|
@ -50,7 +51,6 @@ const Control = (props) => { |
|
|
|
useEffect(() => { |
|
|
|
consoleToollink() |
|
|
|
|
|
|
|
|
|
|
|
//初始化表格显示设置 |
|
|
|
let data = ['workbench'] |
|
|
|
data.map(v => { |
|
|
@ -63,55 +63,62 @@ const Control = (props) => { |
|
|
|
}, []) |
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
// newScrollbar = new PerfectScrollbar("#news", { |
|
|
|
// suppressScrollX: true, |
|
|
|
// }); |
|
|
|
// const domProject = document.getElementById("news"); |
|
|
|
// if (domProject && newScrollbar) { |
|
|
|
// newScrollbar.update(); |
|
|
|
// } |
|
|
|
// overviewScrollbar = new PerfectScrollbar("#overview", { |
|
|
|
// suppressScrollY: true, |
|
|
|
// }); |
|
|
|
// const domProject1 = document.getElementById("overview"); |
|
|
|
// if (domProject1 && overviewScrollbar) { |
|
|
|
// overviewScrollbar.update(); |
|
|
|
// } |
|
|
|
// memberScrollbar = new PerfectScrollbar("#member", { |
|
|
|
// suppressScrollX: true, |
|
|
|
// }); |
|
|
|
// const domProject2 = document.getElementById("member"); |
|
|
|
// if (domProject2 && memberScrollbar) { |
|
|
|
// memberScrollbar.update(); |
|
|
|
// } |
|
|
|
// equipmentScrollbar = new PerfectScrollbar("#equipment", { |
|
|
|
// suppressScrollX: true, |
|
|
|
// }); |
|
|
|
// const domProject3 = document.getElementById("equipment"); |
|
|
|
// if (domProject3 && equipmentScrollbar) { |
|
|
|
// equipmentScrollbar.update(); |
|
|
|
// } |
|
|
|
// webScrollbar = new PerfectScrollbar("#web", { |
|
|
|
// suppressScrollX: true, |
|
|
|
// }); |
|
|
|
// const domProject4 = document.getElementById("web"); |
|
|
|
// if (domProject4 && webScrollbar) { |
|
|
|
// webScrollbar.update(); |
|
|
|
// } |
|
|
|
// problemsScrollbar = new PerfectScrollbar("#problems", { |
|
|
|
// suppressScrollX: true, |
|
|
|
// }); |
|
|
|
// const domProject5 = document.getElementById("problems"); |
|
|
|
// if (domProject5 && problemsScrollbar) { |
|
|
|
// problemsScrollbar.update(); |
|
|
|
// } |
|
|
|
// alarmScrollbar = new PerfectScrollbar("#alarm", { |
|
|
|
// suppressScrollY: true, |
|
|
|
// }); |
|
|
|
// const domProject6 = document.getElementById("alarm"); |
|
|
|
// if (domProject6 && alarmScrollbar) { |
|
|
|
// alarmScrollbar.update(); |
|
|
|
// } |
|
|
|
dispatch(control.geteteConsoleCount({})).then(res => { |
|
|
|
console.log(res); |
|
|
|
if (res.success) setWorkData(res.payload.data) |
|
|
|
}) |
|
|
|
}, []) |
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
newScrollbar = new PerfectScrollbar("#news", { |
|
|
|
suppressScrollX: true, |
|
|
|
}); |
|
|
|
const domProject = document.getElementById("news"); |
|
|
|
if (domProject && newScrollbar) { |
|
|
|
newScrollbar.update(); |
|
|
|
} |
|
|
|
overviewScrollbar = new PerfectScrollbar("#overview", { |
|
|
|
suppressScrollY: true, |
|
|
|
}); |
|
|
|
const domProject1 = document.getElementById("overview"); |
|
|
|
if (domProject1 && overviewScrollbar) { |
|
|
|
overviewScrollbar.update(); |
|
|
|
} |
|
|
|
memberScrollbar = new PerfectScrollbar("#member", { |
|
|
|
suppressScrollX: true, |
|
|
|
}); |
|
|
|
const domProject2 = document.getElementById("member"); |
|
|
|
if (domProject2 && memberScrollbar) { |
|
|
|
memberScrollbar.update(); |
|
|
|
} |
|
|
|
equipmentScrollbar = new PerfectScrollbar("#equipment", { |
|
|
|
suppressScrollX: true, |
|
|
|
}); |
|
|
|
const domProject3 = document.getElementById("equipment"); |
|
|
|
if (domProject3 && equipmentScrollbar) { |
|
|
|
equipmentScrollbar.update(); |
|
|
|
} |
|
|
|
webScrollbar = new PerfectScrollbar("#web", { |
|
|
|
suppressScrollX: true, |
|
|
|
}); |
|
|
|
const domProject4 = document.getElementById("web"); |
|
|
|
if (domProject4 && webScrollbar) { |
|
|
|
webScrollbar.update(); |
|
|
|
} |
|
|
|
problemsScrollbar = new PerfectScrollbar("#problems", { |
|
|
|
suppressScrollX: true, |
|
|
|
}); |
|
|
|
const domProject5 = document.getElementById("problems"); |
|
|
|
if (domProject5 && problemsScrollbar) { |
|
|
|
problemsScrollbar.update(); |
|
|
|
} |
|
|
|
alarmScrollbar = new PerfectScrollbar("#alarm", { |
|
|
|
suppressScrollY: true, |
|
|
|
}); |
|
|
|
const domProject6 = document.getElementById("alarm"); |
|
|
|
if (domProject6 && alarmScrollbar) { |
|
|
|
alarmScrollbar.update(); |
|
|
|
} |
|
|
|
|
|
|
|
// ACTION 示例 |
|
|
|
// dispatch(actions.example.getMembers(user.orgId)) |
|
|
@ -139,9 +146,9 @@ const Control = (props) => { |
|
|
|
|
|
|
|
let listAll = [ |
|
|
|
{ name: '关注的项目', sort: 1, key: 'project', data: 1, img: 'url(/assets/images/console/lan_1.png)' }, |
|
|
|
{ name: '数据告警', sort: 2, key: 'data', data: 2, img: 'url(/assets/images/console/lv_1.png)' }, |
|
|
|
{ name: '应用告警', sort: 2, key: 'app', data: 3, img: 'url(/assets/images/console/hong_1.png)' }, |
|
|
|
{ name: '设备告警', sort: 2, key: 'device', data: 225, img: 'url(/assets/images/console/hong_1.png)' }, |
|
|
|
{ name: '数据告警', sort: 2, key: 'data', data: workData?.dataAlarm?.alarm || 0, img: 'url(/assets/images/console/lv_1.png)' }, |
|
|
|
{ name: '应用告警', sort: 2, key: 'app', data: workData?.appAlarm?.alarm || 0, img: 'url(/assets/images/console/hong_1.png)' }, |
|
|
|
{ name: '设备告警', sort: 2, key: 'device', data: workData?.dataAlarm?.alarm || 0, img: 'url(/assets/images/console/hong_1.png)' }, |
|
|
|
] |
|
|
|
|
|
|
|
|
|
|
@ -152,10 +159,8 @@ const Control = (props) => { |
|
|
|
: []; |
|
|
|
let data = Select[title].map(v => { |
|
|
|
let dataTitle = listAll.find(vv => v == vv.key) || {} |
|
|
|
console.log(dataTitle); |
|
|
|
return { name: dataTitle.name, value: dataTitle.key } |
|
|
|
}) |
|
|
|
console.log(data); |
|
|
|
let TableDisplay = take?.map(v => listAll?.find(vv => v == vv.key)) |
|
|
|
TableDisplay.sort((a, b) => a.sort - b.sort) |
|
|
|
setExhibition({ ...exhibition, [title]: TableDisplay }) |
|
|
@ -165,7 +170,7 @@ const Control = (props) => { |
|
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
11 ? <img src="/assets/images/install/watting.png" alt="" style={{ width: 'calc(100% + 16px)', position: "relative", top: -12, left: -8, }} /> : |
|
|
|
// 11 ? <img src="/assets/images/install/watting.png" alt="" style={{ width: 'calc(100% + 16px)', position: "relative", top: -12, left: -8, }} /> : |
|
|
|
<> |
|
|
|
<div style={{ padding: '0px 40px', width: '100%' }} className='console'> |
|
|
|
{/* 头部 */} |
|
|
@ -209,7 +214,7 @@ const Control = (props) => { |
|
|
|
剩余问题: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 16, color: '#4A4A4A', width: 91 }}> |
|
|
|
122 |
|
|
|
{(workData?.appAlarm?.appSurplus + workData?.dataAlarm?.alarmSurplus + workData?.videoAlarm?.videoSurplus) || 0} |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', marginTop: 26 }}> |
|
|
@ -218,7 +223,7 @@ const Control = (props) => { |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 16, color: '#4A4A4A', width: 91, display: 'flex' }}> |
|
|
|
<div> |
|
|
|
12223 |
|
|
|
{(workData?.appAlarm?.appNewAdd + workData?.dataAlarm?.alarmNewAdd + workData?.videoAlarm?.videoNewAdd) || 0} |
|
|
|
</div> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', marginLeft: 4 }}> |
|
|
|
<img title='设置' src="/assets/images/console/icon_up.png" style={{ width: 18, height: 18 }} /> |
|
|
@ -230,7 +235,7 @@ const Control = (props) => { |
|
|
|
今日处理: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 16, color: '#4A4A4A', width: 91 }}> |
|
|
|
3 |
|
|
|
{(workData?.appAlarm?.appConfirme + workData?.dataAlarm?.alarmConfirme + workData?.videoAlarm?.videoConfirme) || 0} |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|