合并分支 'lzl-dev' 到 'master'

src/api/bill.js

@@ -14,13 +14,13 @@ export function getBillInfo(params) {
 
 // 提出人-根据动议ID获取对应的提出人信息
 /**
- * @param {id} 
+ * @param {billId} 
  * @header token
  */
 export function getBillPerson(params) {
     return request({
         method: 'GET',
-        url: `/api/billInfoBean/person/${params.id}`,
+        url: `/api/billInfoBean/person/${params.billId}`,
         params,
     })
 }
@@ -63,6 +63,18 @@ export function getBillBackground(params) {
         params,
     })
 }
+// 相关事件-根据法案ID获取相关事件信息
+/**
+ * @param {id} 
+ * @header token
+ */
+export function getBillInfoEvent(params) {
+    return request({
+        method: 'GET',
+        url: `/api/billInfoBean/event/${params.id}`,
+        params,
+    })
+}
 
 // 议员相关性-根据法案ID获取议员分析信息（现在只包括名称 支持 反对，没有标签和事件动态）
 /**
@@ -92,20 +104,20 @@ export function getBillContentId(params) {
 
 // 主要条款-根据原文ID获取条款内容
 /**
- * @param {id,cRelated,currentPage,pageSize} 
+ * @param {billid,id,cRelated,currentPage,pageSize} 
  * @header token
  */
 export function getBillContentTk(params) {
     return request({
         method: 'GET',
-        url: `/api/billInfoBean/content/tk/${params.id}`,
+        url: `/api/billInfoBean/content/tk/${params.billid}/${params.id}`,
         params,
     })
 }
 
 // 限制方式-根据法案原文ID获取限制方式列表
 /**
- * @param {id} 
+ * @param {billId} 
  * @header token
  */
 export function getBillContentXzfs(params) {

src/api/bill/billHome.js

@@ -13,11 +13,11 @@ export function getBillIndustry(params) {
 }
 
 // 涉华法案统计
-export function getBillCount() {
+export function getBillCount(params) {
   return request({
     method: 'GET',
     url: `/api/BillOverview/billCount`,
-
+    params
   })
 }
 
@@ -64,4 +64,35 @@ export function getHylyList() {
         method: 'GET',
         url: `/api/billImpactAnalysis/industry/hylyList`,
     })
+}
+
+// 获取法案提出部门
+/**
+ * @param {year} 
+ */
+export function getBillPostOrg(params) {
+    return request({
+        method: 'GET',
+        url: `/api/BillOverview/billPostOrg/${params.year}`,
+    })
+}
+
+// 获取关键议员提案
+/**
+ * @param {year} 
+ */
+export function getMemberProposal(params) {
+    return request({
+        method: 'GET',
+        url: `/api/BillOverview/memberProposal/${params.year}`,
+    })
+}
+
+// 获取资源库
+export function getBills(params) {
+    return request({
+        method: 'GET',
+        url: `/api/BillOverview/bills`,
+        params
+    })
 }
\ No newline at end of file

src/api/deepdig.js

@@ -12,6 +12,18 @@ export function getBillTimeAnalyze(params) {
     })
 }
 
+// 修正案次数分析
+/**
+ * @param {id} 
+ */
+export function getBillAmeAnalyzeCount(params) {
+    return request({
+        method: 'GET',
+        url: `/api/billDeepDive/ameAnalyze/count/${params.id}`,
+        params,
+    })
+}
+
 // 根据法案ID获取党派政治献金
 /**
  * @param {id, personCongress} 

src/views/bill/background/index.vue

@@ -35,8 +35,8 @@
               v-for="(item, index) in backgroundList"
               :key="item.id"
             >
-              <div class="id">{{ index + 1 }}</div>
-              <div class="title">{{ item.bjnr }}</div>
+              <div class="id">{{ (currentPage - 1) * 10 + index + 1 }}</div>
+              <div class="title">{{ item.backgroundTitle }}</div>
               <div class="share">
                 <img src="./assets/icons/open.png" alt="打开" />
               </div>
@@ -45,7 +45,7 @@
           <div class="box1-main-footer">
             <div class="info">
               {{
-                `共有${backgroundList.length}条${
+                `共有${total}条${
                   box1BtnActive === 1 ? "涉华" : "全部"
                 }背景`
               }}
@@ -54,7 +54,9 @@
               <el-pagination
                 background
                 layout="prev, pager, next"
-                :total="backgroundList.length"
+                :total="total"
+                v-model:current-page="currentPage"
+                @current-change="handleGetBillBackground"
               />
             </div>
           </div>
@@ -80,7 +82,7 @@
             :key="index"
           >
             <div class="left">
-              <img :src="item.image" alt="" />
+              <img :src="item.imageUrl || item.image" alt="" />
             </div>
             <div class="center">
               <div class="title">{{ item.sjbt }}</div>
@@ -157,7 +159,7 @@
               /></el-icon>
             </div>
             <div class="right-box1-main-bottom">
-              <WordCloudMap :data="wordCloudData" :shape="circle" />
+              <WordCloudMap :data="wordCloudData" shape="circle" />
             </div>
           </div>
         </div>
@@ -214,25 +216,26 @@ import {
   getBillBackground,
   getBillEvent,
   getBillPersonAnalyze,
+  getBillInfoEvent
 } from "@/api/bill";
 
 const box1BtnActive = ref(1);
+const currentPage = ref(1);
+const total = ref(0);
+
 const handleClickBox1Btn = (index) => {
   box1BtnActive.value = index;
-  if (index === 2) {
-    handleGetBillBackground(false);
-  } else {
-    handleGetBillBackground(true);
-  }
+  currentPage.value = 1;
+  handleGetBillBackground();
 };
 
 const box2BtnActive = ref(1);
 const handleClickBox2Btn = (index) => {
   box2BtnActive.value = index;
   if (index === 1) {
-    handleGetBillPersonAnalyze(true);
-  } else {
     handleGetBillPersonAnalyze(false);
+  } else {
+    handleGetBillPersonAnalyze(true);
   }
 };
 
@@ -439,27 +442,29 @@ const wordCloudData = [
 ];
 
 // 获取立法背景内容
-const handleGetBillBackground = async (cRelated) => {
+const handleGetBillBackground = async () => {
+  const cRelated = box1BtnActive.value === 1 ? 'Y' : 'N';
   const params = {
     cRelated: cRelated,
     id: window.sessionStorage.getItem("billId"),
-    currentPage: 0,
+    currentPage: currentPage.value - 1,
     pageSize: 10,
   };
   try {
     const res = await getBillBackground(params);
     console.log("立法背景", res);
     backgroundList.value = res.data.content;
+    total.value = res.data.totalElements; // 假设API返回totalElements
   } catch (error) {}
 };
 
 // 获取相关事件
 const handleGetRelatedEvent = async () => {
   const params = {
-    id: 1,
+    id: window.sessionStorage.getItem("billId"),
   };
   try {
-    const res = await getBillEvent(params);
+    const res = await getBillInfoEvent(params);
     console.log("相关事件", res);
     eventList.value = res.data;
     eventList.value.forEach((item, index) => {
@@ -488,8 +493,9 @@ const handleGetBillPersonAnalyze = async (isOppose) => {
     const res = await getBillPersonAnalyze(params);
     console.log("议员相关性分析", res);
     personList.value = res.data;
-    personList.value.forEach((item) => {
-      item.image = user1;
+    personList.value.forEach((item, index) => {
+      const imgList = [user1, user2, user3, user4, user5];
+      item.image = imgList[index % imgList.length];
       item.icon = userIcon;
       item.icon1 = userIcon1;
     });
@@ -497,9 +503,9 @@ const handleGetBillPersonAnalyze = async (isOppose) => {
 };
 
 onMounted(() => {
-  handleGetBillBackground(true);
+  handleGetBillBackground();
   handleGetRelatedEvent();
-  handleGetBillPersonAnalyze(true);
+  handleGetBillPersonAnalyze(false);
 });
 </script>
 
@@ -572,7 +578,7 @@ onMounted(() => {
           display: flex;
           flex-wrap: wrap;
           justify-content: space-between;
-
+          align-content: flex-start;
           .box1-main-item {
             width: 544px;
             height: 48px;
@@ -598,11 +604,12 @@ onMounted(() => {
               width: 440px;
               height: 48px;
               line-height: 48px;
-              color: rgba(95, 101, 108, 1);
-              font-family: Microsoft YaHei;
-              font-size: 14px;
+              color: rgb(59, 65, 75);
+              font-family: "Microsoft YaHei";
+              font-size: 16px;
               font-weight: 400;
               text-align: left;
+              overflow: hidden;
             }
             .share {
               margin-left: 13px;
@@ -626,8 +633,8 @@ onMounted(() => {
           .info {
             height: 22px;
             line-height: 22px;
-            color: rgba(132, 136, 142, 1);
-            font-family: Microsoft YaHei;
+            color: rgb(132, 136, 142);
+            font-family: "Microsoft YaHei";
             font-size: 14px;
             font-weight: 400;
             text-align: left;
@@ -645,6 +652,7 @@ onMounted(() => {
         margin-top: 9px;
         margin-left: 23px;
         height: 300px;
+        overflow: auto;
         .box2-main-item {
           width: 1103px;
           height: 60px;
@@ -659,9 +667,9 @@ onMounted(() => {
             width: 64px;
             height: 48px;
             border-radius: 2px;
-            image {
-              width: 100px;
-              height: 100%;
+            img {
+              width: 64px;
+              height: 48px;
             }
           }
           .center {

src/views/bill/billHome/index.vue

@@ -84,6 +84,7 @@
 							<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>
@@ -140,15 +141,15 @@
 										<div
 											class="info-box"
 											:class="{
-												info1: item.status === 1,
-												info2: item.status === 2,
-												info3: item.status === 3,
-												info4: item.status === 4
+												info1: index === 0,
+												info2: index === 1,
+												info3: index === 2,
+												info4: index === 3
 											}"
 											v-for="(item, index) in curBill.hylyList"
 											:key="index"
 										>
-											{{ item }}
+											{{ item.industryName }}
 										</div>
 									</div>
 									<div class="box1-main-left-info1">
@@ -307,6 +308,12 @@
 									<div class="header-right-text">{{ "数据来源：美国国会官方网站" }}</div>
 								</div>
 							</div>
+							<div class="box5-select">
+								<el-select v-model="box5Select" placeholder="选择领域" @change="handleBox5Change" style="width: 150px">
+									<el-option label="全部领域" value="全部领域" />
+									<el-option v-for="item in categoryList.slice(1)" :key="item.id" :label="item.name" :value="item.id" />
+								</el-select>
+							</div>
 							<div class="box5-main" id="box5Chart"></div>
 						</div>
 						<div class="box6">
@@ -386,13 +393,13 @@
 									@click="handleClcikToCharacter(0)"
 								>
 									<div class="box8-main-item-left">
-										<img :src="item.img" alt="" />
+										<img :src="item.img" alt="" referrerpolicy="no-referrer" class="left-img" />
 										<div class="left-icon1">
 											<img :src="item.dangpai" alt="" />
 										</div>
 										<div class="left-icon2">
 											<img :src="item.yuan" alt="" />
-										</div>
+										</div> 
 									</div>
 									<div class="box8-main-item-center">
 										<div class="box8-main-item-center-top">{{ item.name }}</div>
@@ -448,16 +455,7 @@
 							{{ cate.name }}
 						</div>
 					</div>
-					<div class="select-box">
-						<el-select v-model="releaseTime" placeholder="选择发布时间" style="width: 120px">
-							<el-option
-								v-for="item in releaseTimeList"
-								:key="item.value"
-								:label="item.label"
-								:value="item.value"
-							/>
-						</el-select>
-					</div>
+
 				</div>
 				<div class="home-main-footer-main">
 					<div class="left">
@@ -467,17 +465,16 @@
 								<div class="title">{{ "科技领域" }}</div>
 							</div>
 							<div class="select-main">
-								<div class="checkbox-group">
+								<el-checkbox-group class="checkbox-group" v-model="activeAreaList">
 									<el-checkbox
-										v-for="area in areaList"
+										v-for="(area, index) in areaList"
 										:key="area.id"
-										v-model="activeAreaList"
 										:label="area.id"
 										class="filter-checkbox"
 									>
 										{{ area.name }}
 									</el-checkbox>
-								</div>
+								</el-checkbox-group>
 							</div>
 						</div>
 						<div class="select-box">
@@ -485,18 +482,17 @@
 								<div class="icon"></div>
 								<div class="title">{{ "党派" }}</div>
 							</div>
-							<div class="select-main select-main1">
-								<div class="checkbox-group">
+							<div class="select-main">
+								<el-checkbox-group class="checkbox-group" v-model="activeDpList">
 									<el-checkbox
-										v-for="dp in dpList"
+										v-for="(dp, index) in dpList"
 										:key="dp.id"
-										v-model="activeDpList"
 										:label="dp.id"
 										class="filter-checkbox"
 									>
 										{{ dp.name }}
 									</el-checkbox>
-								</div>
+								</el-checkbox-group>
 							</div>
 						</div>
 						<div class="select-box">
@@ -505,17 +501,16 @@
 								<div class="title">{{ "议院" }}</div>
 							</div>
 							<div class="select-main">
-								<div class="checkbox-group">
+								<el-checkbox-group class="checkbox-group" v-model="activeYyList">
 									<el-checkbox
-										v-for="yy in yyList"
+										v-for="(yy, index) in yyList"
 										:key="yy.id"
-										v-model="activeYyList"
 										:label="yy.id"
 										class="filter-checkbox"
 									>
 										{{ yy.name }}
 									</el-checkbox>
-								</div>
+								</el-checkbox-group>
 							</div>
 						</div>
 
@@ -525,17 +520,16 @@
 								<div class="title">{{ "发布时间" }}</div>
 							</div>
 							<div class="select-main">
-								<div class="checkbox-group">
+								<el-checkbox-group class="checkbox-group" v-model="activePubTime">
 									<el-checkbox
-										v-for="time in pubTime"
+										v-for="(time, index) in pubTime"
 										:key="time.id"
-										v-model="activePubTime"
 										:label="time.id"
 										class="filter-checkbox"
 									>
 										{{ time.name }}
 									</el-checkbox>
-								</div>
+								</el-checkbox-group>
 							</div>
 						</div>
 					</div>
@@ -561,6 +555,16 @@
 									/>
 								</el-select>
 							</div>
+							<div class="right-header-box" style="margin-left: auto;">
+								<el-select v-model="releaseTime" placeholder="选择发布时间" style="width: 120px">
+									<el-option
+										v-for="item in releaseTimeList"
+										:key="item.value"
+										:label="item.label"
+										:value="item.value"
+									/>
+								</el-select>
+							</div>
 						</div>
 						<div class="right-main">
 							<div class="right-main-box" v-for="(item, index) in footerBillList" :key="index">
@@ -620,7 +624,7 @@
 </template>
 
 <script setup>
-import { onMounted, ref, computed, onUnmounted, nextTick } from "vue";
+import { onMounted, ref, computed, onUnmounted, nextTick, watch } from "vue";
 import router from "@/router/index";
 import setChart from "@/utils/setChart";
 
@@ -631,7 +635,9 @@ import {
 	getBillsByType,
 	getHylyList,
 	getBillOverviewKeyTK,
-	getBillCount
+	getBillCount,
+	getBillPostOrg,
+	getMemberProposal
 } from "@/api/bill/billHome";
 import DivideHeader from "@/components/DivideHeader.vue";
 
@@ -1138,6 +1144,7 @@ const handleGetBillsByType = async () => {
 };
 
 // 涉华法案数量
+const box5Select = ref("全部领域");
 const box5Data = ref({
 	title: [
 		"2024-09",
@@ -1166,11 +1173,31 @@ const box5Data = ref({
 });
 const handleGetBillCount = async () => {
 	try {
-		const res = await getBillCount();
+		let params = {};
+		if (box5Select.value !== "全部领域") {
+			params.industryId = box5Select.value;
+		}
+		const res = await getBillCount(params);
 		console.log("涉华法案统计", res);
 		if (res.code === 200 && res.data) {
+			const sortedData = res.data.sort((a, b) => a.month.localeCompare(b.month));
+			box5Data.value = {
+				title: sortedData.map(item => item.month),
+				data: [
+					{
+						name: "提出法案",
+						value: sortedData.map(item => item.totalCount)
+					},
+					{
+						name: "通过法案",
+						value: sortedData.map(item => item.passCount)
+					}
+				],
+				percent: sortedData.map(item => item.percent)
+			};
 		} else {
-			box5Data.value = {};
+			// 保持默认数据或清空
+			// box5Data.value = {};
 		}
 	} catch (error) {
 		console.error("获取涉华法案统计error", error);
@@ -1179,10 +1206,60 @@ const handleGetBillCount = async () => {
 
 const handleBox5 = async () => {
 	await handleGetBillCount();
-	let box5Chart = getMultiLineChart(box5Data.value.title, box5Data.value.data[0].value, box5Data.value.data[1].value);
+	const proposed = box5Data.value.data[0].value;
+	const passed = box5Data.value.data[1].value;
+	const rate = box5Data.value.percent || proposed.map((p, i) => {
+		const pass = passed[i] || 0;
+		return p ? ((pass / p) * 100).toFixed(2) : 0;
+	});
+	let box5Chart = getMultiLineChart(box5Data.value.title, proposed, passed, rate);
 	setChart(box5Chart, "box5Chart");
 };
 
+const handleBox5Change = () => {
+	handleBox5();
+};
+
+// 法案提出部门
+const handleBox7Data = async () => {
+	try {
+		const res = await getBillPostOrg({ year: box7selectetedTime.value });
+		console.log("法案提出部门", res);
+		if (res.code === 200 && res.data) {
+			const apiData = res.data;
+
+			const houseItems = apiData.filter(i => i.congressName === "House");
+			const senateItems = apiData.filter(i => i.congressName === "Senate");
+
+			const houseTotal = houseItems.reduce((sum, i) => sum + i.countBill, 0);
+			const senateTotal = senateItems.reduce((sum, i) => sum + i.countBill, 0);
+
+			const data1 = [];
+			if (houseItems.length > 0) {
+				data1.push({ name: "众议院", value: houseTotal });
+			}
+			if (senateItems.length > 0) {
+				data1.push({ name: "参议院", value: senateTotal });
+			}
+
+			const data2 = [...houseItems, ...senateItems].map(item => ({
+				name: item.originDepart,
+				value: item.countBill,
+				type: item.congressName === "House" ? "众议院" : "参议院"
+			}));
+
+			const box7Chart = getDoublePieChart(data1, data2);
+			setChart(box7Chart, "box7Chart");
+		}
+	} catch (error) {
+		console.error("获取法案提出部门数据失败", error);
+	}
+};
+
+watch(box7selectetedTime, () => {
+	handleBox7Data();
+});
+
 // 关键条款
 const wordCloudData = ref([
 	{ name: "限制中国获取能源技术", value: 100 },
@@ -1379,48 +1456,30 @@ const box7Data = ref([
 	]
 ]);
 
-const box8Data = ref([
-	{
-		name: "汤姆·科顿",
-		zhiwei: "参议院情报委员会主席",
-		img: Message3,
-		dangpai: Cyy,
-		yuan: Ghd,
-		num: 8
-	},
-	{
-		name: "吉姆·里施",
-		zhiwei: "参议院外交关系委员会主席",
-		img: Message3,
-		dangpai: Cyy,
-		yuan: Ghd,
-		num: 4
-	},
-	{
-		name: "特德·克鲁兹",
-		zhiwei: "参议院商务、科学和交通委员会主席",
-		img: Message3,
-		dangpai: Cyy,
-		yuan: Ghd,
-		num: 2
-	},
-	{
-		name: "里克·克劳福德",
-		zhiwei: "众议院美中战略竞争特设委员会主席",
-		img: Message3,
-		dangpai: Cyy,
-		yuan: Ghd,
-		num: 2
-	},
-	{
-		name: "布莱恩·马斯特",
-		zhiwei: "众议院情报委员会主席",
-		img: Message3,
-		dangpai: Cyy,
-		yuan: Ghd,
-		num: 2
+const box8Data = ref([]);
+
+const handleBox8Data = async () => {
+	try {
+		const res = await getMemberProposal({ year: box8selectetedTime.value });
+		console.log("关键议员提案", res);
+		if (res.code === 200 && res.data) {
+			box8Data.value = res.data.map(item => ({
+				name: item.memberName,
+				zhiwei: item.position,
+				img: item.imageUrl,
+				num: item.countProposal,
+				dangpai: Cyy,
+				yuan: item.position === "Democratic" ? Mzd : Ghd
+			}));
+		}
+	} catch (error) {
+		console.error("获取关键议员提案失败", error);
 	}
-]);
+};
+
+watch(box8selectetedTime, () => {
+	handleBox8Data();
+});
 
 const handleToPosi = id => {
 	// 0 618 1240 2350
@@ -1464,26 +1523,36 @@ const handleClickTab = tab => {
 };
 
 const areaList = [
+	{ id: "全部领域", name: "全部领域" },
 	{ id: "人工智能", name: "人工智能" },
 	{ id: "集成电路", name: "集成电路" },
 	{ id: "通信网络", name: "通信网络" },
-	{ id: "量子科技", name: "量子科技" }
+	{ id: "先进制造", name: "先进制造" },
+	{ id: "量子科技", name: "量子科技" },
+	{ id: "生物科技", name: "生物科技" },
+	{ id: "能源", name: "能源" },
+	{ id: "航空航天", name: "航空航天" },
+	{ id: "新材料", name: "新材料" },
+	{ id: "海洋", name: "海洋" }
 ];
-const activeAreaList = ["人工智能"];
+const activeAreaList = ref(["全部领域"]);
 
 const dpList = ref([
+	{ id: "全部党派", name: "全部党派" },
 	{ id: "民主党", name: "民主党" },
 	{ id: "共和党", name: "共和党" }
 ]);
-const activeDpList = ["民主党"];
+const activeDpList = ref(["全部党派"]);
 
 const yyList = ref([
+	{ id: "全部议院", name: "全部议院" },
 	{ id: "参议院", name: "参议院" },
 	{ id: "众议院", name: "众议院" }
 ]);
-const activeYyList = ["参议院"];
+const activeYyList = ref(["全部议院"]);
 
 const pubTime = ref([
+	{ id: "全部时间", name: "全部时间" },
 	{ id: "2025年", name: "2025年" },
 	{ id: "2024年", name: "2024年" },
 	{ id: "2023年", name: "2023年" },
@@ -1491,7 +1560,7 @@ const pubTime = ref([
 	{ id: "2021年", name: "2021年" },
 	{ id: "更早时间", name: "更早时间" }
 ]);
-const activePubTime = ref(["2025年"]);
+const activePubTime = ref(["全部时间"]);
 
 const footerSelectList1 = ref([
 	{
@@ -1549,8 +1618,9 @@ onMounted(async () => {
 	handleBox5(); //涉华法案统计
 	handleBox6(); // 关键条款
 
-	const box7Chart = getDoublePieChart(box7Data.value[0], box7Data.value[1]);
-	setChart(box7Chart, "box7Chart");
+	handleBox7Data();
+
+	handleBox8Data();
 
 	await handleGetHotBills();
 	curBill.value = hotBillList.value[0];
@@ -1929,15 +1999,14 @@ onUnmounted(() => {});
 							padding-left: 31px;
 							.box1-main-left {
 								margin-left: 39px;
-								// flex: 1;
 								width: 484px;
 								.box1-main-left-title {
-									height: 22px;
 									color: rgba(20, 89, 187, 1);
-									font-family: Microsoft YaHei;
+									font-family: "Microsoft YaHei";
 									font-size: 20px;
 									font-weight: 700;
 									line-height: 22px;
+									margin-bottom: 14px;
 								}
 								.box1-main-left-info {
 									margin-top: 17px;
@@ -2549,6 +2618,7 @@ onUnmounted(() => {});
 						border-radius: 10px;
 						box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
 						background: rgba(255, 255, 255, 1);
+						position: relative;
 						.box5-header {
 							height: 53px;
 							border-bottom: 1px solid rgba(240, 242, 244, 1);
@@ -2605,6 +2675,12 @@ onUnmounted(() => {});
 						.box5-main {
 							height: 397px;
 						}
+						.box5-select {
+							position: absolute;
+							top: 50px;
+							left: 100px;
+							z-index: 100;
+						}
 					}
 					.box6 {
 						margin-left: 20px;
@@ -2615,7 +2691,7 @@ onUnmounted(() => {});
 						background: rgba(255, 255, 255, 1);
 						.box6-header {
 							width: 521px;
-							height: 48px;
+							height: 53px;
 							border-bottom: 1px solid rgba(240, 242, 244, 1);
 							display: flex;
 							box-sizing: border-box;
@@ -2665,8 +2741,8 @@ onUnmounted(() => {});
 							}
 						}
 						.box6-main {
-							width: 452px;
-							height: 402px;
+							width: 100%;
+							height: calc(100% - 53px);
 						}
 					}
 				}
@@ -2816,6 +2892,8 @@ onUnmounted(() => {});
 						}
 						.box8-main {
 							height: 340px;
+							overflow-y: auto;
+							overflow-x: hidden;
 							.box8-main-item {
 								margin: 0 auto;
 								width: 478px;
@@ -2833,9 +2911,10 @@ onUnmounted(() => {});
 									position: relative;
 									width: 42px;
 									height: 42px;
-									img {
-										width: 100%;
-										height: 100%;
+									.left-img {
+										width: 42px;
+										height: 42px;
+										border-radius: 50%;
 									}
 									.left-icon1 {
 										position: absolute;
@@ -2892,11 +2971,10 @@ onUnmounted(() => {});
 									position: absolute;
 									top: 0;
 									right: 10px;
-									width: 92px;
 									height: 51px;
 									text-align: right;
 									color: rgba(95, 101, 108, 1);
-									font-family: Microsoft YaHei;
+									font-family: "Microsoft YaHei";
 									font-size: 16px;
 									font-weight: 400;
 									line-height: 51px;
@@ -3051,7 +3129,7 @@ onUnmounted(() => {});
 					box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
 					background: rgba(255, 255, 255, 1);
 					.select-box {
-						margin-top: 21px;
+						margin-top: 20px;
 						.select-box-header {
 							display: flex;
 							gap: 17px;
@@ -3063,18 +3141,35 @@ onUnmounted(() => {});
 								border-radius: 0 4px 4px 0;
 							}
 							.title {
-								height: 24px;
+								// height: 24px;
 								color: var(--color-main-active);
 								font-family: Microsoft YaHei;
-								font-size: 16px;
+								font-size: 20px;
 								font-weight: 700;
-								line-height: 24px;
+								line-height: 26px;
 								letter-spacing: 1px;
 								text-align: left;
 							}
 						}
 						.select-main {
 							margin-left: 25px;
+							margin-top: 16px;
+							.checkbox-group {
+								display: flex;
+								flex-wrap: wrap;
+								.filter-checkbox {
+									width: 50%;
+									margin-right: 0;
+									margin-bottom: 4px;
+									:deep(.el-checkbox__label) {
+										color: rgb(95, 101, 108);
+										font-size: 16px;
+										font-weight: 400;
+										font-family: "Microsoft YaHei";
+										line-height: 24px;
+									}
+								}
+							}
 						}
 						.select-main1 {
 							width: 100px;

src/views/bill/billHome/utils/multiLineChart.js

 import * as echarts from 'echarts'
 
-const getMultiLineChart = (dataX, dataY1, dataY2) => {
+const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
   return {
     tooltip: {
       trigger: 'axis',
@@ -9,25 +9,34 @@ const getMultiLineChart = (dataX, dataY1, dataY2) => {
         label: {
           backgroundColor: '#6a7985'
         }
+      },
+      formatter: function (params) {
+        let res = params[0].name + '<br/>';
+        params.forEach(item => {
+            res += item.marker + item.seriesName + ': ' + item.value + (item.seriesName === '通过率' ? '%' : '') + '<br/>';
+        });
+        return res;
       }
     },
     grid: {
-      top: '8%',
+      top: '15%',
       right: '5%',
       bottom: '5%',
       left: '5%',
       containLabel: true
     },
     legend: {
-      data: ['提出法案', '通过法案'],
+      data: ['提出法案', '通过法案', '通过率'],
       show: true,
+      top: 0,
+      icon: 'circle',
       textStyle: {
         color: 'rgba(95, 101, 108, 1)',
         fontFamily: 'Microsoft YaHei',
-        fontSize: '16px',
+        fontSize: '14px',
       }
     },
-    color: ['#1459bb', '#fa8c16'],
+    color: ['#1677FF', '#FA8C16', '#D9001B'],
     xAxis: [
       {
         type: 'category',
@@ -37,47 +46,83 @@ const getMultiLineChart = (dataX, dataY1, dataY2) => {
     ],
     yAxis: [
       {
-        type: 'value'
+        type: 'value',
+        position: 'left',
+        axisLabel: {
+            color: '#666'
+        }
+      },
+      {
+        type: 'value',
+        position: 'right',
+        min: 0,
+        max: 100,
+        interval: 20,
+        axisLabel: {
+            formatter: '{value}%',
+            color: '#666'
+        },
+        splitLine: {
+            show: false
+        }
       }
     ],
     series: [
       {
         name: '提出法案',
         type: 'line',
-
+        symbol: 'emptyCircle',
+        symbolSize: 6,
         areaStyle: {
           color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
             offset: 0,
-            color: 'rgba(22, 119, 255, 1)' // 起始颜色
+            color: 'rgba(22, 119, 255, 0.4)' // 起始颜色
           }, {
             offset: 1,
             color: 'rgba(22, 119, 255, 0)' // 结束颜色
           }])
         },
-        emphasis: {
-          focus: 'series'
+        itemStyle: {
+            color: '#1677FF'
         },
         data: dataY1
       },
       {
         name: '通过法案',
         type: 'line',
+        symbol: 'emptyCircle',
+        symbolSize: 6,
         areaStyle: {
           color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
             offset: 0,
-            color: 'rgba(255, 172, 77, 1)' // 起始颜色
+            color: 'rgba(250, 140, 22, 0.4)' // 起始颜色
           }, {
             offset: 1,
-            color: 'rgba(255, 172, 77, 0)' // 结束颜色
+            color: 'rgba(250, 140, 22, 0)' // 结束颜色
           }])
         },
-        emphasis: {
-          focus: 'series'
+        itemStyle: {
+            color: '#FA8C16'
         },
         data: dataY2
+      },
+      {
+        name: '通过率',
+        type: 'line',
+        yAxisIndex: 1,
+        symbol: 'emptyCircle',
+        symbolSize: 4,
+        lineStyle: {
+            type: 'dashed',
+            width: 2
+        },
+        itemStyle: {
+            color: '#D9001B'
+        },
+        data: dataY3
       }
     ]
   }
 }
 
-export default getMultiLineChart
+export default getMultiLineChart
\ No newline at end of file

src/views/bill/billHome/utils/worldCloudChart.js

@@ -11,6 +11,8 @@ const getWordCloudChart = (data) => {
     series: [
       {
         type: "wordCloud",
+        width: '80%',
+        height: '80%',
         shape: "rect",  // 
         // 其他形状你可以使用形状路径
         // 或者自定义路径

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

@@ -35,7 +35,7 @@
 			<div class="box2">
 				<div class="box-header">
 					<div class="header-left"></div>
-					<div class="title">辩论投票时长</div>
+					<div class="title">修正案次数分析</div>
 					<div class="header-right">
 						<div class="icon">
 							<img src="@/assets/icons/box-header-icon1.png" alt="" />
@@ -320,7 +320,7 @@
 
 <script setup>
 import { ref, onMounted } from "vue";
-import { getBillTimeAnalyze, getBillXj, getBillTotalXj, getBillTp } from "@/api/deepdig";
+import { getBillTimeAnalyze, getBillAmeAnalyzeCount, getBillTp } from "@/api/deepdig";
 import getBoxPlotChcart from "./utils/boxplot";
 import * as echarts from "echarts";
 
@@ -563,20 +563,69 @@ const handleGetBillTimeAnalyze = async () => {
 			return item.lcmc;
 		});
 		chartData1.value.dataY = res.data.map(item => {
-			return [item.zdhs, item.zshs, item.pjs, item.pjx, item.zws, item.dysc];
+			return [item.zshs, item.pjx, item.zws, item.pjs, item.zdhs, item.dysc];
 		});
 	} catch (error) {}
 };
 
-// 辩论投票时长
+// 修正案次数分析
+const handleGetBillAmeAnalyzeCount = async () => {
+	const params = {
+		id: window.sessionStorage.getItem("billId")
+	};
+	try {
+		const res = await getBillAmeAnalyzeCount(params);
+		console.log("修正案次数分析", res);
+		chartData2.value.dataX = res.data.map(item => {
+			return item.lcmc;
+		});
+		chartData2.value.dataY = res.data.map(item => {
+			// 兼容多种字段名，防止字段不存在导致图表消失
+			// 顺序：最小(min), Q1(小), 中位数(median), Q3(大), 最大(max), 该法案(current)
+			return [
+				item.zsCount || item.zscs || item.zshs || 0, 
+				item.jsx || item.pjx || 0, 
+				item.zws || item.zwcs || 0, 
+				item.pjs || item.pjcs || 0, 
+				item.zdCount || item.zdcs || item.zdhs || 0, 
+				item.dysc || item.dycs || 0
+			];
+		});
+	} catch (error) {
+        console.error("修正案次数分析 error", error);
+    }
+};
+
+// 获取投票分析
+const handleGetBillVoteAnalyze = async () => {
+	const params = {
+		id: window.sessionStorage.getItem("billId")
+	};
+	try {
+		const res = await getBillTp(params);
+		console.log("投票分析", res);
+	} catch (error) {
+        console.error("投票分析 error", error);
+    }
+};
 
 onMounted(async () => {
 	await handleGetBillTimeAnalyze();
-
+	await handleGetBillAmeAnalyzeCount();
+	await handleGetBillVoteAnalyze();
+		
 	let chart1 = getBoxPlotChcart(chartData1.value, "天");
 	setChart(chart1, "chart1");
 
-	let chart2 = getBoxPlotChcart(chartData2.value, "小时");
+    const countLabels = {
+        max: '最大次数',
+        q3: '平均次数大',
+        median: '次数中位数',
+        q1: '平均次数小',
+        min: '最小次数',
+        current: '该法案修正案数量'
+    };
+	let chart2 = getBoxPlotChcart(chartData2.value, "次", countLabels);
 	setChart(chart2, "chart2");
 });
 </script>

src/views/bill/deepDig/processAnalysis/utils/boxplot.js

 
-const getBoxPlotChcart = (data,unit) => {
+const getBoxPlotChcart = (data, unit, labelConfig = {}) => {
+  const labels = {
+    max: labelConfig.max || '最大耗时',
+    q3: labelConfig.q3 || '平均耗时大',
+    median: labelConfig.median || '耗时中位数',
+    q1: labelConfig.q1 || '平均耗时小',
+    min: labelConfig.min || '最小耗时',
+    current: labelConfig.current || '该法案耗时'
+  };
+
   let option = {
     // title: [
     //   {
@@ -11,6 +20,22 @@ const getBoxPlotChcart = (data,unit) => {
       trigger: 'item',
       axisPointer: {
         type: 'shadow'
+      },
+      formatter: function (params) {
+        if (params.seriesType === 'scatter') {
+            return `${params.name}<br/>${labels.current}: ${params.data[1]} ${unit}`;
+        }
+        const { name, data } = params;
+        let tip = `${name}<br/>`;
+        tip += `${labels.max}: ${data[5]} ${unit}<br/>`;
+        tip += `${labels.q3}: ${data[4]} ${unit}<br/>`;
+        tip += `${labels.median}: ${data[3]} ${unit}<br/>`;
+        tip += `${labels.q1}: ${data[2]} ${unit}<br/>`;
+        tip += `${labels.min}: ${data[1]} ${unit}<br/>`;
+        if (data[6] !== undefined && data[6] !== null) {
+          tip += `${labels.current}: ${data[6]} ${unit}`;
+        }
+        return tip;
       }
     },
     grid: {
@@ -48,13 +73,20 @@ const getBoxPlotChcart = (data,unit) => {
       {
         name: 'boxplot',
         type: 'boxplot',
-        datasetIndex: 1,
         data: data.dataY,
       },
       {
-        name: 'outlier',
+        name: labels.current,
         type: 'scatter',
-        datasetIndex: 2
+        data: data.dataY.map((item, index) => [index, item[5]]),
+        itemStyle: {
+          color: '#ff5722'
+        },
+        tooltip: {
+          formatter: function (params) {
+            return `${params.name}<br/>${labels.current}: ${params.data[1]} ${unit}`;
+          }
+        }
       }
     ]
   }

src/views/bill/introdoction/STimeline.vue

 <template>
 	<div class="container">
 		<div class="svg-timeline">
-			<svg :width="svgWidth" :height="svgHeight">
+			<svg :viewBox="`0 0 ${svgWidth} ${svgHeight}`" width="100%" height="100%">
 				<!-- <line
           :x1="lines[0].x1 - 100"
           :y1="lines[0].y1"
@@ -31,10 +31,11 @@
           stroke-width="2"
         /> -->
 				<line
-					:x1="lines[0].x1 - 100"
-					:y1="lines[0].y1"
-					:x2="lines[0].x1"
-					:y2="lines[0].y1"
+					v-if="nodes.length > 0"
+					:x1="nodes[0].x - 100"
+					:y1="nodes[0].y"
+					:x2="nodes[0].x"
+					:y2="nodes[0].y"
 					stroke="#e8f2ff"
 					stroke-width="2"
 					marker-end="url(#arrow)"
@@ -68,51 +69,60 @@
 					v-for="(node, idx) in nodes.slice(0, nodes.length)"
 					:key="'line' + idx"
 					:x1="node.x"
-					:y1="node.y + 2"
+					:y1="node.y + 4"
 					:x2="node.x"
-					:y2="node.dyms ? node.y + 80 : node.y + 50"
+					:y2="node.y + verticalLineLength"
 					stroke="#1677ff"
-					stroke-width="2"
+					:stroke-width="verticalLineWidth"
 				/>
 
-				<text
+				<foreignObject
 					v-for="(node, idx) in nodes"
-					:key="'actionDate' + idx"
-					:x="node.x + 10"
-					:y="node.y + 30"
-					text-anchor="start"
-					fill="#1677ff"
-					font-size="14"
-					font-weight="600"
+					:key="'fo-' + idx"
+					:x="node.x + 15"
+					:y="node.y + 5"
+					:width="nodeGapX - 30"
+					height="100"
+					style="overflow: visible;"
 				>
-					{{ node.actionDate }}
-				</text>
+					<div class="node-content" xmlns="http://www.w3.org/1999/xhtml">
+						<div class="date">{{ node.formattedDate }}</div>
+						<div class="title">{{ node.actionTitle }}</div>
+						<div class="votes" v-if="node.voteString">{{ node.voteString }}</div>
+					</div>
+				</foreignObject>
 				<text
-					v-for="(node, idx) in nodes"
-					:key="'actionTitle' + idx"
-					:x="node.x + 10"
-					:y="node.y + 50"
-					text-anchor="start"
-					fill="#3b414b"
-					font-size="14"
-					textLength="170"
-					lengthAdjust="spacing"
-					font-weight="bold"
+					v-if="startMonth && nodes.length > 0"
+					:x="nodes[0].x - 110"
+					:y="nodes[0].y + 5"
+					text-anchor="end"
+					fill="rgb(5, 95, 194)"
+					font-size="16"
+					font-weight="700"
 				>
-					{{ node.actionTitle.slice(0,24) }}
+					{{ startMonth }}
 				</text>
 
+				<line
+					v-if="nodes.length > 0"
+					:x1="nodes[nodes.length - 1].x"
+					:y1="nodes[nodes.length - 1].y"
+					:x2="nodes[nodes.length - 1].row % 2 === 0 ? nodes[nodes.length - 1].x + 100 : nodes[nodes.length - 1].x - 100"
+					:y2="nodes[nodes.length - 1].y"
+					stroke="#e8f2ff"
+					stroke-width="2"
+					marker-end="url(#arrow)"
+				/>
 				<text
-					v-for="(node, idx) in nodes"
-					:key="'actionTitle' + idx"
-					:x="node.x + 10"
-					:y="node.y + 70"
-					text-anchor="start"
-					fill="#84888e"
-					font-size="14"
-					
+					v-if="endMonth && nodes.length > 0"
+					:x="nodes[nodes.length - 1].row % 2 === 0 ? nodes[nodes.length - 1].x + 110 : nodes[nodes.length - 1].x - 110"
+					:y="nodes[nodes.length - 1].y + 5"
+					:text-anchor="nodes[nodes.length - 1].row % 2 === 0 ? 'start' : 'end'"
+					fill="rgb(5, 95, 194)"
+					font-size="16"
+					font-weight="700"
 				>
-					{{ node.dyms ? node.dyms : "" }}
+					{{ endMonth }}
 				</text>
 			</svg>
 		</div>
@@ -134,26 +144,55 @@ export default {
 			// ],
 			maxPerRow: 5,
 			nodeGapX: 200,
-			nodeGapY: 100
+			nodeGapY: 180,
+			leftMargin: 150,
+			verticalLineLength: 80,
+			verticalLineWidth: 1
 		};
 	},
 	computed: {
+		startMonth() {
+			if (this.sortedDataList.length === 0) return '';
+			const date = new Date(this.sortedDataList[0].actionDate);
+			return `${date.getFullYear()}年${date.getMonth() + 1}月`;
+		},
+		endMonth() {
+			if (this.sortedDataList.length === 0) return '';
+			const date = new Date(this.sortedDataList[this.sortedDataList.length - 1].actionDate);
+			return `${date.getFullYear()}年${date.getMonth() + 1}月`;
+		},
+		sortedDataList() {
+			if (!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));
+		},
 		nodes() {
 			// 计算每个节点的坐标（蛇形）
-			return this.dataList.map((item, idx) => {
+			return this.sortedDataList.map((item, idx) => {
 				const row = Math.floor(idx / this.maxPerRow);
 				const col = idx % this.maxPerRow;
 				let x, y;
-				const leftMargin = 10; // 你可以自定义这个值
+				// const leftMargin = 150; // 你可以自定义这个值
 
 				if (row % 2 === 0) {
-					x = leftMargin + col * this.nodeGapX + 50;
+					x = this.leftMargin + col * this.nodeGapX + 50;
 				} else {
-					x = leftMargin + (this.maxPerRow - 1 - col) * this.nodeGapX + 50;
+					x = this.leftMargin + (this.maxPerRow - 1 - col) * this.nodeGapX + 50;
 				}
 				// 节点纵坐标起始值
 				y = 60 + row * this.nodeGapY;
-				return { ...item, x, y, row };
+
+				// Format Date: 2025-07-04 -> 7月4日
+				const dateObj = new Date(item.actionDate);
+				const formattedDate = `${dateObj.getMonth() + 1}月${dateObj.getDate()}日`;
+
+				// Format Votes
+				let voteString = '';
+				if (item.agreeVote !== null && item.disagreeVote !== null) {
+					voteString = `${item.agreeVote}票赞成 : ${item.disagreeVote}票反对`;
+				}
+
+				return { ...item, x, y, row, formattedDate, voteString };
 			});
 		},
 		lines() {
@@ -194,7 +233,7 @@ export default {
 				console.log("prev", prev);
 
 				// 判断是否是行尾转折点
-				const isTurnPoint = i % 5 === 0;
+				const isTurnPoint = i % this.maxPerRow === 0;
 
 				if (isTurnPoint) {
 					// 计算半圆路径
@@ -221,7 +260,7 @@ export default {
 			return path;
 		},
 		svgWidth() {
-			return this.maxPerRow * this.nodeGapX + 100;
+			return this.leftMargin + this.maxPerRow * this.nodeGapX + 50;
 		},
 		svgHeight() {
 			// SVG高度
@@ -240,7 +279,7 @@ export default {
 	align-items: center;
 }
 .svg-timeline {
-	width: 1000px;
+	width: 100%;
 	// background-size: 100% 100%;
 	// position: relative;
 	// .title {
@@ -264,5 +303,40 @@ export default {
 	//     height: 24px;
 	//   }
 	// }
+	
+	.node-content {
+		font-family: Microsoft YaHei, sans-serif;
+		text-align: left;
+		padding-left: 4px; 
+
+		.date {
+			color: rgb(5, 95, 194);
+			font-weight: 700;
+			font-size: 14px;
+			line-height: 22px;
+			margin-bottom: 0px; 
+			margin-top: 6px;
+		}
+
+		.title {
+			color: rgb(59, 65, 75);
+			font-weight: 700;
+			font-size: 14px;
+			line-height: 22px;
+			margin-bottom: 0px;
+            white-space: nowrap;      /* Keep text on one line */
+            overflow: hidden;         /* Hide overflow */
+            text-overflow: ellipsis;  /* Show ... for overflow */
+            width: 100%;              /* Ensure it takes full width of container */
+            display: block;           /* Block level for ellipsis to work */
+		}
+
+		.votes {
+			color: rgb(95, 101, 108);
+			font-size: 14px;
+            font-weight: 400;
+            line-height: 22px;
+		}
+	}
 }
 </style>

src/views/bill/introdoction/index.vue

@@ -31,9 +31,10 @@
 						<div class="box1-right-item">
 							<div class="item-left">相关领域：</div>
 							<div class="item-right1">
-								<div class="right1-item">跨境电商</div>
+								<!-- <div class="right1-item">跨境电商</div>
 								<div class="right1-item">新能源产业</div>
-								<div class="right1-item">半导体产业</div>
+								<div class="right1-item">半导体产业</div> -->
+								<div class="right1-item" v-for="item in basicInfo.hylyList" :key="item">{{ item }}</div>
 							</div>
 						</div>
 						<div class="box1-right-item">
@@ -81,7 +82,7 @@
 				<div class="box-header">
 					<div class="header-left"></div>
 					<div class="title">法案进展</div>
-					<div class="header-btn-box">
+					<!-- <div class="header-btn-box">
 						<div class="btn" @click="handleClcikBox2Btn(1)">
 							<el-badge :value="warningNum">
 								<el-button type="primary" plain v-if="box2BtnActive === 1">最新进展</el-button>
@@ -92,7 +93,7 @@
 							<el-button type="primary" plain v-if="box2BtnActive === 2">前期进展</el-button>
 							<el-button type="info" plain v-else>前期进展</el-button>
 						</div>
-					</div>
+					</div> -->
 					<div class="header-right">
 						<div class="icon">
 							<img src="@/assets/icons/box-header-icon2.png" alt="" />
@@ -104,8 +105,8 @@
 				</div>
 				<div class="box2-main">
 					<div class="box2-main-center">
-						<STimeline v-if="box2BtnActive == 2" :dataList="timelineData" />
-						<div class="box2-center-item-box" v-if="box2BtnActive == 1">
+						<STimeline :dataList="timelineData" />
+						<!-- <div class="box2-center-item-box" v-if="box2BtnActive == 1">
 							<div class="box2-center-item" v-for="(item, index) in progressList" :key="index">
 								<div class="tip" :class="{ tipActive: item.fxdj }"></div>
 								<div class="date">{{ item.actionDate }}</div>
@@ -128,7 +129,7 @@
 									<el-icon size="22" color="#777"><ArrowRightBold /></el-icon>
 								</div>
 							</div>
-						</div>
+						</div> -->
 					</div>
 				</div>
 				<div class="box2-footer">
@@ -210,15 +211,15 @@
 					<div
 						class="tag-box"
 						:class="{
-							status0: tag.status === 0,
-							status1: tag.status === 1,
-							status2: tag.status === 2,
-							status3: tag.status === 3
+							status0: index === 0 || index === 4,
+							status1: index === 1 || index === 5,
+							status2: index === 2 || index === 6,
+							status3: index === 3 || index === 7
 						}"
-						v-for="(tag, index) in tagList"
+						v-for="(tag, index) in curPerson.tagList"
 						:key="index"
 					>
-						{{ tag.title }}
+						{{ tag }}
 					</div>
 				</div>
 				<div class="right-main-box3">
@@ -231,13 +232,13 @@
 					<div class="right-main-box3-main">
 						<el-timeline style="max-width: 500px">
 							<el-timeline-item
-								:timestamp="item.sjsj"
+								:timestamp="item.newsDate"
 								placement="top"
-								v-for="(item, index) in personEventList"
+								v-for="(item, index) in curPerson.newsList"
 								:key="index"
 							>
 								<div class="timeline-content">
-									{{ item.sjnr }}
+									{{ item.newsContent }}
 								</div>
 							</el-timeline-item>
 							<!-- <el-timeline-item timestamp="2018/4/3" placement="top">
@@ -324,14 +325,14 @@
 					<div class="inner-right-main">
 						<el-timeline style="max-width: 840px">
 							<el-timeline-item
-								:timestamp="item.sjsj"
+								:timestamp="item.newsDate"
 								placement="top"
-								v-for="(item, index) in personEventList"
+								v-for="(item, index) in curPerson.newsList"
 								:key="index"
 							>
 								<div class="timeline-content1">
 									<div class="text">
-										{{ item.sjnr }}
+										{{ item.newsContent }}
 									</div>
 									<div class="pic">
 										<img src="./assets/imgs/img1.png" alt="" />
@@ -544,6 +545,7 @@ const handleGetBasicInfo = async () => {
 		const res = await getBillInfo(params);
 		console.log("基本信息", res);
 		basicInfo.value = res.data
+		basicInfo.value.stageList.reverse()
 	} catch (error) {
 		console.error(error);
 	}
@@ -552,24 +554,24 @@ const handleGetBasicInfo = async () => {
 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 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 () => {
@@ -601,9 +603,26 @@ const curPerson = ref({});
 const personEventList = ref([]);
 
 // 提出人 --动议id
-const handleGetBillPerson = async id => {
+// const handleGetBillPerson = async id => {
+// 	const params = {
+// 		id: id
+// 	};
+// 	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 : [];
+// 	} catch (error) {
+// 		console.error(error);
+// 	}
+// };
+
+// 法案提出人
+const handleGetBillPerson = async () => {
 	const params = {
-		id: id
+		billId: window.sessionStorage.getItem("billId")
 	};
 	try {
 		const res = await getBillPerson(params);
@@ -619,8 +638,9 @@ const handleGetBillPerson = async id => {
 
 onMounted(() => {
 	handleGetBasicInfo();
-	handleGetBillEvent();
+	// handleGetBillEvent();
 	handleGetBillDyqk();
+	handleGetBillPerson();
 });
 </script>
 
@@ -695,11 +715,11 @@ onMounted(() => {
 				.box1-right {
 					margin-left: 31px;
 					margin-top: 5px;
-					width: 623px;
+					// width: 623px;
 					height: 350px;
 					.box1-right-item {
 						display: flex;
-						margin-bottom: 24px;
+						margin-bottom: 21px;
 						.item-left {
 							width: 100px;
 							height: 14px;
@@ -722,7 +742,23 @@ onMounted(() => {
 						}
 						.item-right1 {
 							display: flex;
+							align-items: center;
+							width: 700px;
+							height: 40px;
+							overflow-x: auto;
+							overflow-y: hidden;
+							&::-webkit-scrollbar {
+								height: 4px;
+							}
+							&::-webkit-scrollbar-thumb {
+								border-radius: 4px;
+								background: #e1e1e1;
+							}
+							&::-webkit-scrollbar-track {
+								background: transparent;
+							}
 							.right1-item {
+								flex-shrink: 0;
 								margin-right: 10px;
 								padding: 1px 8px;
 								box-sizing: border-box;
@@ -774,10 +810,14 @@ onMounted(() => {
 								text-align: center;
 								position: relative;
 								.step-box {
-									padding: 0 10px 0 20px;
+									padding: 4px 10px;
 									color: #333;
 									position: relative;
-
+									font-size: 14px;
+									font-weight: 400;
+									font-family: "Microsoft YaHei";
+									line-height: 14px;
+									margin-left: 10px;
 									.right-arrow {
 										position: absolute;
 										right: -21px;
@@ -792,7 +832,7 @@ onMounted(() => {
 									}
 								}
 								.step-box-active {
-									padding: 0 12px;
+									padding: 4 10px;
 									color: #fff;
 									background: #ce4f51;
 									position: relative;
@@ -851,11 +891,13 @@ onMounted(() => {
 			box-shadow: 0px 0px 15px 0px rgba(22, 119, 255, 0.1);
 			.box2-main {
 				margin-top: 10px;
+				height: calc(100% - 70px); // Subtract header height
+				width: 100%;
 				.box2-main-center {
 					margin-left: 23px;
 					border-top: 1px solid rgba(243, 243, 244, 1);
-					// width: 100%;
-					height: 300px;
+					width: calc(100% - 46px); // Subtract margin
+					height: 100%;
 					// background: orange;
 					.box2-center-item {
 						display: flex;
@@ -1082,10 +1124,10 @@ onMounted(() => {
 				}
 			}
 			.right-main-box2 {
-				width: 576px;
-				height: 150px;
+				// width: 576px;
+				// height: 150px;
 				box-sizing: border-box;
-				padding: 10px 26px;
+				padding: 22px 26px;
 				// border-bottom: 1px solid rgb(243, 243, 244);
 				// display: flex;
 				// flex-wrap: wrap;
@@ -1140,7 +1182,7 @@ onMounted(() => {
 				}
 				.right-main-box3-main {
 					margin-top: 18px;
-					height: 299px;
+					height: 412px;
 					overflow-y: auto;
 				}
 				.right-main-box3-footer {
@@ -1330,6 +1372,10 @@ onMounted(() => {
 					color: var(--btn-active-text-color);
 				}
 			}
+			.inner-right-main {
+				height: 860px;
+				overflow: auto;
+			}
 		}
 	}
 }

src/views/bill/template/index.vue

@@ -16,9 +16,15 @@
 			</div>
 			<div class="left-top">
 				<el-select v-model="curBill" placeholder="请选择" style="width: 240px" @change="handleChangeBill">
-					<el-option v-for="item in billList" :key="item.value" :label="item.label" :value="item.id" />
+					<el-option v-for="item in billList" :key="item.id" :label="item.label" :value="item.value" />
 				</el-select>
-				<el-checkbox style="margin-left: 30px" v-model="checkedValue" label="只看涉华条款" size="large" />
+				<el-checkbox
+					style="margin-left: 30px"
+					v-model="checkedValue"
+					label="只看涉华条款"
+					size="large"
+					@change="handleChangeCheckbox"
+				/>
 				<div class="search" style="width: 240px; margin-left: 475px">
 					<el-input v-model="searchValue" style="width: 240px" placeholder="搜索条款" />
 					<div class="icon">
@@ -28,32 +34,32 @@
 			</div>
 			<div class="left-main">
 				<div class="left-main-item" v-for="(term, index) in mainTermsList" :key="index">
-					<div class="id">{{ index + 1 }}</div>
+					<div class="id">{{ (currentPage - 1) * pageSize + index + 1 }}</div>
 					<div class="info">
 						<div class="title">
-							<span class="title-active">{{ term.header }}</span>
-							{{ term.title }}
+							<span class="title-active">第{{ term.tkxh }}条.</span>
+							{{ term.fynr }}
 						</div>
 						<div class="content">
-							<span class="content-active">{{ term.headerEn }}</span>
-							{{ term.content }}
+							<span class="content-active">Sec.{{ term.tkxh }}</span>
+							{{ term.ywnr }}
 						</div>
 					</div>
 					<div class="tags-box">
 						<div
 							class="tag"
-							v-for="(val, idx) in term.tags"
+							v-for="(val, idx) in (term.hylyList || []).slice(0, 2)"
 							:key="idx"
 							:class="{
-								tag1: val.status === 1,
-								tag2: val.status === 2,
-								tag3: val.status === 3,
-								tag4: val.status === 4,
-								tag5: val.status === 5,
-								tag6: val.status === 6
+								'tag1': val === '人工智能',
+								'tag2': val === '新一代信息技术' || !['人工智能', '政治', '经济', '军事', '科技'].includes(val),
+								'tag3': val === '政治',
+								'tag4': val === '经济',
+								'tag5': val === '军事',
+								'tag6': val === '科技'
 							}"
 						>
-							{{ val.name }}
+							{{ val }}
 						</div>
 					</div>
 					<div class="open">
@@ -63,10 +69,17 @@
 			</div>
 			<div class="left-footer">
 				<div class="left-footer-text">
-					{{ "共96条涉华条款" }}
+					{{ `共${total}条${checkedValue ? "涉华" : ""}条款` }}
 				</div>
 				<div class="left-footer-right">
-					<el-pagination background layout="prev, pager, next" :total="96" />
+					<el-pagination
+						background
+						layout="prev, pager, next"
+						:total="total"
+						v-model:current-page="currentPage"
+						v-model:page-size="pageSize"
+						@current-change="handleCurrentChange"
+					/>
 				</div>
 			</div>
 		</div>
@@ -137,16 +150,12 @@ import { getBillContentId, getBillContentTk, getBillContentXzfs, getBillHyly } f
 
 const curBill = ref("");
 const curBillId = ref(null);
-const billList = ref([
-	{
-		value: "公法（2025年7月4日）",
-		label: "公法（2025年7月4日）"
-	},
-	{
-		value: "公法（2025年7月8日）",
-		label: "公法（2025年7月8日）"
-	}
-]);
+const checkedValue = ref(false);
+const searchValue = ref("");
+const billList = ref([]);
+const currentPage = ref(1);
+const pageSize = ref(10);
+const total = ref(0);
 
 const mainTermsList = ref([
 	{
@@ -351,7 +360,13 @@ const setChart = (option, chartId) => {
 
 // 切换原文
 const handleChangeBill = val => {
-	curBillId.value = val;
+	curBill.value = val;
+	const item = billList.value.find(item => item.value === val);
+	if (item) {
+		curBillId.value = item.id;
+		currentPage.value = 1;
+		handleGetBillContentTk(checkedValue.value ? "Y" : "N");
+	}
 };
 
 // 获取法案id列表
@@ -369,22 +384,69 @@ const handleGetBillList = async () => {
 				id: item.ywid
 			};
 		});
-		curBill.value = billList.value[0].label;
-		curBillId.value = billList.value[0].id;
+		if (billList.value.length > 0) {
+			curBill.value = billList.value[0].value;
+			curBillId.value = billList.value[0].id;
+		}
 	} catch (error) {}
 };
 
+const handleChangeCheckbox = val => {
+	currentPage.value = 1;
+	handleGetBillContentTk(val ? "Y" : "N");
+};
+
+const handleCurrentChange = val => {
+	currentPage.value = val;
+	handleGetBillContentTk(checkedValue.value ? "Y" : "N");
+};
+
 // 根据原文ID获取条款列表
 const handleGetBillContentTk = async cRelated => {
 	const params = {
-		id: curBillId.value,
+		billid: window.sessionStorage.getItem("billId"),
+		id: curBill.value,
 		cRelated: cRelated,
-		currentPage: 0,
-		pageSize: 10
+		currentPage: currentPage.value - 1,
+		pageSize: pageSize.value
 	};
 	try {
 		const res = await getBillContentTk(params);
 		console.log("条款内容", res);
+		mainTermsList.value = res.data.content.map(item => {
+			// 处理 fynr
+			if (item.fynr) {
+				const matchComplex = item.fynr.match(/^(?:正文内容[:：]\s*)?[“"]?\s*第\s*([0-9a-zA-Z]+)\s*[条节][:：\.\。]?[”"]?\s*/);
+				if (matchComplex) {
+					// 匹配 "第xxx条"、"正文内容：第xxx条"、"“第xxx条" 等
+					if (!item.tkxh) {
+						item.tkxh = matchComplex[1];
+					}
+					item.fynr = item.fynr.replace(matchComplex[0], "");
+				} else {
+					// 匹配 "xxx."
+					item.fynr = item.fynr.replace(/^\d+\.\s*/, "");
+				}
+			}
+			// 处理 ywnr
+			if (item.ywnr) {
+				const matchSec = item.ywnr.match(/^(?:SEC\.|SECTION)\s*([0-9a-zA-Z]+)[\.:]?\s*/i);
+				if (matchSec) {
+					if (!item.tkxh) {
+						item.tkxh = matchSec[1];
+					}
+					item.ywnr = item.ywnr.replace(matchSec[0], "");
+				} else {
+					item.ywnr = item.ywnr.replace(/^\d+\.\s*/, "");
+				}
+			}
+			// 处理 tkxh 末尾的点
+			if (item.tkxh) {
+				item.tkxh = item.tkxh.replace(/\.$/, "");
+			}
+			return item;
+		});
+		total.value = res.data.totalElements;
 	} catch (error) {}
 };
 
@@ -430,7 +492,7 @@ const handleGetBillHyly = async () => {
 
 onMounted(async () => {
 	await handleGetBillList();
-	handleGetBillContentTk(false);
+	handleGetBillContentTk("N");
 	await handleGetBillContentXzfs();
 	await handleGetBillHyly();
 	let chart1 = getPieChart(chart1Data.value, chart1ColorList.value);
@@ -528,6 +590,7 @@ onMounted(async () => {
 				border-radius: 2px;
 				background: rgba(255, 255, 255, 1);
 				display: flex;
+				position: relative;
 				.id {
 					margin-top: 20px;
 					margin-left: 15px;
@@ -543,7 +606,7 @@ onMounted(async () => {
 				.info {
 					margin-left: 13px;
 					margin-top: 15px;
-					width: 813px;
+					width: 780px;
 					.title {
 						height: 14px;
 						color: rgba(59, 65, 75, 1);
@@ -577,20 +640,19 @@ onMounted(async () => {
 					}
 				}
 				.tags-box {
-					margin-left: 20px;
-					margin-top: 21px;
-					width: 160px;
-					height: 22px;
 					display: flex;
-					justify-content: flex-end;
+					justify-content: right;
+					align-items: center;
+					flex: 1;
+					margin-right: 50px;
 					.tag {
-						height: 18px;
+						text-align: right;
 						line-height: 18px;
-						padding: 0 8px;
+						padding: 1px 8px;
 						border-radius: 4px;
 						margin-left: 5px;
 						font-size: 12px;
-						font-family: Microsoft YaHei;
+						font-family: "Microsoft YaHei";
 						font-size: 14px;
 						font-weight: 400;
 					}
@@ -626,8 +688,9 @@ onMounted(async () => {
 					}
 				}
 				.open {
-					margin-left: 10px;
-					margin-top: 22px;
+					position: absolute;
+					top: 22px;
+					right: 23px;
 					width: 20px;
 					height: 20px;
 					img {

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

@@ -4,6 +4,7 @@ const getPieChart = (data,colorList) => {
     series: [
       {
       type: 'pie',
+      minAngle: 28,
       radius: [70, 100],
       height: '100%',
       left: 'center',
@@ -38,7 +39,9 @@ const getPieChart = (data,colorList) => {
           ? params.labelRect.x
           : params.labelRect.x + params.labelRect.width;
         return {
-          labelLinePoints: points
+          labelLinePoints: points,
+          hideOverlap: false,
+          moveOverlap: 'shiftY'
         };
       },
       data: data