fix: 无组织页面调整
This commit is contained in:
parent
6b9c0064c9
commit
4c401c805a
|
|
@ -9,7 +9,11 @@ html.dark {
|
|||
--el-color-primary-light-7: var(--el-color-primary-dark-6) !important;
|
||||
--el-color-primary-light-5: var(--el-color-primary-dark-4) !important;
|
||||
--el-color-primary-light-3: var(--el-color-primary-dark-3) !important;
|
||||
--el-menu-active-color: #ffffff !important;
|
||||
|
||||
.el-tag {
|
||||
background-color: #f8f5f5 !important;
|
||||
}
|
||||
//背景
|
||||
#app {
|
||||
background: var(--el-bg-color);
|
||||
|
|
|
|||
|
|
@ -52,6 +52,11 @@ export const runningStateEnum = new EnumFactory({
|
|||
50: { text: '未知', type: 'info' },
|
||||
}, parseInt)
|
||||
|
||||
export const onlingEnum = new EnumFactory({
|
||||
1: { text: '在线', type: 'success' },
|
||||
0: { text: '离线', type: 'info' },
|
||||
}, parseInt)
|
||||
|
||||
export const drainTypeEnum = new EnumFactory({
|
||||
'product': '生产工艺',
|
||||
'mtrans': '物料输送',
|
||||
|
|
|
|||
|
|
@ -4,6 +4,9 @@
|
|||
<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>
|
||||
|
|
@ -166,10 +169,11 @@
|
|||
<el-main>
|
||||
<div class="aside_side">
|
||||
<div class="pageTitle">污染源及关联设备动态信息</div>
|
||||
<div id="dataChart" style="width: 100%; height:200px;margin-top:1vh"></div>
|
||||
<div id="dataChart2" style="width: 100%; height:200px;margin-top:1vh"></div>
|
||||
<div id="dataChart3" style="width: 100%; height:200px;margin-top:1vh"></div>
|
||||
<div id="dataChart4" style="width: 100%; height:200px;margin-top:1vh"></div>
|
||||
<div id="dataChart2" style="width: 100%; height:200px;margin-top:1vh; padding: 4px"></div>
|
||||
<div id="dataChart" style="width: 100%; height:200px;margin-top:1vh; padding: 4px"></div>
|
||||
|
||||
<div id="dataChart3" style="width: 100%; height:200px;margin-top:1vh; padding: 4px"></div>
|
||||
<!-- <div id="dataChart4" style="width: 100%; height:200px;margin-top:1vh"></div> -->
|
||||
</div>
|
||||
|
||||
</el-main>
|
||||
|
|
@ -201,7 +205,7 @@ export default {
|
|||
biquery: {
|
||||
end_time: '2024-02-01',
|
||||
start_time: '2024-01-29',
|
||||
time_bucket: "1 minute",
|
||||
time_bucket: "5 minute",
|
||||
equipment_id: "3491356310052896768",
|
||||
},
|
||||
basicOption: {
|
||||
|
|
@ -247,19 +251,29 @@ export default {
|
|||
series: [{ type: 'line' }]
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
initDom() {
|
||||
var chart1 = echarts.init(document.getElementById('dataChart'), 'dark');
|
||||
var chart2 = echarts.init(document.getElementById('dataChart2'), 'dark');
|
||||
var chart3 = echarts.init(document.getElementById('dataChart3'), 'dark');
|
||||
echarts.connect([chart1, chart2, chart3]);
|
||||
},
|
||||
backtoMap() {
|
||||
this.$emit('close')
|
||||
},
|
||||
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;
|
||||
var start = new Date();
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 3);
|
||||
this.biquery['start_time'] = this.$TOOL.dateFormat(start, 'yyyy-MM-dd hh:mm:00')
|
||||
this.biquery['end_time'] = this.$TOOL.dateFormat(now, 'yyyy-MM-dd hh:mm:00')
|
||||
},
|
||||
handleQuery() {
|
||||
this.$refs.table.queryData(this.query);
|
||||
|
|
@ -269,21 +283,22 @@ export default {
|
|||
this.detailItem = row;
|
||||
this.$nextTick(() => {
|
||||
this.getEquipments(row.equipments);
|
||||
this.getDetailData();
|
||||
this.initTimeNow();
|
||||
this.initDom();
|
||||
})
|
||||
},
|
||||
getEquipments(ids) {
|
||||
let that = this;
|
||||
console.log(ids);
|
||||
let reqs = [];
|
||||
ids.forEach(id => {
|
||||
that.$API.em.equipment.item.req(id).then(res => {
|
||||
if (res.type == 10) {
|
||||
if (res.type == 10) { //生产设备
|
||||
that.eqs = res;
|
||||
that.getDetailData(1, id);
|
||||
} else if (res.type == 20) {
|
||||
} else if (res.type == 40) { //监测设备
|
||||
that.eqc = res;
|
||||
that.getDetailData(2, id);
|
||||
} else if (res.type == 30) {
|
||||
} else if (res.type == 30) { //治理设备
|
||||
that.eqz = res;
|
||||
that.getDetailData(3, id);
|
||||
}
|
||||
|
|
@ -292,44 +307,55 @@ export default {
|
|||
},
|
||||
getDetailData(type, id) {
|
||||
var that = this;
|
||||
var bicode = 'enp_edata2'
|
||||
if (type == 1) {
|
||||
var chartDom = document.getElementById('dataChart');
|
||||
var myChart = echarts.init(chartDom);
|
||||
var myChart = echarts.getInstanceByDom(document.getElementById('dataChart'));
|
||||
bicode = 'eq_status'
|
||||
myChart.showLoading();
|
||||
} else if (type == 2) {
|
||||
var chartDom2 = document.getElementById('dataChart2');
|
||||
var myChart2 = echarts.init(chartDom2);
|
||||
var myChart2 = echarts.getInstanceByDom(document.getElementById('dataChart2'));
|
||||
myChart2.showLoading();
|
||||
} else if (type == 3) {
|
||||
var chartDom3 = document.getElementById('dataChart3');
|
||||
var myChart3 = echarts.init(chartDom3);
|
||||
} else {
|
||||
var chartDom4 = document.getElementById('dataChart4');
|
||||
var myChart4 = echarts.init(chartDom4);
|
||||
var myChart3 = echarts.getInstanceByDom(document.getElementById('dataChart3'));
|
||||
bicode = 'eq_status'
|
||||
myChart3.showLoading();
|
||||
}
|
||||
// else {
|
||||
// var chartDom4 = document.getElementById('dataChart4');
|
||||
// var myChart4 = echarts.init(chartDom4);
|
||||
// }
|
||||
let obj = that.biquery;
|
||||
obj.equipment_id = id;
|
||||
let params = { query: obj };
|
||||
that.$API.bi.dataset.exec.req('eq_status', params).then(res => {
|
||||
that.$API.bi.dataset.exec.req(bicode, params).then(res => {
|
||||
let newOption = Object.assign({}, this.basicOption);
|
||||
newOption.dataset.source = res.data.ds0;
|
||||
newOption.dataZoom.startValue = that.biquery.start_time;
|
||||
if (type == 1) {
|
||||
newOption.title.text = that.eqs.name;
|
||||
myChart.hideLoading()
|
||||
myChart.setOption(newOption);
|
||||
} else if (type == 2) {
|
||||
newOption.series = [
|
||||
{ type: 'line', encode: { y: 'tsp', seriesName: ["tsp"] } },
|
||||
{ type: 'line', encode: { y: '温度', seriesName: ["温度"] } },
|
||||
{ type: 'line', encode: { y: '压力', seriesName: ["压力"] } }]
|
||||
newOption.title.text = that.eqc.name;
|
||||
newOption.yAxis.minInterval = 1;
|
||||
myChart2.setOption(newOption);
|
||||
echarts.connect([myChart, myChart2])
|
||||
myChart2.hideLoading()
|
||||
} else if (type == 3) {
|
||||
newOption.title.text = that.eqz.name;
|
||||
newOption.yAxis.minInterval = 1;
|
||||
myChart3.setOption(newOption);
|
||||
echarts.connect([myChart2, myChart3])
|
||||
} else {
|
||||
newOption.title.text = that.eqc.name;
|
||||
myChart4.setOption(newOption);
|
||||
echarts.connect([myChart3, myChart4])
|
||||
myChart3.hideLoading()
|
||||
}
|
||||
}).then(() => { myChart.hideLoading() })
|
||||
myChart.hideLoading()
|
||||
// else {
|
||||
// newOption.title.text = that.eqc.name;
|
||||
// myChart4.setOption(newOption);
|
||||
// echarts.connect([myChart3, myChart4])
|
||||
// }
|
||||
})
|
||||
},
|
||||
handleClick() {
|
||||
this.pollutantDetail = false;
|
||||
|
|
|
|||
|
|
@ -4,6 +4,9 @@
|
|||
<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">
|
||||
<scTable :data="tableData" style="width: 100%;" size="large" :apiObj="apiObj" row-key="id"
|
||||
|
|
@ -127,6 +130,9 @@ export default {
|
|||
this.initTimeRange()
|
||||
},
|
||||
methods: {
|
||||
backtoMap() {
|
||||
this.$emit('close')
|
||||
},
|
||||
initTimeRange() {
|
||||
var now = new Date();
|
||||
var start = new Date();
|
||||
|
|
|
|||
|
|
@ -8,13 +8,16 @@
|
|||
</el-select>
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
<el-tag v-for="item in runningStateEnum" v-bind:key="item" :type="item.type">
|
||||
{{ item.text }}
|
||||
</el-tag>
|
||||
<!-- <div class="typebox">
|
||||
<span style="color:red;">
|
||||
<img style="height: 16px; weight: 16px;"
|
||||
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAQCAYAAAAbBi9cAAABgElEQVQ4T52TzS4DURiG3++0op0REgtiU2emKsSmSz8XwB2oK1BXgCtQV4ArUFeAC/Cz7I7QzkxtJBYSkhmVtOeTM6Hamv6Z7XneZ97v/BD6fK401xEHrLJ/2QulXosMxJ5so6SZlBNkCWh043uK3LSxTUzHOszEeasSnAwtepybHB9pfD6AMB2KGC/12GgmU359j5J1beRK84AE9lpDrFCwPH9/YJEzk5gVCXEPokRbiLmmamrBfq5VO2WRjTzbPAWQ07B0/JDxbJO/w0Xp+Ft9Ra5MLhOJaxBCwR8Rg5nVquV93LbKOhuRZxlXIFr5gSIa6Z2/kW6wps/gh2sTuTK5SUIUW/8UKdIGpXKW93H2R+RKJEgYdwDJQUQAe6yCRctDTfPNRq5t7hJQ6Pdk2q4DsGc5/mFTVE5jKq5MffkmOkXdRgs5xltd+PNzFbyEjaq2ccSgfFSbnqJwJD6edYIdqqbGlhBXJQbFhxnrd5O5jrrI6uM+B9HGfyTNDPPFF8KilQlAZVW/AAAAAElFTkSuQmCC" />
|
||||
产治未同步</span>
|
||||
</div> -->
|
||||
<div class="typebox">
|
||||
<!-- <div class="typebox">
|
||||
<div class="greenb radio"></div>
|
||||
<div class="green">设备正常</div>
|
||||
</div>
|
||||
|
|
@ -29,7 +32,7 @@
|
|||
<div class="typebox">
|
||||
<div class="redb radio"></div>
|
||||
<div class="red">设备故障</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
|
|
@ -42,10 +45,13 @@
|
|||
<template #default="scope">
|
||||
<div v-for="item in scope.row.equip_data" v-bind:key="item.id">
|
||||
<div v-if="item.type == 10">
|
||||
<span>{{ item.name }} |
|
||||
待机 <span style="font-weight:bold; font-size: 1.6vh">{{ item.total_duration_standby
|
||||
<div>
|
||||
<el-tag :type="runningStateEnum[item.running_state]?.type">{{
|
||||
runningStateEnum[item.running_state]?.text }}</el-tag>|
|
||||
{{ item.name }} |
|
||||
运行时间 <span style="font-weight:bold; font-size: 1.6vh">{{ item.total_duration_run
|
||||
}}</span> h
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -54,10 +60,11 @@
|
|||
<template #default="scope">
|
||||
<div v-for="item in scope.row.equip_data" v-bind:key="item.id">
|
||||
<div v-if="item.type == 30">
|
||||
<span>{{ item.name }} |
|
||||
待机 <span style="font-weight:bold; font-size: 1.6vh">{{ item.total_duration_standby
|
||||
<div><el-tag :type="runningStateEnum[item.running_state]?.type">{{
|
||||
runningStateEnum[item.running_state]?.text }}</el-tag>|{{ item.name }} |
|
||||
运行时间 <span style="font-weight:bold; font-size: 1.6vh">{{ item.total_duration_run
|
||||
}}</span> h
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -65,11 +72,9 @@
|
|||
<el-table-column label="监测设备">
|
||||
<template #default="scope">
|
||||
<div v-for="item in scope.row.equip_data" v-bind:key="item.id">
|
||||
<div v-if="item.type == 20">
|
||||
<span>{{ item.name }} |
|
||||
待机 <span style="font-weight:bold; font-size: 1.6vh">{{ item.total_duration_standby
|
||||
}}</span> h
|
||||
</span>
|
||||
<div v-if="item.type == 40">
|
||||
<div>{{ item.avg_tsp }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -79,9 +84,11 @@
|
|||
</el-container>
|
||||
</template>
|
||||
<script>
|
||||
import { runningStateEnum } from "@/utils/enum.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
runningStateEnum,
|
||||
apiObj: null,
|
||||
params: { type: 20, has_equipdata: 'yes', cate: 'mtrans' },
|
||||
query: {},
|
||||
|
|
|
|||
|
|
@ -8,13 +8,16 @@
|
|||
</el-select>
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
<el-tag v-for="item in runningStateEnum" v-bind:key="item" :type="item.type">
|
||||
{{ item.text }}
|
||||
</el-tag>
|
||||
<!-- <div class="typebox">
|
||||
<span style="color:red;">
|
||||
<img style="height: 16px; weight: 16px;"
|
||||
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAQCAYAAAAbBi9cAAABgElEQVQ4T52TzS4DURiG3++0op0REgtiU2emKsSmSz8XwB2oK1BXgCtQV4ArUFeAC/Cz7I7QzkxtJBYSkhmVtOeTM6Hamv6Z7XneZ97v/BD6fK401xEHrLJ/2QulXosMxJ5so6SZlBNkCWh043uK3LSxTUzHOszEeasSnAwtepybHB9pfD6AMB2KGC/12GgmU359j5J1beRK84AE9lpDrFCwPH9/YJEzk5gVCXEPokRbiLmmamrBfq5VO2WRjTzbPAWQ07B0/JDxbJO/w0Xp+Ft9Ra5MLhOJaxBCwR8Rg5nVquV93LbKOhuRZxlXIFr5gSIa6Z2/kW6wps/gh2sTuTK5SUIUW/8UKdIGpXKW93H2R+RKJEgYdwDJQUQAe6yCRctDTfPNRq5t7hJQ6Pdk2q4DsGc5/mFTVE5jKq5MffkmOkXdRgs5xltd+PNzFbyEjaq2ccSgfFSbnqJwJD6edYIdqqbGlhBXJQbFhxnrd5O5jrrI6uM+B9HGfyTNDPPFF8KilQlAZVW/AAAAAElFTkSuQmCC" />
|
||||
产治未同步</span>
|
||||
</div> -->
|
||||
<div class="typebox">
|
||||
<!-- <div class="typebox">
|
||||
<div class="greenb radio"></div>
|
||||
<div class="green">设备正常</div>
|
||||
</div>
|
||||
|
|
@ -29,23 +32,26 @@
|
|||
<div class="typebox">
|
||||
<div class="redb radio"></div>
|
||||
<div class="red">设备故障</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main class="nopadding">
|
||||
<scTable style="width: 100%;" size="large" :apiObj="apiObj" row-key="id" :params="params" hidePagination
|
||||
hideDo :query="query">
|
||||
<el-table-column prop="number" label="污染源编号" />
|
||||
<el-table-column prop="name" label="污染源名称" />
|
||||
<el-table-column prop="mgroup_name" label="所在工段" />
|
||||
<el-table-column prop="number" label="编号" width="80" />
|
||||
<el-table-column prop="name" label="污染源名称" width="180" />
|
||||
<el-table-column prop="mgroup_name" label="所在工段" width="180" />
|
||||
<el-table-column label="生产设备">
|
||||
<template #default="scope">
|
||||
<div v-for="item in scope.row.equip_data" v-bind:key="item.id">
|
||||
<div v-if="item.type == 10">
|
||||
<span>{{ item.name }} |
|
||||
<div>
|
||||
<el-tag :type="runningStateEnum[item.running_state]?.type">{{
|
||||
runningStateEnum[item.running_state]?.text }}</el-tag>|
|
||||
{{ item.name }} |
|
||||
运行时间 <span style="font-weight:bold; font-size: 1.6vh">{{ item.total_duration_run
|
||||
}}</span> h
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -54,10 +60,11 @@
|
|||
<template #default="scope">
|
||||
<div v-for="item in scope.row.equip_data" v-bind:key="item.id">
|
||||
<div v-if="item.type == 30">
|
||||
<span>{{ item.name }} |
|
||||
<div><el-tag :type="runningStateEnum[item.running_state]?.type">{{
|
||||
runningStateEnum[item.running_state]?.text }}</el-tag>|{{ item.name }} |
|
||||
运行时间 <span style="font-weight:bold; font-size: 1.6vh">{{ item.total_duration_run
|
||||
}}</span> h
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -65,9 +72,9 @@
|
|||
<el-table-column label="监测设备">
|
||||
<template #default="scope">
|
||||
<div v-for="item in scope.row.equip_data" v-bind:key="item.id">
|
||||
<div v-if="item.type == 20">
|
||||
<span>{{ item.avg_tsp }}
|
||||
</span>
|
||||
<div v-if="item.type == 40">
|
||||
<div>{{ item.avg_tsp }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -77,9 +84,11 @@
|
|||
</el-container>
|
||||
</template>
|
||||
<script>
|
||||
import { runningStateEnum } from "@/utils/enum.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
runningStateEnum,
|
||||
apiObj: null,
|
||||
params: { type: 20, has_equipdata: 'yes', cate: 'product' },
|
||||
query: {},
|
||||
|
|
|
|||
Loading…
Reference in New Issue