qa_portal_vue/app/pages/case/details.vue

158 lines
5.4 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="container">
<AppHead/>
<div class="banner">
<div class="banner_main">
<h2>合作案例</h2>
<p>安全第一 预防为主 综合治理</p>
</div>
</div>
<div class="case_main">
<div class="top">
<div class="top_wrap">
<div class="title">行业 <span class="line">|</span> </div>
<div class="num">
<div
v-for="(item, index) in industries"
:key="index"
class="item"
:class="{ active: activeIndex === index }"
@click="activeIndex = index"
>
{{ item }}
</div>
</div>
</div>
</div>
<div class="case_main_wrap">
<div class="new_main">
<div class="title">
<h2>安全生产事故 | 900余人被疏散广西一糖厂产生大量刺激性烟雾</h2>
</div>
<div class="main">
<p>
5月20日19时50分许广西百色市田东县南华糖业有限公司二糖厂存放的约12吨消毒剂(三氯异氰尿酸)因近期暴雨天气受潮发生反应,产生大量烟雾,散发出刺激性气味。
</p>
<p>田东县迅速反应及时处置保护群众生命财产安全。第一时间组成工作组及时对二糖厂生活区和周边居民共900多人进行疏散在该县体育馆设置临时安置点为群众提供矿泉水、口罩、席子、被子等物资。</p>
<p>在百色市生态环境、应急、消防等部门的现场指导下组织田东县应急、消防、生态环境、卫生健康等部门及专家开展现场处置工作。至21日凌晨2时20分许现场已无烟雾产生所有三氯异氰尿酸已安全转移周边区域烟雾均已消散。疏散的群众已全部安全返回。</p>
<p>生态环境部门21日2时50分完成现场监测7个监测点位中背景点厂界东北420米(上风向)氨气浓度为0.47mg/m³其余点位扣除背景点后氨气均未检出符合《恶臭污染物排放标准》(GB 14554-93)表1标准限值要求;所有点位氯气均未检出,符合《大气污染物综合排放标准》(GB 16297-1996)表1无组织排放监控限值要求事故未对周边环境产生不良影响。</p>
<p>近期,广西多地遭遇特大暴雨导致多处地段发生内涝暴雨过后仍不能放松警惕防潮、防事故、防次生灾害……这些安全注意事项一起来看↓↓↓危化品储存  夏季高温、雷雨、台风等极端天气容易对危险化学品安全生产造成不利影响。企业要加强危险化学品储罐、仓库的安全管理,严禁超量储存、违规混存、超高堆放、野蛮装卸等行为。  有效落实危险化学品仓库防雨、防潮、防雷电措施,特别是受潮易自燃或分解有毒气体的危险化学品,要严格按标准规范入库储存,严禁露天存放,严禁与禁忌物混合储存。  加强防雷、防静电设施的巡检和维护,按规定定期检测,确保防雷、防静电设施完好有效。</p>
</div>
</div>
</div>
</div>
<AppFoot/>
<right/>
</div>
</template>
<script setup lang="ts">
const activeIndex = ref(0);
const industries = ["全部", "冶金", "机械", "军工", "民爆", "环保", "水务", "风电", "其他"];
</script>
<style scoped lang="scss">
.container{
background: #f6f8fa;
.banner {
width: 100%;
height: 494px;
background: url("@/assets/images/case_banner.png") no-repeat top center;
.banner_main {
width: 1400px;
margin: 0 auto;
padding-top: 230px;
h2 {
font-size: 60px;
color: #ffffff;
margin: 0;
padding: 0;
}
p {
margin: 0;
color: #ffffff;
}
}
}
.case_main{
width: 100%;
padding-bottom: 50px;
.top{
background: #ffffff;
height: 60px;
padding-top: 20px;
.top_wrap{
width: 1400px;
margin: 0 auto;
display: flex;
align-items: center;
.title{
margin-right: 20px;
.line{
color: #999999;
margin-left: 20px;
}
}
.num{
display: flex;
.item{
color: #666666;
padding: 6px 30px;
border-radius: 50px;
cursor: pointer;
margin-right: 20px;
&.active{
background: #2e57e9;
color: #ffffff;
}
&:hover{
background: #2e57e9;
color: #ffffff;
}
}
}
}
}
.new_main{
width: 1400px;
margin: 20px auto 20px;
background: #ffffff;
min-height: 600px;
border-radius: 4px;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
padding: 20px 50px;
border-top: 3px solid #1d78ff;
.title{
width: 100%;
border-bottom: 1px solid #eeeeee;
padding-bottom: 20px;
text-align: center;
}
.main{
padding: 20px 0;
color: #666666;
p{
text-indent: 2rem;
line-height: 2;
font-size: 16px;
}
img{
margin: 0 auto;
max-width: 100%;
}
}
}
}
}
</style>