Commit b51f9267 authored by 王海涛's avatar 王海涛

首页及日常值守样式优化

parent 4d1ac2ff
......@@ -42,4 +42,175 @@ export const recommends = () => {
});
};
const disasterData = () => {
return Mock.mock({
'disasterInfo': {
'time': '2020-4-9 10:30:34',
'area': '极1高端换流阀厅',
'part': '#3联络变',
'people': '16人',
'car': '3辆',
'emergency': '有'
}
});
};
const deviceData = () => {
return Mock.mock({
'deviceInfo': [
{
'title': '#3联络变', 'status': '已停止'
},
{
'title': '#1泡沫炮', 'status': '未启动'
},
{
'title': '#2泡沫炮', 'status': '已启动'
}
]
});
};
const contactData = () => {
return Mock.mock({
'contactInfo': [
{
'position': '值班长',
'name': '王丽泽熙',
'phone': '18300021232'
},
{
'position': '值班副长',
'name': '王丽泽熙',
'phone': '18300022345'
},
{
'position': '值班副长',
'name': '王丽泽熙',
'phone': '18300023215'
}
]
});
};
const detailData = () => {
return Mock.mock({
'detailInfo': [
{ 'name': '3#泡沫炮', 'value': '13L/s', 'id': 1 },
{ 'name': '1#消防水池', 'value': '1300mm', 'id': 2 },
{ 'name': '2#消防水池', 'value': '1300mm', 'id': 3 },
{ 'name': '红外火焰探测器', 'value': '50辆', 'id': 4 },
{ 'name': '消防器材', 'value': '20000件', 'id': 5 },
{ 'name': '红外火焰探测器', 'value': '50辆', 'id': 6 }
]
});
};
const recordData = () => {
return Mock.mock({
'disasterRecord': [
{ name: '伊克昭换流站换流变火灾', date: '2020-1-1', id: 1 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-2', id: 2 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-3', id: 3 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-4', id: 4 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-5', id: 5 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-6', id: 6 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-7', id: 7 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-8', id: 8 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-9', id: 9 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-10', id: 10 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-11', id: 11 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-12', id: 12 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-13', id: 13 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-14', id: 14 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-15', id: 15 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-16', id: 16 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-17', id: 117 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-18', id: 18 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-19', id: 19 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-20', id: 20 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-21', id: 21 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-22', id: 22 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-23', id: 23 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-24', id: 24 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-25', id: 25 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-26', id: 26 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-27', id: 27 },
{ name: '伊克昭换流站换流变火灾', date: '2020-1-28', id: 28 }
]
});
};
const planData = () => {
return Mock.mock({
'planData': [
{
title: '伊克昭换流站',
key: '1',
children: [
{ title: '应急预案-1', key: '1-1' },
{ title: '应急预案-2', key: '1-2' },
{ title: '应急预案-3', key: '1-3' },
{ title: '应急预案-4', key: '1-4' },
{ title: '应急预案-5', key: '1-5' },
{ title: '应急预案-6', key: '1-6' },
{ title: '应急预案-7', key: '1-7' },
{ title: '应急预案-8', key: '1-8' }
]
},
{
title: '复龙换流站',
key: '2',
children: [
{ title: '应急预案-1', key: '2-1' },
{ title: '应急预案-2', key: '2-2' },
{ title: '应急预案-3', key: '2-3' },
{ title: '应急预案-4', key: '2-4' },
{ title: '应急预案-5', key: '2-5' },
{ title: '应急预案-6', key: '2-6' },
{ title: '应急预案-7', key: '2-7' },
{ title: '应急预案-8', key: '2-8' }
]
},
{
title: '奉贤换流站',
key: '3',
children: [
{ title: '应急预案-1', key: '3-1' },
{ title: '应急预案-2', key: '3-2' },
{ title: '应急预案-3', key: '3-3' },
{ title: '应急预案-4', key: '3-4' },
{ title: '应急预案-5', key: '3-5' },
{ title: '应急预案-6', key: '3-6' },
{ title: '应急预案-7', key: '3-7' },
{ title: '应急预案-8', key: '3-8' }
]
},
{
title: '锦屏换流站',
key: '4',
children: [
{ title: '应急预案-1', key: '4-1' },
{ title: '应急预案-2', key: '4-2' },
{ title: '应急预案-3', key: '4-3' },
{ title: '应急预案-4', key: '4-4' },
{ title: '应急预案-5', key: '4-5' },
{ title: '应急预案-6', key: '4-6' },
{ title: '应急预案-7', key: '4-7' },
{ title: '应急预案-8', key: '4-8' }
]
},
]
});
};
// 输出结果
module.exports = {
disasterData,
deviceData,
contactData,
detailData,
recordData,
planData
};
......@@ -9,8 +9,23 @@
display: flex;
flex-direction: row;
justify-content: center;
.content-detail {
position: absolute;
top: 0;
right: 0;
color: rgb(89, 240, 251);
line-height: 60%;
text-align: center;
font-size: 22px;
width: 28px;
height: 28px;
background: linear-gradient(180deg,rgba(95,255,253,0.6) 0%,rgba(95,255,253,0.1) 100%);
cursor: pointer;
}
.common-margin{
margin-top: pxToRem(19px);
margin-top: pxToRem(29px);
}
.daily-title{
font-size:pxToRem(20px);
......@@ -29,6 +44,7 @@
flex-direction: column;
justify-content: space-around;
height: 100%;
.top-ten-item{
display: flex;
flex-direction: row;
......@@ -61,16 +77,17 @@
// background-image: url('../../assets/dailyDuties/leftTop.png');
background-repeat: no-repeat;
width:pxToRem(412px);
height:pxToRem(469px);
height:pxToRem(390px);
}
.growth-statistics-view{
// background-image: url('../../assets/dailyDuties/leftBottom.png');
background-repeat: no-repeat;
width:pxToRem(411px);
height:pxToRem(474px);
height:pxToRem(444px);
.growth-content{
padding:pxToRem(30px) pxToRem(24px);
height: 100%;
.growth-item-header{
font-size: pxToRem(20px);
color: #52EDF2;
......@@ -118,13 +135,14 @@
// background-image: url('../../assets/dailyDuties/middleTop.png');
background-repeat: no-repeat;
width:pxToRem(999px);
height:pxToRem(615px);
height:pxToRem(533px);
position: relative;
.statistics-banner{
position: absolute;
left:pxToRem(95px);
right: pxToRem(95px);
top:pxToRem(68px);
top: 3%;
display: flex;
flex-direction: row;
justify-content: space-between;
......@@ -175,7 +193,7 @@
// background-image: url('../../assets/dailyDuties/middleBottom.png');
background-repeat: no-repeat;
width:pxToRem(1002px);
height:pxToRem(325px);
height:pxToRem(289px);
position: relative;
.buttongroup-style{
position: absolute;
......@@ -201,13 +219,13 @@
// background-image: url('../../assets/dailyDuties/leftTop.png');
background-repeat: no-repeat;
width:pxToRem(412px);
height:pxToRem(469px);
height:pxToRem(390px);
}
.recent-statistics-view{
// background-image: url('../../assets/dailyDuties/rightBottom.png');
background-repeat: no-repeat;
width:pxToRem(411px);
height:pxToRem(474px);
height:pxToRem(444px);
position: relative;
.buttongroup-style{
position: absolute;
......
......@@ -30,7 +30,7 @@
display: flex;
align-items: center;
padding: 0 9px 0 12px;
font-size: 20px;
font-size: 0.2rem;
position: relative;
.current {
......@@ -64,7 +64,7 @@
height: 31px;
font-size: 20px;
padding: 0;
.amos-tabs-tabitem:nth-of-type(2n) {
margin-left: 17px;
}
......@@ -78,14 +78,14 @@
}
}
.amos-tabs-tabitem {
width: 44%;
height: 100%;
width: 183px;
height: 31px;
.amos-tabs-tabitem-inner:hover {
background-color: transparent;
}
.amos-tabs-tabitem-inner {
height: 98%;
width: 100%;
height: 30px;
width: 181px;
background-image: url('../../../assets/images/title_bg.png');
background-size: cover;
......@@ -94,11 +94,11 @@
color: white;
}
}
}
}
.info:nth-of-type(2) {
margin-top: 20px;
}
......@@ -126,7 +126,7 @@
cursor: pointer;
border-top: 1px solid transparent;
}
}
.info-titles {
......@@ -136,7 +136,7 @@
width: 188px;
z-index: 999;
margin-right: 28px;
.title-bg {
.title-bg {
transform: skewX(2deg);
background-image: url('../../../assets/images/title_bg.png');
background-size: cover;
......@@ -149,9 +149,9 @@
color: rgba(255,255,255,1);
text-shadow: 0px 0px 4px rgba(9,35,61,1);
border: 1px solid rgba(95,255,253,1);
border-bottom: 1px solid rgba(17,12,48,1);
border-bottom: 1px solid rgba(17,12,48,1);
}
}
}
}
.info-card {
......@@ -161,7 +161,7 @@
background: linear-gradient(180deg,rgba(0,0,0,0.57) 0%,rgba(12,181,213,0.1) 100%);
padding: 27px 26px 29px 41px;
font-size: 20px;
.contact {
display: flex;
align-items: center;
......@@ -183,7 +183,7 @@
text-align: left;
.job {
margin: 14px 0 0 15px;
margin: 14px 0 0 15px;
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 26px;
......@@ -239,7 +239,7 @@
align-items: center;
font-size: 20px;
margin-bottom: 6px;
.dec {
padding-left: 16px;
text-align: left;
......@@ -275,7 +275,7 @@
font-size: 20px;
padding: 0;
border-bottom: 0;
.amos-tabs-tabitem-active {
border: 1px solid rgba(95,255,253,1);
border-bottom: 1px solid black;
......@@ -306,13 +306,13 @@
color: white;
}
}
}
}
.info-title {
display: flex;
.title-bg {
transform: skewX(2deg);
margin-right: 28px;
......@@ -328,7 +328,7 @@
border-top: 1px solid transparent;
cursor: pointer;
}
}
.right-container {
......@@ -342,17 +342,17 @@
//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%);
opacity: 1;
.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;
......@@ -366,11 +366,11 @@
background:rgba(0,185,255,0.59);
}
}
.history {
margin: 0 auto;
padding: 25vh 0;
.desc {
padding-top: 17px;
font-size: 35px;
......@@ -380,7 +380,7 @@
color: rgba(89,240,251,1);
}
}
.miao_bg {
background-image: url('../../../assets/images/miao_bg.png');
background-size: cover;
......@@ -396,7 +396,7 @@
width: 100%;
background:rgba(82,237,242,0.1);
box-shadow: 0px 3px 6px rgba(0,0,0,0.16);
.to-left{
position: absolute;
left: 0;
......@@ -406,7 +406,7 @@
line-height: 109px;
cursor: pointer;
}
.to-right {
position: absolute;
right: 0;
......@@ -416,7 +416,7 @@
line-height: 109px;
cursor: pointer;
}
.plan {
background: rgba(82,237,242,0.1);
padding-top: 19px;
......@@ -424,13 +424,13 @@
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;
......@@ -438,7 +438,7 @@
height: 110px;
margin-left: 4px;
cursor: pointer;
.plan-text {
margin-top: 9px;
}
......@@ -566,4 +566,4 @@
}
}
}
}
\ No newline at end of file
}
......@@ -2,598 +2,557 @@
// position: absolute;
// height: 100%;
// width: 100%;
.yi{
color:#48E0FF;
}
.er{
color:#F1F10C;
}
.san{
color:#FF8000;
}
.si{
color:#FC2F1E;
}
.ant-calendar {
width: 180px !important;
background-color:#0E7FB4 !important;
}
.souh{
height: 100%;
width: 100%;
// .ant-pagination.mini .ant-pagination-options {
// margin-left: 8px;
// display: none;
// }
.ant-table-pagination {
float:none;
text-align: center !important;
}
.yi {
color: #48e0ff;
}
.er {
color: #f1f10c;
}
.san {
color: #ff8000;
}
.si {
color: #fc2f1e;
}
.ant-calendar {
width: 180px !important;
background-color: #0e7fb4 !important;
}
.souh {
height: 100%;
width: 100%;
// .ant-pagination.mini .ant-pagination-options {
// margin-left: 8px;
// display: none;
// }
.ant-table-pagination {
float: none;
text-align: center !important;
}
.ant-table-thead > tr.ant-table-row-hover > td, .ant-table-tbody > tr.ant-table-row-hover > td, .ant-table-thead > tr:hover > td, .ant-table-tbody > tr:hover > td {
background: rgb(176, 204, 240);
.ant-table-thead > tr.ant-table-row-hover > td,
.ant-table-tbody > tr.ant-table-row-hover > td,
.ant-table-thead > tr:hover > td,
.ant-table-tbody > tr:hover > td {
background: rgb(176, 204, 240);
}
.inputxqtable {
height: 90%;
width: 100%;
border: 1px solid rgba(23, 186, 252, 1);
.ant-pagination-prev,
.ant-pagination-next {
background-color: rgba(23, 186, 252, 1);
}
.inputxqtable{
height: 90%;
width: 100%;
border:1px solid rgba(23,186,252,1);
.ant-pagination-prev, .ant-pagination-next {
background-color: rgba(23,186,252,1);
}
.ant-table-middle .ant-table-thead > tr > th:not(.ant-table-selection-column), .ant-table-middle .ant-table-tbody > tr:nth-child(even){
background-color: #0E7FB4;
}
::-webkit-scrollbar{
width:4px;
background-color: #0e487c;
}
::-webkit-scrollbar-thumb{
background-color: #4facfa;
}
.ant-table-header{
margin-bottom: -1% !important;
.ant-table-middle .ant-table-thead > tr > th:not(.ant-table-selection-column),
.ant-table-middle .ant-table-tbody > tr:nth-child(even) {
background-color: #0e7fb4;
}
}
.ant-table-content{
max-height: 100% !important;
}
.ant-table-body{
max-height: 340px !important;
overflow-y: auto !important;
}
.ant-table-tbody > tr > td {
border: 0px solid #e9e9e9;
}
.table, td, tr, th {
font-size: 15px;
}
.ant-table-fixed-header > .ant-table-content > .ant-table-scroll > .ant-table-body {
font-size:15px !important;;
font-family:Microsoft YaHei UI !important;;
font-weight:400 !important;;
line-height:14px !important;;
color:rgba(255,255,255,1) !important;;
background: #265673!important;
}
.ant-table table {
text-align: center !important;
}
.ant-table-pagination {
font-size:12px;
font-family:Microsoft YaHei UI;
font-weight:400;
line-height:14px;
color:rgba(255,255,255,1);
::-webkit-scrollbar {
width: 4px;
background-color: #0e487c;
}
::-webkit-scrollbar-thumb {
background-color: #4facfa;
}
.ant-table-header {
margin-bottom: -1% !important;
}
.ant-table-content {
max-height: 100% !important;
}
.ant-table-body {
max-height: 340px !important;
overflow-y: auto !important;
}
.ant-table-tbody > tr > td {
border: 0px solid #e9e9e9;
}
.table,
td,
tr,
th {
font-size: 15px;
}
.ant-table-fixed-header > .ant-table-content > .ant-table-scroll > .ant-table-body {
font-size: 15px !important;
font-family: Microsoft YaHei UI !important;
font-weight: 400 !important;
line-height: 14px !important;
color: rgba(255, 255, 255, 1) !important;
background: #265673 !important;
}
.ant-table table {
text-align: center !important;
}
.ant-table-pagination {
font-size: 12px;
font-family: Microsoft YaHei UI;
font-weight: 400;
line-height: 14px;
color: rgba(255, 255, 255, 1);
}
.ant-select-sm .ant-select-selection__rendered {
line-height: 21px !important;
font-size: 12px;
font-family: Microsoft YaHei UI;
color: rgba(255,255,255,1);
}
.ant-select-selection {
background-color: rgba(23,186,252,1);
}
.ant-table-thead > tr > th{
text-align: center;
background:#265673;
border: 0px solid #265673;
font-size:15px;
font-family:Microsoft YaHei;
color:rgba(255,255,255,1);
}
.ant-table-fixed-header .ant-table-scroll .ant-table-header {
overflow: hidden;
}
.ant-table-bordered .ant-table-header > table, .ant-table-bordered .ant-table-body > table, .ant-table-bordered .ant-table-fixed-left table, .ant-table-bordered .ant-table-fixed-right table {
border: 0px solid #e9e9e9;
}
color: rgba(255, 255, 255, 1);
}
.ant-select-selection {
background-color: rgba(23, 186, 252, 1);
}
.ant-table-thead > tr > th {
text-align: center;
background: #265673;
border: 0px solid #265673;
font-size: 15px;
font-family: Microsoft YaHei;
color: rgba(255, 255, 255, 1);
}
.ant-table-fixed-header .ant-table-scroll .ant-table-header {
overflow: hidden;
}
.ant-table-bordered .ant-table-header > table,
.ant-table-bordered .ant-table-body > table,
.ant-table-bordered .ant-table-fixed-left table,
.ant-table-bordered .ant-table-fixed-right table {
border: 0px solid #e9e9e9;
}
// .ant-table-middle .ant-table-thead > tr > th:not(.ant-table-selection-column), .ant-table-middle .ant-table-tbody > tr > td {
// padding: 16px 8px;
// }
.ant-table-placeholder {
background: #265673;
}
.ant-table-wrapper{
height: 100%
}
.ant-spin-nested-loading{
height: 100%
}
.ant-spin-container{
height: 100%
}
.ant-.ant-spin-container {
height: 100%
}
.ant-table{
height: 87%
}
}
.sou{
height: 10%;
width: 100%;
display: flex;
top: -2%;
position: relative;
// }
.ant-table-placeholder {
background: #265673;
}
.ant-table-wrapper {
height: 100%;
}
.ant-spin-nested-loading {
height: 100%;
}
.ant-spin-container {
height: 100%;
}
.ant-.ant-spin-container {
height: 100%;
}
.ant-table {
height: 87%;
}
}
.sou {
height: 10%;
width: 100%;
display: flex;
top: -2%;
position: relative;
.search-one {
height: 100%;
width: 30%;
position: relative;
text-align: center;
/* vertical-align: middle; */
top: 29%;
.search-one {
height: 100%;
width: 30%;
.search-one-button {
background-image: url('/src/assets/safetyManage/sousuo.png');
background-repeat: no-repeat !important;
right: 26%;
height: 20px;
position: relative;
text-align: center;
/* vertical-align: middle; */
top: 29%;
width: 20px;
/* margin-top: 10%; */
margin-top: -1%;
float: right;
/* padding-left: 8%; */
top: 11%;
}
.search-one-button{
background-image: url('/src/assets/safetyManage/sousuo.png');
background-repeat: no-repeat !important;
right: 26%;
height: 20px;
position: relative;
width: 20px;
/* margin-top: 10%; */
margin-top: -1%;
float: right;
/* padding-left: 8%; */
top: 11%;
}
.search-one-input {
width: 100%;
.search-one-input{
width: 100%;
.ant-input-affix-wrapper .ant-input-suffix {
position: absolute;
padding-right: 24px;
top: 50%;
transform: translateY(-50%);
line-height: 0;
color: rgba(0, 0, 0, 0.65);
}
.ant-input-affix-wrapper .ant-input-suffix{
position: absolute;
padding-right: 24px;
top: 50%;
transform: translateY(-50%);
line-height: 0;
color: rgba(0, 0, 0, 0.65);
}
.ant-input-affix-wrapper {
padding: 0;
margin: 0;
font-family: 'Helvetica Neue For Number', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei',
'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 12px;
font-variant: tabular-nums;
line-height: 1.5;
color: rgba(0, 0, 0, 0.65);
list-style: none;
box-sizing: border-box;
position: relative;
display: inline-block;
width: 50;
padding-left: 24px;
padding-right: 24px;
}
.ant-input-affix-wrapper {
padding: 0;
margin: 0;
font-family: "Helvetica Neue For Number", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 12px;
font-variant: tabular-nums;
line-height: 1.5;
color: rgba(0, 0, 0, 0.65);
list-style: none;
box-sizing: border-box;
.ant-input-search {
.anticon-search {
&::before {
position: relative;
display: inline-block;
width: 50;
padding-left: 24px;
padding-right: 24px;
}
background: url('/src/assets/safetyManage/sousuo.png') no-repeat;
width: 20px;
height: 20px;
background-size: 100% 100%;
.ant-input-search {
.anticon-search {
&::before {
position: relative;
display: inline-block;
background: url('/src/assets/safetyManage/sousuo.png') no-repeat;
width: 20px;
height: 20px;
background-size: 100% 100%;
top: 0px;
content: '' !important;
}
}
top: 0px;
content: '' !important;
}
}
}
.ant-input {
// width: 10.7rem;
height: 30px;
// position: relative;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
.ant-input {
// width: 10.7rem;
height: 30px;
// position: relative;
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
// line-height:50px;
color:rgba(225,231,232,1);
-webkit-text-stroke:1 rgba(0,0,0,0.00);
text-stroke:1 rgba(0,0,0,0.00);
opacity:1;
background: rgba(0,185,255,0.3) !important;
border-radius: 17px;
left: 34%;
.anticon:before {
margin-top: 1px;
}
border-color:rgba(0,185,255,0.3)
}
}
color: rgba(225, 231, 232, 1);
-webkit-text-stroke: 1 rgba(0, 0, 0, 0);
text-stroke: 1 rgba(0, 0, 0, 0);
opacity: 1;
background: rgba(0, 185, 255, 0.3) !important;
border-radius: 17px;
left: 34%;
.anticon:before {
margin-top: 1px;
}
border-color: rgba(0, 185, 255, 0.3);
}
}
}
.search-one-alarm {
height: 100%;
width: 30%;
.search-one-alarm {
height: 100%;
width: 30%;
position: relative;
text-align: center;
/* vertical-align: middle; */
top: 29%;
margin-left: 12%;
.search-one-button {
background-image: url('/src/assets/safetyManage/sousuo.png');
background-repeat: no-repeat !important;
right: 26%;
height: 20px;
position: relative;
text-align: center;
/* vertical-align: middle; */
top: 29%;
margin-left: 12%;
.search-one-button{
background-image: url('/src/assets/safetyManage/sousuo.png');
background-repeat: no-repeat !important;
right: 26%;
height: 20px;
position: relative;
width: 20px;
/* margin-top: 10%; */
margin-top: -1%;
float: right;
/* padding-left: 8%; */
top: 11%;
}
.search-one-input{
width: 100%;
.ant-input-affix-wrapper .ant-input-suffix{
position: absolute;
padding-right: 24px;
top: 50%;
transform: translateY(-50%);
line-height: 0;
color: rgba(0, 0, 0, 0.65);
}
.ant-input-affix-wrapper {
padding: 0;
margin: 0;
font-family: "Helvetica Neue For Number", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 12px;
font-variant: tabular-nums;
line-height: 1.5;
color: rgba(0, 0, 0, 0.65);
list-style: none;
box-sizing: border-box;
position: relative;
display: inline-block;
width: 50;
padding-left: 24px;
padding-right: 24px;
}
.ant-input-search {
.anticon-search {
&::before {
position: relative;
display: inline-block;
background: url('/src/assets/safetyManage/sousuo.png') no-repeat;
width: 20px;
height: 20px;
background-size: 100% 100%;
top: 0px;
content: '' !important;
}
}
}
.ant-input {
// width: 10.7rem;
height: 30px;
// position: relative;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
// line-height:50px;
color:rgba(225,231,232,1);
-webkit-text-stroke:1 rgba(0,0,0,0.00);
text-stroke:1 rgba(0,0,0,0.00);
opacity:1;
background: rgba(0,185,255,0.3) !important;
border-radius: 17px;
left: 34%;
.anticon:before {
margin-top: 1px;
}
border-color:rgba(0,185,255,0.3)
}
}
width: 20px;
/* margin-top: 10%; */
margin-top: -1%;
float: right;
/* padding-left: 8%; */
top: 11%;
}
.search-two {
height: 100%;
width: 30%;
// border:2px solid red;
left: 2%;
position: relative;
top: 29%;
.search-one-input {
width: 100%;
.amos-popover-trigger {
border-color:rgba(0,185,255,0.3);
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
// line-height:50px;
color:rgba(225,231,232,1);
-webkit-text-stroke:1 rgba(0,0,0,0.00);
text-stroke:1 rgba(0,0,0,0.00);
opacity:1;
width: 74%;
.ant-input-affix-wrapper .ant-input-suffix {
position: absolute;
padding-right: 24px;
top: 50%;
transform: translateY(-50%);
line-height: 0;
color: rgba(0, 0, 0, 0.65);
}
.aficon-down:before {
.ant-input-affix-wrapper {
padding: 0;
margin: 0;
font-family: 'Helvetica Neue For Number', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei',
'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 12px;
font-variant: tabular-nums;
line-height: 1.5;
color: rgba(0, 0, 0, 0.65);
list-style: none;
box-sizing: border-box;
position: relative;
display: inline-block;
background: url('/src/assets/safetyManage/xiangxia.png') no-repeat;
width: 20px;
height: 20px;
background-size: 100% 100%;
top: 4px;
content: '' !important;
width: 50;
padding-left: 24px;
padding-right: 24px;
}
}
.search-three {
position: relative;
height: 100%;
width: 41%;
top: 29%;
margin-left: -3%;
.ant-calendar-picker {
width: 36% !important
}
.ant-input-search {
.anticon-search {
&::before {
position: relative;
display: inline-block;
background: url('/src/assets/safetyManage/sousuo.png') no-repeat;
width: 20px;
height: 20px;
background-size: 100% 100%;
.ant-calendar-picker-input{
background-color: rgba(0,185,255,0.3);
border-color:rgba(0,185,255,0.3)
top: 0px;
content: '' !important;
}
}
}
.ant-input {
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
// width: 10.7rem;
height: 30px;
// position: relative;
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
// line-height:50px;
color:rgba(225,231,232,1);
-webkit-text-stroke:1 rgba(0,0,0,0.00);
text-stroke:1 rgba(0,0,0,0.00);
color: rgba(225, 231, 232, 1);
-webkit-text-stroke: 1 rgba(0, 0, 0, 0);
text-stroke: 1 rgba(0, 0, 0, 0);
opacity: 1;
background: rgba(0, 185, 255, 0.3) !important;
border-radius: 17px;
width: 102%;
left: 34%;
.anticon:before {
margin-top: 1px;
}
border-color: rgba(0, 185, 255, 0.3);
}
}
}
.ant-calendar-picker-icon:after {
position: relative;
display: inline-block;
background: url('/src/assets/safetyManage/rjd.png') no-repeat;
background-size: 100% 100%;
width: 18px;
height: 20px;
bottom: 4px;
right: -2px;
content: '' !important;
.search-two {
height: 100%;
width: 30%;
// border:2px solid red;
left: 2%;
position: relative;
top: 29%;
.amos-popover-trigger {
border-color: rgba(0, 185, 255, 0.3);
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
// line-height:50px;
color: rgba(225, 231, 232, 1);
-webkit-text-stroke: 1 rgba(0, 0, 0, 0);
text-stroke: 1 rgba(0, 0, 0, 0);
opacity: 1;
width: 74%;
}
.three-font {
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height: 23px;
color:rgba(255,255,255,1);
}
.ant-calendar-picker-icon{
// background-image: url('/src/assets/safetyManage/sousuo.png');
// background-repeat: no-repeat !important;
border-color:rgba(0,185,255,0.3)
}
}
.search-three-alarm{
.aficon-down:before {
position: relative;
height: 100%;
width: 41%;
top: 29%;
display: inline-block;
background: url('/src/assets/safetyManage/xiangxia.png') no-repeat;
width: 20px;
height: 20px;
background-size: 100% 100%;
top: 4px;
content: '' !important;
}
}
.search-three {
position: relative;
height: 100%;
width: 41%;
top: 29%;
margin-left: -3%;
.ant-calendar-picker {
width: 36% !important
}
.ant-calendar-picker {
width: 36% !important;
}
.ant-calendar-picker-input{
background-color: rgba(0,185,255,0.3);
border-color:rgba(0,185,255,0.3)
}
.ant-calendar-picker-input {
background-color: rgba(0, 185, 255, 0.3);
border-color: rgba(0, 185, 255, 0.3);
}
.ant-input {
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
// line-height:50px;
color:rgba(225,231,232,1);
-webkit-text-stroke:1 rgba(0,0,0,0.00);
text-stroke:1 rgba(0,0,0,0.00);
border-radius: 17px;
width: 102%;
}
.ant-input {
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
// line-height:50px;
color: rgba(225, 231, 232, 1);
-webkit-text-stroke: 1 rgba(0, 0, 0, 0);
text-stroke: 1 rgba(0, 0, 0, 0);
border-radius: 17px;
width: 102%;
}
.ant-calendar-picker-icon:after {
position: relative;
display: inline-block;
background: url('/src/assets/safetyManage/rjd.png') no-repeat;
background-size: 100% 100%;
width: 18px;
height: 20px;
bottom: 4px;
right: -2px;
content: '' !important;
.ant-calendar-picker-icon:after {
position: relative;
display: inline-block;
background: url('/src/assets/safetyManage/rjd.png') no-repeat;
background-size: 100% 100%;
width: 18px;
height: 20px;
bottom: 4px;
right: -2px;
content: '' !important;
}
.three-font {
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 23px;
color: rgba(255, 255, 255, 1);
}
.ant-calendar-picker-icon {
// background-image: url('/src/assets/safetyManage/sousuo.png');
// background-repeat: no-repeat !important;
border-color: rgba(0, 185, 255, 0.3);
}
.three-font {
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height: 23px;
color:rgba(255,255,255,1);
}
.ant-calendar-picker-icon{
// background-image: url('/src/assets/safetyManage/sousuo.png');
// background-repeat: no-repeat !important;
border-color:rgba(0,185,255,0.3)
}
}
}
.amos-popover-content {
background: rgba(3, 111, 199, 0.842)!important;
border:1px solid rgba(240,242,243,1)!important;
}
.search-three-alarm {
position: relative;
height: 100%;
width: 41%;
top: 29%;
.amos-select-dropdown {
background-color:rgba(0,185,255,0.3);
opacity:1;
border-radius: 17px;
border: 0 solid #e8e8e8;
line-height: 32px;
}
.amos-std-form-content{
width: 100%;
}
.ant-calendar-picker{
width: 100% !important;
}
.amos-std-form-label {
width: 4em;
}
.ant-input{
.ant-calendar-picker {
width: 36% !important;
}
background-color:rgba(0,185,255,0.3);
opacity:1;
border-radius: 17px;
border: 0 solid #e8e8e8;
}
}
.inputxq3{
margin-left: 15%;
float: left;
width: 24%;
.amos-std-form-content{
width: 100%;
}
.amos-search{
width: 80%;
}
.amos-search-inner{
background-color:rgba(0,185,255,0.3);
opacity:1;
border-radius: 17px;
height: 34px;
}
.amos-search-inner{
color: rgba(240,242,243,1);
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 26px;
.ant-calendar-picker-input {
background-color: rgba(0, 185, 255, 0.3);
border-color: rgba(0, 185, 255, 0.3);
}
}
}
.ant-input {
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
// line-height:50px;
color: rgba(225, 231, 232, 1);
-webkit-text-stroke: 1 rgba(0, 0, 0, 0);
text-stroke: 1 rgba(0, 0, 0, 0);
border-radius: 17px;
width: 102%;
}
.ant-calendar-picker-icon:after {
position: relative;
display: inline-block;
background: url('/src/assets/safetyManage/rjd.png') no-repeat;
background-size: 100% 100%;
width: 18px;
height: 20px;
bottom: 4px;
right: -2px;
content: '' !important;
}
.three-font {
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 23px;
color: rgba(255, 255, 255, 1);
}
.ant-calendar-picker-icon {
// background-image: url('/src/assets/safetyManage/sousuo.png');
// background-repeat: no-repeat !important;
border-color: rgba(0, 185, 255, 0.3);
}
}
}
.risk-model-model99{
.amos-popover-content {
background: rgba(3, 111, 199, 0.842) !important;
border: 1px solid rgba(240, 242, 243, 1) !important;
}
.amos-modal-container{
.amos-select-dropdown {
background-color: rgba(0, 185, 255, 0.3);
opacity: 1;
border-radius: 17px;
border: 0 solid #e8e8e8;
line-height: 32px;
}
.amos-std-form-content {
width: 100%;
}
.ant-calendar-picker {
width: 100% !important;
}
.amos-std-form-label {
width: 4em;
}
.ant-input {
background-color: rgba(0, 185, 255, 0.3);
opacity: 1;
border-radius: 17px;
border: 0 solid #e8e8e8;
}
}
.inputxq3 {
margin-left: 15%;
float: left;
width: 24%;
.amos-std-form-content {
width: 100%;
}
.amos-search {
width: 80%;
}
.amos-search-inner {
background-color: rgba(0, 185, 255, 0.3);
opacity: 1;
border-radius: 17px;
height: 34px;
}
.amos-search-inner {
color: rgba(240, 242, 243, 1);
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 26px;
}
}
.risk-model-model99 {
.amos-modal-container {
background: rgba(14, 127, 180, 0.29);
height: 70%;
}
.amos-modal-content{
.amos-modal-content {
padding: 0.5em;
height: 100%;
}
.amos-modal-header{
background: rgba(14, 127, 180, 0.29);
.amos-modal-header {
background: rgba(14, 127, 180, 0.29);
padding: 0.3em 0.3em;
border-bottom: 0px solid #e5e5e5;
.amos-modal-title{
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
margin-left: 10px;
height: 100%;
line-height:20px;
color:rgba(255,255,255,1);
-webkit-text-stroke:1 rgba(0,0,0,0.00);
opacity:1;
.amos-modal-title {
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
margin-left: 10px;
height: 100%;
line-height: 20px;
color: rgba(255, 255, 255, 1);
-webkit-text-stroke: 1 rgba(0, 0, 0, 0);
opacity: 1;
}
}
.amos-modal-close-x{
.amos-modal-close-x {
width: 100%;
height: 100%;
font-size: 20px;
......@@ -601,16 +560,10 @@
line-height: 24px;
margin-right: 13px;
margin-top: 4px;
background-color:rgba(252, 47, 30, 1) ;
background-color: rgba(252, 47, 30, 1);
}
}
.statistical-left {
position: absolute;
height: 86.2%;
......@@ -619,487 +572,460 @@
margin-left: 1.9%;
z-index: 1;
top: 8.51%;
.AlarmControl{
.AlarmControl {
margin-top: 10%;
height: 29.9%;
width: 100%;
// background-image: url('/src/assets/homePage/3120.png');
background-repeat: no-repeat;
background-size: 100% 100%;
-moz-background-size: 100% 100%;
.AlarmControl_1{
height: 29.9%;
width: 100%;
// background-image: url('/src/assets/homePage/3120.png');
background-repeat: no-repeat;
background-size: 100% 100%;
-moz-background-size: 100% 100%;
.AlarmControl_1 {
height: 10%;
width: 100%;
// border:1px solid rgba(23,186,252,1);
.AlarmControl_1_1{
width:50%;
.AlarmControl_1_1 {
width: 50%;
margin-left: 9.4%;
height:100px;
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height:24px;
color:rgba(255,255,255,1);
text-shadow:0px 0px 4px rgba(9,35,61,1);
opacity:1;
height: 100px;
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 24px;
color: rgba(255, 255, 255, 1);
text-shadow: 0px 0px 4px rgba(9, 35, 61, 1);
opacity: 1;
}
}
.AlarmControl_2{
.AlarmControl_2 {
height: 90%;
width: 100%;
.AlarmControl_2_1{
width:9%;
.AlarmControl_2_1 {
float: right;
height:14%;
color: rgb(89, 240, 251);
line-height: 9%;
line-height: 60%;
text-align: center;
font-size: 22px;
width: 28px;
height: 28px;
background: linear-gradient(180deg,rgba(95,255,253,0.6) 0%,rgba(95,255,253,0.1) 100%);
cursor: pointer;
//border:1px solid rgba(23,186,252,1);
}
.AlarmControl_2_2{
width:100%;
float: right;
height:87%;
// border:1px solid rgba(23,186,252,1);
.AlarmControl_2_2_1{
width:50%;
.AlarmControl_2_2 {
width: 100%;
float: right;
height:100%;
// border:1px solid rgba(23,186,252,1);
.AlarmControl8{
margin-top:32% ;
}
.AlarmControl2{
width:100%;
height: 87%;
// border:1px solid rgba(23,186,252,1);
.AlarmControl_2_2_1 {
width: 50%;
float: right;
height:20%;
// border:1px solid rgba(23,186,252,1);
.AlarmControl2_2{
float: right;
margin-top:5% ;
width:10px;
height:10px;
background:rgba(243,12,12,1);
border-radius:50%;
opacity:1;
}
.AlarmControl2_3{
float: right;
margin-top:5% ;
width:10px;
height:10px;
background:rgba(219,121,23,1);
border-radius:50%;
opacity:1;
}
.AlarmControl2_4{
float: right;
margin-top:5% ;
width:10px;
height:10px;
background:rgba(209,209,52,1);
border-radius:50%;
opacity:1;
height: 100%;
// border:1px solid rgba(23,186,252,1);
.AlarmControl8 {
margin-top: 32%;
}
.AlarmControl2_1{
height: 100%;
width: 90%;
.AlarmControl2 {
width: 100%;
float: right;
// border:1px solid rgba(23,186,252,1);
.AlarmControl2_12{
float: left;
margin-left: 2%;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
line-height:20px;
color:rgba(255,255,255,1);
opacity:1;
height: 20%;
// border:1px solid rgba(23,186,252,1);
.AlarmControl2_2 {
float: right;
margin-top: 5%;
width: 10px;
height: 10px;
background: rgba(243, 12, 12, 1);
border-radius: 50%;
opacity: 1;
}
.AlarmControl2_13{
float: left;
margin-left: 2%;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
line-height:20px;
color:rgba(255,255,255,1);
opacity:1;
.AlarmControl2_3 {
float: right;
margin-top: 5%;
width: 10px;
height: 10px;
background: rgba(219, 121, 23, 1);
border-radius: 50%;
opacity: 1;
}
.AlarmControl2_12{
float: left;
margin-left: 2%;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
line-height:20px;
color:rgba(255,255,255,1);
opacity:1;
.AlarmControl2_4 {
float: right;
margin-top: 5%;
width: 10px;
height: 10px;
background: rgba(209, 209, 52, 1);
border-radius: 50%;
opacity: 1;
}
.AlarmControl2_13{
float: left;
margin-left: 2%;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
line-height:20px;
color:rgba(255,255,255,1);
opacity:1;
.AlarmControl2_1 {
height: 100%;
width: 90%;
float: right;
// border:1px solid rgba(23,186,252,1);
.AlarmControl2_12 {
float: left;
margin-left: 2%;
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 20px;
color: rgba(255, 255, 255, 1);
opacity: 1;
}
.AlarmControl2_13 {
float: left;
margin-left: 2%;
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 20px;
color: rgba(255, 255, 255, 1);
opacity: 1;
}
.AlarmControl2_12 {
float: left;
margin-left: 2%;
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 20px;
color: rgba(255, 255, 255, 1);
opacity: 1;
}
.AlarmControl2_13 {
float: left;
margin-left: 2%;
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 20px;
color: rgba(255, 255, 255, 1);
opacity: 1;
}
}
}
}
}
.AlarmControl_2_2_2{
width:50%;
float: right;
height:100%;
//borderborder:1px solid rgba(23,186,252,1);
}
.AlarmControl_2_2_2 {
width: 50%;
float: right;
height: 100%;
//borderborder:1px solid rgba(23,186,252,1);
}
}
}
}
.DangerControl{
.DangerControl {
margin-top: 10%;
height: 29.9%;
width: 100%;
// background-image: url('/src/assets/homePage/3120.png');
background-repeat: no-repeat;
background-size: 100% 100%;
-moz-background-size: 100% 100%;
.DangerControl_1{
height: 10%;
width: 100%;
// border:1px solid rgba(23,186,252,1);
.DangerControl_1_1{
width:50%;
margin-left: 9.4%;
height:100px;
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height:24px;
color:rgba(255,255,255,1);
text-shadow:0px 0px 4px rgba(9,35,61,1);
opacity:1;
}
}
.DangerControl_2{
height: 90%;
width: 100%;
.DangerControl_2_1{
width:9%;
float: right;
height:14%;
color: rgb(89, 240, 251);
line-height: 9%;
text-align: center;
font-size: 22px;
// border:1px solid rgba(23,186,252,1);
-moz-background-size: 100% 100%;
.DangerControl_1 {
height: 10%;
width: 100%;
// border:1px solid rgba(23,186,252,1);
.DangerControl_1_1 {
width: 50%;
margin-left: 9.4%;
height: 100px;
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 24px;
color: rgba(255, 255, 255, 1);
text-shadow: 0px 0px 4px rgba(9, 35, 61, 1);
opacity: 1;
}
}
.DangerControl_2_2{
width:100%;
float: right;
height:87%;
//border:1px solid rgba(23,186,252,1);
.DangerControl_2_2_1{
width:50%;
.DangerControl_2 {
height: 90%;
width: 100%;
.DangerControl_2_1 {
float: right;
height:100%;
// border:1px solid rgba(23,186,252,1);
.AlarmControl8{
margin-top:20% ;
}
.AlarmControl2{
width:100%;
color: rgb(89, 240, 251);
line-height: 60%;
text-align: center;
font-size: 22px;
width: 28px;
height: 28px;
background: linear-gradient(180deg,rgba(95,255,253,0.6) 0%,rgba(95,255,253,0.1) 100%);
cursor: pointer;
// border:1px solid rgba(23,186,252,1);
}
.DangerControl_2_2 {
width: 100%;
float: right;
height: 87%;
//border:1px solid rgba(23,186,252,1);
.DangerControl_2_2_1 {
width: 50%;
float: right;
height:20%;
// border:1px solid rgba(23,186,252,1);
.AlarmControl2_2{
float: right;
margin-top:5% ;
width:10px;
height:10px;
background:rgba(243,12,12,1);
border-radius:50%;
opacity:1;
}
.AlarmControl2_3{
float: right;
margin-top:5% ;
width:10px;
height:10px;
background:rgba(255,214,0,1);
border-radius:50%;
opacity:1;
}
.AlarmControl2_4{
float: right;
margin-top:5% ;
width:10px;
height:10px;
background:rgba(0,255,238,1);
border-radius:50%;
opacity:1;
}
.AlarmControl2_5{
float: right;
margin-top:5% ;
width:10px;
height:10px;
background:rgba(0,255,238,1);
border-radius:50%;
opacity:1;
height: 100%;
// border:1px solid rgba(23,186,252,1);
.AlarmControl8 {
margin-top: 20%;
}
.AlarmControl2_1{
height: 100%;
width: 90%;
.AlarmControl2 {
width: 100%;
float: right;
// border:1px solid rgba(23,186,252,1);
.AlarmControl2_12{
float: left;
margin-left: 1%;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
line-height:20px;
color:rgba(255,255,255,1);
opacity:1;
height: 20%;
// border:1px solid rgba(23,186,252,1);
.AlarmControl2_2 {
float: right;
margin-top: 5%;
width: 10px;
height: 10px;
background: rgba(243, 12, 12, 1);
border-radius: 50%;
opacity: 1;
}
.AlarmControl2_13{
float: left;
margin-left: 1%;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
line-height:20px;
color:rgba(255,255,255,1);
opacity:1;
.AlarmControl2_3 {
float: right;
margin-top: 5%;
width: 10px;
height: 10px;
background: rgba(255, 214, 0, 1);
border-radius: 50%;
opacity: 1;
}
.AlarmControl2_12{
float: left;
margin-left: 1%;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
line-height:20px;
color:rgba(255,255,255,1);
opacity:1;
.AlarmControl2_4 {
float: right;
margin-top: 5%;
width: 10px;
height: 10px;
background: rgba(0, 255, 238, 1);
border-radius: 50%;
opacity: 1;
}
.AlarmControl2_13{
float: left;
margin-left: 1%;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
line-height:20px;
color:rgba(255,255,255,1);
opacity:1;
.AlarmControl2_5 {
float: right;
margin-top: 5%;
width: 10px;
height: 10px;
background: rgba(0, 255, 238, 1);
border-radius: 50%;
opacity: 1;
}
.AlarmControl2_1 {
height: 100%;
width: 90%;
float: right;
// border:1px solid rgba(23,186,252,1);
.AlarmControl2_12 {
float: left;
margin-left: 1%;
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 20px;
color: rgba(255, 255, 255, 1);
opacity: 1;
}
.AlarmControl2_13 {
float: left;
margin-left: 1%;
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 20px;
color: rgba(255, 255, 255, 1);
opacity: 1;
}
.AlarmControl2_12 {
float: left;
margin-left: 1%;
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 20px;
color: rgba(255, 255, 255, 1);
opacity: 1;
}
.AlarmControl2_13 {
float: left;
margin-left: 1%;
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 20px;
color: rgba(255, 255, 255, 1);
opacity: 1;
}
}
}
}
}
.DangerControl_2_2_2{
width:50%;
float: right;
height:100%;
//border:1px solid rgba(23,186,252,1);
.DangerControl_2_2_2 {
width: 50%;
float: right;
height: 100%;
//border:1px solid rgba(23,186,252,1);
}
}
}
}
}
.RiskControl {
height: 32.6%;
width: 100%;
width: 100%;
// background-image: url('/src/assets/homePage/3119.png');
background-repeat: no-repeat;
background-size: 100% 100%;
-moz-background-size: 100% 100%;
.RiskControl_1{
-moz-background-size: 100% 100%;
.RiskControl_1 {
height: 10%;
width: 100%;
// border:1px solid rgba(23,186,252,1);
.RiskControl_1_1{
width:50%;
.RiskControl_1_1 {
width: 50%;
margin-left: 9.4%;
height:100px;
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height:24px;
color:rgba(255,255,255,1);
text-shadow:0px 0px 4px rgba(9,35,61,1);
opacity:1;
height: 100px;
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 24px;
color: rgba(255, 255, 255, 1);
text-shadow: 0px 0px 4px rgba(9, 35, 61, 1);
opacity: 1;
}
}
.RiskControl_2{
.RiskControl_2 {
height: 64%;
width: 100%;
.RiskControl_2_1{
width:9%;
.RiskControl_2_1 {
float: right;
height:18%;
color: rgb(89, 240, 251);
line-height: 9%;
line-height: 60%;
text-align: center;
font-size: 22px;
width: 28px;
height: 28px;
background: linear-gradient(180deg,rgba(95,255,253,0.6) 0%,rgba(95,255,253,0.1) 100%);
cursor: pointer;
//border:1px solid rgba(23,186,252,1);
}
.RiskControl_2_2{
width:100%;
.RiskControl_2_2 {
width: 100%;
float: right;
height:82%;
// border:1px solid rgba(23,186,252,1);
.RiskControl_2_2_1{
width:50%;
height: 82%;
// border:1px solid rgba(23,186,252,1);
.RiskControl_2_2_1 {
width: 50%;
float: right;
height:100%;
// border:1px solid rgba(23,186,252,1);
.RiskControl_2_2_19{
height: 100%;
// border:1px solid rgba(23,186,252,1);
.RiskControl_2_2_19 {
margin-left: 30%;
margin-top: 2%;
height:40%;
.shi{
color:rgba(243,12,12,1);
font-size:22px;
height: 40%;
.shi {
color: rgba(243, 12, 12, 1);
font-size: 22px;
}
.shi1{
color:rgba(243,12,12,1);
.shi1 {
color: rgba(243, 12, 12, 1);
}
.shou{
color:rgba(0,255,238,1);
font-size:22px;
.shou {
color: rgba(0, 255, 238, 1);
font-size: 22px;
}
.shou1{
color:rgba(0,255,238,1);
.shou1 {
color: rgba(0, 255, 238, 1);
}
}
}
.RiskControl_2_2_2{
width:50%;
.RiskControl_2_2_2 {
width: 50%;
float: right;
height:100%;
// border:1px solid rgba(23,186,252,1);
height: 100%;
// border:1px solid rgba(23,186,252,1);
}
}
// border:1px solid rgba(23,186,252,1);
}
.RiskControl_3{
.RiskControl_3 {
height: 26%;
width: 100%;
// border:1px solid rgba(23,186,252,1);
.RiskControl_3_1{
.RiskControl_3_1 {
height: 40%;
width: 50%;
float: right;
//border:1px solid rgba(23,186,252,1);
.RiskControl_3_1_1{
.RiskControl_3_1_1 {
height: 100%;
width: 90%;
float: right;
// border:1px solid rgba(23,186,252,1);
.RiskControl_3_1_8{
// border:1px solid rgba(23,186,252,1);
.RiskControl_3_1_8 {
float: left;
margin-left: 8%;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
line-height:20px;
color:rgba(255,255,255,1);
opacity:1;
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 20px;
color: rgba(255, 255, 255, 1);
opacity: 1;
}
}
.RiskControl_3_1_17{
.RiskControl_3_1_17 {
height: 100%;
width: 60%;
float: right;
// border:1px solid rgba(23,186,252,1);
.RiskControl_3_1_8{
// border:1px solid rgba(23,186,252,1);
.RiskControl_3_1_8 {
float: left;
margin-left: 8%;
font-size:10px;
font-family:Microsoft YaHei;
font-weight:bold;
line-height:20px;
color:rgba(255,255,255,1);
opacity:1;
font-size: 10px;
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 20px;
color: rgba(255, 255, 255, 1);
opacity: 1;
}
}
.RiskControl_3_1_2{
.RiskControl_3_1_2 {
float: right;
margin-top:5% ;
width:10px;
height:10px;
background:rgba(219,121,23,1);
border-radius:50%;
opacity:1;
margin-top: 5%;
width: 10px;
height: 10px;
background: rgba(219, 121, 23, 1);
border-radius: 50%;
opacity: 1;
}
.RiskControl_3_1_3{
.RiskControl_3_1_3 {
float: right;
margin-top:5% ;
width:10px;
height:10px;
background:rgba(243,12,12,1);
border-radius:50%;
opacity:1;
margin-top: 5%;
width: 10px;
height: 10px;
background: rgba(243, 12, 12, 1);
border-radius: 50%;
opacity: 1;
}
.RiskControl_3_1_4{
.RiskControl_3_1_4 {
float: right;
margin-top:5% ;
width:10px;
height:10px;
background:rgba(12,3,185,1);
border-radius:50%;
opacity:1;
margin-top: 5%;
width: 10px;
height: 10px;
background: rgba(12, 3, 185, 1);
border-radius: 50%;
opacity: 1;
}
.RiskControl_3_1_5{
.RiskControl_3_1_5 {
float: right;
margin-top:5% ;
width:10px;
height:10px;
background:rgba(209,209,52,1);
border-radius:50%;
opacity:1;
margin-top: 5%;
width: 10px;
height: 10px;
background: rgba(209, 209, 52, 1);
border-radius: 50%;
opacity: 1;
}
}
}
}
}
......@@ -1113,23 +1039,20 @@
top: 8.51%;
right: 0;
.AllSafety {
height: 25.9%;
width: 100%;
.all-safety-font {
height: 11%;
width: 100%;
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height:24px;
color:rgba(255,255,255,1);
text-shadow:0px 0px 4px rgba(9,35,61,1);
opacity:1;
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 24px;
color: rgba(255, 255, 255, 1);
text-shadow: 0px 0px 4px rgba(9, 35, 61, 1);
opacity: 1;
padding-left: 17px;
}
......@@ -1141,118 +1064,106 @@
background-size: 100% 100%;
-moz-background-size: 100% 100%;
.div-echars{
.div-echars {
margin-left: 17px;
height: 200px !important;
width: 82%!important;
background-position:60px 14px!important
}
width: 82% !important;
background-position: 60px 14px !important;
}
.jiantou {
color:rgb(255,255,0)
}
.jiantou {
color: rgb(255, 255, 0);
}
.content-detail {
height: 100%;
width: 100%;
display: flex;
.all-safety-left{
height: 89%;
width: 53%;
}
.content-detail {
height: 100%;
width: 100%;
display: flex;
.all-safety-left {
height: 89%;
width: 53%;
}
.all-safety-right{
height: 89%;
width: 47%;
text-align: center;
.all-safety-right-one {
height: 13%;
width: 100%;
text-align: center;
margin-top: 17%;
line-height: 20px;
position: relative;
.right-one-font {
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
color:rgba(247,13,14,1);
line-height:26px;
}
}
.all-safety-right-two {
height: 13%;
width: 45%;
background:linear-gradient(90deg,rgba(82,237,242,0.1) 0%,rgba(28,98,100,0.31) 100%);
box-shadow:0px 3px 6px rgba(0,0,0,0.16);
opacity:1;
border-radius: 6px;
position: relative;
left: 31%;
top: 7%;
.right-two-font {
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height: 23px;
color:rgba(255,255,255,1);
opacity:1;
}
}
.all-safety-right-three {
height: 20%;
width: 100%;
text-align: center;
margin-top: 12%;
.right-three-font {
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
color:rgba(4,252,253,1);
line-height:26px;
}
}
.all-safety-right-four {
height: 13%;
width: 45%;
background:linear-gradient(90deg,rgba(82,237,242,0.1) 0%,rgba(28,98,100,0.31) 100%);
box-shadow:0px 3px 6px rgba(0,0,0,0.16);
opacity:1;
border-radius: 6px;
position: relative;
left: 31%;
.right-four-font {
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height:23px;
color:rgba(255,255,255,1);
opacity:1;
}
}
}
}
.all-safety-right {
height: 89%;
width: 47%;
text-align: center;
.all-safety-right-one {
height: 13%;
width: 100%;
text-align: center;
margin-top: 17%;
line-height: 20px;
position: relative;
.right-one-font {
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
color: rgba(247, 13, 14, 1);
line-height: 26px;
}
}
.all-safety-right-two {
height: 13%;
width: 45%;
background: linear-gradient(90deg, rgba(82, 237, 242, 0.1) 0%, rgba(28, 98, 100, 0.31) 100%);
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
opacity: 1;
border-radius: 6px;
position: relative;
left: 31%;
top: 7%;
.right-two-font {
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 23px;
color: rgba(255, 255, 255, 1);
opacity: 1;
}
}
.all-safety-right-three {
height: 20%;
width: 100%;
text-align: center;
margin-top: 12%;
.right-three-font {
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
color: rgba(4, 252, 253, 1);
line-height: 26px;
}
}
.all-safety-right-four {
height: 13%;
width: 45%;
background: linear-gradient(90deg, rgba(82, 237, 242, 0.1) 0%, rgba(28, 98, 100, 0.31) 100%);
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
opacity: 1;
border-radius: 6px;
position: relative;
left: 31%;
.right-four-font {
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 23px;
color: rgba(255, 255, 255, 1);
opacity: 1;
}
}
}
}
}
}
.FireSafety {
......@@ -1262,7 +1173,6 @@
.common-card .card-content .card-contain .card-corner {
bottom: 12px !important;
}
.fire-safety-content {
// background-image: url('/src/assets/homePage/xfsl.png');
......@@ -1273,19 +1183,19 @@
background-size: 100% 100%;
-moz-background-size: 100% 100%;
.fire-safety-font {
height: 11%;
width: 100%;
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height:24px;
color:rgba(255,255,255,1);
text-shadow:0px 0px 4px rgba(9,35,61,1);
opacity:1;
padding-left: 17px;
height: 11%;
width: 100%;
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 24px;
color: rgba(255, 255, 255, 1);
text-shadow: 0px 0px 4px rgba(9, 35, 61, 1);
opacity: 1;
padding-left: 17px;
}
//应急预案
//应急预案
.titleIcon-yjya {
background: url('/src/assets/homePage/txl.png') center center / 100% 100% no-repeat;
display: inline-block;
......@@ -1305,7 +1215,7 @@
margin-top: -4px;
}
//安全巡检
//安全巡检
.titleIcon-aqxj {
background: url('/src/assets/homePage/aqxj.png') center center / 100% 100% no-repeat;
display: inline-block;
......@@ -1326,7 +1236,7 @@
margin-top: -4px;
}
//器材保养
//器材保养
.titleIcon-qcby {
background: url('/src/assets/homePage/qcby.png') center center / 100% 100% no-repeat;
display: inline-block;
......@@ -1338,50 +1248,45 @@
}
.fire-safety-wenzi {
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height:26px;
color:rgba(255,255,255,1);
opacity:1;
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 26px;
color: rgba(255, 255, 255, 1);
opacity: 1;
display: inline-block;
margin-left: 6px;
}
}
}
.fire-safety-tongji {
width: 84%;
height: 12.3%;
background: linear-gradient(90deg, rgba(82, 237, 242, 0.1) 0%, rgba(28, 98, 100, 0.31) 100%);
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
opacity: 1;
margin-left: 7%;
cursor: pointer;
margin-top: 3%;
padding-left: 6px;
.content-tongji {
width: 100%;
.left-div {
display: inline-block;
}
.fire-safety-tongji {
width: 84%;
height: 12.3%;
background:linear-gradient(90deg,rgba(82,237,242,0.1) 0%,rgba(28,98,100,0.31) 100%);
box-shadow:0px 3px 6px rgba(0,0,0,0.16);
opacity:1;
margin-left: 7%;
cursor: pointer;
margin-top: 3%;
padding-left: 6px;
.content-tongji {
width: 100%;
.left-div {
display: inline-block;
}
.right-font {
display: inline-block;
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height:26px;
color:rgba(255,255,255,1);
opacity:1;
float: right;
margin-right: 10px;
}
.right-font {
display: inline-block;
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 26px;
color: rgba(255, 255, 255, 1);
opacity: 1;
float: right;
margin-right: 10px;
}
}
}
}
......@@ -1396,78 +1301,78 @@
.strength-safety-font {
height: 11%;
width: 100%;
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height:24px;
color:rgba(255,255,255,1);
text-shadow:0px 0px 4px rgba(9,35,61,1);
opacity:1;
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 24px;
color: rgba(255, 255, 255, 1);
text-shadow: 0px 0px 4px rgba(9, 35, 61, 1);
opacity: 1;
padding-left: 17px;
}
//驻站消防队
.titleIcon-zzxfd {
background: url('/src/assets/homePage/xfsl/zzxfd.png') center center / 100% 100% no-repeat;
display: inline-block;
height: 20px;
width: 20px;
vertical-align: middle;
margin-top: -4px;
}
//驻站消防队
.titleIcon-zzxfd {
background: url('/src/assets/homePage/xfsl/zzxfd.png') center center / 100% 100% no-repeat;
display: inline-block;
height: 20px;
width: 20px;
vertical-align: middle;
margin-top: -4px;
}
//驻站消防员
.titleIcon-zzxfy {
background: url('/src/assets/homePage/xfsl/zzxfy.png') center center / 100% 100% no-repeat;
display: inline-block;
height: 16px;
width: 19px;
vertical-align: middle;
margin-top: -4px;
}
//驻站消防员
.titleIcon-zzxfy {
background: url('/src/assets/homePage/xfsl/zzxfy.png') center center / 100% 100% no-repeat;
display: inline-block;
height: 16px;
width: 19px;
vertical-align: middle;
margin-top: -4px;
}
//站内值守
.titleIcon-znzs {
background: url('/src/assets/homePage/xfsl/znzs.png') center center / 100% 100% no-repeat;
display: inline-block;
height: 19.5px;
width: 17.5px;
vertical-align: middle;
margin-top: -4px;
margin-left: 3px;
}
//站内值守
.titleIcon-znzs {
background: url('/src/assets/homePage/xfsl/znzs.png') center center / 100% 100% no-repeat;
display: inline-block;
height: 19.5px;
width: 17.5px;
vertical-align: middle;
margin-top: -4px;
margin-left: 3px;
}
//消防车
.titleIcon-xfc {
background: url('/src/assets/homePage/xfsl/xfc.png') center center / 100% 100% no-repeat;
display: inline-block;
height: 18.67px;
width: 19px;
vertical-align: middle;
margin-top: -4px;
}
//消防车
.titleIcon-xfc {
background: url('/src/assets/homePage/xfsl/xfc.png') center center / 100% 100% no-repeat;
display: inline-block;
height: 18.67px;
width: 19px;
vertical-align: middle;
margin-top: -4px;
}
//消防器材
.titleIcon-xfqc {
background: url('/src/assets/homePage/xfsl/xfqc.png') center center / 100% 100% no-repeat;
display: inline-block;
height: 17.32px;
width: 15px;
vertical-align: middle;
margin-top: -4px;
margin-left: 4px;
}
//消防器材
.titleIcon-xfqc {
background: url('/src/assets/homePage/xfsl/xfqc.png') center center / 100% 100% no-repeat;
display: inline-block;
height: 17.32px;
width: 15px;
vertical-align: middle;
margin-top: -4px;
margin-left: 4px;
}
.strength-safety-wenzi {
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height:26px;
color:rgba(255,255,255,1);
opacity:1;
display: inline-block;
margin-left: 6px;
}
.strength-safety-wenzi {
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 26px;
color: rgba(255, 255, 255, 1);
opacity: 1;
display: inline-block;
margin-left: 6px;
}
.strength-safety-content {
// background-image: url('/src/assets/homePage/xfsl.png');
......@@ -1477,73 +1382,63 @@
background-size: 100% 100%;
-moz-background-size: 100% 100%;
.strength-safety-content-box
{
.strength-safety-content-box {
display: flex;
height: 89%;
width: 100%;
.item{
.item {
margin-top: 2%;
padding: 7px;
font-size: 15px;
color: white;
width:260px;
height:35px;
background:linear-gradient(90deg,rgba(82,237,242,0.1) 0%,rgba(28,98,100,0.31) 100%);
box-shadow:0px 3px 6px rgba(0,0,0,0.16);
opacity:1;
.item-img-div
{
width: 260px;
height: 35px;
background: linear-gradient(90deg, rgba(82, 237, 242, 0.1) 0%, rgba(28, 98, 100, 0.31) 100%);
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
opacity: 1;
.item-img-div {
width: 20px;
float: left;
margin-right: 5%;
}
.item-value
{
.item-value {
float: right;
margin-right: 5%;
}
}
}
}
}
.strength-safety-tongji {
width: 84%;
height: 12.3%;
background:linear-gradient(90deg,rgba(82,237,242,0.1) 0%,rgba(28,98,100,0.31) 100%);
box-shadow:0px 3px 6px rgba(0,0,0,0.16);
opacity:1;
margin-left: 7%;
cursor: pointer;
margin-top: 3%;
padding-left: 6px;
.content-tongji {
width: 100%;
.left-div {
display: inline-block;
}
.right-font {
display: inline-block;
font-size:15px;
font-family:Microsoft YaHei;
font-weight:400;
line-height:26px;
color:rgba(255,255,255,1);
opacity:1;
float: right;
margin-right: 10px;
}
.strength-safety-tongji {
width: 84%;
height: 12.3%;
background: linear-gradient(90deg, rgba(82, 237, 242, 0.1) 0%, rgba(28, 98, 100, 0.31) 100%);
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
opacity: 1;
margin-left: 7%;
cursor: pointer;
margin-top: 3%;
padding-left: 6px;
.content-tongji {
width: 100%;
.left-div {
display: inline-block;
}
.right-font {
display: inline-block;
font-size: 15px;
font-family: Microsoft YaHei;
font-weight: 400;
line-height: 26px;
color: rgba(255, 255, 255, 1);
opacity: 1;
float: right;
margin-right: 10px;
}
}
}
}
}
//}
......@@ -9,8 +9,8 @@ class GrowthStatistics extends Component {
<div className="growth-statistics-view common-margin">
{/* <div className='daily-title daily-title-content'>告警隐患周增幅统计</div> */}
<CommonCard title="告警隐患周增幅统计">
<div className="growth-content">
<div style={{ position: 'initial', width: 28, height: 28, marginTop: -28, marginLeft: 358 }} onClick={this.props.onWarnClick}></div>
<div className="growth-content" style={{ position: 'relative' }}>
<div className="content-detail" onClick={this.props.onWarnClick}>...</div>
<div className="growth-item growth-item-header">
<div>日期</div>
<div>告警/隐患</div>
......
......@@ -34,8 +34,8 @@ class RecentStatistics extends Component {
<Button size="sm" children={<span>告警</span>} className="button-style" value="1" style={value == '1' ? select : noselect} />
<Button size="sm" children={<span>隐患</span>} className="button-style" value="2" style={value == '2' ? select : noselect} />
</ButtonGroup>
<div className="recent-statistics-content">
<div style={{ position: 'initial', width: 28, height: 28, marginTop: -19, marginLeft: 362 }} onClick={this.props.onStatisticClick}></div>
<div className="recent-statistics-content" style={{position: 'relative'}}>
<div className="content-detail" onClick={this.props.onStatisticClick}>...</div>
<ReactEcharts option={recentData} style={{ height: '100%', width: '100%' }} />
</div>
</CommonCard>
......
......@@ -10,8 +10,8 @@ class RiskFailure extends Component {
<div className="risk-failure-view common-margin daily-title">
{/* <div className='daily-title daily-title-content'>安全风险失效 TOP10</div> */}
<CommonCard title="安全风险失效 TOP10">
<div className="top-ten-content">
<div style={{ position: 'initial', width: 28, height: 28, marginTop: -35, marginLeft: 352 }} onClick={this.props.onRiskClick}></div>
<div className="top-ten-content" style={{ position: 'relative' }}>
<div className="content-detail" onClick={this.props.onRiskClick}>...</div>
{riskFailureData.map((item, index) => (
<div className="top-ten-item" key={index}>
<OverFlowText>
......
......@@ -7,28 +7,29 @@ import CommonCard from '../../../common/commonCard/CommonCard';
class SafetyRate extends Component {
render() {
return (
<div className="safety-rate-view common-margin daily-title">
{/* <div className='daily-title-content'>
<div className='safety-rate-view common-margin daily-title'>
{/* <div className='daily-title-content'>
安全指数 TOP10
</div> */}
<CommonCard title="安全指数 TOP10">
<div className="top-ten-content" style={{ position: 'initial' }}>
<div style={{ position: 'initial', width: 28, height: 28, marginTop: -36, marginLeft: 352 }} onClick={this.props.onClick}></div>
{SafetyRateData.map((item, index) => (
<div className="top-ten-item" key={index}>
<div className='top-ten-content' style={{ position: 'relative' }}>
<div className="content-detail"
onClick={this.props.onClick}>...</div>
{
SafetyRateData.map((item,index)=>
<div className='top-ten-item' key={index}>
<OverFlowText>
<p style={{ width: '80px' }}>{item.name}</p>
</OverFlowText>
<div className="top-ten-item-middle">
<div className="top-ten-item-middlelinear" style={{ height: 8, width: `${item.value}%` }}>
{' '}
</div>
<div className='top-ten-item-middle'>
<div className='top-ten-item-middlelinear' style={{height:8,width:`${item.value}%`}}> </div>
</div>
<div className="top-ten-item-bottom">
<div className ='top-ten-item-bottom'>
<span>{item.value}</span>
</div>
</div>
</div>
))}
)
}
</div>
</CommonCard>
</div>
......
......@@ -388,7 +388,7 @@ class Statistics extends Component {
</div>
</div>
{/* <MapChart option={option123} style={{ height: '100%', width: '100%' }} /> */}
<div id="mainMap" style={{ width: '100%', height: '86%' }}></div>
<div id="mainMap" style={{ width: '90%', height: '86%', margin: '0 auto', paddingTop: '3%' }}></div>
</CommonCard>
</div>
);
......
......@@ -10,6 +10,7 @@ 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;
......@@ -127,6 +128,7 @@ 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">
......@@ -204,4 +206,4 @@ class DisasterSituation extends React.Component {
}
}
export default DisasterSituation;
\ No newline at end of file
export default DisasterSituation;
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