规则限制

src/api/exportControlV2.0.js

@@ -278,6 +278,7 @@ export function getSingleSanctionBackground(data) {
  * @param {Boolean} [data.isOnlyCn=true] - 是否仅查询中国数据
  * @param {String} [data.domainId] - 科技领域ID
  * @param {String} [data.searchText] - 搜索文本
+ * @param {String} [data.searchType] - 搜索类型
  * @header token
  */
 export function getSingleSanctionOverviewList(data) {

src/api/ruleRestriction/ruleRestriction.js

+import request from "@/api/request.js";
+
+// 规则限制-首页统计接口
+export function getRuleRestrictionStatistics() {
+    return request({
+        method: 'GET',
+        url: `/api/ruleLimitInfo/statCount`
+    })
+}
+
+// 规则限制-查询最新动态接口
+export function getRuleRestrictionLatest(params) {
+    return request({
+        method: 'GET',
+        url: `/api/ruleLimitInfo/getLatestUpdates`,
+        params
+    })
+}
+
+// 规则限制-获取风险信号接口
+/**
+ * @param {moduleId} 模块ID
+ * @header token
+ */
+export function getRuleRestrictionRiskSignal(params) {
+    return request({
+        method: 'GET',
+        url: `/api/commonFeature/riskSignal/${params.moduleId}`
+    })
+}
+
+// 规则限制-获取新闻资讯接口
+/**
+ * @param {moduleId} 模块ID
+ * @header token
+ */
+export function getRuleRestrictionNews(params) {
+    return request({
+        method: 'GET',
+        url: `/api/commonFeature/news/${params.moduleId}`
+    })
+}
+
+// 规则限制-获取社交媒体接口
+/**
+ * @param {moduleId} 模块ID
+ * @header token
+ */
+export function getRuleRestrictionSocialMedia(params) {
+    return request({
+        method: 'GET',
+        url: `/api/commonFeature/remarks/${params.moduleId}`
+    })
+}
\ No newline at end of file

src/views/bill/background/index.vue

@@ -938,9 +938,9 @@ onMounted(() => {
 						height: 22px;
 						color: rgba(95, 101, 108, 1);
 						font-family: Microsoft YaHei;
-						font-size: 14px;
-						font-weight: 600;
-						line-height: 22px;
+						font-size: 16px;
+						font-weight: 400;
+						line-height: 24px;
 						letter-spacing: 0px;
 						text-align: left;
 

src/views/bill/billLayout/index.vue

@@ -274,11 +274,9 @@ onMounted(() => {
 			display: flex;
 			justify-content: space-between;
 			margin: 0 auto;
-			padding: 14px 0;
+			padding-top: 10px;
 			.layout-main-header-left-box {
 				width: 900px;
-				// margin-left: 160px;
-				// margin-top: 13px;
 				.left-box-top {
 					height: 64px;
 					display: flex;

src/views/bill/deepDig/poliContribution/index.vue

@@ -933,7 +933,7 @@ onMounted(() => {
 		width: 1064px;
 		height: 846px;
 		.box2 {
-			width: 1064px;
+			width: 1210px;
 			height: 415px;
 			border: 1px solid rgba(234, 236, 238, 1);
 			border-radius: 10px;
@@ -948,7 +948,7 @@ onMounted(() => {
 		}
 		.box3 {
 			margin-top: 16px;
-			width: 1064px;
+			width: 1210px;
 			height: 415px;
 			border: 1px solid rgba(234, 236, 238, 1);
 			border-radius: 10px;

src/views/bill/deepDig/processAnalysis/index.vue

@@ -1103,7 +1103,7 @@ onMounted(async () => {
 	.right {
 		margin-left: 16px;
 		margin-top: 16px;
-		width: 860px;
+		width: 868px;
 		height: 847px;
 		background: rgb(255, 255, 255);
 		.box3 {

src/views/bill/template/index.vue

@@ -182,26 +182,12 @@ const handleSelectBtn = index => {
 	btnActiveIndex.value = index;
 };
 
-const chart1Data = ref([
-	{ name: "出口管制", value: 24 },
-	{ name: "金融制裁", value: 30 },
-	{ name: "资本管制", value: 31 },
-	{ name: "对台军售", value: 32 },
-	{ name: "关税贸易", value: 50 },
-	{ name: "技术封锁", value: 46 },
-	{ name: "供应链打压", value: 40 }
-]);
+const chart1Data = ref([]);
 const chart1ColorList = ref(["#4096ff", "#b37feb", "#ff7875", "#85a5ff", "#69b1ff", "#ffc069", "#87e8de"]);
 
 const chart2ColorList = ref(["#ff7875", "#85a5ff", "#95de64", "#ffc069", "#85e5db"]);
 
-const chart2Data = ref([
-	// { name: "军工", value: 85 },
-	// { name: "金融业", value: 98 },
-	// { name: "新能源", value: 95 },
-	// { name: "半导体", value: 80 },
-	// { name: "跨境电商", value: 71 },
-]);
+const chart2Data = ref([]);
 
 // 绘制echarts图表
 const setChart = (option, chartId) => {
@@ -367,8 +353,6 @@ onMounted(async () => {
 	handleGetBillContentTk("N");
 	await handleGetBillContentXzfs();
 	await handleGetBillHyly();
-	let chart1 = getPieChart(chart1Data.value, chart1ColorList.value);
-	setChart(chart1, "chart1");
 });
 </script>
 

src/views/coopRestriction/components/dataNew/index.vue

@@ -142,7 +142,8 @@ const getCoopRestrictionSignalsData = async () => {
 				id: item.signalId,
 				title: item.signalLevel,
 				content: item.signalTitle,
-				time: item.signalTime
+				time: item.signalTime,
+				cooperationId: item.cooperationId
 			}));
 		}
 	} catch (error) {
@@ -211,7 +212,7 @@ const handleClickToDetail = item => {
 const handleToRiskDetail = (item) => {
 	const curRoute = router.resolve({
 		path: "/cooperationRestrictions/detail",
-		query: { id: item.id },
+		query: { id: item.cooperationId },
 	});
 	window.open(curRoute.href, "_blank");
 };

src/views/exportControl/v2.0SingleSanction/components/impactAnalysis/components/industrialImpact/index.vue

@@ -480,74 +480,30 @@ const activeMarketShare = ref("总体市场份额");
 const marketShareOptions = ["总体市场份额"];
 
 const chartData = ref({
-	dates: [
-		"2023\nQ3",
-		"2023\nQ4",
-		"2024\nQ1",
-		"2024\nQ2",
-		"2024\nQ3",
-		"2024\nQ4",
-		"2025\nQ1",
-		"2025\nQ2",
-		"2025\nQ3",
-		"2025\nQ4"
-	],
-	values: [620, 650, 600, 480, 480, 420, 480, 520, 650, 650],
-	sanctionDate: "2024\nQ1",
-	endValue: 645
+	dates: [],
+	values: [],
+	sanctionDate: "",
+	endValue: 0
 });
 
 const marketChartData = ref({
-	dates: [
-		"2023\nQ3",
-		"2023\nQ4",
-		"2024\nQ1",
-		"2024\nQ2",
-		"2024\nQ3",
-		"2024\nQ4",
-		"2025\nQ1",
-		"2025\nQ2",
-		"2025\nQ3",
-		"2025\nQ4"
-	],
-	values: [620, 650, 600, 480, 480, 420, 480, 520, 650, 650],
-	sanctionDate: "2024\nQ1",
-	endValue: 645
+	dates: [],
+	values: [],
+	sanctionDate: "",
+	endValue: 0
 });
 
 const rdChartData = ref({
-	dates: [
-		"2023\nQ3",
-		"2023\nQ4",
-		"2024\nQ1",
-		"2024\nQ2",
-		"2024\nQ3",
-		"2024\nQ4",
-		"2025\nQ1",
-		"2025\nQ2",
-		"2025\nQ3",
-		"2025\nQ4"
-	],
-	values: [62, 65, 60, 55, 62, 68, 83, 92, 89, 92],
-	sanctionDate: "2024\nQ1",
-	endValue: 92,
+	dates: [],
+	values: [],
+	sanctionDate: "",
+	endValue: 0
 });
 
 const shareChartData = ref({
-	dates: [
-		"2023\nQ3",
-		"2023\nQ4",
-		"2024\nQ1",
-		"2024\nQ2",
-		"2024\nQ3",
-		"2024\nQ4",
-		"2025\nQ1",
-		"2025\nQ2",
-		"2025\nQ3",
-		"2025\nQ4"
-	],
-	values: [65, 70, 72, 70, 58, 65, 68, 72, 72, 68],
-	sanctionDate: "2024\nQ1",
+	dates: [],
+	values: [],
+	sanctionDate: "",
 	unit: "%",
 });
 
@@ -602,7 +558,7 @@ const getBaseOption = (data) => {
 const initRevenueChart = () => {
 	const dom = chartRef.value;
 	const data = chartData.value;
-	if (!dom || !data.values) return;
+	if (!dom || !data.values || data.values.length === 0) return;
 	
 	let myChart = echarts.getInstanceByDom(dom) || echarts.init(dom);
 	const lastDate = data.dates[data.dates.length - 1];
@@ -670,7 +626,7 @@ const initRevenueChart = () => {
 const initMarketChart = () => {
 	const dom = marketChartRef.value;
 	const data = marketChartData.value;
-	if (!dom || !data.values) return;
+	if (!dom || !data.values || data.values.length === 0) return;
 	
 	let myChart = echarts.getInstanceByDom(dom) || echarts.init(dom);
 	const lastDate = data.dates[data.dates.length - 1];
@@ -731,7 +687,7 @@ const initMarketChart = () => {
 const initRDChart = () => {
 	const dom = rdChartRef.value;
 	const data = rdChartData.value;
-	if (!dom || !data.values) return;
+	if (!dom || !data.values || data.values.length === 0) return;
 	
 	let myChart = echarts.getInstanceByDom(dom) || echarts.init(dom);
 	const lastDate = data.dates[data.dates.length - 1];
@@ -851,13 +807,6 @@ onMounted(async () => {
 	if (selectedCompanyId.value) {
 		getRevenueData();
 	}
-
-	nextTick(() => {
-		initRevenueChart();
-		initMarketChart();
-		initRDChart();
-		initShareChart();
-	});
 });
 </script>
 

src/views/exportControl/v2.0SingleSanction/components/sanctionsOverview/index.vue

@@ -247,6 +247,7 @@ const getSanctionOverviewList = async () => {
       isOnlyCn: onlyChina.value,
       domainId: filterField.value || undefined,
       searchText: searchKeyword.value || undefined,
+      searchType: searchType.value
     })
     if (res.code === 200) {
       const data = res.data || {}
@@ -407,9 +408,10 @@ const onlyChina = ref(false)
 const filterField = ref('')
 const searchKeyword = ref('')
 const activeTab = ref('add')
+const searchType = computed(() => activeTab.value)
 
 // 监听筛选条件变化
-watch([onlyChina, filterField], () => {
+watch([onlyChina, filterField, activeTab], () => {
   getSanctionOverviewList()
 })
 

src/views/ruleRestriction/commonPrompt/index.vue

+<template>
+	<el-tooltip
+		effect="dark"
+		:content="content"
+		popper-class="common-prompt-popper"
+		placement="top"
+		:show-after="500"
+	>
+		<div class="text-ellipsis">
+			<slot>{{ content }}</slot>
+		</div>
+	</el-tooltip>
+</template>
+
+<script setup>
+defineProps({
+	content: {
+		type: String,
+		default: ""
+	}
+});
+</script>
+
+<style scoped>
+.text-ellipsis {
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	width: 100%;
+	cursor: pointer;
+}
+</style>
+
+<style>
+.common-prompt-popper.el-popper {
+	padding: 8px 16px !important;
+	border-radius: 10px !important;
+	background-color: rgb(59, 65, 75) !important;
+	font-size: 16px !important;
+	font-weight: 400 !important;
+	font-family: "Microsoft YaHei" !important;
+	line-height: 30px !important;
+	color: #fff !important;
+	border: none !important;
+}
+
+.common-prompt-popper.el-popper .el-popper__arrow::before {
+	background-color: rgb(59, 65, 75) !important;
+	border-color: rgb(59, 65, 75) !important;
+}
+</style>

src/views/ruleRestriction/components/askPage/index.vue

@@ -2,49 +2,46 @@
 	<div class="ask-page">
 		<div class="left">
 			<div class="left-title">
-                <img src="./assets/icon01.png" alt="">
+				<img src="./assets/icon01.png" alt="" />
 				<div class="tit">新闻资讯</div>
 				<div class="more" @click="handleToMoreNews">更多 +</div>
 			</div>
 			<div class="left-main">
-                <div v-for="item in leftList" :key="item.id" class="main-item">
-                    <img :src="item.image" alt="">
+				<div v-for="item in leftList.slice(0, 5)" :key="item.id" class="main-item" @click="handleToNewsDetail(item)">
+					<img :src="item.image || defaultNews" alt="" @error="e => (e.target.src = defaultNews)" />
 					<div class="item-content">
-                        <div class="title">{{item.title}}</div>
-                        <div class="content">{{item.content}}</div>
-                        <div class="time">{{item.time}}</div>
+						<div class="title">
+							<CommonPrompt :content="item.title">
+								{{ item.title }}
+							</CommonPrompt>
+						</div>
+						<div class="content">
+							<CommonPrompt :content="item.content">
+								{{ item.content }}
+							</CommonPrompt>
+						</div>
+						<div class="time">{{ item.time }}</div>
 					</div>
 				</div>
 			</div>
 		</div>
 		<div class="right">
 			<div class="right-title">
-                <img src="./assets/icon02.png" alt="">
+				<img src="./assets/icon02.png" alt="" />
 				<div class="tit">社交媒体</div>
 			</div>
 			<div class="right-main">
-                <div class="trump">
-                    <img src="./assets/title01.png" alt="">
-                    <div class="trump-main">
-                        <div class="cl1">{{ rightList[0].name }}</div>
-                        <div class="cl2">{{ rightList[0].content }}</div>
-                        <div class="cl3">{{ rightList[0].time }}</div>
-                    </div>
-                </div>
-                <div class="mask">
-                    <img src="./assets/title02.png" alt="">
-                    <div class="mask-main">
-                        <div class="cl1">{{ rightList[1].name }}</div>
-                        <div class="cl2">{{ rightList[1].content }}</div>
-                        <div class="cl3">{{ rightList[1].time }}</div>
-                    </div>
-                </div>
-                <div class="malaby">
-                    <img src="./assets/title03.png" alt="">
-                    <div class="malaby-main">
-                        <div class="cl1">{{ rightList[2].name }}</div>
-                        <div class="cl2">{{ rightList[2].content }}</div>
-                        <div class="cl3">{{ rightList[2].time }}</div>
+				<div
+					v-for="(item, index) in rightList.slice(0, 3)"
+					:key="item.id"
+					class="social-item"
+					@click="handleToSocialDetail(item)"
+				>
+					<img :src="item.image || defaultAvatar" alt="" @error="e => (e.target.src = defaultAvatar)" />
+					<div class="social-item-main" :style="{ backgroundImage: `url(${socialConfig[index].bg})` }">
+						<div class="cl1">{{ item.name }}</div>
+						<div class="cl2">{{ item.content }}</div>
+						<div class="cl3">{{ item.time }}</div>
 					</div>
 				</div>
 			</div>
@@ -53,80 +50,73 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
-import router from "@/router"
-import image01 from './assets/image01.png'
-import image02 from './assets/image02.png'
-import image03 from './assets/image03.png'
-import image04 from './assets/image04.png'
-import image05 from './assets/image05.png'
+import { ref, onMounted } from "vue";
+import router from "@/router";
+import { getRuleRestrictionNews, getRuleRestrictionSocialMedia } from "@/api/ruleRestriction/ruleRestriction";
+import CommonPrompt from "../../commonPrompt/index.vue";
 
-import title01 from './assets/title01.png'
-import title02 from './assets/title02.png'
-import title03 from './assets/title03.png'
+import defaultNews from "../../assets/images/default-icon-news.png";
+import defaultAvatar from "../../assets/images/default-icon1.png";
+import title01 from "./assets/title01.png";
+import title02 from "./assets/title02.png";
+import title03 from "./assets/title03.png";
+import title01bg from "./assets/title01bg.png";
+import title02bg from "./assets/title02bg.png";
+import title03bg from "./assets/title03bg.png";
 
+const leftList = ref([]);
+const rightList = ref([]);
 
-const leftList = ref([
-    {   
-        id:1,
-        title:'美国智库激辩人工智能监管路径',
-        content:'各方就AI监管模式展开讨论。有观点认为碎片化州级监管比全面联邦法规更灵活，也有分析...',
-        time:'11-4 · 华盛顿邮报',
-        image:image01
-    },
-    {   
-        id:2,
-        title:'布鲁金斯学会称美国低估中国在“印太”战略',
-        content:'分析认为，当美国注意力被其他地区分散时，中国通过外交、发展和防务多管齐下，系统性...',
-        time:'11-4 · 纽约时报',
-        image:image02
-    },
-    {   
-        id:3,
-        title:'五角大楼指令引发智库与国防部“脱钩”震荡',
-        content:'美国国防部长下令全面暂停部内人员参与所有智库活动，标志着传统的“旋转门”关系发生...',
-        time:'11-3 · 洛杉矶时报',
-        image:image03
-    },
-    {   
-        id:4,
-        title:'卡内基基金会警告冲突中AI宣传战的风险',
-        content:'分析指出，在伊朗与以色列的冲突中，人工智能生成的虚假信息泛滥，深度破坏了信息生态...',
-        time:'11-3 · 今日美国',
-        image:image04
-    },
-    {   
-        id:5,
-        title:'CSIS建议美国建立跨机构AI基准测试体系',
-        content:'指出美国《人工智能行动计划》忽视了基准测试这一关键环节，建议由国家标准与技术研究...',
-        time:'11-2 ·  ​福克斯新闻网',
-        image:image05
+const socialConfig = [
+	{ icon: title01, bg: title01bg },
+	{ icon: title02, bg: title02bg },
+	{ icon: title03, bg: title03bg }
+];
+
+// 规则限制-查询新闻资讯接口
+const getRuleRestrictionNewsData = async () => {
+	try {
+		const res = await getRuleRestrictionNews({ moduleId: "0108" });
+		if (res && res.code === 200) {
+			leftList.value = (res.data || []).map(item => ({
+				id: item.newsId,
+				title: item.newsTitle,
+				content: item.newsContent,
+				time: `${item.newsDate}${item.newsOrg ? " · " + item.newsOrg : ""}`,
+				image: item.newsImage
+			}));
+		}
+	} catch (error) {
+		console.error("获取规则限制新闻资讯数据失败:", error);
 	}
-])
+};
 
-const rightList = ref([
-    {
-        id:1,
-        name:'唐纳德·特朗普',
-        content:'埃隆·马斯克在强力支持我竞选总统之前，早就知道我强烈反对‘电动汽车强制令’。这太荒谬了，这一直是我竞选活动的主要部分。电动汽车没问题，但不应该强迫每个人都拥有一辆。埃隆获得的补贴可能远远超过历史上任何一个人。如果没有补贴，埃隆可能不得不关门大吉，回到南非老家。',
-        time:'15:23 · 发布于真实社交',
-        title:title01
-    },
-    {
-        id:2,
-        name:'埃隆·马斯克',
-        content:'如果这个疯狂的支出法案获得通过，‘美国党’将在第二天成立。',
-        time:'14:49 · 发布于X',
-        title:title02
-    },
-    {
-        id:3,
-        name:'塞巴斯蒂安·马拉比',
-        content:'提出特朗普政府的AI政策强调技术开放与快速应用，但可能以牺牲安全防范为代价，开启了“潘多拉魔盒”。',
-        time:'11:05 · 发布于X',
-        title:title03
+// 规则限制-查询社交媒体接口
+const getRuleRestrictionSocialData = async () => {
+	try {
+		const res = await getRuleRestrictionSocialMedia({ moduleId: "0108" });
+		if (res && res.code === 200) {
+			rightList.value = (res.data || []).map(item => {
+				const date = new Date(item.time);
+				const y = date.getFullYear();
+				const m = (date.getMonth() + 1).toString().padStart(2, "0");
+				const d = date.getDate().toString().padStart(2, "0");
+				const hh = date.getHours().toString().padStart(2, "0");
+				const mm = date.getMinutes().toString().padStart(2, "0");
+				const formattedTime = `${y}-${m}-${d} ${hh}:${mm} · 发布于${item.orgName}`;
+				return {
+					id: item.personId,
+					name: item.personName,
+					content: item.remarks,
+					time: formattedTime,
+					image: item.personImage
+				};
+			});
+		}
+	} catch (error) {
+		console.error("获取规则限制社交媒体数据失败:", error);
 	}
-])
+};
 
 // 查看更多新闻资讯
 const handleToMoreNews = () => {
@@ -134,6 +124,32 @@ const handleToMoreNews = () => {
 	window.open(route.href, "_blank");
 };
 
+// 查看新闻资讯详情
+const handleToNewsDetail = item => {
+	const route = router.resolve({
+		path: "/newsAnalysis",
+		query: {
+			newsId: item.id
+		}
+	});
+	window.open(route.href, "_blank");
+};
+
+// 查看社交媒体详情
+const handleToSocialDetail = item => {
+	const route = router.resolve({
+		path: "/characterPage",
+		query: {
+			personId: item.id
+		}
+	});
+	window.open(route.href, "_blank");
+};
+
+onMounted(() => {
+	getRuleRestrictionNewsData();
+	getRuleRestrictionSocialData();
+});
 </script>
 
 <style scoped lang="scss">
@@ -173,7 +189,7 @@ const handleToMoreNews = () => {
 				padding: 11px 0;
 				font-size: 20px;
 				font-weight: 700;
-                font-family: 'Microsoft YaHei';
+				font-family: "Microsoft YaHei";
 				line-height: 26px;
 				color: rgb(5, 95, 194);
 			}
@@ -182,7 +198,7 @@ const handleToMoreNews = () => {
 				height: 24px;
 				font-size: 16px;
 				font-weight: 400;
-                font-family: 'Microsoft YaHei';
+				font-family: "Microsoft YaHei";
 				line-height: 24px;
 				color: rgb(5, 95, 194);
 				position: absolute;
@@ -201,6 +217,9 @@ const handleToMoreNews = () => {
 				display: flex;
 				border-bottom: 1px solid rgba(240, 242, 244, 1);
 				margin-bottom: 14px;
+				&:hover {
+					background-color: #f9f9f9;
+				}
 				img {
 					width: 72px;
 					height: 48px;
@@ -212,20 +231,28 @@ const handleToMoreNews = () => {
 					height: 50px;
 					position: relative;
 					.title {
+						width: 480px;
 						font-size: 16px;
 						font-weight: 700;
-                        font-family: 'Microsoft YaHei';
+						font-family: "Microsoft YaHei";
 						line-height: 24px;
 						color: rgb(59, 65, 75);
 						cursor: pointer;
+						overflow: hidden;
+						white-space: nowrap;
+						text-overflow: ellipsis;
 					}
 					.content {
+						width: 100%;
 						font-size: 16px;
 						font-weight: 400;
-                        font-family: 'Microsoft YaHei';
+						font-family: "Microsoft YaHei";
 						line-height: 24px;
 						color: rgb(59, 65, 75);
 						cursor: pointer;
+						overflow: hidden;
+						white-space: nowrap;
+						text-overflow: ellipsis;
 					}
 					.time {
 						position: absolute;
@@ -233,7 +260,7 @@ const handleToMoreNews = () => {
 						right: 0px;
 						font-size: 14px;
 						font-weight: 400;
-                        font-family: 'Microsoft YaHei';
+						font-family: "Microsoft YaHei";
 						line-height: 22px;
 						color: rgb(95, 101, 108);
 						cursor: pointer;
@@ -268,7 +295,7 @@ const handleToMoreNews = () => {
 				padding: 11px 0;
 				font-size: 20px;
 				font-weight: 700;
-                font-family: 'Microsoft YaHei';
+				font-family: "Microsoft YaHei";
 				line-height: 26px;
 				color: rgb(5, 95, 194);
 			}
@@ -277,7 +304,7 @@ const handleToMoreNews = () => {
 				height: 24px;
 				font-size: 16px;
 				font-weight: 400;
-                font-family: 'Microsoft YaHei';
+				font-family: "Microsoft YaHei";
 				line-height: 24px;
 				color: rgb(5, 95, 194);
 				position: absolute;
@@ -290,115 +317,28 @@ const handleToMoreNews = () => {
 			width: 792px;
 			height: 402px;
 			padding: 23px 30px 25px 21px;
-            .trump {
+			overflow: auto;
+			.social-item {
 				width: 740px;
-                height: 148px;
-                margin-bottom: 16px;
-                display: flex;
-                img {
-                    width: 36px;
-                    height: 36px;
-                    margin-right: 8.5px;
-                }
-                .trump-main {
-                    width: 695.6px;
-                    height: 148px;
-                    background-image: url('./assets/title01bg.png');
-                    padding: 11px 14px 12px 22.5px;
-                    background-size: cover;
-                    position: relative;
-                    .cl1 {
-                        font-size: 16px;
-                        font-weight: 700;
-                        font-family: 'Microsoft YaHei';
-                        line-height: 24px;
-                        color: rgb(59, 65, 75);
-                        margin-bottom: 5px;
-                    }
-                    .cl2 {
-                        font-size: 16px;
-                        font-weight: 400;
-                        font-family: 'Microsoft YaHei';
-                        line-height: 24px;
-                        color: rgb(59, 65, 75);
-                    }
-                    .cl3 {
-                        position: absolute;
-                        top: 11px;
-                        right: 14px;
-                        font-size: 16px;
-                        font-weight: 400;
-                        font-family: 'Microsoft YaHei';
-                        line-height: 30px;
-                        color: rgb(95, 101, 108);
-                    }
-                }
-            }
-            .mask {
-                width: 740px;
-                height: 76px;
-                margin-bottom: 16px;
-                display: flex;
-                img {
-                    width: 36px;
-                    height: 36px;
-                    margin-right: 8.5px;
-                }
-                .mask-main {
-                    width: 695.6px;
-                    height: 76px;
-                    background-image: url('./assets/title02bg.png');
-                    padding: 11px 14px 12px 22.5px;
-                    background-size: cover;
-                    position: relative;
-                    .cl1 {
-                        font-size: 16px;
-                        font-weight: 700;
-                        font-family: 'Microsoft YaHei';
-                        line-height: 24px;
-                        color: rgb(59, 65, 75);
-                        margin-bottom: 5px;
-                    }
-                    .cl2 {
-                        font-size: 16px;
-                        font-weight: 400;
-                        font-family: 'Microsoft YaHei';
-                        line-height: 24px;
-                        color: rgb(59, 65, 75);
-                    }
-                    .cl3 {
-                        position: absolute;
-                        top: 11px;
-                        right: 14px;
-                        font-size: 16px;
-                        font-weight: 400;
-                        font-family: 'Microsoft YaHei';
-                        line-height: 30px;
-                        color: rgb(95, 101, 108);
-                    }
-                }
-            }
-            .malaby {
-                width: 740px;
-                height: 98px;
 				margin-bottom: 16px;
 				display: flex;
+				cursor: pointer;
 				img {
 					width: 36px;
 					height: 36px;
 					margin-right: 8.5px;
+					border-radius: 50%;
 				}
-                .malaby-main {
+				.social-item-main {
 					width: 695.6px;
-                    height: 98px;
-                    background-image: url('./assets/title03bg.png');
 					padding: 11px 14px 12px 22.5px;
-                    background-size: cover;
+					background-size: 100% 100%;
+					background-repeat: no-repeat;
 					position: relative;
 					.cl1 {
 						font-size: 16px;
 						font-weight: 700;
-                        font-family: 'Microsoft YaHei';
+						font-family: "Microsoft YaHei";
 						line-height: 24px;
 						color: rgb(59, 65, 75);
 						margin-bottom: 5px;
@@ -406,7 +346,7 @@ const handleToMoreNews = () => {
 					.cl2 {
 						font-size: 16px;
 						font-weight: 400;
-                        font-family: 'Microsoft YaHei';
+						font-family: "Microsoft YaHei";
 						line-height: 24px;
 						color: rgb(59, 65, 75);
 					}
@@ -416,7 +356,7 @@ const handleToMoreNews = () => {
 						right: 14px;
 						font-size: 16px;
 						font-weight: 400;
-                        font-family: 'Microsoft YaHei';
+						font-family: "Microsoft YaHei";
 						line-height: 30px;
 						color: rgb(95, 101, 108);
 					}

src/views/ruleRestriction/components/dataNew/index.vue

 <template>
 	<div class="data-new">
 		<div class="left">
-			<img src="./assets/leftbtn.png" alt="" class="left-btn" />
-			<img src="./assets/rightbtn.png" alt="" class="right-btn" />
+			<img src="./assets/leftbtn.png" alt="" class="left-btn" @click="handlePrev" />
+			<img src="./assets/rightbtn.png" alt="" class="right-btn" @click="handleNext" />
 			<div class="left-top">
 				<img src="./assets/icon01.png" alt="" />
 				<div class="left-top-title">规则限制动态</div>
 				<div class="more" @click="handleClickToDetail">查看详情 ></div>
 			</div>
+
+			<el-carousel
+				ref="carouselRef"
+				height="412px"
+				direction="horizontal"
+				:autoplay="true"
+				:interval="5000"
+				arrow="never"
+				indicator-position="none"
+				@change="handleCarouselChange"
+			>
+				<el-carousel-item v-for="(item, index) in riskSignalList" :key="item.RULEID || index">
+					<div class="carousel-item-content">
 						<div class="left-center">
-				<img src="./assets/usImg.png" alt="" />
+							<img :src="item.PUBLISHORGIMGURL || defaultImg" alt="" />
 							<div class="left-center-main">
 								<div class="left-center-main-title">
-						美国联邦通信委员会（FCC）启动撤销重庆信息通信研究院作为认可测试实验室资格的程序
+									{{ item.RULENAMEZH || "暂无动态" }}
 								</div>
 								<div class="left-center-main-ul">
 									<ul>
 										<li>
 											<span class="ul-title">发布机构：</span>
-								<span class="ul-content">美国联邦通信委员会（FCC）工程技术与媒体关系部</span>
+											<span class="ul-content">{{ item.PUBLISHORGNAME || "未知" }}</span>
 										</li>
 										<li>
 											<span class="ul-title">发布日期：</span>
-								<span class="ul-content">2025年10月24日</span>
+											<span class="ul-content">{{ item.PUBLISHDATE || "未知" }}</span>
 										</li>
 										<li>
 											<span class="ul-title">涉及领域：</span>
-								<span class="ul-pie cl1">能源</span>
-								<span class="ul-pie cl2">集成电路</span>
-								<span class="ul-pie cl3">新材料</span>
-								<span class="ul-pie cl4">生物科技</span>
+											<div class="ul-tags" v-if="item.ruleAreas && item.ruleAreas.length > 0">
+												<span
+													v-for="(field, fIndex) in item.ruleAreas"
+													:key="fIndex"
+													class="ul-pie"
+													:class="'cl' + ((fIndex % 4) + 1)"
+												>
+													{{ field }}
+												</span>
+											</div>
+											<span v-else class="ul-content">未知</span>
 										</li>
 										<li>
 											<span class="ul-title">限制实体：</span>
-								<span class="ul-content">重庆信息通信研究院</span>
+											<span class="ul-content">
+												{{
+													item.ruleEntities && item.ruleEntities.length > 0
+														? item.ruleEntities.map(e => e.ORGNAME).join("、")
+														: "未知"
+												}}
+											</span>
 										</li>
 									</ul>
 								</div>
 							</div>
-				<!-- <div class="left-center-title">国会法案</div> -->
 						</div>
 						<div class="left-bottom">
 							<ul>
 								<li class="left-bottom-li">内容摘要：</li>
 							</ul>
 							<div class="left-bottom-content">
-					工程和技术办公室着手撤销对德国莱茵 TÜV 集团/中国检验认证集团（宁波）有限公司作为认可测试实验室的资格。
+								{{ item.RULEINTRODUCTION || "暂无内容摘要" }}
 							</div>
 						</div>
 					</div>
+				</el-carousel-item>
+
+				<!-- 无数据时的占位展示 -->
+				<el-carousel-item v-if="riskSignalList.length === 0">
+					<div class="carousel-item-content">
+						<div class="left-center">
+							<img :src="defaultImg" alt="" />
+							<div class="left-center-main">
+								<div class="left-center-main-title">暂无规则限制动态</div>
+								<div class="left-center-main-ul">
+									<ul>
+										<li><span class="ul-title">发布机构：</span><span class="ul-content">未知</span></li>
+										<li><span class="ul-title">发布日期：</span><span class="ul-content">未知</span></li>
+										<li><span class="ul-title">涉及领域：</span><span class="ul-content">未知</span></li>
+										<li><span class="ul-title">限制实体：</span><span class="ul-content">未知</span></li>
+									</ul>
+								</div>
+							</div>
+						</div>
+					</div>
+				</el-carousel-item>
+			</el-carousel>
+		</div>
 		<div class="right">
 			<div class="right-top">
 				<img src="./assets/icon02.png" alt="" />
 				<div class="right-top-title">
 					风险信号
-					<span>4</span>
+					<span>{{ riskSignals.length }}</span>
 				</div>
 			</div>
 			<div style="margin: 6px 34px 0 23px">
-				<div v-for="item in list" :key="item.id" class="right-main" @click="handleClickToDetail">
-					<div class="main-left" :class="{ cl4: item.title === '特别重大', cl5: item.title === '重大风险' }">
+				<div v-for="item in riskSignals" :key="item.id" class="right-main" @click="handleToRiskDetail(item)">
+					<div
+						class="main-left"
+						:class="{ cl4: item.title === '特别重大', cl5: item.title === '重大风险', cl6: item.title === '一般风险' }"
+					>
 						{{ item.title }}
 					</div>
-					<div class="main-center">{{ item.content }}</div>
+					<div class="item-right">
+						<div class="main-center">
+							<CommonPrompt :content="item.content">
+								{{ item.content }}
+							</CommonPrompt>
+						</div>
 						<div class="main-right">{{ item.time }}</div>
 					</div>
 				</div>
+			</div>
 			<div class="right-mainbtn" @click="handleToMoreRiskSignal">
 				<img src="./assets/btn.png" alt="" />
 				查看更多
@@ -75,44 +132,101 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { ref, onMounted, computed } from "vue";
 import router from "@/router";
+import { getRuleRestrictionLatest, getRuleRestrictionRiskSignal } from "@/api/ruleRestriction/ruleRestriction";
+import defaultImg from "./assets/usImg.png";
+import CommonPrompt from "../../commonPrompt/index.vue";
 
-const list = ref([
-	{
-		id: 1,
-		title: "特别重大",
-		content: "保护美国资金与专业知识免受敌对研究利用法案",
-		time: "一天前"
-	},
-	{
-		id: 2,
-		title: "特别重大",
-		content: "美国国土安全部终止哈佛大学SEVP认证",
-		time: "一天前"
-	},
-	{
-		id: 3,
-		title: "重大风险",
-		content: "众议院“美中战略竞争特别委员会”向国会提...",
-		time: "一天前"
-	},
-	{
-		id: 4,
-		title: "重大风险",
-		content: '2026财年拨款法案要求重启"中国行动计划"',
-		time: "一天前"
-	}
-]);
+// 规则限制-查询风险信号数据
+const riskSignals = ref([]);
+const getRuleRestrictionRiskSignalData = async () => {
+	try {
+		const res = await getRuleRestrictionRiskSignal({ moduleId: "0108" });
+		if (res && res.code === 200) {
+			riskSignals.value = (res.data || []).map(item => ({
+				id: item.signalId,
+				title: item.signalLevel,
+				content: item.signalTitle,
+				time: item.signalTime,
+				ruleLimitId: item.ruleLimitId
+			}));
+		}
+	} catch (error) {
+		console.error("获取规则限制风险信号数据失败:", error);
+	}
+};
 
-// 跳转详情
-const handleClickToDetail = () => {
-	// router.push("/decreeLayout");
-	const route = router.resolve("/ruleRestrictions/detail");
-	window.open(route.href, "_blank");
+
+
+// 规则限制-获取规则限制动态
+const riskSignalList = ref([]);
+const carouselRef = ref(null);
+const activeIndex = ref(0);
+
+const getRuleRestrictionLatestData = async () => {
+	try {
+		const res = await getRuleRestrictionLatest();
+		if (res && res.code === 200) {
+			riskSignalList.value = res.data || [];
+		}
+	} catch (error) {
+		console.error("获取规则限制动态数据失败:", error);
+	}
+};
+
+// 轮播图手动切换
+const handlePrev = () => {
+	if (carouselRef.value) {
+		carouselRef.value.prev();
+	}
+};
+const handleNext = () => {
+	if (carouselRef.value) {
+		carouselRef.value.next();
+	}
+};
+
+// 轮播切换回调
+const handleCarouselChange = index => {
+	activeIndex.value = index;
 };
 
-// 查看更多风险信号
+// 左侧展示的主动态
+const mainTrend = computed(() => {
+	if (riskSignalList.value.length === 0) return null;
+	return riskSignalList.value[activeIndex.value] || riskSignalList.value[0];
+});
+
+onMounted(() => {
+	getRuleRestrictionLatestData();
+	getRuleRestrictionRiskSignalData();
+});
+
+// 点击风险信号详情
+const handleToRiskDetail = (item) => {
+	const curRoute = router.resolve({
+		path: "/ruleRestrictions/detail",
+		query: { id: item.ruleLimitId },
+	});
+	window.open(curRoute.href, "_blank");
+};
+
+// 点击查看详情
+const handleClickToDetail = item => {
+	const activeItem = item && item.RULEID ? item : mainTrend.value;
+	const id = activeItem?.RULEID;
+	if (!id) return;
+	window.sessionStorage.setItem("curTabName", activeItem?.RULENAMEZH);
+
+	const curRoute = router.resolve({
+		path: "/ruleRestrictions/detail",
+		query: { id: id }
+	});
+	window.open(curRoute.href, "_blank");
+};
+
+// 查看更多动态
 const handleToMoreRiskSignal = () => {
 	const route = router.resolve("/riskSignal");
 	window.open(route.href, "_blank");
@@ -145,6 +259,8 @@ const handleToMoreRiskSignal = () => {
 			top: 223px;
 			left: 0px;
 			cursor: pointer;
+			z-index: 100;
+			pointer-events: auto;
 		}
 		.right-btn {
 			width: 24px;
@@ -153,6 +269,8 @@ const handleToMoreRiskSignal = () => {
 			top: 223px;
 			right: 0px;
 			cursor: pointer;
+			z-index: 100;
+			pointer-events: auto;
 		}
 		.left-top {
 			width: 100%;
@@ -177,6 +295,7 @@ const handleToMoreRiskSignal = () => {
 				right: 40px;
 				color: rgb(5, 95, 194);
 				cursor: pointer;
+				z-index: 101;
 			}
 			.left-top-title {
 				margin-left: 60px;
@@ -192,6 +311,10 @@ const handleToMoreRiskSignal = () => {
 				padding: 11px 16px;
 			}
 		}
+		.carousel-item-content {
+			width: 100%;
+			height: 100%;
+		}
 		.left-center {
 			width: 967px;
 			height: 208px;
@@ -220,15 +343,24 @@ const handleToMoreRiskSignal = () => {
 					// width: 439px;
 					height: 132px;
 					ul {
-						list-style-position: inside;
+						list-style: none;
 						li {
 							width: 100%;
-							height: 24px;
+							min-height: 24px;
 							margin-bottom: 12px;
+							display: flex;
+							align-items: flex-start;
+							&::before {
+								content: "·";
+								font-size: 24px;
+								line-height: 20px;
+								font-weight: bold;
+								margin-right: 16px;
+								color: rgb(59, 65, 75);
+							}
 							.ul-title {
-								display: inline-block;
+								flex-shrink: 0;
 								width: 120px;
-								height: 24px;
 								font-size: 16px;
 								font-weight: 700;
 								font-family: "Microsoft YaHei";
@@ -236,19 +368,28 @@ const handleToMoreRiskSignal = () => {
 								color: rgb(59, 65, 75);
 							}
 							.ul-content {
+								flex: 1;
 								color: rgb(59, 65, 75);
 								font-family: "Microsoft YaHei";
 								font-size: 16px;
 								font-weight: 400;
 								line-height: 24px;
 							}
+							.ul-tags {
+								flex: 1;
+								display: flex;
+								flex-wrap: wrap;
+								gap: 8px;
+							}
 							.ul-pie {
 								display: inline-block;
 								box-sizing: border-box;
 								padding: 2px 8px;
 								border: 1px solid;
 								border-radius: 4px;
-								margin-right: 8px;
+								font-size: 14px;
+								line-height: 18px;
+								white-space: nowrap;
 							}
 							.cl1 {
 								border-color: rgba(186, 224, 255, 1);
@@ -292,7 +433,7 @@ const handleToMoreRiskSignal = () => {
 		.left-bottom {
 			margin: 17px 0 0 62px;
 			ul {
-				list-style-position: inside;
+				list-style: none;
 				.left-bottom-li {
 					font-size: 16px;
 					font-weight: 700;
@@ -300,6 +441,16 @@ const handleToMoreRiskSignal = () => {
 					line-height: 24px;
 					color: rgb(59, 65, 75);
 					margin-bottom: 10px;
+					display: flex;
+					align-items: center;
+					&::before {
+						content: "·";
+						font-size: 24px;
+						line-height: 20px;
+						font-weight: bold;
+						margin-right: 12px;
+						color: rgb(59, 65, 75);
+					}
 				}
 			}
 			.left-bottom-content {
@@ -391,18 +542,31 @@ const handleToMoreRiskSignal = () => {
 				background-color: rgba(255, 247, 230, 1);
 				color: rgba(250, 140, 22, 1);
 			}
+			.cl6 {
+				background-color: rgba(246, 255, 237, 1);
+				color: rgba(82, 196, 26, 1);
+			}
+			.item-right {
+				flex: 1;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				overflow: hidden;
 				.main-center {
-				width: 347px;
+					flex: 1;
 					height: 30px;
 					font-size: 16px;
 					font-weight: 400;
 					font-family: "Microsoft YaHei";
 					line-height: 30px;
 					color: rgb(59, 65, 75);
-				margin-right: 2px;
+					margin-right: 10px;
+					overflow: hidden;
+					white-space: nowrap;
+					text-overflow: ellipsis;
 				}
 				.main-right {
-				width: 60px;
+					width: 100px;
 					height: 24px;
 					font-size: 16px;
 					font-weight: 400;
@@ -410,6 +574,8 @@ const handleToMoreRiskSignal = () => {
 					line-height: 24px;
 					color: rgb(132, 136, 142);
 					text-align: right;
+					flex-shrink: 0;
+				}
 			}
 		}
 		.right-mainbtn {