From 68416ae7a99fd2f211f3f30572cf4df4e54355e6 Mon Sep 17 00:00:00 2001
From: shijing <sj_mzw@163.com>
Date: Mon, 19 Feb 2024 10:55:51 +0800
Subject: [PATCH] =?UTF-8?q?=E8=8F=9C=E5=8D=95=E5=8F=98=E5=8A=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../bigScreen/enpComponents/alarmrecord.vue   |  51 +++
 .../bigScreen/enpComponents/envirmonitor.vue  |  97 ++++++
 .../enpComponents/envirqualmonitor.vue        | 239 +++++++++++++
 src/views/bigScreen/enpComponents/ledger.vue  |  97 ++++++
 .../bigScreen/enpComponents/pollutant.vue     | 316 +++++++++++++++++-
 .../enpComponents/pollutecalendar.vue         |  51 +++
 src/views/bigScreen/index_enp_blue.vue        |  72 +++-
 7 files changed, 913 insertions(+), 10 deletions(-)
 create mode 100644 src/views/bigScreen/enpComponents/alarmrecord.vue
 create mode 100644 src/views/bigScreen/enpComponents/envirmonitor.vue
 create mode 100644 src/views/bigScreen/enpComponents/envirqualmonitor.vue
 create mode 100644 src/views/bigScreen/enpComponents/ledger.vue
 create mode 100644 src/views/bigScreen/enpComponents/pollutecalendar.vue

diff --git a/src/views/bigScreen/enpComponents/alarmrecord.vue b/src/views/bigScreen/enpComponents/alarmrecord.vue
new file mode 100644
index 00000000..089603b6
--- /dev/null
+++ b/src/views/bigScreen/enpComponents/alarmrecord.vue
@@ -0,0 +1,51 @@
+<template>
+    <el-container>
+        <el-main class="nopadding">
+            <el-container>
+                <el-header>
+                    <div class="panel_title">报警记录</div>
+                </el-header>
+                <el-main class="nopadding">
+                    <el-container>
+                        <el-header>
+                            <div class="searchWrap">
+                                <el-select v-model="query.cate" placeholder="污染源分类" @change="handleQuery" clearable>
+                                    <el-option v-for="item in cateOptions" :key="item.id" :label="item.name"
+                                        :value="item.id"></el-option>
+                                </el-select>
+                            </div>
+                        </el-header>
+                        <el-main class="nopadding">
+                            <scTable ref="table" :data="tableData" style="width: 100%;" size="large" :apiObj="apiObj"
+                                row-key="id" :params="params" :query="query" hidePagination @row-click="rowClick">
+                                <el-table-column type="index" width="50" />
+                                <el-table-column prop="number" label="污染源编号" width="180" />
+                                <el-table-column prop="name" label="污染源名称" />
+                                <el-table-column prop="name" label="污染源类型" />
+                                <el-table-column prop="mgroup_name" label="所属工段" />
+                            </scTable>
+                        </el-main>
+                    </el-container>
+                </el-main>
+            </el-container>
+        </el-main>
+
+    </el-container>
+</template>
+<script>
+export default {
+    data() {
+        return {
+            query: {},
+            cateOptions: [{ id: 'mtrans', name: '生产工艺' }, { id: 'product', name: '物料输送' }, { id: 'mstore', name: '物料储存' }],
+            apiObj: this.$API.enp.drain.list,
+            params: { type: 20 },
+        }
+    },
+    methods: {
+        handleQuery() {
+            this.$refs.table.queryData(this.query);
+        }
+    }
+}
+</script>
\ No newline at end of file
diff --git a/src/views/bigScreen/enpComponents/envirmonitor.vue b/src/views/bigScreen/enpComponents/envirmonitor.vue
new file mode 100644
index 00000000..48ea7ee0
--- /dev/null
+++ b/src/views/bigScreen/enpComponents/envirmonitor.vue
@@ -0,0 +1,97 @@
+<template>
+    <el-container>
+        <el-header>
+            <div class="panel_title">
+                环境监测清单
+                <div class="backMap" @click="backtoMap">
+                    切换地图
+                    <el-icon>
+                        <Switch />
+                    </el-icon>
+                </div>
+            </div>
+        </el-header>
+        <el-main class="nopadding">
+            <el-container>
+                <el-header>
+                    <div class="searchWrap">
+                        <div style="font-size: 1vh;">
+                            车辆总数：<span class="totalNumber">0</span>
+                        </div>
+                        <div>
+                            <el-select v-model="query.timetype" placeholder="时间类型" @change="timeHandleQuery" clearable>
+                                <el-option v-for="item in timeOptions" :key="item" :label="item" :value="item"></el-option>
+                            </el-select>
+                            <!-- 时间 -->
+                            <el-date-picker v-model="query.time" v-if="query.timetype == '日'" type="date" placeholder="选择时间"
+                                format="YYYY-MM-DD" value-format="YYYY-MM-DD" :picker-options="pickerOptions" />
+                            <el-date-picker v-model="query.time" v-else-if="query.timetype == '月'" type="month"
+                                placeholder="选择月" format="YYYY-MM" value-format="YYYY-MM" :picker-options="pickerOptions" />
+                            <el-date-picker v-model="query.time" v-else-if="query.timetype == '年'" type="year"
+                                placeholder="选择年" format="YYYY" value-format="YYYY" :picker-options="pickerOptions" />
+                            <el-select v-model="query.cate" placeholder="车辆分类" @change="carHandleQuery" clearable>
+                                <el-option v-for="item in cateOptions" :key="item.id" :label="item.name"
+                                    :value="item.id"></el-option>
+                            </el-select>
+                            <el-select v-model="query.type" placeholder="出入类型" style="width:7vw">
+                                <el-option v-for="item in typeOptions" :key="item.id" :label="item.name" :value="item.id">
+                                </el-option>
+                            </el-select>
+                            <el-select v-model="query.status" placeholder="行驶证状态" style="width:7vw">
+                                <el-option v-for="item in statusOptions" :key="item.id" :label="item.name" :value="item.id">
+                                </el-option>
+                            </el-select>
+                            <el-input :input-style="searchInputStyle" style="width:7vw;margin:0 5px" v-model="query.search"
+                                placeholder=""></el-input>
+                            <el-button @click="handleQuery">查询</el-button>
+                        </div>
+                    </div>
+                </el-header>
+                <el-main>
+                    <scTable :data="tableData" :apiObj="apiObj" size="large" 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="level" label="过门禁时间"></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="mgroup" label="车辆识别代号（VIN）"></el-table-column>
+                        <el-table-column prop="mgroup" label="行驶证状态"></el-table-column>
+                    </scTable>
+                </el-main>
+            </el-container>
+        </el-main>
+    </el-container>
+</template>
+<script>
+export default {
+    data() {
+        return {
+            query: {},
+            cateOptions: [
+                { id: 1, name: '货车' },
+                { id: 2, name: '罐车' },
+            ],
+            typeOptions: [
+                { id: '', name: '全部' },
+                { id: 1, name: '进厂' },
+                { id: 2, name: '出厂' }
+            ],
+            statusOptions: [
+                { id: '', name: '全部' },
+                { id: 10, name: '已录入' },
+                { id: 20, name: '未录入' }
+            ],
+            timeOptions: ['日', '月', '年'],
+            apiObj: this.$API.enp.vehicle_access,
+            params: { type: 2 },
+        }
+    },
+    methods: {
+        handleQuery() {
+            this.$refs.table.queryData(this.query);
+        },
+        timeHandleQuery() { },
+        carHandleQuery() { },
+    }
+}
+</script>
\ No newline at end of file
diff --git a/src/views/bigScreen/enpComponents/envirqualmonitor.vue b/src/views/bigScreen/enpComponents/envirqualmonitor.vue
new file mode 100644
index 00000000..9b3bb3a7
--- /dev/null
+++ b/src/views/bigScreen/enpComponents/envirqualmonitor.vue
@@ -0,0 +1,239 @@
+<template>
+    <el-container>
+        <el-header style="height: 40%;padding: 0;">
+            <el-container>
+                <el-header>
+                    <div class="panel_title">环境质量监测
+                        <div class="backMap" @click="backtoMap">
+                            切换地图
+                            <el-icon>
+                                <Switch />
+                            </el-icon>
+                        </div>
+                    </div>
+                </el-header>
+                <el-main class="nopadding">
+                    <scTable :data="tableData" style="width: 100%;" size="large" :apiObj="apiObj" row-key="id"
+                        :params="params" hidePagination hideDo @row-click="rowClick">
+                        <el-table-column type="index" width="50" />
+                        <el-table-column prop="equipment_number" label="设备编号" width="120" />
+                        <el-table-column prop="equipment_name" label="设备名称" width="180" />
+                        <el-table-column prop="name" label="监测状态" />
+                        <el-table-column label="颗粒物实测(mg/m3)" width="180">
+                            <template #default="scope">
+                                {{ scope.row.equipment_envdata.dust_rtd ? scope.row.equipment_envdata.dust_rtd : '-' }}
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="颗粒物折算(mg/m3)" width="180">
+                            <template #default="scope">
+                                {{ scope.row.equipment_envdata.dust_zs ? scope.row.equipment_envdata.dust_zs : '-' }}
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="温度(℃)">
+                            <template #default="scope">
+                                {{ scope.row.equipment_envdata.temperature ? scope.row.equipment_envdata.temperature : '-'
+                                }}
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="压力(KPa)">
+                            <template #default="scope">
+                                {{ scope.row.equipment_envdata.pressure ? scope.row.equipment_envdata.pressure : '-' }}
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="流速(m/s)">
+                            <template #default="scope">
+                                {{ scope.row.equipment_envdata.speed ? scope.row.equipment_envdata.speed : '-' }}
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="湿度(%)">
+                            <template #default="scope">
+                                {{ scope.row.equipment_envdata.humidity ? scope.row.equipment_envdata.humidity : '-' }}
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="流量(m3/h)">
+                            <template #default="scope">
+                                {{ scope.row.equipment_envdata.flux ? scope.row.equipment_envdata.flux : '-' }}
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="监测达标率" />
+                    </scTable>
+                </el-main>
+            </el-container>
+
+        </el-header>
+        <el-main class="nopadding">
+            <el-container>
+                <el-main class="nopadding">
+                    <el-container>
+                        <el-header>
+                            <div class="panel_title">
+                                <div style="display: flex;justify-content: space-between;">
+                                    <div class="left-panel">
+                                        环境空气质量监测实时数据
+                                    </div>
+                                    <div class="right-panel">
+                                        <el-select v-model="query.time_bucket" placeholder="周期" style="margin-left:4px"
+                                            @change="handleQuery">
+                                            <el-option v-for="item in timeOptions" :key="item.value" :label="item.label"
+                                                :value="item.value" />
+                                        </el-select>
+                                        <el-select v-model="query.type" placeholder="污染源" style="margin-left:4px"
+                                            @change="handleQuery">
+                                            <el-option v-for="item in typeOptions" :key="item" :label="item"
+                                                :value="item" />
+                                        </el-select>
+                                    </div>
+                                </div>
+                            </div>
+                        </el-header>
+                        <el-main class="nppadding">
+                            <scTable :data="tableData" style="width: 100%;" size="large" :apiObj="apiObj" row-key="id"
+                                :params="params" hideDo @row-click="rowClick">
+                                <el-table-column type="index" />
+                                <el-table-column label="站点名称" />
+                                <el-table-column label="0" />
+                                <el-table-column label="5" />
+                                <el-table-column label="10" />
+                                <el-table-column label="15" />
+                                <el-table-column label="20" />
+                                <el-table-column label="25" />
+                                <el-table-column label="30" />
+                                <el-table-column label="35" />
+                                <el-table-column label="40" />
+                                <el-table-column label="45" />
+                                <el-table-column label="50" />
+                                <el-table-column label="55" />
+                                <el-table-column label="小时均值" />
+                            </scTable>
+                        </el-main>
+                    </el-container>
+                </el-main>
+            </el-container>
+        </el-main>
+    </el-container>
+</template>
+<script>
+import * as echarts from "echarts";
+export default {
+    data() {
+        return {
+            apiObj: this.$API.enp.drain_equip.list,
+            params: { drain__type: 10, equipment__type: 20, has_envdata: 'yes' },
+            currentEquipmentId: '',
+            currentEquipmentName: '',
+            typeOptions: ['PM2.5', 'PM10'],
+            timeOptions: [
+                { label: '分钟上报值', value: '1 minute' },
+                { label: '小时均值', value: '1 hour' },
+                { label: '日均值', value: '1 day' },
+            ],
+            basicOption: {
+                title: {
+                    text: '设备名称'
+                },
+                tooltip: {
+                    trigger: 'axis'
+                },
+                grid: {
+                    left: '3%',
+                    right: '4%',
+                    bottom: '3%',
+                    containLabel: true
+                },
+                legend: {
+
+                    // itemStyle: {
+                    //     color: '#fff'
+                    // }
+                },
+                toolbox: {
+                    feature: {
+                        saveAsImage: {}
+                    }
+                },
+                dataset: {
+                    source: []
+                },
+                xAxis: { type: 'category' },
+                yAxis: {},
+                series: [{ type: 'line' }, { type: 'line' }, { type: 'line' }, { type: 'line' }, { type: 'line' }, { type: 'line' }]
+            },
+            query: {
+                "end_time": "",
+                "start_time": "",
+                "time_bucket": "1 hour",
+                "equipment_id": ''
+            }
+        }
+    },
+    mounted() {
+        this.initTimeRange()
+    },
+    methods: {
+        initTimeRange() {
+            var now = new Date();
+            var start = new Date();
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 3);
+            this.timeRange = [start, now]
+        },
+        rowClick(row) {
+            this.currentEquipmentId = row.equipment;
+            this.currentEquipmentName = row.equipment_name;
+            this.query.equipment_id = row.equipment;
+            this.$nextTick(() => { this.handleQuery() })
+
+        },
+        initChart() {
+            var that = this;
+            var myChart = echarts.getInstanceByDom(document.getElementById('cChart'));
+            if (myChart == undefined) {
+                myChart = echarts.init(document.getElementById('cChart'), 'dark');
+            }
+            myChart.showLoading();
+            this.$API.bi.dataset.exec.req('enp_edata2', {
+                query: this.query,
+                raise_exception: true
+            }).then(res => {
+                let newOption = Object.assign({}, this.basicOption);
+                let ds0 = res.data.ds0
+                ds0.pop()
+                let series = []
+                if (ds0) {
+                    let ds00 = ds0[0]
+                    for (var x = 1, y = ds00.length; x < y; x++) {
+                        series.push({ type: 'line' })
+                    }
+                }
+                newOption.dataset.source = res.data.ds0;
+                newOption.series = series;
+                newOption.title.text = this.currentEquipmentName;
+                myChart.setOption(newOption);
+            }).then(() => { myChart.hideLoading() })
+
+        },
+        handleQuery() {
+            let that = this;
+            let timeRange = Object.assign([], that.timeRange);;
+            let time1 = timeRange[0]
+            let time2 = timeRange[1];
+            let formatstr = 'yyyy-MM-dd hh:mm:ss'
+            if (this.query.time_bucket == '1 minute') {
+                time2 = new Date(time2.getTime() + 1000 * 60);
+                formatstr = 'yyyy-MM-dd hh:mm:00'
+            }
+            else if (this.query.time_bucket == '1 hour') {
+                time2 = new Date(time2.getTime() + 1000 * 60 * 60);
+                formatstr = 'yyyy-MM-dd hh:00:00'
+            }
+            else if (this.query.time_bucket == '1 day') {
+                time2 = new Date(time2.getTime() + 1000 * 60 * 60 * 24);
+                formatstr = 'yyyy-MM-dd'
+            }
+            this.query.start_time = this.$TOOL.dateFormat(time1, formatstr)
+            this.query.end_time = this.$TOOL.dateFormat(time2, formatstr)
+            // this.initChart()
+        }
+    },
+
+}
+</script>
\ No newline at end of file
diff --git a/src/views/bigScreen/enpComponents/ledger.vue b/src/views/bigScreen/enpComponents/ledger.vue
new file mode 100644
index 00000000..bb6bd0a7
--- /dev/null
+++ b/src/views/bigScreen/enpComponents/ledger.vue
@@ -0,0 +1,97 @@
+<template>
+    <el-container>
+        <el-header>
+            <div class="panel_title">
+                环境管理台账
+                <div class="backMap" @click="backtoMap">
+                    切换地图
+                    <el-icon>
+                        <Switch />
+                    </el-icon>
+                </div>
+            </div>
+        </el-header>
+        <el-main class="nopadding">
+            <el-container>
+                <el-header>
+                    <div class="searchWrap">
+                        <div style="font-size: 1vh;">
+                            车辆总数：<span class="totalNumber">0</span>
+                        </div>
+                        <div>
+                            <el-select v-model="query.timetype" placeholder="时间类型" @change="timeHandleQuery" clearable>
+                                <el-option v-for="item in timeOptions" :key="item" :label="item" :value="item"></el-option>
+                            </el-select>
+                            <!-- 时间 -->
+                            <el-date-picker v-model="query.time" v-if="query.timetype == '日'" type="date" placeholder="选择时间"
+                                format="YYYY-MM-DD" value-format="YYYY-MM-DD" :picker-options="pickerOptions" />
+                            <el-date-picker v-model="query.time" v-else-if="query.timetype == '月'" type="month"
+                                placeholder="选择月" format="YYYY-MM" value-format="YYYY-MM" :picker-options="pickerOptions" />
+                            <el-date-picker v-model="query.time" v-else-if="query.timetype == '年'" type="year"
+                                placeholder="选择年" format="YYYY" value-format="YYYY" :picker-options="pickerOptions" />
+                            <el-select v-model="query.cate" placeholder="车辆分类" @change="carHandleQuery" clearable>
+                                <el-option v-for="item in cateOptions" :key="item.id" :label="item.name"
+                                    :value="item.id"></el-option>
+                            </el-select>
+                            <el-select v-model="query.type" placeholder="出入类型" style="width:7vw">
+                                <el-option v-for="item in typeOptions" :key="item.id" :label="item.name" :value="item.id">
+                                </el-option>
+                            </el-select>
+                            <el-select v-model="query.status" placeholder="行驶证状态" style="width:7vw">
+                                <el-option v-for="item in statusOptions" :key="item.id" :label="item.name" :value="item.id">
+                                </el-option>
+                            </el-select>
+                            <el-input :input-style="searchInputStyle" style="width:7vw;margin:0 5px" v-model="query.search"
+                                placeholder=""></el-input>
+                            <el-button @click="handleQuery">查询</el-button>
+                        </div>
+                    </div>
+                </el-header>
+                <el-main>
+                    <scTable :data="tableData" :apiObj="apiObj" size="large" 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="level" label="过门禁时间"></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="mgroup" label="车辆识别代号（VIN）"></el-table-column>
+                        <el-table-column prop="mgroup" label="行驶证状态"></el-table-column>
+                    </scTable>
+                </el-main>
+            </el-container>
+        </el-main>
+    </el-container>
+</template>
+<script>
+export default {
+    data() {
+        return {
+            query: {},
+            cateOptions: [
+                { id: 1, name: '货车' },
+                { id: 2, name: '罐车' },
+            ],
+            typeOptions: [
+                { id: '', name: '全部' },
+                { id: 1, name: '进厂' },
+                { id: 2, name: '出厂' }
+            ],
+            statusOptions: [
+                { id: '', name: '全部' },
+                { id: 10, name: '已录入' },
+                { id: 20, name: '未录入' }
+            ],
+            timeOptions: ['日', '月', '年'],
+            apiObj: this.$API.enp.vehicle_access,
+            params: { type: 2 },
+        }
+    },
+    methods: {
+        handleQuery() {
+            this.$refs.table.queryData(this.query);
+        },
+        timeHandleQuery() { },
+        carHandleQuery() { },
+    }
+}
+</script>
\ No newline at end of file
diff --git a/src/views/bigScreen/enpComponents/pollutant.vue b/src/views/bigScreen/enpComponents/pollutant.vue
index b8be1f74..3d19719d 100644
--- a/src/views/bigScreen/enpComponents/pollutant.vue
+++ b/src/views/bigScreen/enpComponents/pollutant.vue
@@ -1,5 +1,5 @@
 <template>
-    <el-container>
+    <el-container v-if="!pollutantDetail">
         <el-main class="nopadding">
             <el-container>
                 <el-header>
@@ -29,23 +29,335 @@
                 </el-main>
             </el-container>
         </el-main>
+    </el-container>
+    <el-container v-else>
+        <el-header>
+            <div class="panel_title">污染源及关联设备信息
+                <span class="backBtn" @click="handleClick"> 返回 </span>
+            </div>
+        </el-header>
+        <el-main>
+            <el-container>
+                <el-aside 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>
+                                </div>
 
+                                <span>污染源</span>
+                            </div>
+                            <div class="infoLine">
+                                <span class="circles"></span>
+                                <span>{{ detailItem.name }}</span>
+                            </div>
+                            <el-row class="infoLine">
+                                <el-col :span="12">
+                                    <div><span class="infotitle">排气筒高度：</span>{{ detailItem.height }} m</div>
+                                </el-col>
+                                <el-col :span="12">
+                                    <div><span class="infotitle">废气处理量：</span> {{ detailItem.treatment_capacity }} m³/h
+                                    </div>
+                                </el-col>
+                                <el-col :span="12">
+                                    <div><span class="infotitle">PM超低排放限值： </span> {{ detailItem.pm_limit }} mg/Nm³</div>
+                                </el-col>
+                                <el-col :span="12">
+                                    <div><span class="infotitle">排污许可状况： </span>已许可</div>
+                                </el-col>
+                                <el-col :span="12">
+                                    <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"></span>
+                                <span>{{ eqc.name }}</span>
+                            </div>
+                            <el-row class="infoLine">
+                                <el-col :span="24">
+                                    <div>
+                                        <span class="infotitle">颗粒物：（实测值）</span>0.218 mg/m³
+                                        <span class="infotitle">（折算值）</span>0.218 mg/m³
+                                    </div>
+                                </el-col>
+                                <el-col :span="24">
+                                    <div>
+                                        <span class="infotitle">SO2：（实测值）</span>0.218 mg/m³
+                                        <span class="infotitle">（折算值）</span>0.218 mg/m³
+                                    </div>
+                                </el-col>
+                                <el-col :span="24">
+                                    <div>
+                                        <span class="infotitle">NOX：（实测值）</span>0.218 mg/m³
+                                        <span class="infotitle">（折算值）</span>0.218 mg/m³
+                                    </div>
+                                </el-col>
+                                <el-col :span="12">
+                                    <div><span class="infotitle">流量：</span> 0.000 m³/h</div>
+                                </el-col>
+                                <el-col :span="12">
+                                    <div><span class="infotitle">温度：</span> 0.000 ℃</div>
+                                </el-col>
+                                <el-col :span="12">
+                                    <div><span class="infotitle">湿度：</span> 0.000 %</div>
+                                </el-col>
+                                <el-col :span="12">
+                                    <div><span class="infotitle">压力：</span> 0.000 MPa</div>
+                                </el-col>
+                                <el-col :span="12">
+                                    <div><span class="infotitle">含氧量：</span> 0.000 %</div>
+                                </el-col>
+                            </el-row>
+                        </div>
+                    </div>
+                </el-aside>
+                <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>
+
+                </el-main>
+            </el-container>
+        </el-main>
     </el-container>
 </template>
 <script>
+import * as echarts from "echarts";
 export default {
     data() {
         return {
+            eqs: {},
+            eqc: {},
+            eqz: {},
+            pollutantDetail: false,
             query: {},
+
             cateOptions: [{ id: 'mtrans', name: '生产工艺' }, { id: 'product', name: '物料输送' }, { id: 'mstore', name: '物料储存' }],
             apiObj: this.$API.enp.drain.list,
             params: { type: 20 },
+            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",
+            },
+            basicOption: {
+                title: {
+                    text: '设备名称',
+                    left: 'center',
+                    top: 'top',
+                    textStyle: {
+                        color: '#fff'
+                    }
+                },
+                legend: {
+                },
+                tooltip: {
+                    trigger: 'axis'
+                },
+                grid: {
+                    left: '3%',
+                    right: '4%',
+                    bottom: '3%',
+                    containLabel: true
+                },
+                dataZoom: [
+                    {
+                        type: 'inside',
+                        start: 0,
+                        end: 20
+                    },
+                    {
+                        start: 0,
+                        end: 20
+                    }
+                ],
+                dataset: {
+                    source: []
+                },
+                xAxis: { type: 'category' },
+                yAxis: {},
+                series: [{ type: 'line' }]
+            },
         }
     },
     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;
+        },
         handleQuery() {
             this.$refs.table.queryData(this.query);
-        }
+        },
+        rowClick(row) {
+            this.pollutantDetail = true;
+            this.detailItem = row;
+            this.$nextTick(() => {
+                this.getEquipments(row.equipments);
+                this.getDetailData();
+            })
+        },
+        getEquipments(ids) {
+            let that = this;
+            console.log(ids);
+            ids.forEach(id => {
+                that.$API.em.equipment.item.req(id).then(res => {
+                    if (res.type == 10) {
+                        that.eqs = res;
+                        that.getDetailData(1, id);
+                    } else if (res.type == 20) {
+                        that.eqc = res;
+                        that.getDetailData(2, id);
+                    } else if (res.type == 30) {
+                        that.eqz = res;
+                        that.getDetailData(3, id);
+                    }
+                })
+            });
+        },
+        getDetailData(type, id) {
+            var that = this;
+            if (type == 1) {
+                var chartDom = document.getElementById('dataChart');
+                var myChart = echarts.init(chartDom);
+            } else if (type == 2) {
+                var chartDom2 = document.getElementById('dataChart2');
+                var myChart2 = echarts.init(chartDom2);
+            } 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);
+            }
+            let obj = that.biquery;
+            obj.equipment_id = id;
+            let params = { query: obj };
+            that.$API.bi.dataset.exec.req('eq_status', 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.setOption(newOption);
+                } else if (type == 2) {
+                    newOption.title.text = that.eqc.name;
+                    myChart2.setOption(newOption);
+                    echarts.connect([myChart, myChart2])
+                } else if (type == 3) {
+                    newOption.title.text = that.eqz.name;
+                    myChart3.setOption(newOption);
+                    echarts.connect([myChart2, myChart3])
+                } else {
+                    newOption.title.text = that.eqc.name;
+                    myChart4.setOption(newOption);
+                    echarts.connect([myChart3, myChart4])
+                }
+            }).then(() => { myChart.hideLoading() })
+            myChart.hideLoading()
+        },
+        handleClick() {
+            this.pollutantDetail = false;
+            this.detailItem = {};
+        },
     }
 }
 </script>
\ No newline at end of file
diff --git a/src/views/bigScreen/enpComponents/pollutecalendar.vue b/src/views/bigScreen/enpComponents/pollutecalendar.vue
new file mode 100644
index 00000000..367dfc66
--- /dev/null
+++ b/src/views/bigScreen/enpComponents/pollutecalendar.vue
@@ -0,0 +1,51 @@
+<template>
+    <el-container>
+        <el-main class="nopadding">
+            <el-container>
+                <el-header>
+                    <div class="panel_title">污染日历</div>
+                </el-header>
+                <el-main class="nopadding">
+                    <el-container>
+                        <el-header>
+                            <div class="searchWrap">
+                                <el-select v-model="query.cate" placeholder="污染源分类" @change="handleQuery" clearable>
+                                    <el-option v-for="item in cateOptions" :key="item.id" :label="item.name"
+                                        :value="item.id"></el-option>
+                                </el-select>
+                            </div>
+                        </el-header>
+                        <el-main class="nopadding">
+                            <scTable ref="table" :data="tableData" style="width: 100%;" size="large" :apiObj="apiObj"
+                                row-key="id" :params="params" :query="query" hidePagination @row-click="rowClick">
+                                <el-table-column type="index" width="50" />
+                                <el-table-column prop="number" label="污染源编号" width="180" />
+                                <el-table-column prop="name" label="污染源名称" />
+                                <el-table-column prop="name" label="污染源类型" />
+                                <el-table-column prop="mgroup_name" label="所属工段" />
+                            </scTable>
+                        </el-main>
+                    </el-container>
+                </el-main>
+            </el-container>
+        </el-main>
+
+    </el-container>
+</template>
+<script>
+export default {
+    data() {
+        return {
+            query: {},
+            cateOptions: [{ id: 'mtrans', name: '生产工艺' }, { id: 'product', name: '物料输送' }, { id: 'mstore', name: '物料储存' }],
+            apiObj: this.$API.enp.drain.list,
+            params: { type: 20 },
+        }
+    },
+    methods: {
+        handleQuery() {
+            this.$refs.table.queryData(this.query);
+        }
+    }
+}
+</script>
\ No newline at end of file
diff --git a/src/views/bigScreen/index_enp_blue.vue b/src/views/bigScreen/index_enp_blue.vue
index 6c46e1e0..c14a6b0c 100644
--- a/src/views/bigScreen/index_enp_blue.vue
+++ b/src/views/bigScreen/index_enp_blue.vue
@@ -71,11 +71,39 @@
               </el-dropdown>
             </div>
           </div>
-          <div :class="bindClass(4)">
-            <div class="menuItem">环保管理</div>
+          <div :class="bindClass(4)" @click="menuClick(4)">
+            <!-- <div class="menuItem">环保管理</div> -->
+            <div class="menuItem">
+              <el-dropdown class="dropdown" trigger="click" @command="handleClick4">
+                <span class="el-dropdown-link">
+                  环保管理
+                </span>
+                <template #dropdown>
+                  <el-dropdown-menu class="enpMenu">
+                    <el-dropdown-item command="envirqualmonitor">环境质量监测</el-dropdown-item>
+                    <el-dropdown-item command="envirmonitor">环境监测清单</el-dropdown-item>
+                    <el-dropdown-item command="pollutecalendar">污染日历</el-dropdown-item>
+                    <el-dropdown-item command="">决策分析</el-dropdown-item>
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </div>
           </div>
-          <div :class="bindClass(5)">
-            <div class="menuItem">台账管理</div>
+          <div :class="bindClass(5)" @click="menuClick(5)">
+            <!-- <div class="menuItem">台账管理</div> -->
+            <div class="menuItem">
+              <el-dropdown class="dropdown" trigger="click" @command="handleClick4">
+                <span class="el-dropdown-link">
+                  台账管理
+                </span>
+                <template #dropdown>
+                  <el-dropdown-menu class="enpMenu">
+                    <el-dropdown-item command="ledger">环境管理台账</el-dropdown-item>
+                    <el-dropdown-item command="alarmrecord">报警记录 </el-dropdown-item>
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </div>
           </div>
           <div class="wraning_icon"></div>
           <div class="user_icon" @click="backSystem"></div>
@@ -293,8 +321,16 @@
           <cems2-drawer v-else-if="activeDrawerName == 'cems2'" @close="closeDialog"></cems2-drawer>
           <cems-export v-else-if="activeDrawerName == 'cemsExport'" @close="closeDialog"></cems-export>
           <pollutant v-else-if="activeDrawerName == 'pollutant'" @close="closeDialog"></pollutant>
+          <!-- 运输清洁 -->
           <transport v-else-if="activeDrawerName == 'transport'" @close="closeDialog"></transport>
           <innerclean v-else-if="activeDrawerName == 'innerClean'" @close="closeDialog"></innerclean>
+          <!-- 环保管理 -->
+          <envirqualmonitor v-else-if="activeDrawerName == 'envirqualmonitor'" @close="closeDialog"></envirqualmonitor>
+          <envirmonitor v-else-if="activeDrawerName == 'envirmonitor'" @close="closeDialog"></envirmonitor>
+          <pollutecalendar v-else-if="activeDrawerName == 'pollutecalendar'" @close="closeDialog"></pollutecalendar>
+          <!-- 台账管理 -->
+          <ledger v-else-if="activeDrawerName == 'ledger'" @close="closeDialog"></ledger>
+          <alarmrecord v-else-if="activeDrawerName == 'alarmrecord'" @close="closeDialog"></alarmrecord>
         </el-drawer>
       </div>
     </el-main>
@@ -312,7 +348,12 @@ import cems2Drawer from './enpComponents/cems2.vue'
 import cemsExport from './enpComponents/cemsExport.vue'
 import pollutant from "./enpComponents/pollutant.vue"
 import innerclean from "./enpComponents/innerclean.vue"
-import transport from "./enpComponents/transport.vue"
+import transport from "./enpComponents/transport.vue";
+import envirqualmonitor from "./enpComponents/envirqualmonitor.vue";
+import envirmonitor from "./enpComponents/envirmonitor.vue";
+import pollutecalendar from "./enpComponents/pollutecalendar.vue";
+import ledger from "./enpComponents/ledger.vue";//台账
+import alarmrecord from "./enpComponents/alarmrecord.vue";
 import 'babylonjs-loaders';
 import 'animate.css';
 export default {
@@ -323,7 +364,12 @@ export default {
     cemsExport,
     pollutant,
     innerclean,
-    transport
+    transport,
+    envirqualmonitor,
+    envirmonitor,
+    pollutecalendar,
+    ledger,
+    alarmrecord
   },
   data() {
     return {
@@ -568,8 +614,8 @@ export default {
       }
       return classInfo
     },
-    menuClick() {
-      this.activeIndex = 0;
+    menuClick(index) {
+      this.activeIndex = index;
     },
     handleClick(command) {
       this.activeIndex = 1;
@@ -586,6 +632,16 @@ export default {
       this.elDrawer = true;
       this.activeDrawerName = command;
     },
+    handleClick4(command) {
+      this.activeIndex = 4;
+      this.elDrawer = true;
+      this.activeDrawerName = command;
+    },
+    handleClick5(command) {
+      this.activeIndex = 5;
+      this.elDrawer = true;
+      this.activeDrawerName = command;
+    },
     getMessage(msg) {
       console.log(msg);
     },