Merge branch 'master' of https://e.coding.net/ctcdevteam/ehs/ehs_web
fix：
This commit is contained in:
commit
cf4974f824
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,45 @@
|
|||
<template>
|
||||
<el-container>
|
||||
<el-header class="panel_title">
|
||||
<el-menu mode="horizontal" :default-active="activeIndex" :ellipsis="false" @select="handleSelect">
|
||||
<el-menu-item index="1">进出厂车辆</el-menu-item>
|
||||
<el-menu-item index="2">厂内车辆</el-menu-item>
|
||||
<el-menu-item index="3">非道路移动机械</el-menu-item>
|
||||
</el-menu>
|
||||
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
<car_across v-if="activeIndex == '1'"></car_across>
|
||||
<car_inner v-if="activeIndex == '2'"></car_inner>
|
||||
<car_roadmachine v-if="activeIndex == '3'"></car_roadmachine>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
<script>
|
||||
import car_across from "./car_across.vue";
|
||||
import car_inner from "./car_inner.vue";
|
||||
import car_roadmachine from "./car_roadmachine.vue";
|
||||
export default {
|
||||
components: {
|
||||
car_across,
|
||||
car_inner,
|
||||
car_roadmachine
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeIndex: "1",
|
||||
tableData: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSelect(key, keyPath) {
|
||||
this.activeIndex = key;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.el-tabs {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,311 @@
|
|||
<template>
|
||||
<el-container>
|
||||
<el-header class="panel_title">
|
||||
<div class="left-panel">
|
||||
进出厂运输车辆台账
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
<el-button type="primary" @click="backtoMap">返回地图</el-button>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
<el-container>
|
||||
<el-header class="searchWrap">
|
||||
<div class="left-panel">
|
||||
<div style="font-size: 1.8vh;">
|
||||
进出厂运输车辆总数：<span class="totalNumber">{{ count }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
<el-select v-model="query.level" placeholder="排口等级" style="width:10vw" clearable
|
||||
@change="handleQuery">
|
||||
<el-option v-for="item in options" :key="item.value" :label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<scTable ref="table" :apiObj="apiObj" :params="params" size="large" style="" @row-click="rowClick"
|
||||
:query="query" @dataChange="updateCount">
|
||||
<el-table-column type="index" width="50" />
|
||||
<el-table-column prop="number" label="车牌号码/登记号码"></el-table-column>
|
||||
<el-table-column prop="name" label="车辆识别代码(VIN)"></el-table-column>
|
||||
<el-table-column prop="level" label="生产日期"></el-table-column>
|
||||
<el-table-column prop="color" label="车牌颜色"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="注册登记日期"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="车辆品牌型号"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="发动机号码"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="燃料类型"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="排放阶段"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="联网状态"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="随车清单"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="行驶证"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="车辆所有人(单位)"></el-table-column>
|
||||
</scTable>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
<script>
|
||||
import * as echarts from "echarts";
|
||||
export default {
|
||||
props: {
|
||||
directDetail: {
|
||||
type: Boolean,
|
||||
default: () => {
|
||||
return false;
|
||||
},
|
||||
},
|
||||
eqId: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return '';
|
||||
},
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
count: 0,
|
||||
apiObj: this.$API.enp.drain.list,
|
||||
params: { type: 10 },
|
||||
query: {
|
||||
search: ''
|
||||
},
|
||||
searchInputStyle: {
|
||||
color: '#fff',
|
||||
},
|
||||
tableData: [],
|
||||
detailItem: {},
|
||||
detailForm: {
|
||||
day: 18,
|
||||
year: 2024,
|
||||
month: 1
|
||||
},
|
||||
biquery: {
|
||||
end_time: '2024-02-01',
|
||||
start_time: '2024-01-29',
|
||||
time_bucket: "1 minute",
|
||||
equipment_id: "3491356310052896768",
|
||||
},
|
||||
showEqInfo:true,
|
||||
resizeTimeout:null,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
hiddenChange(){
|
||||
let that = this;
|
||||
that.showEqInfo = !that.showEqInfo;
|
||||
that.addListener();
|
||||
},
|
||||
handleQuery() {
|
||||
this.$refs.table.queryData(this.query);
|
||||
},
|
||||
updateCount(res, tableData) {
|
||||
this.count = res.count
|
||||
},
|
||||
initTimeNow() {
|
||||
var now = new Date();
|
||||
let year = now.getFullYear(); // 年份
|
||||
let month = now.getMonth() + 1; // 月份
|
||||
let day = now.getDate(); // 日期
|
||||
this.detailForm.year = year;
|
||||
this.detailForm.month = month;
|
||||
this.detailForm.day = day;
|
||||
},
|
||||
backtoMap() {
|
||||
this.$emit('close')
|
||||
},
|
||||
getEquipments(ids) {
|
||||
let that = this;
|
||||
let reqs = [];
|
||||
ids.forEach(id => {
|
||||
reqs.push(that.$API.em.equipment.item.req(id).then(res => {
|
||||
if (res.type == 10) {
|
||||
that.eqs = res;
|
||||
} else if (res.type == 40) {
|
||||
that.eqc = res;
|
||||
} else if (res.type == 30) {
|
||||
that.eqz = res;
|
||||
}
|
||||
}))
|
||||
});
|
||||
const promise = Promise.all(reqs);
|
||||
promise.then(() => {
|
||||
// this.getDetailData()
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.tableBg {
|
||||
width: 100%;
|
||||
height: 88vh;
|
||||
background-image: url('/public/img/enp_blue/bigtableBg.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.leftCard {
|
||||
height: 80vh;
|
||||
flex: 1;
|
||||
color: #ffffff;
|
||||
font-size: 0.75vw;
|
||||
background-image: url('/public/img/enp_blue/smallTableBg.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 1vw;
|
||||
}
|
||||
|
||||
.rightCard {
|
||||
flex: 2;
|
||||
height: 80vh;
|
||||
color: #ffffff;
|
||||
background-image: url('/public/img/enp_blue/tableBg.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.totalWrap {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #ffffff;
|
||||
font-size: 1.6vh;
|
||||
padding: 0 0.5vw;
|
||||
height: 3vh;
|
||||
line-height: 3vh;
|
||||
}
|
||||
|
||||
.totalNumber {
|
||||
color: #64D2FF;
|
||||
font-size: 2vh;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.searchBtn {
|
||||
width: 4.7vw;
|
||||
height: 3vh;
|
||||
background-size: 100% 100%;
|
||||
background-image: url('/public/img/enp_blue/search.png');
|
||||
}
|
||||
|
||||
.backMap {
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
position: absolute;
|
||||
right: 1vw;
|
||||
top: 15px;
|
||||
font-size: 1vh;
|
||||
width: -moz-fit-content;
|
||||
width: fit-content;
|
||||
color: #ffffff;
|
||||
padding: 0 0.5vw;
|
||||
background-image: url('/public/img/enp_blue/back.png');
|
||||
}
|
||||
|
||||
.pageTitle {
|
||||
height: 5vh;
|
||||
line-height: 5vh;
|
||||
color: #ffffff;
|
||||
font-size: 1.2vw;
|
||||
padding-left: 1vw;
|
||||
}
|
||||
|
||||
/* */
|
||||
.headerTitle {
|
||||
color: #ffffff;
|
||||
height: 4vh;
|
||||
line-height: 4vh;
|
||||
font-size: 2vh;
|
||||
position: relative
|
||||
}
|
||||
|
||||
.backBtn {
|
||||
font-size: 1vh;
|
||||
position: absolute;
|
||||
top: 1vh;
|
||||
right: 1vh;
|
||||
line-height: 2vh
|
||||
}
|
||||
|
||||
.greenBlock {
|
||||
width: 1vh;
|
||||
height: 1vh;
|
||||
background-image: url('/public/img/enp_blue/greenBlock.png');
|
||||
background-size: 100% 100%;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: 0.5vw;
|
||||
}
|
||||
|
||||
.circles {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 5px;
|
||||
background: #aaaaaa;
|
||||
display: inline-block;
|
||||
margin: auto 0.5vw auto 0;
|
||||
}
|
||||
|
||||
.circles_1 {
|
||||
background: #0ed877;
|
||||
}
|
||||
|
||||
.circles_2 {
|
||||
background: orange;
|
||||
}
|
||||
|
||||
.linesWrap {
|
||||
padding: 1vh 0.5vw;
|
||||
height: 93%;
|
||||
overflow: scroll;
|
||||
font-weight: bold;
|
||||
line-height: 3.5vh;
|
||||
}
|
||||
|
||||
.typeLine {
|
||||
height: 3.5vh;
|
||||
line-height: 4vh;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.infoLine {
|
||||
line-height: 3vh;
|
||||
padding-left: 0.5vw;
|
||||
display: flex
|
||||
}
|
||||
|
||||
.infotitle {
|
||||
font-weight: normal;
|
||||
color: #dddddd;
|
||||
}
|
||||
|
||||
.hiddenIcon{
|
||||
top:45%;
|
||||
left:-25px;
|
||||
width:50px;
|
||||
height:50px;
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
border-radius: 25px;
|
||||
border: 1px solid rgba(254,254,254,.3);
|
||||
box-shadow: 0 0 7px 2px rgba(254,254,254,.5);
|
||||
background: rgba(255,255,255,.5);
|
||||
}
|
||||
.hiddenIcon_hidden{
|
||||
left:0;
|
||||
}
|
||||
.hiddenImg{
|
||||
font-size:40px;
|
||||
margin:4px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,311 @@
|
|||
<template>
|
||||
<el-container>
|
||||
<el-header class="panel_title">
|
||||
<div class="left-panel">
|
||||
厂内运输车辆台账
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
<el-button type="primary" @click="backtoMap">返回地图</el-button>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
<el-container>
|
||||
<el-header class="searchWrap">
|
||||
<div class="left-panel">
|
||||
<div style="font-size: 1.8vh;">
|
||||
进出厂运输车辆总数：<span class="totalNumber">{{ count }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
<el-select v-model="query.level" placeholder="排口等级" style="width:10vw" clearable
|
||||
@change="handleQuery">
|
||||
<el-option v-for="item in options" :key="item.value" :label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<scTable ref="table" :apiObj="apiObj" :params="params" size="large" style="" @row-click="rowClick"
|
||||
:query="query" @dataChange="updateCount">
|
||||
<el-table-column type="index" width="50" />
|
||||
<el-table-column prop="number" label="车牌号码/登记号码"></el-table-column>
|
||||
<el-table-column prop="name" label="车辆识别代码(VIN)"></el-table-column>
|
||||
<el-table-column prop="level" label="生产日期"></el-table-column>
|
||||
<el-table-column prop="color" label="车牌颜色"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="注册登记日期"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="车辆品牌型号"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="发动机号码"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="燃料类型"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="排放阶段"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="联网状态"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="随车清单"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="行驶证"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="车辆所有人(单位)"></el-table-column>
|
||||
</scTable>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
<script>
|
||||
import * as echarts from "echarts";
|
||||
export default {
|
||||
props: {
|
||||
directDetail: {
|
||||
type: Boolean,
|
||||
default: () => {
|
||||
return false;
|
||||
},
|
||||
},
|
||||
eqId: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return '';
|
||||
},
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
count: 0,
|
||||
apiObj: this.$API.enp.drain.list,
|
||||
params: { type: 10 },
|
||||
query: {
|
||||
search: ''
|
||||
},
|
||||
searchInputStyle: {
|
||||
color: '#fff',
|
||||
},
|
||||
tableData: [],
|
||||
detailItem: {},
|
||||
detailForm: {
|
||||
day: 18,
|
||||
year: 2024,
|
||||
month: 1
|
||||
},
|
||||
biquery: {
|
||||
end_time: '2024-02-01',
|
||||
start_time: '2024-01-29',
|
||||
time_bucket: "1 minute",
|
||||
equipment_id: "3491356310052896768",
|
||||
},
|
||||
showEqInfo:true,
|
||||
resizeTimeout:null,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
hiddenChange(){
|
||||
let that = this;
|
||||
that.showEqInfo = !that.showEqInfo;
|
||||
that.addListener();
|
||||
},
|
||||
handleQuery() {
|
||||
this.$refs.table.queryData(this.query);
|
||||
},
|
||||
updateCount(res, tableData) {
|
||||
this.count = res.count
|
||||
},
|
||||
initTimeNow() {
|
||||
var now = new Date();
|
||||
let year = now.getFullYear(); // 年份
|
||||
let month = now.getMonth() + 1; // 月份
|
||||
let day = now.getDate(); // 日期
|
||||
this.detailForm.year = year;
|
||||
this.detailForm.month = month;
|
||||
this.detailForm.day = day;
|
||||
},
|
||||
backtoMap() {
|
||||
this.$emit('close')
|
||||
},
|
||||
getEquipments(ids) {
|
||||
let that = this;
|
||||
let reqs = [];
|
||||
ids.forEach(id => {
|
||||
reqs.push(that.$API.em.equipment.item.req(id).then(res => {
|
||||
if (res.type == 10) {
|
||||
that.eqs = res;
|
||||
} else if (res.type == 40) {
|
||||
that.eqc = res;
|
||||
} else if (res.type == 30) {
|
||||
that.eqz = res;
|
||||
}
|
||||
}))
|
||||
});
|
||||
const promise = Promise.all(reqs);
|
||||
promise.then(() => {
|
||||
// this.getDetailData()
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.tableBg {
|
||||
width: 100%;
|
||||
height: 88vh;
|
||||
background-image: url('/public/img/enp_blue/bigtableBg.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.leftCard {
|
||||
height: 80vh;
|
||||
flex: 1;
|
||||
color: #ffffff;
|
||||
font-size: 0.75vw;
|
||||
background-image: url('/public/img/enp_blue/smallTableBg.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 1vw;
|
||||
}
|
||||
|
||||
.rightCard {
|
||||
flex: 2;
|
||||
height: 80vh;
|
||||
color: #ffffff;
|
||||
background-image: url('/public/img/enp_blue/tableBg.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.totalWrap {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #ffffff;
|
||||
font-size: 1.6vh;
|
||||
padding: 0 0.5vw;
|
||||
height: 3vh;
|
||||
line-height: 3vh;
|
||||
}
|
||||
|
||||
.totalNumber {
|
||||
color: #64D2FF;
|
||||
font-size: 2vh;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.searchBtn {
|
||||
width: 4.7vw;
|
||||
height: 3vh;
|
||||
background-size: 100% 100%;
|
||||
background-image: url('/public/img/enp_blue/search.png');
|
||||
}
|
||||
|
||||
.backMap {
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
position: absolute;
|
||||
right: 1vw;
|
||||
top: 15px;
|
||||
font-size: 1vh;
|
||||
width: -moz-fit-content;
|
||||
width: fit-content;
|
||||
color: #ffffff;
|
||||
padding: 0 0.5vw;
|
||||
background-image: url('/public/img/enp_blue/back.png');
|
||||
}
|
||||
|
||||
.pageTitle {
|
||||
height: 5vh;
|
||||
line-height: 5vh;
|
||||
color: #ffffff;
|
||||
font-size: 1.2vw;
|
||||
padding-left: 1vw;
|
||||
}
|
||||
|
||||
/* */
|
||||
.headerTitle {
|
||||
color: #ffffff;
|
||||
height: 4vh;
|
||||
line-height: 4vh;
|
||||
font-size: 2vh;
|
||||
position: relative
|
||||
}
|
||||
|
||||
.backBtn {
|
||||
font-size: 1vh;
|
||||
position: absolute;
|
||||
top: 1vh;
|
||||
right: 1vh;
|
||||
line-height: 2vh
|
||||
}
|
||||
|
||||
.greenBlock {
|
||||
width: 1vh;
|
||||
height: 1vh;
|
||||
background-image: url('/public/img/enp_blue/greenBlock.png');
|
||||
background-size: 100% 100%;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: 0.5vw;
|
||||
}
|
||||
|
||||
.circles {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 5px;
|
||||
background: #aaaaaa;
|
||||
display: inline-block;
|
||||
margin: auto 0.5vw auto 0;
|
||||
}
|
||||
|
||||
.circles_1 {
|
||||
background: #0ed877;
|
||||
}
|
||||
|
||||
.circles_2 {
|
||||
background: orange;
|
||||
}
|
||||
|
||||
.linesWrap {
|
||||
padding: 1vh 0.5vw;
|
||||
height: 93%;
|
||||
overflow: scroll;
|
||||
font-weight: bold;
|
||||
line-height: 3.5vh;
|
||||
}
|
||||
|
||||
.typeLine {
|
||||
height: 3.5vh;
|
||||
line-height: 4vh;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.infoLine {
|
||||
line-height: 3vh;
|
||||
padding-left: 0.5vw;
|
||||
display: flex
|
||||
}
|
||||
|
||||
.infotitle {
|
||||
font-weight: normal;
|
||||
color: #dddddd;
|
||||
}
|
||||
|
||||
.hiddenIcon{
|
||||
top:45%;
|
||||
left:-25px;
|
||||
width:50px;
|
||||
height:50px;
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
border-radius: 25px;
|
||||
border: 1px solid rgba(254,254,254,.3);
|
||||
box-shadow: 0 0 7px 2px rgba(254,254,254,.5);
|
||||
background: rgba(255,255,255,.5);
|
||||
}
|
||||
.hiddenIcon_hidden{
|
||||
left:0;
|
||||
}
|
||||
.hiddenImg{
|
||||
font-size:40px;
|
||||
margin:4px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,311 @@
|
|||
<template>
|
||||
<el-container>
|
||||
<el-header class="panel_title">
|
||||
<div class="left-panel">
|
||||
非道路移动机械电子台账
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
<el-button type="primary" @click="backtoMap">返回地图</el-button>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
<el-container>
|
||||
<el-header class="searchWrap">
|
||||
<div class="left-panel">
|
||||
<div style="font-size: 1.8vh;">
|
||||
非道路移动机械总数：<span class="totalNumber">{{ count }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
<el-select v-model="query.level" placeholder="排口等级" style="width:10vw" clearable
|
||||
@change="handleQuery">
|
||||
<el-option v-for="item in options" :key="item.value" :label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<scTable ref="table" :apiObj="apiObj" :params="params" size="large" style="" @row-click="rowClick"
|
||||
:query="query" @dataChange="updateCount">
|
||||
<el-table-column type="index" width="50" />
|
||||
<el-table-column prop="number" label="车牌号码/登记号码"></el-table-column>
|
||||
<el-table-column prop="name" label="车辆识别代码(VIN)"></el-table-column>
|
||||
<el-table-column prop="level" label="生产日期"></el-table-column>
|
||||
<el-table-column prop="color" label="车牌颜色"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="注册登记日期"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="车辆品牌型号"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="发动机号码"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="燃料类型"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="排放阶段"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="联网状态"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="随车清单"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="行驶证"></el-table-column>
|
||||
<el-table-column prop="eqpment" label="车辆所有人(单位)"></el-table-column>
|
||||
</scTable>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
<script>
|
||||
import * as echarts from "echarts";
|
||||
export default {
|
||||
props: {
|
||||
directDetail: {
|
||||
type: Boolean,
|
||||
default: () => {
|
||||
return false;
|
||||
},
|
||||
},
|
||||
eqId: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return '';
|
||||
},
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
count: 0,
|
||||
apiObj: this.$API.enp.drain.list,
|
||||
params: { type: 10 },
|
||||
query: {
|
||||
search: ''
|
||||
},
|
||||
searchInputStyle: {
|
||||
color: '#fff',
|
||||
},
|
||||
tableData: [],
|
||||
detailItem: {},
|
||||
detailForm: {
|
||||
day: 18,
|
||||
year: 2024,
|
||||
month: 1
|
||||
},
|
||||
biquery: {
|
||||
end_time: '2024-02-01',
|
||||
start_time: '2024-01-29',
|
||||
time_bucket: "1 minute",
|
||||
equipment_id: "3491356310052896768",
|
||||
},
|
||||
showEqInfo:true,
|
||||
resizeTimeout:null,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
hiddenChange(){
|
||||
let that = this;
|
||||
that.showEqInfo = !that.showEqInfo;
|
||||
that.addListener();
|
||||
},
|
||||
handleQuery() {
|
||||
this.$refs.table.queryData(this.query);
|
||||
},
|
||||
updateCount(res, tableData) {
|
||||
this.count = res.count
|
||||
},
|
||||
initTimeNow() {
|
||||
var now = new Date();
|
||||
let year = now.getFullYear(); // 年份
|
||||
let month = now.getMonth() + 1; // 月份
|
||||
let day = now.getDate(); // 日期
|
||||
this.detailForm.year = year;
|
||||
this.detailForm.month = month;
|
||||
this.detailForm.day = day;
|
||||
},
|
||||
backtoMap() {
|
||||
this.$emit('close')
|
||||
},
|
||||
getEquipments(ids) {
|
||||
let that = this;
|
||||
let reqs = [];
|
||||
ids.forEach(id => {
|
||||
reqs.push(that.$API.em.equipment.item.req(id).then(res => {
|
||||
if (res.type == 10) {
|
||||
that.eqs = res;
|
||||
} else if (res.type == 40) {
|
||||
that.eqc = res;
|
||||
} else if (res.type == 30) {
|
||||
that.eqz = res;
|
||||
}
|
||||
}))
|
||||
});
|
||||
const promise = Promise.all(reqs);
|
||||
promise.then(() => {
|
||||
// this.getDetailData()
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.tableBg {
|
||||
width: 100%;
|
||||
height: 88vh;
|
||||
background-image: url('/public/img/enp_blue/bigtableBg.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.leftCard {
|
||||
height: 80vh;
|
||||
flex: 1;
|
||||
color: #ffffff;
|
||||
font-size: 0.75vw;
|
||||
background-image: url('/public/img/enp_blue/smallTableBg.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin-right: 1vw;
|
||||
}
|
||||
|
||||
.rightCard {
|
||||
flex: 2;
|
||||
height: 80vh;
|
||||
color: #ffffff;
|
||||
background-image: url('/public/img/enp_blue/tableBg.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.totalWrap {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #ffffff;
|
||||
font-size: 1.6vh;
|
||||
padding: 0 0.5vw;
|
||||
height: 3vh;
|
||||
line-height: 3vh;
|
||||
}
|
||||
|
||||
.totalNumber {
|
||||
color: #64D2FF;
|
||||
font-size: 2vh;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.searchBtn {
|
||||
width: 4.7vw;
|
||||
height: 3vh;
|
||||
background-size: 100% 100%;
|
||||
background-image: url('/public/img/enp_blue/search.png');
|
||||
}
|
||||
|
||||
.backMap {
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
position: absolute;
|
||||
right: 1vw;
|
||||
top: 15px;
|
||||
font-size: 1vh;
|
||||
width: -moz-fit-content;
|
||||
width: fit-content;
|
||||
color: #ffffff;
|
||||
padding: 0 0.5vw;
|
||||
background-image: url('/public/img/enp_blue/back.png');
|
||||
}
|
||||
|
||||
.pageTitle {
|
||||
height: 5vh;
|
||||
line-height: 5vh;
|
||||
color: #ffffff;
|
||||
font-size: 1.2vw;
|
||||
padding-left: 1vw;
|
||||
}
|
||||
|
||||
/* */
|
||||
.headerTitle {
|
||||
color: #ffffff;
|
||||
height: 4vh;
|
||||
line-height: 4vh;
|
||||
font-size: 2vh;
|
||||
position: relative
|
||||
}
|
||||
|
||||
.backBtn {
|
||||
font-size: 1vh;
|
||||
position: absolute;
|
||||
top: 1vh;
|
||||
right: 1vh;
|
||||
line-height: 2vh
|
||||
}
|
||||
|
||||
.greenBlock {
|
||||
width: 1vh;
|
||||
height: 1vh;
|
||||
background-image: url('/public/img/enp_blue/greenBlock.png');
|
||||
background-size: 100% 100%;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: 0.5vw;
|
||||
}
|
||||
|
||||
.circles {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 5px;
|
||||
background: #aaaaaa;
|
||||
display: inline-block;
|
||||
margin: auto 0.5vw auto 0;
|
||||
}
|
||||
|
||||
.circles_1 {
|
||||
background: #0ed877;
|
||||
}
|
||||
|
||||
.circles_2 {
|
||||
background: orange;
|
||||
}
|
||||
|
||||
.linesWrap {
|
||||
padding: 1vh 0.5vw;
|
||||
height: 93%;
|
||||
overflow: scroll;
|
||||
font-weight: bold;
|
||||
line-height: 3.5vh;
|
||||
}
|
||||
|
||||
.typeLine {
|
||||
height: 3.5vh;
|
||||
line-height: 4vh;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.infoLine {
|
||||
line-height: 3vh;
|
||||
padding-left: 0.5vw;
|
||||
display: flex
|
||||
}
|
||||
|
||||
.infotitle {
|
||||
font-weight: normal;
|
||||
color: #dddddd;
|
||||
}
|
||||
|
||||
.hiddenIcon{
|
||||
top:45%;
|
||||
left:-25px;
|
||||
width:50px;
|
||||
height:50px;
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
border-radius: 25px;
|
||||
border: 1px solid rgba(254,254,254,.3);
|
||||
box-shadow: 0 0 7px 2px rgba(254,254,254,.5);
|
||||
background: rgba(255,255,255,.5);
|
||||
}
|
||||
.hiddenIcon_hidden{
|
||||
left:0;
|
||||
}
|
||||
.hiddenImg{
|
||||
font-size:40px;
|
||||
margin:4px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -65,86 +65,10 @@
|
|||
</el-header>
|
||||
<el-main>
|
||||
<el-container>
|
||||
<el-aside style="width: 35%">
|
||||
<el-aside v-show="showEqInfo" style="width: 35%">
|
||||
<div class="aside_one">
|
||||
<div class="pageTitle">排放口及关联设备静态信息</div>
|
||||
<div class="linesWrap">
|
||||
<div class="typeLine">
|
||||
<div class="greenBlock">
|
||||
<div class="greenBlockInner"></div>
|
||||
</div>
|
||||
<span>生产设备</span>
|
||||
</div>
|
||||
<div class="infoLine">
|
||||
<span class="circles"></span>
|
||||
<span>{{ eqs.name }}</span>
|
||||
</div>
|
||||
<el-row class="infoLine">
|
||||
<el-col :span="12">
|
||||
<div><span class="infotitle">设备类型：</span>主要生产设备</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div>
|
||||
<span class="infotitle">电机功率：</span>
|
||||
<span v-if="eqs.power_kw">{{ eqs.power_kw }}kw</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div>
|
||||
<span class="infotitle">生产能力：</span>
|
||||
<span v-if="eqs.parameter_json && eqs.parameter_json.生产能力">{{
|
||||
eqs.parameter_json.生产能力
|
||||
}}</span>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="typeLine">
|
||||
<div class="greenBlock">
|
||||
<div class="greenBlockInner"></div>
|
||||
</div>
|
||||
<span>治理设备</span>
|
||||
</div>
|
||||
<div class="infoLine">
|
||||
<span class="circles"></span>
|
||||
<span>{{ eqz.name }}</span>
|
||||
</div>
|
||||
<el-row class="infoLine">
|
||||
<el-col :span="12">
|
||||
<div><span class="infotitle">风量：</span>
|
||||
<span v-if="eqz.parameter_json && eqz.parameter_json.风量">{{
|
||||
eqz.parameter_json.风量
|
||||
}}m³/h</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div><span class="infotitle">过滤面积：</span>
|
||||
<span v-if="eqz.parameter_json && eqz.parameter_json.过滤面积">{{
|
||||
eqz.parameter_json.过滤面积
|
||||
}} m²</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div><span class="infotitle">布袋材质：</span>
|
||||
<span v-if="eqz.parameter_json && eqz.parameter_json.布袋材质">{{
|
||||
eqz.parameter_json.布袋材质
|
||||
}} </span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div><span class="infotitle">过滤风速：</span>
|
||||
<span v-if="eqz.parameter_json && eqz.parameter_json.过滤风速">{{
|
||||
eqz.parameter_json.过滤风速
|
||||
}} </span>m/min
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div><span class="infotitle">额定功率：</span>
|
||||
<span v-if="eqz.parameter_json && eqz.parameter_json.额定功率">{{
|
||||
eqz.parameter_json.额定功率
|
||||
}} </span> Kw
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="typeLine">
|
||||
<div class="greenBlock">
|
||||
<div class="greenBlockInner"></div>
|
||||
|
|
@ -153,7 +77,7 @@
|
|||
<span>排放口</span>
|
||||
</div>
|
||||
<div class="infoLine">
|
||||
<span class="circles"></span>
|
||||
<span class="circles circles_1"></span>
|
||||
<span>{{ detailItem.name }}</span>
|
||||
</div>
|
||||
<el-row class="infoLine">
|
||||
|
|
@ -172,6 +96,82 @@
|
|||
<div><span class="infotitle">治理措施： </span>{{ detailItem.measure }}</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="typeLine">
|
||||
<div class="greenBlock">
|
||||
<div class="greenBlockInner"></div>
|
||||
</div>
|
||||
<span>生产设备</span>
|
||||
</div>
|
||||
<div class="infoLine">
|
||||
<span :class="['circles', {'circles_1':eqs.running_state==10}]"></span>
|
||||
<span>{{ eqs.name }}</span>
|
||||
</div>
|
||||
<el-row class="infoLine">
|
||||
<el-col :span="12">
|
||||
<div><span class="infotitle">设备类型：</span>主要生产设备</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div>
|
||||
<span class="infotitle">电机功率：</span>
|
||||
<span v-if="eqs.power_kw">{{ eqs.power_kw }}kw</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div>
|
||||
<span class="infotitle">生产能力：</span>
|
||||
<span v-if="eqs.parameter_json && eqs.parameter_json.生产能力">
|
||||
{{eqs.parameter_json.生产能力}}
|
||||
</span>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="typeLine">
|
||||
<div class="greenBlock">
|
||||
<div class="greenBlockInner"></div>
|
||||
</div>
|
||||
<span>治理设备</span>
|
||||
</div>
|
||||
<div class="infoLine">
|
||||
<span :class="['circles', {'circles_1':eqz.running_state==10}]"></span>
|
||||
<span>{{ eqz.name }}</span>
|
||||
</div>
|
||||
<el-row class="infoLine">
|
||||
<el-col :span="12">
|
||||
<div><span class="infotitle">风量：</span>
|
||||
<span v-if="eqz.parameter_json && eqz.parameter_json.风量">
|
||||
{{eqz.parameter_json.风量}}m³/h
|
||||
</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div><span class="infotitle">过滤面积：</span>
|
||||
<span v-if="eqz.parameter_json && eqz.parameter_json.过滤面积">
|
||||
{{eqz.parameter_json.过滤面积}} m²
|
||||
</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div><span class="infotitle">布袋材质：</span>
|
||||
<span v-if="eqz.parameter_json && eqz.parameter_json.布袋材质">
|
||||
{{eqz.parameter_json.布袋材质}}
|
||||
</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div><span class="infotitle">过滤风速：</span>
|
||||
<span v-if="eqz.parameter_json && eqz.parameter_json.过滤风速">
|
||||
{{eqz.parameter_json.过滤风速}} m/min
|
||||
</span>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div><span class="infotitle">额定功率：</span>
|
||||
<span v-if="eqz.parameter_json && eqz.parameter_json.额定功率">
|
||||
{{eqz.parameter_json.额定功率}} Kw
|
||||
</span>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="typeLine">
|
||||
<div class="greenBlock">
|
||||
<div class="greenBlockInner"></div>
|
||||
|
|
@ -179,7 +179,7 @@
|
|||
<span>监测设备</span>
|
||||
</div>
|
||||
<div class="infoLine">
|
||||
<span class="circles"></span>
|
||||
<span :class="['circles', {'circles_1':eqc.running_state==10}]"></span>
|
||||
<span>{{ eqc.name }}</span>
|
||||
</div>
|
||||
<el-row class="infoLine">
|
||||
|
|
@ -217,10 +217,24 @@
|
|||
<div><span class="infotitle">含氧量：</span> 0.000 %</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="typeLine">
|
||||
<div class="greenBlock">
|
||||
<div class="greenBlockInner"></div>
|
||||
</div>
|
||||
<span>监控设备</span>
|
||||
</div>
|
||||
<div class="infoLine">
|
||||
<span :class="['circles', {'circles_1':eqk.running_state==10}]"></span>
|
||||
<span>{{ eqk.name }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-aside>
|
||||
<el-main>
|
||||
<el-main style="position: relative;overflow: visible;">
|
||||
<div :class="{'hiddenIcon_hidden':!showEqInfo,'hiddenIcon':'1'}" class="hiddenIcon" @click="hiddenChange">
|
||||
<el-icon v-if="showEqInfo" class="hiddenImg"><ArrowLeftBold /></el-icon>
|
||||
<el-icon v-else class="hiddenImg"><ArrowRightBold /></el-icon>
|
||||
</div>
|
||||
<div class="aside_side">
|
||||
<div class="pageTitle">排放口及关联设备动态信息</div>
|
||||
<div id="dataChart" style="width: 100%; height:280px;margin-top:4px; padding: 4px"></div>
|
||||
|
|
@ -229,7 +243,6 @@
|
|||
<div style="height: 4px"></div>
|
||||
<div id="dataChart3" style="width: 100%; height:140px;padding: 4px"></div>
|
||||
</div>
|
||||
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-main>
|
||||
|
|
@ -331,12 +344,23 @@ export default {
|
|||
yAxis: {},
|
||||
series: [{ type: 'line' }]
|
||||
},
|
||||
eqs: {},
|
||||
eqc: {},
|
||||
eqz: {}
|
||||
showEqInfo:true,
|
||||
eqs: {},//生产设备
|
||||
eqc: {},//监测设备
|
||||
eqz: {},//治理设备
|
||||
eqk: {},//监控设备
|
||||
resizeTimeout:null,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// this.addListener();
|
||||
},
|
||||
methods: {
|
||||
hiddenChange(){
|
||||
let that = this;
|
||||
that.showEqInfo = !that.showEqInfo;
|
||||
that.addListener();
|
||||
},
|
||||
handleQuery() {
|
||||
this.$refs.table.queryData(this.query);
|
||||
},
|
||||
|
|
@ -453,6 +477,25 @@ export default {
|
|||
})
|
||||
})
|
||||
},
|
||||
resizeChart(name) {
|
||||
var myChart = echarts.getInstanceByDom(
|
||||
document.getElementById(name)
|
||||
);
|
||||
if (myChart != undefined) {
|
||||
myChart.resize();
|
||||
}
|
||||
},
|
||||
addListener() {
|
||||
var that = this;
|
||||
if (this.resizeTimeout) {
|
||||
clearTimeout(this.resizeTimeout);
|
||||
}
|
||||
this.resizeTimeout = setTimeout(function () {
|
||||
that.resizeChart("dataChart");
|
||||
that.resizeChart("dataChart2");
|
||||
that.resizeChart("dataChart3");
|
||||
}, 300);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -600,4 +643,24 @@ export default {
|
|||
font-weight: normal;
|
||||
color: #dddddd;
|
||||
}
|
||||
|
||||
.hiddenIcon{
|
||||
top:45%;
|
||||
left:-25px;
|
||||
width:50px;
|
||||
height:50px;
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
border-radius: 25px;
|
||||
border: 1px solid rgba(254,254,254,.3);
|
||||
box-shadow: 0 0 7px 2px rgba(254,254,254,.5);
|
||||
background: rgba(255,255,255,.5);
|
||||
}
|
||||
.hiddenIcon_hidden{
|
||||
left:0;
|
||||
}
|
||||
.hiddenImg{
|
||||
font-size:40px;
|
||||
margin:4px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -32,6 +32,10 @@
|
|||
<el-table-column prop="name" label="污染源名称" />
|
||||
<el-table-column prop="name" label="污染源类型" />
|
||||
<el-table-column prop="mgroup_name" label="所属工段" />
|
||||
<el-table-column prop="" label="生产设备" />
|
||||
<el-table-column prop="" label="治理设备" />
|
||||
<el-table-column prop="" label="监测设备" />
|
||||
<el-table-column prop="" label="监控设备" />
|
||||
</scTable>
|
||||
</el-main>
|
||||
</el-container>
|
||||
|
|
|
|||
|
|
@ -1,45 +0,0 @@
|
|||
<template>
|
||||
<el-container>
|
||||
<el-header class="panel_title">
|
||||
<el-menu mode="horizontal" :default-active="activeIndex" :ellipsis="false" @select="handleSelect">
|
||||
<el-menu-item index="1">厂区环境治理</el-menu-item>
|
||||
<el-menu-item index="2">生产过程治理</el-menu-item>
|
||||
<el-menu-item index="3">物料输送治理</el-menu-item>
|
||||
</el-menu>
|
||||
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
<smartg_carwash v-if="activeIndex == '1'"></smartg_carwash>
|
||||
<smartg_prod v-if="activeIndex == '2'"></smartg_prod>
|
||||
<smartg_trans v-if="activeIndex == '3'"></smartg_trans>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
<script>
|
||||
import smartg_carwash from "./smartg_carwash.vue";
|
||||
import smartg_prod from "./smartg_prod.vue";
|
||||
import smartg_trans from "./smarg_trans.vue";
|
||||
export default {
|
||||
components: {
|
||||
smartg_carwash,
|
||||
smartg_prod,
|
||||
smartg_trans
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeIndex: "1",
|
||||
tableData: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSelect(key, keyPath) {
|
||||
this.activeIndex = key;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.el-tabs {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,4 +1,12 @@
|
|||
<template>
|
||||
<el-container>
|
||||
<el-header class="panel_title">
|
||||
<div class="left-panel">洗车平台</div>
|
||||
<div class="right-panel">
|
||||
<el-button type="primary" @click="backtoMap">返回地图</el-button>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<el-container>
|
||||
<el-aside width="69%" style="margin-right:1%;border-right:0">
|
||||
<el-container>
|
||||
|
|
@ -45,20 +53,10 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
</scTable>
|
||||
<!-- <el-container>
|
||||
<el-header class="">
|
||||
<div class="left-panel">
|
||||
<span>厂区环境(PM10):</span>
|
||||
<span style="color: green"> 36ug/m3</span>
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
|
||||
</el-main>
|
||||
</el-container> -->
|
||||
</el-main>
|
||||
</el-container>
|
||||
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -72,8 +72,8 @@
|
|||
command="pollutant2"
|
||||
>污染源监测</el-dropdown-item
|
||||
>
|
||||
<el-dropdown-item command="smartg"
|
||||
>智能治理</el-dropdown-item
|
||||
<el-dropdown-item command="carwash"
|
||||
>洗车平台</el-dropdown-item
|
||||
>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
|
|
@ -157,7 +157,7 @@
|
|||
@command="handleClick5"
|
||||
>
|
||||
<span class="el-dropdown-link">
|
||||
台账管理
|
||||
环境管理
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu class="enpMenu">
|
||||
|
|
@ -214,30 +214,6 @@
|
|||
class="bigScreenTable"
|
||||
:noIndex="noIndex"
|
||||
></scScrollTavle>
|
||||
<!-- <div class="tableHear" style="padding: 0 1vh;">
|
||||
<div style="flex:1;height:1vh"></div>
|
||||
<div style="flex:5;margin: 0 1vh;">设备名称</div>
|
||||
<div style="flex:2">颗粒物</div>
|
||||
<div style="flex:2">SO₂</div>
|
||||
<div style="flex:2">NOx</div>
|
||||
</div>
|
||||
<div class="rowItem">
|
||||
<div class="rowindex">1</div>
|
||||
<div class="rowname">设备名称</div>
|
||||
<div class="rownum">
|
||||
<span v-if="cemsData.envdata && cemsData.envdata.dust_zs !== null">{{ cemsData.envdata.dust_zs }}</span>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
<div class="rownum">
|
||||
<span v-if="cemsData.envdata && cemsData.envdata.so2_zs !== null">{{ cemsData.envdata.so2_zs
|
||||
}}</span>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
<div class="rownum">
|
||||
<span v-if="cemsData.envdata && cemsData.envdata.nox_zs !== null">{{ cemsData.envdata.nox_zs }}</span>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- 接入设备数量总览 -->
|
||||
|
|
@ -363,27 +339,6 @@
|
|||
class="bigScreenTable"
|
||||
:noIndex="noIndex"
|
||||
></scScrollTavle>
|
||||
<!-- <div>
|
||||
<div class="tableHear"
|
||||
style="margin:1vh 0;height:2.6vh;line-height:2.6vh;display:flex;padding:1vh;font-size:1.2vh">
|
||||
<div style="flex:2">监测设备名称</div>
|
||||
<div style="flex:1">PM10(μg/m³)</div>
|
||||
<div style="flex:1">PM2.5(μg/m³)</div>
|
||||
</div>
|
||||
<div class="tableBody">
|
||||
<div v-for="item in wData" :key="item">
|
||||
<div class="badyItem">
|
||||
<div style="flex:2">
|
||||
<img src="img/enp_blue/listImg.png"
|
||||
style="width:2vh;height:2vh;margin:1.2vh 1vh;vertical-align:middle">
|
||||
<span>{{ item.name }}</span>
|
||||
</div>
|
||||
<span style="flex:1" v-if="item.envdata">{{ item.envdata.pm10 }}</span>
|
||||
<span style="flex:1" v-if="item.envdata">{{ item.envdata.pm25 }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<!-- 今日车辆统计数据 -->
|
||||
<div class="panel panel2">
|
||||
|
|
@ -396,35 +351,30 @@
|
|||
</div>
|
||||
<div style="display: flex">
|
||||
<div class="chart" id="pieChart"></div>
|
||||
<div
|
||||
style="
|
||||
flex-shrink: 1;
|
||||
width: 100px;
|
||||
align-self: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
"
|
||||
>
|
||||
<div class="carStaticWrap">
|
||||
<div style="display:flex">
|
||||
<div
|
||||
class="todyCarItem"
|
||||
v-for="item in pieData"
|
||||
:key="item"
|
||||
>
|
||||
<span style="color: #d5d5d5">{{
|
||||
item.name
|
||||
}}</span>
|
||||
<span
|
||||
style="
|
||||
font-size: 35px;
|
||||
color: #00f6ff;
|
||||
font-weight: bold;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
"
|
||||
>{{ item.value }}</span
|
||||
<span class="carStaticText" style="color: #d5d5d5">{{item.name}}</span>
|
||||
<span class="carStaticNum">{{ item.value }}</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display:flex">
|
||||
<div
|
||||
class="todyCarItem"
|
||||
v-for="item in pieData"
|
||||
:key="item"
|
||||
>
|
||||
<span class="carStaticText" style="color: #d5d5d5">{{item.name}}</span>
|
||||
<span class="carStaticNum">{{ item.value }}</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 环卫车作业情况 -->
|
||||
|
|
@ -518,10 +468,10 @@
|
|||
v-else-if="activeDrawerName == 'pollutant2'"
|
||||
@close="closeDialog"
|
||||
></pollutant2>
|
||||
<smartg
|
||||
v-else-if="activeDrawerName == 'smartg'"
|
||||
<carwash
|
||||
v-else-if="activeDrawerName == 'carwash'"
|
||||
@close="closeDialog"
|
||||
></smartg>
|
||||
></carwash>
|
||||
<videowall
|
||||
v-else-if="activeDrawerName == 'video'"
|
||||
@close="closeDialog"
|
||||
|
|
@ -548,7 +498,8 @@ import pollutecalendar from "./enpComponents/pollutecalendar.vue";
|
|||
import eqments from "./enpComponents/eqments.vue"; //台账
|
||||
import alarmrecord from "./enpComponents/alarmrecord.vue";
|
||||
import pollutant2 from "./enpComponents/pollutant2.vue";
|
||||
import smartg from "./enpComponents/smartg.vue";
|
||||
import carwash from "./enpComponents/smartg_carwash.vue";
|
||||
import carmanager from "./enpComponents/carManager.vue";
|
||||
import videowall from "./enpComponents/video.vue";
|
||||
import scScrollTavle from "@/components/scScrollTable.vue";
|
||||
// import 'babylonjs-loaders';
|
||||
|
|
@ -569,7 +520,7 @@ export default {
|
|||
eqments,
|
||||
alarmrecord,
|
||||
pollutant2,
|
||||
smartg,
|
||||
carwash,
|
||||
videowall,
|
||||
scScrollTavle,
|
||||
},
|
||||
|
|
@ -661,7 +612,7 @@ export default {
|
|||
refValue1: "moocBox1",
|
||||
table1Visible: false,
|
||||
lineData: [],
|
||||
liData1: ["设备名称", "颗粒物", "SO₂", "NOx"],
|
||||
liData1: ["设备名称", "颗粒物", "SO₂", "NOx" , "氨气"],
|
||||
refValue2: "moocBox2",
|
||||
table2Visible: false,
|
||||
lineData2: [],
|
||||
|
|
@ -733,7 +684,8 @@ export default {
|
|||
obj1 = {},
|
||||
obj2 = {},
|
||||
obj3 = {},
|
||||
obj4 = {};
|
||||
obj4 = {},
|
||||
obj5 = {};
|
||||
obj1.elType = "primary";
|
||||
obj1.value = item.name; //设备名称
|
||||
obj2.elType = "primary";
|
||||
|
|
@ -751,10 +703,16 @@ export default {
|
|||
item.envdata && item.envdata.nox_zs
|
||||
? item.envdata.nox_zs
|
||||
: "-"; //NOx折算值
|
||||
obj5.elType = "primary";
|
||||
obj5.value =
|
||||
item.envdata && item.envdata.ammonia_e
|
||||
? item.envdata.ammonia_e
|
||||
: "-"; //氨气折算值
|
||||
arr.push(obj1);
|
||||
arr.push(obj2);
|
||||
arr.push(obj3);
|
||||
arr.push(obj4);
|
||||
arr.push(obj5);
|
||||
lineData.push(arr);
|
||||
});
|
||||
this.lineData = lineData;
|
||||
|
|
@ -1342,12 +1300,7 @@ header {
|
|||
#pieChart {
|
||||
flex: 1;
|
||||
}
|
||||
.todyCarItem {
|
||||
color: white;
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.pieDataItem {
|
||||
width: 50%;
|
||||
height: 49%;
|
||||
|
|
@ -1451,4 +1404,31 @@ header {
|
|||
background-image: url("/public/img/enp_blue/right_border.png");
|
||||
}
|
||||
/* 左右两边border，暂时没展示 */
|
||||
/* 车辆统计-start */
|
||||
.carStaticWrap{
|
||||
flex-shrink: 1;
|
||||
width: 150px;
|
||||
align-self: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.todyCarItem {
|
||||
width:75px;
|
||||
color: white;
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.carStaticText{
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
}
|
||||
.carStaticNum{
|
||||
font-size: 35px;
|
||||
color: #00f6ff;
|
||||
font-weight: bold;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
}
|
||||
/* 车辆统计-end */
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue