Merge branch 'dev-yjl' into 'shenzhen-dev'
修改中建四局(双碳管理页面)下拉框文字居中 See merge request !51
This commit is contained in:
commit
46bfcb7e97
@ -5,44 +5,38 @@
|
|||||||
<span @click="change(1)" :class="number == 1 ? 'newStyle' : 'btn_anniu'">零碳展厅</span>
|
<span @click="change(1)" :class="number == 1 ? 'newStyle' : 'btn_anniu'">零碳展厅</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="right3">
|
<div class="right3">
|
||||||
<div class="dropDown" v-show="0 === number">
|
<div class="dropDown" v-show="0 === number">
|
||||||
<!-- <el-select >
|
<!-- <el-select >
|
||||||
<el-option
|
<el-option
|
||||||
v-for="(item,index) in devList"
|
v-for="(item,index) in devList"
|
||||||
:key="index"
|
:key="index"
|
||||||
@click="realTimeMonitor(item)">
|
@click="realTimeMonitor(item)">
|
||||||
</el-option>
|
</el-option>
|
||||||
</el-select> -->
|
</el-select> -->
|
||||||
<el-popover placement="bottom" width="70" trigger="click">
|
<el-popover placement="bottom" width="70" trigger="click">
|
||||||
<ul class="devList">
|
<ul class="devList">
|
||||||
<li
|
<li
|
||||||
:class="{ active: item.deviceId == currentDevDetail.deviceId }"
|
style=" text-align:center"
|
||||||
v-for="(item, index) in devList"
|
:class="{ active: item.deviceId == currentDevDetail.deviceId }"
|
||||||
:key="index"
|
v-for="(item, index) in devList"
|
||||||
@click="realTimeMonitor(item)"
|
:key="index"
|
||||||
>
|
@click="realTimeMonitor(item)"
|
||||||
{{ item.deviceName }}
|
>
|
||||||
</li>
|
{{ item.deviceName }}
|
||||||
</ul>
|
</li>
|
||||||
<p class="greenBtn selectDev" slot="reference">
|
</ul>
|
||||||
<img
|
<p class="greenBtn selectDev" slot="reference">
|
||||||
v-for="item in 4"
|
<img v-for="item in 4" :key="item" :class="'arrow' + item" class="arrow" />
|
||||||
:key="item"
|
{{ currentDevDetail.deviceName }}
|
||||||
:class="'arrow' + item"
|
<i class="el-icon-arrow-down"></i>
|
||||||
class="arrow"
|
</p>
|
||||||
/>
|
</el-popover>
|
||||||
{{ currentDevDetail.deviceName }}
|
|
||||||
<i class="el-icon-arrow-down"></i>
|
|
||||||
</p>
|
|
||||||
</el-popover>
|
|
||||||
</div>
|
</div>
|
||||||
<div v-show="0 === number" ref="centerChart" class="centerChart" id="right2"></div>
|
<div v-show="0 === number" ref="centerChart" class="centerChart" id="right2"></div>
|
||||||
<div class="right4" v-show="1 === number">
|
<div class="right4" v-show="1 === number">
|
||||||
<!-- <p><img src="@/views/projectAdmin/fourEngin/assets/images/common/video_bg.jpg"></p> -->
|
<!-- <p><img src="@/views/projectAdmin/fourEngin/assets/images/common/video_bg.jpg"></p> -->
|
||||||
<videoPhoto class="video"></videoPhoto>
|
<videoPhoto class="video"></videoPhoto>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -54,10 +48,10 @@ import {
|
|||||||
environmentDevList,
|
environmentDevList,
|
||||||
selectNewEnvironmentAlarmListApi,
|
selectNewEnvironmentAlarmListApi,
|
||||||
getRealTimeDustNoiseDataApi,
|
getRealTimeDustNoiseDataApi,
|
||||||
getAirQualityStatisticsApi,sprayDevListApi,
|
sprayDevListApi,
|
||||||
selectDustNoiseDataApi,getWeatherDataApi,getCurrentDayAirQualityApi,
|
selectDustNoiseDataApi,
|
||||||
sprayOperateDataApi
|
sprayOperateDataApi
|
||||||
} from "@/assets/js/api/environmentManage";
|
} from '@/assets/js/api/environmentManage'
|
||||||
import echarts from 'echarts4'
|
import echarts from 'echarts4'
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
@ -65,12 +59,11 @@ export default {
|
|||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
|
||||||
number: 0,
|
number: 0,
|
||||||
devList: [],
|
devList: [],
|
||||||
currentDevDetail: {},
|
currentDevDetail: {},
|
||||||
sprayDevList:[],
|
sprayDevList: [],
|
||||||
alarmList: [],
|
alarmList: [],
|
||||||
onlineDevNum: 0,
|
onlineDevNum: 0,
|
||||||
offlineDevNum: 0,
|
offlineDevNum: 0,
|
||||||
realTimeDustNoiseDataTime: null, //圆形图实时刷新计时器
|
realTimeDustNoiseDataTime: null, //圆形图实时刷新计时器
|
||||||
@ -91,8 +84,8 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created(){
|
created() {
|
||||||
this.getDevList()
|
this.getDevList()
|
||||||
},
|
},
|
||||||
|
|
||||||
mounted() {
|
mounted() {
|
||||||
@ -105,69 +98,64 @@ export default {
|
|||||||
// });
|
// });
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
//获取环境设备列表--环境监测实时数据--下拉
|
||||||
//获取环境设备列表--环境监测实时数据--下拉
|
|
||||||
getDevList() {
|
getDevList() {
|
||||||
console.log('环境下拉列表进来了吗--------');
|
console.log('环境下拉列表进来了吗--------')
|
||||||
environmentDevList({ projectSn: this.$store.state.projectSn }).then(
|
environmentDevList({ projectSn: this.$store.state.projectSn }).then(result => {
|
||||||
(result) => {
|
console.log('环境监测下拉列表', result)
|
||||||
console.log('环境监测下拉列表', result)
|
this.devList = result.result
|
||||||
this.devList = result.result;
|
if (result.result.length > 0) {
|
||||||
if(result.result.length>0){
|
this.currentDevDetail = result.result[0]
|
||||||
this.currentDevDetail = result.result[0];
|
this.getRealTimeDustNoiseData();
|
||||||
// this.getRealTimeDustNoiseData();
|
// this.selectDustNoiseData();
|
||||||
// this.selectDustNoiseData();
|
} else {
|
||||||
}else{
|
// this.createCenterChart();
|
||||||
// this.createCenterChart();
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
);
|
|
||||||
},
|
|
||||||
|
|
||||||
//近24小时数据
|
|
||||||
selectDustNoiseData() {
|
|
||||||
var now = new Date();
|
|
||||||
var yy = now.getFullYear(); //年
|
|
||||||
var mm = now.getMonth() + 1; //月
|
|
||||||
var dd = now.getDate(); //日
|
|
||||||
var time = yy + "-";
|
|
||||||
if (mm < 10) time += "0";
|
|
||||||
time += mm + "-";
|
|
||||||
if (dd < 10) time += "0";
|
|
||||||
time += dd;
|
|
||||||
let data = {
|
|
||||||
searchDate:time,
|
|
||||||
projectSn:this.projectSn,
|
|
||||||
deviceId: this.currentDevDetail.deviceId,
|
|
||||||
}
|
|
||||||
selectDustNoiseDataApi(data).then(res=>{
|
|
||||||
// console.log(res)
|
|
||||||
this.dustData_24=res.result
|
|
||||||
this.createdEcharts2();
|
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
//获取报警列表
|
|
||||||
|
//近24小时数据
|
||||||
|
selectDustNoiseData() {
|
||||||
|
var now = new Date()
|
||||||
|
var yy = now.getFullYear() //年
|
||||||
|
var mm = now.getMonth() + 1 //月
|
||||||
|
var dd = now.getDate() //日
|
||||||
|
var time = yy + '-'
|
||||||
|
if (mm < 10) time += '0'
|
||||||
|
time += mm + '-'
|
||||||
|
if (dd < 10) time += '0'
|
||||||
|
time += dd
|
||||||
|
let data = {
|
||||||
|
searchDate: time,
|
||||||
|
projectSn: this.projectSn,
|
||||||
|
deviceId: this.currentDevDetail.deviceId
|
||||||
|
}
|
||||||
|
selectDustNoiseDataApi(data).then(res => {
|
||||||
|
// console.log(res)
|
||||||
|
this.dustData_24 = res.result
|
||||||
|
this.createdEcharts2()
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//获取报警列表
|
||||||
getAlarmList() {
|
getAlarmList() {
|
||||||
let data = {
|
let data = {
|
||||||
projectSn: this.projectSn,
|
projectSn: this.projectSn
|
||||||
};
|
}
|
||||||
selectNewEnvironmentAlarmListApi(data).then((res) => {
|
selectNewEnvironmentAlarmListApi(data).then(res => {
|
||||||
if (res.code == 200) {
|
if (res.code == 200) {
|
||||||
this.alarmList = res.result;
|
this.alarmList = res.result
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
sprayOperate(deviceId,operateType){
|
sprayOperate(deviceId, operateType) {
|
||||||
sprayOperateDataApi({ projectSn: this.$store.state.projectSn,operateType:operateType,deviceId:deviceId }).then((res) => {
|
sprayOperateDataApi({ projectSn: this.$store.state.projectSn, operateType: operateType, deviceId: deviceId }).then(res => {
|
||||||
this.sprayDevList=res.result
|
this.sprayDevList = res.result
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
getSprayDevList(){
|
getSprayDevList() {
|
||||||
sprayDevListApi({ projectSn: this.$store.state.projectSn }).then((res) => {
|
sprayDevListApi({ projectSn: this.$store.state.projectSn }).then(res => {
|
||||||
this.sprayDevList=res.result
|
this.sprayDevList = res.result
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
/** 查询 */
|
/** 查询 */
|
||||||
handleQuery() {
|
handleQuery() {
|
||||||
@ -177,9 +165,9 @@ export default {
|
|||||||
},
|
},
|
||||||
// // 切换设备
|
// // 切换设备
|
||||||
realTimeMonitor(value) {
|
realTimeMonitor(value) {
|
||||||
this.currentDevDetail = value;
|
this.currentDevDetail = value
|
||||||
this.getRealTimeDustNoiseData();
|
this.getRealTimeDustNoiseData()
|
||||||
this.selectDustNoiseData();
|
this.selectDustNoiseData()
|
||||||
// if (this.realTimeDustNoiseDataTime) {
|
// if (this.realTimeDustNoiseDataTime) {
|
||||||
// clearInterval(this.realTimeDustNoiseDataTime)
|
// clearInterval(this.realTimeDustNoiseDataTime)
|
||||||
// }
|
// }
|
||||||
@ -194,26 +182,26 @@ export default {
|
|||||||
|
|
||||||
// this.selectDustNoiseData(); 近24H
|
// this.selectDustNoiseData(); 近24H
|
||||||
},
|
},
|
||||||
//近24小时数据
|
//近24小时数据
|
||||||
selectDustNoiseData() {
|
selectDustNoiseData() {
|
||||||
var now = new Date();
|
var now = new Date()
|
||||||
var yy = now.getFullYear(); //年
|
var yy = now.getFullYear() //年
|
||||||
var mm = now.getMonth() + 1; //月
|
var mm = now.getMonth() + 1 //月
|
||||||
var dd = now.getDate(); //日
|
var dd = now.getDate() //日
|
||||||
var time = yy + "-";
|
var time = yy + '-'
|
||||||
if (mm < 10) time += "0";
|
if (mm < 10) time += '0'
|
||||||
time += mm + "-";
|
time += mm + '-'
|
||||||
if (dd < 10) time += "0";
|
if (dd < 10) time += '0'
|
||||||
time += dd;
|
time += dd
|
||||||
let data = {
|
let data = {
|
||||||
searchDate:time,
|
searchDate: time,
|
||||||
projectSn:this.projectSn,
|
projectSn: this.projectSn,
|
||||||
deviceId: this.currentDevDetail.deviceId,
|
deviceId: this.currentDevDetail.deviceId
|
||||||
}
|
}
|
||||||
selectDustNoiseDataApi(data).then(res=>{
|
selectDustNoiseDataApi(data).then(res => {
|
||||||
// console.log(res)
|
// console.log(res)
|
||||||
this.dustData_24=res.result
|
this.dustData_24 = res.result
|
||||||
this.createdEcharts2();
|
this.createdEcharts2()
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
//获取环境设备详情数据
|
//获取环境设备详情数据
|
||||||
@ -225,7 +213,7 @@ export default {
|
|||||||
console.log(data)
|
console.log(data)
|
||||||
getRealTimeDustNoiseDataApi(data).then(res => {
|
getRealTimeDustNoiseDataApi(data).then(res => {
|
||||||
if (res.code == 200) {
|
if (res.code == 200) {
|
||||||
console.log('获取环境设备详情数据------',res.result)
|
console.log('获取环境设备详情数据------', res.result)
|
||||||
if (res.result != null) {
|
if (res.result != null) {
|
||||||
this.plantCap = res.result
|
this.plantCap = res.result
|
||||||
} else {
|
} else {
|
||||||
@ -569,33 +557,34 @@ export default {
|
|||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-size: 100%;
|
background-size: 100%;
|
||||||
font-size: 8px;
|
font-size: 8px;
|
||||||
// ::v-deep .el-select{
|
// ::v-deep .el-select{
|
||||||
// width: 100px;
|
// width: 100px;
|
||||||
// height: 20px;
|
// height: 20px;
|
||||||
// }
|
// }
|
||||||
// ::v-deep .el-input__inner {
|
// ::v-deep .el-input__inner {
|
||||||
// background-color: #3e7c86;
|
// background-color: #3e7c86;
|
||||||
// color: #fff;
|
// color: #fff;
|
||||||
// }
|
// }
|
||||||
// ::v-deep .el-select__caret {
|
// ::v-deep .el-select__caret {
|
||||||
// color: #fff;
|
// color: #fff;
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
.devList {
|
.devList {
|
||||||
width: 100px;
|
width: 100px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
li {
|
|
||||||
width: 100px;
|
li {
|
||||||
height: 20px;
|
width: 100px;
|
||||||
cursor: pointer;
|
height: 20px;
|
||||||
text-align: center;
|
cursor: pointer;
|
||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
&.active,
|
&.active,
|
||||||
&:hover {
|
&:hover {
|
||||||
color: rgba(6, 248, 179, 0.8);
|
color: rgba(6, 248, 179, 0.8);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user