master
鲁洪霞 2026-03-09 13:54:04 +08:00
parent 42ac2bdeee
commit 67ff45aeb5
11 changed files with 329 additions and 1 deletions

View File

@ -32,10 +32,50 @@
<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('/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('/about') }"><NuxtLink to="/about">关于秦安</NuxtLink></li>-->
<li
:class="{ active: isActive('/product') }"
@mouseenter="isAboutHovered = true"
@mouseleave="isAboutHovered = false"
>
<NuxtLink to="">关于秦安</NuxtLink>
<span v-if="isAboutHovered">
<NuxtLink
v-for="(item, index) in AboutList"
: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('https://safetyds.qhdsafety.com/#/safety_chat') }"><NuxtLink to="https://safetyds.qhdsafety.com/#/safety_chat" target="_blank">秦安安全大模型</NuxtLink></li>
</ul>
<div class="num">股票代码871771</div>
@ -47,6 +87,8 @@
import { ref, onMounted, onUnmounted } from "vue";
const isProductHovered = ref(false);
const isAboutHovered = ref(false);
const isRuleHovered = ref(false);
const isScrolled = ref(false);
const route = useRoute();
@ -77,6 +119,20 @@ const proList = [
{ name: "服务机构自我赋能平台", path: "" },
{ name: "应急管理大数据中心", path: "" },
];
const AboutList=[
{ name: "公司简介", path: "/about" },
{ name: "领导致词", path: "/about/leaderSpeech" },
{ name: "发展战略", path: "/about/developmentStrategy" },
{ name: "组织架构", path: "/about/organizationalStructure" },
{ name: "资质荣誉", path: "/about/honor" },
{ name: "发展历程", path: "/about/developmentHistory" },
];
const RuleList= [
{ name: "法律法规", path: "/rule/legal" },
{ name: "政府规章", path: "/rule/government" },
{ name: "规范文件", path: "/rule/specification" },
{ name: "技术标准", path: "/rule/technicalStandards" },
];
</script>
<style scoped lang="scss">
.head_container{

View File

@ -0,0 +1,11 @@
<script setup lang="ts">
</script>
<template>
<div>发展历程</div>
</template>
<style scoped lang="scss">
</style>

View File

@ -0,0 +1,11 @@
<script setup lang="ts">
</script>
<template>
<div>发展战略</div>
</template>
<style scoped lang="scss">
</style>

View File

@ -0,0 +1,11 @@
<script setup lang="ts">
</script>
<template>
<div>资质荣誉</div>
</template>
<style scoped lang="scss">
</style>

View File

@ -0,0 +1,11 @@
<script setup lang="ts">
</script>
<template>
<div>领导致词</div>
</template>
<style scoped lang="scss">
</style>

View File

@ -0,0 +1,11 @@
<script setup lang="ts">
</script>
<template>
<div>组织架构</div>
</template>
<style scoped lang="scss">
</style>

View File

@ -0,0 +1,9 @@
<script setup lang="ts">
</script>
<template>
<div class="">
详情
</div>
</template>
<style scoped lang="scss">
</style>

View File

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

View File

@ -0,0 +1,174 @@
<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 class="list">技术标准</div>
</div>
</div>
<div class="new_main">
<NuxtLink to="/rule/details">
<div class="wrap" >
<div class="item">
<div class="info">
<div class="title">应急管理部行政复议和行政应诉工作办法中华人民共和国应急管理部令第15号2024年6月1日起施行</div>
<div class="time"><img src="@/assets/images/time.png" alt="河北秦安安全科技股份有限公司"/> <span>2024-04-15</span> </div>
</div>
</div>
</div>
</NuxtLink>
<NuxtLink to="/rule/details">
<div class="wrap" >
<div class="item">
<div class="info">
<div class="title">应急管理部行政复议和行政应诉工作办法中华人民共和国应急管理部令第15号2024年6月1日起施行</div>
<div class="time"><img src="@/assets/images/time.png" alt="河北秦安安全科技股份有限公司"/> <span>2024-04-15</span> </div>
</div>
</div>
</div>
</NuxtLink>
<NuxtLink to="/rule/details">
<div class="wrap" >
<div class="item">
<div class="info">
<div class="title">应急管理部行政复议和行政应诉工作办法中华人民共和国应急管理部令第15号2024年6月1日起施行</div>
<div class="time"><img src="@/assets/images/time.png" alt="河北秦安安全科技股份有限公司"/> <span>2024-04-15</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{
.title{
font-size: 18px;
color: #222222;
}
.time{
color: #999999;
margin-top: 10px;
display: flex;
align-items: center;
margin-left: 10px;
span{
padding-left: 5px;
}
}
}
}
&:hover{
box-shadow: 0 8px 30px rgba(45, 104, 255, 0.15)
}
}
}
}
}
</style>

View File

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

View File

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