From 94791ca7adf3101a9935d9740ef3b718cf5f1dd1 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Wed, 12 Feb 2025 19:56:43 +0800
Subject: [PATCH] 突发事件模拟显示三级防控体系介绍
---
src/views/pd/index.vue | 12 ++
src/views/pd/components/rightContainer.vue | 65 ++++++++++++++++
src/views/pd/components/box/publicContent.vue | 26 ++++++
src/views/pd/components/box/fireSource.vue | 132 +++++++++++++++++++++++++++++++++
4 files changed, 232 insertions(+), 3 deletions(-)
diff --git a/src/views/pd/components/box/fireSource.vue b/src/views/pd/components/box/fireSource.vue
new file mode 100644
index 0000000..77fece5
--- /dev/null
+++ b/src/views/pd/components/box/fireSource.vue
@@ -0,0 +1,132 @@
+<!--
+ * @Author: shuishen 1109946754@qq.com
+ * @Date: 2023-03-13 14:54:26
+ * @LastEditors: shuishen 1109946754@qq.com
+ * @LastEditTime: 2024-11-27 14:30:53
+ * @FilePath: \bigScreen\src\views\pac\components\box\fireSource.vue
+ * @Description:
+ *
+ * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
+-->
+<script setup>
+import { Picture } from '@element-plus/icons-vue'
+
+import publicContent from './publicContent.vue'
+import { getAssetsFile } from 'utils/utils'
+const one = getAssetsFile('one.png', '/img')
+const two = getAssetsFile('two.png', '/img')
+const three = getAssetsFile('three.png', '/img')
+import { usePointStore } from 'store/usepoint'
+const pointStore = usePointStore()
+const sharedData = computed(() => pointStore.sharedData)
+
+let indexValue = ref(1)
+
+watch(sharedData, (newValue) => {
+ indexValue.value = newValue
+})
+</script>
+
+<template>
+ <public-content>
+ <template #content>
+ <div class="content_box">
+ <div v-if="indexValue == 1">
+ <div>
+ <!-- <img :src="one" alt=""> -->
+ <el-image :src="one" :zoom-rate="1.2" :max-scale="7" :min-scale="0.2" :preview-src-list="[one]"
+ :initial-index="4" fit="cover">
+ <template #error>
+ <div class="image-slot">
+ <el-icon>
+ <Picture />
+ </el-icon>
+ </div>
+ </template>
+ </el-image>
+ </div>
+ <div class="content_text">
+ 第一级应急防控体系，即事故废水不出企业，事故发生时，首先启动一级防控。关闭所有可能外溢事故污水的外排口，利用企业自身的围堰、应急池等环境应急防控设施，将污水控制在企业厂区内部。园区内所有企业均设置相应的事故应急池，企业雨水（清下水）排口设有监管部门控制的阀门。一旦发生物料泄漏及火灾等安全生产事故，相关企业快速断开雨水排口，联动打开事故应急池，将事故废水和消防尾水导入事故应急池。事故结束后，应急事故池中的废水进入厂区自身污水处理站处理，无污水处理站的企业按照监测结果进入园区污水处理厂处理。
+ </div>
+ </div>
+
+ <div v-if="indexValue == 2" class="content_img_text">
+ <div>
+ <!-- <img :src="two" alt=""> -->
+ <el-image :src="two" :zoom-rate="1.2" :max-scale="7" :min-scale="0.2" :preview-src-list="[two]"
+ :initial-index="4" fit="cover">
+ <template #error>
+ <div class="image-slot">
+ <el-icon>
+ <Picture />
+ </el-icon>
+ </div>
+ </template>
+ </el-image>
+ </div>
+ <div class="content_text_box">
+ <div class="content_text">
+ 一级防控能力不足时，启动二级防控。通过专用管道或临时转输措施，与相邻企业应急池、园区公共应急池等互联互通，拦截处置事故污水。第二级应急防控体系，即事故废水不出园区，事故废水储存在园区公共应急池及园区内雨水管网公共空间内。
+ </div>
+
+ <div class="content_text">
+ （1）公共应急池的选址。建设园区公共应急池或利用园区内干枯河道、低洼地带等进行改造，并设置独立管网进行事故废水的收集和输送，保证每家企业内部应急池与公共应急池有效连通；在事故废水超过设计标准的情况下，也可有效利用雨水管网分段建设闸门井进行废水容纳。一旦园区内企业发生事故，且消防尾水过量超出企业自身防控能力时，开启园区公共应急池阀门，企业内部无法收纳的消防事故水将通过应急管网流入公共应急池，将事故废水控制在园区应急池内，不进入区内河道。事故结束后，对公共应急池内收纳的事故废水进行监测，若达标，则就近排入河道；若不达标，则分批次用槽车送入园区污水处理厂处理。
+ </div>
+
+ <div class="content_text">
+ （2）公共应急池容量设计。根据《化工园区事故应急设施（池）建设标准》（T/CPCIF 0049—2020）进行公共应急池设置，以化工集中区产生事故废水外排量最大的一个企业计算。
+ </div>
+ </div>
+ </div>
+
+ <div v-if="indexValue == 3">
+ <div>
+ <!-- <img :src="three" alt=""> -->
+ <el-image :src="three" :zoom-rate="1.2" :max-scale="7" :min-scale="0.2" :preview-src-list="[three]"
+ :initial-index="4" fit="cover">
+ <template #error>
+ <div class="image-slot">
+ <el-icon>
+ <Picture />
+ </el-icon>
+ </div>
+ </template>
+ </el-image>
+ </div>
+ <div class="content_text">
+ 事态进一步扩大，污水进入园区内水体，启动三级防控。利用化工集中区内的坑塘、河道、沟渠以及周边水系等，构建环境应急防控空间，对进出园区的水体实施封闭或分段管控。结合化工集中区区实际，确定事故废水通过雨污管网在进入赣江前有效拦截，当发生重大企业突发环境事故或危化品运输车辆侧翻等事故时，事故废水流入化工集中区内水体，立即关闭应急闸坝，污染河道使用移动闸截断污染团（带）；同时根据污染团（带）所在位置，就近闸断园区内部河道形成临时应急池，防止污染团从园区内水系进一步扩散至外环境。事故结束后，对临时应急空间内水质进行监测，若达标，则开启河道应急闸坝；若不达标，则将临时应急空间内污水由水泵将河水分批次送入公共应急池，进一步送园区污水处理厂处理。
+ </div>
+ </div>
+
+ </div>
+ </template>
+ </public-content>
+</template>
+
+<style lang="scss" scoped>
+.content_box {
+ color: #fff;
+ // overflow: scroll;
+}
+
+.content_box img {
+ width: 100%;
+}
+
+.content_text_box {
+ height: 530px;
+ overflow: hidden;
+ overflow-y: auto;
+}
+
+
+.content_box .content_text {
+ // 首行缩进
+ text-indent: 2em;
+ width: 100%;
+ line-height: 25px;
+ // 字间距
+ letter-spacing: 2px;
+ font-size: 16px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/pd/components/box/publicContent.vue b/src/views/pd/components/box/publicContent.vue
new file mode 100644
index 0000000..2ff1476
--- /dev/null
+++ b/src/views/pd/components/box/publicContent.vue
@@ -0,0 +1,26 @@
+<!--
+ * @Author: shuishen 1109946754@qq.com
+ * @Date: 2023-03-13 14:54:26
+ * @LastEditors: shuishen 1109946754@qq.com
+ * @LastEditTime: 2024-10-25 18:33:46
+ * @FilePath: \bigScreen\src\views\statistics\components\box\publicContent.vue
+ * @Description:
+ *
+ * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
+-->
+<script setup>
+
+</script>
+
+<template>
+ <div class="content">
+ <slot name="content"></slot>
+ </div>
+</template>
+
+<style lang="scss" scoped>
+.content {
+ padding: 20px 0;
+ height: calc(100% - 32px);
+}
+</style>
\ No newline at end of file
diff --git a/src/views/pd/components/rightContainer.vue b/src/views/pd/components/rightContainer.vue
new file mode 100644
index 0000000..2221d2d
--- /dev/null
+++ b/src/views/pd/components/rightContainer.vue
@@ -0,0 +1,65 @@
+<!--
+ * @Author: shuishen 1109946754@qq.com
+ * @Date: 2023-03-10 15:27:59
+ * @LastEditors: shuishen 1109946754@qq.com
+ * @LastEditTime: 2024-10-26 14:49:05
+ * @FilePath: \bigScreen\src\views\survey\components\rightContainer.vue
+ * @Description:
+ *
+ * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
+-->
+<script setup>
+import fireSource from './box/fireSource.vue'
+</script>
+
+<template>
+ <div class="right-container">
+ <div class="fire-source box">
+ <title-box>
+ <template #titleName>
+ </template>
+ </title-box>
+ <fire-source></fire-source>
+ </div>
+ </div>
+</template>
+
+<style lang="scss" scoped>
+.right-container {
+ display: flex;
+ flex-direction: column;
+ padding: 20px;
+ position: absolute;
+ top: 0;
+ right: 0;
+ width: 440px;
+ height: 100%;
+ pointer-events: auto;
+ // background: none;
+
+ .box {
+ margin-top: 20px;
+
+ .header {
+ height: 32px;
+ background: url(/img/bg/sub-title.png) no-repeat;
+ }
+ }
+
+ .fire-source {
+ flex: 3;
+ }
+
+ .occur-statistics {
+ flex: 3;
+ }
+
+ .fire-trend {
+ flex: 4;
+ }
+
+ .box:first-child {
+ margin-top: 0;
+ }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/pd/index.vue b/src/views/pd/index.vue
index 64a2c87..1a10bc2 100644
--- a/src/views/pd/index.vue
+++ b/src/views/pd/index.vue
@@ -2,7 +2,7 @@
* @Author: shuishen 1109946754@qq.com
* @Date: 2023-03-10 15:27:59
* @LastEditors: shuishen 1109946754@qq.com
- * @LastEditTime: 2024-11-25 20:33:22
+ * @LastEditTime: 2025-02-12 19:37:16
* @FilePath: \bigScreen\src\views\pd\index.vue
* @Description: 综合设计
*
@@ -13,6 +13,10 @@
import dynamicPanel from './components/dynamicPanel.vue'
import { CaretLeft, CaretRight } from '@element-plus/icons-vue'
import { nextTick, onUnmounted } from 'vue'
+import rightContainer from './components/rightContainer.vue'
+
+import { useMap } from 'store/map'
+const mapStore = useMap()
const showPanel = ref(true)
@@ -21,11 +25,11 @@
}
nextTick(() => {
- EventBus.emit('restHandleCheckChange', `3-3-4`)
+ EventBus.emit('restHandleCheckChange', `3-9`)
})
onUnmounted(() => {
- EventBus.emit('restHandleDelChange', `3-3-4`)
+ EventBus.emit('restHandleDelChange', `3-9`)
})
</script>
@@ -41,6 +45,8 @@
</div>
<dynamic-panel v-show="showPanel" @closePanel="showPanelChange"></dynamic-panel>
+
+ <right-container v-show="mapStore.showPreLevel"></right-container>
</div>
</template>
--
Gitblit v1.9.3