master
鲁洪霞 2026-03-09 17:06:41 +08:00
parent bcca01c3a0
commit 84b3c6717a
10 changed files with 469 additions and 279 deletions

View File

@ -32,30 +32,10 @@
<NuxtLink to="/solution">解决方案</NuxtLink>
</li>
<li :class="{ active: isActive('/new') }"><NuxtLink to="/new">新闻资讯</NuxtLink></li>
<li
:class="{ active: isActive('/rule/legal') }"
@mouseenter="isRuleHovered = true"
@mouseleave="isRuleHovered = false"
>
<NuxtLink to="">政策法规</NuxtLink>
<span v-if="isRuleHovered">
<NuxtLink
v-for="(item, index) in RuleList"
:key="index"
v-motion
:to="item.path"
:initial="{ opacity: 0, y: -10 }"
:enter="{ opacity: 1, y: 0, transition: { delay: index * 50, duration: 300 } }"
:leave="{ opacity: 0, y: -10, transition: { duration: 200 } }"
>
{{item.name}}
</NuxtLink>
</span>
</li>
<li :class="{ active: isActive('/evaluation') }"><NuxtLink to="/evaluation">安全评价</NuxtLink></li>
<li :class="{ active: isActive('/rule') }"><NuxtLink to="/rule">政策法规</NuxtLink></li>
<li :class="{ active: isActive('/service') }"><NuxtLink to="/service">业务与服务</NuxtLink></li>
<li :class="{ active: isActive('/public') }"><NuxtLink to="/public">网上公开</NuxtLink></li>
<li :class="{ active: isActive('/case') }"><NuxtLink to="/case">合作案例</NuxtLink></li>
<!-- <li :class="{ active: isActive('/service') }"><NuxtLink to="/service">服务流程</NuxtLink></li>-->
<!-- <li :class="{ active: isActive('/about') }"><NuxtLink to="/about">关于秦安</NuxtLink></li>-->
<li
:class="{ active: isActive('/product') }"
@mouseenter="isAboutHovered = true"

View File

@ -1,203 +0,0 @@
<template>
<div class="container">
<AppHead/>
<div class="banner">
<div class="banner_main">
<h2>安全评价</h2>
<p>安全第一 预防为主 综合治理</p>
</div>
</div>
<div class="new_container">
<div class="top">
<div class="wrap">
<div class="list active">全部</div>
<div class="list">安全要闻</div>
<div class="list">政府发文</div>
</div>
</div>
<div class="new_main">
<NuxtLink to="/new/details">
<div class="wrap" >
<div class="item">
<div class="img">
<img src="@/assets/images/img2.png" alt=""/>
</div>
<div class="info">
<div class="title">喜报·我司荣获2025数据要素X大赛河北分赛三等奖</div>
<div class="text">4月10日2025数据要素X大赛启动仪式在雄安新区成功举办 河北秦安安全科技股份有限公司申报的危化智融-多模态智能风险管控决策平台项目针对危化行业长期存在的数据割裂响应延迟决策偏差三大核心痛点构建了多模型融合的安全生产决策体系</div>
<div class="time"><img src="@/assets/images/time.png" alt="河北秦安安全科技股份有限公司"/> <span>2026-10-19</span> </div>
</div>
</div>
</div>
</NuxtLink>
<NuxtLink to="/new/details">
<div class="wrap">
<div class="item">
<div class="img">
<img src="@/assets/images/img2.png" alt=""/>
</div>
<div class="info">
<div class="title">喜报·我司荣获2025数据要素X大赛河北分赛三等奖</div>
<div class="text">4月10日2025数据要素X大赛启动仪式在雄安新区成功举办 河北秦安安全科技股份有限公司申报的危化智融-多模态智能风险管控决策平台项目针对危化行业长期存在的数据割裂响应延迟决策偏差三大核心痛点构建了多模型融合的安全生产决策体系</div>
<div class="time"><img src="@/assets/images/time.png" alt="河北秦安安全科技股份有限公司"/> <span>2026-10-19</span> </div>
</div>
</div>
</div>
</NuxtLink>
<NuxtLink to="/new/details">
<div class="wrap">
<div class="item">
<div class="img">
<img src="@/assets/images/img2.png" alt=""/>
</div>
<div class="info">
<div class="title">喜报·我司荣获2025数据要素X大赛河北分赛三等奖</div>
<div class="text">4月10日2025数据要素X大赛启动仪式在雄安新区成功举办 河北秦安安全科技股份有限公司申报的危化智融-多模态智能风险管控决策平台项目针对危化行业长期存在的数据割裂响应延迟决策偏差三大核心痛点构建了多模型融合的安全生产决策体系</div>
<div class="time"><img src="@/assets/images/time.png" alt="河北秦安安全科技股份有限公司"/> <span>2026-10-19</span> </div>
</div>
</div>
</div>
</NuxtLink>
<NuxtLink to="/new/details">
<div class="wrap">
<div class="item">
<div class="img">
<img src="@/assets/images/img2.png" alt=""/>
</div>
<div class="info">
<div class="title">喜报·我司荣获2025数据要素X大赛河北分赛三等奖</div>
<div class="text">4月10日2025数据要素X大赛启动仪式在雄安新区成功举办 河北秦安安全科技股份有限公司申报的危化智融-多模态智能风险管控决策平台项目针对危化行业长期存在的数据割裂响应延迟决策偏差三大核心痛点构建了多模型融合的安全生产决策体系</div>
<div class="time"><img src="@/assets/images/time.png" alt="河北秦安安全科技股份有限公司"/> <span>2026-10-19</span> </div>
</div>
</div>
</div>
</NuxtLink>
</div>
</div>
<AppFoot/>
<right/>
</div>
</template>
<script setup lang="ts">
</script>
<style scoped lang="scss">
.container {
background: #f6f8fa;
.banner {
width: 100%;
height: 494px;
background: url("@/assets/images/newbanner.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;
}
}
}
.new_container {
width: 100%;
.top {
width: 100%;
height: 60px;
background: #ffffff;
.wrap {
width: 1400px;
margin: 0 auto;
display: flex;
.list {
font-size: 16px;
line-height: 60px;
cursor: pointer;
position: relative;
margin-right: 40px;
&.active {
color: #006aff;
&:before {
opacity: 1;
}
}
&:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
border-bottom: 3px solid #006aff;
width: 100%;
opacity: 0;
}
&:hover {
color: #006aff;
&:before {
opacity: 1;
}
}
}
}
}
.new_main{
width: 1400px;
margin: 20px auto;
a{
text-decoration: none;
}
.wrap{
width: 100%;
background: #ffffff;
padding: 20px;
border-radius: 4px;
margin-bottom: 20px;
.item{
display: flex;
.info{
padding-left: 20px;
.title{
font-size: 18px;
color: #222222;
}
.text{
font-size: 14px;
color: #696969;
margin-top: 20px;
}
.time{
color: #999999;
margin-top: 10px;
display: flex;
align-items: center;
span{
padding-left: 5px;
}
}
}
}
&:hover{
box-shadow: 0 8px 30px rgba(45, 104, 255, 0.15)
}
}
}
}
}
</style>

View File

@ -8,13 +8,6 @@
</div>
</div>
<div class="new_container">
<div class="top">
<div class="wrap">
<div class="list active">全部</div>
<div class="list">安全要闻</div>
<div class="list">政府发文</div>
</div>
</div>
<div class="new_main">
<div class="title">
<h2>安全生产事故 | 900余人被疏散广西一糖厂产生大量刺激性烟雾</h2>
@ -61,12 +54,12 @@
background: #f6f8fa;
.banner {
width: 100%;
height: 494px;
height: 400px;
background: url("@/assets/images/newbanner.png") no-repeat top center;
.banner_main {
width: 1400px;
margin: 0 auto;
padding-top: 230px;
padding-top: 180px;
h2 {
font-size: 60px;
color: #ffffff;

105
app/pages/public/index.vue Normal file
View File

@ -0,0 +1,105 @@
<template>
<div class="container">
<AppHead/>
<div class="banner">
<div class="banner_main">
<h2>网上公开</h2>
<p>安全第一 预防为主 综合治理</p>
</div>
</div>
<div class="new_container">
<div class="left">
<div class="top">网上公开</div>
<div class="main">
<div v-for="(item, index) in publicItems"
:key="index"
class="list"
:class="{ active: activeIndex === index }"
@click="activeIndex = index">{{item}}</div>
</div>
</div>
<div class="right_main">
<div class=""></div>
</div>
</div>
<AppFoot/>
<right/>
</div>
</template>
<script setup lang="ts">
import { ref } from "vue";
const publicItems=["河北秦安安全科技股份有限公司", "秦皇岛市秦安职业卫生检测检", "河北联安众企业管理咨询有限公司", "信息化","公开承诺书","安全生产检测","职业卫生","收费标准","交通运输企业安全生产标准化"];
const activeIndex = ref(0);
</script>
<style scoped lang="scss">
.container {
background: #f6f8fa;
.banner {
width: 100%;
height: 400px;
background: url("@/assets/images/newbanner.png") no-repeat top center;
.banner_main {
width: 1400px;
margin: 0 auto;
padding-top: 180px;
h2 {
font-size: 60px;
color: #ffffff;
margin: 0;
padding: 0;
}
p {
margin: 0;
color: #ffffff;
}
}
}
.new_container {
width: 1400px;
margin: 20px auto;
display: flex;
.left{
width: 250px;
box-sizing: border-box;
background: #ffffff;
border-radius: 4px;
.top{
width: 100%;
background: #3f79ff;
text-align: center;
color: #ffffff;
line-height: 40px;
border-radius: 4px 4px 0 0;
font-weight: bold;
}
.main{
.list{
border-bottom: 1px solid #eeeeee;
padding: 10px 5px;
font-size: 14px;
&:hover{
}
}
&:last-child{
border-bottom: none;
}
}
}
.right_main{
flex: 1;
margin-left: 20px;
background: #ffffff;
}
}
}
</style>

View File

@ -1,9 +1,183 @@
<script setup lang="ts">
</script>
<template>
<div class="">
详情
<div class="container">
<AppHead/>
<div class="banner">
<div class="banner_main">
<h2>政策法规</h2>
<p>安全第一 预防为主 综合治理</p>
</div>
</div>
<div class="new_container">
<div class="new_main">
<div class="title">
<h2>安全生产事故 | 900余人被疏散广西一糖厂产生大量刺激性烟雾</h2>
<div class="time">2024-05-23</div>
</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/其余点位扣除背景点后氨气均未检出符合恶臭污染物排放标准(GB 14554-93)表1标准限值要求;所有点位氯气均未检出符合大气污染物综合排放标准(GB 16297-1996)表1无组织排放监控限值要求事故未对周边环境产生不良影响</p>
<p>近期广西多地遭遇特大暴雨导致多处地段发生内涝暴雨过后仍不能放松警惕防潮防事故防次生灾害这些安全注意事项一起来看危化品储存  夏季高温雷雨台风等极端天气容易对危险化学品安全生产造成不利影响企业要加强危险化学品储罐仓库的安全管理严禁超量储存违规混存超高堆放野蛮装卸等行为  有效落实危险化学品仓库防雨防潮防雷电措施特别是受潮易自燃或分解有毒气体的危险化学品要严格按标准规范入库储存严禁露天存放严禁与禁忌物混合储存  加强防雷防静电设施的巡检和维护按规定定期检测确保防雷防静电设施完好有效</p>
</div>
<div class="bottom">
<div class="item">
<div class="previous">上一篇</div>
<div class="info">
<div class="tit">国务院安委会办公室 应急管理部关于 开展2024年全国安全生产月活动的通知</div>
<div class="time">2024-05-21</div>
</div>
</div>
<div class="item">
<div class="previous">下一篇</div>
<div class="info">
<div class="tit">国务院安委会办公室 应急管理部关于 开展2024年全国安全生产月活动的通知</div>
<div class="time">2024-05-21</div>
</div>
</div>
</div>
</div>
</div>
<AppFoot/>
<right/>
</div>
</template>
<script setup lang="ts">
</script>
<style scoped lang="scss">
.container {
background: #f6f8fa;
.banner {
width: 100%;
height: 400px;
background: url("@/assets/images/newbanner.png") no-repeat top center;
.banner_main {
width: 1400px;
margin: 0 auto;
padding-top: 180px;
h2 {
font-size: 60px;
color: #ffffff;
margin: 0;
padding: 0;
}
p {
margin: 0;
color: #ffffff;
}
}
}
.new_container {
width: 100%;
.top {
width: 100%;
height: 60px;
background: #ffffff;
.wrap {
width: 1400px;
margin: 0 auto;
display: flex;
.list {
font-size: 16px;
line-height: 60px;
cursor: pointer;
position: relative;
margin-right: 40px;
&.active {
color: #006aff;
&:before {
opacity: 1;
}
}
&:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
border-bottom: 3px solid #006aff;
width: 100%;
opacity: 0;
}
&:hover {
color: #006aff;
&:before {
opacity: 1;
}
}
}
}
}
.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;
.time{
color: #999999;
}
}
.main{
padding: 20px 0;
color: #666666;
p{
text-indent: 2rem;
line-height: 2;
font-size: 16px;
}
img{
margin: 0 auto;
max-width: 100%;
}
}
.bottom{
width: 100%;
.item{
padding: 20px;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
margin-bottom: 20px;
cursor: pointer;
.previous{
font-size: 16px;
margin-bottom: 20px;
}
.title{
font-size: 16px;
}
.info{
width: 100%;
display: flex;
justify-content: space-between;
color: #666666;
}
&:hover{
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}
}
}
}
}
}
</style>

View File

@ -1,12 +0,0 @@
<script setup lang="ts">
</script>
<template>
<div>政府规章</div>
</template>
<style scoped lang="scss">
</style>

View File

@ -11,10 +11,15 @@
<div class="new_container">
<div class="top">
<div class="wrap">
<div class="list active">法律法规</div>
<div class="list">政府章规</div>
<div class="list">规范文件</div>
<div class="list">技术标准</div>
<div
v-for="(item, index) in rulesItems"
:key="index"
class="list"
:class="{ active: activeIndex === index }"
@click="activeIndex = index"
>
{{item}}
</div>
</div>
</div>
<div class="new_main">
@ -56,6 +61,11 @@
</div>
</template>
<script setup lang="ts">
import { ref } from "vue";
const rulesItems=["法律法规", "政策规章", "规范文件", "技术标准"];
const activeIndex = ref(0);
</script>
@ -63,7 +73,6 @@
<style scoped lang="scss">
.container {
background: #f6f8fa;
.banner {
width: 100%;
height: 494px;

View File

@ -1,11 +0,0 @@
<script setup lang="ts">
</script>
<template>
<div>规范文件</div>
</template>
<style scoped lang="scss">
</style>

View File

@ -1,11 +0,0 @@
<script setup lang="ts">
</script>
<template>
<div>技术标准</div>
</template>
<style scoped lang="scss">
</style>

166
app/pages/service/index.vue Normal file
View File

@ -0,0 +1,166 @@
<template>
<div class="container">
<AppHead/>
<div class="banner">
<div class="banner_main">
<h2>业务服务</h2>
<p>安全第一 预防为主 综合治理</p>
</div>
</div>
<div class="new_container">
<div class="top">
<div class="wrap">
<div
v-for="(item, index) in serverItems"
:key="index"
class="list"
:class="{ active: activeIndex === index }"
@click="activeIndex = index"
>
{{item}}
</div>
</div>
</div>
<div class="new_main">
<div>河北秦安安全科技股份有限公司原秦皇岛中宇安全评价有限公司2019年12月26日取得了河北省应急管理厅颁发的安全评价机构资质证书证书编号APJ-()-001现有安全评价师35人其中一级评价师9人二级评价师10人三级评价师16人具有高级专业技术职称的6人具有中级专业技术职称的5人注册安全工程师20人</div>
</div>
</div>
<AppFoot/>
<right/>
</div>
</template>
<script setup lang="ts">
import { ref } from "vue";
const serverItems=["安全评价", "安全标准化评南与咨询", "职业卫生检测与评价", "安全生产检测检验","环境卫生检测检验","应急救援预案指导","安全培训","交通培训"];
const activeIndex = ref(0);
</script>
<style scoped lang="scss">
.container {
background: #f6f8fa;
.banner {
width: 100%;
height: 400px;
background: url("@/assets/images/newbanner.png") no-repeat top center;
.banner_main {
width: 1400px;
margin: 0 auto;
padding-top: 180px;
h2 {
font-size: 60px;
color: #ffffff;
margin: 0;
padding: 0;
}
p {
margin: 0;
color: #ffffff;
}
}
}
.new_container {
width: 100%;
.top {
width: 100%;
height: 60px;
background: #ffffff;
.wrap {
width: 1400px;
margin: 0 auto;
display: flex;
.list {
font-size: 16px;
line-height: 60px;
cursor: pointer;
position: relative;
margin-right: 40px;
&.active {
color: #006aff;
&:before {
opacity: 1;
}
}
&:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
border-bottom: 3px solid #006aff;
width: 100%;
opacity: 0;
}
&:hover {
color: #006aff;
&:before {
opacity: 1;
}
}
}
}
}
.new_main{
width: 1400px;
margin: 20px auto;
background: #ffffff;
padding: 20px;
box-sizing: border-box;
img{
max-width: 1200px;
margin: 0 auto;
}
a{
text-decoration: none;
}
.wrap{
width: 100%;
background: #ffffff;
padding: 20px;
border-radius: 4px;
margin-bottom: 20px;
.item{
display: flex;
.info{
padding-left: 20px;
.title{
font-size: 18px;
color: #222222;
}
.text{
font-size: 14px;
color: #696969;
margin-top: 20px;
}
.time{
color: #999999;
margin-top: 10px;
display: flex;
align-items: center;
span{
padding-left: 5px;
}
}
}
}
&:hover{
box-shadow: 0 8px 30px rgba(45, 104, 255, 0.15)
}
}
}
}
}
</style>