Skip to content

R
risk-monitor
提交 1a031e8a authored 作者: 张烨's avatar 张烨
浏览文件
操作

feat:增加法律依据和风险信号板块

上级 a4b931c9
隐藏空白字符变更
内嵌 并排
正在显示 包含 167 行增加 和 45 行删除
src/views/decree/decreeLayout/overview/background/index.vue
浏览文件 @ 1a031e8a
...@@ -125,7 +125,26 @@ ...@@ -125,7 +125,26 @@
</AnalysisBox> --> </AnalysisBox> -->
<AnalysisBox title="法律依据" :showAllBtn="false"> <AnalysisBox title="法律依据" :showAllBtn="false">
<div class="box2-main"> <div class="box2-main">
<el-empty description="暂无数据" :image-size="100" /> <el-empty v-if="false" description="暂无数据" :image-size="100" />
<div class="custom-collapse">
<el-collapse v-model="activeNames">
<el-collapse-item v-for="index in 5" title="Consistency" :name="index">
<template #icon>
<el-icon><ArrowDownBold /></el-icon>
<!-- <el-icon><ArrowRightBold /></el-icon> -->
</template>
<template #title>
<div class="custom-collapse-title">
<div class="custom-collapse-index">{{ index + 1 }}</div>
<div class="custom-collapse-name one-line-ellipsis">US美国法典2025年人工智能指数报告美国法典2025年人工智能指数报告美国法典2025年人工智能指数报告</div>
</div>
</template>
<div class="custom-collapse-content">
中国政府未能采取有效措施阻止持续流入美国的合成阿片类药物（包括芬太尼）的流通，构成对美国国家安全、外交政策和经济的异常且非同寻常的威胁，该威胁主要源于美国境外。
</div>
</el-collapse-item>
</el-collapse>
</div>
</div> </div>
</AnalysisBox> </AnalysisBox>
</div> </div>
...@@ -283,6 +302,7 @@ const eventList = ref([ ...@@ -283,6 +302,7 @@ const eventList = ref([
// 法律依据 // 法律依据
const laws = ref([]); const laws = ref([]);
const activeNames = ref([1, 2, 3, 4, 5]);
const handleGetLaws = async () => { const handleGetLaws = async () => {
const params = { const params = {
id: decreeId.value id: decreeId.value
...@@ -328,6 +348,44 @@ onMounted(() => { ...@@ -328,6 +348,44 @@ onMounted(() => {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.custom-collapse {
padding-left: 32px;
:deep(.el-collapse),
:deep(.el-collapse-item__wrap) {
border: none !important;
}
:deep(.el-collapse-item__header) {
border-bottom: 1px solid rgba(234, 236, 238, 1);
}
.custom-collapse-title {
position: relative;
.custom-collapse-index {
font-size: 15px;
position: absolute;
top: 12px;
left: -32px;
width: 24px;
height: 24px;
text-align: center;
line-height: 24px;
border-radius: 50%;
background: #e7f3ff;
color: #0a57a6;
}
.custom-collapse-name {
font-weight: 600;
font-size: 18px;
color: var(--el-collapse-header-text-color);
}
}
.custom-collapse-content {
margin-top: 8px;
font-family: Microsoft YaHei;
font-size: var(--font-size-base);
color: rgb(59, 65, 75);
}
}
.introduction-wrap { .introduction-wrap {
display: flex; display: flex;
position: relative; position: relative;
...@@ -452,10 +510,10 @@ onMounted(() => { ...@@ -452,10 +510,10 @@ onMounted(() => {
.box1-item { .box1-item {
width: 1015px; width: 1015px;
min-height: 48px; min-height: 48px;
// margin-bottom: 8px; font-family: Microsoft YaHei;
font-size: var(--font-size-base);
color: rgb(59, 65, 75);
box-sizing: border-box; box-sizing: border-box;
// border: 1px solid rgba(234, 236, 238, 1);
// border-radius: 2px;
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
display: flex; display: flex;
align-items: center; align-items: center;
......
src/views/decree/decreeLayout/overview/introduction/index.vue
浏览文件 @ 1a031e8a
<template> <template>
<div class="risk-notice">
<div class="risk-notice-header">
<div class="risk-notice-icon">
<img :src="warning1" alt="">
</div>
<div class="risk-notice-title">特别重大风险</div>
<div class="risk-notice-icon">
<img :src="warning2" alt="">
</div>
</div>
<div class="risk-notice-content">
政令核心意图在于通过税收优惠吸引制造业回流美国，并在关键科技领域对中国进行遏制，限制中国获取先进技术、资本和市场渠道，从而延缓中国科技产业的发展速度。给半导体、新能源、人工智能等相关科技行业带来不小的短期压力。
</div>
</div>
<div class="introduction-wrap"> <div class="introduction-wrap">
<div class="left"> <div class="left">
<div class="box1"> <div class="box1">
...@@ -166,45 +180,20 @@ ...@@ -166,45 +180,20 @@
<img :src="item.image" alt="" /> <img :src="item.image" alt="" />
</div> </div>
<div class="item-center"> <div class="item-center">
<div class="bubble-header"> <div class="bubble-header" @click="handleClickToNewsDetail(item)">
<span class="name">{{ item.title }}</span> <span class="name">{{ item.title }}</span>
<span class="meta">{{ item.time }} · {{ "洛杉矶时报" }}</span> <span class="meta">{{ item.time }} · {{ "洛杉矶时报" }}</span>
</div> </div>
<el-popover effect="dark" :width="1000" :content="item.content" placement="top-start"> <div class="content">{{ item.content }}</div>
<!-- <el-popover effect="dark" :width="1000" :content="item.content" placement="top-start">
<template #reference> <template #reference>
<div class="content">{{ item.content }}</div> <div class="content">{{ item.content }}</div>
</template> </template>
</el-popover> </el-popover> -->
</div> </div>
</div> </div>
</div> </div>
</AnalysisBox> </AnalysisBox>
<!-- <div class="box-header">
<div class="header-left"></div>
<div class="title">主要指令</div>
<div class="header-right">
<div class="icon">
<img src="../assets/icons/header-right-icon1.png" alt="" />
</div>
<div class="icon">
<img src="../assets/icons/header-right-icon2.png" alt="" />
</div>
</div>
</div>
<div class="box2-main">
<el-empty v-if="!curmajorList.length" description="暂无数据" :image-size="100" />
<div class="box2-item" v-for="(item, index) in curmajorList" :key="index">
<div class="id">{{ index + 1 }}</div>
<div class="title">{{ item.content }}</div>
</div>
</div>
<div class="box2-footer">
<div class="box2-footer-left">{{ `共 ${majorListNum} 项` }}</div>
<div class="box2-footer-right">
<el-pagination @current-change="handleCurrentChange" :page-size="5" background layout="prev, pager, next"
:total="majorListNum" />
</div>
</div> -->
</div> </div>
</div> </div>
<div class="right"> <div class="right">
...@@ -219,12 +208,6 @@ ...@@ -219,12 +208,6 @@
<div class="name">{{ box3TopTopData.name + " >" }}</div> <div class="name">{{ box3TopTopData.name + " >" }}</div>
<div class="ename">{{ box3TopTopData.eName }}</div> <div class="ename">{{ box3TopTopData.eName }}</div>
</div> </div>
<!-- <div class="more">
<div class="text">{{ "查看官网" }}</div>
<div class="icon">
<img src="./assets/images/open-icon.png" alt="" />
</div>
</div> -->
</div> </div>
<div class="box3-top-bottom"> <div class="box3-top-bottom">
<div class="box3-top-bottom-header"> <div class="box3-top-bottom-header">
...@@ -331,8 +314,8 @@ ...@@ -331,8 +314,8 @@
import { ref, computed, onMounted } from "vue"; import { ref, computed, onMounted } from "vue";
import { useRoute } from "vue-router"; import { useRoute } from "vue-router";
import router from "@/router"; import router from "@/router";
import box1Img from "./assets/images/box1-img.png"; import warning1 from "./assets/icon/warning-icon1.png";
import Box3Logo from "./assets/images/box3-img.png"; import warning2 from "./assets/icon/warning-icon2.png";
import { import {
getDecreeBasicInfo, getDecreeBasicInfo,
getDecreeMainContent, getDecreeMainContent,
...@@ -348,6 +331,30 @@ import { ElMessage } from "element-plus"; ...@@ -348,6 +331,30 @@ import { ElMessage } from "element-plus";
const route = useRoute(); const route = useRoute();
const decreeId = ref(route.query.id); const decreeId = ref(route.query.id);
// 风险警告
const levelMapList = [
{
name: "特别重大风险",
color: ["rgba(255, 77, 79, 1)", "rgba(255, 163, 158, 1)"]
},
{
name: "重大风险",
color: ["rgba(255, 169, 64, 1)", "rgba(255, 213, 145, 1)"]
},
{
name: "较大风险",
color: ["rgba(250, 219, 20, 1)", "rgba(255, 251, 143, 1)"]
},
{
name: "一般风险",
color: ["rgba(64, 150, 255, 1)", "rgba(145, 202, 255, 1)"]
},
{
name: "几乎无风险",
color: ["rgba(54, 207, 201, 1)", "rgba(135, 232, 222, 1)"]
}
];
// 基本信息 // 基本信息
const basicInfo = ref({ const basicInfo = ref({
img: "", img: "",
...@@ -398,7 +405,8 @@ const handleGetRelateEvents = async () => { ...@@ -398,7 +405,8 @@ const handleGetRelateEvents = async () => {
image: item.imageUrl, image: item.imageUrl,
title: item.sjbt, title: item.sjbt,
content: item.sjnr, content: item.sjnr,
time: item.sjsj time: item.sjsj,
id: item.id,
}; };
}); });
} else { } else {
...@@ -406,6 +414,15 @@ const handleGetRelateEvents = async () => { ...@@ -406,6 +414,15 @@ const handleGetRelateEvents = async () => {
} }
} catch (error) { } } catch (error) { }
}; };
const handleClickToNewsDetail = news => {
const route = router.resolve({
path: "/newsAnalysis",
query: {
newsId: news.id
}
});
window.open(route.href, "_blank");
};
// 主要指令 // 主要指令
const majorList = ref([ const majorList = ref([
...@@ -523,6 +540,49 @@ onMounted(() => { ...@@ -523,6 +540,49 @@ onMounted(() => {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.risk-notice {
cursor: pointer;
margin-top: 16px;
width: 1600px;
border: 1px solid rgba(255, 163, 158, 1);
border-radius: 10px;
background-color: rgba(255, 241, 240, 1);
padding: 12px 14px;
.risk-notice-header {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 4px;
color: #d0021b;
font-weight: 600;
.risk-notice-icon {
font-size: 0px;
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.risk-notice-title {
font-size: 16px;
flex: auto;
width: 20px;
}
}
.risk-notice-content {
font-size: 14px;
line-height: 20px;
color: rgb(206, 79, 81);
padding-left: 24px;
letter-spacing: 1px;
}
}
.introduction-wrap { .introduction-wrap {
display: flex; display: flex;
...@@ -716,7 +776,7 @@ onMounted(() => { ...@@ -716,7 +776,7 @@ onMounted(() => {
.box2 { .box2 {
margin-top: 16px; margin-top: 16px;
width: 1064px; width: 1064px;
height: 415px; height: 330px;
// .box2-main { // .box2-main {
// margin-left: 22px; // margin-left: 22px;
...@@ -812,6 +872,7 @@ onMounted(() => { ...@@ -812,6 +872,7 @@ onMounted(() => {
.bubble-header { .bubble-header {
display: flex; display: flex;
align-items: center; align-items: center;
cursor: pointer;
.name { .name {
flex: auto; flex: auto;
...@@ -823,6 +884,10 @@ onMounted(() => { ...@@ -823,6 +884,10 @@ onMounted(() => {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
&:hover {
text-decoration: underline;
color: var(--color-main-active);
}
} }
.meta { .meta {
...@@ -845,7 +910,6 @@ onMounted(() => { ...@@ -845,7 +910,6 @@ onMounted(() => {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
cursor: pointer;
} }
} }
} }
...@@ -875,7 +939,7 @@ onMounted(() => { ...@@ -875,7 +939,7 @@ onMounted(() => {
.box3 { .box3 {
margin-top: 16px; margin-top: 16px;
width: 520px; width: 520px;
height: 845px; height: 760px;
.box3-top { .box3-top {
margin-top: 2px; margin-top: 2px;
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论