feat:更新数据资源库

src/components/base/GraphChart/graphChart.js

@@ -41,6 +41,12 @@ const getGraphChart = (nodes, links, layoutType) => {
       itemStyle: {
         color: '#73C0DE'
       },
+
+      // 方法1：通过 left/right/top/bottom 控制绘图区域
+      left: '5%',
+      right: '5%',
+      top: '5%',
+      bottom: '5%',
       layout: layoutType,
       data: nodes,
       links: links,

src/components/base/GraphChart/index.vue

@@ -52,5 +52,7 @@ onBeforeUnmount(() => {
 .graph-chart-wrapper {
   width: 100%;
   height: 100%;
+  // width: 800px;
+  // height: 500px;
 }
 </style>
\ No newline at end of file

src/styles/components/GraphChart/index.vue

@@ -11,7 +11,7 @@
 `}}
 </pre>
       <div class="chart-box">
-        <GraphChart :nodes="nodes" :links="links" layoutType="none">
+        <GraphChart :nodes="nodes" :links="links" layoutType="force">
         </GraphChart>
       </div>
     </el-col>
@@ -207,6 +207,7 @@ const links = ref([
   { source: 15, target: 7, label: { show: true, formatter: '合作', color: 'red', borderColor: 'red' } },
 ]);
 
+
 </script>
 
 <style lang="scss" scoped>
@@ -218,5 +219,4 @@ const links = ref([
   width: 800px;
   height: 500px;
 }
-
 </style>
\ No newline at end of file

src/utils/setChart.js

 // 绘制echarts图表
 import * as echarts from 'echarts'
 import 'echarts-wordcloud';
-const setChart = (option, chartId) => {
+import router from '@/router/index'
+const setChart = (option, chartId, allowClick, selectParam) => {
   let chartDom = document.getElementById(chartId);
   if (!chartDom) {
     return null;
@@ -9,6 +10,26 @@ const setChart = (option, chartId) => {
   chartDom.removeAttribute("_echarts_instance_");
   let chart = echarts.init(chartDom);
   chart.setOption(option);
+  if (allowClick) {
+    // 3. 添加点击事件监听
+    chart.on('click', function (params) {
+      switch (selectParam.moduleType) {
+        case '国会法案':
+          // 判断点击的是否为饼图的数据项
+          if (params.componentType === 'series' && params.seriesType === 'pie') {
+            console.log('点击的扇形名称：', params.name);
+            selectParam.domains = JSON.stringify([params.name])
+            const route = router.resolve({
+              path: "/dataLibrary/countryBill",
+              query: selectParam
+            });
+            window.open(route.href, "_blank");
+          }
+
+      }
+
+    });
+  }
   // 容器可能受布局/异步渲染影响，强制一次 resize 保证 canvas 与容器一致
   setTimeout(() => {
     chart.resize();

src/views/bill/billHome/index.vue

@@ -40,8 +40,7 @@
 					<div class="center-top">
 						<overviewMainBox class="box1" title="热门法案" @toDetail="handleClickToDetail">
 							<template #headerIcon>
-								<img style="width: 100%; height: 100%" src="./assets/images/box1-header-icon.png"
-									alt="" />
+								<img style="width: 100%; height: 100%" src="./assets/images/box1-header-icon.png" alt="" />
 							</template>
 							<div class="box1-left" @click="handleSwithCurBill('left')">
 								<div class="icon">
@@ -122,27 +121,23 @@
 
 					<DivideHeader id="position2" class="divide2" :titleText="'资讯要闻'"></DivideHeader>
 					<div class="center-center">
-						<NewsList :newsList="newsList" img="newsImage" title="newsTitle" from="from"
-							content="newsContent" />
-						<MessageBubble :messageList="messageList" imageUrl="personImage"
-							@more-click="handleToSocialDetail" @person-click="handleClickToCharacter" name="personName"
-							content="remarks" source="orgName" />
+						<NewsList :newsList="newsList" img="newsImage" title="newsTitle" from="from" content="newsContent" />
+						<MessageBubble :messageList="messageList" imageUrl="personImage" @more-click="handleToSocialDetail"
+							@person-click="handleClickToCharacter" name="personName" content="remarks" source="orgName" />
 					</div>
 
 					<DivideHeader id="position3" class="divide3" :titleText="'数据总览'"></DivideHeader>
 					<div class="center-footer">
 						<OverviewCard class="overview-card--double box5" title="涉华法案数量变化趋势" :icon="box5HeaderIcon">
 							<template #right>
-								<el-select v-model="box5Select" placeholder="选择领域" @change="handleBox5Change"
-									style="width: 150px">
+								<el-select v-model="box5Select" placeholder="选择领域" @change="handleBox5Change" style="width: 150px">
 									<el-option label="全部领域" value="全部领域" />
-									<el-option v-for="item in categoryList" :key="item.id" :label="item.name"
-										:value="item.id" />
+									<el-option v-for="item in categoryList" :key="item.id" :label="item.name" :value="item.id" />
 								</el-select>
 								<el-select v-model="box5ProposalTime" placeholder="提案时间" @change="handleBox5Change"
 									style="width: 120px; margin-left: 8px">
-									<el-option v-for="item in box5ProposalTimeList" :key="item.value"
-										:label="item.label" :value="item.value" />
+									<el-option v-for="item in box5ProposalTimeList" :key="item.value" :label="item.label"
+										:value="item.value" />
 								</el-select>
 							</template>
 							<div class="overview-card-body box5-main">
@@ -154,8 +149,7 @@
 									<TipTab class="overview-tip" />
 									<AiButton class="overview-tip-action" @mouseenter="handleShowAiPane('box5')" />
 								</div>
-								<div v-if="aiPaneVisible.box5" class="overview-ai-pane"
-									@mouseleave="handleHideAiPane('box5')">
+								<div v-if="aiPaneVisible.box5" class="overview-ai-pane" @mouseleave="handleHideAiPane('box5')">
 									<AiPane :aiContent="overviewAiContent.box5" />
 								</div>
 							</div>
@@ -163,13 +157,12 @@
 						<OverviewCard class="overview-card--single box6" title="涉华法案领域分布" :icon="box6HeaderIcon">
 							<template #right>
 								<el-select v-model="box9selectetedTime" placeholder="选择时间" style="width: 90px">
-									<el-option v-for="item in box9YearList" :key="item.value" :label="item.label"
-										:value="item.value" />
+									<el-option v-for="item in box9YearList" :key="item.value" :label="item.label" :value="item.value" />
 								</el-select>
 								<el-select v-model="box9LegislativeStatus" placeholder="立法状态" @change="handleBox9StatusChange"
 									style="width: 110px; margin-left: 8px">
-									<el-option v-for="item in box9LegislativeStatusList" :key="item.value"
-										:label="item.label" :value="item.value" />
+									<el-option v-for="item in box9LegislativeStatusList" :key="item.value" :label="item.label"
+										:value="item.value" />
 								</el-select>
 							</template>
 							<div class="overview-card-body box6-main">
@@ -181,8 +174,7 @@
 									<TipTab class="overview-tip" />
 									<AiButton class="overview-tip-action" @mouseenter="handleShowAiPane('box6')" />
 								</div>
-								<div v-if="aiPaneVisible.box6" class="overview-ai-pane"
-									@mouseleave="handleHideAiPane('box6')">
+								<div v-if="aiPaneVisible.box6" class="overview-ai-pane" @mouseleave="handleHideAiPane('box6')">
 									<AiPane :aiContent="overviewAiContent.box6" />
 								</div>
 							</div>
@@ -192,8 +184,7 @@
 						<OverviewCard class="overview-card--single box7" title="涉华法案提出部门" :icon="box7HeaderIcon">
 							<template #right>
 								<el-select v-model="box7selectetedTime" placeholder="选择时间" style="width: 90px">
-									<el-option v-for="item in box7YearList" :key="item.value" :label="item.label"
-										:value="item.value" />
+									<el-option v-for="item in box7YearList" :key="item.value" :label="item.label" :value="item.value" />
 								</el-select>
 							</template>
 							<div class="overview-card-body box7-main">
@@ -205,8 +196,7 @@
 									<TipTab class="overview-tip" />
 									<AiButton class="overview-tip-action" @mouseenter="handleShowAiPane('box7')" />
 								</div>
-								<div v-if="aiPaneVisible.box7" class="overview-ai-pane"
-									@mouseleave="handleHideAiPane('box7')">
+								<div v-if="aiPaneVisible.box7" class="overview-ai-pane" @mouseleave="handleHideAiPane('box7')">
 									<AiPane :aiContent="overviewAiContent.box7" />
 								</div>
 							</div>
@@ -214,8 +204,7 @@
 						<OverviewCard class="overview-card--single box8" title="涉华法案进展分布" :icon="box7HeaderIcon">
 							<template #right>
 								<el-select v-model="box8selectetedTime" placeholder="选择时间" style="width: 90px">
-									<el-option v-for="item in box8YearList" :key="item.value" :label="item.label"
-										:value="item.value" />
+									<el-option v-for="item in box8YearList" :key="item.value" :label="item.label" :value="item.value" />
 								</el-select>
 							</template>
 							<div class="overview-card-body box8-main">
@@ -230,8 +219,7 @@
 									<TipTab class="overview-tip" />
 									<AiButton class="overview-tip-action" @mouseenter="handleShowAiPane('box8')" />
 								</div>
-								<div v-if="aiPaneVisible.box8" class="overview-ai-pane"
-									@mouseleave="handleHideAiPane('box8')">
+								<div v-if="aiPaneVisible.box8" class="overview-ai-pane" @mouseleave="handleHideAiPane('box8')">
 									<AiPane :aiContent="overviewAiContent.box8" />
 								</div>
 							</div>
@@ -240,15 +228,13 @@
 							<div class="overview-card-body box9-main">
 								<div class="overview-chart-wrap">
 									<el-empty v-if="!wordCloudHasData" description="暂无数据" :image-size="100" />
-									<WordCloundChart v-else class="overview-chart" width="100%" height="100%"
-										:data="wordCloudData" />
+									<WordCloundChart v-else class="overview-chart" width="100%" height="100%" :data="wordCloudData" />
 								</div>
 								<div class="overview-tip-row">
 									<TipTab class="overview-tip" />
 									<AiButton class="overview-tip-action" @mouseenter="handleShowAiPane('box9')" />
 								</div>
-								<div v-if="aiPaneVisible.box9" class="overview-ai-pane"
-									@mouseleave="handleHideAiPane('box9')">
+								<div v-if="aiPaneVisible.box9" class="overview-ai-pane" @mouseleave="handleHideAiPane('box9')">
 									<AiPane :aiContent="overviewAiContent.box9" />
 								</div>
 							</div>
@@ -258,8 +244,7 @@
 			</div>
 			<div class="home-content-footer">
 				<DivideHeader id="position4" class="divide4" :titleText="'资源库'"></DivideHeader>
-				<ResourceLibrarySection :on-click-to-detail="handleClickToDetailO"
-					:on-after-page-change="handlePageChange" />
+				<ResourceLibrarySection :on-click-to-detail="handleClickToDetailO" :on-after-page-change="handlePageChange" />
 			</div>
 		</div>
 	</div>
@@ -285,7 +270,7 @@ import {
 import { getPersonSummaryInfo } from "@/api/common/index";
 import { getChartAnalysis } from "@/api/aiAnalysis/index";
 import DivideHeader from "@/components/DivideHeader.vue";
-import overviewMainBox from "@/components/base/boxBackground/overviewMainBox.vue";
+import overviewMainBox from "@/components/base/BoxBackground/OverviewMainBox.vue";
 import OverviewCard from "./OverviewCard.vue";
 import ResourceLibrarySection from "./ResourceLibrarySection.vue";
 import { useContainerScroll } from "@/hooks/useScrollShow";
@@ -974,7 +959,13 @@ const handleBox9Data = async () => {
 			null,
 			{ showCount: false }
 		);
-		box9ChartInstance = setChart(box9Chart, "box9Chart");
+		const selectParam = {
+			moduleType: '国会法案',
+			proposedDateStart: box9selectetedTime.value,
+			status: box9LegislativeStatus.value === '提出法案' ? 0 : 1
+
+		}
+		box9ChartInstance = setChart(box9Chart, "box9Chart", true, selectParam);
 	}
 };
 

src/views/dataLibrary/components/ChartContainer/index.vue

@@ -100,16 +100,6 @@ const chartItemList = computed(() => {
   return arr
 })
 
-// nextTick(() => {
-//   let arr = chartItemList.value.filter(item => item.active)
-//   if(!arr.length) {
-//     alert(1)
-//     chartItemList.value[0].active = true
-//   }
-// })
-
-
-
 </script>
 
 <style lang="scss" scoped>