Skip to content

html / MeteorologicalBureau

Go to a project
Commit 194cbd56 by hanjixin
Options

dev

parents 54d9d033 84192c13
Showing with 244 additions and 24 deletions
admin/src/router/modules/contents.js
...@@ -19,12 +19,12 @@ const contentsRouter = { ...@@ -19,12 +19,12 @@ const contentsRouter = {
name: 'title', name: 'title',
meta: { title: '系统标题' } meta: { title: '系统标题' }
}, },
{ // {
path: 'type', // path: 'type',
component: () => import('@/views/contents/eventMonitor'), // component: () => import('@/views/contents/eventMonitor'),
name: 'eventMonitor', // name: 'eventMonitor',
meta: { title: '事件监控' } // meta: { title: '事件监控' }
}, // },
{ {
path: 'introductionWarning', path: 'introductionWarning',
component: view, component: view,
......
dva/src/components/Nav.js
...@@ -30,6 +30,9 @@ const Nav = (props) => { ...@@ -30,6 +30,9 @@ const Nav = (props) => {
setShow(false) setShow(false)
window.location.reload(true) window.location.reload(true)
} }
function cancel() {
setShow(false)
}
return ( return (
<div className="layout-nav"> <div className="layout-nav">
...@@ -42,7 +45,7 @@ const Nav = (props) => { ...@@ -42,7 +45,7 @@ const Nav = (props) => {
<div className="time" onClick={() => { <div className="time" onClick={() => {
setShow(true) setShow(true)
}}>{time}</div> }}>{time}</div>
{show && <div className="modal-container"> {show && <div className="modal-container animated fadeIn">
<div className="modal-content"> <div className="modal-content">
<span>OSC地址</span> <span>OSC地址</span>
<input type="text" onChange={(e) => { <input type="text" onChange={(e) => {
...@@ -58,6 +61,12 @@ const Nav = (props) => { ...@@ -58,6 +61,12 @@ const Nav = (props) => {
</div> </div>
<div> <div>
<button className="modal-btn" onClick={submit}>确认</button> <button className="modal-btn" onClick={submit}>确认</button>
&nbsp;
&nbsp;
&nbsp;
&nbsp;
&nbsp;
<button className="modal-btn" onClick={cancel}>取消</button>
</div> </div>
</div>} </div>}
......
dva/src/router/connfig.js
...@@ -11,6 +11,7 @@ import informationService from '../routes/informationCenter/informationService' ...@@ -11,6 +11,7 @@ import informationService from '../routes/informationCenter/informationService'
// import CityDetail from '../routes/province/CityDetail' // import CityDetail from '../routes/province/CityDetail'
import IntroductionWarning from '../routes/IntroductionWarning/Index' import IntroductionWarning from '../routes/IntroductionWarning/Index'
import warningAndPublication from '../routes/IntroductionWarning/warningAndPublication' import warningAndPublication from '../routes/IntroductionWarning/warningAndPublication'
import warningAndPublicationBefit from '../routes/IntroductionWarning/warningAndPublicationBefit'
import eventMonitor from '../routes/eventMonitor/Index' import eventMonitor from '../routes/eventMonitor/Index'
import VisitingScene from '../routes/VisitingScene/Index' import VisitingScene from '../routes/VisitingScene/Index'
import ue4 from '../routes/ue4/Index' import ue4 from '../routes/ue4/Index'
...@@ -88,6 +89,7 @@ export default [ ...@@ -88,6 +89,7 @@ export default [
{ {
path: '/informationCenter/CenterIntroduction', path: '/informationCenter/CenterIntroduction',
component: CenterIntroduction, component: CenterIntroduction,
name: '中心介绍',
meta: { meta: {
vPath: '/首页/信息中心/中心介绍' vPath: '/首页/信息中心/中心介绍'
} }
...@@ -95,6 +97,7 @@ export default [ ...@@ -95,6 +97,7 @@ export default [
{ {
path: '/informationCenter/informationService', path: '/informationCenter/informationService',
component: informationService, component: informationService,
name: '信息服务',
meta: { meta: {
vPath: '/首页/信息中心/信息服务' vPath: '/首页/信息中心/信息服务'
} }
...@@ -102,6 +105,7 @@ export default [ ...@@ -102,6 +105,7 @@ export default [
{ {
path: '/informationCenter/Video', path: '/informationCenter/Video',
component: Video, component: Video,
name: '宣传视频',
meta: { meta: {
vPath: '/首页/信息中心/宣传视频' vPath: '/首页/信息中心/宣传视频'
} }
...@@ -124,6 +128,14 @@ export default [ ...@@ -124,6 +128,14 @@ export default [
meta: { meta: {
vPath: '' vPath: ''
} }
},
{
path: '/introductionWarning/warningAndPublicationBefit',
component: warningAndPublicationBefit,
name: '预警发布服务效益',
meta: {
vPath: ''
}
} }
] ]
}, },
......
dva/src/routes/IntroductionWarning/Index.js
...@@ -18,7 +18,9 @@ function IntroductionWarning(props) { ...@@ -18,7 +18,9 @@ function IntroductionWarning(props) {
<div className="common-btn one" onClick={() => { }}> <div className="common-btn one" onClick={() => { }}>
预警信息全流程 预警信息全流程
</div> </div>
<div className="common-btn one" onClick={() => { }}> <div className="common-btn one" onClick={() => {
props.history.push('/introductionWarning/warningAndPublicationBefit')
}}>
预警发布服务效益 预警发布服务效益
</div> </div>
<div className="common-btn one" onClick={() => { }}> <div className="common-btn one" onClick={() => { }}>
......
dva/src/routes/IntroductionWarning/warningAndPublicationBefit.js 0 → 100644
import React, { useState } from 'react';
import { connect } from 'dva';
import './index.less';
import Layout from '@/components/Layout.js'
import { send } from '@/services/ctr'
import { getBenefitList } from '@/services/api'
function IntroductionWarning(props) {
const [videoList, setVideoList] = useState([])
const [active, setActive] = useState(null)
if (!videoList.length) {
getBenefitList().then(res => {
console.log(res.data.list)
setVideoList(res.data.list)
})
}
return (
<Layout>
<div className="warmingCenter-content animated fadeIn">
<div className="common-btn-container">
{videoList.map((item, index) => {
return <div className={active !== index ? "common-btn" : "common-btn common-btn-active"} key={item.url} onClick={() => {
setActive(index)
send('/首页/预警介绍/预警发布服务效益', ['' + index])
}}>
{item.title}
</div>
})}
</div>
<div className="common-btn-back" onClick={() => {
props.history.go(-1)
}}></div>
</div>
</Layout>
);
}
IntroductionWarning.propTypes = {
};
export default connect()(IntroductionWarning);
dva/src/routes/informationCenter/Video.css 0 → 100644
.video-container {
height: 500px;
overflow: sroll;
width: 800px;
}
.video-container .video-list {
text-align: left;
padding-left: 50px;
}
.video-container .video-list .video-list-item {
position: relative;
font-size: 14px;
color: #d0d5d9;
text-overflow: ellipsis;
margin-bottom: 20px;
display: flex;
align-items: center;
height: 34px;
}
.video-container .video-list .video-list-item .play {
display: none;
width: 36px;
height: 34px;
background: url(../../assets/img/play.png) no-repeat center;
background-size: contain;
}
.video-container .video-list .video-list-item::after {
content: "";
position: absolute;
left: -20px;
top: 13px;
width: 1.5px;
background-color: #707b8b;
height: 70px;
}
.video-container .video-list .video-list-item::before {
content: "";
position: absolute;
left: -23px;
top: 13px;
width: 7px;
background-color: #707b8b;
height: 7px;
border-radius: 50%;
}
.video-container .video-list .video-list-item:last-child::after {
height: 0;
}
.video-container .video-list .video-list-item-active {
font-size: 17px;
color: white;
}
.video-container .video-list .video-list-item-active::before {
content: "";
left: -25px;
top: 13px;
width: 11px;
background-color: white;
height: 11px;
z-index: 10;
}
.video-container .video-list .video-list-item-active .play {
display: block;
}
.video-container .video-list .video-list-item-active .pause {
background-image: url(../../assets/img/pause.png);
}
dva/src/routes/informationCenter/Video.js
import React, { useState, useEffect } from 'react'; import React, { useState } from 'react';
import { connect } from 'dva'; import { connect } from 'dva';
import './index.less'; import './Video.less';
import Layout from '@/components/Layout.js' import Layout from '@/components/Layout.js'
import { send } from '@/services/ctr' import { send } from '@/services/ctr'
import { getVideoList } from '@/services/api' import { getVideoList } from '@/services/api'
...@@ -8,10 +8,9 @@ import { getVideoList } from '@/services/api' ...@@ -8,10 +8,9 @@ import { getVideoList } from '@/services/api'
function CenterIntroduction(props) { function CenterIntroduction(props) {
// send('/首页/信息中心/宣传视频', []) // send('/首页/信息中心/宣传视频', [])
const [videoList, setVideoList] = useState([]) const [videoList, setVideoList] = useState([])
useEffect(function() { const [active, setActive] = useState(null)
const [isActive, setIsActive] = useState(false)
}) if (!videoList.length) {
if(!videoList.length) {
getVideoList().then(res => { getVideoList().then(res => {
console.log(res.data.list) console.log(res.data.list)
setVideoList(res.data.list) setVideoList(res.data.list)
...@@ -21,20 +20,23 @@ function CenterIntroduction(props) { ...@@ -21,20 +20,23 @@ function CenterIntroduction(props) {
return ( return (
<Layout> <Layout>
<div className="warmingCenter-content animated fadeIn"> <div className="warmingCenter-content animated fadeIn">
<div className="common-btn-container"> <div className="video-container">
<div className="video-list">
{videoList.map((item, index) => { {videoList.map((item, index) => {
return <div className="common-btn one" key={item.url} onClick={() => { return <div className={active !== index ? "video-list-item" : "video-list-item video-list-item-active"} key={item.url} onClick={() => {
send('/首页/信息中心/宣传视频', []) setActive(index)
setIsActive(!isActive)
send('/首页/信息中心/宣传视频', [''+ index])
}}> }}>
<div>
{item.title} {item.title}
</div> </div>
})} <div className={isActive ? 'play pause' : 'play'}>
<div className="common-btn one" onClick={() => {
send('/首页/信息中心/宣传视频', [])
}}>
视频1
</div> </div>
</div>
})}
</div>
</div> </div>
<div className="common-btn-back" onClick={() => { <div className="common-btn-back" onClick={() => {
......
dva/src/routes/informationCenter/Video.less 0 → 100644
.video-container {
height: 500px;
overflow: sroll;
width: 800px;
.video-list {
text-align: left;
padding-left: 50px;
.video-list-item {
position: relative;
font-size: 14px;
color: #d0d5d9;
text-overflow: ellipsis;
// overflow: hidden;
margin-bottom: 20px;
display: flex;
// justify-content: space-between;
align-items: center;
height: 34px;
.play {
display: none;
width: 36px;
height: 34px;
background: url(../../assets/img/play.png) no-repeat center;
background-size: contain;
}
&::after {
content: "";
position: absolute;
left: -20px;
top: 13px;
width: 1.5px;
background-color: #707b8b;
height: 70px;
}
&::before {
content: "";
position: absolute;
left: -23px;
top: 13px;
width: 7px;
background-color: #707b8b;
height: 7px;
border-radius: 50%;
}
&:last-child {
&::after {
height: 0;
}
}
}
.video-list-item-active {
font-size: 17px;
color: white;
&::before {
content: "";
left: -25px;
top: 13px;
width: 11px;
background-color: white;
height: 11px;
z-index: 10;
}
.play {
display: block;
}
.pause {
background-image: url(../../assets/img/pause.png);
}
}
}
}
\ No newline at end of file
dva/src/services/api.js
...@@ -24,3 +24,13 @@ export function getVideoList() { ...@@ -24,3 +24,13 @@ export function getVideoList() {
} }
}) })
} }
export function getBenefitList() {
return request({
method: 'get',
url: '/interior/get/benefit',
params: {
p: 1,
c: 1000
}
})
}
\ No newline at end of file
dva/src/utils/index.js
...@@ -39,11 +39,10 @@ export function checkState(history) { // 检查路由状态 与大屏保持同 ...@@ -39,11 +39,10 @@ export function checkState(history) { // 检查路由状态 与大屏保持同
// console.log(data, sendObj) // console.log(data, sendObj)
// window.sessionStorage.setItem('isUse', 'true') // window.sessionStorage.setItem('isUse', 'true')
if (data.route === sendObj.path || (data.route === '/首页/全国/预警信息综合监控平台' && sendObj.path.indexOf('/首页/全国') !== -1)) { if (data.route === sendObj.path || (data.route === '/首页/全国/预警信息综合监控平台' && sendObj.path.indexOf('/首页/全国') !== -1)) {
console.log('路由重复') // console.log('路由重复')
// window.sessionStorage.setItem('isUse', 'true') // window.sessionStorage.setItem('isUse', 'true')
} else { } else {
const result = filterRouter(data.route) const result = filterRouter(data.route)
console.log(result, 'result', window.location.hash.replace('#', '') !== result.path)
window.sessionStorage.removeItem('isUse') window.sessionStorage.removeItem('isUse')
if (result && window.location.hash.replace('#', '') !== result.path) { if (result && window.location.hash.replace('#', '') !== result.path) {
history.replace(result.path) history.replace(result.path)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment