Skip to content

R
risk-monitor
提交 bfcfe1ed authored 作者: coderBryanFu's avatar coderBryanFu
浏览文件
操作

update

上级 15c01871
隐藏空白字符变更
内嵌 并排
正在显示 包含 413 行增加 和 263 行删除
src/App.vue
浏览文件 @ bfcfe1ed
......@@ -9,9 +9,9 @@
</div>
<div class="brand-text" @click="handleToHome">
<div class="text-ch">某方向风险监测预警系统</div>
<div class="text-en">
<!-- <div class="text-en">
National Science and Technology Security Risk Monitoring and Early Warning System
</div>
</div> -->
</div>
</div>
<!-- <div class="nav-menu">
......
src/components/Container/index.vue
浏览文件 @ bfcfe1ed
......@@ -10,6 +10,11 @@
<!-- <div class="blue-title-block"></div> -->
<el-image :src="titleIcon" class="header-icon" fit="contain" />
<div :class="headerTitleClasses">{{ title }}</div>
<div v-if="props.headerNum > 0" class="num-box">
<div class="num">
{{ headerNum }}
</div>
</div>
</slot>
</div>
<div class="header-right">
......@@ -57,6 +62,10 @@ const props = defineProps({
titleType: {
type: String,
default: ""
},
headerNum: {
type: Number,
default: 0
}
});
......@@ -95,6 +104,26 @@ const headerTitleClasses = computed(() => [
display: flex;
align-items: center;
padding-left: 14px;
.num-box {
height: 48px;
width: 35px;
background: rgba(206, 79, 81, 1);
display: flex;
justify-content: flex-start;
align-items: center;
.num {
width: 24px;
height: 20px;
line-height: 20px;
text-align: center;
color: rgba(255, 255, 255, 1);
font-family: Microsoft YaHei;
font-size: 12px;
// border: 1px solid rgba(255, 255, 255, 1);
border-radius: 100px;
background: rgba(255, 255, 255, 0.3);
}
}
}
.header-icon {
......@@ -127,7 +156,7 @@ const headerTitleClasses = computed(() => [
}
.header-title-danger {
background: red;
background: rgba(206, 79, 81, 1);
color: white;
}
......
src/styles/main.css
浏览文件 @ bfcfe1ed
......@@ -2,6 +2,8 @@
--color-main-active: rgba(5, 95, 194, 1);
--color-main-primay: rgba(59, 65, 75, 1);
--color-bg-hover: #e7f3ff;
/* 普通按钮颜色 */
--btn-plain-border-color: rgba(230, 231, 232, 1);
--btn-plain-bg-color: rgba(255, 255, 255, 1);
......
src/utils/scrollToCenter.js 0 → 100644
浏览文件 @ bfcfe1ed
// 平滑滚动到指定元素
const scrollToCenter = (elementId) => {
const element = document.getElementById(elementId);
if (element) {
element.scrollIntoView({
behavior: 'smooth',
block: 'center'
});
}
}
export default scrollToCenter
\ No newline at end of file
src/utils/scrollToTop.js 0 → 100644
浏览文件 @ bfcfe1ed
// 平滑滚动到指定元素
const scrollToTop = (elementId) => {
const element = document.getElementById(elementId);
if (element) {
element.scrollIntoView({
behavior: 'smooth',
block: 'start'
});
}
}
export default scrollToTop
\ No newline at end of file
src/views/bill/billHome/index.vue
浏览文件 @ bfcfe1ed
......@@ -11,19 +11,19 @@
</div>
</div>
<div class="home-main-header-btn-box">
<div class="btn">
<div class="btn" @click="handleToPosi('position1')">
<div class="btn-text">{{ "最新动态" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="handleToPosi('position2')">
<div class="btn-text">{{ "资讯要闻" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="handleToPosi('position3')">
<div class="btn-text">{{ "统计概览" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="handleToPosi('position4')">
<div class="btn-text">{{ "资源库" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
......@@ -71,25 +71,25 @@
</div>
</div>
<div class="home-main-header-btn-box">
<div class="btn">
<div class="btn" @click="handleToPosi('position1')">
<div class="btn-text">{{ "最新动态" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="handleToPosi('position2')">
<div class="btn-text">{{ "资讯要闻" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="handleToPosi('position3')">
<div class="btn-text">{{ "统计概览" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="handleToPosi('position4')">
<div class="btn-text">{{ "资源库" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
</div>
</div>
<DivideHeader class="divide1" :titleText="'最新动态'"></DivideHeader>
<DivideHeader id="position1" class="divide1" :titleText="'最新动态'"></DivideHeader>
<div class="home-main-center">
<div class="center-top">
<div class="box1">
......@@ -110,7 +110,7 @@
</div>
<div class="title">{{ "热门法案" }}</div>
</div>
<div class="box1-header-right" @click="handleClickToDetail()">
<div class="box1-header-right">
{{ "查看详情 >" }}
</div>
</div>
......@@ -193,7 +193,12 @@
</div>
</div>
<div class="box2-main">
<div class="box2-main-item" v-for="(item, index) in warningList" :key="index">
<div
class="box2-main-item"
v-for="(item, index) in warningList"
:key="index"
@click="handleClickToDetail()"
>
<div
class="item-left"
:class="{
......@@ -211,7 +216,7 @@
</div>
</div>
</div>
<div class="box2-footer">
<div class="box2-footer" @click="handleToMoreRiskSignal">
<div class="icon">
<img src="./assets/images/box2-footer-icon.png" alt="" />
</div>
......@@ -219,7 +224,7 @@
</div>
</div>
</div>
<DivideHeader class="divide2" :titleText="'资讯要闻'"></DivideHeader>
<DivideHeader id="position2" class="divide2" :titleText="'资讯要闻'"></DivideHeader>
<div class="center-center">
<div class="box3">
<div class="box3-header">
......@@ -228,7 +233,7 @@
<img src="./assets/images/box3-header-icon.png" alt="" />
</div>
<div class="box3-header-title">{{ "新闻资讯" }}</div>
<div class="more">{{ "更多 +" }}</div>
<div class="more" @click="handleToMoreNews">{{ "更多 +" }}</div>
</div>
</div>
<div class="box3-main">
......@@ -270,7 +275,7 @@
</div>
</div>
</div>
<DivideHeader class="divide3" :titleText="'统计概览'"></DivideHeader>
<DivideHeader id="position3" class="divide3" :titleText="'统计概览'"></DivideHeader>
<div class="center-footer">
<div class="box5">
<div class="box5-header">
......@@ -410,7 +415,7 @@
</div>
</div>
<div class="home-main-footer">
<DivideHeader class="divide4" :titleText="'资源库'"></DivideHeader>
<DivideHeader id="position4" class="divide4" :titleText="'资源库'"></DivideHeader>
<div class="home-main-footer-header">
<div class="btn-wrapper">
<div class="btn-box">
......@@ -450,7 +455,7 @@
</div>
</div>
<div class="home-main-footer-main">
<div class="main-item" v-for="(bill, index) in curBillList" :key="index">
<div class="main-item" v-for="(bill, index) in curBillList" :key="index" @click="handleClickToDetail">
<div
class="status-box"
:class="{
......@@ -515,7 +520,7 @@
</template>
<script setup>
import { onMounted, ref, computed } from "vue";
import { onMounted, ref, computed, onUnmounted, nextTick } from "vue";
import * as echarts from "echarts";
import router from "@/router/index";
......@@ -523,6 +528,7 @@ import { getHotBills, getBillsByType, getHylyList } from "@/api/home";
import DivideHeader from "@/components/DivideHeader.vue";
import { useContainerScroll } from "@/hooks/useScrollShow";
import scrollToCenter from "@/utils/scrollToCenter";
import headerIcon1 from "./assets/icons/header-icon1.png";
import headerIcon2 from "./assets/icons/header-icon2.png";
......@@ -621,7 +627,21 @@ const curBill = ref({
// 查看详情
const handleClickToDetail = () => {
window.sessionStorage.setItem("billId", curBill.value.billId);
router.push("/billLayout");
// router.push("/billLayout");
const route = router.resolve("/billLayout");
window.open(route.href, "_blank");
};
// 查看更多风险信号
const handleToMoreRiskSignal = () => {
const route = router.resolve("/riskSignal");
window.open(route.href, "_blank");
};
// 查看更多新闻资讯
const handleToMoreNews = () => {
const route = router.resolve("/newsBrief");
window.open(route.href, "_blank");
};
// 风险信号
......@@ -1202,6 +1222,23 @@ const box8Data = ref([
const box9ChartColorList = ref(["#4096FF", "#FFA39E", "#ADC6FF", "#FFC069", "#B5F5EC", "#B37FEB", "#D6E4FF"]);
const handleToPosi = id => {
// 0 618 1240 2350
switch (id) {
case "position2":
containerRef.value.scrollTop = isShow.value ? 634 : 980;
break;
case "position3":
containerRef.value.scrollTop = isShow.value ? 1204 : 1550;
break;
case "position4":
containerRef.value.scrollTop = isShow.value ? 2334 : 2680;
break;
default:
containerRef.value.scrollTop = 0;
}
};
onMounted(async () => {
handleGetHylyList();
await handleGetHotBills();
......@@ -1219,6 +1256,8 @@ onMounted(async () => {
const box9Chart = getPieChart(box9ChartData.value, box9ChartColorList.value);
setChart(box9Chart, "box9Chart");
});
onUnmounted(() => {});
</script>
<style lang="scss" scoped>
......@@ -1848,6 +1887,10 @@ onMounted(async () => {
height: 47px;
width: 464px;
display: flex;
cursor: pointer;
&:hover {
background: var(--color-bg-hover);
}
.itemLeftStatus1 {
color: rgba(82, 196, 26, 1) !important;
background: rgba(246, 255, 237, 1) !important;
......@@ -2685,6 +2728,7 @@ onMounted(async () => {
margin-bottom: 24px;
margin-right: 25px;
position: relative;
cursor: pointer;
.status-box {
position: absolute;
top: 15px;
......
src/views/decree/decreeHome/index.vue
浏览文件 @ bfcfe1ed
......@@ -11,19 +11,19 @@
</div>
</div>
<div class="home-main-header-btn-box">
<div class="btn">
<div class="btn" @click="handleToPosi('position1')">
<div class="btn-text">{{ "最新动态" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="handleToPosi('position2')">
<div class="btn-text">{{ "资讯要闻" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn-text">{{ "统计概览" }}</div>
<div class="btn" @click="handleToPosi('position3')">
<div class="btn-text">{{ "数据总览" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="handleToPosi('position4')">
<div class="btn-text">{{ "资源库" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
......@@ -70,19 +70,19 @@
</div>
</div>
<div class="home-main-header-btn-box" v-show="!isShow">
<div class="btn">
<div class="btn" @click="handleToPosi('position1')">
<div class="btn-text">{{ "最新动态" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="handleToPosi('position2')">
<div class="btn-text">{{ "资讯要闻" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn-text">{{ "统计概览" }}</div>
<div class="btn" @click="handleToPosi('position3')">
<div class="btn-text">{{ "数据总览" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="handleToPosi('position4')">
<div class="btn-text">{{ "资源库" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
......@@ -96,7 +96,7 @@
</div>
</div>
</div>
<DivideHeader class="divide" :titleText="'最新动态'"></DivideHeader>
<DivideHeader id="position1" class="divide" :titleText="'最新动态'"></DivideHeader>
<div class="home-main-center">
<div class="center-top">
<div class="box1">
......@@ -117,7 +117,7 @@
</div>
<div class="title">{{ "最新科技政令" }}</div>
</div>
<div class="box1-header-right" @click="handleClickToDetail()">
<div class="box1-header-right">
{{ "查看详情 >" }}
</div>
</div>
......@@ -176,7 +176,12 @@
<div class="more">{{ "更多 +" }}</div>
</div>
<div class="box2-main">
<div class="box2-main-item" v-for="(item, index) in warningList" :key="index">
<div
class="box2-main-item"
v-for="(item, index) in warningList"
:key="index"
@click="handleClickToDetail()"
>
<div
class="item-left"
:class="{
......@@ -194,15 +199,15 @@
</div>
</div>
</div>
<div class="box2-footer">
<div class="box2-footer" @click="handleToMoreRiskSignal">
<div class="icon">
<img src="./assets/images/box2-footer-icon.png" alt="" />
</div>
<div class="text">{{ "风险处理" }}</div>
<div class="text">{{ "查看更多" }}</div>
</div>
</div>
</div>
<DivideHeader class="divide2" :titleText="'资讯要闻'"></DivideHeader>
<DivideHeader id="position2" class="divide2" :titleText="'资讯要闻'"></DivideHeader>
<div class="center-center">
<div class="box3">
<div class="box3-header">
......@@ -211,6 +216,7 @@
<img src="./assets/images/box3-header-icon.png" alt="" />
</div>
<div class="box3-header-title">{{ "新闻资讯" }}</div>
<div class="more" @click="handleToMoreNews">{{ "更多 +" }}</div>
</div>
</div>
<div class="box3-main">
......@@ -439,7 +445,7 @@
</div>
</div>
</div> -->
<DivideHeader class="divide3" :titleText="'数据总览'"></DivideHeader>
<DivideHeader id="position3" class="divide3" :titleText="'数据总览'"></DivideHeader>
<div class="center-footer">
<div class="box3">
<div class="box3-header">
......@@ -505,7 +511,7 @@
</div>
</div>
<div class="home-main-footer">
<DivideHeader class="divide4" :titleText="'资源库'"></DivideHeader>
<DivideHeader id="position4" class="divide4" :titleText="'资源库'"></DivideHeader>
<div class="home-main-footer-header">
<div class="btn-box">
<div
......@@ -549,7 +555,7 @@
<div class="title">{{ "政令库" }}</div>
</div>
<div class="content-box">
<div class="main-item" v-for="(decree, index) in curDecreeList" :key="index">
<div class="main-item" v-for="(decree, index) in curDecreeList" :key="index" @click="handleClickToDetail">
<div class="main-item-left">
<div
class="left-box"
......@@ -714,7 +720,21 @@ const tagList = ref([
]);
// 点击查看详情
const handleClickToDetail = () => {
router.push("/decreeLayout");
// router.push("/decreeLayout");
const route = router.resolve("/decreeLayout");
window.open(route.href, "_blank");
};
// 查看更多风险信号
const handleToMoreRiskSignal = () => {
const route = router.resolve("/riskSignal");
window.open(route.href, "_blank");
};
// 查看更多新闻资讯
const handleToMoreNews = () => {
const route = router.resolve("/newsBrief");
window.open(route.href, "_blank");
};
// 风险信号
......@@ -1075,6 +1095,24 @@ const calendarData = ref([
["2025-10-21", 190]
]);
const handleToPosi = id => {
// 0 618 1240 2350
switch (id) {
case "position2":
// containerRef.value.scrollTop = isShow.value ? 744 : 1090;
containerRef.value.scrollTop = isShow.value ? 844 : 1190;
break;
case "position3":
containerRef.value.scrollTop = isShow.value ? 1480 : 1826;
break;
case "position4":
containerRef.value.scrollTop = isShow.value ? 2554 : 2900;
break;
default:
containerRef.value.scrollTop = 0;
}
};
onMounted(async () => {
let chart1 = getBarChart(chart1Data.value.dataX, chart1Data.value.dataY);
setChart(chart1, "chart1");
......@@ -1649,6 +1687,10 @@ onMounted(async () => {
height: 47px;
width: 464px;
display: flex;
cursor: pointer;
&:hover {
background: var(--color-bg-hover);
}
.itemLeftStatus1 {
color: rgba(82, 196, 26, 1) !important;
background: rgba(246, 255, 237, 1) !important;
......@@ -1700,7 +1742,7 @@ onMounted(async () => {
}
.box2-footer {
position: absolute;
left: 40px;
left: 45px;
bottom: 20px;
width: 430px;
height: 42px;
......@@ -1709,7 +1751,7 @@ onMounted(async () => {
justify-content: center;
align-items: center;
border-radius: 6px;
background: rgba(22, 119, 255, 1);
background: var(--color-main-active);
cursor: pointer;
.icon {
width: 16px;
......@@ -1754,6 +1796,7 @@ onMounted(async () => {
display: flex;
justify-content: space-between;
padding: 0 20px;
position: relative;
.box3-header-left {
display: flex;
.box3-header-icon {
......@@ -1776,6 +1819,19 @@ onMounted(async () => {
line-height: 22px;
}
}
.more {
width: 49px;
height: 24px;
position: absolute;
top: 14px;
right: 27px;
color: rgba(20, 89, 187, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
cursor: pointer;
}
}
.box3-main {
height: 402px;
......@@ -2710,6 +2766,10 @@ onMounted(async () => {
display: flex;
height: 84px;
border-bottom: 1px solid rgba(234, 236, 238, 1);
cursor: pointer;
&:hover{
background: var(--color-bg-hover);
}
.main-item-left {
width: 105px;
.left-box {
......
src/views/exportControl/components/link.vue
浏览文件 @ bfcfe1ed
......@@ -2,13 +2,14 @@
<div :class="['clickable-card', { disabled: disabled }]" @click="handleClick">
<span class="card-text">{{ text }}</span>
<!-- <span class="arrow-icon">→</span> -->
<el-icon><ArrowRight /></el-icon>
<div class="icon">
<el-icon><ArrowRightBold /></el-icon>
</div>
</div>
</template>
<script setup>
import { defineProps, defineEmits } from "vue";
import { ArrowRight } from "@element-plus/icons-vue";
import { ArrowRight, ArrowRightBold } from "@element-plus/icons-vue";
import { useRouter } from "vue-router";
const router = useRouter();
......@@ -51,7 +52,7 @@ const handleClick = () => {
};
</script>
<style scoped>
<style lang="scss" scoped>
.clickable-card {
width: 160px;
height: 48px;
......@@ -69,6 +70,12 @@ const handleClick = () => {
font-size: 20px;
font-weight: 500;
box-sizing: border-box;
position: relative;
.icon{
position: absolute;
top: 14px;
right: 12px;
}
}
.clickable-card:hover {
......
src/views/exportControl/components/news.vue
浏览文件 @ bfcfe1ed
......@@ -19,7 +19,6 @@
</template>
<script setup>
import { defineProps, defineEmits } from "vue";
const props = defineProps({
listData: {
......
src/views/exportControl/index.vue
浏览文件 @ bfcfe1ed
......@@ -40,10 +40,10 @@
</div>
</div>
<div class="home-main-header-footer-link">
<ClickableCard text="最新动态" link="/billHome" target="_blank" />
<ClickableCard text="资讯要闻" link="/billHome" target="_blank" />
<ClickableCard text="数据总览" link="/billHome" target="_blank" />
<ClickableCard text="资源库" link="/billHome" target="_blank" />
<ClickableCard text="最新动态" @click="scrollToTop('position1')" target="_blank" />
<ClickableCard text="资讯要闻" @click="scrollToTop('position2')" target="_blank" />
<ClickableCard text="数据总览" @click="scrollToTop('position3')" target="_blank" />
<ClickableCard text="资源库" @click="scrollToTop('position4')" target="_blank" />
</div>
<div class="home-main-header-footer-info">
<InfoCard
......@@ -59,7 +59,7 @@
</div>
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="最新动态" style="margin-top: 24px" />
<CustomTitle id="position1" title="最新动态" style="margin-top: 24px" />
<el-col :span="16">
<custom-container titleType="primary" title="最新出口管制政策" :titleIcon="houseIcon" height="450px">
<template #header-right>
......@@ -146,7 +146,7 @@
</custom-container>
</el-col>
<el-col :span="8">
<custom-container titleType="danger" title="风险信号" :titleIcon="dangerIcon" height="450px">
<custom-container titleType="danger" title="风险信号" :headerNum="5" :titleIcon="dangerIcon" height="450px">
<template #header-right>
<el-button type="primary" link>
{{ "更多 +" }}
......@@ -172,11 +172,11 @@
<div class="time">{{ item.time }}</div>
</div>
</div>
<div class="box2-footer">
<div class="box2-footer" @click="handleToMoreRiskSignal">
<div class="icon">
<img src="./assets/images/box2-footer-icon.png" alt="" />
</div>
<div class="text">{{ "风险处理" }}</div>
<div class="text">{{ "查看更多" }}</div>
</div>
</div>
</template>
......@@ -185,11 +185,11 @@
</el-row>
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="资讯要闻" style="margin-top: 64px" />
<CustomTitle id="position2" title="资讯要闻" style="margin-top: 64px" />
<el-col :span="12">
<custom-container title="新闻资讯" :titleIcon="newsIcon" height="450px">
<template #header-right>
<el-button type="primary" link @click="handleClick">
<el-button type="primary" link @click="handleToMoreNews">
{{ "更多 +" }}
</el-button>
</template>
......@@ -248,7 +248,7 @@
</el-row>
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="数据总览" style="margin-top: 64px" />
<CustomTitle id="position3" title="数据总览" style="margin-top: 64px" />
<el-col :span="24">
<custom-container title="发布频度" :titleIcon="box3Icon" height="450px">
<template #default>
......@@ -385,7 +385,7 @@
</el-row>
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="资源库" style="margin-top: 54px" />
<CustomTitle id="position4" title="资源库" style="margin-top: 54px" />
<el-col :span="8">
<custom-container title="历次制裁过程" :titleIcon="listIcon" height="845px">
<template #default>
......@@ -510,97 +510,15 @@
</custom-container>
</el-col>
</el-row>
<!-- <div class="home-main-center">
<div class="center-footer">
<div class="box3">
<div class="box3-header">
<div class="box3-header-left">
<div class="box3-header-icon">
<img src="./assets/images/box3-header-icon.png" alt="" />
</div>
<div class="box3-header-title">{{ "涉华法案数量" }}</div>
</div>
<div class="box3-header-right">
<div class="right-box">
<div class="icon1"></div>
<div class="text">{{ "提出法案" }}</div>
</div>
<div class="right-box">
<div class="icon2"></div>
<div class="text">{{ "通过法案" }}</div>
</div>
</div>
</div>
<div class="box3-main" id="chart1"></div>
</div>
<div class="box4">
<div class="box4-header">
<div class="header-icon">
<img src="./assets/images/box4-header-icon.png" alt="" />
</div>
<div class="header-title">{{ "法案趋势" }}</div>
</div>
<div class="box4-main">
<div class="box4-main-item" v-for="(item, index) in billTrendList" :key="index">
<div
class="left"
:class="{
leftStatus2: index === 1,
leftStatus3: index === 2
}"
>
{{ index < 3 ? index + 1 : "" }}
</div>
<div class="center">{{ item.title }}</div>
<div class="right">{{ item.no }}</div>
</div>
</div>
</div>
</div>
</div>
<div class="home-main-footer">
<div class="home-main-footer-header">
<div class="btn-box">
<div
class="btn"
:class="{ btnActive: activeCate === cate.hylymc }"
v-for="(cate, index) in categoryList"
:key="index"
@click="handleClickCate(cate)"
>
{{ cate.hylymc }}
</div>
</div>
<div class="select-box">
<el-select v-model="releaseTime" placeholder="选择发布时间" style="width: 120px">
<el-option
v-for="item in releaseTimeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</div>
</div>
<div class="home-main-footer-main">
<div class="main-item" v-for="(bill, index) in curBillList" :key="index">
<div class="main-item-box1">
<img :src="bill.img" alt="" />
</div>
<div class="main-item-box2">
{{ bill.billName }}
</div>
<div class="main-item-box3">{{ bill.introductionDate }}</div>
</div>
</div>
</div> -->
</div>
</div>
</template>
<script setup>
import { onMounted, ref, computed } from "vue";
import scrollToTop from "@/utils/scrollToTop";
import * as echarts from "echarts";
import setChart from "@/utils/setChart";
import { DArrowRight, Warning, Search } from "@element-plus/icons-vue";
// import router from "@/router/index";
import EChart from "@/components/Chart/index.vue";
......@@ -673,9 +591,11 @@ const handleBackHome = () => {
};
const handleToDetail = () => {
router.push({
path: "/exportControl/analysis"
});
// router.push({
// path: "/exportControl/analysis"
// });
const route = router.resolve("/exportControl/analysis");
window.open(route.href, "_blank");
};
const billList = ref([]);
......@@ -696,14 +616,18 @@ const infoList = ref([
subTitle: "CCL",
des: "美国《出口管制条例》中列明受管制军民两用物项的清单",
num: 253,
color: "rgba(114, 46, 209, 1)"
// color: "rgba(114, 46, 209, 1)"
color: "rgba(132, 136, 142, 1)"
},
{
title: "关键与新兴技术清单",
subTitle: "CETs",
des: "美国为维护其技术领导地位与国家安全而制定的18项优先发展技术清单",
num: 52,
color: "rgba(250, 140, 22, 1)"
// color: "rgba(250, 140, 22, 1)"
color: "rgba(132, 136, 142, 1)"
},
{
title: "军事最终用户清单 ",
......@@ -804,15 +728,6 @@ const handleSwithCurBill = name => {
curBill.value = billList.value[curBillListIndex.value];
};
const handleClick = () => {
router.push({
path: "/analysis"
// query: {
// billId: curBill.value.billId
// }
});
};
// 发布频度
const tableData1 = ref([
{
......@@ -1221,11 +1136,6 @@ const curBill = ref({
introductionDate: ""
});
const handleClickToDetail = () => {
window.sessionStorage.setItem("billId", curBill.value.billId);
router.push("/billLayout");
};
const billTrendList = ref([
{
title: "限制与中国合作",
......@@ -1509,21 +1419,6 @@ const navList = ref([
}
]);
const activeNavIndex = ref(0);
const handleClickNav = (index, item) => {
activeNavIndex.value = index;
router.push(item.path);
};
// 绘制echarts图表
const setChart = (option, chartId) => {
let chartDom = document.getElementById(chartId);
chartDom.removeAttribute("_echarts_instance_");
let chart = echarts.init(chartDom);
chart.setOption(option);
return chart;
};
const chart1Data = ref({
title: [
......@@ -1582,6 +1477,18 @@ const handleGetBillsByType = async () => {
} catch (error) {}
};
// 查看更多风险信号
const handleToMoreRiskSignal = () => {
const route = router.resolve("/riskSignal");
window.open(route.href, "_blank");
};
// 查看更多新闻资讯
const handleToMoreNews = () => {
const route = router.resolve("/newsBrief");
window.open(route.href, "_blank");
};
onMounted(async () => {
handleGetHylyList();
await handleGetHotBills();
......@@ -1832,7 +1739,7 @@ onMounted(async () => {
justify-content: center;
align-items: center;
border-radius: 6px;
background: rgba(22, 119, 255, 1);
background: var(--color-main-active);
margin: 0 auto;
cursor: pointer;
.icon {
......
src/views/finance/components/news.vue
浏览文件 @ bfcfe1ed
......@@ -19,7 +19,6 @@
</template>
<script setup>
import { defineProps, defineEmits } from "vue";
const props = defineProps({
listData: {
......
src/views/finance/index.vue
浏览文件 @ bfcfe1ed
......@@ -40,21 +40,12 @@
</div>
</div>
<div class="home-main-header-footer-link">
<ClickableCard text="最新动态" link="/billHome" target="_blank" />
<ClickableCard text="资讯要闻" link="/billHome" target="_blank" />
<ClickableCard text="数据总览" link="/billHome" target="_blank" />
<ClickableCard text="资源库" link="/billHome" target="_blank" />
<ClickableCard text="最新动态" @click="scrollToTop('position1')" target="_blank" />
<ClickableCard text="资讯要闻" @click="scrollToTop('position2')" target="_blank" />
<ClickableCard text="数据总览" @click="scrollToTop('position3')" target="_blank" />
<ClickableCard text="资源库" @click="scrollToTop('position4')" target="_blank" />
</div>
<div class="home-main-header-footer-info">
<!-- <InfoCard
v-for="item in infoList"
:key="item.title"
:title="item.title"
:subtitle="''"
:description="item.des"
:quantity="item.num"
:color="item.color"
/> -->
<div class="card" v-for="(item, index) in infoList" :key="index">
<div class="icon" :style="{ background: item.color }"></div>
<div class="title">{{ item.title }}</div>
......@@ -65,7 +56,7 @@
</div>
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="最新动态" style="margin-top: 24px" />
<CustomTitle id="position1" title="最新动态" style="margin-top: 24px" />
<el-col :span="16">
<custom-container titleType="primary" title="最新出口管制政策" :titleIcon="houseIcon" height="450px">
<template #header-right>
......@@ -190,7 +181,7 @@
</el-col>
</el-row>
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="资讯要闻" style="margin-top: 64px" />
<CustomTitle id="position2" title="资讯要闻" style="margin-top: 64px" />
<el-col :span="12">
<custom-container title="新闻资讯" :titleIcon="newsIcon" height="450px">
<template #header-right>
......@@ -253,7 +244,7 @@
</el-row>
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="数据总览" style="margin-top: 64px" />
<CustomTitle id="position3" title="数据总览" style="margin-top: 64px" />
<el-col :span="24">
<custom-container title="发布频度" :titleIcon="box3Icon" height="450px">
<template #default>
......@@ -390,7 +381,7 @@
</el-row>
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="资源库" style="margin-top: 54px" />
<CustomTitle id="position4" title="资源库" style="margin-top: 54px" />
<el-col :span="8">
<custom-container title="制裁历程" :titleIcon="listIcon" height="845px">
<template #default>
......@@ -618,6 +609,7 @@
<script setup>
import { onMounted, ref, computed } from "vue";
import scrollToTop from "@/utils/scrollToTop";
import * as echarts from "echarts";
import { DArrowRight, Warning, Search } from "@element-plus/icons-vue";
// import router from "@/router/index";
......@@ -947,11 +939,11 @@ const trendOption = ref({
}
},
grid: {
top: '8%',
bottom: '5%',
left: '2%',
right: '2%',
containLabel: true,
top: "8%",
bottom: "5%",
left: "2%",
right: "2%",
containLabel: true
},
legend: {
// type: "scroll",
......
src/views/marketAccessRestrictions/marketAccessHome/index.vue
浏览文件 @ bfcfe1ed
......@@ -43,19 +43,19 @@
</div>
</div>
<div class="home-main-header-btn-box">
<div class="btn">
<div class="btn" @click="scrollToTop('position1')">
<div class="btn-text">{{ "最新动态" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="scrollToTop('position2')">
<div class="btn-text">{{ "资讯要闻" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="scrollToTop('position3')">
<div class="btn-text">{{ "统计概览" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
<div class="btn">
<div class="btn" @click="scrollToTop('position4')">
<div class="btn-text">{{ "资源库" }}</div>
<div class="btn-icon">{{ ">" }}</div>
</div>
......@@ -100,7 +100,7 @@
</div>
</div>
<div class="home-main-center">
<DivideHeader class="divide-header" :titleText="'最新动态'"></DivideHeader>
<DivideHeader id="position1" class="divide-header" :titleText="'最新动态'"></DivideHeader>
<div class="center-top">
<div class="box1">
<div class="box1-left">
......@@ -221,7 +221,7 @@
</div>
</div>
</div>
<DivideHeader class="divide-header" :titleText="'资讯要闻'"></DivideHeader>
<DivideHeader id="position2" class="divide-header" :titleText="'资讯要闻'"></DivideHeader>
<div class="center-center">
<div class="box3">
<div class="box3-header">
......@@ -272,7 +272,7 @@
</div>
</div>
</div>
<DivideHeader class="divide-header" :titleText="'数据总览'"></DivideHeader>
<DivideHeader id="position3" class="divide-header" :titleText="'数据总览'"></DivideHeader>
<div class="center-footer">
<div class="box3">
<div class="box3-header">
......@@ -316,7 +316,7 @@
</div>
<div class="home-main-footer">
<DivideHeader class="divide-header" :titleText="'资源库'"></DivideHeader>
<DivideHeader id="position4" class="divide-header" :titleText="'资源库'"></DivideHeader>
<div class="home-main-footer-header">
<div class="btn-box">
<div
......@@ -423,6 +423,7 @@
<script setup>
import { onMounted, ref } from "vue";
import scrollToTop from "@/utils/scrollToTop";
import * as echarts from "echarts";
import router from "@/router";
import DivideHeader from "@/components/DivideHeader.vue";
......
src/views/thinkTank/index.vue
浏览文件 @ bfcfe1ed
......@@ -44,28 +44,22 @@
</div>
</div>
<div class="home-main-header-footer-link">
<ClickableCard text="最新动态" link="/billHome" target="_blank" />
<ClickableCard text="资讯要闻" link="/billHome" target="_blank" />
<ClickableCard text="数据总览" link="/billHome" target="_blank" />
<ClickableCard text="资源库" link="/billHome" target="_blank" />
<ClickableCard text="最新动态" @click="scrollToTop('position1')" target="_blank" />
<ClickableCard text="资讯要闻" @click="scrollToTop('position2')" target="_blank" />
<ClickableCard text="数据总览" @click="scrollToTop('position3')" target="_blank" />
<ClickableCard text="资源库" @click="scrollToTop('position4')" target="_blank" />
</div>
<!-- 智库展示区域 -->
<div class="think-tanks-section">
<ThinkTankCard
v-for="(tank, index) in thinkTanks"
:key="tank.id"
:tank="tank"
:index="index"
@click="handleClick"
/>
<ThinkTankCard v-for="(tank, index) in thinkTanks" :key="tank.id" :tank="tank" :index="index" @click="handleClick" />
<div class="view-all">
<span class="view-all-link">查看全部智库 ></span>
</div>
</div>
<DivideHeader style="margin: 30px auto" :titleText="'最新动态'"></DivideHeader>
<DivideHeader id="position1" style="margin: 30px auto" :titleText="'最新动态'"></DivideHeader>
<!-- 主要内容区域 -->
<div class="main-content">
<!-- 左侧数据分布 -->
......@@ -90,31 +84,46 @@
<!-- 右侧网络信号 -->
<div class="right-section">
<div class="signal-header">
<el-icon class="signal-icon"><Warning /></el-icon>
<div class="signal-title-box">
<span class="signal-title">风险信号</span>
<el-badge :value="5" class="signal-badge" />
</div>
<div class="icon">
<img src="@/assets/images/icon-warning.png" alt="" />
</div>
<div class="signal-title-box">
<span class="signal-title">风险信号</span>
<el-badge :value="5" class="signal-badge" />
</div>
</div>
<div class="signal-list">
<div v-for="signal in signals" :key="signal.id" class="signal-item">
<div class="signal-content">
<div class="signal-left">
<el-tag :type="signal.type" size="small" class="signal-tag">{{ signal.tag }}</el-tag>
<div
size="small"
class="signal-tag"
:class="{
tag1: signal.type === 'success',
tag2: signal.type === 'warning',
tag3: signal.type === 'danger'
}"
>
{{ signal.tag }}
</div>
<div class="signal-text">{{ signal.content }}</div>
</div>
<div class="signal-time">{{ signal.time }}</div>
</div>
</div>
</div>
<el-button type="primary" class="process-btn" block>
查看更多
</el-button>
<div class="box2-footer" @click="handleToMoreRiskSignal">
<div class="icon">
<img src="@/assets/images/more-signal.png" alt="" />
</div>
<div class="text">{{ "查看更多" }}</div>
</div>
<!-- <el-button type="primary" class="process-btn" block> 查看更多 </el-button> -->
</div>
</div>
<DivideHeader style="margin: 30px auto" :titleText="'资讯要闻'"></DivideHeader>
<DivideHeader id="position2" style="margin: 30px auto" :titleText="'资讯要闻'"></DivideHeader>
<!-- 资讯要闻 -->
<div class="center-center">
<div class="box3">
......@@ -124,7 +133,7 @@
<img src="@/views/bill/billHome/assets/images/box3-header-icon.png" alt="" />
</div>
<div class="box3-header-title">{{ "新闻资讯" }}</div>
<div class="more">{{ "更多 +" }}</div>
<div class="more" @click="handleToMoreNews">{{ "更多 +" }}</div>
</div>
</div>
<div class="box3-main">
......@@ -166,9 +175,9 @@
</div>
</div>
</div>
<DivideHeader style="margin: 30px auto" :titleText="'数据总览'"></DivideHeader>
<DivideHeader id="position3" style="margin: 30px auto" :titleText="'数据总览'"></DivideHeader>
<DataOverview />
<DivideHeader style="margin: 30px auto" :titleText="'资源库'"></DivideHeader>
<DivideHeader id="position4" style="margin: 30px auto" :titleText="'资源库'"></DivideHeader>
<ReportList />
</div>
</template>
......@@ -179,7 +188,7 @@ import { Search, Location, Warning, Setting } from "@element-plus/icons-vue";
import * as echarts from "echarts";
import ReportList from "@/views/thinkTank/components/ReportList.vue";
import { useRouter } from "vue-router";
import scrollToTop from "@/utils/scrollToTop";
import { mockThinkTankList } from "./mockData";
import { getThinkTankList } from "@/api";
......@@ -472,21 +481,21 @@ const signals = ref([
{
id: 3,
type: "warning",
tag: "重大",
tag: "重大风险",
content: "战略与国际研究中心发布《DeepSeek、华为、...",
time: "一天前"
},
{
id: 4,
type: "warning",
tag: "重大",
tag: "重大风险",
content: "兰德科技智库发布《中国对AI的转型产业政策》",
time: "一天前"
},
{
id: 5,
type: "success",
tag: "一般",
tag: "一般风险",
content: "兰德科技智库发布《中美对抗、竞争和合作...",
time: "一天前"
}
......@@ -497,12 +506,24 @@ const thinkTanks = ref([]);
const getThinkTanks = async () => {
const { data } = await getThinkTankList();
// thinkTanks.value = data;
thinkTanks.value = [...mockThinkTankList];
thinkTanks.value = [...mockThinkTankList];
};
const handleClick = tank => {
router.push({ name: "ThinkTankDetail", params: { id: tank.id } });
};
// 查看更多风险信号
const handleToMoreRiskSignal = () => {
const route = router.resolve("/riskSignal");
window.open(route.href, "_blank");
};
// 查看更多新闻资讯
const handleToMoreNews = () => {
const route = router.resolve("/newsBrief");
window.open(route.href, "_blank");
};
// 组件挂载后初始化地图
onMounted(() => {
getThinkTanks();
......@@ -538,6 +559,7 @@ onMounted(() => {
}
.tech-think-tank {
font-family: Microsoft YaHei;
max-width: 1650px;
margin: 0 auto;
margin-top: 31px;
......@@ -946,27 +968,34 @@ onMounted(() => {
background: white;
border-radius: 2px;
padding: 20px;
padding-top: 0px;
padding-top: 0px;
}
.signal-header {
display: flex;
align-items: center;
display: flex;
margin-bottom: 15px;
}
.signal-icon {
color: #f56c6c;
margin-right: 2px;
height: 48px;
box-sizing: border-box;
padding-right: 20px;
border-bottom: 1px solid rgba(234, 236, 238, 1);
.icon {
width: 24px;
height: 22px;
margin-left: 18px;
margin-top: 4px;
img {
width: 100%;
height: 100%;
}
}
}
.signal-title-box {
display: flex;
background-color: #C05052;
padding: 10px;
color: #fff;
margin-left: 20px;
display: flex;
background-color: #c05052;
padding: 10px;
color: #fff;
margin-left: 20px;
}
.signal-title {
font-weight: 500;
......@@ -977,17 +1006,44 @@ onMounted(() => {
margin-right: auto;
}
.signal-list {
margin-bottom: 40px;
height: 330px;
height: 370px;
overflow-y: auto;
}
.box2-footer {
margin: 10px auto;
width: 460px;
height: 42px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 6px;
background: var(--color-main-active);
cursor: pointer;
.icon {
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
margin-left: 8px;
color: rgba(255, 255, 255, 1);
font-family: Microsoft YaHei;
font-size: 14px;
font-weight: 400;
line-height: 22px;
}
}
.signal-item {
height: 47px;
line-height: 47px;
margin-bottom: 15px;
padding-bottom: 15px;
border-bottom: 1px solid #f0f0f0;
}
.signal-item:last-child {
......@@ -999,16 +1055,43 @@ onMounted(() => {
justify-content: space-between;
align-items: flex-start;
gap: 12px;
border-bottom: 1px solid #f0f0f0;
}
.signal-left {
flex: 1;
display: flex;
gap: 6px;
height: 47px;
line-height: 47px;
}
.signal-tag {
align-self: flex-start;
margin-top: 4px;
margin-left: 3px;
width: 40px;
height: 40px;
border-radius: 20px;
font-family: Microsoft YaHei;
font-size: 12px;
font-weight: 400;
line-height: 14px;
box-sizing: border-box;
padding: 6px 4px;
text-align: center;
}
.tag1 {
color: rgba(82, 196, 26, 1) !important;
background: rgba(246, 255, 237, 1) !important;
}
.tag2 {
color: rgba(250, 140, 22, 1) !important;
background: rgba(255, 247, 230, 1) !important;
}
.tag3 {
background: rgba(255, 241, 240);
color: rgba(245, 34, 45, 1);
}
.signal-text {
......@@ -1016,6 +1099,8 @@ onMounted(() => {
color: #333;
line-height: 1.4;
word-break: break-word;
height: 47px;
line-height: 47px;
}
.signal-time {
......@@ -1036,12 +1121,11 @@ onMounted(() => {
justify-content: flex-start;
}
.view-all {
text-align: center;
width: 110px;
border-radius: 10px;
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
border-radius: 10px;
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
padding: 0 5px;
background: #fff;
display: flex;
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论