update

src/App.vue

@@ -522,7 +522,7 @@ body {
 			z-index: 999999;
 			width: 713px;
 			height: 413px;
-			top: 65px;
+			top: 64px;
 			left: 140px;
 			box-sizing: border-box;
 			border: 1px solid rgba(255, 255, 255, 1);

src/views/ZMOverView/components/fourSuppress/components/addDomain/index.vue

@@ -132,7 +132,7 @@
 					<template v-if="rankType === 'institution'">
 						<div v-for="(item, index) in rankList" :key="index" class="rank-item">
 							<div class="rank-num" :class="'rank-' + (index + 1)">{{ index + 1 }}</div>
-							<img :src="defaultImg" alt="" class="rank-icon" />
+							<img :src="item.orgPicture ? item.orgPicture : defaultImg" alt="" class="rank-icon" />
 							<div class="rank-name" :title="item.name">{{ item.name }}</div>
 							<div class="rank-progress-container">
 								<div class="rank-progress-bar" :style="{ width: getProgressWidth(item.count) }"></div>
@@ -157,7 +157,7 @@
 							<div v-for="(item, index) in rankList" :key="index" class="table-row">
 								<div class="col-rank rank-num" :class="'rank-' + (index + 1)">{{ index + 1 }}</div>
 								<div class="col-name flex-align">
-									<img :src="defaultImg" class="rank-icon" />
+									<img :src="item.orgPicture ? item.orgPicture : defaultImg" class="rank-icon" />
 									<span class="text-ellipsis" :title="item.name">{{ item.name }}</span>
 								</div>
 								<div class="col-domain">
@@ -258,6 +258,12 @@
 					</svg>
 				</div>
 			</div>
+			<div class="left-btn" @click="handleLeft">
+				<img src="@/assets/icons/card-btn-left.png" alt="">
+			</div>
+			<div class="right-btn" @click="handleRight">
+				<img src="@/assets/icons/card-btn-right.png" alt="">
+			</div>
 		</div>
 	</div>
 </template>
@@ -282,6 +288,7 @@ import {
 	getDomainContainmentTimeline
 } from "@/api/zmOverview/allDomains";
 import { getUSGovernmentLatestDynamic, getDepartmentList, getSanTypeList } from "@/api/allGovernment.js";
+import { ElMessage } from "element-plus";
 
 const router = useRouter();
 
@@ -452,6 +459,8 @@ const handleGetDomainContainmentTimeline = async () => {
 			// 处理返回的数据结构
 			const processedData = processTimelineData(res.data);
 			timelineList.value = processedData;
+			console.log('timelineList', timelineList.value);
+			
 		}
 	} catch (error) {
 		console.error("获取美对我领域打压遏制时间线失败:", error);
@@ -466,7 +475,10 @@ const rowHeight = 230;
 const startX = 250;
 const startY = 45;
 
+const timeLineActiveIndex = ref(0)
+
 const axisDates = computed(() => {
+
 	const dates = [];
 	if (timelineList.value.length > 0) {
 		dates.push({
@@ -486,11 +498,40 @@ const axisDates = computed(() => {
 			y: lastNode.y - 25
 		});
 	}
-	return dates;
+	return dates
 });
 
+
+
+const handleLeft = () => {
+	if(timeLineActiveIndex.value === 0) {
+		ElMessage.warning('当前已经是第一组数据！')
+	} else {
+		timeLineActiveIndex.value --
+	}
+}
+
+const handleRight = () => {
+	if(timeLineActiveIndex.value === (timelineList.value.length % 9 )) {
+		ElMessage.warning('当前已经是最后一组数据！')
+	} else {
+		timeLineActiveIndex.value ++
+	}
+	console.log('axisDates',axisDates.value);
+	console.log('timelineNodes',timelineNodes.value);
+	
+}
+
 const timelineNodes = computed(() => {
-	return timelineList.value.map((item, index) => {
+	// 计算起始索引：activeIndex * 9
+  const startIndex = timeLineActiveIndex.value * 9;
+  
+  // 计算结束索引：起始索引 + 9（因为slice的第二个参数是结束索引，不包含）
+  const endIndex = timeLineActiveIndex.value + 9;
+
+	const showTimeLineList = timelineList.value.slice(startIndex, endIndex);
+
+	return showTimeLineList.map((item, index) => {
 		const row = Math.floor(index / maxPerRow);
 		const col = index % maxPerRow;
 
@@ -517,7 +558,7 @@ const timelineNodes = computed(() => {
 			contentWidth: 320,
 			contentHeight: 180
 		};
-	});
+	})
 });
 
 const getColorName = tag => {
@@ -1251,7 +1292,7 @@ watch(activeDate, () => {
 .bottom-content {
 	display: flex;
 	gap: 17px;
-
+	background: rgba(255, 255, 255, 0.65);
 	.news-section {
 		width: 792px;
 		height: 700px;
@@ -1343,7 +1384,7 @@ watch(activeDate, () => {
 		.select-box {
 			width: 691px;
 			height: 32px;
-			margin: 17px auto 36px auto;
+			margin: 10px auto 5px auto;
 			display: flex;
 			justify-content: space-between;
 			align-items: center;
@@ -1398,12 +1439,12 @@ watch(activeDate, () => {
 		}
 		.main-box {
 			width: 100%;
-			height: 567px;
-			padding: 24px 51px 51px 27px;
+			height: 577px;
+			padding: 24px 30px 0px 27px;
 			box-sizing: border-box;
 			display: flex;
 			flex-direction: column;
-			gap: 21px;
+			gap: 28px;
 			overflow-y: auto;
 			.rank-item {
 				display: flex;
@@ -1664,7 +1705,7 @@ watch(activeDate, () => {
 
 	box-sizing: border-box;
 	border-bottom: 1px solid rgba(234, 236, 238, 1);
-	background: rgba(255, 255, 255, 0.65);
+	background: transparent;
 
 	.news-item-title {
 		display: flex;
@@ -1738,6 +1779,33 @@ watch(activeDate, () => {
 	border-radius: 10px;
 	background-color: rgba(255, 255, 255, 0.65);
 	box-shadow: 0 0 20px rgba(25, 69, 130, 0.1);
+	position: relative;
+
+	.left-btn{
+		position: absolute;
+		z-index: 9999;
+		left: 0;
+		top: 345px;
+		width: 24px;
+		height: 48px;
+		img{
+			width: 100%;
+			height: 100%;
+		}
+	}
+
+	.right-btn{
+		position: absolute;
+		z-index: 9999;
+		right: 0;
+		top: 345px;
+		width: 24px;
+		height: 48px;
+		img{
+			width: 100%;
+			height: 100%;
+		}
+	}
 
 	.bottom-item {
 		width: 100%;
@@ -1794,7 +1862,6 @@ watch(activeDate, () => {
 		width: 100%;
 		height: 652px;
 		position: relative;
-
 		.nav-btn {
 			position: absolute;
 			top: 50%;
@@ -1816,8 +1883,7 @@ watch(activeDate, () => {
 		.svg-container {
 			width: 100%;
 			height: 100%;
-			overflow-x: hidden;
-			overflow-y: auto;
+			overflow: hidden;
 			display: block;
 			padding: 0;
 			box-sizing: border-box;

src/views/ZMOverView/components/fourSuppress/components/allElement/index.vue

@@ -717,10 +717,10 @@ onUnmounted(() => {
 				.box1-main {
 					height: 836px;
 					overflow: hidden;
-					overflow-y: auto;
 					background: rgba(255, 255, 255, 0.65);
 					.box1-item {
 						width: 430px;
+						height: 167px;
 						padding: 12px 0;
 						box-sizing: border-box;
 						border-bottom: 1px solid rgba(234, 236, 238, 1);
@@ -747,7 +747,7 @@ onUnmounted(() => {
 							width: 388px;
 							margin-left: 12px;
 							.title {
-								// height: 30px;
+								height: 30px;
 								color: rgba(59, 65, 75, 1);
 								font-family: Microsoft YaHei;
 								font-style: Bold;
@@ -756,20 +756,29 @@ onUnmounted(() => {
 								line-height: 30px;
 								letter-spacing: 0px;
 								text-align: left;
+								overflow: hidden;
+								text-overflow: ellipsis;
+								white-space: nowrap;
 							}
 							.content {
+								height: 48px;
 								color: rgba(95, 101, 108, 1);
 								font-family: Microsoft YaHei;
 								font-style: Regular;
 								font-size: 16px;
 								font-weight: 400;
-								line-height: 30px;
+								line-height: 24px;
 								letter-spacing: 0px;
 								text-align: justify;
+								overflow: hidden;
+								text-overflow: ellipsis;
+								display: -webkit-box;
+								-webkit-box-orient: vertical;
+								-webkit-line-clamp: 2;
 							}
 							.tag-box {
 								margin-top: 4px;
-								// height: 28px;
+								height: 28px;
 								display: flex;
 								flex-wrap: wrap;
 								gap: 8px;
@@ -998,7 +1007,7 @@ onUnmounted(() => {
 								margin: 0 auto;
 								margin-top: 8px;
 								width: 283px;
-								max-height: 172px;
+								height: 150px;
 								color: rgba(59, 65, 75, 1);
 								font-family: Microsoft YaHei;
 								font-style: Regular;
@@ -1008,13 +1017,15 @@ onUnmounted(() => {
 								letter-spacing: 0px;
 								text-align: justify;
 								overflow: hidden;
-
-								// overflow-y: auto;
+								text-overflow: ellipsis;
+								display: -webkit-box;
+								-webkit-box-orient: vertical;
+								-webkit-line-clamp: 5;
 							}
 							.area-box {
 								width: 283px;
 								margin: 0 auto;
-								margin-top: 8px;
+								margin-top: 28px;
 								// height: 24px;
 								display: flex;
 								flex-wrap: wrap;
@@ -1245,7 +1256,7 @@ onUnmounted(() => {
 								margin: 0 auto;
 								margin-top: 8px;
 								width: 283px;
-								max-height: 172px;
+								height: 150px;
 								color: rgba(59, 65, 75, 1);
 								font-family: Microsoft YaHei;
 								font-style: Regular;
@@ -1255,12 +1266,15 @@ onUnmounted(() => {
 								letter-spacing: 0px;
 								text-align: justify;
 								overflow: hidden;
-								// overflow-y: auto;
+								text-overflow: ellipsis;
+								display: -webkit-box;
+								-webkit-box-orient: vertical;
+								-webkit-line-clamp: 5;
 							}
 							.area-box {
 								width: 283px;
 								margin: 0 auto;
-								margin-top: 8px;
+								margin-top: 28px;
 								// height: 24px;
 								display: flex;
 								flex-wrap: wrap;

src/views/ZMOverView/components/fourSuppress/components/allGovernment/index.vue

@@ -326,7 +326,7 @@ const getUSGovernmentSanctionHistoryData = async () => {
 				else if (item.status === 4) level = "white";
 
 				grouped[deptName].events.push({
-					date: item.postDate ? item.postDate.replace(/^(\d{4})-(\d{2})-(\d{2})$/, "$1年$2月$3日") : "",
+					date: item.endDate ? item.endDate.replace(/^(\d{4})-(\d{2})-(\d{2})$/, "$1年$2月$3日") : "",
 					content: item.name || item.summary,
 					tags: item.techDomainList ? item.techDomainList.slice(0, 2) : [],
 					level: level,

src/views/ZMOverView/components/fourSuppress/components/allUnion/index.vue

@@ -6,17 +6,17 @@
 			<img src="./assets/leftbtn.png" alt class="left-btn" @click="prev" :class="{ disabled: startIndex === 0 }" />
 			<div class="content">
 				<div class="carousel-container" :style="{ transform: `translateX(-${startIndex * (307 + 16)}px)` }">
-					<div class="carousel-item" v-for="item in carouselList">
+					<div class="carousel-item" v-for="item,index in carouselList" :key="index">
 						<div class="item-top">
 							<div class="top-img">
-								<img :src="ele" :class="{ img1: index !== 0 }" alt v-for="(ele, index) in item.imageList" />
+								<img :src="ele" :class="{ img1: index !== 0 }" alt v-for="(ele, idx) in item.imageList" :key="idx" />
 							</div>
 							<div class="top-num">{{ item.count }}次</div>
 						</div>
 						<div class="item-title">{{ item.name }}</div>
 
 						<div class="type">
-							<div class="type-item" :class="getTagClass(ele.industryName)" v-for="ele in item.industryList">
+							<div class="type-item" :class="getTagClass(ele.industryName)" v-for="ele, idxx in item.industryList" :key="idxx">
 								{{ ele.industryName }}
 							</div>
 						</div>
@@ -47,7 +47,8 @@
 
 			<div class="anti-content">
 				<div class="content-left">
-					<div class="item" v-for="item in countList">
+					<div class="count-box">
+						<div class="item" v-for="(item, index) in countList" :key="index">
 							<div class="item-left">
 								<img :src="item.image" alt />
 								<el-tooltip
@@ -63,6 +64,28 @@
 							<div class="item-right">{{ item.value }}个</div>
 						</div>
 					</div>
+					<div class="page-box">
+						<div class="left" @click="handleLeft">
+							<img src="./assets/left-icon.png" alt="" />
+						</div>
+						<div class="center">
+							{{ `${currentPage} / ${totalPage}` }}
+						</div>
+						<div class="right" @click="handleRight">
+							<img src="./assets/right-icon.png" alt="" />
+						</div>
+						<!-- <el-pagination
+							background
+							layout="prev, pager, next"
+							:total="countryTotalNum"
+							:page-size="pageSize"
+							:pager-count="2"
+							v-model:current-page="currentPage"
+							size="small"
+							@current-change="handleShowCountries"
+						/> -->
+					</div>
+				</div>
 
 				<div class="content-right" id="echartsMap"></div>
 			</div>
@@ -76,7 +99,7 @@
 					<span>排华联盟最新动态</span>
 				</div>
 				<div class="news-content">
-					<div class="item" v-for="item in newsList">
+					<div class="item" v-for="item,index in newsList" :key="index">
 						<div class="item-title">
 							<img :src="item.image || defaultImg" alt />
 							<span @click="handleClick(item)">{{ item.title }}</span>
@@ -92,7 +115,7 @@
 						</el-tooltip>
 						<div class="item-bottom">
 							<div class="bottom-left">
-								<div class="left-item" :class="getTagClass(ele.industryName)" v-for="ele in item.industryList">
+								<div class="left-item" :class="getTagClass(ele.industryName)" v-for="ele,idx in item.industryList" :key="idx">
 									<span>{{ ele.industryName }}</span>
 								</div>
 							</div>
@@ -107,7 +130,7 @@
 					<span>新增排华联盟预警</span>
 				</div>
 				<div class="warning-content">
-					<div class="content-item" v-for="item,index in warningList" :key="index">
+					<div class="content-item" v-for="(item, index) in warningList" :key="index">
 						<div class="item-title">
 							<div class="title-left">
 								<div class="img-list">
@@ -125,7 +148,12 @@
 							<div class="title-right">{{ item.statementList?.length }}次合作</div>
 						</div>
 						<div class="item-content">
-							<div class="content-list" v-for="ele,idx in item.statementList" :key="idx" @click="handleClick(ele)">
+							<div
+								class="content-list"
+								v-for="(ele, idx) in item.statementList"
+								:key="idx"
+								@click="handleClick(ele)"
+							>
 								<div class="list-left" :class="getTagClass(getName(ele.industryList))">
 									<span>{{ getName(ele.industryList) }}</span>
 								</div>
@@ -164,10 +192,44 @@ import router from "@/router";
 import * as echarts from "echarts";
 import { getAllUnionList, getDynamic, getPrediction, getUnionCount, getIndustry, getCountryRelation } from "@/api/allUnion.js";
 import defaultImg from "../../../../assets/images/default-icon2.png";
-import mapJson from './assets/world.json'
+import mapJson from "./assets/world.json";
+import { ElMessage } from "element-plus";
+
+const currentPage = ref(1);
+const pageSize = ref(10);
+const countryTotalNum = ref(0);
+const countryTotalList = ref([]);
+
+const totalPage = computed(() => {
+	return Math.ceil(countryTotalNum.value / 10);
+});
 
 const carouselList = ref([]);
-const countList = ref([]);
+const countList = computed(() => {
+	return countryTotalList.value.slice(
+		(currentPage.value - 1) * pageSize.value,
+		(currentPage.value - 1) * pageSize.value + pageSize.value
+	);
+});
+
+const handleLeft = () => {
+	if (currentPage.value === 1) {
+		ElMessage.warning("当前已经是第一页!");
+		return;
+	} else {
+		currentPage.value--;
+	}
+};
+
+const handleRight = () => {
+	if (currentPage.value === totalPage.value) {
+		ElMessage.warning("当前已经是最后一页!");
+		return;
+	} else {
+		currentPage.value++;
+	}
+};
+
 const startIndex = ref(0);
 const activeDate = inject("activeDate", ref("week"));
 
@@ -458,7 +520,7 @@ const nameMap = {
 	"Solomon Islands": "所罗门群岛",
 	"Sierra Leone": "塞拉利昂",
 	"El Salvador": "萨尔瓦多",
-	"Somaliland": "索马里兰",
+	Somaliland: "索马里兰",
 	Somalia: "索马里",
 	"Republic of Serbia": "塞尔维亚",
 	Suriname: "苏里南",
@@ -582,7 +644,7 @@ const getColorByValue = (value, maxValue) => {
  * @param {number} maxValue - 最大值
  * @returns {string} RGB 颜色字符串，如 "rgb(255, 0, 0)"
  */
- const getColorByValueRandom = (value, maxValue) => {
+const getColorByValueRandom = (value, maxValue) => {
 	const ratio = Math.min(Math.max(value / maxValue, 0), 1);
 
 	// HSL 参数：高饱和度，中等偏暗亮度，避免太亮或黑色
@@ -596,22 +658,36 @@ const getColorByValue = (value, maxValue) => {
 		s /= 100;
 		l /= 100;
 		const c = (1 - Math.abs(2 * l - 1)) * s;
-        const x = c * (1 - Math.abs((h / 60) % 2 - 1));
+		const x = c * (1 - Math.abs(((h / 60) % 2) - 1));
 		const m = l - c / 2;
-        let r = 0, g = 0, b = 0;
+		let r = 0,
+			g = 0,
+			b = 0;
 
 		if (0 <= h && h < 60) {
-            r = c; g = x; b = 0;
+			r = c;
+			g = x;
+			b = 0;
 		} else if (60 <= h && h < 120) {
-            r = x; g = c; b = 0;
+			r = x;
+			g = c;
+			b = 0;
 		} else if (120 <= h && h < 180) {
-            r = 0; g = c; b = x;
+			r = 0;
+			g = c;
+			b = x;
 		} else if (180 <= h && h < 240) {
-            r = 0; g = x; b = c;
+			r = 0;
+			g = x;
+			b = c;
 		} else if (240 <= h && h < 300) {
-            r = x; g = 0; b = c;
+			r = x;
+			g = 0;
+			b = c;
 		} else if (300 <= h && h < 360) {
-            r = c; g = 0; b = x;
+			r = c;
+			g = 0;
+			b = x;
 		}
 		// 移除 else 分支（修复后无需，h 已 %360）
 
@@ -623,17 +699,17 @@ const getColorByValue = (value, maxValue) => {
 	};
 
 	return hslToRgb(h, s, l);
-}
+};
 
 const chartDom = ref();
 const myChart = ref();
 function createChart() {
-	if (!countList.value) return;
+	if (!countryTotalList.value) return;
 	// 找到最大值用于颜色计算
-	const maxValue = Math.max(...countList.value.map(item => item.value));
+	const maxValue = Math.max(...countryTotalList.value.map(item => item.value));
 
 	// 为每个数据项计算颜色
-	const processedData = countList.value.map(item => {
+	const processedData = countryTotalList.value.map(item => {
 		const color = getColorByValueRandom(item.value, maxValue);
 		return {
 			...item,
@@ -734,7 +810,6 @@ function fetchGeoJSON() {
 	echarts.registerMap("world", mapJson);
 	createChart();
 	myChart.value.hideLoading();
-
 }
 
 const newsList = ref([]);
@@ -878,7 +953,9 @@ const initRightDonut = async () => {
 					y: Math.random() * 10,
 					// 节点颜色
 					itemStyle: {
-            color: `rgba(${Math.floor(Math.random() * 256)}, ${Math.floor(Math.random() * 256)}, ${Math.floor(Math.random() * 256)}, 1)`
+						color: `rgba(${Math.floor(Math.random() * 256)}, ${Math.floor(Math.random() * 256)}, ${Math.floor(
+							Math.random() * 256
+						)}, 1)`
 					}
 				};
 				let item1 = {
@@ -1038,6 +1115,9 @@ const getUnionList = async () => {
 		if (res && res.code === 200) {
 			console.log("----getUnionList", res.data);
 			carouselList.value = res.data;
+			carouselList.value.forEach(item => {
+				item.imageList = item.imageList.slice(0, 10);
+			});
 		}
 	} catch (error) {
 		console.error("获取联盟列表接口失败:", error);
@@ -1086,7 +1166,8 @@ const getUnionCountList = async () => {
 		if (res && res.code === 200) {
 			console.log("----getUnionCountList", res.data);
 			// 处理一下数据
-			countList.value = res.data
+
+			countryTotalList.value = res.data
 				.sort((a, b) => b.count - a.count)
 				.map(item => {
 					item.value = item.count;
@@ -1110,6 +1191,10 @@ const getUnionCountList = async () => {
 					item.name = mappedName || item.ename;
 					return item;
 				});
+
+			console.log("countryTotalList", countryTotalList.value);
+			countryTotalNum.value = countryTotalList.value.length;
+			console.log("countryTotalNum", countryTotalNum.value);
 		}
 	} catch (error) {
 		console.error("获取联盟动态接口失败:", error);
@@ -1403,17 +1488,22 @@ watch(activeDate, async () => {
 
 			.content-left {
 				width: 197px;
+
 				margin-left: 38px;
-				margin-top: 55px;
+				margin-top: 31px;
 				margin-bottom: 55px;
-				overflow-y: auto;
+				.count-box {
+					height: 520px;
 					display: flex;
 					flex-direction: column;
+					overflow: hidden;
+					gap: 12px;
+				}
 
 				.item {
 					/* 容器 493 */
 					width: 100%;
-					height: 38px;
+					height: 42px;
 					/* 自动布局 */
 					display: flex;
 					flex-direction: row;
@@ -1426,8 +1516,6 @@ watch(activeDate, async () => {
 					/* 业务系统/模态背景模糊 */
 					backdrop-filter: blur(30px);
 					background: rgba(255, 255, 255, 0.65);
-					margin-bottom: 16px;
-
 					.item-left {
 						display: flex;
 						align-items: center;
@@ -1465,6 +1553,47 @@ watch(activeDate, async () => {
 						text-align: left;
 					}
 				}
+
+				.page-box {
+					height: 24px;
+					margin-top: 24px;
+					display: flex;
+					justify-content: center;
+					gap: 8px;
+					.left {
+						width: 24px;
+						height: 24px;
+						border-radius: 4px;
+						overflow: hidden;
+						cursor: pointer;
+						img {
+							width: 100%;
+							height: 100%;
+						}
+					}
+					.center {
+						height: 24px;
+						color: var(--color-main-active);
+						font-family: Source Han Sans CN;
+						font-style: Regular;
+						font-size: 14px;
+						font-weight: 400;
+						line-height: 24px;
+						letter-spacing: 0px;
+						text-align: center;
+					}
+					.right {
+						width: 24px;
+						height: 24px;
+						border-radius: 4px;
+						overflow: hidden;
+						cursor: pointer;
+						img {
+							width: 100%;
+							height: 100%;
+						}
+					}
+				}
 			}
 
 			.content-right {
@@ -1745,7 +1874,7 @@ watch(activeDate, async () => {
 							align-items: center;
 							justify-content: space-around;
 							cursor: pointer;
-							&:hover{
+							&:hover {
 								background: var(--color-bg-hover);
 							}
 							.list-left {

src/views/ZMOverView/index.vue

@@ -81,7 +81,7 @@
 </template>
 
 <script setup>
-import { onMounted, ref, computed, provide } from "vue";
+import { onMounted, onUnmounted, ref, computed, provide } from "vue";
 import { useRouter } from "vue-router";
 import { ElMessage } from "element-plus";
 import background from "./assets/images/backgroundBT.png";
@@ -159,6 +159,8 @@ provide("activeDate", activeDate);
 const handleDateClick = type => {
 	activeDate.value = type;
 };
+
+
 </script>
 
 <style lang="scss" scoped>
@@ -295,12 +297,11 @@ const handleDateClick = type => {
 					cursor: pointer;
 					border-top-right-radius: 10px;
 					border-bottom-right-radius: 10px;
-					&:hover{
+					&:hover {
 						background: var(--color-bg-hover);
 						// span{
 						// color: var(--color-main-active);
 						// }
-
 					}
 
 					img {

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

@@ -21,7 +21,7 @@
 					<div class="box1-main-center" id="chart1"></div>
 					<div class="box1-main-footer">
 						<div class="box-footer-left">
-							<img src="../assets/icons/right-icon1.png" alt="" />
+							<img src="@/assets/icons/box-footer-left-icon.png" alt="" />
 						</div>
 						<div class="box-footer-center">
 							从立法耗时角度分析，大而美法案从提交到签署仅39天，远快于历史同类法案（通常需6个月以上），立法速度极快。
@@ -52,7 +52,7 @@
 					<div class="box2-main-center" id="chart2"></div>
 					<div class="box2-main-footer">
 						<div class="box-footer-left">
-							<img src="../assets/icons/right-icon1.png" alt="" />
+							<img src="@/assets/icons/box-footer-left-icon.png" alt="" />
 						</div>
 						<div class="box-footer-center">
 							法案本质是共和党与资本集团的深度联盟，共和党获超
@@ -403,7 +403,7 @@
 					</div>
 					<div class="box3-main-footer">
 						<div class="box-footer-left">
-							<img src="../assets/icons/right-icon1.png" alt="" />
+							<img src="@/assets/icons/box-footer-left-icon.png" alt="" />
 						</div>
 						<div class="box-footer-center">
 							法案以218:214​（众议院）和51:50​（副总统决胜票）微弱优势强行通过，暴露两党极端对立、党内倒戈频发的特点。
@@ -1219,6 +1219,7 @@ onMounted(async () => {
 										width: 130px;
 										display: flex;
 										justify-content: flex-end;
+										align-items: center;
 										.icon {
 											width: 16px;
 											height: 16px;
@@ -1254,6 +1255,9 @@ onMounted(async () => {
 										// border-right: 1px solid rgba(243, 243, 244, 1);
 										width: 215px;
 										.box1-right-top {
+											height: 20px;
+											box-sizing: border-box;
+											padding-top: 8px;
 											:deep(.el-progress-bar__inner) {
 												background: rgba(22, 119, 255, 1);
 												border-radius: 0;
@@ -1264,6 +1268,9 @@ onMounted(async () => {
 											}
 										}
 										.box1-right-bottom {
+																					height: 20px;
+											box-sizing: border-box;
+											padding-top: 8px;
 											:deep(.el-progress-bar__inner) {
 												background: rgba(255, 172, 77, 1);
 												border-radius: 0;

src/views/bill/introdoction/index.vue

@@ -899,7 +899,7 @@ onMounted(() => {
 						position: relative;
 						.usr-icon1 {
 							position: absolute;
-							bottom: 0px;
+							bottom: 0;
 							left: 18px;
 							width: 48px;
 							height: 48px;
@@ -1076,7 +1076,7 @@ onMounted(() => {
 					}
 					.usr-icon1 {
 						position: absolute;
-						// bottom: -15px;
+						bottom: -15px;
 						left: 55px;
 						width: 48px;
 						height: 48px;
@@ -1091,7 +1091,7 @@ onMounted(() => {
 					}
 					.usr-icon2 {
 						position: absolute;
-						// bottom: -15px;
+						bottom: -15px;
 						right: 55px;
 						width: 48px;
 						height: 48px;
@@ -1110,7 +1110,7 @@ onMounted(() => {
 					margin-top: 30px;
 
 					.info-right-title {
-						height: 22px;
+						// height: 22px;
 						color: var(--color-main-active);
 						font-family: Microsoft YaHei;
 						font-size: 20px;

src/views/bill/template/utils/piechart.js

@@ -17,17 +17,17 @@ const getPieChart = (data, colorList) => {
           formatter: '{name|{b}}\n{time|{c} 条 {d}%}',
           minMargin: 5,
           edgeDistance: 10,
-          lineHeight: 18,
+          lineHeight: 24,
           rich: {
             name: {
               color: 'rgba(59, 65, 75, 1)',
               fontFamily: 'Microsoft YaHei',
-              fontSize: 14,
+              fontSize: 16,
               fontWeight: 'bold',
               padding: [10, 0, 10, 0]
             },
             time: {
-              fontSize: 14,
+              fontSize: 16,
               fontFamily: 'Microsoft YaHei',
               color: '#rgba(95, 101, 108, 1)',
               padding: [10, 0, 10, 0]

src/views/thinkTank/reportOriginal/index.vue

@@ -108,16 +108,20 @@ onMounted(async () => {
 <style lang="scss" scoped>
 .wrap {
   width: 100%;
-  // height: 984px;
+  height: 100%;
+  overflow: hidden;
+  overflow-y: auto;
 
   .header {
     width: 100%;
-
     box-sizing: border-box;
     border-bottom: 1px solid rgba(234, 236, 238, 1);
     border-top: 1px solid rgba(234, 236, 238, 1);
     box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
     background: rgba(255, 255, 255, 1);
+    position: sticky;
+    top: 0;
+    z-index: 99;
 
     .header-top {
       margin-top: 20px;