Skip to content

S
station-elec-manage-view
Commit c70e7589 authored by 王海涛's avatar 王海涛
Browse files
Options

安全监管

parent b51f9267
Hide whitespace changes
Inline Side-by-side
Showing with 465 additions and 132 deletions
src/routes/view.js
View file @ c70e7589
......@@ -4,6 +4,8 @@ import Duty from '../view/monitor/duty';
import Situation from '../view/biz/duty/situation';
import SituationDetail from '../view/biz/duty/situationDetail';
import Bills from '../view/biz/regulate/bills';
import Supervise from '../view/biz/regulate/supervise';
import Firecontrol from '../view/biz/regulate/firecontrol';
import RootBizView from './../view/biz/index';
import EmptyPage from './../view/common/emptyPage/EmptyPage';
import SafetyManage from './../view/monitor/duty/safetyManage/index';
......@@ -33,6 +35,8 @@ const Routes = {
//安全监管
regulate: Duty,
bills: Bills,
supervise: Supervise,
firecontrol: Firecontrol,
fireMaterial: FireMaterial,
fireVehicle: FireVehicle,
stationFireMan: StationFireMan,
......@@ -49,6 +53,8 @@ export const businessRouts = [
{ path: 'situation',group: 'biz',component: Situation, childRoutes: [] },
{ path: 'situationDetail',group: 'biz',component: SituationDetail, childRoutes: [] },
{ path: 'bills',group: 'biz',component: Bills, childRoutes: [] },
{ path: 'supervise',group: 'biz',component: Supervise, childRoutes: [] },
{ path: 'firecontrol',group: 'biz',component: Firecontrol, childRoutes: [] },
{ path: 'safetyTraining',group: 'biz',component: SafetyManage, childRoutes: [] },
{ path: 'dailyTrain',group: 'biz',component: DaliyTraining, childRoutes: [] },
{ path: 'equipmentMaintain',group: 'biz',component: EquipmentMaintain, childRoutes: [] },
......
src/styles/view/disaster/index.scss
View file @ c70e7589
@function vw($px) {
@return ($px/ 1920) * 100vw;
}
.demo {
text-align: center;
background-image: url('../../../assets/images/index_bg.png');
......@@ -8,7 +11,7 @@
opacity:1;
height: 100vh;
width: 100vw;
padding-top: 12px;
padding-top: vw(40);
color: white;
}
}
......@@ -16,7 +19,7 @@
.layout {
display: flex;
justify-content: center;
padding: 0 39px;
padding: 0 vw(39);
.left {
flex: 1;
......@@ -30,7 +33,7 @@
display: flex;
align-items: center;
padding: 0 9px 0 12px;
font-size: 0.2rem;
font-size: 20px;
position: relative;
.current {
......@@ -42,7 +45,7 @@
}
.current-name {
margin-left: 4%;
margin-left: vw(18);
height: 41px;
line-height: 41px;
text-align: left;
......@@ -66,7 +69,7 @@
padding: 0;
.amos-tabs-tabitem:nth-of-type(2n) {
margin-left: 17px;
margin-left: vw(17);
}
.amos-tabs-tabitem-active {
border: 1px solid rgba(95,255,253,1);
......@@ -78,14 +81,14 @@
}
}
.amos-tabs-tabitem {
width: 183px;
width: vw(183);
height: 31px;
.amos-tabs-tabitem-inner:hover {
background-color: transparent;
}
.amos-tabs-tabitem-inner {
height: 30px;
width: 181px;
width: vw(181);
background-image: url('../../../assets/images/title_bg.png');
background-size: cover;
......@@ -133,15 +136,15 @@
.text-bg {
border: 0;
background: rgba(0,0,0,0.57);
width: 188px;
width: vw(188);
z-index: 999;
margin-right: 28px;
margin-right: vw(28);
.title-bg {
transform: skewX(2deg);
background-image: url('../../../assets/images/title_bg.png');
background-size: cover;
height: 31px;
width: 188px;
width: vw(188);
font-size: 20px;
font-family: Microsoft YaHei;
font-weight: 400;
......@@ -159,7 +162,7 @@
height: 36vh;
border: 1px solid rgba(95,255,253,1);
background: linear-gradient(180deg,rgba(0,0,0,0.57) 0%,rgba(12,181,213,0.1) 100%);
padding: 27px 26px 29px 41px;
padding: 27px vw(26) 29px vw(41);
font-size: 20px;
.contact {
......@@ -218,13 +221,13 @@
}
.device-name {
margin-left: 33px;
margin-left: vw(33);
}
.device-des {
margin-right: 0;
position: absolute;
right: 28px;
right: vw(28);
}
}
......@@ -237,11 +240,11 @@
display: flex;
justify-content: space-between;
align-items: center;
font-size: 20px;
font-size: 0.2rem;
margin-bottom: 6px;
.dec {
padding-left: 16px;
padding-left: vw(16);
text-align: left;
width: 65%;
height: 35px;
......@@ -251,7 +254,7 @@
}
.deco {
padding-left: 16px;
padding-left: vw(16);
text-align: left;
width: 65%;
height: 35px;
......@@ -288,16 +291,16 @@
}
.amos-tabs-tabitem {
width: 183px;
width: vw(183);
height: 31px;
margin-right: 28px;
margin-right: vw(28);
.amos-tabs-tabitem-inner:hover {
background-color: transparent;
}
.amos-tabs-tabitem-inner {
height: 30px;
width: 181px;
width: vw(181);
background-image: url('../../../assets/images/title_bg.png');
background-size: cover;
......@@ -315,7 +318,7 @@
.title-bg {
transform: skewX(2deg);
margin-right: 28px;
margin-right: vw(28);
background-image: url('../../../assets/images/title_bg.png');
background-size: cover;
height: 31px;
......@@ -373,7 +376,7 @@
.desc {
padding-top: 17px;
font-size: 35px;
font-size: 0.35rem;
font-family: Microsoft YaHei UI;
font-weight: 400;
line-height: 40px;
......@@ -392,18 +395,23 @@
display: flex;
justify-content: center;
align-items: center;
height:110px;
height: 10vh;
width: 100%;
background:rgba(82,237,242,0.1);
box-shadow: 0px 3px 6px rgba(0,0,0,0.16);
font-size: 0.2rem;
.bg-style {
background: rgba(0,185,255,0.59) !important;
}
.to-left{
position: absolute;
left: 0;
width: 60px;
height: 109px;
height: 10vh;
background: rgba(82,237,242,0.1);
line-height: 109px;
line-height: 10vh;
cursor: pointer;
}
......@@ -411,36 +419,49 @@
position: absolute;
right: 0;
width: 60px;
height: 109px;
height: 10vh;
background: rgba(82,237,242,0.1);
line-height: 109px;
line-height: 10vh;
cursor: pointer;
}
.plan {
background: rgba(82,237,242,0.1);
padding-top: 19px;
width: 188px;
height: 110px;
padding-top: 2vh;
width: vw(188);
height: 10vh;
margin-left: 4px;
cursor: pointer;
.img-style {
display: inline-block;
width: vw(40);
height: vw(40);
}
.img-styles {
display: inline-block;
width: vw(118);
height: 6vh;
}
.plan-text {
margin-top: 9px;
font-size: 20px;
margin-top: 5px;
}
}
.three {
background:rgba(82,237,242,0.1);
padding-top: 19px;
width: 110px;
height: 110px;
padding-top: 1.5vh;
width: 10vh;
height: 10vh;
margin-left: 4px;
cursor: pointer;
.plan-text {
margin-top: 9px;
margin-top: 5px;
}
}
}
......@@ -459,29 +480,7 @@
height: 82.5vh;
}
.slick-list {
height: 68vh;
}
.slick-dots {
height: 110px;
margin-bottom: -140px;
background:rgba(82,237,242,0.1);
box-shadow:0px 3px 6px rgba(0,0,0,0.16);
li {
button {
width:188px;
height:110px;
background:rgba(82,237,242,0.1);
box-shadow:0px 3px 6px rgba(0,0,0,0.16);
border-radius: 0;
}
}
.slick-active {
background:rgba(0,185,255,0.59);
}
}
.history {
margin: 0 auto;
......@@ -489,7 +488,7 @@
.desc {
padding-top: 17px;
font-size: 35px;
font-size: 0.35rem;
font-family: Microsoft YaHei UI;
font-weight: 400;
line-height: 40px;
......@@ -497,73 +496,7 @@
}
}
.miao_bg {
background-image: url('../../../assets/images/miao_bg.png');
background-size: cover;
height: 66vh;
}
.right-bottom {
bottom: 0;
position: absolute;
display: flex;
justify-content: center;
align-items: center;
height:110px;
width: 100%;
background:rgba(82,237,242,0.1);
box-shadow: 0px 3px 6px rgba(0,0,0,0.16);
.bg-style {
background: rgba(0,185,255,0.59) !important;
}
.to-left{
position: absolute;
left: 0;
width: 60px;
height: 109px;
background: rgba(82,237,242,0.1);
line-height: 109px;
cursor: pointer;
}
.to-right {
position: absolute;
right: 0;
width: 60px;
height: 109px;
background: rgba(82,237,242,0.1);
line-height: 109px;
cursor: pointer;
}
.plan {
background: rgba(82,237,242,0.1);
padding-top: 19px;
width: 188px;
height: 110px;
margin-left: 4px;
cursor: pointer;
.plan-text {
margin-top: 9px;
font-size: 20px;
}
}
.three {
background:rgba(82,237,242,0.1);
padding-top: 19px;
width: 110px;
height: 110px;
margin-left: 4px;
cursor: pointer;
.plan-text {
margin-top: 9px;
}
}
}
}
}
}
src/view/biz/emergency/disaster/DisasterContents.js
View file @ c70e7589
......@@ -24,7 +24,7 @@ class DisasterContents extends Component {
const ImgSwitch = (props) => {
return (
<div className={`plan ${props.contentSwitch === props.flag ? 'bg-style' : null}`} onClick={() => props.handleChange(props.flag)}>
<img src={props.imgSrc} alt="" height='40' width='40' />
<img className="img-style" src={props.imgSrc} alt="" />
<div className="plan-text">{props.text}</div>
</div>
);
......@@ -61,4 +61,4 @@ DisasterContents.propTypes = {
handleChange: PropTypes.func
};
export default DisasterContents;
\ No newline at end of file
export default DisasterContents;
src/view/biz/emergency/disaster/PaperContents.js
View file @ c70e7589
......@@ -26,7 +26,7 @@ class PaperContents extends Component {
const ImgSwitch = (props) => {
return (
<div className={`plan ${props.paperSwitch === props.flag ? 'bg-style' : null}`} onClick={() => props.handleChange(props.flag)}>
<img src={props.imgSrc} alt="" height='65' width='118' />
<img className="img-styles" src={props.imgSrc} alt="" height='65' width='118' />
</div>
);
};
......@@ -66,4 +66,4 @@ PaperContents.propTypes = {
handleToRight: PropTypes.func
};
export default PaperContents;
\ No newline at end of file
export default PaperContents;
src/view/biz/emergency/disaster/index.js
View file @ c70e7589
......@@ -10,7 +10,6 @@ import SwitchInfo from './SwitchInfo';
import DisasterContents from './DisasterContents';
import PaperContents from './PaperContents';
import ModelContents from './ModelContents';
import { disasterData, deviceData, contactData, detailData } from '../../../../../_mock/apps';
const { TabList, Tab, TabPanel } = Tabs;
......@@ -128,7 +127,6 @@ class DisasterSituation extends React.Component {
}
render() {
console.log(disasterData);
const { flag, switchFlag, disasterInfo = {}, contactInfo = [], deviceInfo = [], deviceData = [], contentSwitch, paperSwitch, modelSwitch } = this.state;
return (
<div className="demo">
......
src/view/biz/regulate/firecontrol/index.js 0 → 100644
View file @ c70e7589
import React, { Component } from 'react';
import PropTypes from 'prop-types';
/**
* firecontrol
*消防整改
* @class Firecontrol
* @extends {Component}
*/
class Firecontrol extends Component {
constructor(props) {
super(props);
this.state = {};
}
componentWillMount() {}
componentDidMount() {}
componentWillUnmount() {}
render() {
return <div>消防整改</div>;
}
}
Firecontrol.propTypes = {};
export default Firecontrol;
src/view/biz/regulate/supervise/index.js 0 → 100644
View file @ c70e7589
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Input, Select, Table, Button } from 'amos-antd';
import CommonContainer from './../../../common/commonContainer';
import './supervise.scss';
const Search = Input.Search;
const Option = Select.Option;
/**
* Supervise
*监督管理
* @class Supervise
* @extends {Component}
*/
class Supervise extends Component {
constructor(props) {
super(props);
this.state = {
detailVisible: false,
safeData: [{
station: '复龙换流站',
fireDisaster: '0',
fireDisaster1: '0',
fireDisaster2: '0',
fireDisaster3: '0',
fireDisaster4: '0',
fireDisaster5: '0',
fireDisaster6: '0',
fireDisaster7: '0',
fireDisaster8: '0',
fireDisaster9: '0',
fireDisaster10: '0',
fireDisaster11: '0',
fireDisaster12: '0',
fireDisaster13: '0',
fireDisaster14: '0',
fireDisaster15: '0',
fireDisaster16: '0'
}]
};
}
componentWillMount() {}
componentDidMount() {}
componentWillUnmount() {}
handleDetail = (text) => {
console.log(text);
this.setState({ detailVisible: true });
}
render() {
const { detailVisible } = this.state;
const columns = [
{
title: '换流站',
dataIndex: 'station',
key: 'station',
width: 200
},
{
title: '告警',
dataIndex: 'alert',
key: 'alert',
children: [
{
title: '火灾',
dataIndex: 'fireDisaster',
key: 'fireDisaster'
},
{
title: '故障',
dataIndex: 'fireDisaster1',
key: 'fireDisaster1'
},
{
title: '巡检',
dataIndex: 'fireDisaster2',
key: 'fireDisaster2'
},
{
title: '同比/环比',
dataIndex: 'fireDisaster3',
key: 'fireDisaster3'
}
]
},
{
title: '风险',
dataIndex: 'alert',
key: 'alert',
children: [
{
title: '一级',
dataIndex: 'fireDisaster4',
key: 'fireDisaster4'
},
{
title: '二级',
dataIndex: 'fireDisaster5',
key: 'fireDisaster5'
},
{
title: '三级',
dataIndex: 'fireDisaster6',
key: 'fireDisaster6'
},
{
title: '四级',
dataIndex: 'fireDisaster7',
key: 'fireDisaster7'
},
{
title: '同比/环比',
dataIndex: 'fireDisaster8',
key: 'fireDisaster8'
}
]
},
{
title: '隐患',
dataIndex: 'alert',
key: 'alert',
children: [
{
title: '发现',
dataIndex: 'fireDisaster9',
key: 'fireDisaster9'
},
{
title: '治理',
dataIndex: 'fireDisaster10',
key: 'fireDisaster10'
},
{
title: '未治理',
dataIndex: 'fireDisaster11',
key: 'fireDisaster11'
},
{
title: '同比/环比',
dataIndex: 'fireDisaster12',
key: 'fireDisaster12'
}
]
},
{
title: '消防安全',
dataIndex: 'alert',
key: 'alert',
children: [
{
title: '培训',
dataIndex: 'fireDisaster13',
key: 'fireDisaster13'
},
{
title: '训练',
dataIndex: 'fireDisaster14',
key: 'fireDisaster14'
},
{
title: '器材保养',
dataIndex: 'fireDisaster15',
key: 'fireDisaster15'
},
{
title: '应急预案',
dataIndex: 'fireDisaster16',
key: 'fireDisaster16'
}
]
},
{
title: '操作',
width: 135,
render: (text,record) => {
return <Button onClick={() => this.handleDetail(text)}>生成表单</Button>;
}
}
];
return (
<div className="sefety-bg">
<CommonContainer>
<div className="search-bg">
<div className="search">
<Select defaultValue="0" style={{ width: 120 }}>
<Option value="0">全部</Option>
<Option value="disabled" disabled>Disabled</Option>
<Option value="Yiminghe">yiminghe</Option>
</Select>
<Search
style={{ width: 200 }}
onSearch={value => console.log(value)}
/>
<span className="score">
<span>安全</span>：指数=90
<span>风险</span>：60指数90
<span>高风险</span>：指数=60
</span>
</div>
</div>
<div className="safety-table">
<Table
columns={columns}
dataSource={this.state.safeData}
/>
</div>
</CommonContainer>
<div className="safe-detail" style={{ display: !detailVisible ? 'none' : 'block' }}>
<div className="detail-title">
<div>安全隐患登记单</div>
<div>
<div>保存</div>
<div>关闭</div>
</div>
</div>
</div>
</div>
);
}
}
Supervise.propTypes = {};
export default Supervise;
src/view/biz/regulate/supervise/supervise.scss 0 → 100644
View file @ c70e7589
@function vw($px) {
@return ($px/ 1920) * 100vw;
}
@function vh($px) {
@return ($px/ 1080) * 100vh;
}
.sefety-bg {
width: vw(1860);
height: vh(977);
margin: vh(19) auto;
position: relative;
.search-bg {
height: vh(89);
background: rgba(0, 35, 51, 1);
.search {
position: relative;
display: flex;
justify-content: center;
align-items: center;
padding-top: vh(25);
.score {
position: absolute;
right: vw(61);
color: white;
font-size: 0.18rem;
}
.ant-select-selection {
background-color: rgba(0, 185, 255, 0.3);
border-bottom-left-radius: 16px;
border-top-left-radius: 16px;
border: 0;
color: white;
font-size: 0.16rem;
}
.ant-input {
background-color: rgba(0, 185, 255, 0.3);
border-top-right-radius: 16px;
border-bottom-right-radius: 16px;
font-size: 0.16rem;
color: white;
border: 0;
line-height: 16px;
}
}
}
.safety-table {
.ant-table-thead {
tr {
th {
font-size: 0.2rem !important;
font-weight: bold;
background: rgba(0, 185, 255, 0.38);
}
}
}
}
.safe-detail {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: hidden;
outline: 0;
-webkit-overflow-scrolling: touch;
background-color: white;
filter: alpha(opacity=60);
z-index: 9999;
.detail-title {
width: 100vw;
background-color: linear-gradient(90deg,rgba(82,237,242,0.1) 0%,rgba(28,98,100,0.31) 100%);
height: vh(42);
display: flex;
justify-content: space-between;
}
}
}
src/view/common/commonContainer/index.js 0 → 100644
View file @ c70e7589
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import './index.scss';
class CommonContainer extends Component {
constructor(props) {
super(props);
}
render() {
return (
<div className="common-container">
{this.props.children}
<div className="card-corner" />
</div>
);
}
}
CommonContainer.propTypes = {
children: PropTypes.node
};
export default CommonContainer;
src/view/common/commonContainer/index.scss 0 → 100644
View file @ c70e7589
@function vw($px) {
@return ($px/ 1920) * 100vw;
}
@function vh($px) {
@return ($px/ 1080) * 100vh;
}
.common-container {
position: relative;
width: 100%;
height: 100%;
border: 1px solid rgba( 95, 255, 253, 1);
background: linear-gradient(180deg,rgba(0,0,0,0.57) 0%,rgba(12,181,213,0.1) 100%);
.card-corner {
position: absolute;
right: 0;
bottom: 0;
width: 12px;
height: 12px;
border-right: 2px solid rgba(0,255,229,1);
border-bottom: 2px solid rgba(0,255,229,1);
}
}
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 to comment