自定义统计大屏不鉴权

api/app/lib/controllers/project/group.js

@@ -107,13 +107,15 @@ async function groupStatistic (ctx) {
    try {
       const { models } = ctx.fs.dc;
       const { userId } = ctx.fs.api
+      const { pomsU } = ctx.query
       const { clickHouse } = ctx.app.fs
       const { utils: { judgeSuper, anxinStrucIdRange } } = ctx.app.fs
       const sequelize = ctx.fs.dc.orm
 
+      let userId_ = pomsU || userId
       const progectGroupList = await models.ProjectGroup.findAll({
          where: {
-            pomsUserId: userId
+            pomsUserId: userId_
          }
       })
 

api/app/lib/utils/push.js

@@ -29,21 +29,23 @@ module.exports = function (app, opts) {
       }
    }
 
-   const pushByEmail = async ({ email = [], title, text = '', html = '', attachments = undefined,  } = {}) => {
+   let senderIndex = 0
+   const pushByEmail = async ({ email = [], title, text = '', html = '', attachments = undefined, } = {}) => {
       try {
+         let useSender = opts.email.sender[senderIndex++ % opts.email.sender.length]
          let transporter = nodemailer.createTransport({
             host: opts.email.host,
             port: opts.email.port,
             secure: true,
             auth: {
-               user: opts.email.sender.address,
-               pass: opts.email.sender.password,
+               user: useSender.address,
+               pass: useSender.password,
             }
          });
 
          // send mail with defined transport object
          await transporter.sendMail({
-            from: `${opts.email.sender.name}<${opts.email.sender.address}>`, // sender address
+            from: `${useSender.name}<${useSender.address}>`, // sender address
             to: email.join(','), // list of receivers 逗号分隔字符串
             subject: title, // Subject line
             text: text, // plain text body

web/client/src/layout/components/header/index.jsx

@@ -109,10 +109,12 @@ const Header = (props) => {
                         style={{ display: "inline-block", width: 200, height: 40, marginLeft: -24, cursor: 'pointer' }}
                         onClick={() => {
                            let projectGroup = JSON.parse(localStorage.getItem('project_group'))
-                           if (projectGroup && projectGroup?.find(v => v.userId == user?.id)) {
-                              window.open('/projectGroup/bigscreen', '_blank')
+                           let url = `/projectGroup/bigscreen?pomsU=${user?.id}`
+                           let curPG = projectGroup && projectGroup?.find(v => v.userId == user?.id)
+                           if (curPG) {
+                              window.open(`/projectGroup/bigscreen?pomsPG=${curPG.projectGroupId}&pomsU=${user?.id}`, '_blank')
                            } else {
-                              window.open('/projectGroup/statistic', '_blank')
+                              window.open(`/projectGroup/statistic?pomsU=${user?.id}`, '_blank')
                            }
                         }}
                      />
@@ -372,7 +374,6 @@ const Header = (props) => {
 
                         {/* collapseButton   collapseText */}
 
-
                      </Nav.Sub>
                   </>
                }

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

@@ -170,7 +170,9 @@ const LayoutContainer = props => {
    useEffect(() => {
       NProgress.done();
       if ((!user || !user.authorized)) {
-         history.push('/signin');
+         if (!location.pathname.includes('projectGroup')) {
+            history.push('/signin');
+         }
       }
       if (msg) {
          if (msg.done) {

web/client/src/layout/index.jsx

@@ -144,7 +144,7 @@ const Root = props => {
       setOuterRoutes(outerRoutes.map(route => (
          <Route
             key={route.key}
-            exact
+            exact={route.hasOwnProperty('exact') ? route.exact : true}
             path={route.path}
             component={route.component}
          />

web/client/src/sections/projectGroup/actions/group.js

@@ -34,12 +34,12 @@ export function delProjectGroup (id) {
    });
 }
 
-export function groupStatistic () {
+export function groupStatistic ({ userId } = {}) {
    return (dispatch) => basicAction({
       type: "get",
       dispatch: dispatch,
       actionType: "GET_GROPUP_STATISTICS",
-      url: `${ApiTable.groupStatistic}`,
+      url: `${ApiTable.groupStatistic}?pomsU=${userId || ''}`,
       msg: { error: "获取项目分组统计信息失败" },
       reducer: { name: "groupStatistic", params: { noClear: true } },
    });
@@ -66,8 +66,10 @@ export function groupStatisticAlarm (query = {}) {
       actionType: "GET_STATISTICALARM",
       url: `${ApiTable.groupStatisticAlarm}`,
       msg: { error: "获取项目分组告警统计信息失败" },
-      reducer: { name: "groupStatisticAlarm",
-      params: { noClear: true } },
+      reducer: {
+         name: "groupStatisticAlarm",
+         params: { noClear: true }
+      },
    });
 }
 
@@ -79,8 +81,10 @@ export function groupProject (query = {}) {
       actionType: "GET_GROUP_PROJECT",
       url: `${ApiTable.groupProject}`,
       msg: { error: "获取分组项目信息失败" },
-      reducer: { name: "groupProject",
-      params: { noClear: true } },
+      reducer: {
+         name: "groupProject",
+         params: { noClear: true }
+      },
    });
 }
 

web/client/src/sections/projectGroup/components/header.jsx

@@ -1,11 +1,12 @@
 import React, { useEffect, useRef, useState } from 'react';
 import { connect } from 'react-redux';
 import { Skeleton, Button, Pagination, Form, Popconfirm, Table, Toast } from '@douyinfe/semi-ui';
+import { push } from 'react-router-redux';
 import moment from "moment";
 
 const Header = (props) => {
-   const { dispatch, actions, user,match, weatherRealtime, history } = props
-
+   const { dispatch, actions, user, match, weatherRealtime, history } = props
+   const [queryUserId, setQueryUserId] = useState('')
    const [date, setDate] = useState(moment());
    const dayMap = { 0: '日', 1: '一', 2: '二', 3: '三', 4: '四', 5: '五', 6: '六' }
    const weatherMap = {
@@ -24,6 +25,13 @@ const Header = (props) => {
       dispatch(actions.auth.getWeatherRealtime())
    }
    useEffect(() => {
+      console.log(props?.location);
+      let search = props?.location?.search || '';
+      let params = new URLSearchParams(search);
+      let userId = params.get('pomsU')
+      console.log(userId);
+      setQueryUserId(userId)
+
       const setTime = () => {
          setDate(moment());
          setTimeout(() => {
@@ -120,7 +128,7 @@ const Header = (props) => {
                   display: "flex", alignItems: 'center', justifyContent: "space-around", width: 90,
                   color: 'color: #5A6685', fontSize: 14, fontFamily: "SourceHanSansCN-Regular", cursor: 'pointer'
                }} onClick={() => {
-                  history.push({ pathname: `/projectGroup/statistic`, })
+                  dispatch(push(`/projectGroup/statistic?pomsU=${queryUserId}`))
                }}>
                   <img src="/assets/images/projectGroup/backend.png" style={{ width: 14, height: 14 }} alt="" />
                   返回后台

web/client/src/sections/projectGroup/containers/bigscreen.jsx

@@ -1,6 +1,7 @@
 import React, { useEffect, useRef, useState } from 'react';
 import { Skeleton, Button, Pagination, Select, Popconfirm, Table, Tooltip } from '@douyinfe/semi-ui';
 import { connect } from 'react-redux';
+import { push } from 'react-router-redux';
 import Header from '../components/header';
 import Body from '../components/body'
 import Card from '../components/card'
@@ -13,7 +14,8 @@ import AutoRollComponent from '../components/AutoRollComponent'
 let interrupt
 let repair
 let overviewScrollbar;
-const Bigscreen = ({ dispatch, actions, user, match, history, clientHeight, groupStatisticOnline }) => {
+const Bigscreen = (props) => {
+   const { dispatch, actions, user, match, history, clientHeight, groupStatisticOnline, ...restProps } = props
 
    const [InterruptRank, setInterruptRank] = useState([])
    const [online, setOnline] = useState([])
@@ -30,27 +32,37 @@ const Bigscreen = ({ dispatch, actions, user, match, history, clientHeight, grou
    const [xData, setXData] = useState([])//横坐标
    const self = useRef({ myChart: null });
 
+   // const [queryUserId, setQueryUserId] = useState('')
 
    useEffect(() => {
-      let groupId = JSON.parse(localStorage.getItem('project_group'))?.find(v => user?.id == v.userId)?.projectGroupId
-      statisticOnline(groupId)
+
+      let groupIdLocal = JSON.parse(localStorage.getItem('project_group'))?.find(v => user?.id == v.userId)?.projectGroupId
+
+      let search = restProps?.location?.search || '';
+      let params = new URLSearchParams(search);
+      // let userId = params.get('pomsU')
+      let groupId = params.get('pomsPG')
+
+      // setQueryUserId(userId)
+
+      let groupId_ = groupId || groupIdLocal
+
+      statisticOnline(groupId_)
       //计算当前时间，定时更新
-      timeRequest(groupId)
-      dispatch(actions.projectGroup.groupStatisticAlarm({ groupId })).then(res => {
+      timeRequest(groupId_)
+      dispatch(actions.projectGroup.groupStatisticAlarm({ groupId: groupId_ })).then(res => {
          if (res.success) {
             setMockData(res.payload.data)
          }
       })
 
-
-      dispatch(actions.projectGroup.groupProject({ groupId })).then(res => {
+      dispatch(actions.projectGroup.groupProject({ groupId: groupId_ })).then(res => {
          if (res.success) {
             setGroupProject(res.payload.data?.map(v => ({ ...v, value: (Math.random() * 20).toFixed(0) })) || [])
             setProportion([...res.payload.data?.slice(0, 3)?.map(v => ({ name: v.name || v.pepProjectName, value: (Math.random() * 20).toFixed(0) })), { value: 20, name: '其它' }])
          }
       })
 
-
       const interruptDom = document.getElementById("interrupt");
       if (interruptDom) {
          interrupt = new PerfectScrollbar("#interrupt", {
@@ -65,6 +77,7 @@ const Bigscreen = ({ dispatch, actions, user, match, history, clientHeight, grou
       }
 
    }, [])
+
    useEffect(() => {
       const overview = document.getElementById("alarmRank");
       if (overview) {
@@ -108,7 +121,7 @@ const Bigscreen = ({ dispatch, actions, user, match, history, clientHeight, grou
          const newArray = mockData.slice(0, 20)
          setAlarmData(newArray)
 
-      }else{
+      } else {
          setAlarmData(mockData)
       }
    }, [mockData])
@@ -182,7 +195,7 @@ const Bigscreen = ({ dispatch, actions, user, match, history, clientHeight, grou
 
    return (
       <div className='project-group'>
-         <Header match={match} history={history} />
+         <Header match={match} history={history} {...props} />
          <Body>
             <div style={{ width: "100%", height: '100%' }}>
                <div style={{ width: '100%', height: "45%", display: 'flex' }}>
@@ -288,7 +301,7 @@ const Bigscreen = ({ dispatch, actions, user, match, history, clientHeight, grou
                         </div>
                      </Card>
                   </div>
-                  <Card title='数据在线率'  tooltipContent='在线率计算：设备存活/总设备（存活判断：普通设备2h以内有实时数据，GNSS设备8h以内有实时数据）' style={{ width: "calc(50% - 8px)", height: "100%", }}>
+                  <Card title='数据在线率' tooltipContent='在线率计算：设备存活/总设备（存活判断：普通设备2h以内有实时数据，GNSS设备8h以内有实时数据）' style={{ width: "calc(50% - 8px)", height: "100%", }}>
                      <div style={{ height: '100%', position: 'relative' }}>
                         {/* <div > */}
                         <Select
@@ -375,31 +388,31 @@ const Bigscreen = ({ dispatch, actions, user, match, history, clientHeight, grou
                            </div>
                         </div>
                         <div id='alarmRank' style={{ height: clientHeight * 0.55 - 150, position: 'relative' }}>
-                        <AutoRollComponent content={ <>{alarmData?.map((item,index)=>{
-   return (<div style={{ display: 'flex', marginTop: 15, alignItems: 'center' }}>
-   <div class='rankDiv'>
-      {index===0?<img src='/assets/images/projectGroup/first.png'></img>:
-      index===1?<img src='/assets/images/projectGroup/second.png'></img>:
-      index===2?<img src='/assets/images/projectGroup/third.png'></img>:
-      index>2? <span>{index + 1}</span>:''
-}
-   </div>
-   <div class='structDiv'>{item.name?.length > 5 ? <Tooltip content={item.name}>{item.name.substring(0, 5) + '...'}</Tooltip> : item.name}</div>
-   <div class='barChartDiv'>
-      <div style={{ width: '50%', display: 'flex', justifyContent: 'flex-end',position:'relative' }}>
-     <span style={{position:'absolute',left:0,zIndex:2}}> {item.dealAlarmCount}</span>
-         <div class='alarms' style={{ width:(biggest>0? ((item.dealAlarmCount / biggest) * 100 + '%'):0), height: '100%',zIndex:2 }}>  </div>
-      </div>
-      <div style={{ width: '50%', display: 'flex',position:'relative' }}>
-     <span style={{position:'absolute',right:0,zIndex:2}}> {item.alarmCount}</span>
-         <div class='dealAlarms' style={{ width: (biggest>0? ((item.alarmCount / biggest) * 100 + '%'):0), height: '100%',zIndex:2 }}> </div>
-      </div>
-   </div>
-</div>) 
-})}</> }  containerStyle={{ position: "relative", height: "95%", }}
-divHeight={"100%"} divId={"chart"}/>      
+                           <AutoRollComponent content={<>{alarmData?.map((item, index) => {
+                              return (<div style={{ display: 'flex', marginTop: 15, alignItems: 'center' }}>
+                                 <div class='rankDiv'>
+                                    {index === 0 ? <img src='/assets/images/projectGroup/first.png'></img> :
+                                       index === 1 ? <img src='/assets/images/projectGroup/second.png'></img> :
+                                          index === 2 ? <img src='/assets/images/projectGroup/third.png'></img> :
+                                             index > 2 ? <span>{index + 1}</span> : ''
+                                    }
+                                 </div>
+                                 <div class='structDiv'>{item.name?.length > 5 ? <Tooltip content={item.name}>{item.name.substring(0, 5) + '...'}</Tooltip> : item.name}</div>
+                                 <div class='barChartDiv'>
+                                    <div style={{ width: '50%', display: 'flex', justifyContent: 'flex-end', position: 'relative' }}>
+                                       <span style={{ position: 'absolute', left: 0, zIndex: 2 }}> {item.dealAlarmCount}</span>
+                                       <div class='alarms' style={{ width: (biggest > 0 ? ((item.dealAlarmCount / biggest) * 100 + '%') : 0), height: '100%', zIndex: 2 }}>  </div>
+                                    </div>
+                                    <div style={{ width: '50%', display: 'flex', position: 'relative' }}>
+                                       <span style={{ position: 'absolute', right: 0, zIndex: 2 }}> {item.alarmCount}</span>
+                                       <div class='dealAlarms' style={{ width: (biggest > 0 ? ((item.alarmCount / biggest) * 100 + '%') : 0), height: '100%', zIndex: 2 }}> </div>
+                                    </div>
+                                 </div>
+                              </div>)
+                           })}</>} containerStyle={{ position: "relative", height: "95%", }}
+                              divHeight={"100%"} divId={"chart"} />
                         </div>
-                       
+
                         <div class="scale">
                            {xData?.map(item => {
                               return <div >{item}</div>
@@ -407,7 +420,7 @@ divHeight={"100%"} divId={"chart"}/>
                         </div>
                      </div>) : ''}
                   </Card>
-                  <Card title='中断排名'  tooltipContent='中断时长：当前时间-最后一条数据时间。中断个数：结构物下中断测点个数/结构物总测点个数。' style={{ width: "calc(50% - 8px)", height: "100%", }}>
+                  <Card title='中断排名' tooltipContent='中断时长：当前时间-最后一条数据时间。中断个数：结构物下中断测点个数/结构物总测点个数。' style={{ width: "calc(50% - 8px)", height: "100%", }}>
                      <div style={{ height: '100%', fontFamily: 'SourceHanSansCN-Regular', fontWeight: 400, fontSize: 14, }}>
                         <div style={{ display: "flex", background: '#F6F9FF', height: 40, alignItems: 'center' }}>
                            <div style={{ textAlign: 'center', width: '33%' }}>结构物</div>
@@ -415,33 +428,33 @@ divHeight={"100%"} divId={"chart"}/>
                            <div style={{ textAlign: 'center', width: '33%' }}>中断个数</div>
                         </div>
                         <div id="interrupt" style={{ position: 'relative', height: clientHeight * 0.55 - 170 }}>
-                        <AutoRollComponent content={ <>
-                           {InterruptRank?.map((c, index) => {
-                              let title
-                              if (c.offline) {
-                                 if (c.offline >= 1440 && Math.floor(c.offline / 1440)) title = Math.floor(c.offline / 1440) + "天"
-                                 if ((c.offline % 1440) >= 60 && Math.floor(c.offline % 1440 / 60)) {
-                                    if (title) {
-                                       title = title + Math.floor(c.offline % 1440 / 60) + "时"
-                                    } else {
-                                       title = Math.floor(c.offline % 1440 / 60) + "时"
+                           <AutoRollComponent content={<>
+                              {InterruptRank?.map((c, index) => {
+                                 let title
+                                 if (c.offline) {
+                                    if (c.offline >= 1440 && Math.floor(c.offline / 1440)) title = Math.floor(c.offline / 1440) + "天"
+                                    if ((c.offline % 1440) >= 60 && Math.floor(c.offline % 1440 / 60)) {
+                                       if (title) {
+                                          title = title + Math.floor(c.offline % 1440 / 60) + "时"
+                                       } else {
+                                          title = Math.floor(c.offline % 1440 / 60) + "时"
+                                       }
                                     }
-                                 }
-                                 if (c.offline % 1440 % 60) {
-                                    if (title) {
-                                       title = title + c.offline % 1440 % 60 + "分"
-                                    } else {
-                                       title = c.offline % 1440 % 60 + "分"
+                                    if (c.offline % 1440 % 60) {
+                                       if (title) {
+                                          title = title + c.offline % 1440 % 60 + "分"
+                                       } else {
+                                          title = c.offline % 1440 % 60 + "分"
+                                       }
                                     }
                                  }
-                              }
-                              return <div style={{ display: "flex", background: index % 2 == 1 ? "#F6F9FF" : '', height: 40, alignItems: 'center' }}>
-                                 <div style={{ textAlign: 'center', width: '33%', fontFamily: 'SourceHanSansCN-Regular', color: '#2C66F3', fontWeight: 400 }}>{c.name}</div>
-                                 <div style={{ textAlign: 'center', width: '33%' }}>{title}</div>
-                                 <div style={{ textAlign: 'center', width: '33%', fontFamily: 'SourceHanSansCN-Regular', color: '#F33B3B', fontWeight: 400 }}>{c.offnum + '/' + c.totnum}</div>
-                              </div>
-                           })}</> } containerStyle={{ position: "relative", height: "85%", }}
-                           divHeight={"100%"} divId={"chart"}/>
+                                 return <div style={{ display: "flex", background: index % 2 == 1 ? "#F6F9FF" : '', height: 40, alignItems: 'center' }}>
+                                    <div style={{ textAlign: 'center', width: '33%', fontFamily: 'SourceHanSansCN-Regular', color: '#2C66F3', fontWeight: 400 }}>{c.name}</div>
+                                    <div style={{ textAlign: 'center', width: '33%' }}>{title}</div>
+                                    <div style={{ textAlign: 'center', width: '33%', fontFamily: 'SourceHanSansCN-Regular', color: '#F33B3B', fontWeight: 400 }}>{c.offnum + '/' + c.totnum}</div>
+                                 </div>
+                              })}</>} containerStyle={{ position: "relative", height: "85%", }}
+                              divHeight={"100%"} divId={"chart"} />
                         </div>
                      </div>
                   </Card>

web/client/src/sections/projectGroup/containers/statistic.jsx

@@ -1,23 +1,35 @@
 import React, { useEffect, useRef, useState } from 'react';
 import { connect } from 'react-redux';
 import { Skeleton, Button, Pagination, Form, Popconfirm, Table, Tooltip } from '@douyinfe/semi-ui';
+import { push } from 'react-router-redux';
 import { SkeletonScreen, } from "$components";
 import Header from '../components/header';
 import Body from '../components/body'
 import Card from '../components/card'
 import '../style.less'
 
-
-const Statistic = ({ dispatch, actions, user, history, loading, groupStatistic, clientHeight }) => {
+const Statistic = (props) => {
+   const { dispatch, actions, user, history, loading, groupStatistic, clientHeight, ...restProps } = props
    const { projectGroup } = actions;
-
    const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息
+   const [queryUserId, setQueryUserId] = useState('')
 
+   const getQueryUserId = () => {
+      let search = restProps?.location?.search || '';
+      let params = new URLSearchParams(search);
+      let userId = params.get('pomsU')
+      setQueryUserId(userId)
+      return userId
+   }
    useEffect(() => {
-      dispatch(projectGroup.groupStatistic())
-
+      let userId = getQueryUserId()
+      dispatch(projectGroup.groupStatistic({ userId }))
+      setQueryUserId(userId)
    }, [])
 
+   useEffect(() => {
+      getQueryUserId()
+   }, [restProps?.location])
 
    let columns = [
       {
@@ -29,22 +41,24 @@ const Statistic = ({ dispatch, actions, user, history, loading, groupStatistic,
             //将每个人最后观看项目集大屏的id储存起来，以便下次直接跳转到大屏
             let projectGroup = JSON.parse(localStorage.getItem('project_group'))
             if (!projectGroup) {
-               localStorage.setItem('project_group', JSON.stringify([{ userId: user?.id, projectGroupId: row?.id, name: row?.name }]))
+               localStorage.setItem('project_group', JSON.stringify([{ userId: user?.id || queryUserId, projectGroupId: row?.id, name: row?.name }]))
             } else {
-               let findOne = projectGroup?.find(v => v.userId == user?.id)
+               let findOne = projectGroup?.find(v => v.userId == queryUserId)
                if (findOne) {
                   projectGroup?.forEach(v => {
-                     if (v.userId == user?.id) {
+                     if (v.userId == queryUserId) {
                         v.projectGroupId = row?.id
                         v.name = row?.name
                      }
                   })
                } else {
-                  projectGroup.push({ userId: user?.id, projectGroupId: row?.id, name: row?.name })
+                  projectGroup.push({ userId: queryUserId, projectGroupId: row?.id, name: row?.name })
                }
                localStorage.setItem('project_group', JSON.stringify(projectGroup))
             }
-            history.push({ pathname: `/projectGroup/bigscreen`, })
+
+            dispatch(push(`/projectGroup/bigscreen?pomsPG=${row?.id}&pomsU=${queryUserId}`))
+
          }}>{text}</div>
       }, {
          title: '项目集类型',
@@ -111,7 +125,7 @@ const Statistic = ({ dispatch, actions, user, history, loading, groupStatistic,
 
    return (
       <div className='project-group'>
-         <Header />
+         <Header  {...props} />
          <Body>
             <Card title="重点项目集">
                <div style={{

web/client/src/sections/projectGroup/routes.js

@@ -1,20 +1,23 @@
 import { Statistic, Bigscreen } from './containers';
 
-export default [{
-   type: 'outer',
-   route: {
-      path: '/projectGroup/statistic',
-      key: 'projectGroup',
-      breadcrumb: '项目集',
-      component: Statistic,
+export default [
+   {
+      type: 'outer',
+      route: {
+         path: '/projectGroup/statistic',
+         key: 'projectGroup',
+         breadcrumb: '项目集',
+         component: Statistic,
+         exact: false
+      }
+   }, {
+      type: 'outer',
+      route: {
+         path: '/projectGroup/bigscreen',
+         key: 'bigscreen',
+         breadcrumb: '数据大屏 ',
+         component: Bigscreen,
+         // exact: false
+      }
    }
-}, {
-   type: 'outer',
-   route: {
-      path: '/projectGroup/bigscreen',
-      key: 'bigscreen',
-      breadcrumb: '数据大屏 ',
-      component: Bigscreen,
-   }
-}
 ];