wuqun 2 years ago
parent
commit
a8b6d992a2
  1. 8
      api/app/lib/controllers/control/toolLink.js
  2. 550
      web/client/src/layout/containers/layout/index.jsx
  3. 401
      web/client/src/sections/control/containers/control.jsx

8
api/app/lib/controllers/control/toolLink.js

@ -164,8 +164,6 @@ async function count (ctx) {
alarms.StructureId IN (${anxinStrucIds.join(",")})
AND
StartTime BETWEEN '${moment().startOf('day').format('YYYY-MM-DD HH:mm:ss')}' AND '${moment().endOf('day').format('YYYY-MM-DD HH:mm:ss')}'
AND
State < 3
GROUP BY AlarmGroup
`).toPromise()
//今日新增数据告警
@ -228,7 +226,7 @@ async function count (ctx) {
let dataAfter = new moment(); //验证后时间
let dataduration = moment.duration(dataAfter.diff(dataFront))._data.milliseconds
console.log('数据',dataduration);
console.log('数据', dataduration);
let yingyongFront = new moment(); //验证前时间
@ -250,7 +248,7 @@ async function count (ctx) {
let yingyongAfter = new moment(); //验证后时间
let yingyongduration = moment.duration(yingyongAfter.diff(yingyongFront))._data.milliseconds
console.log('应用',yingyongduration);
console.log('应用', yingyongduration);
let videoFront = new moment(); //验证前时间
@ -364,7 +362,7 @@ async function count (ctx) {
let videoAfter = new moment(); //验证后时间
let videoduration = moment.duration(videoAfter.diff(videoFront))._data.milliseconds
console.log('视频',videoduration);
console.log('视频', videoduration);
let findOptions = {

550
web/client/src/layout/containers/layout/index.jsx

@ -12,7 +12,7 @@ import PerfectScrollbar from 'perfect-scrollbar';
import { useLocation } from "react-router";
NProgress.configure({
template: `
template: `
<div class="bar" style="height:2px" role="bar">
<div class="peg"></div>
</div>
@ -25,302 +25,304 @@ NProgress.configure({
let scrollbar
// const location111 = useLocation();
const LayoutContainer = props => {
const {
dispatch, msg, user, copyright, children, sections, clientWidth, clientHeight,
location, match, routes, history, socket,
} = props
const [collapsed, setCollapsed] = useState(false)
const {
dispatch, msg, user, copyright, children, sections, clientWidth, clientHeight,
location, match, routes, history, socket,
} = props
const [collapsed, setCollapsed] = useState(false)
NProgress.start();
NProgress.start();
const resize_ = () => {
dispatch(resize(
document.getElementById('PomsApp').clientHeight,
document.getElementById('PomsApp').clientWidth - (collapsed ? 120 : 240)
));
}
function deepCopy (data) {//
//string,number,bool,null,undefined,symbol
//object,array,date
if (data && typeof data === "object") {
//
if (typeof data === "function") {
let tempFunc = data.bind(null);
tempFunc.prototype = deepCopy(data.prototype);
return tempFunc;
}
const resize_ = () => {
dispatch(resize(
document.getElementById('PomsApp').clientHeight,
document.getElementById('PomsApp').clientWidth - (collapsed ? 120 : 240)
));
}
function deepCopy (data) {//
//string,number,bool,null,undefined,symbol
//object,array,date
if (data && typeof data === "object") {
//
if (typeof data === "function") {
let tempFunc = data.bind(null);
tempFunc.prototype = deepCopy(data.prototype);
return tempFunc;
}
switch (Object.prototype.toString.call(data)) {
case "[object String]":
return data.toString();
case "[object Number]":
return Number(data.toString());
case "[object Boolean]":
return new Boolean(data.toString());
case "[object Date]":
return new Date(data.getTime());
case "[object Array]":
var arr = [];
for (let i = 0; i < data.length; i++) {
arr[i] = deepCopy(data[i]);
}
return arr;
switch (Object.prototype.toString.call(data)) {
case "[object String]":
return data.toString();
case "[object Number]":
return Number(data.toString());
case "[object Boolean]":
return new Boolean(data.toString());
case "[object Date]":
return new Date(data.getTime());
case "[object Array]":
var arr = [];
for (let i = 0; i < data.length; i++) {
arr[i] = deepCopy(data[i]);
}
return arr;
//js
case "[object Object]":
var obj = {};
for (let key in data) {
//hasOwnProperty obj.hasOwnProperty(prop)
obj[key] = deepCopy(data[key]);
}
return obj;
}
} else {
//string,number,bool,null,undefined,symbol
return data;
}
}
const [allItems, setAllItems] = useState([])
const [headerItems, setHeaderItems] = useState([])
const [leftItems, setLeftItems] = useState([])
const [leftChange, setLeftChange] = useState(true)
const [leftShow, setLeftShow] = useState(false)
useEffect(() => {
let topItems = []//
const lastSelectedKeys = localStorage.getItem('poms_selected_sider')
let nextItems = []//
for (let c of sections) {
if (typeof c.getNavItem == 'function') {
let item = c.getNavItem(user, dispatch);
if (item) {
nextItems.push.apply(nextItems, item)
if (item.length > 0) {
for (let j = 0; j < item.length; j++) {
let itm = deepCopy(item[j]);
if (itm.hasOwnProperty('items')) {
for (let i = 0; i < itm.items.length; i++) {
itm.items[i].fatherKey = itm.itemKey
delete itm.items[i].items
}
topItems.push(itm)
}
else {
topItems.push.apply(topItems, item)
}
//js
case "[object Object]":
var obj = {};
for (let key in data) {
//hasOwnProperty obj.hasOwnProperty(prop)
obj[key] = deepCopy(data[key]);
}
return obj;
}
} else {
//string,number,bool,null,undefined,symbol
return data;
}
}
const [allItems, setAllItems] = useState([])
const [headerItems, setHeaderItems] = useState([])
const [leftItems, setLeftItems] = useState([])
const [leftChange, setLeftChange] = useState(true)
const [leftShow, setLeftShow] = useState(false)
useEffect(() => {
let topItems = []//
const lastSelectedKeys = localStorage.getItem('poms_selected_sider')
let nextItems = []//
for (let c of sections) {
if (typeof c.getNavItem == 'function') {
let item = c.getNavItem(user, dispatch);
if (item) {
nextItems.push.apply(nextItems, item)
if (item.length > 0) {
for (let j = 0; j < item.length; j++) {
let itm = deepCopy(item[j]);
if (itm.hasOwnProperty('items')) {
for (let i = 0; i < itm.items.length; i++) {
itm.items[i].fatherKey = itm.itemKey
delete itm.items[i].items
}
}
}
topItems.push(itm)
}
else {
topItems.push.apply(topItems, item)
}
}
}
}
}
setAllItems(nextItems)
setHeaderItems(topItems)
if (lastSelectedKeys) {//
for (let i = 0; i < nextItems.length; i++) {
if (JSON.parse(lastSelectedKeys)[0] == nextItems[i].itemKey) {
}
}
setAllItems(nextItems)
setHeaderItems(topItems)
if (lastSelectedKeys) {//
for (let i = 0; i < nextItems.length; i++) {
if (JSON.parse(lastSelectedKeys)[0] == nextItems[i].itemKey) {
let openArr = []
for (let j = 0; j < nextItems[i].items.length; j++) {
openArr.push(nextItems[i].items[j].itemKey)
}
localStorage.setItem('poms_open_sider', JSON.stringify(openArr))
setLeftItems(nextItems[i].items)
}
let openArr = []
for (let j = 0; j < nextItems[i].items.length; j++) {
openArr.push(nextItems[i].items[j].itemKey)
}
localStorage.setItem('poms_open_sider', JSON.stringify(openArr))
setLeftItems(nextItems[i].items)
}
setLeftShow(true)
}
else {
setLeftShow(false)
}
}
setLeftShow(true)
}
else {
setLeftShow(false)
}
window.addEventListener('resize', resize_);
return () => {
window.removeEventListener('resize', resize_);
}
}, [])
window.addEventListener('resize', resize_);
return () => {
window.removeEventListener('resize', resize_);
}
}, [])
useEffect(() => {
let pathnameArr = location.pathname.split('/')
if (location.pathname == '/userCenter') {
localStorage.setItem('poms_open_sider', JSON.stringify([]))
localStorage.removeItem('poms_selected_sider')
setLeftShow(false)
}
let openArr = []
for (let i = 0; i < allItems.length; i++) {
if (allItems[i].items) {
for (let j = 0; j < allItems[i].items.length; j++) {
if (allItems[i].items[j].items) {
for (let k = 0; k < allItems[i].items[j].items.length; k++) {
if (allItems[i].items[j].items[k].to == location.pathname) {
for (let o = 0; o < allItems[i].items.length; o++) {
openArr.push(allItems[i].items[o].itemKey)
}
localStorage.setItem('poms_selected_sider', JSON.stringify([pathnameArr[1]]))
localStorage.setItem('poms_open_sider', JSON.stringify(openArr))
setLeftItems(allItems[i].items)
setLeftShow(true)
}
useEffect(() => {
let pathnameArr = location.pathname.split('/')
if (location.pathname == '/userCenter') {
localStorage.setItem('poms_open_sider', JSON.stringify([]))
localStorage.removeItem('poms_selected_sider')
setLeftShow(false)
}
let openArr = []
for (let i = 0; i < allItems.length; i++) {
if (allItems[i].items) {
for (let j = 0; j < allItems[i].items.length; j++) {
if (allItems[i].items[j].items) {
for (let k = 0; k < allItems[i].items[j].items.length; k++) {
if (allItems[i].items[j].items[k].to == location.pathname) {
for (let o = 0; o < allItems[i].items.length; o++) {
openArr.push(allItems[i].items[o].itemKey)
}
}
}
localStorage.setItem('poms_selected_sider', JSON.stringify([pathnameArr[1]]))
localStorage.setItem('poms_open_sider', JSON.stringify(openArr))
setLeftItems(allItems[i].items)
setLeftShow(true)
}
}
}
}
}
}, [location])
}
}
}, [location])
useEffect(() => {
NProgress.done();
if ((!user || !user.authorized)) {
history.push('/signin');
}
if (msg) {
if (msg.done) {
Notification.success({
// title: msg.done,
content: msg.done,
duration: 2,
})
}
if (msg.error) {
Notification.error({
// title: msg.error,
content: msg.error,
duration: 2,
})
}
}
const dom = document.getElementById('page-content');
if (dom) {
useEffect(() => {
NProgress.done();
if ((!user || !user.authorized)) {
history.push('/signin');
}
if (msg) {
if (msg.done) {
Notification.success({
// title: msg.done,
content: msg.done,
duration: 2,
})
}
if (msg.error) {
Notification.error({
// title: msg.error,
content: msg.error,
duration: 2,
})
}
}
const dom = document.getElementById('page-content');
setTimeout(() => {
if (dom) {
if (!scrollbar) {
scrollbar = new PerfectScrollbar('#page-content', { suppressScrollX: true });
scrollbar.update();
scrollbar = new PerfectScrollbar('#page-content', { suppressScrollX: true });
// scrollbar.update();
} else {
scrollbar.update();
dom.scrollTop = 0;
scrollbar.update();
dom.scrollTop = 0;
}
}
})
}
}, 300)
})
// websocket 使
useEffect(() => {
// console.log(socket)
if (socket) {
socket.on('CAMERA_ONLINE', function (msg) {
console.info(msg);
if (msg.online == 'ON') {
Notification.success({
title: 'Hi',
content: (<div><div>{msg.name}</div><div style={{ marginTop: 5 }}>已上线</div></div>),
duration: 2,
})
}
if (msg.online == 'OFF') {
Notification.error({
title: 'Hi',
content: (<div><div>{msg.name}</div><div style={{ marginTop: 5 }}>发生离线</div></div>),
duration: 2,
})
}
});
return () => {
socket.off("CAMERA_ONLINE");
// websocket 使
useEffect(() => {
// console.log(socket)
if (socket) {
socket.on('CAMERA_ONLINE', function (msg) {
console.info(msg);
if (msg.online == 'ON') {
Notification.success({
title: 'Hi',
content: (<div><div>{msg.name}</div><div style={{ marginTop: 5 }}>已上线</div></div>),
duration: 2,
})
}
}
}, [socket])
return (
<Layout id="layout" style={{ height: '100%' }}>
{
<>
<Layout.Header>
<Header
headerItems={headerItems}
user={user}
pathname={location.pathname}
toggleCollapsed={() => {
setCollapsed(!collapsed);
}}
collapsed={collapsed}
history={history}
tochange={(val) => {
setLeftChange(!leftChange)
if (val.fatherKey) {
for (let i = 0; i < allItems.length; i++) {
if (val.fatherKey == allItems[i].itemKey) {
let openArr = []
for (let j = 0; j < allItems[i].items.length; j++) {
openArr.push(allItems[i].items[j].itemKey)
}
localStorage.setItem('poms_selected_sider', JSON.stringify([val.fatherKey]))
localStorage.setItem('poms_open_sider', JSON.stringify(openArr))
setLeftItems(allItems[i].items)
}
}
setLeftShow(true)
}
else {
localStorage.setItem('poms_open_sider', JSON.stringify([]))
localStorage.removeItem('poms_selected_sider')
setLeftShow(false)
}
history.push(val.to);
}}
/>
</Layout.Header>
<Layout style={{ height: 'calc(100% - 50px)' }}>
{leftShow ? (<Layout.Sider>
<Sider
sections={sections}
leftItems={leftItems}
dispatch={dispatch}
user={user}
leftChange={leftChange}
pathname={location.pathname}
collapsed={collapsed}
/>
</Layout.Sider>) : ('')}
<Layout.Content>
<div style={{
background: "#F2F3F5",
}}>
<div id="page-content" style={{
height: clientHeight - 12,
minWidth: 520,
position: 'relative',
}}>
<div style={{
minHeight: clientHeight - 32 - 12,
position: 'relative',
padding: '12px 8px',
}}>
{children}
</div>
<Layout.Footer>
<Footer />
</Layout.Footer>
</div>
</div>
</Layout.Content>
</Layout>
</>
if (msg.online == 'OFF') {
Notification.error({
title: 'Hi',
content: (<div><div>{msg.name}</div><div style={{ marginTop: 5 }}>发生离线</div></div>),
duration: 2,
})
}
</Layout >
)
});
return () => {
socket.off("CAMERA_ONLINE");
}
}
}, [socket])
return (
<Layout id="layout" style={{ height: '100%' }}>
{
<>
<Layout.Header>
<Header
headerItems={headerItems}
user={user}
pathname={location.pathname}
toggleCollapsed={() => {
setCollapsed(!collapsed);
}}
collapsed={collapsed}
history={history}
tochange={(val) => {
setLeftChange(!leftChange)
if (val.fatherKey) {
for (let i = 0; i < allItems.length; i++) {
if (val.fatherKey == allItems[i].itemKey) {
let openArr = []
for (let j = 0; j < allItems[i].items.length; j++) {
openArr.push(allItems[i].items[j].itemKey)
}
localStorage.setItem('poms_selected_sider', JSON.stringify([val.fatherKey]))
localStorage.setItem('poms_open_sider', JSON.stringify(openArr))
setLeftItems(allItems[i].items)
}
}
setLeftShow(true)
}
else {
localStorage.setItem('poms_open_sider', JSON.stringify([]))
localStorage.removeItem('poms_selected_sider')
setLeftShow(false)
}
history.push(val.to);
}}
/>
</Layout.Header>
<Layout style={{ height: 'calc(100% - 50px)' }}>
{leftShow ? (<Layout.Sider>
<Sider
sections={sections}
leftItems={leftItems}
dispatch={dispatch}
user={user}
leftChange={leftChange}
pathname={location.pathname}
collapsed={collapsed}
/>
</Layout.Sider>) : ('')}
<Layout.Content>
<div style={{
background: "#F2F3F5",
}}>
<div id="page-content" style={{
height: clientHeight - 12,
minWidth: 520,
position: 'relative',
}}>
<div style={{
minHeight: clientHeight - 32 - 12,
position: 'relative',
padding: '12px 8px',
}}>
{children}
</div>
<Layout.Footer>
<Footer />
</Layout.Footer>
</div>
</div>
</Layout.Content>
</Layout>
</>
}
</Layout >
)
}
function mapStateToProps (state) {
const { global, auth, ajaxResponse, webSocket } = state;
return {
title: global.title,
copyright: global.copyright,
sections: global.sections,
actions: global.actions,
clientWidth: global.clientWidth,
clientHeight: global.clientHeight,
msg: ajaxResponse.msg,
user: auth.user,
socket: webSocket.socket
};
const { global, auth, ajaxResponse, webSocket } = state;
return {
title: global.title,
copyright: global.copyright,
sections: global.sections,
actions: global.actions,
clientWidth: global.clientWidth,
clientHeight: global.clientHeight,
msg: ajaxResponse.msg,
user: auth.user,
socket: webSocket.socket
};
}
export default connect(mapStateToProps)(LayoutContainer);

401
web/client/src/sections/control/containers/control.jsx

@ -235,6 +235,7 @@ const Control = (props) => {
let webtop = 0
let webId = document.getElementById('web');
if (web) clearInterval(web)
let memberId = document.getElementById('member');
if (memberId) {
function webstart () {
member = setInterval(() => {
@ -701,236 +702,236 @@ const Control = (props) => {
{/* 统计概览 */}
{
exhibition.current?.overall?.find(v => v.key == 'statistical') ? <>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginTop: 25 }}>
<div style={{ display: 'flex', alignItems: 'center' }}>
<div style={{ width: 0, height: 20, borderLeft: '3px solid #005ABD', borderTop: '3px solid transparent', borderBottom: '3px solid transparent' }}></div>
<div style={{ fontFamily: "YouSheBiaoTiHei", fontSize: 24, color: '#101531', marginLeft: 8 }}>统计概览</div>
<div style={{ marginLeft: 6, fontSize: 12, color: '#969799', fontFamily: "DINExp", }}>STATISTICAL OVERVIEW</div>
</div>
<div style={{ marginRight: 25 }}>
<img title='设置' src="/assets/images/problem/setup.png" style={{ width: 18, height: 18, cursor: "pointer" }} onClick={() => {
setSetup(true)
setTableType('statistical')
attribute('statistical')
setSetData(5)
}} />
exhibition.current?.overall?.find(v => v.key == 'statistical') ? <>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginTop: 25 }}>
<div style={{ display: 'flex', alignItems: 'center' }}>
<div style={{ width: 0, height: 20, borderLeft: '3px solid #005ABD', borderTop: '3px solid transparent', borderBottom: '3px solid transparent' }}></div>
<div style={{ fontFamily: "YouSheBiaoTiHei", fontSize: 24, color: '#101531', marginLeft: 8 }}>统计概览</div>
<div style={{ marginLeft: 6, fontSize: 12, color: '#969799', fontFamily: "DINExp", }}>STATISTICAL OVERVIEW</div>
</div>
<div style={{ marginRight: 25 }}>
<img title='设置' src="/assets/images/problem/setup.png" style={{ width: 18, height: 18, cursor: "pointer" }} onClick={() => {
setSetup(true)
setTableType('statistical')
attribute('statistical')
setSetData(5)
}} />
</div>
</div>
</div>
{/* 统计概览 */}
<div id='overviewCalc' style={{ width: 'calc(100%)', position: 'relative' }}>
<div style={{ display: 'inline-flex', marginTop: 16 }}>
{/* 项目 */}
{
pepProjectId ?
'' :
<div id='pomsList' style={{
marginRight: 20, paddingRight: 24, position: 'relative', marginBottom: 30, width: 410, height: 221, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2
}}>
{pomsList?.map((v, index) => {
return <div key={'pomsList' + index} title={v.pepProjectName}
style={{
width: 400, cursor: 'pointer', lineHeight: '30px', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis', fontSize: 14, color: '#969799',
background: projectId == v.pepProjectId ? 'linear-gradient(252deg, #F9FBFF 0%, rgb(185 202 236) 100%)' : "",
}}
onClick={() => setProjectId(v.pepProjectId)}>{v.pepProjectName}</div>
})}
</div>}
{/* 项目里程碑 */}
{
exhibition.current?.statistical?.find(v => v.key == 'milestone') && projectId &&
projectData?.find(u => u.id == projectId)?.pepProjectName ?
<div style={{
marginBottom: 30, width: 466, height: 221, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2
}}>
<div style={{ margin: '20px 0px 20px 24px', color: '#4A4A4A', fontSize: 16, fontWeight: 'bold' }}>
项目里程碑
</div>
<div style={{ display: 'flex', marginBottom: 20, marginLeft: 24 }}>
<div style={{ display: 'flex' }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
立项时间
</div>
<div style={{ fontSize: 14, color: '#4A4A4A', width: 104 }} title='项企项目数据为空或未开发'>
暂无
</div>
{/* 统计概览 */}
<div id='overviewCalc' style={{ width: 'calc(100%)', position: 'relative' }}>
<div style={{ display: 'inline-flex', marginTop: 16 }}>
{/* 项目 */}
{
pepProjectId ?
'' :
<div id='pomsList' style={{
marginRight: 20, paddingRight: 24, position: 'relative', marginBottom: 30, width: 410, height: 221, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2
}}>
{pomsList?.map((v, index) => {
return <div key={'pomsList' + index} title={v.pepProjectName}
style={{
width: 400, cursor: 'pointer', lineHeight: '30px', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis', fontSize: 14, color: '#969799',
background: projectId == v.pepProjectId ? 'linear-gradient(252deg, #F9FBFF 0%, rgb(185 202 236) 100%)' : "",
}}
onClick={() => setProjectId(v.pepProjectId)}>{v.pepProjectName}</div>
})}
</div>}
{/* 项目里程碑 */}
{
exhibition.current?.statistical?.find(v => v.key == 'milestone') && projectId &&
projectData?.find(u => u.id == projectId)?.pepProjectName ?
<div style={{
marginBottom: 30, width: 466, height: 221, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2
}}>
<div style={{ margin: '20px 0px 20px 24px', color: '#4A4A4A', fontSize: 16, fontWeight: 'bold' }}>
项目里程碑
</div>
<div style={{ display: 'flex' }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
施工时间
<div style={{ display: 'flex', marginBottom: 20, marginLeft: 24 }}>
<div style={{ display: 'flex' }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
立项时间
</div>
<div style={{ fontSize: 14, color: '#4A4A4A', width: 104 }} title='项企项目数据为空或未开发'>
暂无
</div>
</div>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'>
暂无
<div style={{ display: 'flex' }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
施工时间
</div>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'>
暂无
</div>
</div>
</div>
</div>
<div style={{ display: 'flex', marginBottom: 24, marginLeft: 24 }}>
<div style={{ display: 'flex' }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
内验时间
<div style={{ display: 'flex', marginBottom: 24, marginLeft: 24 }}>
<div style={{ display: 'flex' }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
内验时间
</div>
<div style={{ fontSize: 14, color: '#4A4A4A', width: 104 }} title='项企项目数据为空或未开发'>
暂无
</div>
</div>
<div style={{ fontSize: 14, color: '#4A4A4A', width: 104 }} title='项企项目数据为空或未开发'>
暂无
<div style={{ display: 'flex' }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
外验时间
</div>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'>
暂无
</div>
</div>
</div>
<div style={{ display: 'flex' }}>
<div style={{ display: 'flex', marginBottom: 17, marginLeft: 24 }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
外验时间
</div>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'>
暂无
</div>
</div>
</div>
<div style={{ display: 'flex', marginBottom: 17, marginLeft: 24 }}>
<div style={{ fontSize: 14, color: '#969799', marginRight: 4 }}>
工程维保时间
</div>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'>
暂无
</div>
</div>
<div style={{ display: 'flex', background: 'linear-gradient(252deg, #F9FBFF 0%, #DBE7FF 100%)', height: 38, justifyContent: 'space-between' }}>
<div style={{ display: 'flex', marginLeft: 24, alignItems: 'center' }}>
<div style={{ fontSize: 14, color: '#646566', marginRight: 4 }}>
售后维修时间
工程维保时间
</div>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'>
暂无
</div>
</div>
{/* <img src="/assets/images/console/onGoing.png" alt="进行中" /> */}
</div>
</div>
: ""}
{/* 相关成员 */}
{exhibition.current?.statistical?.find(v => v.key == 'personnel') ?
<div style={{ width: 360, height: 221, marginLeft: 20, paddingLeft: 24, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2 }}>
<div style={{ margin: '20px 0px 17px 0px', color: '#4A4A4A', fontSize: 16, fontWeight: 'bold' }}>
相关成员
</div>
<div id='member' style={{ position: 'relative', height: 161 }}>
{memberList?.map((item, index) => {
return (
<div key={index + 'member'} style={{ display: 'flex', justifyContent: 'space-between', marginBottom: 15 }}>
<div style={{ display: 'flex', alignItems: 'center' }}>
<div style={{ width: 18, height: 18 }}>
<img src="/assets/images/console/member.png" alt="成员" style={{ width: '100%', height: '100%' }} />
</div>
<div style={{ marginLeft: 8, fontSize: 14, color: '#4A4A4A' }}>
{item.name}
</div>
<div style={{ fontSize: 12, color: '#969799' }}>
负责人
</div>
<div style={{ display: 'flex', background: 'linear-gradient(252deg, #F9FBFF 0%, #DBE7FF 100%)', height: 38, justifyContent: 'space-between' }}>
<div style={{ display: 'flex', marginLeft: 24, alignItems: 'center' }}>
<div style={{ fontSize: 14, color: '#646566', marginRight: 4 }}>
售后维修时间
</div>
<div style={{ color: '#969799', fontSize: 14, marginRight: 22 }}>
<Tooltip content={item.department?.map((v, index) => index > 0 ? ',' + v : v)}>
<div className='Tooltip' style={{}}>
{item.department[0]}
</div>
</Tooltip>
<div style={{ fontSize: 14, color: '#4A4A4A' }} title='项企项目数据为空或未开发'>
暂无
</div>
</div>
)
})}
</div>
</div>
: ""}
{/* 平台设备接入 */}
{exhibition.current?.statistical?.find(v => v.key == 'DeviceAccess') ?
<div style={{ width: 360, height: 221, marginLeft: 20, paddingLeft: 24, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2 }}>
<div style={{ margin: '20px 0px 17px 0px', color: '#4A4A4A', fontSize: 16, fontWeight: 'bold', marginBottom: 16 }}>
平台设备接入
</div>
<div id='equipment' style={{ position: 'relative', height: 161 }}>
{
equipmentList.map((item, index) => {
{/* <img src="/assets/images/console/onGoing.png" alt="进行中" /> */}
</div>
</div>
: ""}
{/* 相关成员 */}
{exhibition.current?.statistical?.find(v => v.key == 'personnel') ?
<div style={{ width: 360, height: 221, marginLeft: 20, paddingLeft: 24, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2 }}>
<div style={{ margin: '20px 0px 17px 0px', color: '#4A4A4A', fontSize: 16, fontWeight: 'bold' }}>
相关成员
</div>
<div id='member' style={{ position: 'relative', height: 161 }}>
{memberList?.map((item, index) => {
return (
<div key={index + 'equipment'} style={{ marginBottom: 15, display: 'flex' }}>
<div style={{ color: '#969799', fontSize: 14, width: 167 }}>
5阶ZK1高清摄球机
</div>
<div style={{ color: '#4A4A4A', fontSize: 14, width: 81 }}>
视频
</div>
<div style={{ width: 18, height: 18, marginRight: 8 }}>
<img src="/assets/images/console/icon_online.png" alt="网络" style={{ width: '100%', height: '100%' }} />
{/* <img src="/assets/images/console/icon_offline.png" alt="网络" style={{ width: '100%', height: '100%' }} /> */}
<div key={index + 'member'} style={{ display: 'flex', justifyContent: 'space-between', marginBottom: 15 }}>
<div style={{ display: 'flex', alignItems: 'center' }}>
<div style={{ width: 18, height: 18 }}>
<img src="/assets/images/console/member.png" alt="成员" style={{ width: '100%', height: '100%' }} />
</div>
<div style={{ marginLeft: 8, fontSize: 14, color: '#4A4A4A' }}>
{item.name}
</div>
<div style={{ fontSize: 12, color: '#969799' }}>
负责人
</div>
</div>
<div style={{ color: '#0F7EFB', fontSize: 14 }}>
在线
<div style={{ color: '#969799', fontSize: 14, marginRight: 22 }}>
<Tooltip content={item.department?.map((v, index) => index > 0 ? ',' + v : v)}>
<div className='Tooltip' style={{}}>
{item.department[0]}
</div>
</Tooltip>
</div>
{/* <div style={{color:'#969799',fontSize:14}}>
掉线
</div> */}
</div>
)
})
}
</div>
</div>
: ""}
{/* 关联web应用 */}
{exhibition.current?.statistical?.find(v => v.key == 'web') ?
<div style={{ width: 360, height: 221, marginLeft: 20, paddingLeft: 24, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2 }}>
<div style={{ margin: '20px 0px 17px 0px', color: '#4A4A4A', fontSize: 16, fontWeight: 'bold', marginBottom: 15 }}>
关联web应用
})}
</div>
</div>
<div id='web' style={{ position: 'relative', height: 161 }}>
{
webList.map((item, index) => {
return (
<div key={index + 'webb'} style={{ marginBottom: 15, }}>
<div style={{ display: 'flex' }}>
: ""}
{/* 平台设备接入 */}
{exhibition.current?.statistical?.find(v => v.key == 'DeviceAccess') ?
<div style={{ width: 360, height: 221, marginLeft: 20, paddingLeft: 24, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2 }}>
<div style={{ margin: '20px 0px 17px 0px', color: '#4A4A4A', fontSize: 16, fontWeight: 'bold', marginBottom: 16 }}>
平台设备接入
</div>
<div id='equipment' style={{ position: 'relative', height: 161 }}>
{
equipmentList.map((item, index) => {
return (
<div key={index + 'equipment'} style={{ marginBottom: 15, display: 'flex' }}>
<div style={{ color: '#969799', fontSize: 14, width: 167 }}>
5阶ZK1高清摄球机
</div>
<div style={{ color: '#4A4A4A', fontSize: 14, width: 81 }}>
视频
</div>
<div style={{ width: 18, height: 18, marginRight: 8 }}>
<img src="/assets/images/console/icon_webpage.png" alt="web应用" style={{ width: '100%', height: '100%' }} />
<img src="/assets/images/console/icon_online.png" alt="网络" style={{ width: '100%', height: '100%' }} />
{/* <img src="/assets/images/console/icon_offline.png" alt="网络" style={{ width: '100%', height: '100%' }} /> */}
</div>
<div style={{ color: '#646566', fontSize: 14, borderBottom: '1px dotted #0F7EFB' }}>
<a href={item.url} target="_blank">
{item.url}
</a>
<div style={{ color: '#0F7EFB', fontSize: 14 }}>
在线
</div>
{/* <div style={{color:'#969799',fontSize:14}}>
掉线
</div> */}
</div>
<div style={{ color: '#4A4A4A', fontSize: 14, marginLeft: 26 }}>
{item.name}
</div>
</div>
)
})
}
</div>
</div>
: ""}
{/* 异常&问题 */}
{exhibition.current?.statistical?.find(v => v.key == 'problem') ?
<div style={{ width: 399, height: 221, marginLeft: 20, marginRight: 20, paddingLeft: 24, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2 }}>
<div style={{ margin: '20px 0px 17px 0px', color: '#4A4A4A', fontSize: 16, fontWeight: 'bold' }}>
异常&问题
)
})
}
</div>
</div>
<div id='problems' style={{ position: 'relative', height: 161 }}>
{
problemsList?.map((v, index) => {
return (
<div style={{ marginBottom: 15, paddingRight: 30, }} key={'problems' + index} onClick={() => {
dispatch(push(v.url))
}}>
<div style={{ fontSize: 14, color: '#646566' }} >
{v.SourceName}{v.groupName}{v.groupName == '视频异常' ? "" : ',诊断为 '} <span style={{ color: '#0F7EFB', borderBottom: '1px dotted #0F7EFB', cursor: "pointer" }} >{v.typeName}请前往确认</span>
: ""}
{/* 关联web应用 */}
{exhibition.current?.statistical?.find(v => v.key == 'web') ?
<div style={{ width: 360, height: 221, marginLeft: 20, paddingLeft: 24, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2 }}>
<div style={{ margin: '20px 0px 17px 0px', color: '#4A4A4A', fontSize: 16, fontWeight: 'bold', marginBottom: 15 }}>
关联web应用
</div>
<div id='web' style={{ position: 'relative', height: 161 }}>
{
webList.map((item, index) => {
return (
<div key={index + 'webb'} style={{ marginBottom: 15, }}>
<div style={{ display: 'flex' }}>
<div style={{ width: 18, height: 18, marginRight: 8 }}>
<img src="/assets/images/console/icon_webpage.png" alt="web应用" style={{ width: '100%', height: '100%' }} />
</div>
<div style={{ color: '#646566', fontSize: 14, borderBottom: '1px dotted #0F7EFB' }}>
<a href={item.url} target="_blank">
{item.url}
</a>
</div>
</div>
<div style={{ color: '#4A4A4A', fontSize: 14, marginLeft: 26 }}>
{item.name}
</div>
</div>
<div style={{ color: '#969799', fontSize: 12, marginRight: 40, marginTop: 4 }}>
{moment(v.StartTime).format("YYYY-MM-DD HH:mm:ss")}
)
})
}
</div>
</div>
: ""}
{/* 异常&问题 */}
{exhibition.current?.statistical?.find(v => v.key == 'problem') ?
<div style={{ width: 399, height: 221, marginLeft: 20, marginRight: 20, paddingLeft: 24, border: '1px solid rgba(220,222,224,0.2)', boxShadow: '0px 2px 12px 1px #F2F3F5', borderRadius: 2 }}>
<div style={{ margin: '20px 0px 17px 0px', color: '#4A4A4A', fontSize: 16, fontWeight: 'bold' }}>
异常&问题
</div>
<div id='problems' style={{ position: 'relative', height: 161 }}>
{
problemsList?.map((v, index) => {
return (
<div style={{ marginBottom: 15, paddingRight: 30, }} key={'problems' + index} onClick={() => {
dispatch(push(v.url))
}}>
<div style={{ fontSize: 14, color: '#646566' }} >
{v.SourceName}{v.groupName}{v.groupName == '视频异常' ? "" : ',诊断为 '} <span style={{ color: '#0F7EFB', borderBottom: '1px dotted #0F7EFB', cursor: "pointer" }} >{v.typeName}请前往确认</span>
</div>
<div style={{ color: '#969799', fontSize: 12, marginRight: 40, marginTop: 4 }}>
{moment(v.StartTime).format("YYYY-MM-DD HH:mm:ss")}
</div>
</div>
</div>
)
})
}
)
})
}
</div>
</div>
</div>
: ""}
</div>
</div></> : ""}
: ""}
</div>
</div></> : ""}
</div>
{exhibition.current?.overall?.find(v => v.key == 'analyse') ?
@ -1058,7 +1059,7 @@ const Control = (props) => {
text: v.name,
},
grid: {
left: '5%',
left: '10%',
// right: '4%',
// bottom: '3%',
// containLabel: true

Loading…
Cancel
Save