Merge branch 'master' of http://8.140.26.4:10003/caijian/risk-monitor into xxh-dev

src/api/companyPages/index.js

@@ -91,4 +91,35 @@ export function getSanctionList(params) {
   })
 }
 
+//被制裁情况:数据对比
+export function getStudyList(params) {
+  return request({
+    method: 'GET',
+    url: `/api/enterprisePage/getStudyList/${params}`,
+  })
+}
+
+//供应链:领域
+export function getSupplyAreaList(params) {
+  return request({
+    method: 'GET',
+    url: `/api/enterprisePage/getSupplyAreaList/${params}`,
+  })
+}
 
+//供应链:国家地区
+export function getSupplyCountryList(params) {
+  return request({
+    method: 'GET',
+    url: `/api/enterprisePage/getSupplyCountryList/${params}`,
+  })
+}
+
+//供应链:关系
+export function getSupplyList(params) {
+  return request({
+    method: 'GET',
+    url: `/api/enterprisePage/getSupplyList/${params.id}`,
+    params,
+  })
+}

src/api/coopRestriction/coopRestriction.js

+import request from "@/api/request.js";
+
+// 合作限制-首页统计接口
+export function getCoopRestrictionStatistics() {
+    return request({
+        method: 'GET',
+        url: `/api/cooperationlimitinfo/getCount`
+    })
+}
+
+// 合作限制-查询最新动态信息接口
+export function getCoopRestrictionTrends() {
+    return request({
+        method: 'GET',
+        url: `/api/cooperationlimitinfo/getLatestTrends`
+    })
+}
+
+// 合作限制-查询风险信号接口
+/**
+ * @param {moduleId} 
+ * @header token
+ */
+export function getCoopRestrictionSignals(params) {
+    return request({
+        method: 'GET',
+        url: `/api/commonFeature/riskSignal/${params.moduleId}`
+    })
+}
+
+// 合作限制-查询新闻资讯接口
+/**
+ * @param {moduleId} 
+ * @header token
+ */
+export function getCoopRestrictionNews(params) {
+    return request({
+        method: 'GET',
+        url: `/api/commonFeature/news/${params.moduleId}`
+    })
+}
+
+// 合作限制-查询社交媒体接口
+/**
+ * @param {moduleId} 
+ * @header token
+ */
+export function getCoopRestrictionSocial(params) {
+    return request({
+        method: 'GET',
+        url: `/api/commonFeature/social/${params.moduleId}`
+    })
+}
+
+// 合作限制-各类型合作限制政策对比接口
+/**
+ * @param {years} 
+ * @header token
+ */
+export function getCoopRestrictionCompare(params) {
+    return request({
+        method: 'GET',
+        url: `/api/cooperationlimitinfo/getLimitCompare`,
+        params
+    })
+}
+
+// 合作限制-各领域规则分布情况接口
+/**
+ * @param {year} 
+ * @header token
+ */
+export function getCoopRestrictionDomain(params) {
+    return request({
+        method: 'GET',
+        url: `/api/cooperationlimitinfo/getLimitArea`,
+        params
+    })
+}
\ No newline at end of file

src/api/innovationSubject/overview.js

+// 智库概览信息
+import request from "@/api/request.js";
+
+//创新主体主页:统计不同创新主体类型对应的主体数量
+export function getCountSubjectType() {
+  return request({
+    method: 'GET',
+    url: `/api/innovateSubject/countSubjectType`,
+  })
+}
+// 创新主体主页:统计不同地理对应的主体数量
+export function getCountGeography() {
+  return request({
+    method: 'GET',
+    url: `/api/innovateSubject/countGeography`,
+  })
+}
+
+//创新主体主页:类型列表
+export function getSubjectTypeList() {
+  return request({
+    method: 'GET',
+    url: `/api/innovateSubject/subjectTypeList`,
+  })
+}
+
+//创新主体主页:通过类型分页查询创新主体列表
+export function findListBySubjectTypeId(params) {
+  return request({
+    method: 'GET',
+    url: `/api/innovateSubject/findListBySubjectTypeId`,
+    params
+  })
+}
+
+//创新主体主页:综合排名
+export function getOverallRanking(params) {
+  return request({
+    method: 'GET',
+    url: `/api/innovateSubject/overallRanking`,
+    params
+  })
+}
\ No newline at end of file

src/components/Container/index.vue

@@ -90,7 +90,7 @@ const headerTitleClasses = computed(() => [
 	width: 100%;
 	margin-bottom: 15px;
 	position: relative;
-	// margin-bottom: 100px;
+	margin-bottom: 100px;
 }
 
 .container-header {

src/views/bill/billHome/index.vue

@@ -1513,20 +1513,24 @@ watch(box8selectetedTime, () => {
 });
 
 const handleToPosi = id => {
-	// 0 618 1240 2350
+	let top = 0;
 	switch (id) {
 		case "position2":
-			containerRef.value.scrollTop = isShow.value ? 634 : 980;
+			top = isShow.value ? 634 : 980;
 			break;
 		case "position3":
-			containerRef.value.scrollTop = isShow.value ? 1204 : 1550;
+			top = isShow.value ? 1204 : 1550;
 			break;
 		case "position4":
-			containerRef.value.scrollTop = isShow.value ? 2334 : 2680;
+			top = isShow.value ? 2334 : 2680;
 			break;
 		default:
-			containerRef.value.scrollTop = 0;
+			top = 0;
 	}
+	containerRef.value.scrollTo({
+		top: top,
+		behavior: "smooth"
+	});
 };
 
 const tabList = ref([

src/views/bill/introdoction/STimeline.vue

@@ -56,7 +56,7 @@
         </defs> -->
 				<!-- 节点 -->
 				<circle
-					v-for="(node, idx) in nodes.slice(0, nodes.length)"
+					v-for="(node, idx) in nodes"
 					:key="'circle' + idx"
 					:cx="node.x"
 					:cy="node.y"
@@ -66,7 +66,7 @@
 					stroke-width="3"
 				/>
 				<line
-					v-for="(node, idx) in nodes.slice(0, nodes.length)"
+					v-for="(node, idx) in nodes"
 					:key="'line' + idx"
 					:x1="node.x"
 					:y1="node.y + 4"
@@ -170,9 +170,11 @@ export default {
 			return `${date.getFullYear()}年${date.getMonth() + 1}月`;
 		},
 		sortedDataList() {
-			if (!this.dataList) return [];
+			if (!this.dataList || !Array.isArray(this.dataList)) return [];
 			// Clone and sort by date ascending (Old -> New)
-			return [...this.dataList].sort((a, b) => new Date(a.actionDate) - new Date(b.actionDate));
+			return [...this.dataList]
+				.filter(item => item && item.actionDate)
+				.sort((a, b) => new Date(a.actionDate) - new Date(b.actionDate));
 		},
 		nodes() {
 			// 计算每个节点的坐标（蛇形）
@@ -180,7 +182,6 @@ export default {
 				const row = Math.floor(idx / this.maxPerRow);
 				const col = idx % this.maxPerRow;
 				let x, y;
-				// const leftMargin = 150; // 你可以自定义这个值
 
 				if (row % 2 === 0) {
 					x = this.leftMargin + col * this.nodeGapX + 50;
@@ -191,12 +192,17 @@ export default {
 				y = 60 + row * this.nodeGapY;
 
 				// Format Date: 2025-07-04 -> 7月4日
-				const dateObj = new Date(item.actionDate);
-				const formattedDate = `${dateObj.getMonth() + 1}月${dateObj.getDate()}日`;
+				let formattedDate = "";
+				if (item.actionDate) {
+					const dateObj = new Date(item.actionDate);
+					if (!isNaN(dateObj.getTime())) {
+						formattedDate = `${dateObj.getMonth() + 1}月${dateObj.getDate()}日`;
+					}
+				}
 
 				// Format Votes
-				let voteString = '';
-				if (item.agreeVote !== null && item.disagreeVote !== null) {
+				let voteString = "";
+				if (item.agreeVote !== null && item.agreeVote !== undefined && item.disagreeVote !== null && item.disagreeVote !== undefined) {
 					voteString = `${item.agreeVote}票赞成 : ${item.disagreeVote}票反对`;
 				}
 
@@ -238,7 +244,6 @@ export default {
 			for (let i = 1; i < this.nodes.length; i++) {
 				const prev = this.nodes[i - 1];
 				const curr = this.nodes[i];
-				console.log("prev", prev);
 
 				// 判断是否是行尾转折点
 				const isTurnPoint = i % this.maxPerRow === 0;
@@ -272,7 +277,8 @@ export default {
 		},
 		svgHeight() {
 			// SVG高度
-			return Math.ceil(this.dataList.length / this.maxPerRow) * this.nodeGapY + 40;
+			const listLength = (this.dataList && Array.isArray(this.dataList)) ? this.dataList.length : 0;
+			return Math.ceil(listLength / this.maxPerRow) * this.nodeGapY + 40;
 		}
 	}
 };

src/views/bill/introdoction/index.vue

@@ -154,15 +154,15 @@
 			</div>
 			<div class="introduction-wrap-right-main">
 				<div class="right-main-box1">
-					<!-- <div class="name-box">
-						<el-select
+					<div class="name-box">
+						<!-- <el-select
 							v-model="selectValue"
 							placeholder="请选择"
 							style="width: 180px; margin: 0 10px"
 							@change="handleChangeFaId"
 						>
 							<el-option v-for="item in faList" :key="item.value" :label="item.label" :value="item.id" />
-						</el-select>
+						</el-select> -->
 						<div class="person-box">
 							<div
 								class="person-item"
@@ -174,7 +174,7 @@
 								{{ item.name }}
 							</div>
 						</div>
-					</div> -->
+					</div>
 					<div class="info-box">
 						<div class="info-left">
 							<img :src="defaultAvatar" alt="" @click="handleClickAvatar(curPerson.id)"/>
@@ -206,20 +206,20 @@
 						</div>
 					</div>
 				</div>
-				<div class="right-main-box2">
+				<div class="right-main-box2" v-if="curPerson.tagList && curPerson.tagList.length">
 					<!-- <WordCloudMap :data="wordCloudData" :shape="circle" /> -->
 					<div
 						class="tag-box"
 						:class="{
-							status0: index === 0 || index === 4,
-							status1: index === 1 || index === 5,
-							status2: index === 2 || index === 6,
-							status3: index === 3 || index === 7
+							status0: index % 4 === 0,
+							status1: index % 4 === 1,
+							status2: index % 4 === 2,
+							status3: index % 4 === 3
 						}"
 						v-for="(tag, index) in curPerson.tagList"
 						:key="index"
 					>
-						{{ tag }}
+						{{ tag.industryName }}
 					</div>
 				</div>
 				<div class="right-main-box3">
@@ -296,19 +296,19 @@
 						</div>
 					</div>
 
-					<div class="tag-wrapper">
+					<div class="tag-wrapper" v-if="curPerson.tagList && curPerson.tagList.length">
 						<div
 							class="tag-box"
 							:class="{
-								status0: tag.status === 0,
-								status1: tag.status === 1,
-								status2: tag.status === 2,
-								status3: tag.status === 3
+								status0: index % 4 === 0,
+								status1: index % 4 === 1,
+								status2: index % 4 === 2,
+								status3: index % 4 === 3
 							}"
 							v-for="(tag, index) in curPerson.tagList"
 							:key="index"
 						>
-							{{ tag.title }}
+							{{ tag.industryName }}
 						</div>
 					</div>
 					<div class="more">更多议员 ></div>
@@ -371,159 +371,17 @@ const handleClickAvatar = id => {
 };
 // 获取URL地址里面的billId
 const billId = ref(route.query.billId);
-// console.log(billId.value)
-
-// const box2BtnActive = ref(1);
-// const handleClcikBox2Btn = index => {
-// 	box2BtnActive.value = index;
-// };
-
-// const box3BtnActive = ref("");
-// const handleClcikBox3Btn = (name, index) => {
-// 	box3BtnActive.value = name;
-// 	curPerson.value = personList.value[index];
-// 	personEventList.value = personList.value[index].eventList;
-// };
-
 const dialogBoxBtnActive = ref(0);
 const handleClcikDialogBoxBtn = index => {
 	dialogBoxBtnActive.value = index;
 };
 
-const tagList = ref([
-	{
-		title: "共和党",
-		status: 1
-	},
-	{
-		title: "委员会主席",
-		status: 0
-	},
-	{
-		title: "财政保守",
-		status: 2
-	},
-	{
-		title: "深红州",
-		status: 3
-	},
-	{
-		title: "社会政策激进",
-		status: 2
-	},
-	{
-		title: "预算委员会",
-		status: 3
-	},
-	{
-		title: "委员会主席",
-		status: 0
-	},
-	{
-		title: "深红州",
-		status: 3
-	},
-	{
-		title: "议程主导权",
-		status: 1
-	},
-	{
-		title: "财政保守",
-		status: 2
-	},
-	{
-		title: "传统能源",
-		status: 1
-	}
-]);
-
-const selectValue = ref("");
-
-const faList = ref([
-	// {
-	//   value: "众议院初始框架",
-	//   label: "众议院初始框架",
-	// },
-	// {
-	//   value: "众议院初始框架1",
-	//   label: "众议院初始框架1",
-	// },
-]);
 
 const handleChangeFaId = val => {
 	console.log("val", val);
 	handleGetBillPerson(val);
 };
 
-const progressList = ref([
-	{
-		sjsj: "7月5日",
-		sjnr: "特朗普于美国独立日签署法案，​公法编号Pub. L. No. 119-21。白宫举行庆典，B-2轰炸机飞越上空，象征“美国新时代”开启。",
-		fxdj: "特别重大风险"
-	},
-	{
-		sjsj: "7月4日",
-		sjnr: "众议院最终表决218票赞成 vs 214票反对，修订版法案以4票优势通过，2名共和党议员倒戈，民主党全员反对。",
-		fxdj: "重大风险"
-	},
-	{
-		sjsj: "7月3日",
-		sjnr: "民主党领袖杰弗里斯发表 ​8小时45分钟​ 演讲（众议院现代史最长），抗议法案“劫贫济富”，但仍未阻止表决。",
-		fxdj: "较大风险"
-	},
-	{
-		sjsj: "7月2日",
-		sjnr: "众议院以 ​219:213​ 通过程序规则，为最终表决铺路。此前4名共和党议员反对程序规则，议长约翰逊紧急游说挽回1票。",
-		fxdj: "低风险"
-	},
-	{
-		sjsj: "7月1日",
-		sjnr: "参议院最终表决投票51:50​，副总统万斯（JD Vance）投出关键票打破平局。3名共和党参议员倒戈（蒂利斯、保罗、柯林斯）。",
-		fxdj: ""
-	}
-]);
-
-const wordCloudData = [
-	{ name: "财政保守主义", value: 100 },
-	{ name: "移民与边境安全", value: 5 },
-	{ name: "削减市民福利", value: 77 },
-	{ name: "债务驱动型经济", value: 35 },
-	{ name: "传统能源", value: 96 },
-	{ name: "与马斯克公开冲突", value: 57 },
-	{ name: "共和党财政鹰派", value: 72 },
-	{ name: "财政问责法案", value: 18 },
-	{ name: "强硬边境政策", value: 34 },
-	{ name: "扩大军费", value: 16 },
-	{ name: "债务与赤字警告", value: 72 },
-	{ name: "批评美国债务膨胀", value: 58 }
-];
-
-const stepList = ref([
-	{
-		title: "提出",
-		active: false
-	},
-	{
-		title: "众议院通过",
-		active: false
-	},
-	{
-		title: "参议院通过",
-		active: false
-	},
-	{
-		title: "分歧协调",
-		active: false
-	},
-	{
-		title: "提交总统",
-		active: false
-	},
-	{
-		title: "法案通过",
-		active: true
-	}
-]);
 
 const timelineData = ref([]);
 
@@ -544,37 +402,12 @@ const handleGetBasicInfo = async () => {
 	try {
 		const res = await getBillInfo(params);
 		console.log("基本信息", res);
-		basicInfo.value = res.data;
-		// if (basicInfo.value.stageList) {
-		// 	basicInfo.value.stageList.reverse();
-		// }
+		basicInfo.value = res.data || {};
 	} catch (error) {
 		console.error(error);
 	}
 };
 
-const warningNum = ref(0);
-
-// 法案进展 获取最新进展
-// const handleGetBillEvent = async () => {
-// 	warningNum.value = 0;
-// 	const params = {
-// 		id: window.sessionStorage.getItem("billId")
-// 	};
-// 	try {
-// 		const res = await getBillEvent(params);
-// 		console.log("最新进展", res);
-// 		progressList.value = res.data;
-// 		progressList.value.forEach(item => {
-// 			if (item.fxdj) {
-// 				warningNum.value++;
-// 			}
-// 		});
-// 	} catch (error) {
-// 		console.error(error);
-// 	}
-// };
-
 // 法案进展 获取前期进展 --也是提出人左上角列表
 const handleGetBillDyqk = async () => {
 	const params = {
@@ -583,7 +416,7 @@ const handleGetBillDyqk = async () => {
 	try {
 		const res = await getBillDyqk(params);
 		console.log("前期进展", res);
-		timelineData.value = res.data;
+		timelineData.value = res.data || [];
 
 	} catch (error) {
 		console.error(error);
@@ -592,11 +425,12 @@ const handleGetBillDyqk = async () => {
 
 const personList = ref([]);
 const curPerson = ref({});
+const box3BtnActive = ref("");
 
-// 人物动态
-const personEventList = ref([]);
-
-
+const handleClcikBox3Btn = (name, index) => {
+	box3BtnActive.value = name;
+	curPerson.value = personList.value[index];
+};
 
 // 法案提出人
 const handleGetBillPerson = async () => {
@@ -606,10 +440,14 @@ const handleGetBillPerson = async () => {
 	try {
 		const res = await getBillPerson(params);
 		console.log("提出人", res);
-		// personList.value = res.data;
-		// box3BtnActive.value = res.data.length ? res.data[0].name : "";
-		curPerson.value = res.data.length ? res.data[0] : {};
-		// personEventList.value = res.data.length ? res.data[0].eventList : [];
+		personList.value = res.data || [];
+		if (personList.value.length > 0) {
+			box3BtnActive.value = personList.value[0].name;
+			curPerson.value = personList.value[0];
+		} else {
+			box3BtnActive.value = "";
+			curPerson.value = {};
+		}
 	} catch (error) {
 		console.error(error);
 	}
@@ -1007,16 +845,31 @@ onMounted(() => {
 		.introduction-wrap-right-main {
 			.right-main-box1 {
 				// height: 218px; 将选择框去掉后高度变化
-				height: 171px;
+				min-height: 171px;
+				height: auto;
+				padding-bottom: 15px;
 				// border-bottom: 1px solid rgb(243, 243, 244);
 				.name-box {
 					display: flex;
 					justify-content: flex-start;
+					margin-left: 22px;
+					margin-top: 10px;
 					.person-box {
-						width: 360px;
+						width: 500px;
 						overflow-x: auto;
 						display: flex;
 						justify-content: flex-start;
+						padding-bottom: 5px;
+						&::-webkit-scrollbar {
+							height: 4px;
+						}
+						&::-webkit-scrollbar-thumb {
+							border-radius: 4px;
+							background: #e1e1e1;
+						}
+						&::-webkit-scrollbar-track {
+							background: transparent;
+						}
 						.person-item {
 							height: 28px;
 							box-sizing: border-box;
@@ -1032,8 +885,10 @@ onMounted(() => {
 							justify-content: center;
 							align-items: center;
 							margin-right: 8px;
-							padding: 1px 8px;
+							padding: 1px 12px;
 							cursor: pointer;
+							white-space: nowrap;
+							flex-shrink: 0;
 						}
 						.nameItemActive {
 							border: 1px solid var(--btn-active-border-color);
@@ -1112,9 +967,20 @@ onMounted(() => {
 			}
 			.right-main-box2 {
 				// width: 576px;
-				// height: 150px;
+				max-height: 120px;
+				overflow-y: auto;
 				box-sizing: border-box;
-				padding: 22px 26px;
+				padding: 10px 26px;
+				&::-webkit-scrollbar {
+					width: 4px;
+				}
+				&::-webkit-scrollbar-thumb {
+					border-radius: 4px;
+					background: #e1e1e1;
+				}
+				&::-webkit-scrollbar-track {
+					background: transparent;
+				}
 				// border-bottom: 1px solid rgb(243, 243, 244);
 				// display: flex;
 				// flex-wrap: wrap;
@@ -1173,7 +1039,7 @@ onMounted(() => {
 					overflow-y: auto;
 				}
 				.right-main-box3-footer {
-					margin-top: 7px;
+					margin-top: 1px;
 					display: flex;
 					justify-content: center;
 					.btn-more {
@@ -1278,10 +1144,22 @@ onMounted(() => {
 			}
 			.tag-wrapper {
 				width: 287px;
-				height: 150px;
+				max-height: 150px;
+				overflow-y: auto;
 				box-sizing: border-box;
 				margin-top: 30px;
 				margin-left: 38px;
+				padding-right: 5px;
+				&::-webkit-scrollbar {
+					width: 4px;
+				}
+				&::-webkit-scrollbar-thumb {
+					border-radius: 4px;
+					background: #e1e1e1;
+				}
+				&::-webkit-scrollbar-track {
+					background: transparent;
+				}
 				// border-bottom: 1px solid rgb(243, 243, 244);
 				// display: flex;
 				// flex-wrap: wrap;

src/views/companyPages/component/SupplyChain.vue

@@ -12,10 +12,10 @@
 
         <!-- 右侧操作图标 -->
         <div class="action-icons">
-          <label class="checkbox-item" style="display: flex;align-items: center;">
+          <!-- <label class="checkbox-item" style="display: flex;align-items: center;">
             <input type="checkbox" v-model="rule" />
             <div style="width: 145px;"> 50%穿透规则影响</div>
-          </label>
+          </label> -->
           <!-- 搜索框容器 -->
           <el-input v-model="searchKeyword" style="height: 28px;width: 200px;" placeholder="搜索内容">
             <template #suffix>
@@ -55,10 +55,14 @@
         <div class="filter-section">
           <h4 class="filter-title">领域</h4>
           <div class="checkbox-group">
-            <label v-for="(item, index) in domainFilters" :key="'domain-' + index" class="checkbox-item">
+            <el-checkbox-group v-model="selectedDomain" @change="handleAreaChange">
+              <el-checkbox :label="item.name + '(' + item.num + ')'" v-for="(item, index) in domainFilters"
+                :value="item.id" />
+            </el-checkbox-group>
+            <!-- <label v-for="(item, index) in domainFilters" :key="'domain-' + index" class="checkbox-item">
               <input type="checkbox" v-model="item.checked" />
               <span>{{ item.label }}</span>
-            </label>
+            </label> -->
           </div>
         </div>
 
@@ -66,10 +70,14 @@
         <div class="filter-section country-filter">
           <h4 class="filter-title">国家/地区</h4>
           <div class="checkbox-group two-columns">
-            <label v-for="(item, index) in countryFilters" :key="'country-' + index" class="checkbox-item">
+            <el-checkbox-group v-model="selectedcountry" @change="handleCountryChange">
+              <el-checkbox :label="item.name + '(' + item.num + ')'" v-for="(item, index) in countryFilters"
+                :value="item.id" />
+            </el-checkbox-group>
+            <!-- <label v-for="(item, index) in countryFilters" :key="'country-' + index" class="checkbox-item">
               <input type="checkbox" v-model="item.checked" />
               <span>{{ item.label }}</span>
-            </label>
+            </label> -->
           </div>
         </div>
 
@@ -77,10 +85,10 @@
         <div class="filter-section">
           <h4 class="filter-title">上下游</h4>
           <div class="checkbox-group">
-            <label v-for="(item, index) in upstreamFilters" :key="'upstream-' + index" class="checkbox-item">
-              <input type="checkbox" v-model="item.checked" />
-              <span>{{ item.label }}</span>
-            </label>
+            <el-checkbox-group v-model="selectType" @change="handleTypeChange">
+              <el-checkbox label="上游" value="supply" />
+              <el-checkbox label="下游" value="customer" /> </el-checkbox-group>
+
           </div>
         </div>
       </div>
@@ -93,28 +101,62 @@
 import { ref, onMounted } from 'vue'
 import * as echarts from 'echarts'
 import getGraphChart from '../js/graphChart.js'
+import { getSupplyAreaList, getSupplyCountryList, getSupplyList } from "@/api/companyPages/index.js";
+import { useRouter } from "vue-router";
+const router = useRouter();
 
 const rule = ref('true')//
 const searchKeyword = ref('')
 const domainFilters = ref([
-  { label: '工业软件领域 (36)', checked: true },
-  { label: '供应链与物流服务领域 (36)', checked: false },
-  { label: '人工智能领域 (56)', checked: false },
-  { label: '半导体与集成电路领域 (19)', checked: false },
-  { label: '航天遥感与量子技术领域 (51)', checked: false }
+  // { label: '工业软件领域 (36)', checked: true },
+  // { label: '供应链与物流服务领域 (36)', checked: false },
+  // { label: '人工智能领域 (56)', checked: false },
+  // { label: '半导体与集成电路领域 (19)', checked: false },
+  // { label: '航天遥感与量子技术领域 (51)', checked: false }
 ])
+const selectedDomain = ref([])
+
+const handleGetSupplyAreaList = async () => {
+  try {
+    const res = await getSupplyAreaList(router.currentRoute._value.params.id);
+    console.log("领域", res);
+    if (res.code === 200 && res.data) {
+      domainFilters.value = res.data
+    }
+  } catch (error) {
+    console.error("获取领域error", error);
+  }
+};
+
+const handleAreaChange = val => {
+  handleGetSupplyList()
+};
 
 const countryFilters = ref([
-  { label: '中国 (36)', checked: false },
-  { label: '美国 (36)', checked: false },
-  { label: '韩国 (56)', checked: false },
-  { label: '日本 (19)', checked: false },
-  { label: '中国台湾 (51)', checked: false },
-  { label: '德国 (51)', checked: false },
-  { label: '荷兰 (12)', checked: false },
-  { label: '澳大利亚 (4)', checked: false }
+  // { label: '中国 (36)', checked: false },
+  // { label: '美国 (36)', checked: false },
+  // { label: '韩国 (56)', checked: false },
+  // { label: '日本 (19)', checked: false },
+  // { label: '中国台湾 (51)', checked: false },
+  // { label: '德国 (51)', checked: false },
+  // { label: '荷兰 (12)', checked: false },
+  // { label: '澳大利亚 (4)', checked: false }
 ])
-
+const selectedcountry = ref([])
+const handleGetSupplyCountryList = async () => {
+  try {
+    const res = await getSupplyCountryList(router.currentRoute._value.params.id);
+    console.log("领域", res);
+    if (res.code === 200 && res.data) {
+      countryFilters.value = res.data
+    }
+  } catch (error) {
+    console.error("获取领域error", error);
+  }
+};
+const handleCountryChange = val => {
+  handleGetSupplyList()
+};
 const upstreamFilters = ref([
   { label: '核心企业 (36)', checked: false },
   { label: '控股子公司 (36)', checked: false },
@@ -279,11 +321,61 @@ const setChart = (option, chartId) => {
   chart.setOption(option)
   return chart
 }
-
+const selectType = ref([])
+
+const handleTypeChange = val => {
+  handleGetSupplyList()
+};
+const handleGetSupplyList = async () => {
+  try {
+    let params = {
+      arealist: selectedDomain.value ? selectedDomain.value.join(",") : null,
+      countrylist: selectedcountry.value ? selectedcountry.value.join(",") : null,
+      type: selectType.value.length === 2 ? 'all' : selectType.value ? selectType.value : null,
+      id: router.currentRoute._value.params.id
+    }
+    const res = await getSupplyList(params);
+    console.log("关系", res);
+    if (res.code === 200 && res.data) {
+
+      // 提取所有公司名称
+      const allCompanies = new Set(res.data.flatMap(item => [item.orgName, item.otherOrgName]));
+      const companyMap = {};
+      let id = 0;
+
+      // 创建公司名称到ID的映射
+      allCompanies.forEach(company => {
+        companyMap[company] = id++;
+      });
+
+      // 创建nodes数组
+      const nodes = Array.from(allCompanies, (company, index) => ({
+        id: index,
+        name: company,
+        symbolSize: 30,
+        value: 8,
+        symbol: `image://${CompanyImg}` // 假设CompanyImg是一个图片路径变量
+      }));
+
+      // 创建links数组
+      const links = res.data.map(item => ({
+        source: companyMap[item.orgName],
+        target: companyMap[item.otherOrgName]
+      }));
+      nodes.value = nodes
+      links.value = links
+      const graphOption = getGraphChart(nodes.value, links.value)
+      setChart(graphOption, "graphChart")
+    }
+  } catch (error) {
+    console.error("获取关系error", error);
+  }
+};
 onMounted(() => {
-  // 假设你有 getGraphChart 函数
-  const graphOption = getGraphChart(nodes.value, links.value)
-  setChart(graphOption, "graphChart")
+  handleGetSupplyAreaList()
+  handleGetSupplyCountryList()
+  handleGetSupplyList()
+
 
   // 临时占位：防止报错
   // const placeholderOption = {

src/views/companyPages/component/process.vue

 <template>
   <div class="chart-container">
-    <div v-for="(item, index) in chartData" :key="index" class="chart-card">
+    <div v-for="(item, index) in rawData" :key="index" class="chart-card">
       <!-- 研发投入 -->
       <div class="metric-section">
         <div class="metric-header">
           <span class="title">研发投入</span>
-          <span class="growth-badge">+13.2%</span>
+          <span class="growth-badge">{{ item.investmentGrowthRate + ' % ' }}</span>
         </div>
         <!-- 制裁后 -->
         <div class="bar-row">
           <div class="year-label">{{ item.year }}</div>
           <div style="width: calc(100% - 66px);">
             <div class="bar after" :style="{ width: getInvestmentWidth(item.investmentAfter) + '%' }">
-              <div class="value-label">{{ formatInvestment(item.investmentAfter) }}</div>
+              <div class="value-label">{{ item.investmentAfter + item.investmentUnit }}</div>
             </div>
           </div>
 
         </div>
         <!-- 制裁前 -->
         <div class="bar-row">
-          <div class="year-label">{{ item.year }}</div>
+          <div class="year-label">{{ item.previousYear }}</div>
           <div style="width: calc(100% - 66px);">
             <div class="bar before" :style="{ width: getInvestmentWidth(item.investmentBefore) + '%' }">
-              <div class="value-label">{{ formatInvestment(item.investmentBefore) }}</div>
+              <div class="value-label">{{ item.investmentBefore + item.investmentUnit }}</div>
             </div>
           </div>
 
@@ -33,23 +33,23 @@
       <div class="metric-section">
         <div class="metric-header">
           <span class="title">研发人员</span>
-          <span class="growth-badge">+13.2%</span>
+          <span class="growth-badge">{{ item.staffGrowthRate + '% ' }}</span>
         </div>
         <!-- 制裁后 -->
         <div class="bar-row">
           <div class="year-label">{{ item.year }}</div>
           <div style="width: calc(100% - 66px);">
             <div class="bar after" :style="{ width: getStaffWidth(item.staffAfter) + '%' }">
-              <div class="value-label">{{ formatStaff(item.staffAfter) }}</div>
+              <div class="value-label">{{ item.staffAfter + item.staffmentUnit }}</div>
             </div>
           </div>
         </div>
         <!-- 制裁前 -->
         <div class="bar-row">
-          <div class="year-label">{{ item.year }}</div>
+          <div class="year-label">{{ item.previousYear }}</div>
           <div style="width: calc(100% - 66px);">
             <div class="bar before" :style="{ width: getStaffWidth(item.staffBefore) + '%' }">
-              <div class="value-label">{{ formatStaff(item.staffBefore) }}</div>
+              <div class="value-label">{{ item.staffBefore + item.staffmentUnit }}</div>
             </div>
           </div>
         </div>
@@ -71,22 +71,71 @@
 </template>
 
 <script setup>
-import { ref, computed } from 'vue';
+import { ref, computed, onMounted } from 'vue';
+import { useRouter } from "vue-router";
+import { getStudyList } from "@/api/companyPages/index.js";
+const router = useRouter();
 
 // 模拟从 JSON 导入（实际可替换为 import data from './rdData.json'）
-const rawData = [
-  { year: "2019", investmentBefore: 1.01, investmentAfter: 1.37, staffBefore: 80000, staffAfter: 96000 },
-  { year: "2020", investmentBefore: 1.15, investmentAfter: 1.52, staffBefore: 85000, staffAfter: 102000 },
-  { year: "2021", investmentBefore: 1.20, investmentAfter: 1.68, staffBefore: 90000, staffAfter: 110000 },
-  { year: "2022", investmentBefore: 1.25, investmentAfter: 1.75, staffBefore: 92000, staffAfter: 115000 },
-  { year: "2023", investmentBefore: 1.30, investmentAfter: 1.85, staffBefore: 95000, staffAfter: 120000 }
-];
+const rawData = ref([
+  // { year: "2019", investmentBefore: 1.01, investmentAfter: 1.37, staffBefore: 80000, staffAfter: 96000 },
+  // { year: "2020", investmentBefore: 1.15, investmentAfter: 1.52, staffBefore: 85000, staffAfter: 102000 },
+  // { year: "2021", investmentBefore: 1.20, investmentAfter: 1.68, staffBefore: 90000, staffAfter: 110000 },
+  // { year: "2022", investmentBefore: 1.25, investmentAfter: 1.75, staffBefore: 92000, staffAfter: 115000 },
+  // { year: "2023", investmentBefore: 1.30, investmentAfter: 1.85, staffBefore: 95000, staffAfter: 120000 }
+])
+const handleGetStudyList = async () => {
+  try {
+    const res = await getStudyList(router.currentRoute._value.params.id);
+    console.log("被制裁情况:数据对比", res);
+    if (res.code === 200 && res.data) {
+      // 创建一个映射对象，用于存储分组后的数据
+      const groupedData = {};
+
+      res.data.forEach(item => {
+        const key = `${item.year}-${item.previousYear}`;
+
+        if (!groupedData[key]) {
+          groupedData[key] = {
+            year: item.year,
+            previousYear: item.previousYear,
+            investmentAfter: 0,
+            investmentBefore: 0,
+            investmentGrowthRate: 0,
+            staffAfter: 0,
+            staffBefore: 0,
+            staffGrowthRate: 0
+          };
+        }
+
+        if (item.type === "研发投入") {
+          groupedData[key].investmentAfter = item.currentValue;
+          groupedData[key].investmentBefore = item.previousValue;
+          groupedData[key].investmentGrowthRate = item.growthRate;
+          groupedData[key].investmentUnit = item.unit;
+        } else if (item.type === "研发人员") {
+          groupedData[key].staffAfter = item.currentValue;
+          groupedData[key].staffBefore = item.previousValue;
+          groupedData[key].staffGrowthRate = item.growthRate;
+          groupedData[key].staffmentUnit = item.unit;
+        }
+      });
+
+      // 将结果转换为数组
+      const result = Object.values(groupedData);
+      rawData.value = result
+      // rawData.value = result
+      console.log(rawData.value, 'rawData.valuerawData.value')
+    }
+  } catch (error) {
+    console.error("获取被制裁情况:数据对比error", error);
+  }
+};
 
-const chartData = ref(rawData);
 
 // === 投入相关计算 ===
 const maxInvestment = computed(() => {
-  return Math.max(...chartData.value.flatMap(d => [d.investmentBefore, d.investmentAfter]));
+  return Math.max(...rawData.value.flatMap(d => [d.investmentBefore, d.investmentAfter]));
 });
 
 function getInvestmentWidth(value) {
@@ -99,7 +148,7 @@ function formatInvestment(value) {
 
 // === 人员相关计算 ===
 const maxStaff = computed(() => {
-  return Math.max(...chartData.value.flatMap(d => [d.staffBefore, d.staffAfter]));
+  return Math.max(...rawData.value.flatMap(d => [d.staffBefore, d.staffAfter]));
 });
 
 function getStaffWidth(value) {
@@ -109,12 +158,17 @@ function getStaffWidth(value) {
 function formatStaff(value) {
   return Math.round(value / 1000) + 'k+';
 }
+
+onMounted(() => {
+  handleGetStudyList()
+});
 </script>
 
 <style scoped>
 .chart-container {
   display: flex;
-  flex-wrap: wrap;
+  /* flex-wrap: wrap; */
+  overflow: auto;
   gap: 24px;
   padding: 24px;
 }

src/views/coopRestriction/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>
-			<div class="left-center">
-				<img src="./assets/usImg.png" 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">2025年10月7日</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>
-							</li>
-						</ul>
+			
+			<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 coopRestrictionTrends" :key="item.ID || index">
+					<div class="carousel-item-content">
+						<div class="left-center">
+							<img :src="item.IMAGEURL || defaultImg" alt="" />
+							<div class="left-center-main">
+								<div class="left-center-main-title">{{ item.LIMITNAME || "暂无动态" }}</div>
+								<div class="left-center-main-ul">
+									<ul>
+										<li>
+											<span class="ul-title">数据来源：</span>
+											<span class="ul-content">{{ item.ORGNAME || "未知" }}</span>
+										</li>
+										<li>
+											<span class="ul-title">合作限制类型：</span>
+											<span class="ul-content">{{ item.LIMITTYPE || "未知" }}</span>
+										</li>
+										<li>
+											<span class="ul-title">发布日期：</span>
+											<span class="ul-content">{{ item.LIMITDATE || "未知" }}</span>
+										</li>
+										<li>
+											<span class="ul-title">涉及领域：</span>
+											<div class="ul-tags" v-if="item.AREA">
+												<span 
+													v-for="(field, fIndex) in (typeof item.AREA === 'string' ? item.AREA.split(',') : item.AREA)" 
+													:key="fIndex"
+													class="ul-pie"
+													:class="'cl' + ((fIndex % 3) + 1)"
+												>
+													{{ field }}
+												</span>
+											</div>
+											<span v-else class="ul-content">未知</span>
+										</li>
+									</ul>
+								</div>
+							</div>
+							<!-- <div class="left-center-title">{{ item.LIMITTYPE }}</div> -->
+						</div>
+						<div class="left-bottom">
+							<ul>
+								<li class="left-bottom-li">内容摘要：</li>
+							</ul>
+							<div class="left-bottom-content">
+								{{ item.INTRODUCTION || "暂无内容摘要" }}
+							</div>
+						</div>
 					</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">
-					该法案已被纳入《国防授权法案》（NDAA）的讨论范畴，并已在参议院通过审议
-					。该法案规定，将禁止任何与中国等被视为“敌对国”有合作关系的科学家获得联邦资助
-					。其限制范围极其宽泛，从联合研究、合著论文到指导研究生或博士后几乎全覆盖
-					。更严厉的是，该条款具有追溯效力，可追溯至过去5年的合作。
-				</div>
-			</div>
+				</el-carousel-item>
+				
+				<!-- 无数据时的占位展示 -->
+				<el-carousel-item v-if="coopRestrictionTrends.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 v-for="item in riskSignals" :key="item.id" class="right-main"	@click="handleToRiskDetail">
 					<div class="main-left" :class="{ cl4: item.title === '特别重大', cl5: item.title === '重大风险' }">
 						{{ item.title }}
 					</div>
@@ -75,10 +116,52 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { ref, onMounted, computed } from "vue";
 import router from "@/router";
+import { getCoopRestrictionTrends } from "@/api/coopRestriction/coopRestriction.js";
+import defaultImg from "./assets/usImg.png";
+
+const coopRestrictionTrends = ref([]);
+const carouselRef = ref(null);
+const activeIndex = ref(0);
+
+// 获取合作限制-最新动态数据
+const getCoopRestrictionTrendsData = async () => {
+	try {
+		const res = await getCoopRestrictionTrends();
+		if (res && res.code === 200) {
+			coopRestrictionTrends.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 (coopRestrictionTrends.value.length === 0) return null;
+	return coopRestrictionTrends.value[activeIndex.value] || coopRestrictionTrends.value[0];
+});
 
-const list = ref([
+// 右侧风险信号列表 
+const riskSignals = ref([
 	{
 		id: 1,
 		title: "特别重大",
@@ -106,8 +189,19 @@ const list = ref([
 ]);
 
 // 点击查看详情
-const handleClickToDetail = () => {
-	// router.push("/decreeLayout");
+const handleClickToDetail = (item) => {
+	const activeItem = (item && item.ID) ? item : mainTrend.value;
+	const id = activeItem?.ID;
+	if (!id) return;
+	const curRoute = router.resolve({
+		path: "/cooperationRestrictions/detail",
+		query: { id: id },
+	});
+	window.open(curRoute.href, "_blank");
+};
+
+// 点击风险信号详情
+const handleToRiskDetail = () => {
 	const curRoute = router.resolve("/cooperationRestrictions/detail");
 	window.open(curRoute.href, "_blank");
 };
@@ -118,6 +212,10 @@ const handleToMoreRiskSignal = () => {
 	window.open(route.href, "_blank");
 };
 
+onMounted(() => {
+	// 合作限制-最新动态数据-获取数据
+    getCoopRestrictionTrendsData();
+});
 </script>
 
 <style scoped lang="scss">
@@ -146,6 +244,8 @@ const handleToMoreRiskSignal = () => {
 			top: 223px;
 			left: 0px;
 			cursor: pointer;
+			z-index: 100;
+			pointer-events: auto;
 		}
 		.right-btn {
 			width: 24px;
@@ -154,6 +254,8 @@ const handleToMoreRiskSignal = () => {
 			top: 223px;
 			right: 0px;
 			cursor: pointer;
+			z-index: 100;
+			pointer-events: auto;
 		}
 		.left-top {
 			width: 100%;
@@ -178,6 +280,7 @@ const handleToMoreRiskSignal = () => {
 				right: 40px;
 				color: rgb(5, 95, 194);
 				cursor: pointer;
+				z-index: 101;
 			}
 			.left-top-title {
 				margin-left: 60px;
@@ -193,6 +296,10 @@ const handleToMoreRiskSignal = () => {
 				padding: 11px 16px;
 			}
 		}
+		.carousel-item-content {
+			width: 100%;
+			height: 100%;
+		}
 		.left-center {
 			width: 967px;
 			height: 208px;
@@ -224,12 +331,13 @@ const handleToMoreRiskSignal = () => {
 						list-style-position: inside;
 						li {
 							width: 100%;
-							height: 24px;
+							min-height: 24px;
 							margin-bottom: 12px;
+							display: flex;
+							align-items: flex-start;
 							.ul-title {
-								display: inline-block;
+								flex-shrink: 0;
 								width: 120px;
-								height: 24px;
 								font-size: 16px;
 								font-weight: 700;
 								font-family: "Microsoft YaHei";
@@ -237,19 +345,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);

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

@@ -4,7 +4,7 @@
 			<div class="left-title">
 				<img src="./assets/icon01.png" alt="" />
 				<div class="tit">各类型合作限制政策对比</div>
-				<el-select v-model="value" placeholder="Select" class="select">
+				<el-select v-model="value" placeholder="Select" class="select" @change="getCoopRestrictionCompareData">
 					<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
 				</el-select>
 			</div>
@@ -16,7 +16,7 @@
 			<div class="right-title">
 				<img src="./assets/icon02.png" alt="" />
 				<div class="tit">各领域规则分布情况</div>
-                <el-select v-model="value1" placeholder="Select" class="select">
+                <el-select v-model="value1" placeholder="Select" class="select" @change="getCoopRestrictionDomainData">
 					<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
 				</el-select>
 			</div>
@@ -30,28 +30,120 @@
 <script setup>
 import { ref, onMounted, onBeforeUnmount } from "vue";
 import * as echarts from "echarts";
+import { getCoopRestrictionCompare, getCoopRestrictionDomain } from "@/api/coopRestriction/coopRestriction";
 
-const value = ref("近十年");
-const value1 = ref("2025年");
+// 合作限制-各领域规则分布情况接口
+const coopRestrictionDomain = ref([]);
+const getCoopRestrictionDomainData = async () => {
+	try {
+		const res = await getCoopRestrictionDomain({
+			year: value1.value
+		});
+		if (res && res.code === 200) {
+			coopRestrictionDomain.value = res.data || [];
+		}
+	} catch (error) {
+		console.error("获取合作限制各领域规则分布情况数据失败:", error);
+	} 
+};
+
+
+// 合作限制-各类型合作限制政策对比接口
+const coopRestrictionCompare = ref([]);
+const getCoopRestrictionCompareData = async () => {
+	try {
+		const res = await getCoopRestrictionCompare({
+			years: value.value
+		});
+		if (res && res.code === 200) {
+			coopRestrictionCompare.value = res.data || [];
+		}
+	} catch (error) {
+		console.error("获取合作限制各类型合作限制政策对比数据失败:", error);
+	} 
+};
+
+const value = ref(10);
+const value1 = ref("2026");
 const options = [
-	{
-		value: "近十年",
-		label: "近十年"
-	},
-	{
-		value: "近五年",
-		label: "近五年"
-	}
+	{ value: 1, label: "近一年" },
+	{ value: 2, label: "近两年" },
+	{ value: 3, label: "近三年" },
+	{ value: 4, label: "近四年" },
+	{ value: 5, label: "近五年" },
+	{ value: 10, label: "近十年" },
+	{ value: 15, label: "近十五年" },
+	{ value: 20, label: "近二十年" }
 ];
 const options1 = [
+    {
+        value: "2026",
+        label: "2026年"
+    },
 	{
-		value: "2025年",
+		value: "2025",
 		label: "2025年"
 	},
 	{
-		value: "2024年",
+		value: "2024",
 		label: "2024年"
-	}
+	},
+    {
+        value: "2023",
+        label: "2023年"
+    },
+    {
+        value: "2022",
+        label: "2022年"
+    },
+    {
+        value: "2021",
+        label: "2021年"
+    },
+    {
+        value: "2020",
+        label: "2020年"
+    },
+    {
+        value: "2019",
+        label: "2019年"
+    },
+    {
+        value: "2018",
+        label: "2018年"
+    },
+    {
+        value: "2017",
+        label: "2017年"
+    },
+    {
+        value: "2016",
+        label: "2016年"
+    },
+    {
+        value: "2015",
+        label: "2015年"
+    },
+    {
+        value: "2014",
+        label: "2014年"
+    },
+    {
+        value: "2013",
+        label: "2013年"
+    },
+    {
+        value: "2012",
+        label: "2012年"
+    },
+    {
+        value: "2011",
+        label: "2011年"
+    },
+    {
+        value: "2010",
+        label: "2010年"
+    }
 ];
 
 const leftChartRef = ref(null);
@@ -214,7 +306,14 @@ const initRightChart = () => {
     rightChart.setOption(option);
 };
 
-onMounted(() => { initLeftChart(); initRightChart(); });
+onMounted(() => { 
+    // 合作限制-各类型合作限制政策对比接口
+    getCoopRestrictionCompareData();
+    // 合作限制-各领域规则分布情况接口
+    getCoopRestrictionDomainData();
+    initLeftChart();
+    initRightChart();
+});
 onBeforeUnmount(() => { window.removeEventListener("resize", handleResize); if (leftChart) { leftChart.dispose(); leftChart = null; } if (rightChart) { rightChart.dispose(); rightChart = null; } });
 </script>
 
@@ -259,7 +358,7 @@ onBeforeUnmount(() => { window.removeEventListener("resize", handleResize); if (
 				color: rgb(5, 95, 194);
 			}
             .select {
-                width: 120px;
+                width: 150px;
                 height: 28px;
                 padding: 0px 12px;
                 position: absolute;
@@ -307,7 +406,7 @@ onBeforeUnmount(() => { window.removeEventListener("resize", handleResize); if (
 				color: rgb(5, 95, 194);
 			}
             .select {
-                width: 120px;
+                width: 150px;
                 height: 28px;
                 padding: 0px 12px;
                 position: absolute;

src/views/coopRestriction/index.vue

@@ -95,7 +95,7 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { ref, onMounted } from "vue";
 import { useRouter } from "vue-router";
 import comTitle from "./common/comTitle.vue";
 import newData from "./components/dataNew/index.vue";

src/views/exportControl/index.vue

 <template>
 	<div class="home-wrapper">
-		<div class="home-header">
+		<div class="search-header" v-show="isShow">
+			<div class="home-main-header-center">
+				<el-input v-model="searchExportControlText" 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" @click="handleSearch">搜索</div>
+				</div>
+			</div>
+			<div class="home-main-header-btn-box">
+				<div class="btn" @click="handleToPosi('position1')">
+					<div class="btn-text">{{ "最新动态" }}</div>
+					<div class="btn-icon">
+						<img src="@/assets/icons/arrow-right-icon.png" alt="" />
+					</div>
+				</div>
+				<div class="btn" @click="handleToPosi('position2')">
+					<div class="btn-text">{{ "资讯要闻" }}</div>
+					<div class="btn-icon">
+						<img src="@/assets/icons/arrow-right-icon.png" alt="" />
+					</div>
+				</div>
+				<div class="btn" @click="handleToPosi('position3')">
+					<div class="btn-text">{{ "数据总览" }}</div>
+					<div class="btn-icon">
+						<img src="@/assets/icons/arrow-right-icon.png" alt="" />
+					</div>
+				</div>
+				<div class="btn" @click="handleToPosi('position4')">
+					<div class="btn-text">{{ "资源库" }}</div>
+					<div class="btn-icon">
+						<img src="@/assets/icons/arrow-right-icon.png" alt="" />
+					</div>
+				</div>
+			</div>
+		</div>
+		<div class="home-header" v-show="!isShow">
 			<div class="header-item">国家科技安全</div>
 			<div class="header-item">></div>
 			<div class="header-item back-item" @click="handleBackHome">中美博弈概览</div>
 			<div class="header-item">></div>
 			<div class="header-item">出口管制</div>
 		</div>
-		<div class="home-main">
+		<div class="home-main" ref="homeMainRef" :class="{ 'scroll-main': isShow }">
 			<div class="home-main-header">
-				<div class="home-main-header-center">
-					<!-- <el-input
-						v-model="searchExportControlText"
-						style="width: 100%; height: 48px"
-						size="large"
-						placeholder="搜索出口管制调查"
-						:suffix-icon="Search"
-					/> -->
-					<el-input v-model="searchExportControlText" style="width: 800px; height: 100%" placeholder="搜索出口管制调查" />
+				<div class="home-main-header-center"  v-show="!isShow">
+					<el-input v-model="searchExportControlText" style="width: 800px; height: 100%" placeholder="搜索出口管制" />
 					<div class="search">
 						<div class="search-icon">
 							<img src="@/assets/icons/search-icon.png" alt="" />
@@ -25,40 +55,26 @@
 						<div class="search-text" @click="handleSearch">搜索</div>
 					</div>
 				</div>
-				<!-- <div class="home-main-header-footer">
-					<div class="home-main-header-footer-item">
-						<div class="item-top">1096</div>
-						<div class="item-footer">实体清单</div>
-					</div>
-					<div class="home-main-header-footer-item">
-						<div class="item-top">2633</div>
-						<div class="item-footer">商业管制清单</div>
-					</div>
-					<div class="home-main-header-footer-item">
-						<div class="item-top">162</div>
-						<div class="item-footer">关键和新型技术清单</div>
-					</div>
-				</div> -->
-				<div class="home-main-header-btn-box">
-					<div class="btn" @click="scrollToTop('position1')">
+				<div class="home-main-header-btn-box"  v-show="!isShow">
+					<div class="btn" @click="handleToPosi('position1')">
 						<div class="btn-text">{{ "最新动态" }}</div>
 						<div class="btn-icon">
 							<img src="@/assets/icons/arrow-right-icon.png" alt="" />
 						</div>
 					</div>
-					<div class="btn" @click="scrollToTop('position2')">
+					<div class="btn" @click="handleToPosi('position2')">
 						<div class="btn-text">{{ "资讯要闻" }}</div>
 						<div class="btn-icon">
 							<img src="@/assets/icons/arrow-right-icon.png" alt="" />
 						</div>
 					</div>
-					<div class="btn" @click="scrollToTop('position3')">
-						<div class="btn-text">{{ "统计概览" }}</div>
+					<div class="btn" @click="handleToPosi('position3')">
+						<div class="btn-text">{{ "数据总览" }}</div>
 						<div class="btn-icon">
 							<img src="@/assets/icons/arrow-right-icon.png" alt="" />
 						</div>
 					</div>
-					<div class="btn" @click="scrollToTop('position4')">
+					<div class="btn" @click="handleToPosi('position4')">
 						<div class="btn-text">{{ "资源库" }}</div>
 						<div class="btn-icon">
 							<img src="@/assets/icons/arrow-right-icon.png" alt="" />
@@ -557,9 +573,15 @@
 									</div>
 								</div>
 								<div class="right-footer">
-									<div class="total-count">共{{ totalAll }}项调查</div>
-									<el-pagination v-model:current-page="currentPageAll" :page-size="pageSizeAll" :total="totalAll"
-										layout="prev, pager, next" background @current-change="handlePageChangeAll" />
+									<div class="total-count">共{{ totalAll }}项</div>
+									<el-pagination
+										v-model:current-page="currentPageAll"
+										:page-size="pageSizeAll"
+										:total="totalAll"
+										layout="prev, pager, next"
+										background
+										@current-change="handlePageChangeAll"
+									/>
 								</div>
 							</div>
 						</div>
@@ -607,6 +629,9 @@
 <script setup>
 import { onMounted, ref, computed, reactive, shallowRef, watch } from "vue";
 import scrollToTop from "@/utils/scrollToTop";
+import { useContainerScroll } from "@/hooks/useScrollShow";
+const homeMainRef = ref(null);
+const { isShow } = useContainerScroll(homeMainRef);
 import * as echarts from "echarts";
 import setChart from "@/utils/setChart";
 import { ElMessage, ElMessageBox } from "element-plus";
@@ -658,6 +683,19 @@ import {
 	getExportControlList
 } from "@/api/exportControl";
 
+const handleToPosi = id => {
+	const element = document.getElementById(id);
+	if (element && homeMainRef.value) {
+		const containerRect = homeMainRef.value.getBoundingClientRect();
+		const elementRect = element.getBoundingClientRect();
+		const top = elementRect.top - containerRect.top + homeMainRef.value.scrollTop;
+		homeMainRef.value.scrollTo({
+			top: top,
+			behavior: "smooth"
+		});
+	}
+};
+
 // 跳转到单项制裁页面
 const handleToRiskSignalDetail = item => {
 	const routeData = router.resolve({
@@ -1185,6 +1223,7 @@ const fetchSanctionList = async () => {
 const handlePageChangeAll = val => {
 	currentPageAll.value = val;
 	fetchSanctionList();
+	handleToPosi("position4");
 };
 
 watch(
@@ -1316,8 +1355,8 @@ const resourceTabs = [
 	{ label: "全部制裁", value: "all", disabled: false },
 	{ label: "实体清单", value: "entity", disabled: false },
 	{ label: "商业管制清单", value: "commerce", disabled: true },
-	{ label: "关键与新兴技术清单", value: "tech", disabled: true },
-	{ label: "军事最终用户清单", value: "military", disabled: true }
+	// { label: "关键与新兴技术清单", value: "tech", disabled: true },
+	// { label: "军事最终用户清单", value: "military", disabled: true }
 ];
 const activeResourceTab = ref("all");
 
@@ -3233,4 +3272,102 @@ const handleMediaClick = item => {
 		}
 	}
 }
+.search-header {
+	width: 100%;
+	height: 144px;
+	background: #fff;
+	overflow: hidden;
+	.home-main-header-center {
+		margin-top: 20px;
+		margin-left: 200px;
+		width: 800px;
+		height: 48px;
+		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: 0px;
+			width: 120px;
+			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;
+				img {
+					width: 100%;
+					height: 100%;
+				}
+			}
+			.search-text {
+				margin-left: 8px;
+				height: 22px;
+				color: #fff;
+				font-family: Microsoft YaHei;
+				font-size: 16px;
+				font-weight: 400;
+				line-height: 22px;
+			}
+		}
+	}
+	.home-main-header-btn-box {
+		margin-top: 20px;
+		margin-left: 200px;
+		display: flex;
+		gap: 16px;
+		.btn {
+			display: flex;
+			align-items: center;
+			gap: 9px;
+			width: 160px;
+			height: 48px;
+			border: 1px solid #aed6ff;
+			box-sizing: border-box;
+			border-radius: 24px;
+			background: #e7f3ff;
+			cursor: pointer;
+			position: relative;
+			&:hover {
+				background: #cae3fc;
+			}
+			.btn-text {
+				width: 80px;
+				color: var(--color-main-active);
+				font-family: Microsoft YaHei;
+				font-size: 20px;
+				font-weight: 400;
+				line-height: 48px;
+				margin-left: 36px;
+				text-align: center;
+			}
+			.btn-icon {
+				position: absolute;
+				top: 16px;
+				right: 19px;
+				width: 6px;
+				height: 12px;
+				img {
+					width: 100%;
+					height: 100%;
+				}
+			}
+		}
+	}
+}
+.scroll-main {
+	height: calc(100% - 144px) !important;
+}
 </style>

src/views/exportControl/v2.0EntityList/components/dataStatistics/index.vue

@@ -30,7 +30,7 @@
 				<div class="item-position"></div>
 				<div class="content">
 					<div class="info">
-						<div class="title">2025年新增</div>
+						<div class="title">{{ currentYear }}年新增</div>
 					</div>
 					<div class="number">
 						<span class="num">{{ totalCount.latestYearCount }}</span>
@@ -43,7 +43,7 @@
 				<div class="content">
 					<div class="info">
 						<div class="title">近期制裁新增</div>
-						<div class="subtitle">2025年11月12日</div>
+						<!-- <div class="subtitle">{{ totalCount.latestTime }}</div> -->
 					</div>
 					<div class="number">
 						<span class="num">{{ totalCount.latestTimeCount }}</span>
@@ -342,38 +342,28 @@ const regionTime = ref("all");
 const domainTime = ref("all");
 const typeTime = ref("all");
 
+const currentYear = new Date().getFullYear();
+
 const timeOptions = [
 	{ label: "全部时间", value: "all" },
-	{ label: "2025年", value: "2025" },
-	{ label: "2024年", value: "2024" },
-	{ label: "2023年", value: "2023" },
-	{ label: "2022年", value: "2022" },
-	{ label: "2021年", value: "2021" },
-	{ label: "2020年", value: "2020" },
-	{ label: "2019年", value: "2019" },
-	{ label: "2018年", value: "2018" },
-	{ label: "2017年", value: "2017" },
-	{ label: "2016年", value: "2016" },
-	{ label: "2015年", value: "2015" }
 ];
 
+for (let i = 0; i <= 10; i++) {
+	const year = currentYear - i;
+	timeOptions.push({ label: `${year}年`, value: year.toString() });
+}
+
 const sanctionCountChartRef = ref(null);
 const mapChartRef = ref(null);
 const domainChartRef = ref(null);
 const typeChartRef = ref(null);
 
-
-
 const getBarColor = index => {
 	if (index === 0) return "linear-gradient(90deg, rgba(255, 77, 79, 0) 0%, rgba(255, 77, 79, 1) 100%)";
 	if (index === 1 || index === 2) return "linear-gradient(90deg, rgba(255, 172, 77, 0) 0%, rgba(255, 172, 77, 1) 100%)";
 	return "linear-gradient(90deg, rgba(5, 95, 194, 0) 0%, rgba(5, 95, 194, 1) 100%)";
 };
 
-
-
-
-
 const updateSanctionCountChart = () => {
 	if (!sanctionCountChartRef.value) return;
 	let chart = echarts.getInstanceByDom(sanctionCountChartRef.value);

src/views/exportControl/v2.0EntityList/components/sanctionsOverview/components/introductionPage/index.vue

@@ -82,7 +82,7 @@
 					</div>
 				</div>
 				<div class="left-footer">
-					<div class="total-count">共{{ totalAll }}项调查</div>
+					<div class="total-count">共{{ totalAll }}项</div>
 					<el-pagination
 						v-model:current-page="currentPageAll"
 						:page-size="pageSizeAll"
@@ -291,6 +291,18 @@ watch([selectedDomain, onlyChina], () => {
 const handlePageChangeAll = val => {
 	currentPageAll.value = val;
 	getSanctionUpdate();
+	const container = document.querySelector(".entity-list");
+	const target = document.querySelector(".left-bottom");
+	if (container && target) {
+		const containerRect = container.getBoundingClientRect();
+		const targetRect = target.getBoundingClientRect();
+		// 148是吸顶头部的高度，减去它以避免标题被遮挡
+		const top = targetRect.top - containerRect.top + container.scrollTop - 148;
+		container.scrollTo({
+			top: top,
+			behavior: "smooth"
+		});
+	}
 };
 
 // 获取实体清单发布机构

src/views/exportControl/v2.0EntityList/index.vue

@@ -84,11 +84,11 @@ const headerNavList = ref([
         imgActive: icon2Active,
         title: "深度挖掘"
     },
-    {
-        img: icon3,
-        imgActive: icon3Active,
-        title: "影响分析"
-    }
+    // {
+    //     img: icon3,
+    //     imgActive: icon3Active,
+    //     title: "影响分析"
+    // }
 ])
 
 
@@ -103,11 +103,16 @@ const headerNavList = ref([
 .entity-list{
     width: 100%;
     height: 100%;
+    overflow-y: auto;
     .header{
         width: 100%;
         height: 148px;
         background-color: #fff;
         padding-top: 16px;
+        position: sticky;
+        top: 0;
+        z-index: 1000;
+        box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05);
         .header-title{
             width: 1601px;
             height: 72px;
@@ -214,7 +219,8 @@ const headerNavList = ref([
     }
     .main{
         width: 100%;
-        height: calc(100% - 148px);
+        height: auto;
+        min-height: calc(100% - 148px);
         background-color: #F7F8F9;
     }
 }

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

@@ -34,7 +34,7 @@
 					</div>
 					<div class="number">
 						<span class="num">{{ totalCount.techDomainCount }}</span>
-						<span class="unit">家</span>
+						<span class="unit">个</span>
 					</div>
 				</div>
 			</div>
@@ -45,9 +45,9 @@
 					<div class="box"></div>
 					<div class="text">制裁实体领域分布情况</div>
 					<div class="right-group">
-						<el-select v-model="domainTime" class="time-select" placeholder="请选择">
+						<!-- <el-select v-model="domainTime" class="time-select" placeholder="请选择">
 							<el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" />
-						</el-select>
+						</el-select> -->
 						<div class="btn">
 							<img src="../../assets/数据库按钮.png" alt="" />
 							<img src="../../assets/下载按钮.png" alt="" />
@@ -73,9 +73,9 @@
 					<div class="box"></div>
 					<div class="text">制裁实体类型分布情况</div>
 					<div class="right-group">
-						<el-select v-model="typeTime" class="time-select" placeholder="请选择">
+						<!-- <el-select v-model="typeTime" class="time-select" placeholder="请选择">
 							<el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" />
-						</el-select>
+						</el-select> -->
 						<div class="btn">
 							<img src="../../assets/数据库按钮.png" alt="" />
 							<img src="../../assets/下载按钮.png" alt="" />
@@ -99,7 +99,7 @@
 			<div class="main-item">
 				<div class="title-com">
 					<div class="box"></div>
-					<div class="text">制裁实体国家分布</div>
+					<div class="text">制裁实体国家分布情况</div>
 					<div class="right-group">
 						<div class="btn">
 							<img src="../../assets/数据库按钮.png" alt="" />
@@ -141,9 +141,9 @@
 					<div class="box"></div>
 					<div class="text">制裁实体地域分布情况</div>
 					<div class="right-group">
-						<el-select v-model="regionTime" class="time-select" placeholder="请选择">
+						<!-- <el-select v-model="regionTime" class="time-select" placeholder="请选择">
 							<el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" />
-						</el-select>
+						</el-select> -->
 						<div class="btn">
 							<img src="../../assets/数据库按钮.png" alt="" />
 							<img src="../../assets/下载按钮.png" alt="" />

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

@@ -272,7 +272,8 @@ const getUrlParams = () => {
     sanRecordId.value = urlParams.get("id") || ""
 }
 
-const activeTab = ref(["实体穿透分析", "重点实体识别"]);
+// const activeTab = ref(["实体穿透分析", "重点实体识别"]);
+const activeTab = ref(["实体穿透分析"]);
 const activeIndex = ref(0);
 const rightActiveTab = ref("supplyChain");
 

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

@@ -514,30 +514,26 @@ onMounted(() => {
   margin: 0 auto;
   padding-top: 16px;
   padding-bottom: 50px;
-
-  .main {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    justify-content: space-between;
-
-    .left {
-      width: 520px;
-      height: 1119px;
-
-      .left-top {
-        width: 100%;
-        height: 582px;
-        padding-bottom: 20px;
-        border-radius: 10px;
-        box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
-        background-color: #fff;
-        margin-bottom: 16px;
-
+	.main {
+		width: 100%;
+		height: 100%;
+		display: flex;
+		justify-content: space-between;
+		.left {
+			width: 520px;
+			height: 1119px;
+			.left-top {
+				width: 100%;
+				height: auto;
+				padding-bottom: 20px;
+				border-radius: 10px;
+				box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
+				background-color: #fff;
+				margin-bottom: 16px;
         .left-top-title {
           padding: 22px 20px 22px 27px;
           width: 100%;
-          height: 286px;
+          height: auto;
           border-bottom: 1px solid rgb(234, 236, 238);
           display: flex;
           flex-direction: column;
@@ -569,7 +565,7 @@ onMounted(() => {
               font-size: 16px;
               font-family: "Microsoft YaHei";
               line-height: 24px;
-              overflow: hidden; // Ensure it respects the container width
+              overflow: hidden; 
 
               &.link {
                 color: rgb(5, 95, 194);
@@ -591,26 +587,10 @@ onMounted(() => {
 
               &.tags {
                 gap: 8px;
-                overflow-x: auto; // Allow horizontal scrolling
-                white-space: nowrap; // Prevent wrapping
-                padding-bottom: 4px; // Add some space for scrollbar
-
-                /* Custom Scrollbar */
-                &::-webkit-scrollbar {
-                  height: 4px;
-                }
-
-                &::-webkit-scrollbar-thumb {
-                  background: #ccc;
-                  border-radius: 2px;
-                }
-
-                &::-webkit-scrollbar-track {
-                  background: transparent;
-                }
+                flex-wrap: wrap;
+                overflow: visible;
 
                 .tag {
-                  flex-shrink: 0; // Prevent tags from shrinking
                   padding: 1px 8px;
                   background: rgba(246, 250, 255, 1);
                   border-radius: 4px;

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

@@ -162,11 +162,16 @@ onMounted(() => {
 .entity-list{
     width: 100%;
     height: 100%;
+    overflow-y: auto;
     .header{
         width: 100%;
         height: 148px;
         background-color: #fff;
         padding-top: 16px;
+        position: sticky;
+        top: 0;
+        z-index: 1000;
+        box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05);
         .header-title{
             width: 1601px;
             height: 72px;
@@ -300,7 +305,8 @@ onMounted(() => {
     }
     .main{
         width: 100%;
-        height: calc(100% - 148px);
+        height: auto;
+        min-height: calc(100% - 148px);
         background-color: #F7F8F9;
     }
 }

src/views/innovationSubject/index.vue

+<!--创新主体主页-->
 <template>
 	<div class="home-wrapper">
 		<div class="search-header" v-show="isShow">
@@ -122,29 +123,20 @@
 						<div class="box1-main">
 							<div class="box1-main-left">
 								<div class="box1-main-left-top">
-									<div
-										class="box1-main-left-top-item"
-										v-for="item in distributionList"
-										:key="item.name"
-										:style="{ backgroundColor: item.color, color: item.textcolor }"
-									>
+									<div class="box1-main-left-top-item" v-for="item in distributionList" :key="item.name"
+										:style="{ backgroundColor: item.color, color: item.textcolor }">
 										<div class="box1-main-left-top-item-text1">{{ item.name }}</div>
 										<div class="box1-main-left-top-item-text2">{{ item.num }}</div>
 									</div>
 								</div>
 								<div class="box1-main-left-down">
-									<div
-										class="box1-main-left-down-item"
-										v-for="item in zhouList"
-										:key="item.index"
-										:style="{
-											backgroundColor:
-												item.index % 2 !== 0 ? 'rgba(248, 249, 250, 1)' : 'rgba(255, 255, 255, 1)'
-										}"
-									>
-										<div class="box1-main-left-down-item-index">{{ item.index }}</div>
-										<div class="box1-main-left-down-item-text">{{ item.name }}</div>
-										<div class="box1-main-left-down-item-num">{{ item.num }}</div>
+									<div class="box1-main-left-down-item" v-for="(item, index) in zhouList" :key="index" :style="{
+										backgroundColor:
+											index % 2 !== 0 ? 'rgba(248, 249, 250, 1)' : 'rgba(255, 255, 255, 1)'
+									}">
+										<div class="box1-main-left-down-item-index">{{ index + 1 }}</div>
+										<div class="box1-main-left-down-item-text">{{ item.countName }}</div>
+										<div class="box1-main-left-down-item-num">{{ item.countNum }}</div>
 									</div>
 								</div>
 							</div>
@@ -164,18 +156,11 @@
 							</div>
 						</div>
 						<div class="box2-main">
-							<div
-								class="box2-main-item"
-								v-for="(item, index) in warningList"
-								:key="index"
-							>
-								<div
-									class="item-left"
-									:class="{
-										itemLeftStatus1: item.status === '一般风险',
-										itemLeftStatus2: item.status === '重大风险'
-									}"
-								>
+							<div class="box2-main-item" v-for="(item, index) in warningList" :key="index">
+								<div class="item-left" :class="{
+									itemLeftStatus1: item.status === '一般风险',
+									itemLeftStatus2: item.status === '重大风险'
+								}">
 									{{ item.status }}
 								</div>
 								<div class="item-right">
@@ -249,24 +234,16 @@
 					<div class="center-footer">
 						<div class="home-main-footer-header">
 							<div class="btn-box">
-								<div
-									class="btn"
-									:class="{ btnActive: activeCate === cate }"
-									v-for="(cate, index) in categoryList"
-									:key="index"
-									@click="handleClickCate(cate)"
-								>
+								<div class="btn" :class="{ btnActive: activeCate === cate }" v-for="(cate, index) in categoryList"
+									:key="index" @click="handleClickCate(cate)">
 									{{ cate }}
 								</div>
 							</div>
 							<div class="select-box">
-								<el-select v-model="releaseTime" placeholder="2022" style="width: 120px">
-									<el-option
-										v-for="item in releaseTimeList"
-										:key="item.value"
-										:label="item.label"
-										:value="item.value"
-									/>
+								<el-select v-model="releaseTime" placeholder="2022" style="width: 120px"
+									@change="handleGetOverallRanking">
+									<el-option v-for="item in releaseTimeList" :key="item.value" :label="item.label"
+										:value="item.value" />
 								</el-select>
 							</div>
 						</div>
@@ -279,44 +256,37 @@
 							</div>
 							<div class="title">{{ "创新主体综合排名" }}</div>
 						</div>
-						<el-table
-							:data="innoItemList"
-							class="sanction-table"
-							stripe
-							empty-text="暂无数据"
-							header-row-class-name="table-header"
-							row-class-name="table-row"
-						>
-							<el-table-column prop="rank" label="排名" width="80"> </el-table-column>
-							<el-table-column prop="name" label="机构名称" width="200"> </el-table-column>
+						<el-table :data="innoItemList.datalist" class="sanction-table" stripe empty-text="暂无数据"
+							header-row-class-name="table-header" row-class-name="table-row">
+							<el-table-column :prop="item.columnName" :label="item.columnLabel"
+								v-for="item in innoItemList.headerlist"><template #default="scope">
+									{{ scope.row.columnValues[item.columnName] }}
+								</template> </el-table-column>
+							<!-- <el-table-column prop="name" label="机构名称" width="200"> </el-table-column>
 							<el-table-column label="类型" width="200">
 								<template #default="scope">
 									<div style="display: flex; align-items: center; gap: 5px">
-										<div
-											v-for="tag in scope.row.type"
-											:key="tag"
-											:class="{
-												tag1: tag === '研究型大学',
-												tag2: tag === '国家实验室',
-												tag3: tag === '科技企业',
-												tag4: tag === '国防承包商'
-											}"
-										>
+										<div v-for="tag in scopetype" :key="tag" :class="{
+											tag1: tag === '研究型大学',
+											tag2: tag === '国家实验室',
+											tag3: tag === '科技企业',
+											tag4: tag === '国防承包商'
+										}">
 											{{ tag }}
 										</div>
 									</div>
 								</template>
-							</el-table-column>
-							<el-table-column prop="research" label="研发投入指数" width="200"> </el-table-column>
-							<el-table-column prop="people" label="人员投入指数" width="200"> </el-table-column>
-							<el-table-column prop="patent" label="专利产出指数" width="200"> </el-table-column>
-							<el-table-column prop="paper" label="论文产出指数" width="200"> </el-table-column>
-							<el-table-column prop="score" label="综合得分" width="150"> </el-table-column>
-							<el-table-column prop="trend" label="趋势" width="100">
-								<template #default="scope">
+</el-table-column>
+<el-table-column prop="research" label="研发投入指数" width="200"> </el-table-column>
+<el-table-column prop="people" label="人员投入指数" width="200"> </el-table-column>
+<el-table-column prop="patent" label="专利产出指数" width="200"> </el-table-column>
+<el-table-column prop="paper" label="论文产出指数" width="200"> </el-table-column>
+<el-table-column prop="score" label="综合得分" width="150"> </el-table-column>
+<el-table-column prop="trend" label="趋势" width="100">
+	<template #default="scope">
 									<div :class="{ up: scope.row.trend === 'up', down: scope.row.trend === 'down' }"></div>
 								</template>
-							</el-table-column>
+</el-table-column> -->
 						</el-table>
 						<div class="center-footer-elx-footer">
 							<img src="./assets/images/ai.png" alt="" />
@@ -325,34 +295,25 @@
 							</div>
 							<img src="./assets/images/icon-right.png" alt="" />
 						</div>
-						
+
 					</div>
 				</div>
 				<div v-if="activeCate === '研究布局'">
 					<div class="center-footer">
 						<div class="home-main-footer-header">
 							<div class="btn-box">
-								<div
-									class="btn"
-									:class="{ btnActive: activeCate === cate }"
-									v-for="(cate, index) in categoryList"
-									:key="index"
-									@click="handleClickCate(cate)"
-								>
+								<div class="btn" :class="{ btnActive: activeCate === cate }" v-for="(cate, index) in categoryList"
+									:key="index" @click="handleClickCate(cate)">
 									{{ cate }}
 								</div>
 							</div>
 							<div class="select-box">
 								<el-select v-model="releaseTime" placeholder="2022" style="width: 120px">
-									<el-option
-										v-for="item in releaseTimeList"
-										:key="item.value"
-										:label="item.label"
-										:value="item.value"
-									/>
+									<el-option v-for="item in releaseTimeList" :key="item.value" :label="item.label"
+										:value="item.value" />
 								</el-select>
-							</div>							
-						</div>				
+							</div>
+						</div>
 					</div>
 					<div class="center-footer-layout">
 						<div class="content-header">
@@ -363,19 +324,23 @@
 						</div>
 						<div class="center-footer-layout-content">
 							<div class="center-footer-layout-content-item">
-								<EChart :option="pieOption" autoresize :style="{ height: '370px',width:'750px' }" />
+								<EChart :option="pieOption" autoresize :style="{ height: '370px', width: '750px' }" />
 								<div class="center-footer-elx-footer">
 									<img src="./assets/images/ai.png" alt="" />
-									<div class="center-footer-elx-footer-text">人工智能与信息技术占据最大份额，反映了数字经济的核心地位;生物医学与健康是第二大研发领域，特别是在疫情后投入显著增加;能源与环境技术和先进制造与材料作为基础支撑领域保持稳定投入;国家安全与国防和航空航天作为战略领域保持专项投入。</div>
+									<div class="center-footer-elx-footer-text">
+										人工智能与信息技术占据最大份额，反映了数字经济的核心地位;生物医学与健康是第二大研发领域，特别是在疫情后投入显著增加;能源与环境技术和先进制造与材料作为基础支撑领域保持稳定投入;国家安全与国防和航空航天作为战略领域保持专项投入。
+									</div>
 									<img src="./assets/images/icon-right.png" alt="" />
 								</div>
 							</div>
 							<div style="width: 1px;height: 432px;background: rgba(234, 236, 238, 1);"></div>
 							<div class="center-footer-layout-content-item">
-								<EChart :option="raderOption" autoresize :style="{ height: '370px',width:'750px' }" />
+								<EChart :option="raderOption" autoresize :style="{ height: '370px', width: '750px' }" />
 								<div class="center-footer-elx-footer">
 									<img src="./assets/images/ai.png" alt="" />
-									<div class="center-footer-elx-footer-text">研究型大学在基础科学领域(生物医学、材料科学)占据主导地位；科技企业高度集中于人工智能和信息技术领域；国家实验室在能源技术和国家安全相关领域有显著优势；国防承包商的研究高度集中于航空航天和国家安全领域。</div>
+									<div class="center-footer-elx-footer-text">
+										研究型大学在基础科学领域(生物医学、材料科学)占据主导地位；科技企业高度集中于人工智能和信息技术领域；国家实验室在能源技术和国家安全相关领域有显著优势；国防承包商的研究高度集中于航空航天和国家安全领域。
+									</div>
 									<img src="./assets/images/icon-right.png" alt="" />
 								</div>
 							</div>
@@ -387,14 +352,9 @@
 				<DivideHeader id="position4" class="divide4" :titleText="'资源库'"></DivideHeader>
 				<div class="home-main-footer-header">
 					<div class="btn-box">
-						<div
-							class="btn"
-							:class="{ btnActive: activeCate1 === cate }"
-							v-for="(cate, index) in categoryList1"
-							:key="index"
-							@click="handleClickCate1(cate)"
-						>
-							{{ cate }}
+						<div class="btn" :class="{ btnActive: activeCate1 === cate.id }" v-for="(cate, index) in categoryList1"
+							:key="index" @click="handleClickCate1(cate.id)">
+							{{ cate.typeName }}
 						</div>
 					</div>
 					<div class="select-box">
@@ -404,40 +364,30 @@
 					</div>
 				</div>
 				<div class="home-main-footer-main">
-
-					<div class="footer-main-item" v-for="item in universityList" :key="item.name" @click="handleClickToDetail">
-						<img :src="item.pic" style="height: 32px; width: 32px;" />
-						<div class="item-text">{{ item.name }}</div>
-						<div class="item-text2">{{ item.adder }}</div>
-						<div class="item-text2">{{ item.area }}</div>
-						<div class="taglist">
-							<div
-								class="tag1"
-								style="width: 82px"
-								v-for="(val, idx) in item.tag"
-								:key="idx"
-								:class="{
-									tag2: val === '新能源',
-									tag3: val === '集成电路',
+					<div style="    width: 1600px;">
+						<div class="footer-main-item" v-for="item in universityList" :key="item.name" @click="handleClickToDetail">
+							<img :src="item.logoUrl" style="height: 32px; width: 32px;" />
+							<div class="item-text">{{ item.orgName }}</div>
+							<div class="item-text2">{{ item.address }}</div>
+							<div class="item-text2">{{ item.businessScope }}</div>
+							<div class="taglist">
+								<div class="tag1" v-for="(val, idx) in item.taglist" :key="idx" :class="{
+									tag2: val === '人工智能',
+									tag3: val === '新一代通信技术',
 									tag4: val === '生物科技',
 									tag5: val === '量子科技'
-								}"
-							>
-								{{ val }}
+								}">
+									{{ val }}
+								</div>
 							</div>
 						</div>
+
 					</div>
 
 					<div class="footer-box">
 						<div class="footer-right">
-							<el-pagination
-								@current-change="handleCurrentChange"
-								:pageSize="12"
-								:current-page="currentPage"
-								background
-								layout="prev, pager, next"
-								:total="100"
-							/>
+							<el-pagination @current-change="handleCurrentChange" :pageSize="12" :current-page="currentPage" background
+								layout="prev, pager, next" :total="total" />
 						</div>
 					</div>
 				</div>
@@ -457,8 +407,14 @@ import getBarChart from "./utils/barChart";
 import getPieChart from "./utils/piechart";
 import getCalendarHeatChart from "./utils/cleandarHeat";
 import EChart from "@/components/Chart/index.vue";
-import {pieOption, raderOption} from "./utils/charts";
-
+import { pieOption, raderOption } from "./utils/charts";
+import {
+	getCountGeography,
+	getCountSubjectType,
+	getSubjectTypeList,
+	findListBySubjectTypeId,
+	getOverallRanking
+} from "@/api/innovationSubject/overview.js";
 import setChart from "@/utils/setChart";
 
 import News1 from "./assets/images/news1.png";
@@ -481,12 +437,15 @@ const handleBackHome = () => {
 const containerRef = ref(null);
 const { isShow } = useContainerScroll(containerRef);
 const currentPage = ref(1);
-const pageSize = ref(10);
+const total = ref(0)
+const pageSize = ref(16);
 // 处理页码改变事件
 const handleCurrentChange = page => {
 	currentPage.value = page;
+	handleFindListBySubjectTypeId()
 };
 
+
 // 地理分布
 const distributionList = ref([
 	{
@@ -514,35 +473,87 @@ const distributionList = ref([
 		textcolor: "rgba(114, 46, 209, 1)"
 	}
 ]);
-
-const zhouList = ref([
-	{
-		index: 1,
-		name: "马萨诸塞州",
-		num: "85"
-	},
+const distributionColorList = ref([
 	{
-		index: 2,
-		name: "加利福尼亚州",
-		num: "67"
+
+		color: "rgba(231, 243, 255, 1)",
+		textcolor: "rgba(22, 119, 255, 1)"
 	},
 	{
-		index: 3,
-		name: "佐治亚州",
-		num: "49"
+		color: "rgba(255, 247, 230, 1)",
+		textcolor: "rgba(255, 169, 64, 1)"
 	},
 	{
-		index: 4,
-		name: "华盛顿州",
-		num: "31"
+		color: "rgba(230, 255, 251, 1)",
+		textcolor: "rgba(19, 168, 168, 1)"
 	},
 	{
-		index: 5,
-		name: "伊利诺伊州",
-		num: "29"
+		color: "rgba(249, 240, 255, 1)",
+		textcolor: "rgba(114, 46, 209, 1)"
+	}
+])
+//统计不同创新主体类型对应的主体数量
+const handleGetCountSubjectType = async () => {
+	try {
+		const res = await getCountSubjectType();
+		console.log("统计不同创新主体类型对应的主体数量", res);
+		if (res.code === 200 && res.data) {
+			distributionList.value = res.data
+			let data = []
+			res.data.map((item, index) => {
+				data.push({
+					name: item.countName,
+					num: item.countNum,
+					color: distributionColorList.value[index].color,
+					textcolor: distributionColorList.value[index].textcolor,
+				})
+			})
+			distributionList.value = data
+		}
+	} catch (error) {
+		console.error("获取统计不同创新主体类型对应的主体数量error", error);
 	}
+};
+const zhouList = ref([
+	// {
+	// 	index: 1,
+	// 	name: "马萨诸塞州",
+	// 	num: "85"
+	// },
+	// {
+	// 	index: 2,
+	// 	name: "加利福尼亚州",
+	// 	num: "67"
+	// },
+	// {
+	// 	index: 3,
+	// 	name: "佐治亚州",
+	// 	num: "49"
+	// },
+	// {
+	// 	index: 4,
+	// 	name: "华盛顿州",
+	// 	num: "31"
+	// },
+	// {
+	// 	index: 5,
+	// 	name: "伊利诺伊州",
+	// 	num: "29"
+	// }
 ]);
 
+//统计不同地理对应的主体数量
+const handleGetCountGeography = async () => {
+	try {
+		const res = await getCountGeography();
+		console.log("统计不同地理对应的主体数量", res);
+		if (res.code === 200 && res.data) {
+			zhouList.value = res.data
+		}
+	} catch (error) {
+		console.error("获取统计不同地理对应的主体数量error", error);
+	}
+};
 // 点击查看详情
 const handleClickToDetail = () => {
 	const route = router.resolve("/InnovativeInstitutions");
@@ -686,151 +697,171 @@ const chart1Data = ref([
 ]);
 const colorList = ["#69B1FF", "#FFC069", "#87E8DE", "#85A5FF", "#FF7875", "#B37FEB"];
 
-const innoItemList = [
-	{
-		rank: "1",
-		name: "麻省理工学院（MIT）",
-		type: ["研究型大学"],
-		research: "64",
-		people: "72",
-		patent: "87",
-		paper: "22",
-		score: "92",
-		trend: "up"
-	},
-	{
-		rank: "2",
-		name: "麻省理工学院",
-		type: ["国家实验室"],
-		research: "66",
-		people: "60",
-		patent: "68",
-		paper: "69",
-		score: "85",
-		trend: "up"
-	},
-	{
-		rank: "3",
-		name: "斯坦福大学",
-		type: ["科技企业"],
-		research: "76",
-		people: "11",
-		patent: "93",
-		paper: "51",
-		score: "81",
-		trend: "up"
-	},
-	{
-		rank: "4",
-		name: "谷歌（Alphabet）",
-		type: ["科技企业"],
-		research: "07",
-		people: "02",
-		patent: "21",
-		paper: "04",
-		score: "76",
-		trend: "down"
-	},
-	{
-		rank: "5",
-		name: "耶鲁大学",
-		type: ["国防承包商"],
-		research: "12",
-		people: "04",
-		patent: "63",
-		paper: "38",
-		score: "71",
-		trend: "down"
-	}
-];
+const innoItemList = ref({})
+// [
+// 	{
+// 		rank: "1",
+// 		name: "麻省理工学院（MIT）",
+// 		type: ["研究型大学"],
+// 		research: "64",
+// 		people: "72",
+// 		patent: "87",
+// 		paper: "22",
+// 		score: "92",
+// 		trend: "up"
+// 	},
+// 	{
+// 		rank: "2",
+// 		name: "麻省理工学院",
+// 		type: ["国家实验室"],
+// 		research: "66",
+// 		people: "60",
+// 		patent: "68",
+// 		paper: "69",
+// 		score: "85",
+// 		trend: "up"
+// 	},
+// 	{
+// 		rank: "3",
+// 		name: "斯坦福大学",
+// 		type: ["科技企业"],
+// 		research: "76",
+// 		people: "11",
+// 		patent: "93",
+// 		paper: "51",
+// 		score: "81",
+// 		trend: "up"
+// 	},
+// 	{
+// 		rank: "4",
+// 		name: "谷歌（Alphabet）",
+// 		type: ["科技企业"],
+// 		research: "07",
+// 		people: "02",
+// 		patent: "21",
+// 		paper: "04",
+// 		score: "76",
+// 		trend: "down"
+// 	},
+// 	{
+// 		rank: "5",
+// 		name: "耶鲁大学",
+// 		type: ["国防承包商"],
+// 		research: "12",
+// 		people: "04",
+// 		patent: "63",
+// 		paper: "38",
+// 		score: "71",
+// 		trend: "down"
+// 	}
+// ];
+//综合排名
+const handleGetOverallRanking = async () => {
+	try {
+		let params = {
+			subjectTypeId: activeCate1.value,
+			// arealist:
+			year: releaseTime.value,
 
-// 资源库
-const universityList = ref([
-	{
-		pic: "src/views/innovationSubject/assets/images/u1.png",
-		name: "哈佛大学",
-		adder: "美国 · 马萨诸塞州",
-		area: "医学、法学、经济学、生物化学、公共卫生、自然科学等多个学科",
-		tag: ["人工智能"]
-	},
-	{
-		pic: "src/views/innovationSubject/assets/images/u10.png",
-		name: "斯坦福大学",
-		adder: "美国 · 加利福尼亚州",
-		area: "计算机科学、电子工程、生物医学工程、经济学、环境科学等学科",
-		tag: ["人工智能", "生物科技"]
-	},
-	{
-		pic: "src/views/innovationSubject/assets/images/u3.png",
-		name: "麻省理工学院",
-		adder: "美国 · 加利福尼亚州",
-		area: "工程、计算机、物理、数学、航空航天",
-		tag: ["人工智能"]
-	},
-	{
-		pic: "src/views/innovationSubject/assets/images/u4.png",
-		name: "普林斯顿大学",
-		adder: "美国 · 加利福尼亚州",
-		area: "数学、物理、政治学、经济学、哲学",
-		tag: ["人工智能"]
-	},
-	{
-		pic: "src/views/innovationSubject/assets/images/u5.png",
-		name: "加州理工学院",
-		adder: "美国 · 加利福尼亚州",
-		area: "物理、化学、天文、地球科学、工程",
-		tag: ["量子科技"]
-	},
-	{
-		pic: "src/views/innovationSubject/assets/images/u6.png",
-		name: "哥伦比亚大学 ",
-		adder: "美国 · 科罗拉多州",
-		area: "法学、商学、新闻、经济学、国际关系",
-		tag: ["新能源"]
-	},
-	{
-		pic: "src/views/innovationSubject/assets/images/u7.png",
-		name: "芝加哥大学",
-		adder: "美国 · 加利福尼亚州",
-		area: "经济学、社会学、物理、哲学、统计学",
-		tag: ["人工智能", "集成电路"]
-	},
-	{
-		pic: "src/views/innovationSubject/assets/images/u8.png",
-		name: "耶鲁大学",
-		adder: "美国 · 宾夕法尼亚州",
-		area: "法学、 医学、 戏剧、 政治学、 历史 ",
-		tag: ["新能源"]
-	},
-	{
-		pic: "src/views/innovationSubject/assets/images/u9.png",
-		name: "康奈尔大学",
-		adder: "美国 · 新墨西哥州",
-		area: "农业与生命科学、工程、酒店管理、兽医学",
-		tag: ["生物科技", "量子科技"]
-	},
-	{
-		pic: "src/views/innovationSubject/assets/images/u10.png",
-		name: "加州大学伯克利分校",
-		adder: "美国 · 加利福尼亚州",
-		area: "计算机科学、化学、物理学、经济学、环境科学、工程学等学科",
-		tag: ["人工智能", "集成电路"]
-	},
-	{
-		pic: "src/views/innovationSubject/assets/images/u11.png",
-		name: "宾夕法尼亚大学",
-		adder: "美国 · 马萨诸塞州",
-		area: "商学、法学、 医学、 工程、 传播学 ",
-		tag: ["人工智能", "生物科技"]
-	},
-	{
-		pic: "src/views/innovationSubject/assets/images/u12.png",
-		name: "华盛顿大学",
-		adder: "美国 · 新墨西哥州",
-		area: "医学、生命科学、计算机、公共卫生、工程",
-		tag: ["生物科技", "量子科技"]
+		}
+		const res = await getOverallRanking(params);
+		console.log("综合排名", res);
+		if (res.code === 200 && res.data) {
+			innoItemList.value = res.data
+		}
+	} catch (error) {
+		console.error("获取综合排名error", error);
 	}
-]);
+};
+// 资源库
+const universityList = ref({})
+// 	[
+// 	{
+// 		pic: "src/views/innovationSubject/assets/images/u1.png",
+// 		name: "哈佛大学",
+// 		adder: "美国 · 马萨诸塞州",
+// 		area: "医学、法学、经济学、生物化学、公共卫生、自然科学等多个学科",
+// 		tag: ["人工智能"]
+// 	},
+// 	{
+// 		pic: "src/views/innovationSubject/assets/images/u10.png",
+// 		name: "斯坦福大学",
+// 		adder: "美国 · 加利福尼亚州",
+// 		area: "计算机科学、电子工程、生物医学工程、经济学、环境科学等学科",
+// 		tag: ["人工智能", "生物科技"]
+// 	},
+// 	{
+// 		pic: "src/views/innovationSubject/assets/images/u3.png",
+// 		name: "麻省理工学院",
+// 		adder: "美国 · 加利福尼亚州",
+// 		area: "工程、计算机、物理、数学、航空航天",
+// 		tag: ["人工智能"]
+// 	},
+// 	{
+// 		pic: "src/views/innovationSubject/assets/images/u4.png",
+// 		name: "普林斯顿大学",
+// 		adder: "美国 · 加利福尼亚州",
+// 		area: "数学、物理、政治学、经济学、哲学",
+// 		tag: ["人工智能"]
+// 	},
+// 	{
+// 		pic: "src/views/innovationSubject/assets/images/u5.png",
+// 		name: "加州理工学院",
+// 		adder: "美国 · 加利福尼亚州",
+// 		area: "物理、化学、天文、地球科学、工程",
+// 		tag: ["量子科技"]
+// 	},
+// 	{
+// 		pic: "src/views/innovationSubject/assets/images/u6.png",
+// 		name: "哥伦比亚大学 ",
+// 		adder: "美国 · 科罗拉多州",
+// 		area: "法学、商学、新闻、经济学、国际关系",
+// 		tag: ["新能源"]
+// 	},
+// 	{
+// 		pic: "src/views/innovationSubject/assets/images/u7.png",
+// 		name: "芝加哥大学",
+// 		adder: "美国 · 加利福尼亚州",
+// 		area: "经济学、社会学、物理、哲学、统计学",
+// 		tag: ["人工智能", "集成电路"]
+// 	},
+// 	{
+// 		pic: "src/views/innovationSubject/assets/images/u8.png",
+// 		name: "耶鲁大学",
+// 		adder: "美国 · 宾夕法尼亚州",
+// 		area: "法学、 医学、 戏剧、 政治学、 历史 ",
+// 		tag: ["新能源"]
+// 	},
+// 	{
+// 		pic: "src/views/innovationSubject/assets/images/u9.png",
+// 		name: "康奈尔大学",
+// 		adder: "美国 · 新墨西哥州",
+// 		area: "农业与生命科学、工程、酒店管理、兽医学",
+// 		tag: ["生物科技", "量子科技"]
+// 	},
+// 	{
+// 		pic: "src/views/innovationSubject/assets/images/u10.png",
+// 		name: "加州大学伯克利分校",
+// 		adder: "美国 · 加利福尼亚州",
+// 		area: "计算机科学、化学、物理学、经济学、环境科学、工程学等学科",
+// 		tag: ["人工智能", "集成电路"]
+// 	},
+// 	{
+// 		pic: "src/views/innovationSubject/assets/images/u11.png",
+// 		name: "宾夕法尼亚大学",
+// 		adder: "美国 · 马萨诸塞州",
+// 		area: "商学、法学、 医学、 工程、 传播学 ",
+// 		tag: ["人工智能", "生物科技"]
+// 	},
+// 	{
+// 		pic: "src/views/innovationSubject/assets/images/u12.png",
+// 		name: "华盛顿大学",
+// 		adder: "美国 · 新墨西哥州",
+// 		area: "医学、生命科学、计算机、公共卫生、工程",
+// 		tag: ["生物科技", "量子科技"]
+// 	}
+// ]
+
 
 const releaseTime = ref("2022");
 const releaseTimeList = ref([
@@ -862,14 +893,51 @@ const areaList = ref([
 ]);
 
 const categoryList1 = ref(["研究型大学", "国家实验室", "科技企业", "国防承包商"]);
-const activeCate1 = ref("研究型大学");
+const activeCate1 = ref('');
 
+//类型列表
+const handleGetSubjectTypeList = async () => {
+	try {
+		const res = await getSubjectTypeList();
+		console.log("类型列表", res);
+		if (res.code === 200 && res.data) {
+			categoryList1.value = res.data
+
+			activeCate1.value = res.data[0].id
+		}
+	} catch (error) {
+		console.error("获取类型列表error", error);
+	}
+};
 const handleClickCate = cate => {
 	activeCate.value = cate;
+	handleGetOverallRanking()
 };
 
 const handleClickCate1 = cate => {
 	activeCate1.value = cate;
+	handleFindListBySubjectTypeId()
+};
+
+//资源库
+const handleFindListBySubjectTypeId = async () => {
+	try {
+		let params = {
+			subjectTypeId: activeCate1.value,
+			// arealist:
+			currentPage: currentPage.value,
+			pageSize: 16,
+
+		}
+		const res = await findListBySubjectTypeId(params);
+		console.log("资源库", res);
+		if (res.code === 200 && res.data) {
+			universityList.value = res.data.content
+			total.value = res.data.totalElements
+		}
+	} catch (error) {
+		console.error("获取资源库error", error);
+	}
 };
 
 const handleToPosi = id => {
@@ -891,7 +959,12 @@ const handleToPosi = id => {
 };
 
 onMounted(async () => {
+	await handleGetSubjectTypeList()
+	handleGetCountGeography()
+	handleGetCountSubjectType()
+	handleGetOverallRanking()
 
+	handleFindListBySubjectTypeId()
 	let chart1 = getPieChart(chart1Data.value, colorList);
 	setChart(chart1, "chart1");
 });
@@ -901,16 +974,19 @@ onMounted(async () => {
 :deep(.el-input__wrapper) {
 	box-shadow: none;
 }
+
 .home-wrapper {
 	width: 100%;
 	height: calc(100vh - 96px);
 	position: relative;
 	overflow-y: hidden;
+
 	.search-header {
 		width: 100%;
 		height: 144px;
 		background: #fff;
 		overflow: hidden;
+
 		.home-main-header-center {
 			margin-top: 20px;
 			margin-left: 200px;
@@ -923,9 +999,11 @@ onMounted(async () => {
 			padding: 1px;
 			position: relative;
 			border: 1px solid transparent;
+
 			&:hover {
 				border: 1px solid var(--color-main-active);
 			}
+
 			.search {
 				position: absolute;
 				right: -1px;
@@ -938,14 +1016,17 @@ onMounted(async () => {
 				justify-content: center;
 				align-items: center;
 				cursor: pointer;
+
 				.search-icon {
 					width: 18px;
 					height: 18px;
+
 					img {
 						width: 100%;
 						height: 100%;
 					}
 				}
+
 				.search-text {
 					margin-left: 8px;
 					height: 22px;
@@ -957,11 +1038,13 @@ onMounted(async () => {
 				}
 			}
 		}
+
 		.home-main-header-btn-box {
 			margin-top: 20px;
 			margin-left: 200px;
 			display: flex;
 			gap: 16px;
+
 			.btn {
 				display: flex;
 				align-items: center;
@@ -974,9 +1057,11 @@ onMounted(async () => {
 				background: #e7f3ff;
 				cursor: pointer;
 				position: relative;
+
 				&:hover {
 					background: #cae3fc;
 				}
+
 				.btn-text {
 					width: 80px;
 					color: var(--color-main-active);
@@ -987,12 +1072,14 @@ onMounted(async () => {
 					margin-left: 36px;
 					text-align: center;
 				}
+
 				.btn-icon {
 					position: absolute;
 					top: 16px;
 					right: 19px;
 					width: 6px;
 					height: 12px;
+
 					img {
 						width: 100%;
 						height: 100%;
@@ -1001,21 +1088,25 @@ onMounted(async () => {
 			}
 		}
 	}
+
 	.scrollHomeMain {
 		width: 100%;
 		height: calc(100% - 144px);
 		overflow-y: auto;
 	}
+
 	.home-main {
 		width: 100%;
 		height: 100%;
 		overflow-y: auto;
 		background: url("./assets/images/background.png");
 		background-size: 100% 100%;
+
 		.home-main-header {
 			display: flex;
 			flex-direction: column;
 			align-items: center;
+
 			.home-main-header-top {
 				width: 100%;
 				height: 64px;
@@ -1032,16 +1123,20 @@ onMounted(async () => {
 				box-sizing: border-box;
 				padding-left: 160px;
 				display: flex;
+
 				.header-item {
 					margin: 0 3px;
 				}
+
 				.back-item {
 					cursor: pointer;
+
 					&:hover {
 						color: #ccc;
 					}
 				}
 			}
+
 			.home-main-header-center {
 				margin-top: 48px;
 				width: 960px;
@@ -1053,9 +1148,11 @@ onMounted(async () => {
 				padding: 1px;
 				position: relative;
 				border: 1px solid transparent;
+
 				&:hover {
 					border: 1px solid var(--color-main-active);
 				}
+
 				.search {
 					position: absolute;
 					right: -1px;
@@ -1068,14 +1165,17 @@ onMounted(async () => {
 					justify-content: center;
 					align-items: center;
 					cursor: pointer;
+
 					.search-icon {
 						width: 18px;
 						height: 18px;
+
 						img {
 							width: 100%;
 							height: 100%;
 						}
 					}
+
 					.search-text {
 						margin-left: 8px;
 						height: 22px;
@@ -1087,6 +1187,7 @@ onMounted(async () => {
 					}
 				}
 			}
+
 			.home-main-header-footer {
 				margin-top: 38px;
 				width: 960px;
@@ -1095,9 +1196,11 @@ onMounted(async () => {
 				padding: 0 108px;
 				display: flex;
 				justify-content: space-between;
+
 				.home-main-header-footer-item {
 					padding: 0 10px;
 					text-align: center;
+
 					.item-top {
 						height: 22px;
 						color: rgba(20, 89, 187, 1);
@@ -1106,6 +1209,7 @@ onMounted(async () => {
 						font-weight: 700;
 						line-height: 22px;
 					}
+
 					.item-footer {
 						margin-top: 10px;
 						height: 30px;
@@ -1117,12 +1221,14 @@ onMounted(async () => {
 					}
 				}
 			}
+
 			.home-main-header-btn-box {
 				width: 688px;
 				margin: 0 auto;
 				margin-top: 39px;
 				display: flex;
 				justify-content: space-between;
+
 				.btn {
 					display: flex;
 					align-items: center;
@@ -1135,9 +1241,11 @@ onMounted(async () => {
 					background: #e7f3ff;
 					cursor: pointer;
 					position: relative;
+
 					&:hover {
 						background: #cae3fc;
 					}
+
 					.btn-text {
 						width: 80px;
 						color: var(--color-main-active);
@@ -1148,12 +1256,14 @@ onMounted(async () => {
 						margin-left: 36px;
 						text-align: center;
 					}
+
 					.btn-icon {
 						position: absolute;
 						top: 16px;
 						right: 19px;
 						width: 6px;
 						height: 12px;
+
 						img {
 							width: 100%;
 							height: 100%;
@@ -1161,12 +1271,14 @@ onMounted(async () => {
 					}
 				}
 			}
+
 			.home-main-header-item-box {
 				margin-top: 48px;
 				margin-bottom: 64px;
 				width: 1600px;
 				display: flex;
 				flex-wrap: wrap;
+
 				.item {
 					width: 254px;
 					height: 72px;
@@ -1180,20 +1292,24 @@ onMounted(async () => {
 					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;
 						margin-left: 24px;
 						margin-top: 12px;
+
 						img {
 							width: 100%;
 							height: 100%;
 						}
 					}
+
 					.item-right {
 						margin-left: 17px;
 						width: 140px;
@@ -1206,13 +1322,16 @@ onMounted(async () => {
 				}
 			}
 		}
+
 		.home-main-center {
 			margin-top: 34px;
+
 			.center-top {
 				height: 450px;
 				display: flex;
 				justify-content: center;
 				gap: 20px;
+
 				.box1 {
 					width: 1064px;
 					height: 460px;
@@ -1220,23 +1339,28 @@ onMounted(async () => {
 					background: #fff;
 					box-sizing: border-box;
 					position: relative;
+
 					.box1-header {
 						height: 48px;
 						border-bottom: 1px solid rgba(240, 242, 244, 1);
 						display: flex;
 						justify-content: space-between;
+
 						.box1-header-left {
 							display: flex;
 							margin-left: 18px;
+
 							.icon {
 								width: 20px;
 								height: 20px;
 								margin-top: 15px;
+
 								img {
 									width: 100%;
 									height: 100%;
 								}
 							}
+
 							.title {
 								width: 112px;
 								height: 48px;
@@ -1250,6 +1374,7 @@ onMounted(async () => {
 								text-align: center;
 							}
 						}
+
 						.box1-header-right {
 							margin-top: 16px;
 							height: 16px;
@@ -1262,6 +1387,7 @@ onMounted(async () => {
 							margin-right: 39px;
 						}
 					}
+
 					.box1-main {
 						display: flex;
 						margin-top: 33px;
@@ -1275,6 +1401,7 @@ onMounted(async () => {
 							height: 353px;
 							flex-direction: column;
 							gap: 20px;
+
 							.box1-main-left-top {
 								/* 容器 546 */
 								width: 456px;
@@ -1285,6 +1412,7 @@ onMounted(async () => {
 								justify-content: flex-start;
 								align-items: flex-start;
 								gap: 8px;
+
 								.box1-main-left-top-item {
 									display: flex;
 									align-items: center;
@@ -1295,6 +1423,7 @@ onMounted(async () => {
 									border-radius: 4px;
 									background: rgba(231, 243, 255, 1);
 									color: rgba(22, 119, 255, 1);
+
 									.box1-main-left-top-item-text1 {
 										font-family: Microsoft YaHei;
 										font-size: 16px;
@@ -1303,6 +1432,7 @@ onMounted(async () => {
 										letter-spacing: 0px;
 										text-align: center;
 									}
+
 									.box1-main-left-top-item-text2 {
 										font-family: Microsoft YaHei;
 										font-size: 24px;
@@ -1313,15 +1443,18 @@ onMounted(async () => {
 									}
 								}
 							}
+
 							.box1-main-left-down {
 								display: flex;
 								flex-direction: column;
 								width: 456px;
+
 								.box1-main-left-down-item {
 									height: 48px;
 									display: flex;
 									align-items: center;
 									justify-content: space-between;
+
 									.box1-main-left-down-item-index {
 										margin-left: 42px;
 										width: 24px;
@@ -1336,6 +1469,7 @@ onMounted(async () => {
 										letter-spacing: 0px;
 										text-align: center;
 									}
+
 									.box1-main-left-down-item-text {
 										color: rgba(59, 65, 75, 1);
 										font-family: Microsoft YaHei;
@@ -1345,6 +1479,7 @@ onMounted(async () => {
 										letter-spacing: 0px;
 										text-align: justify;
 									}
+
 									.box1-main-left-down-item-num {
 										margin-right: 42px;
 										color: rgba(5, 95, 194, 1);
@@ -1358,37 +1493,44 @@ onMounted(async () => {
 								}
 							}
 						}
+
 						.box1-main-right {
 							margin-left: 10px;
 							flex: 1;
 						}
 					}
 				}
+
 				.box2 {
 					width: 520px;
 					height: 460px;
 					box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
 					background: rgba(255, 255, 255, 1);
 					position: relative;
+
 					.box2-header {
 						height: 54px;
 						display: flex;
 						border-bottom: 1px solid rgba(240, 242, 244, 1);
+
 						.icon {
 							width: 24px;
 							height: 22px;
 							margin-left: 33px;
 							margin-top: 18px;
+
 							img {
 								width: 100%;
 								height: 100%;
 							}
 						}
+
 						.title {
 							display: flex;
 							width: 148px;
 							background: rgba(206, 79, 81, 1);
 							margin-left: 25px;
+
 							.text {
 								margin-left: 15px;
 								margin-top: 16px;
@@ -1399,6 +1541,7 @@ onMounted(async () => {
 								font-weight: 700;
 								line-height: 22px;
 							}
+
 							.num {
 								width: 24px;
 								height: 20px;
@@ -1413,6 +1556,7 @@ onMounted(async () => {
 								background: rgba(255, 255, 255, 0.3);
 							}
 						}
+
 						.more {
 							margin-top: 19px;
 							margin-left: 200px;
@@ -1424,28 +1568,34 @@ onMounted(async () => {
 							cursor: pointer;
 						}
 					}
+
 					.box2-main {
 						box-sizing: border-box;
 						padding-right: 20px;
 						height: 330px;
 						overflow-y: auto;
+
 						.box2-main-item {
 							margin-left: 23px;
 							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;
 							}
+
 							.itemLeftStatus2 {
 								color: rgba(250, 140, 22, 1) !important;
 								background: rgba(255, 247, 230, 1) !important;
 							}
+
 							.item-left {
 								margin-top: 4px;
 								margin-left: 2px;
@@ -1462,12 +1612,14 @@ onMounted(async () => {
 								padding: 6px 4px;
 								text-align: center;
 							}
+
 							.item-right {
 								margin-left: 13px;
 								width: 408px;
 								height: 47px;
 								border-bottom: 1px solid rgba(240, 242, 244, 1);
 								display: flex;
+
 								.text {
 									width: 348px;
 									color: rgba(59, 65, 75, 1);
@@ -1476,6 +1628,7 @@ onMounted(async () => {
 									font-weight: 400;
 									line-height: 47px;
 								}
+
 								.time {
 									margin-left: 10px;
 									line-height: 47px;
@@ -1487,6 +1640,7 @@ onMounted(async () => {
 							}
 						}
 					}
+
 					.box2-footer {
 						position: absolute;
 						left: 45px;
@@ -1500,14 +1654,17 @@ onMounted(async () => {
 						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);
@@ -1519,23 +1676,27 @@ onMounted(async () => {
 					}
 				}
 			}
+
 			.divide2 {
 				width: 1600px;
 				margin: 0 auto;
 				margin-top: 68px;
 				margin-bottom: 36px;
 			}
+
 			.center-center {
 				width: 1600px;
 				margin: 0 auto;
 				margin-top: 21px;
 				height: 450px;
 				display: flex;
+
 				.box3 {
 					width: 792px;
 					height: 450px;
 					box-shadow: 0px 0px 15px 0px rgba(25, 69, 130, 0.2);
 					background: rgba(255, 255, 255, 1);
+
 					.box3-header {
 						height: 48px;
 						border-bottom: 1px solid rgba(240, 242, 244, 1);
@@ -1544,17 +1705,21 @@ onMounted(async () => {
 						justify-content: space-between;
 						padding: 0 20px;
 						position: relative;
+
 						.box3-header-left {
 							display: flex;
+
 							.box3-header-icon {
 								margin-top: 16px;
 								width: 19px;
 								height: 19px;
+
 								img {
 									width: 100%;
 									height: 100%;
 								}
 							}
+
 							.box3-header-title {
 								margin-top: 13px;
 								margin-left: 19px;
@@ -1566,6 +1731,7 @@ onMounted(async () => {
 								line-height: 22px;
 							}
 						}
+
 						.more {
 							width: 49px;
 							height: 24px;
@@ -1580,33 +1746,40 @@ onMounted(async () => {
 							cursor: pointer;
 						}
 					}
+
 					.box3-main {
 						height: 402px;
 						overflow-y: auto;
 						overflow-x: hidden;
 						padding-top: 6px;
+
 						.box3-item {
 							display: flex;
 							height: 77px;
 							width: 749px;
 							margin-left: 21px;
 							border-bottom: 1px solid rgba(240, 242, 244, 1);
+
 							.left {
 								width: 72px;
 								height: 48px;
 								margin-top: 15px;
+
 								img {
 									width: 100%;
 									height: 100%;
 								}
 							}
+
 							.right {
 								width: 657px;
 								margin-left: 20px;
+
 								.right-top {
 									width: 657px;
 									display: flex;
 									justify-content: space-between;
+
 									.title {
 										margin-top: 13px;
 										width: 520px;
@@ -1620,6 +1793,7 @@ onMounted(async () => {
 										text-overflow: ellipsis;
 										white-space: nowrap;
 									}
+
 									.time {
 										flex: 1;
 										text-align: right;
@@ -1632,6 +1806,7 @@ onMounted(async () => {
 										line-height: 22px;
 									}
 								}
+
 								.right-footer {
 									width: 657px;
 									height: 24px;
@@ -1648,12 +1823,14 @@ onMounted(async () => {
 						}
 					}
 				}
+
 				.box4 {
 					margin-left: 20px;
 					width: 792px;
 					height: 450px;
 					box-shadow: 0px 0px 15px 0px rgba(25, 69, 130, 0.2);
 					background: rgba(255, 255, 255, 1);
+
 					.box4-header {
 						width: 792px;
 						height: 48px;
@@ -1662,15 +1839,18 @@ onMounted(async () => {
 						box-sizing: border-box;
 						padding-left: 22px;
 						position: relative;
+
 						.header-icon {
 							margin-top: 15px;
 							width: 20px;
 							height: 20px;
+
 							img {
 								width: 100%;
 								height: 100%;
 							}
 						}
+
 						.header-title {
 							margin-top: 12px;
 							margin-left: 18px;
@@ -1681,6 +1861,7 @@ onMounted(async () => {
 							font-weight: 700;
 							line-height: 22px;
 						}
+
 						.more {
 							width: 49px;
 							height: 24px;
@@ -1695,24 +1876,29 @@ onMounted(async () => {
 							cursor: pointer;
 						}
 					}
+
 					.box4-main {
 						height: 402px;
 						overflow-y: auto;
 						box-sizing: border-box;
 						padding-top: 8px;
+
 						.box4-main-item {
 							margin-top: 16px;
 							display: flex;
 							margin-left: 21px;
+
 							.left {
 								margin-top: 5px;
 								width: 36px;
 								height: 36px;
+
 								img {
 									width: 100%;
 									height: 100%;
 								}
 							}
+
 							.right {
 								margin-left: 10px;
 								width: 690px;
@@ -1720,9 +1906,11 @@ onMounted(async () => {
 								border: 1px solid rgba(231, 243, 255, 1);
 								background: rgba(246, 250, 255, 1);
 								padding: 10px 15px;
+
 								.right-top {
 									display: flex;
 									justify-content: space-between;
+
 									.name {
 										height: 24px;
 										color: rgba(59, 65, 75, 1);
@@ -1731,6 +1919,7 @@ onMounted(async () => {
 										font-weight: 700;
 										line-height: 24px;
 									}
+
 									.time {
 										height: 30px;
 										color: rgba(95, 101, 108, 1);
@@ -1740,6 +1929,7 @@ onMounted(async () => {
 										line-height: 30px;
 									}
 								}
+
 								.content {
 									color: rgba(59, 65, 75, 1);
 									font-family: Microsoft YaHei;
@@ -1759,17 +1949,21 @@ onMounted(async () => {
 				margin-top: 68px;
 				margin-bottom: 36px;
 			}
+
 			.center-footer {
 				display: flex;
 				justify-content: center;
+
 				.home-main-footer-header {
 					width: 1600px;
 					height: 42px;
 					display: flex;
 					justify-content: space-between;
+
 					.btn-box {
 						width: 1000px;
 						display: flex;
+
 						.btn {
 							height: 42px;
 							color: rgba(95, 101, 108, 1);
@@ -1782,21 +1976,25 @@ onMounted(async () => {
 							background: rgba(20, 89, 187, 0);
 							margin-right: 20px;
 							cursor: pointer;
+
 							&:hover {
 								background: rgba(20, 89, 187, 0.1);
 							}
 						}
+
 						.btnActive {
 							padding: 0 24px;
 							border-radius: 21px;
 							background: rgba(20, 89, 187, 1);
 							color: #fff;
+
 							&:hover {
 								color: #fff;
 								background: rgba(20, 89, 187, 1);
 							}
 						}
 					}
+
 					.select-box {
 						margin-top: 10px;
 						height: 42px;
@@ -1805,6 +2003,7 @@ onMounted(async () => {
 					}
 				}
 			}
+
 			.center-footer-elx {
 				width: 1600px;
 				height: 528px;
@@ -1813,20 +2012,24 @@ onMounted(async () => {
 				margin: 30px auto;
 				box-sizing: border-box;
 				border-radius: 10px;
+
 				.content-header {
 					height: 48px;
 					display: flex;
 					border-bottom: 1px solid rgba(234, 236, 238, 1);
+
 					.icon {
 						width: 20px;
 						height: 20px;
 						margin-top: 14px;
 						margin-left: 19px;
+
 						img {
 							width: 100%;
 							height: 100%;
 						}
 					}
+
 					.title {
 						height: 48px;
 						margin-left: 21px;
@@ -1837,22 +2040,26 @@ onMounted(async () => {
 						line-height: 48px;
 					}
 				}
+
 				.sanction-table {
 					margin-top: 16px;
 					margin-left: 20px;
 					margin-right: 20px;
 					width: 1552px;
+
 					.up {
 						width: 32px;
 						height: 32px;
 						background-image: url("src/views/innovationSubject/assets/images/icon-up.png");
 					}
+
 					.down {
 						width: 32px;
 						height: 32px;
 						background-image: url("src/views/innovationSubject/assets/images/icon-down.png");
 					}
 				}
+
 				.center-footer-elx-footer {
 					margin: 16px;
 					width: 1568px;
@@ -1868,6 +2075,7 @@ onMounted(async () => {
 					border: 1px solid rgba(231, 243, 255, 1);
 					border-radius: 4px;
 					background: rgba(246, 250, 255, 1);
+
 					.center-footer-elx-footer-text {
 						color: rgba(5, 95, 194, 1);
 						font-family: Microsoft YaHei;
@@ -1881,6 +2089,7 @@ onMounted(async () => {
 					}
 				}
 			}
+
 			.center-footer-layout {
 				width: 1600px;
 				height: 528px;
@@ -1889,20 +2098,24 @@ onMounted(async () => {
 				margin: 30px auto;
 				box-sizing: border-box;
 				border-radius: 10px;
+
 				.content-header {
 					height: 48px;
 					display: flex;
 					border-bottom: 1px solid rgba(234, 236, 238, 1);
+
 					.icon {
 						width: 20px;
 						height: 20px;
 						margin-top: 14px;
 						margin-left: 19px;
+
 						img {
 							width: 100%;
 							height: 100%;
 						}
 					}
+
 					.title {
 						height: 48px;
 						margin-left: 21px;
@@ -1913,17 +2126,20 @@ onMounted(async () => {
 						line-height: 48px;
 					}
 				}
+
 				.center-footer-layout-content {
 					display: flex;
 					flex-direction: row;
-					.center-footer-layout-content-item{
+
+					.center-footer-layout-content-item {
 						height: 480px;
 						width: 800px;
 						display: flex;
 						flex-direction: column;
 						margin-left: 24px;
-						.center-footer-elx-footer{
-							
+
+						.center-footer-elx-footer {
+
 							width: 750px;
 							height: 88px;
 							/* 自动布局 */
@@ -1937,7 +2153,8 @@ onMounted(async () => {
 							border: 1px solid rgba(231, 243, 255, 1);
 							border-radius: 4px;
 							background: rgba(246, 250, 255, 1);
-							.center-footer-elx-footer-text{
+
+							.center-footer-elx-footer-text {
 								color: rgba(5, 95, 194, 1);
 								font-family: Microsoft YaHei;
 								font-size: 16px;
@@ -1953,16 +2170,19 @@ onMounted(async () => {
 				}
 			}
 		}
+
 		.home-main-footer {
 			margin-top: 34px;
 			height: 910px;
 			background: rgba(248, 249, 250, 1);
 			overflow: hidden;
+
 			.divide4 {
 				margin: 0 auto;
 				margin-top: 52px;
 				margin-bottom: 36px;
 			}
+
 			.home-main-footer-header {
 				width: 1600px;
 				height: 42px;
@@ -1970,10 +2190,12 @@ onMounted(async () => {
 				// background: orange;
 				display: flex;
 				justify-content: space-between;
+
 				.btn-box {
 					margin-top: 10px;
 					width: 1000px;
 					display: flex;
+
 					.btn {
 						height: 42px;
 						color: rgba(95, 101, 108, 1);
@@ -1986,21 +2208,25 @@ onMounted(async () => {
 						background: rgba(20, 89, 187, 0);
 						margin-right: 20px;
 						cursor: pointer;
+
 						&:hover {
 							background: rgba(20, 89, 187, 0.1);
 						}
 					}
+
 					.btnActive {
 						padding: 0 24px;
 						border-radius: 21px;
 						background: rgba(20, 89, 187, 1);
 						color: #fff;
+
 						&:hover {
 							color: #fff;
 							background: rgba(20, 89, 187, 1);
 						}
 					}
 				}
+
 				.select-box {
 					margin-top: 10px;
 					height: 42px;
@@ -2008,12 +2234,14 @@ onMounted(async () => {
 					padding: 5px 0;
 				}
 			}
+
 			.home-main-footer-main {
 				width: 1600px;
 				display: flex;
 				flex-wrap: wrap;
 				margin: 0 auto;
 				gap: 16px;
+
 				.footer-main-item {
 					width: 253px;
 					height: 216px;
@@ -2028,7 +2256,8 @@ onMounted(async () => {
 					display: flex;
 					flex-direction: column;
 					cursor: pointer;
-					.item-text{
+
+					.item-text {
 						color: rgba(59, 65, 75, 1);
 						font-family: Microsoft YaHei;
 						font-size: 18px;
@@ -2037,6 +2266,7 @@ onMounted(async () => {
 						letter-spacing: 0px;
 						text-align: left;
 					}
+
 					.item-text2 {
 						color: rgba(95, 101, 108, 1);
 						font-family: Microsoft YaHei;
@@ -2046,18 +2276,21 @@ onMounted(async () => {
 						letter-spacing: 0px;
 						text-align: justify;
 					}
+
 					.taglist {
 						display: flex;
 						flex-direction: row;
 						gap: 8px;
 					}
 				}
+
 				.footer-box {
 					margin: 0 auto;
 					height: 32px;
 					margin-top: 30px;
 					display: flex;
 					justify-content: center;
+
 					.footer-left {
 						color: rgba(59, 65, 75, 1);
 						font-family: Microsoft YaHei;
@@ -2189,6 +2422,7 @@ onMounted(async () => {
 	box-shadow: none;
 	border-radius: 10px;
 }
+
 :deep(.el-input__wrapper:hover) {
 	box-shadow: none !important;
 }
@@ -2203,6 +2437,7 @@ onMounted(async () => {
 
 	color: rgba(59, 65, 75, 1);
 }
+
 :deep(.table-row) {
 	height: 64px;
 }

src/views/thinkTank/ReportDetail/index.vue

@@ -3,7 +3,7 @@
 		<div class="header">
 			<div class="header-top">
 				<div class="header-top-left">
-					<img :src="thinkInfo.contentUrl" alt="" />
+					<img :src="thinkInfo.imageUrl" alt="" />
 					<div>
 						<div class="title">{{ thinkInfo.name }}</div>
 						<div class="en-title">

src/views/thinkTank/ReportDetail/reportAnalysis/index.vue

@@ -88,13 +88,13 @@
 									{{ val }}
 								</div>
 							</div>
-							<div class="more">
+							<!-- <div class="more">
 								<img src="@/assets/icons/open.png" alt="" />
-							</div>
+							</div> -->
 						</div>
 					</div>
 					<div class="box3-main-footer">
-						<div class="info">共{{ total }}条建议</div>
+						<div class="info">共{{ total }}项</div>
 						<div class="page-box">
 							<el-pagination :page-size="12" background layout="prev, pager, next" :total="total"
 								@current-change="handleCurrentChange" :current-page="currentPage" />

src/views/thinkTank/ThinkTankDetail/PolicyTracking/index.vue

@@ -73,14 +73,26 @@
 						<img src="./images/search-icon.png" alt="" />
 					</div>
 				</div>
+
 				<div class="select-box">
 					<el-select v-model="selectedYear" placeholder="选择时间" style="width: 120px" @click="handleGetThinkPolicy()">
 						<el-option v-for="item in yearList" :key="item.value" :label="item.label" :value="item.value" />
 					</el-select>
-					<el-select v-model="sort" placeholder="发布时间" style="width: 120px; margin-left: 8px">
+					<div class="paixu-btn" @click="handleSwithSort()">
+						<div class="icon1">
+							<img v-if="sort" src="@/assets/icons/shengxu1.png" alt="" />
+							<img v-else src="@/assets/icons/jiangxu1.png" alt="" />
+						</div>
+						<div class="text">{{ "发布时间" }}</div>
+						<div class="icon2">
+							<img v-if="sort" src="@/assets/icons/shengxu2.png" alt="" />
+							<img v-else src="@/assets/icons/jiangxu2.png" alt="" />
+						</div>
+					</div>
+					<!-- <el-select v-model="sort" placeholder="发布时间" style="width: 120px; margin-left: 8px">
 						<el-option @click="handleGetThinkPolicy()" :key="true" label="正序" :value="true" />
 						<el-option @click="handleGetThinkPolicy()" :key="false" label="倒序" :value="false" />
-					</el-select>
+					</el-select> -->
 				</div>
 			</div>
 			<div class="bottom-main">
@@ -145,7 +157,7 @@
 						</div>
 					</div>
 					<div class="right-footer">
-						<div class="info">共{{ total }}篇政策建议</div>
+						<div class="info">共{{ total }}项</div>
 						<div class="page-box">
 							<el-pagination :page-size="12" background layout="prev, pager, next" :total="total"
 								@current-change="handleCurrentChange" :current-page="currentPage" />
@@ -547,7 +559,12 @@ const toDetaile = (id) => {
 }
 
 const total = ref(0);
-const sort = ref(true);
+const sort = ref(false);
+const handleSwithSort = () => {
+	sort.value = !sort.value;
+	handleGetThinkPolicy()()
+};
+
 const currentPage = ref(1);
 // 处理页码改变事件
 const handleCurrentChange = page => {
@@ -738,6 +755,59 @@ onMounted(() => {
 					right: 33px;
 					width: 100px;
 					height: 28px;
+
+					.paixu-btn {
+						display: flex;
+						width: 120px;
+						height: 32px;
+						box-sizing: border-box;
+						border: 1px solid rgba(230, 231, 232, 1);
+						border-radius: 4px;
+						background: rgba(255, 255, 255, 1);
+
+						&:hover {
+							background: var(--color-bg-hover);
+						}
+
+						cursor: pointer;
+
+						.icon1 {
+							width: 11px;
+							height: 14px;
+							margin-top: 10px;
+							margin-left: 9px;
+
+							img {
+								width: 100%;
+								height: 100%;
+							}
+						}
+
+						.text {
+							height: 19px;
+							color: rgba(95, 101, 108, 1);
+							font-family: Microsoft YaHei;
+							font-size: 14px;
+							font-weight: 400;
+							line-height: 18px;
+							letter-spacing: 0px;
+							text-align: left;
+							margin-top: 7px;
+							margin-left: 9px;
+						}
+
+						.icon2 {
+							width: 10px;
+							height: 5px;
+							margin-top: 5px;
+							margin-left: 13px;
+
+							img {
+								width: 100%;
+								height: 100%;
+							}
+						}
+					}
 				}
 			}
 		}
@@ -775,6 +845,60 @@ onMounted(() => {
 
 			.select-box {
 				margin-right: 5px;
+				display: flex;
+
+				.paixu-btn {
+					display: flex;
+					width: 120px;
+					height: 32px;
+					box-sizing: border-box;
+					border: 1px solid rgba(230, 231, 232, 1);
+					border-radius: 4px;
+					background: rgba(255, 255, 255, 1);
+
+					&:hover {
+						background: var(--color-bg-hover);
+					}
+
+					cursor: pointer;
+
+					.icon1 {
+						width: 11px;
+						height: 14px;
+						margin-top: 10px;
+						margin-left: 9px;
+
+						img {
+							width: 100%;
+							height: 100%;
+						}
+					}
+
+					.text {
+						height: 19px;
+						color: rgba(95, 101, 108, 1);
+						font-family: Microsoft YaHei;
+						font-size: 14px;
+						font-weight: 400;
+						line-height: 18px;
+						letter-spacing: 0px;
+						text-align: left;
+						margin-top: 7px;
+						margin-left: 9px;
+					}
+
+					.icon2 {
+						width: 10px;
+						height: 5px;
+						margin-top: 5px;
+						margin-left: 13px;
+
+						img {
+							width: 100%;
+							height: 100%;
+						}
+					}
+				}
 			}
 		}
 
@@ -794,37 +918,57 @@ onMounted(() => {
 				.select-box {
 					margin-top: 21px;
 
-					.select-box-header {
+					.paixu-btn {
 						display: flex;
-						gap: 17px;
+						width: 120px;
+						height: 32px;
+						box-sizing: border-box;
+						border: 1px solid rgba(230, 231, 232, 1);
+						border-radius: 4px;
+						background: rgba(255, 255, 255, 1);
 
-						.icon {
-							margin-top: 4px;
-							width: 8px;
-							height: 16px;
-							background: var(--color-main-active);
-							border-radius: 0 4px 4px 0;
+						&:hover {
+							background: var(--color-bg-hover);
+						}
+
+						cursor: pointer;
+
+						.icon1 {
+							width: 11px;
+							height: 14px;
+							margin-top: 10px;
+							margin-left: 9px;
+
+							img {
+								width: 100%;
+								height: 100%;
+							}
 						}
 
-						.title {
-							height: 26px;
-							color: var(--color-main-active);
+						.text {
+							height: 19px;
+							color: rgba(95, 101, 108, 1);
 							font-family: Microsoft YaHei;
-							font-size: 20px;
-							font-weight: 700;
-							line-height: 26px;
-							letter-spacing: 1px;
+							font-size: 14px;
+							font-weight: 400;
+							line-height: 18px;
+							letter-spacing: 0px;
 							text-align: left;
+							margin-top: 7px;
+							margin-left: 9px;
 						}
-					}
 
-					.select-main {
-						margin-left: 25px;
-						width: 160px;
-					}
+						.icon2 {
+							width: 10px;
+							height: 5px;
+							margin-top: 5px;
+							margin-left: 13px;
 
-					.select-main1 {
-						width: 100px;
+							img {
+								width: 100%;
+								height: 100%;
+							}
+						}
 					}
 				}
 			}

src/views/thinkTank/index.vue

@@ -10,7 +10,7 @@
 					<div class="header-item">科技智库</div>
 				</div>
 				<div class="home-main-header-center">
-					<el-input v-model="searchThinktankText" style="width: 838px; height: 100%" placeholder="搜索科技人物及观点" />
+					<el-input v-model="searchThinktankText" style="width: 838px; height: 100%" placeholder="搜索智库报告" />
 					<div class="search">
 						<div class="search-icon">
 							<img src="./assets/images/search-icon.png" alt="" />
@@ -78,12 +78,12 @@
 							<div class="title-right">{{ item.country }}</div>
 						</div>
 
-						<el-popover effect="dark" :content="item.desc" placement="top-start">
+						<!-- <el-popover effect="dark" :content="item.desc" placement="top-start">
 							<template #reference>
 								<div class="content">{{ item.desc }}</div>
 							</template>
-						</el-popover>
-
+</el-popover> -->
+						<div class="content">{{ item.desc }}</div>
 						<div class="tag-box">
 							<div class="tag" :class="{
 								tag1: val.status === 1,
@@ -177,14 +177,16 @@
 									{{ item.status || "一般风险" }}
 								</div>
 								<div class="item-right">
-									<el-popover effect="dark" :width="500" :content="item.title" placement="top-start">
+									<!-- <el-popover effect="dark" :width="500" :content="item.title" placement="top-start">
 										<template #reference>
 											<div class="text">
 												{{ item.title }}
 											</div>
 										</template>
-									</el-popover>
-
+									</el-popover> -->
+									<div class="text">
+										{{ item.title }}
+									</div>
 									<div class="time">{{ item.time }}</div>
 								</div>
 							</div>
@@ -220,11 +222,12 @@
 										<div class="time">{{ news.newsOrg }}</div>
 									</div>
 
-									<el-popover effect="dark" :width="700" :content="news.newsContent" placement="top-start">
+									<!-- <el-popover effect="dark" :width="700" :content="news.newsContent" placement="top-start">
 										<template #reference>
 											<div class="right-footer">{{ news.newsContent }}</div>
 										</template>
-									</el-popover>
+									</el-popover> -->
+									<div class="right-footer">{{ news.newsContent }}</div>
 								</div>
 							</div>
 						</div>
@@ -350,6 +353,8 @@
 
 			<div class="home-main-footer">
 				<DivideHeader id="position4" class="divide-header" :titleText="'资源库'"></DivideHeader>
+
+
 				<div class="home-main-footer-header">
 					<div class="btn-box">
 						<div class="btn" :class="{ btnActive: activeCate === cate }" v-for="(cate, index) in categoryList"
@@ -357,10 +362,23 @@
 							{{ cate }}
 						</div>
 					</div>
-					<el-select v-model="sort" placeholder="发布时间" style="width: 120px; margin-left: 8px">
+					<div class="select-box">
+						<div class="paixu-btn" @click="handleSwithSort()">
+							<div class="icon1">
+								<img v-if="sort" src="@/assets/icons/shengxu1.png" alt="" />
+								<img v-else src="@/assets/icons/jiangxu1.png" alt="" />
+							</div>
+							<div class="text">{{ "发布时间" }}</div>
+							<div class="icon2">
+								<img v-if="sort" src="@/assets/icons/shengxu2.png" alt="" />
+								<img v-else src="@/assets/icons/jiangxu2.png" alt="" />
+							</div>
+						</div>
+					</div>
+					<!-- <el-select v-model="sort" placeholder="发布时间" style="width: 120px; margin-left: 8px">
 						<el-option @click="handleGetetThinkTankReport()" :key="true" label="正序" :value="true" />
 						<el-option @click="handleGetetThinkTankReport()" :key="false" label="倒序" :value="false" />
-					</el-select>
+					</el-select> -->
 				</div>
 				<div class="home-main-footer-main">
 					<div class="left">
@@ -411,14 +429,16 @@
 								<div class="footer-card-top">
 									<img :src="item.imageUrl" alt="" />
 								</div>
-								<el-popover effect="dark" :content="item.name" placement="top-start">
+								<!-- <el-popover effect="dark" :content="item.name" placement="top-start">
 									<template #reference>
 										<div class="footer-card-title">
 											{{ item.name }}
 										</div>
 									</template>
-								</el-popover>
-
+								</el-popover> -->
+								<div class="footer-card-title">
+									{{ item.name }}
+								</div>
 								<div class="footer-card-footer">
 									<div class="time">{{ item.times }}</div>
 									<div class="from">{{ item.thinkTankName }}</div>
@@ -1283,6 +1303,11 @@ const selectedPubTimeList = ref([""]);
 const checkAllTime = ref(false);
 const isIndeterminateTime = ref(true);
 const sort = ref(false);
+const handleSwithSort = () => {
+	sort.value = !sort.value;
+	handleGetetThinkTankReport()()
+};
+
 const handleCheckAllChangeTime = val => {
 	// console.log(val, "handleCheckAllChange");
 	if (val) {
@@ -2808,6 +2833,7 @@ onMounted(async () => {
 					}
 
 					.box6-main {
+						margin: 15px;
 						height: 360px;
 					}
 				}
@@ -3034,6 +3060,8 @@ onMounted(async () => {
 			overflow: hidden;
 			background: rgba(247, 248, 249, 1);
 
+
+
 			.home-main-footer-header {
 				width: 1600px;
 				height: 42px;
@@ -3081,6 +3109,59 @@ onMounted(async () => {
 					height: 42px;
 					box-sizing: border-box;
 					padding: 5px 0;
+
+					.paixu-btn {
+						display: flex;
+						width: 120px;
+						height: 32px;
+						box-sizing: border-box;
+						border: 1px solid rgba(230, 231, 232, 1);
+						border-radius: 4px;
+						background: rgba(255, 255, 255, 1);
+
+						&:hover {
+							background: var(--color-bg-hover);
+						}
+
+						cursor: pointer;
+
+						.icon1 {
+							width: 11px;
+							height: 14px;
+							margin-top: 10px;
+							margin-left: 9px;
+
+							img {
+								width: 100%;
+								height: 100%;
+							}
+						}
+
+						.text {
+							height: 19px;
+							color: rgba(95, 101, 108, 1);
+							font-family: Microsoft YaHei;
+							font-size: 14px;
+							font-weight: 400;
+							line-height: 18px;
+							letter-spacing: 0px;
+							text-align: left;
+							margin-top: 7px;
+							margin-left: 9px;
+						}
+
+						.icon2 {
+							width: 10px;
+							height: 5px;
+							margin-top: 5px;
+							margin-left: 13px;
+
+							img {
+								width: 100%;
+								height: 100%;
+							}
+						}
+					}
 				}
 			}
 

src/views/thinkTank/utils/piechart.js

@@ -2,23 +2,30 @@ const getPieChart = (data) => {
   let option = {
     series: [
       {
-      type: 'pie',
-      radius: [70, 100],
-      height: '100%',
-      left: 'center',
-      width: '100%',
-      itemStyle: {
-        borderColor: '#fff',
-        borderWidth: 1
-      },
-      label: {
-        alignTo: 'edge',
-        formatter: '{name|{b}}\n{time|{c} 条 {d}%}',
-        minMargin: 5,
-        edgeDistance: 10,
-        lineHeight: 24,
-        rich: {
-         name: {
+        type: 'pie',
+        // grid: {
+        //   top: '15%',
+        //   right: '15%',
+        //   bottom: '5%',
+        //   left: '15%',
+        //   containLabel: true
+        // },
+        radius: [70, 100],
+        height: '100%',
+        left: 'center',
+        width: '100%',
+        itemStyle: {
+          borderColor: '#fff',
+          borderWidth: 1
+        },
+        label: {
+          alignTo: 'edge',
+          formatter: '{name|{b}}\n{time|{c} 条 {d}%}',
+          minMargin: 5,
+          edgeDistance: 10,
+          lineHeight: 24,
+          rich: {
+            name: {
               fontSize: 16,
               color: 'rgba(59, 65, 75, 1)',
               fontFamily: 'Microsoft YaHei',
@@ -29,26 +36,26 @@ const getPieChart = (data) => {
               color: 'rgba(95, 101, 108, 1)',
               fontFamily: 'Microsoft YaHei',
             }
-        }
-      },
-      labelLine: {
-        length: 15,
-        length2: 0,
-        maxSurfaceAngle: 80
-      },
-      labelLayout: function (params) {
-        const isLeft = params.labelRect.x < 556 / 2;
-        const points = params.labelLinePoints;
-        // Update the end point.
-        points[2][0] = isLeft
-          ? params.labelRect.x
-          : params.labelRect.x + params.labelRect.width;
-        return {
-          labelLinePoints: points
-        };
-      },
-      data: data
-    }]
+          }
+        },
+        labelLine: {
+          length: 15,
+          length2: 0,
+          maxSurfaceAngle: 80
+        },
+        labelLayout: function (params) {
+          const isLeft = params.labelRect.x < 556 / 2;
+          const points = params.labelLinePoints;
+          // Update the end point.
+          points[2][0] = isLeft
+            ? params.labelRect.x
+            : params.labelRect.x + params.labelRect.width;
+          return {
+            labelLinePoints: points
+          };
+        },
+        data: data
+      }]
   }
   return option
 }