zcdsj
/
factory_web
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

wry

This commit is contained in:
shijing 2024-01-31 16:22:34 +08:00
parent 187005d361
commit 755d02fa85
1 changed files with 81 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

95
src/views/bigScreen/enpComponents/orgwryList.vue
View File

@ -1,6 +1,9 @@
<template>
<div>
<el-card v-if="pfkdetail" class="enpelCard">
<div class="headerTitle">排放口及关联设备信息
<span class="backBtn" @click="handleClick"> 返回 </span>
</div>
<div style="display:flex;">
<!-- 设备信息 -->
<div class="leftCard">
@ -79,6 +82,7 @@
<!-- 表 -->
<div class="rightCard">
<div class="pageTitle">排放口及关联设备动态信息</div>
<div id="cChart" style="width: 100%; height:400px"></div>
</div>
</div>
</el-card>
@ -109,13 +113,20 @@
</div>
<!-- table表格 -->
<div style="margin-top:2vh" id="enpTable">
<scTable :data="tableData" calss="enpTable" style="" @row-click="rowClick">
<scTable :data="tableData" :apiObj="apiObj" calss="enpTable" style="" @row-click="rowClick">
<el-table-column prop="index" label="序号"></el-table-column>
<el-table-column prop="number" label="排放口编号"></el-table-column>
<el-table-column prop="name" label="排放口名称"></el-table-column>
<el-table-column prop="type" label="排放口类型"></el-table-column>
<el-table-column prop="level" label="排放口等级">
<template #default="scope">
<span>{{ level_[scope.row.level] }}</span>
</template>
</el-table-column>
<el-table-column prop="mgroup" label="所属工段"></el-table-column>
<el-table-column prop="eqpment" label="检测设备"></el-table-column>
<el-table-column prop="eqpment" label="监测设备">
<span
style="width:0.6vh;height:0.6vh;border-radius:0.35vh;background:green;display:inline-block;margin-right:5px"></span>达标
</el-table-column>
</scTable>
</div>
</el-card>
@ -126,6 +137,8 @@
export default {
data() {
return {
apiObj: this.$API.enp.drain.list,
params: { type: 10 },
options: [],
query: {
area: '',
@ -134,25 +147,63 @@ export default {
searchInputStyle: {
color: '#fff',
},
level_: {
10: '主要排放口',
20: '次要排放口'
},
pfkdetail: false,
tableData: [
{ index: 1, number: '20240130', name: '排放口1', type: '主要设备', mgroup: '水泥制成', eqpment: '达标' },
{ index: 1, number: '20240130', name: '排放口2', type: '主要设备', mgroup: '水泥制成', eqpment: '达标' },
{ index: 1, number: '20240130', name: '排放口3', type: '主要设备', mgroup: '水泥制成', eqpment: '达标' },
{ index: 1, number: '20240130', name: '排放口4', type: '主要设备', mgroup: '水泥制成', eqpment: '达标' },
{ index: 1, number: '20240130', name: '排放口5', type: '主要设备', mgroup: '水泥制成', eqpment: '达标' },
{ index: 1, number: '20240130', name: '排放口6', type: '主要设备', mgroup: '水泥制成', eqpment: '达标' },
{ index: 1, number: '20240130', name: '排放口7', type: '主要设备', mgroup: '水泥制成', eqpment: '达标' },
{ index: 1, number: '20240130', name: '排放口8', type: '主要设备', mgroup: '水泥制成', eqpment: '达标' },
{ index: 1, number: '20240130', name: '排放口9', type: '主要设备', mgroup: '水泥制成', eqpment: '达标' },
],
tableData: [],
detailItem: {},
basicOption: {
title: {
text: '设备名称'
},
tooltip: {
trigger: 'axis'
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
legend: {},
toolbox: {
feature: {
saveAsImage: {}
}
},
dataset: {
source: []
},
xAxis: { type: 'category' },
yAxis: {},
series: [{ type: 'line' }, { type: 'line' }, { type: 'line' }, { type: 'line' }, { type: 'line' }, { type: 'line' }]
},
detailForm: {
day: 18,
year: 2024,
month: 1
},
}
},
methods: {
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')
},
handleClick() {
this.pfkdetail = false;
this.detailItem = {};
},
rowClick(row) {
this.pfkdetail = true;
this.detailItem = row;
@ -235,6 +286,22 @@ export default {
}
/* */
.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: 0.6vw;
height: 0.6vw;