feat 修改部分样式，重新接入法案数量接口

.gitlab-ci.yml

@@ -14,7 +14,9 @@ build_pre:
   stage: build
   image: node:20-bullseye
   tags:
-    - risk-monitor-frontend
+    - docker
+    - frontend
+    - linux
   only:
     - pre
   script:
@@ -49,7 +51,7 @@ deploy_pre:
       LATEST_PIPELINE_ID="$(
       curl --silent --show-error --fail
       --header "JOB-TOKEN: $CI_JOB_TOKEN"
-      "$CI_SERVER_URL/api/v4/projects/$CI_PROJECT_ID/pipelines?ref=pre&order_by=id&sort=desc&per_page=1"
+      "${CI_PROJECT_URL%/*/*}/api/v4/projects/$CI_PROJECT_ID/pipelines?ref=pre&order_by=id&sort=desc&per_page=1"
       | jq -r '.[0].id'
       )"
     - >

src/views/bill/billHome/index.vue

@@ -25,7 +25,9 @@
 					</div>
 					<div class="committee-cards-row">
 						<div v-for="item in committeeCardList" :key="item.id" class="committee-card">
-							<div class="committee-card-icon"></div>
+							<div class="committee-card-icon">
+								<img :src="iconCommit" alt="委员会头像" />
+							</div>
 							<div class="committee-card-content">
 								<div class="committee-card-name">{{ item.name }}</div>
 								<div class="committee-card-chamber">{{ item.chamber }}</div>
@@ -287,7 +289,7 @@ import getDoublePieChart from "./utils/doublePieChart";
 import box5HeaderIcon from "./assets/images/box5-header-icon.png";
 import box6HeaderIcon from "./assets/images/box6-header-icon.png";
 import box7HeaderIcon from "./assets/images/box7-header-icon.png";
-
+import iconCommit from "./assets/icons/icon-commit.png";
 
 import { ElMessage } from "element-plus";
 import { Calendar } from "@element-plus/icons-vue";
@@ -503,13 +505,9 @@ const buildAiChartPayload = key => {
 		const title = Array.isArray(box5Data.value.title) ? box5Data.value.title : [];
 		const proposed = box5Data.value?.data?.[0]?.value || [];
 		const passed = box5Data.value?.data?.[1]?.value || [];
-		const rate =
-			box5Data.value.percent ||
-			title.map((_, i) => {
-				const p = Number(proposed[i] || 0);
-				const pass = Number(passed[i] || 0);
-				return p ? Number(((pass / p) * 100).toFixed(2)) : 0;
-			});
+		const housePassed = box5Data.value?.data?.[2]?.value || [];
+		const senatePassed = box5Data.value?.data?.[3]?.value || [];
+		const hsPassed = box5Data.value?.data?.[4]?.value || [];
 		return {
 			type: "折线图",
 			name: "涉华法案数量变化趋势",
@@ -517,7 +515,9 @@ const buildAiChartPayload = key => {
 				month,
 				proposed: Number(proposed[i] || 0),
 				passed: Number(passed[i] || 0),
-				pass_rate: Number(rate[i] || 0)
+				house_passed: Number(housePassed[i] || 0),
+				senate_passed: Number(senatePassed[i] || 0),
+				hs_passed: Number(hsPassed[i] || 0)
 			}))
 		};
 	}
@@ -750,6 +750,18 @@ const box5Data = ref({
 		{
 			name: "通过法案",
 			value: [6, 3, 4, 6, 11, 5, 2, 14, 16, 27, 28, 44]
+		},
+		{
+			name: "众议院通过",
+			value: []
+		},
+		{
+			name: "参议院通过",
+			value: []
+		},
+		{
+			name: "双院通过",
+			value: []
 		}
 	]
 });
@@ -772,11 +784,23 @@ const handleGetBillCount = async () => {
 				data: [
 					{
 						name: "提出法案",
-						value: sortedData.map(item => item.totalCount)
+						value: sortedData.map(item => item.proposedCount)
 					},
 					{
 						name: "通过法案",
 						value: sortedData.map(item => item.passCount)
+					},
+					{
+						name: "众议院通过",
+						value: sortedData.map(item => item.houseCount)
+					},
+					{
+						name: "参议院通过",
+						value: sortedData.map(item => item.senateCount)
+					},
+					{
+						name: "双院通过",
+						value: sortedData.map(item => item.hscount)
 					}
 				],
 				percent: sortedData.map(item => item.percent)
@@ -788,7 +812,10 @@ const handleGetBillCount = async () => {
 				title: [],
 				data: [
 					{ name: "提出法案", value: [] },
-					{ name: "通过法案", value: [] }
+					{ name: "通过法案", value: [] },
+					{ name: "众议院通过", value: [] },
+					{ name: "参议院通过", value: [] },
+					{ name: "双院通过", value: [] }
 				],
 				percent: []
 			};
@@ -801,7 +828,10 @@ const handleGetBillCount = async () => {
 			title: [],
 			data: [
 				{ name: "提出法案", value: [] },
-				{ name: "通过法案", value: [] }
+				{ name: "通过法案", value: [] },
+				{ name: "众议院通过", value: [] },
+				{ name: "参议院通过", value: [] },
+				{ name: "双院通过", value: [] }
 			],
 			percent: []
 		};
@@ -814,13 +844,17 @@ const handleBox5 = async () => {
 		await nextTick();
 		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;
-			});
-		const box5Chart = getMultiLineChart(box5Data.value.title, proposed, passed, rate);
+		const housePassed = box5Data.value.data[2].value;
+		const senatePassed = box5Data.value.data[3].value;
+		const hsPassed = box5Data.value.data[4].value;
+		const box5Chart = getMultiLineChart(
+			box5Data.value.title,
+			proposed,
+			passed,
+			housePassed,
+			senatePassed,
+			hsPassed
+		);
 		const domain = categoryList.value.filter(item => {
 			return item.id === box5Select.value
 		})[0]?.name
@@ -1693,6 +1727,14 @@ onUnmounted(() => {
 							border-radius: 50%;
 							background: var(--color-primary-10);
 							flex-shrink: 0;
+							overflow: hidden;
+
+							img {
+								width: 100%;
+								height: 100%;
+								display: block;
+								object-fit: cover;
+							}
 						}
 
 						.committee-card-content {

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

 import * as echarts from 'echarts'
+import { MUTICHARTCOLORS } from '../../../../common/constant'
+
+const getMultiLineChart = (dataX, proposedData, passData, houseData, senateData, hsData) => {
+  const lineColors = MUTICHARTCOLORS.slice(0, 5)
+  const hexToRgba = (hex, alpha) => {
+    if (typeof hex !== 'string' || !hex.startsWith('#')) return hex
+    const normalized = hex.replace('#', '')
+    const full = normalized.length === 3
+      ? normalized.split('').map(c => c + c).join('')
+      : normalized
+    const r = parseInt(full.slice(0, 2), 16)
+    const g = parseInt(full.slice(2, 4), 16)
+    const b = parseInt(full.slice(4, 6), 16)
+    return `rgba(${r}, ${g}, ${b}, ${alpha})`
+  }
+  const getAreaColor = color => new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+    offset: 0,
+    color: hexToRgba(color, 0.35)
+  }, {
+    offset: 1,
+    color: hexToRgba(color, 0)
+  }])
 
-const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
   return {
     tooltip: {
       trigger: 'item',
@@ -28,7 +49,7 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
       containLabel: true
     },
     legend: {
-      data: ['提出法案', '通过法案', '通过率'],
+      data: ['提出法案', '通过法案', '众议院通过', '参议院通过', '双院通过'],
       show: true,
       top: 10,
       icon: 'circle',
@@ -38,7 +59,7 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
         fontSize: '14px',
       }
     },
-    color: ['#1677FF', '#FA8C16', '#D9001B'],
+    color: lineColors,
     xAxis: [
       {
         type: 'category',
@@ -65,7 +86,6 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
       {
         type: 'value',
         position: 'left',
-        // 纵轴单位只在纵轴上方显示一次（通过 axis.name），避免每个刻度重复显示
         name: '项',
         nameLocation: 'end',
         nameGap: 12,
@@ -73,51 +93,20 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
           color: '#666',
           fontSize: 14,
           fontWeight: 400,
-          // 给单位一点点下移空间，使其更贴近顶部刻度数字的视觉基线
           padding: [0, 0, 6, -20]
         },
         axisLabel: {
-            formatter: '{value}',
-            color: '#666',
-            fontSize: 14,
-            fontWeight: 400
-        },
-        splitLine: {
-            show: true,
-            lineStyle: {
-                color: '#e7f3ff',
-                type: 'dashed',
-            }
-        },
-      },
-      {
-        type: 'value',
-        position: 'right',
-        min: 0,
-        max: 100,
-        interval: 20,
-        // 通过率单位仅展示一次
-        name: '%',
-        nameLocation: 'end',
-        nameGap: 12,
-        nameTextStyle: {
+          formatter: '{value}',
           color: '#666',
           fontSize: 14,
-          fontWeight: 400,
-          padding: [0, 0, 6, 20]
-        },
-        axisLabel: {
-            formatter: '{value}',
-            color: '#666',
-            fontSize: 14,
-            fontWeight: 400
+          fontWeight: 400
         },
         splitLine: {
-            show: true,
-            lineStyle: {
-                color: '#e7f3ff',
-                type: 'dashed',
-            }
+          show: true,
+          lineStyle: {
+            color: '#e7f3ff',
+            type: 'dashed',
+          }
         },
       }
     ],
@@ -129,18 +118,12 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
         symbol: 'emptyCircle',
         symbolSize: 6,
         areaStyle: {
-          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-            offset: 0,
-            color: 'rgba(22, 119, 255, 0.4)' // 起始颜色
-          }, {
-            offset: 1,
-            color: 'rgba(22, 119, 255, 0)' // 结束颜色
-          }])
+          color: getAreaColor(lineColors[0])
         },
         itemStyle: {
-            color: '#1677FF'
+          color: lineColors[0]
         },
-        data: dataY1
+        data: proposedData
       },
       {
         name: '通过法案',
@@ -149,34 +132,54 @@ const getMultiLineChart = (dataX, dataY1, dataY2, dataY3) => {
         symbol: 'emptyCircle',
         symbolSize: 6,
         areaStyle: {
-          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-            offset: 0,
-            color: 'rgba(250, 140, 22, 0.4)' // 起始颜色
-          }, {
-            offset: 1,
-            color: 'rgba(250, 140, 22, 0)' // 结束颜色
-          }])
+          color: getAreaColor(lineColors[1])
         },
         itemStyle: {
-            color: '#FA8C16'
+          color: lineColors[1]
         },
-        data: dataY2
+        data: passData
       },
       {
-        name: '通过率',
+        name: '众议院通过',
         type: 'line',
-        yAxisIndex: 1,
         smooth: true,
         symbol: 'emptyCircle',
-        symbolSize: 4,
-        lineStyle: {
-            type: 'dashed',
-            width: 2
+        symbolSize: 6,
+        areaStyle: {
+          color: getAreaColor(lineColors[2])
+        },
+        itemStyle: {
+          color: lineColors[2]
+        },
+        data: houseData
+      },
+      {
+        name: '参议院通过',
+        type: 'line',
+        smooth: true,
+        symbol: 'emptyCircle',
+        symbolSize: 6,
+        areaStyle: {
+          color: getAreaColor(lineColors[3])
+        },
+        itemStyle: {
+          color: lineColors[3]
+        },
+        data: senateData
+      },
+      {
+        name: '双院通过',
+        type: 'line',
+        smooth: true,
+        symbol: 'emptyCircle',
+        symbolSize: 6,
+        areaStyle: {
+          color: getAreaColor(lineColors[4])
         },
         itemStyle: {
-            color: '#D9001B'
+          color: lineColors[4]
         },
-        data: dataY3
+        data: hsData
       }
     ]
   }

src/views/bill/introdoction/index.vue

@@ -253,7 +253,7 @@ const partyIconUrl = computed(() => {
 
 const reversedStageList = computed(() => {
 	const list = Array.isArray(basicInfo.value?.stageList) ? basicInfo.value.stageList : [];
-	return [...list].reverse();
+	return [...list];
 });
 const stageListLength = computed(() => (Array.isArray(basicInfo.value?.stageList) ? basicInfo.value.stageList.length : 0));
 const stageActiveIndex = computed(() => stageListLength.value - 1);