Skip to content

A
amos-station-module-view
Commit e94546a5 authored by suhuiguang's avatar suhuiguang
Browse files
Options

1.修改今日安全指数详情样式

parent e7f40486
Hide whitespace changes
Inline Side-by-side
Showing with 120 additions and 116 deletions
mods/components/3dviewConvertor/styles/view/panoramic/statistical.scss
View file @ e94546a5
...@@ -17,6 +17,7 @@ ...@@ -17,6 +17,7 @@
padding-left: 97px; padding-left: 97px;
padding-top: 10px; padding-top: 10px;
flex-grow: 1; flex-grow: 1;
overflow-y: auto;
.title-child{ .title-child{
width: 100%; width: 100%;
...@@ -156,9 +157,7 @@ ...@@ -156,9 +157,7 @@
height: 100%; height: 100%;
margin-left: 30px; margin-left: 30px;
margin-right: 20px; margin-right: 20px;
&:hover{ cursor: pointer;
background-color: rgba(199,223,245,0.3);
}
.content-item { .content-item {
margin: 5px; margin: 5px;
...@@ -473,56 +472,59 @@ ...@@ -473,56 +472,59 @@
text-align: right; text-align: right;
margin-top: 5px; margin-top: 5px;
margin-right: 3px; margin-right: 3px;
float: right;
// margin-top: 5px;
// margin-right: 3px;
img{ img{
cursor: pointer; cursor: pointer;
} }
} }
.model-line{
float: left;
display: inline;
width: 32%;
height: 88%;
text-align: center;
padding-left: 35px;
margin-top: 5px;
margin-left: 10px;
overflow: auto;
.model-title{ &-body {
height: 30px; display: flex;
font-size:16px; height: calc(100% - 50px);
color:rgba(240,223,45,1);
padding-top: 10px; .model-line{
} float: left;
.model-content{ display: inline;
width: 32%;
height: 88%;
text-align: center;
padding-left: 35px;
margin-top: 5px;
margin-left: 10px;
overflow: auto;
.model-title{
height: 30px;
font-size:16px;
color:rgba(240,223,45,1);
padding-top: 10px;
}
.model-content{
.content-div{ .content-div{
min-width: 80px; min-width: 80px;
min-height: 120px; min-height: 120px;
text-align: left; text-align: left;
padding-top: 20px; padding-top: 20px;
.title{ .title{
height: 30px; height: 30px;
font-size: 16px; font-size: 16px;
color:rgba(240,223,45,1); color:rgba(240,223,45,1);
}
.next-title{
padding-left: 5px;
}
.rows{
padding-left: 15px;
font-size: 14px;
color:rgba(255,255,255,1);
.row{
display: inline-block;
height: 28px;
} }
.date{ .next-title{
padding-left: 25px; padding-left: 5px;
}
.rows{
padding-left: 15px;
font-size: 14px;
color:rgba(255,255,255,1);
.row{
display: inline-block;
height: 28px;
}
.date{
padding-left: 25px;
}
} }
} }
} }
......
mods/components/3dviewConvertor/view/panoramic/statistical/SafetyIndex.js
View file @ e94546a5
...@@ -35,59 +35,59 @@ export default class SafetyIndex extends Component { ...@@ -35,59 +35,59 @@ export default class SafetyIndex extends Component {
const { safetyIndexData } = this.state; const { safetyIndexData } = this.state;
return { return {
tooltip: { tooltip: {
show:false show: false
}, },
toolbox: { toolbox: {
show:false, show: false,
feature: { feature: {
mark: {show: false}, mark: { show: false },
restore: {show: false}, restore: { show: false },
saveAsImage: {show: false} saveAsImage: { show: false }
} }
}, },
series: [ series: [
{ {
name: '今日安全指数', name: '今日安全指数',
type: 'gauge', type: 'gauge',
center: ['10%', '48%'], // 默认全局居中 center: ['10%', '48%'], // 默认全局居中
radius: '60%', radius: '60%',
min: 0, min: 0,
max: 100, max: 100,
endAngle: 90, endAngle: 90,
startAngle:-90, startAngle: -90,
splitNumber: 3, splitNumber: 3,
axisLine: { // 坐标轴线 axisLine: { // 坐标轴线
show:false, show: false,
lineStyle: { // 属性lineStyle控制线条样式 lineStyle: { // 属性lineStyle控制线条样式
color: [ color: [
[0.5, 'red'], [0.5, 'red'],
[0.9, 'Orange'], [0.9, 'Orange'],
[0.95, 'Gold'], [0.95, 'Gold'],
[1, '#00C3FF'] [1, '#00C3FF']
], ],
width: 0, width: 0,
opacity : 0 opacity: 0
} }
}, },
axisLabel: { // 坐标轴小标记 axisLabel: { // 坐标轴小标记
show:false show: false
}, },
axisTick: { // 坐标轴小标记 axisTick: { // 坐标轴小标记
show:false show: false
}, },
splitLine: { // 分隔线 splitLine: { // 分隔线
show:false show: false
}, },
pointer: { pointer: {
width: 5 width: 5
}, },
title: { title: {
show:false show: false
}, },
detail: { detail: {
show:false show: false
}, },
data: [{value: safetyIndexData.safetyIndex, name: '今日安全指数'}] data: [{ value: safetyIndexData.safetyIndex, name: '今日安全指数' }]
} }
] ]
} }
...@@ -103,19 +103,21 @@ export default class SafetyIndex extends Component { ...@@ -103,19 +103,21 @@ export default class SafetyIndex extends Component {
return ( return (
<div className='warnModal'> <div className='warnModal'>
<div className='close'> <div className='close'>
<img src={panoramicIcon.model_close} onClick={() => this.modelOpen(false)}></img> <img src={panoramicIcon.model_close} alt='' onClick={() => this.modelOpen(false)} />
</div> </div>
{warnController.map(item => { <div className='warnModal-body'>
return ( {warnController.map(item => {
<div className='model-line'> return (
<div> <div key={item.key} className='model-line'>
<img src={getIcon(item.icon)}></img> <div>
<img src={getIcon(item.icon)} alt='' />
</div>
<div className='model-title'>{item.label}</div>
<ModelContent type={item.type} />
</div> </div>
<div className='model-title'>{item.label}</div> );
<ModelContent type={item.type} /> })}
</div> </div>
);
})}
</div> </div>
); );
} }
...@@ -130,21 +132,21 @@ export default class SafetyIndex extends Component { ...@@ -130,21 +132,21 @@ export default class SafetyIndex extends Component {
<div className='safetyIndex-content' onClick={() => this.modelOpen(true)}> <div className='safetyIndex-content' onClick={() => this.modelOpen(true)}>
<div>今日安全指数 </div> <div>今日安全指数 </div>
<div className='safetyIndex-content-row'> <div className='safetyIndex-content-row'>
<div className='number-large'>{safetyIndexData.safetyIndex}</div> <div className='number-large'>{safetyIndexData.safetyIndex}</div>
<span className='number-unit'>&nbsp;分&nbsp; <span className='number-unit'>&nbsp;分&nbsp;
<img src={panoramicIcon.safetyup} className="row-up" alt="up" /> <img src={panoramicIcon.safetyup} className="row-up" alt="up" />
</span> </span>
</div> </div>
{ {
[{name:'风险值上升',num:safetyIndexData.riskExceptionNum}, [{ name: '风险值上升',num: safetyIndexData.riskExceptionNum },
{name:'巡检不合格',num:safetyIndexData.checkExceptionNum}, { name: '巡检不合格',num: safetyIndexData.checkExceptionNum },
{name:'火灾报警',num:safetyIndexData.fireExceptionNum}].map((item,index)=> { name: '火灾报警',num: safetyIndexData.fireExceptionNum }].map((item,index)=>
<div className="content-item">{item.name} {item.num}</div> <div key={item.name} className="content-item">{item.name} {item.num}</div>
) )
} }
</div> </div>
<ReactEcharts className='safetyIndex-content-chart' option={this.getOption()}/> <ReactEcharts className='safetyIndex-content-chart' option={this.getOption()} />
{ modelVisable && this.renderWarnContent()} { modelVisable && this.renderWarnContent()}
</div> </div>
); );
} }
......
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