Skip to content

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

update

上级 0feee6c8
显示空白字符变更
内嵌 并排
正在显示 包含 515 行增加 和 294 行删除
src/App.vue
浏览文件 @ 6a94689d
......@@ -7,7 +7,7 @@
<div class="brand-icon">
<img src="@/assets/icons/header-logo.png" alt="" />
</div>
<div class="brand-text">
<div class="brand-text" @click="handleToHome">
<div class="text-ch">某方向风险监测预警系统</div>
<div class="text-en">
National Science and Technology Security Risk Monitoring and Early Warning System
......@@ -101,6 +101,12 @@ import AiBox from "./components/AiBox.vue";
const router = useRouter();
const handleToHome = () => {
router.push({
path: '/overview'
})
}
const isShowAiBox = ref(false);
const closeAiBox = () => {
......@@ -193,6 +199,7 @@ body {
}
.brand-text {
cursor: pointer;
.text-ch {
height: 37px;
color: rgba(10, 18, 30, 1);
......@@ -298,7 +305,7 @@ body {
.ai-btn {
position: absolute;
top: 50%;
bottom: 20%;
right: 46px;
cursor: pointer;
......@@ -313,6 +320,7 @@ body {
}
.text {
margin-top: -15px;
height: 24px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
......@@ -326,7 +334,7 @@ body {
.ai-dialog {
position: absolute;
right: 100px;
top: 50px;
top: 100px;
z-index: 9999;
}
}
......
src/components/AiBox.vue
浏览文件 @ 6a94689d
......@@ -269,7 +269,7 @@ onUnmounted(() => {
<style lang="scss" scoped>
.ai-wrapper {
width: 548px;
height: 1048px;
height: 800px;
box-sizing: border-box;
border: 1px solid rgba(234, 236, 238, 1);
border-radius: 10px;
......@@ -326,7 +326,7 @@ onUnmounted(() => {
}
.main {
height: 830px;
height: 580px;
// background: rgba(225, 225, 225, 0.5);
width: 520px;
margin: 10px auto;
......
src/styles/main.css
浏览文件 @ 6a94689d
:root {
--color-main-active: rgba(10, 87, 166, 1);
--color-main-active: rgba(5, 95, 194, 1);
--color-main-primay: rgba(59, 65, 75, 1);
/* 普通按钮颜色 */
......
src/views/bill/billHome/index.vue
浏览文件 @ 6a94689d
......@@ -2,7 +2,7 @@
<div class="home-wrapper">
<div class="search-header" v-show="isShow">
<div class="home-main-header-center">
<el-input v-model="input" style="width: 680px; height: 100%" placeholder="搜索科技法案" />
<el-input v-model="searchBillText" style="width: 680px; height: 100%" placeholder="搜索科技法案" />
<div class="search">
<div class="search-icon">
<img src="./assets/images/search-icon.png" alt="" />
......@@ -31,8 +31,6 @@
</div>
<div class="home-box" :class="{ scrollHomeBox: isShow }" ref="containerRef">
<div class="home-header" v-show="!isShow">
<!-- <span>国家科技安全 </span>> <span style="cursor: pointer;">中美博弈概览 </span>>
<span>科技法案 </span> -->
<div class="header-item">国家科技安全</div>
<div class="header-item">></div>
<div class="header-item back-item" @click="handleBackHome">中美博弈概览</div>
......@@ -42,7 +40,7 @@
<div class="home-main">
<div class="home-main-header" v-show="!isShow">
<div class="home-main-header-center">
<el-input v-model="input" style="width: 800px; height: 100%" placeholder="搜索科技法案" />
<el-input v-model="searchBillText" style="width: 800px; height: 100%" placeholder="搜索科技法案" />
<div class="search">
<div class="search-icon">
<img src="./assets/images/search-icon.png" alt="" />
......@@ -571,12 +569,14 @@ import Zyy from "@/assets/icons/zyy.png";
import Ghd from "@/assets/icons/ghd.png";
import Mzd from "@/assets/icons/mzd.png";
const searchBillText = ref("");
// 返回首页
const handleBackHome = () => {
router.push({
path: '/overview'
})
}
path: "/overview"
});
};
const currentPage = ref(1);
// 处理页码改变事件
......@@ -1246,12 +1246,16 @@ onMounted(async () => {
box-sizing: border-box;
padding: 1px;
position: relative;
border: 1px solid transparent;
&:hover {
border: 1px solid var(--color-main-active);
}
.search {
position: absolute;
right: 1px;
top: 2px;
right: -1px;
top: 0px;
width: 120px;
height: 44px;
height: 46px;
border-radius: 10px;
background: var(--color-main-active);
display: flex;
......@@ -1368,12 +1372,16 @@ onMounted(async () => {
box-sizing: border-box;
padding: 1px;
position: relative;
border: 1px solid transparent;
&:hover {
border: 1px solid var(--color-main-active);
}
.search {
position: absolute;
right: 1px;
top: 2px;
right: -1px;
top: 0px;
width: 120px;
height: 44px;
height: 46px;
border-radius: 10px;
background: var(--color-main-active);
display: flex;
......@@ -2818,6 +2826,7 @@ onMounted(async () => {
:deep(.el-input__wrapper) {
box-shadow: none;
border-radius: 10px;
}
:deep(.el-input__wrapper:hover) {
box-shadow: none !important;
......
src/views/decree/decreeHome/index.vue
浏览文件 @ 6a94689d
......@@ -644,9 +644,9 @@ import Message3 from "./assets/images/message-icon3.png";
// 返回首页
const handleBackHome = () => {
router.push({
path: '/overview'
})
}
path: "/overview"
});
};
const containerRef = ref(null);
const { isShow } = useContainerScroll(containerRef);
......@@ -1112,17 +1112,22 @@ onMounted(async () => {
box-sizing: border-box;
padding: 1px;
position: relative;
border: 1px solid transparent;
&:hover {
border: 1px solid var(--color-main-active);
}
.search {
position: absolute;
right: 1px;
top: 2px;
right: -1px;
top: 0px;
width: 120px;
height: 44px;
height: 46px;
border-radius: 10px;
background: var(--color-main-active);
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
.search-icon {
width: 18px;
height: 18px;
......@@ -1228,23 +1233,28 @@ onMounted(async () => {
margin-top: 48px;
width: 960px;
height: 48px;
border-radius: 4px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
background: rgba(255, 255, 255, 1);
box-sizing: border-box;
padding: 1px;
position: relative;
border: 1px solid transparent;
&:hover {
border: 1px solid var(--color-main-active);
}
.search {
position: absolute;
right: 1px;
top: 2px;
right: -1px;
top: 0px;
width: 120px;
height: 44px;
height: 46px;
border-radius: 10px;
background: var(--color-main-active);
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
.search-icon {
width: 18px;
height: 18px;
......@@ -1347,6 +1357,11 @@ onMounted(async () => {
align-items: center;
margin: 0 6px 16px 6px;
cursor: pointer;
transition: transform 0.3s ease, box-shadow 0.3s ease;
&:hover {
transform: translateY(-3px);
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}
.item-left {
width: 48px;
height: 48px;
......@@ -2799,6 +2814,7 @@ onMounted(async () => {
:deep(.el-input__wrapper) {
box-shadow: none;
border-radius: 10px;
}
:deep(.el-input__wrapper:hover) {
box-shadow: none !important;
......
src/views/exportControl/index.vue
浏览文件 @ 6a94689d
......@@ -10,25 +10,32 @@
<div class="home-main">
<div class="home-main-header">
<div class="home-main-header-center">
<el-input
<!-- <el-input
v-model="searchKey"
style="width: 100%; height: 48px"
size="large"
placeholder="搜索出口管制调查"
:suffix-icon="Search"
/>
/> -->
<el-input v-model="searchKey" style="width: 800px; height: 100%" placeholder="搜索出口管制调查" />
<div class="search">
<div class="search-icon">
<img src="@/assets/icons/search-icon.png" alt="" />
</div>
<div class="search-text">搜索</div>
</div>
</div>
<div class="home-main-header-footer">
<div class="home-main-header-footer-item">
<div class="item-top">142</div>
<div class="item-top">1096</div>
<div class="item-footer">实体清单</div>
</div>
<div class="home-main-header-footer-item">
<div class="item-top">28</div>
<div class="item-top">2633</div>
<div class="item-footer">商业管制清单</div>
</div>
<div class="home-main-header-footer-item">
<div class="item-top">326</div>
<div class="item-top">162</div>
<div class="item-footer">关键和新型技术清单</div>
</div>
</div>
......@@ -51,71 +58,8 @@
</div>
</div>
<el-row :gutter="20">
<CustomTitle title="资讯要闻" />
<el-col :span="12">
<custom-container title="新闻资讯" :titleIcon="newsIcon" height="450px">
<template #header-right>
<el-button type="primary" link @click="handleClick">
{{ "更多 +" }}
</el-button>
</template>
<template #default>
<div class="news-list">
<NewsList :list-data="customNewsData" />
</div>
</template>
</custom-container>
</el-col>
<el-col :span="12">
<custom-container title="社交媒体" :titleIcon="dialogIcon" height="450px">
<template #header-right>
<el-button type="primary" link>
{{ "更多 +" }}
</el-button>
</template>
<template #default>
<div class="dialog-list">
<!-- <MessageBubble
:avatar="customMessage.avatar"
:name="customMessage.name"
:time="customMessage.time"
:source="customMessage.source"
:content="customMessage.content"
/> -->
<MessageBubble
:avatar="trumpAvatar"
name="唐纳德·特朗普"
time="16:02"
source="发布于真实社交"
content="埃隆·马斯克在强力支持我竞选总统之前，早就知道我强烈反对‘电动汽车强制令’。这太荒谬了，这一直是我竞选活动的主要部分。电动汽车没问题，但不应该强迫每个人都拥有一辆。埃隆获得的补贴可能远远超过历史上任何一个人。如果没有补贴，埃隆可能不得不关门大吉，回到南非老家。"
/>
<MessageBubble
:avatar="elongAvatar"
name="埃隆·马斯克"
time="16:02"
source="发布于真实社交"
content="如果这个疯狂的支出法案获得通过，‘美国党’将在第二天成立。"
/>
<MessageBubble
:avatar="elongAvatar"
name="埃隆·马斯克"
time="16:02"
source="发布于真实社交"
content="提出特朗普政府的AI政策强调技术开放与快速应用，但可能以牺牲安全防范为代价，开启了“潘多拉魔盒”。"
/>
</div>
</template>
</custom-container>
</el-col>
</el-row>
<el-row :gutter="20">
<CustomTitle title="最新动态" />
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="最新动态" style="margin-top: 24px" />
<el-col :span="16">
<custom-container titleType="primary" title="最新出口管制政策" :titleIcon="houseIcon" height="450px">
<template #header-right>
......@@ -240,8 +184,71 @@
</el-col>
</el-row>
<el-row :gutter="20">
<CustomTitle title="数据总览" />
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle 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>
</template>
<template #default>
<div class="news-list">
<NewsList :list-data="customNewsData" />
</div>
</template>
</custom-container>
</el-col>
<el-col :span="12">
<custom-container title="社交媒体" :titleIcon="dialogIcon" height="450px">
<template #header-right>
<el-button type="primary" link>
{{ "更多 +" }}
</el-button>
</template>
<template #default>
<div class="dialog-list">
<!-- <MessageBubble
:avatar="customMessage.avatar"
:name="customMessage.name"
:time="customMessage.time"
:source="customMessage.source"
:content="customMessage.content"
/> -->
<MessageBubble
:avatar="trumpAvatar"
name="唐纳德·特朗普"
time="16:02"
source="发布于真实社交"
content="埃隆·马斯克在强力支持我竞选总统之前，早就知道我强烈反对‘电动汽车强制令’。这太荒谬了，这一直是我竞选活动的主要部分。电动汽车没问题，但不应该强迫每个人都拥有一辆。埃隆获得的补贴可能远远超过历史上任何一个人。如果没有补贴，埃隆可能不得不关门大吉，回到南非老家。"
/>
<MessageBubble
:avatar="elongAvatar"
name="埃隆·马斯克"
time="16:02"
source="发布于真实社交"
content="如果这个疯狂的支出法案获得通过，‘美国党’将在第二天成立。"
/>
<MessageBubble
:avatar="elongAvatar"
name="埃隆·马斯克"
time="16:02"
source="发布于真实社交"
content="提出特朗普政府的AI政策强调技术开放与快速应用，但可能以牺牲安全防范为代价，开启了“潘多拉魔盒”。"
/>
</div>
</template>
</custom-container>
</el-col>
</el-row>
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="数据总览" style="margin-top: 64px" />
<el-col :span="24">
<custom-container title="发布频度" :titleIcon="box3Icon" height="450px">
<template #default>
......@@ -354,7 +361,7 @@
</el-col>
</el-row>
<el-row gutter="20">
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<el-col :span="8">
<custom-container title="制裁领域分析" :titleIcon="radarIcon" height="450px">
<template #header-right>
......@@ -377,8 +384,8 @@
</el-col>
</el-row>
<el-row :gutter="20">
<CustomTitle title="最新动态" />
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="资源库" style="margin-top: 54px" />
<el-col :span="8">
<custom-container title="历次制裁过程" :titleIcon="listIcon" height="845px">
<template #default>
......@@ -661,9 +668,9 @@ import aircasIcon from "./assets/images/aircas.png";
// 返回首页
const handleBackHome = () => {
router.push({
path: '/overview'
})
}
path: "/overview"
});
};
const handleToDetail = () => {
router.push({
......@@ -1996,26 +2003,31 @@ onMounted(async () => {
margin-top: 43px;
}
.home-main-header-center {
margin-top: 13px;
width: 960px;
margin-top: 20px;
width: 800px;
height: 48px;
border-radius: 4px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
background: rgba(255, 255, 255, 1);
box-sizing: border-box;
padding: 1px;
position: relative;
border: 1px solid transparent;
&:hover {
border: 1px solid var(--color-main-active);
}
.search {
position: absolute;
right: 1px;
top: 1px;
right: -1px;
top: 0px;
width: 120px;
height: 42px;
border-radius: 4px;
background: rgba(22, 119, 255, 1);
height: 46px;
border-radius: 10px;
background: var(--color-main-active);
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
.search-icon {
width: 18px;
height: 18px;
......@@ -2067,8 +2079,10 @@ onMounted(async () => {
}
.home-main-header-footer-link,
.home-main-header-footer-info {
width: 1600px;
display: flex;
gap: 30px;
justify-content: center;
gap: 16px;
padding: 30px 0;
}
}
......@@ -2592,4 +2606,16 @@ onMounted(async () => {
}
}
}
:deep(.el-input__wrapper) {
box-shadow: none;
border-radius: 10px;
}
:deep(.el-input__wrapper:hover) {
box-shadow: none !important;
}
:deep(.el-input__wrapper.is-focus) {
box-shadow: none !important;
}
</style>
src/views/finance/components/link.vue
浏览文件 @ 6a94689d
......@@ -2,12 +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 { ArrowRight } from "@element-plus/icons-vue";
import { ArrowRight, ArrowRightBold } from "@element-plus/icons-vue";
import { useRouter } from "vue-router";
const router = useRouter();
......@@ -50,7 +52,7 @@ const handleClick = () => {
};
</script>
<style scoped>
<style lang="scss" scoped>
.clickable-card {
width: 160px;
height: 48px;
......@@ -68,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/finance/components/title.vue
浏览文件 @ 6a94689d
......@@ -41,8 +41,8 @@ defineProps({
}
.title-text {
font-size: 20px;
font-weight: bold;
font-size: 32px;
font-weight: 700;
margin-left: 20px;
white-space: nowrap;
}
......
src/views/finance/index.vue
浏览文件 @ 6a94689d
<template>
<div class="home-wrapper">
<div class="home-header">
<!-- <span>国家科技安全 </span>> <span>中美博弈概览 </span>>
<span>投融资限制 </span> -->
<div class="header-item">国家科技安全</div>
<div class="header-item">></div>
<div class="header-item back-item" @click="handleBackHome">中美博弈概览</div>
......@@ -12,13 +10,20 @@
<div class="home-main">
<div class="home-main-header">
<div class="home-main-header-center">
<el-input
<!-- <el-input
v-model="searchKey"
style="width: 100%; height: 48px"
size="large"
placeholder="搜索出口管制调查"
:suffix-icon="Search"
/>
/> -->
<el-input v-model="searchKey" style="width: 800px; height: 100%" placeholder="搜索出口管制政策" />
<div class="search">
<div class="search-icon">
<img src="@/assets/icons/search-icon.png" alt="" />
</div>
<div class="search-text">搜索</div>
</div>
</div>
<div class="home-main-header-footer">
<div class="home-main-header-footer-item">
......@@ -41,83 +46,26 @@
<ClickableCard text="资源库" link="/billHome" target="_blank" />
</div>
<div class="home-main-header-footer-info">
<InfoCard
<!-- <InfoCard
v-for="item in infoList"
:key="item.title"
:title="item.title"
:subtitle="item.subTitle"
: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>
<div class="content">{{ item.des }}</div>
<div class="num" :style="{ color: item.color }">{{ item.num + "项" }}</div>
</div>
</div>
<el-row :gutter="20">
<CustomTitle title="资讯要闻" />
<el-col :span="12">
<custom-container title="新闻资讯" :titleIcon="newsIcon" height="450px">
<template #header-right>
<el-button type="primary" link @click="handleClick">
{{ "更多 +" }}
</el-button>
</template>
<template #default>
<div class="news-list">
<NewsList :list-data="customNewsData" />
</div>
</template>
</custom-container>
</el-col>
<el-col :span="12">
<custom-container title="社交媒体" :titleIcon="dialogIcon" height="450px">
<template #header-right>
<el-button type="primary" link>
{{ "更多 +" }}
</el-button>
</template>
<template #default>
<div class="dialog-list">
<!-- <MessageBubble
:avatar="customMessage.avatar"
:name="customMessage.name"
:time="customMessage.time"
:source="customMessage.source"
:content="customMessage.content"
/> -->
<MessageBubble
:avatar="trumpAvatar"
name="唐纳德·特朗普"
time="16:02"
source="发布于真实社交"
content="埃隆·马斯克在强力支持我竞选总统之前，早就知道我强烈反对‘电动汽车强制令’。这太荒谬了，这一直是我竞选活动的主要部分。电动汽车没问题，但不应该强迫每个人都拥有一辆。埃隆获得的补贴可能远远超过历史上任何一个人。如果没有补贴，埃隆可能不得不关门大吉，回到南非老家。"
/>
<MessageBubble
:avatar="elongAvatar"
name="埃隆·马斯克"
time="16:02"
source="发布于真实社交"
content="如果这个疯狂的支出法案获得通过，‘美国党’将在第二天成立。"
/>
<MessageBubble
:avatar="elongAvatar"
name="埃隆·马斯克"
time="16:02"
source="发布于真实社交"
content="提出特朗普政府的AI政策强调技术开放与快速应用，但可能以牺牲安全防范为代价，开启了“潘多拉魔盒”。"
/>
</div>
</template>
</custom-container>
</el-col>
</el-row>
<el-row :gutter="20">
<CustomTitle title="最新动态" />
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="最新动态" style="margin-top: 24px" />
<el-col :span="16">
<custom-container titleType="primary" title="最新出口管制政策" :titleIcon="houseIcon" height="450px">
<template #header-right>
......@@ -241,9 +189,71 @@
</custom-container>
</el-col>
</el-row>
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle 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>
</template>
<template #default>
<div class="news-list">
<NewsList :list-data="customNewsData" />
</div>
</template>
</custom-container>
</el-col>
<el-col :span="12">
<custom-container title="社交媒体" :titleIcon="dialogIcon" height="450px">
<template #header-right>
<el-button type="primary" link>
{{ "更多 +" }}
</el-button>
</template>
<template #default>
<div class="dialog-list">
<!-- <MessageBubble
:avatar="customMessage.avatar"
:name="customMessage.name"
:time="customMessage.time"
:source="customMessage.source"
:content="customMessage.content"
/> -->
<MessageBubble
:avatar="trumpAvatar"
name="唐纳德·特朗普"
time="16:02"
source="发布于真实社交"
content="埃隆·马斯克在强力支持我竞选总统之前，早就知道我强烈反对‘电动汽车强制令’。这太荒谬了，这一直是我竞选活动的主要部分。电动汽车没问题，但不应该强迫每个人都拥有一辆。埃隆获得的补贴可能远远超过历史上任何一个人。如果没有补贴，埃隆可能不得不关门大吉，回到南非老家。"
/>
<MessageBubble
:avatar="elongAvatar"
name="埃隆·马斯克"
time="16:02"
source="发布于真实社交"
content="如果这个疯狂的支出法案获得通过，‘美国党’将在第二天成立。"
/>
<MessageBubble
:avatar="elongAvatar"
name="埃隆·马斯克"
time="16:02"
source="发布于真实社交"
content="提出特朗普政府的AI政策强调技术开放与快速应用，但可能以牺牲安全防范为代价，开启了“潘多拉魔盒”。"
/>
</div>
</template>
</custom-container>
</el-col>
</el-row>
<el-row :gutter="20">
<CustomTitle title="数据总览" />
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="数据总览" style="margin-top: 64px" />
<el-col :span="24">
<custom-container title="发布频度" :titleIcon="box3Icon" height="450px">
<template #default>
......@@ -356,14 +366,14 @@
</el-col>
</el-row>
<el-row gutter="20">
<el-row gutter="20" style="width: 1600px; margin: 0 auto">
<el-col :span="8">
<custom-container title="制裁领域分析" :titleIcon="radarIcon" height="450px">
<template #header-right>
<el-checkbox v-model="checked" label="50%规则" size="large" />
</template>
<template #default>
<EChart :option="radarOption" autoresize :style="{ height: '450px' }" />
<EChart :option="radarOption" autoresize :style="{ height: '400px' }" />
</template>
</custom-container>
</el-col>
......@@ -379,10 +389,10 @@
</el-col>
</el-row>
<el-row :gutter="20">
<CustomTitle title="最新动态" />
<el-row :gutter="20" style="width: 1600px; margin: 0 auto">
<CustomTitle title="资源库" style="margin-top: 54px" />
<el-col :span="8">
<custom-container title="历次制裁过程" :titleIcon="listIcon" height="845px">
<custom-container title="制裁历程" :titleIcon="listIcon" height="845px">
<template #default>
<div class="box4">
<div class="box4-item" v-for="(item, idx) in sanctionProcessList" :key="item.title">
......@@ -426,15 +436,24 @@
header-row-class-name="table-header"
row-class-name="table-row"
>
<el-table-column prop="index" label="序号" width="80" align="center">
<!-- <el-table-column prop="index" label="序号" width="80" align="center">
<template #default="scope">
{{ scope.$index + 1 + (currentPage - 1) * pageSize }}
</template>
</el-table-column>
</el-table-column> -->
<el-table-column prop="name" label="实体名称" min-width="200">
<template #default="scope">
<div style="font-weight: 500">{{ scope.row.name }}</div>
<div
style="
font-weight: 700;
font-size: 16px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
"
>
{{ scope.row.name }}
</div>
</template>
</el-table-column>
......@@ -450,7 +469,11 @@
</div>
</template>
</el-table-column>
<el-table-column prop="sanctionDate" label="上市地点" width="120" align="center">
<template #default="scope">
{{ scope.row.listingLocation ? scope.row.listingLocation : "--" }}
</template>
</el-table-column>
<el-table-column prop="sanctionDate" label="制裁时间" width="120" align="center">
<template #default="scope">
{{ scope.row.sanctionDate }}
......@@ -663,9 +686,9 @@ import aircasIcon from "./assets/images/aircas.png";
// 返回首页
const handleBackHome = () => {
router.push({
path: '/overview'
})
}
path: "/overview"
});
};
const handleToDetail = () => {
router.push({
......@@ -679,33 +702,45 @@ const curBillListIndex = ref(0);
const searchKey = ref("");
const infoList = ref([
// {
// title: "实体清单",
// subTitle: "Entity List",
// des: "美国商务部工业与安全局依据《出口管理条例》建立的出口管制机制",
// num: 956,
// color: "rgba(206, 79, 81, 1)"
// },
// {
// title: "商业管制清单 ",
// subTitle: "CCL",
// des: "美国《出口管制条例》中列明受管制军民两用物项的清单",
// num: 253,
// color: "rgba(114, 46, 209, 1)"
// },
// {
// title: "关键与新兴技术清单",
// subTitle: "CETs",
// des: "美国为维护其技术领导地位与国家安全而制定的18项优先发展技术清单",
// num: 52,
// color: "rgba(250, 140, 22, 1)"
// },
// {
// title: "军事最终用户清单 ",
// subTitle: "MEU",
// des: "美国商务部制定的限制特定外国实体获取可能用于军事用途的美国技术的清单",
// num: 0,
// color: "rgba(132, 136, 142, 1)"
// }
{
title: "实体清单",
subTitle: "Entity List",
des: "美国商务部工业与安全局依据《出口管理条例》建立的出口管制机制",
num: 956,
color: "rgba(206, 79, 81, 1)"
title: "SDN清单",
des: "由美国财政部海外资产控制办公室（OFAC）管理，通过切断目标实体或个人与美国金融体系的联系，以实现美国的外交政策和国家安全目标。",
num: 87,
color: "rgba(5, 95, 194, 1)"
},
{
title: "商业管制清单 ",
subTitle: "CCL",
des: "美国《出口管制条例》中列明受管制军民两用物项的清单",
num: 253,
title: "CMIC清单",
des: "由美国财政部海外资产控制办公室（OFAC）管理，通过切断目标实体或个人与美国金融体系的联系，以实现美国的外交政策和国家安全目标。",
num: 3,
color: "rgba(114, 46, 209, 1)"
},
{
title: "关键与新兴技术清单",
subTitle: "CETs",
des: "美国为维护其技术领导地位与国家安全而制定的18项优先发展技术清单",
num: 52,
color: "rgba(250, 140, 22, 1)"
},
{
title: "军事最终用户清单 ",
subTitle: "MEU",
des: "美国商务部制定的限制特定外国实体获取可能用于军事用途的美国技术的清单",
num: 0,
color: "rgba(132, 136, 142, 1)"
}
]);
......@@ -912,7 +947,11 @@ const trendOption = ref({
}
},
grid: {
top: 50
top: '8%',
bottom: '5%',
left: '2%',
right: '2%',
containLabel: true,
},
legend: {
// type: "scroll",
......@@ -1019,30 +1058,30 @@ const trendOption = ref({
// 历次制裁过程
const sanctionProcessList = ref([
{
title: "2025年3月—实体清单（BIS）",
title: "2025年3月—SDN清单",
desc: "54家中国实体",
content:
"2025年3月25日，美国商务部工业与安全局以从事有悖于美国国家安全和外交政策利益的活动为由，宣布将来自中国的54家实体新增至“实体清单”。"
},
{
title: "2025年1月—实体清单（BIS）",
title: "2025年1月—SDN清单",
desc: "25家中国实体",
content:
"2025年1月15日，美国商务部工业和安全局宣布更新《出口管理条例》（EAR），并发布两项最终规则，将25家中国企业及其相关实体列入实体清单。"
},
{
title: "2024年12月—商业管制清单（BIS）",
title: "2025年12月—SDN清单",
desc: "12家中国实体",
content:
"2024年12月20日，美国商务部工业与安全局以从事有悖于美国国家安全和外交政策利益的活动为由，宣布将来自中国的12家实体新增至“商业管制清单”。"
},
{
title: "2024年10月—商业管制清单（BIS）",
title: "2024年10月—CMIC清单",
desc: "6家中国实体",
content: "2024年10月21日，美国商务部将6个中国实体加入其“实体清单”，同时将 1 个中国实体移出该清单。"
},
{
title: "2024年8月—商业管制清单（BIS）",
title: "2024年8月—SDN清单",
desc: "39家中国实体",
content: "2024年8月23日，美国商务部工业安全局发布公告，将多个外国实体加入其“实体清单”，其中包括39个中国实体。"
}
......@@ -1076,77 +1115,80 @@ const mockData = [
domains: ["人工智能"],
sanctionDate: "2025年9月",
strength: "strong",
revenue: "325"
revenue: "325",
listingLocation: "深圳"
},
{
name: "华为技术有限公司",
domains: ["通信网络", "集成电路"],
sanctionDate: "2025年9月",
strength: "medium",
revenue: "290"
revenue: "290",
listingLocation: ""
},
{
name: "中国航空工业集团",
domains: ["航空航天"],
sanctionDate: "2025年9月",
strength: "medium",
revenue: "288"
revenue: "288",
listingLocation: ""
},
{
name: "杭州海康威视数字技术股份有限公司",
domains: ["人工智能"],
sanctionDate: "2025年9月",
strength: "weak",
revenue: "203"
revenue: "203",
listingLocation: "深圳"
},
{
name: "浪潮集团有限公司",
domains: ["人工智能"],
sanctionDate: "2025年9月",
strength: "medium",
revenue: "195"
revenue: "195",
listingLocation: "香港"
},
{
name: "中芯国际集成电路制造有限公司",
domains: ["集成电路"],
sanctionDate: "2025年9月",
strength: "medium",
revenue: "190"
revenue: "190",
listingLocation: ""
},
{
name: "北京复旦微电子技术有限公司",
domains: ["集成电路"],
sanctionDate: "2025年9月",
strength: "medium",
revenue: "184"
revenue: "184",
listingLocation: ""
},
{
name: "哈尔滨工业大学",
domains: ["人工智能", "集成电路"],
sanctionDate: "2025年9月",
strength: "medium",
revenue: "无营收数据"
},
{
name: "ZTE中兴",
domains: ["通信网络", "集成电路"],
sanctionDate: "2025年9月",
strength: "medium",
revenue: "154"
revenue: "无营收数据",
listingLocation: ""
},
{
name: "中兴通讯股份有限公司",
domains: ["通信网络", "集成电路"],
sanctionDate: "2025年9月",
strength: "medium",
revenue: "117"
revenue: "117",
listingLocation: "上海"
},
{
name: "大疆创新科技有限公司",
domains: ["航空航天"],
sanctionDate: "2025年9月",
strength: "medium",
revenue: "1"
revenue: "1",
listingLocation: "纽约"
}
];
......@@ -1998,26 +2040,32 @@ onMounted(async () => {
margin-top: 43px;
}
.home-main-header-center {
margin-top: 13px;
width: 960px;
margin: 0 auto;
margin-top: 20px;
width: 800px;
height: 48px;
border-radius: 4px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
background: rgba(255, 255, 255, 1);
box-sizing: border-box;
padding: 1px;
position: relative;
border: 1px solid transparent;
&:hover {
border: 1px solid var(--color-main-active);
}
.search {
position: absolute;
right: 1px;
top: 1px;
right: -1px;
top: 0px;
width: 120px;
height: 42px;
border-radius: 4px;
background: rgba(22, 119, 255, 1);
height: 46px;
border-radius: 10px;
background: var(--color-main-active);
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
.search-icon {
width: 18px;
height: 18px;
......@@ -2067,11 +2115,78 @@ onMounted(async () => {
}
}
}
.home-main-header-footer-link,
.home-main-header-footer-link {
display: flex;
justify-content: center;
padding: 30px 0;
gap: 16px;
}
.home-main-header-footer-info {
width: 1600px;
display: flex;
gap: 30px;
justify-content: space-between;
padding: 30px 0;
.card {
box-sizing: border-box;
width: 792px;
height: 142px;
box-sizing: border-box;
border: 1px solid rgba(255, 255, 255, 1);
border-radius: 10px;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 0.65);
position: relative;
transition: transform 0.3s ease, box-shadow 0.3s ease;
cursor: pointer;
&:hover {
transform: translateY(-3px);
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}
.icon {
position: absolute;
width: 4px;
height: 111px;
top: 15px;
left: 0;
}
.title {
margin-top: 23px;
height: 31px;
margin-left: 30px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 24px;
font-weight: 700;
line-height: 32px;
letter-spacing: 0px;
text-align: left;
}
.content {
margin-top: 17px;
margin-left: 30px;
width: 731px;
height: 48px;
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0px;
text-align: left;
}
.num {
height: 42px;
text-align: right;
position: absolute;
top: 21px;
right: 31px;
font-family: Microsoft YaHei;
font-size: 32px;
font-weight: 700;
line-height: 42px;
letter-spacing: 0px;
}
}
}
}
.home-main-center {
......@@ -2594,4 +2709,18 @@ onMounted(async () => {
}
}
}
:deep(.el-input__wrapper) {
box-shadow: none;
border-radius: 10px;
}
:deep(.el-input__wrapper) {
box-shadow: none;
}
:deep(.el-input__wrapper:hover) {
box-shadow: none !important;
}
:deep(.el-input__wrapper.is-focus) {
box-shadow: none !important;
}
</style>
src/views/marketAccessRestrictions/marketAccessHome/index.vue
浏览文件 @ 6a94689d
......@@ -61,7 +61,7 @@
</div>
</div>
<div class="home-main-header-card-box">
<div class="home-main-header-card-box-box1">
<div class="home-main-header-card-box-box1 card">
<div class="header">
<div class="header-left">{{ "301调查" }}</div>
<div class="header-right">{{ "52项" }}</div>
......@@ -73,7 +73,7 @@
</div>
</div>
</div>
<div class="home-main-header-card-box-box2">
<div class="home-main-header-card-box-box2 card">
<div class="header">
<div class="header-left">{{ "232调查" }}</div>
<div class="header-right">{{ "3项" }}</div>
......@@ -85,7 +85,7 @@
</div>
</div>
</div>
<div class="home-main-header-card-box-box3">
<div class="home-main-header-card-box-box3 card">
<div class="header">
<div class="header-left">{{ "337调查" }}</div>
<div class="header-right">{{ "87项" }}</div>
......@@ -217,7 +217,7 @@
<div class="icon">
<img src="./assets/images/box2-footer-icon.png" alt="" />
</div>
<div class="text">{{ "风险处理" }}</div>
<div class="text">{{ "查看更多" }}</div>
</div>
</div>
</div>
......@@ -443,9 +443,9 @@ import Message3 from "./assets/images/message-icon3.png";
// 返回首页
const handleBackHome = () => {
router.push({
path: '/overview'
})
}
path: "/overview"
});
};
const handleClickToDetail = () => {
router.push("/marketAccessLayout");
......@@ -861,18 +861,22 @@ onMounted(async () => {
margin-top: 48px;
width: 960px;
height: 48px;
border-radius: 4px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
background: rgba(255, 255, 255, 1);
box-sizing: border-box;
padding: 1px;
position: relative;
border: 1px solid transparent;
&:hover {
border: 1px solid var(--color-main-active);
}
.search {
position: absolute;
right: 1px;
top: 2px;
right: -1px;
top: 0px;
width: 120px;
height: 44px;
height: 46px;
border-radius: 10px;
background: var(--color-main-active);
display: flex;
......@@ -952,7 +956,7 @@ onMounted(async () => {
font-family: Microsoft YaHei;
font-size: 20px;
font-weight: 400;
line-height: 36px;
line-height: 34px;
margin-left: 5px;
}
.btn-icon {
......@@ -975,13 +979,22 @@ onMounted(async () => {
margin-top: 64px;
display: flex;
justify-content: space-between;
.card {
transition: transform 0.3s ease, box-shadow 0.3s ease;
&:hover {
transform: translateY(-3px);
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}
}
.home-main-header-card-box-box1 {
width: 520px;
height: 142px;
background: #fff;
border-radius: 4px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
position: relative;
cursor: pointer;
&::before {
content: "";
position: absolute;
......@@ -1033,9 +1046,13 @@ onMounted(async () => {
width: 520px;
height: 142px;
background: #fff;
border-radius: 4px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
position: relative;
cursor: pointer;
// &:hover {
// margin-top: -2px;
// }
&::before {
content: "";
position: absolute;
......@@ -1087,9 +1104,14 @@ onMounted(async () => {
width: 520px;
height: 142px;
background: #fff;
border-radius: 4px;
border-radius: 10px;
box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
position: relative;
cursor: pointer;
// &:hover {
// margin-top: -3px;
// box-shadow: 0 0 5px 5px rgba(10, 87, 166, 0.1);
// }
&::before {
content: "";
position: absolute;
......@@ -1153,8 +1175,6 @@ onMounted(async () => {
box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
background: #fff;
box-sizing: border-box;
padding-left: 31px;
padding-right: 41px;
position: relative;
.box1-left {
position: absolute;
......@@ -1185,6 +1205,8 @@ onMounted(async () => {
border-bottom: 1px solid rgba(240, 242, 244, 1);
display: flex;
justify-content: space-between;
padding-left: 31px;
padding-right: 41px;
.box1-header-left {
display: flex;
.icon {
......@@ -1224,6 +1246,7 @@ onMounted(async () => {
width: 1064px;
height: 354px;
margin-top: 22px;
margin-left: 31px;
.box1-main-header {
width: 990px;
height: 54px;
......@@ -1355,19 +1378,19 @@ onMounted(async () => {
}
.box2 {
width: 521px;
padding-right: 20px;
height: 450px;
box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
background: rgba(255, 255, 255, 1);
position: relative;
.box2-header {
height: 54px;
height: 48px;
border-bottom: 1px solid rgba(240, 242, 244, 1);
display: flex;
.icon {
width: 24px;
height: 22px;
margin-left: 33px;
margin-top: 18px;
margin-top: 13px;
img {
width: 100%;
height: 100%;
......@@ -1376,11 +1399,12 @@ onMounted(async () => {
.title {
display: flex;
width: 148px;
height: 48px;
background: rgba(206, 79, 81, 1);
margin-left: 25px;
.text {
margin-left: 15px;
margin-top: 16px;
margin-top: 13px;
height: 22px;
color: #fff;
font-family: Microsoft YaHei;
......@@ -1397,13 +1421,13 @@ onMounted(async () => {
font-family: Microsoft YaHei;
font-size: 12px;
margin-left: 15px;
margin-top: 18px;
margin-top: 14px;
border-radius: 100px;
background: rgba(255, 255, 255, 0.3);
}
}
.more {
margin-top: 19px;
margin-top: 16px;
margin-left: 200px;
color: rgba(20, 89, 187, 1);
font-family: Microsoft YaHei;
......@@ -1414,7 +1438,8 @@ onMounted(async () => {
}
}
.box2-main {
height: 282px;
margin-top: 2px;
height: 330px;
overflow-y: auto;
.box2-main-item {
margin-left: 23px;
......@@ -1449,7 +1474,6 @@ onMounted(async () => {
margin-left: 13px;
width: 408px;
height: 47px;
border-top: 1px solid rgba(240, 242, 244, 1);
border-bottom: 1px solid rgba(240, 242, 244, 1);
display: flex;
.text {
......@@ -1473,16 +1497,17 @@ onMounted(async () => {
}
.box2-footer {
position: absolute;
left: 40px;
left: 30px;
bottom: 20px;
width: 430px;
width: 460px;
height: 42px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 6px;
background: rgba(22, 119, 255, 1);
background: var(--color-main-active);
gap: 8px;
cursor: pointer;
.icon {
width: 16px;
......@@ -1493,10 +1518,9 @@ onMounted(async () => {
}
}
.text {
margin-left: 8px;
color: rgba(255, 255, 255, 1);
font-family: Microsoft YaHei;
font-size: 14px;
font-size: 16px;
font-weight: 400;
line-height: 22px;
}
......@@ -2161,6 +2185,7 @@ onMounted(async () => {
}
:deep(.el-input__wrapper) {
box-shadow: none;
border-radius: 10px;
}
:deep(.el-input__wrapper:hover) {
box-shadow: none !important;
......
src/views/marketAccessRestrictions/marketAccessLayout/index.vue
浏览文件 @ 6a94689d
......@@ -137,7 +137,7 @@ const handleClickBtn = (item) => {
width: 120px;
height: 36px;
border-radius: 6px;
background: rgba(22, 119, 255, 1);
background: var(--color-main-active);
display: flex;
cursor: pointer;
.icon {
......
src/views/marketAccessRestrictions/singleCaseLayout/index.vue
浏览文件 @ 6a94689d
......@@ -223,7 +223,7 @@ const handleClickNav = (index) => {
width: 120px;
height: 36px;
border-radius: 6px;
background: rgba(22, 119, 255, 1);
background: var(--color-main-active);
display: flex;
cursor: pointer;
.icon {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论