代码合并

src/api/bill.js

@@ -192,3 +192,30 @@ export function getBillFullText(params) {
         params,
     })
 }
+
+// 条款对比-根据两版版本与筛选条件获取配对条款列表
+/**
+ * @param {billId,oldVersionId,newVersionId,diffType,cRelated,keyword}
+ * @header token
+ * @returns { list: Array<{ oldTerm: object|null, newTerm: object|null }> }
+ */
+export function getBillTermsCompare(params) {
+    return request({
+        method: "GET",
+        url: "/api/billInfoBean/content/compare",
+        params,
+    });
+}
+
+// 版本对比-根据两版版本与筛选条件获取条款列表（分页）
+/**
+ * @param {billId,content,currentPage,currentVersion,isCn,originalVersion,pageSize,status}
+ * @header token
+ */
+export function getBillVersionCompare(params) {
+    return request({
+        method: "GET",
+        url: "/api/billInfoBean/versionCompare",
+        params,
+    });
+}

src/components/base/ActionButton/index.vue

@@ -17,7 +17,7 @@ defineProps({
 })
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .action-button {
   height: 28px;
   padding: 0 8px;
@@ -29,11 +29,16 @@ defineProps({
   font-size: 16px;
   font-weight: 400;
   transition: all 0.3s;
+
 }
 
 .action-button[type="normal"] {
   background-color: rgba(255, 255, 255, 1);
   color: rgba(59, 65, 75, 1);
+
+  &:hover {
+    background: var(--color-primary-2);
+  }
 }
 
 .action-button[type="active"] {
@@ -52,6 +57,4 @@ defineProps({
 .action-button[type="active"]:hover {
   background-color: #40a9ff;
 } */
-
-
 </style>
\ No newline at end of file

src/components/base/Ai/AiSummary/bg.svg

+<svg viewBox="0 0 1019 61" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1019.000000" height="61.000000" fill="none" customFrame="#000000">
+	<defs>
+		<linearGradient id="paint_linear_1" x1="7.60449219" x2="10.1398888" y1="-1.90734863e-06" y2="61.0955963" gradientUnits="userSpaceOnUse">
+			<stop stop-color="rgb(231,243,255)" offset="0" stop-opacity="1" />
+			<stop stop-color="rgb(231,243,255)" offset="1" stop-opacity="0" />
+		</linearGradient>
+	</defs>
+	<path id="矩形 5734" d="M0.000322558 0L1019 0L1019 31.5006L0 61.0008L0.000322558 0Z" fill="url(#paint_linear_1)" fill-rule="evenodd" />
+</svg>

src/components/base/Ai/AiSummary/icon1.svg

+<svg viewBox="0 0 15 12" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="15.000000" height="12.000000" fill="none" customFrame="url(#clipPath_0)">
+	<defs>
+		<clipPath id="clipPath_0">
+			<rect width="15.000000" height="12.000000" x="0.000000" y="0.000000" rx="6.000000" fill="rgb(255,255,255)" />
+		</clipPath>
+		<linearGradient id="paint_linear_0" x1="7.49999952" x2="7.49999952" y1="0" y2="10.5" gradientUnits="userSpaceOnUse">
+			<stop stop-color="rgb(5,95,194)" offset="0" stop-opacity="1" />
+			<stop stop-color="rgb(137,193,255)" offset="1" stop-opacity="1" />
+		</linearGradient>
+	</defs>
+	<rect id="AI-logo" width="15.000000" height="12.000000" x="0.000000" y="0.000000" rx="6.000000" />
+	<path id="合并" d="M12.2098 1.46629C12.9076 0.916637 13.2563 0 13.2563 0C13.2563 0 13.1693 0.916623 13.6052 1.46629C14.0411 2.01595 15 2.19866 15 2.19866C15 2.19866 13.9535 2.38224 13.2559 2.93288C12.5583 3.48351 12.2095 4.40121 12.2095 4.40121C12.2095 4.40121 12.2966 3.48353 11.8605 2.93288C11.4245 2.38222 10.4653 2.1986 10.4653 2.1986C10.4653 2.1986 11.5121 2.01594 12.2098 1.46629ZM8.176 2.20032L9.23888 10.5L6.83718 10.5L6.55783 8.24068L3.20908 8.24068L2.27565 10.5L0 10.5L3.08303 2.61208L2.68105 2.20032L8.176 2.20032ZM5.09297 3.60747L3.75415 6.83353L6.43179 6.83353L6.0298 3.60747L5.09297 3.60747ZM13.0741 10.4999L13.9839 4.57493L10.7578 4.57493L11.1632 5.13349L10.5361 10.4999L13.0741 10.4999Z" fill="url(#paint_linear_0)" fill-rule="evenodd" />
+</svg>

src/components/base/Ai/AiSummary/icon2.svg

+<svg viewBox="0 0 6.70703 13.4102" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="6.707031" height="13.410156" fill="none" customFrame="#000000">
+	<rect id="容器 848" width="6.000000" height="11.997072" x="0.353516" y="0.707031" />
+	<path id="矢量 626" d="M0 0L2.99854 2.99854L6 0" stroke="rgb(5,95,194)" stroke-width="1.000000" transform="matrix(1,0,0,-1,0.353516,3.70508)" />
+	<path id="矢量 627" d="M0.353516 9.70508L3.35205 12.7036L6.35352 9.70508" stroke="rgb(5,95,194)" stroke-width="1.000000" />
+</svg>

src/components/base/Ai/AiSummary/index.vue

+<template>
+  <div class="summary-wrapper">
+    <div class="summary-header">
+      <div class="icon1">
+        <img src="./icon1.svg" alt="">
+      </div>
+      <div class="text text-tip-1">{{ '智库报告总结摘要' }}</div>
+      <div class="icon2">
+        <img src="./icon2.svg" alt="">
+      </div>
+    </div>
+    <div class="summary-main">
+      <slot name="summary-content"></slot>
+    </div>
+  </div>
+</template>
+
+<style lang="scss">
+.summary-wrapper {
+  width: 100%;
+  height: 100%;
+  // background: linear-gradient(90deg, var(--color-primary-10) 0%, var(--bg-white-100) 100%) ;
+  background: url('./bg.svg') no-repeat;
+  overflow: hidden;
+  border-radius: 4px;
+  border: 1px solid #E7F3FF;
+
+  .summary-header {
+    margin-top: 16px;
+    margin-left: 24px;
+    width: 199px;
+    height: 32px;
+
+    border: 1px solid var(--color-primary-100);
+    border-radius: 16px;
+    background: var(--color-primary-10);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 9px;
+
+    .icon1 {
+      width: 15px;
+      height: 12px;
+
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+
+    .text {
+      color: var(--color-primary-100);
+    }
+
+    .icon2 {
+      width: 6px;
+      height: 12px;
+
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+
+  .summary-main {
+    margin: 0 auto;
+    margin-top: 24px;
+    width: calc(100% - 52px);
+    height: calc(100% - 92px);
+  }
+}
+</style>
\ No newline at end of file

src/components/base/DecreeOriginal/index.vue

@@ -239,6 +239,8 @@ watch(isTranslate, () => {
 			background-color: white;
 			padding: 0 60px;
 			flex: auto;
+				height: 100%;
+				min-height: 0;
 			display: flex;
 			flex-direction: column;
 			.report-header {
@@ -327,6 +329,10 @@ watch(isTranslate, () => {
 				height: 20px;
 				padding: 10px 0;
 
+				:deep(.el-scrollbar) {
+					height: 100%;
+				}
+
 				.no-content {
 					height: 100%;
 					display: flex;

src/components/base/boxBackground/analysisBox.vue

@@ -133,11 +133,12 @@ const emit = defineEmits(['save', 'download', 'collect'])
       }
     }
 
-    // .header-btn {
+    .header-btn {
       // display: flex;
       // justify-content: flex-end;
       // gap: 8px;
-    // }
+      margin-right: 10px;
+    }
 
     // .header-btn1 {
     //   position: absolute;

src/router/dataLibrary/dataBill.js

 // 法案资源库
-const CountryBill = () => import('@/views/dataLibrary/components/bill/countryBill/index.vue')
-const StateBill = () => import('@/views/dataLibrary/components/bill/stateBill/index.vue')
+const CountryBill = () => import('@/views/dataLibrary/bill/countryBill/index.vue')
+const StateBill = () => import('@/views/dataLibrary/bill/stateBill/index.vue')
 
 const dataBillRoutes = [
   // 科技法案资源库路由

src/router/dataLibrary/decree.js

 // 法案资源库
-const Decree = () => import('@/views/dataLibrary/components/decree/index.vue')
+const Decree = () => import('@/views/dataLibrary/decree/index.vue')
 
 const dataDecreeRoutes = [
   // 科技法案资源库路由

src/router/dataLibrary/exportControl.js

 // 法案资源库
-const CommerceControlList = () => import('@/views/dataLibrary/components/exportControl/commerceControlList/index.vue')
-const CommerceControlListEvent = () => import('@/views/dataLibrary/components/exportControl/commerceControlListEvent/index.vue')
-const EntityList = () => import('@/views/dataLibrary/components/exportControl/entityList/index.vue')
-const EntityListEvent = () => import('@/views/dataLibrary/components/exportControl/entityListEvent/index.vue')
+const CommerceControlList = () => import('@/views/dataLibrary/exportControl/commerceControlList/index.vue')
+const CommerceControlListEvent = () => import('@/views/dataLibrary/exportControl/commerceControlListEvent/index.vue')
+const EntityList = () => import('@/views/dataLibrary/exportControl/entityList/index.vue')
+const EntityListEvent = () => import('@/views/dataLibrary/exportControl/entityListEvent/index.vue')
 
 const dataDecreeRoutes = [
   // 科技法案资源库路由

src/router/dataLibrary/financeControl.js

 // 法案资源库
-const MREList = () => import('@/views/dataLibrary/components/financeControl/mREList/index.vue')
-const MREListEvent = () => import('@/views/dataLibrary/components/financeControl/mREListEvent/index.vue')
-const SDNList = () => import('@/views/dataLibrary/components/financeControl/sDNList/index.vue')
-const SDNListEvent = () => import('@/views/dataLibrary/components/financeControl/sDNListEvent/index.vue')
+const MREList = () => import('@/views/dataLibrary/financeControl/mREList/index.vue')
+const MREListEvent = () => import('@/views/dataLibrary/financeControl/mREListEvent/index.vue')
+const SDNList = () => import('@/views/dataLibrary/financeControl/sDNList/index.vue')
+const SDNListEvent = () => import('@/views/dataLibrary/financeControl/sDNListEvent/index.vue')
 
 const dataDecreeRoutes = [
   // 科技法案资源库路由

src/router/dataLibrary/innovationSubject.js

 // 法案资源库
-const KeyLab = () => import('@/views/dataLibrary/components/innovationSubject/keyLab/index.vue')
-const ResearchUniversity = () => import('@/views/dataLibrary/components/innovationSubject/researchUniversity/index.vue')
-const TechnologyCompany = () => import('@/views/dataLibrary/components/innovationSubject/technologyCompany/index.vue')
+const KeyLab = () => import('@/views/dataLibrary/innovationSubject/keyLab/index.vue')
+const ResearchUniversity = () => import('@/views/dataLibrary/innovationSubject/researchUniversity/index.vue')
+const TechnologyCompany = () => import('@/views/dataLibrary/innovationSubject/technologyCompany/index.vue')
 
 const dataDecreeRoutes = [
   // 科技法案资源库路由

src/router/dataLibrary/marketControl.js

 // 法案资源库
-const Case337 = () => import('@/views/dataLibrary/components/marketControl/case337/index.vue')
-const Case232 = () => import('@/views/dataLibrary/components/marketControl/case232/index.vue')
-const Case301 = () => import('@/views/dataLibrary/components/marketControl/case301/index.vue')
+const Case337 = () => import('@/views/dataLibrary/marketControl/case337/index.vue')
+const Case232 = () => import('@/views/dataLibrary/marketControl/case232/index.vue')
+const Case301 = () => import('@/views/dataLibrary/marketControl/case301/index.vue')
 
 const dataDecreeRoutes = [
   // 科技法案资源库路由

src/router/dataLibrary/technologyFigures.js

 // 法案资源库
-const CongressMan = () => import('@/views/dataLibrary/components/technologyFigures/congressMan/index.vue')
-const Minister = () => import('@/views/dataLibrary/components/technologyFigures/minister/index.vue')
-const TechnologyLeader = () => import('@/views/dataLibrary/components/technologyFigures/technologyLeader/index.vue')
-const ThinkTankResearcher = () => import('@/views/dataLibrary/components/technologyFigures/thinkTankResearcher/index.vue')
+const CongressMan = () => import('@/views/dataLibrary/technologyFigures/congressMan/index.vue')
+const Minister = () => import('@/views/dataLibrary/technologyFigures/minister/index.vue')
+const TechnologyLeader = () => import('@/views/dataLibrary/technologyFigures/technologyLeader/index.vue')
+const ThinkTankResearcher = () => import('@/views/dataLibrary/technologyFigures/thinkTankResearcher/index.vue')
 
 const dataDecreeRoutes = [
   // 科技法案资源库路由

src/router/dataLibrary/thinkTank.js

 // 法案资源库
-const ThinkTank = () => import('@/views/dataLibrary/components/thinkTank/index.vue')
+const ThinkTank = () => import('@/views/dataLibrary/thinkTank/index.vue')
 
 const dataThinkTankRoutes = [
   // 科技法案资源库路由

src/router/modules/bill.js

@@ -13,7 +13,7 @@ const BillInfluenceLayout = () => import('@/views/bill/influence/index.vue')
 const BillInfluenceIndustry = () => import('@/views/bill/influence/industry/index.vue')
 const BillInfluenceScientificResearch = () => import('@/views/bill/influence/scientificResearch/index.vue')
 const BillRelevantCircumstance = () => import('@/views/bill/relevantCircumstance/index.vue')
-const BillOriginalText = () => import('@/views/bill/billOriginalText/index.vue')
+const BillVersionCompare = () => import('@/views/bill/versionCompare/index.vue')
 
 
 const billRoutes = [
@@ -36,14 +36,6 @@ const billRoutes = [
       dynamicTitle: true // 标记需要动态设置标题
     },
     children: [
-      {
-        path: "originalText",
-        name: "BillOriginalText",
-        component: BillOriginalText,
-        meta: {
-          title: "法案原文"
-        }
-      },
       // 法案分析路由
       {
         path: "bill",
@@ -138,6 +130,14 @@ const billRoutes = [
         // meta: {
         //   title: "相关情况"
         // }
+      },
+      {
+        path: "versionCompare",
+        name: "BillVersionCompare",
+        component: BillVersionCompare,
+        meta: {
+          title: "版本对比"
+        }
       }
     ]
   },

src/styles/components/Ai/AiInfo/index.vue

@@ -5,31 +5,26 @@
         {{
           `
 import AiButton from '@/components/base/AiButton/index.vue'
-  <AiButton />
-`
-        }}
-      </pre>
+import AiPane from '@/components/base/AiPane/index.vue'
   <div class="chart-box">
-        <div class="btn-box">
+    <div class="btn-box" @mouseenter="handleSwitchAiContentShow(true)">
       <AiButton />
     </div>
-
-      </div>
-
-    </el-col>
-    <el-col :span="span">
-      <pre>
-        {{
-          `
-import AiPane from '@/components/base/AiPane/index.vue'
+    <div class="content-box" v-if="isShowAiContent" @mouseleave="handleSwitchAiContentShow(false)">
       <AiPane :aiContent="aiContent" />
+    </div>
+  </div>
 `
         }}
       </pre>
       <div class="chart-box">
-        <div class="content-box">
+        <div class="btn-box" @mouseenter="handleSwitchAiContentShow(true)">
+          <AiButton />
+        </div>
+        <div class="content-box" v-if="isShowAiContent" @mouseleave="handleSwitchAiContentShow(false)">
           <AiPane :aiContent="aiContent" />
         </div>
+
       </div>
 
     </el-col>
@@ -43,7 +38,13 @@ import AiButton from '@/components/base/Ai/AiButton/index.vue'
 import AiPane from '@/components/base/Ai/AiPane/index.vue'
 const span = 12
 
-const aiContent = ref(`整个立法过程反映了美国政治的高度极化特点。民主党全员反对该法案，批评其"劫贫济富"。而共和党内部也有分歧，特别是在财政赤字问题上。马斯克多次公开批评该法案是"疯狂的支出计划"。`)
+const handleSwitchAiContentShow = (isShow) => {
+  isShowAiContent.value = isShow
+}
+
+const isShowAiContent = ref(false)
+
+const aiContent = ref(`整个立法过程反映了美国政治的高度极化特点。民主党全员反对该法案，批评其"劫贫济富"。而共和党内部也有分歧，特别是在财政赤字问题上。马斯克多次公开批评该法案是"疯狂的支出计划"。整个立法过程反映了美国政治的高度极化特点。民主党全员反对该法案，批评其"劫贫济富"。而共和党内部也有分歧，特别是在财政赤字问题上。马斯克多次公开批评该法案是"疯狂的支出计划"。`)
 
 
 </script>
@@ -60,7 +61,8 @@ const aiContent = ref(`整个立法过程反映了美国政治的高度极化特
     right: 0;
     bottom: 18px;
   }
-  .content-box{
+
+  .content-box {
     position: absolute;
     left: 0;
     bottom: 0;

src/styles/components/Ai/AiSummary/index.vue

+<template>
+  <el-row class="wrapper layout-grid-line">
+    <el-col :span="span">
+      <pre>
+        {{
+          `
+import AiSummary from '@/components/base/Ai/AiSummary/index.vue'
+  <div class="summary-box">
+    <AiSummary />
+  </div>
+`
+        }}
+      </pre>
+      <div class="summary-box">
+        <AiSummary>
+          <template #summary-content>
+            <div class="content-box">
+              我是插槽内容区域(忽略背景色)
+            </div>
+
+          </template>
+        </AiSummary>
+
+      </div>
+
+    </el-col>
+  </el-row>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import '@/styles/common.scss'
+import AiSummary from '@/components/base/Ai/AiSummary/index.vue'
+const span = 24
+
+
+const aiContent = ref(`整个立法过程反映了美国政治的高度极化特点。民主党全员反对该法案，批评其"劫贫济富"。而共和党内部也有分歧，特别是在财政赤字问题上。马斯克多次公开批评该法案是"疯狂的支出计划"。整个立法过程反映了美国政治的高度极化特点。民主党全员反对该法案，批评其"劫贫济富"。而共和党内部也有分歧，特别是在财政赤字问题上。马斯克多次公开批评该法案是"疯狂的支出计划"。`)
+
+
+</script>
+
+<style lang="scss" scoped>
+.summary-box {
+  margin-left: 10px;
+  margin-bottom: 10px;
+  width: 1019px;
+  height: 453px;
+  .content-box{
+    width: 100%;
+    height: 100%;
+    background: var(--color-primary-2);
+  }
+}
+</style>
\ No newline at end of file

src/styles/components/index.vue

@@ -46,6 +46,9 @@
                         <el-tab-pane label="Ai智能总结" lazy>
                             <AiInfo />
                         </el-tab-pane>
+                        <el-tab-pane label="Ai内容摘要" lazy>
+                            <AiSummary />
+                        </el-tab-pane>
                         <el-tab-pane label="层级关系图" lazy>
                             <GraphChart />
                         </el-tab-pane>
@@ -87,6 +90,7 @@ import WordCloudChart from './WordCloudChart/index.vue'
 import NewsPage from './News/index.vue'
 import TimeTabPane from './TimeTabPane/index.vue'
 import AiInfo from './Ai/AiInfo/index.vue'
+import AiSummary from './Ai/AiSummary/index.vue'
 </script>
 
 <style lang="scss" scoped>

src/views/bill/billHome/ResourceLibrarySection.vue

@@ -204,16 +204,20 @@
 									<div class="coop-members">
 										<div class="coop-member">
 											<img class="coop-avatar" :src="item.avatar || defaultAvatar" alt="committee-avatar" />
+											<div class="coop-member-info">
 												<div class="coop-member-name" :title="item.name">{{ item.name }}</div>
+												<div v-if="item.nameEn" class="coop-member-name-en" :title="item.nameEn">
+													{{ item.nameEn }}
+												</div>
 											</div>
 										</div>
-									<div class="coop-summary" :title="item.desc">
-										{{ item.desc }}
 									</div>
+									<!-- <div class="coop-summary" :title="item.desc">
+										{{ item.desc }}
+									</div> -->
 									<div class="coop-count">
 										{{ `${item.proposalSize ?? (item.bills || []).length}项重点法案` }}
 									</div>
-									<slot name="committee-extra" :committee="item" />
 								</div>
 								<div class="coop-proposals">
 									<div
@@ -447,6 +451,7 @@ const handleGetCommitteeList = async () => {
 				const descText = billInfoPage[0]?.originDepart || "";
 				return {
 					id: item.id,
+					nameEn:item.nameEn || "",
 					avatar: "",
 					name: item.name || "-",
 					desc: descText,
@@ -1232,6 +1237,12 @@ onMounted(() => {
 					min-width: 0;
 				}
 
+				.coop-member-info {
+					display: flex;
+					flex-direction: column;
+					min-width: 0;
+				}
+
 				.coop-avatar {
 					width: 40px;
 					height: 40px;
@@ -1273,6 +1284,17 @@ onMounted(() => {
 					text-overflow: ellipsis;
 				}
 
+				.coop-member-name-en {
+					color: var(--text-primary-65-color);
+					font-family: "Microsoft YaHei";
+					font-size: 14px;
+					font-weight: 400;
+					line-height: 22px;
+					white-space: nowrap;
+					overflow: hidden;
+					text-overflow: ellipsis;
+				}
+
 				.coop-count {
 					flex-shrink: 0;
 					color: #1459bb;
@@ -1284,7 +1306,6 @@ onMounted(() => {
 				}
 
 				.coop-proposals {
-					margin-top: 10px;
 					padding-top: 10px;
 					border-top: 1px solid #eaeced;
 					display: grid;

src/views/bill/billHome/index.vue

@@ -127,7 +127,13 @@
 									<el-empty v-if="!box5HasData" description="暂无数据" :image-size="100" />
 									<div v-else id="box5Chart" class="overview-chart"></div>
 								</div>
+								<div class="overview-tip-row">
 									<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')">
+									<AiPane :aiContent="overviewAiContent.box5" />
+								</div>
 							</div>
 						</OverviewCard>
 						<OverviewCard class="overview-card--single box6" title="涉华法案领域分布" :icon="box6HeaderIcon">
@@ -141,7 +147,13 @@
 									<el-empty v-if="!box9HasData" description="暂无数据" :image-size="100" />
 									<div v-else id="box9Chart" class="overview-chart"></div>
 								</div>
+								<div class="overview-tip-row">
 									<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')">
+									<AiPane :aiContent="overviewAiContent.box6" />
+								</div>
 							</div>
 						</OverviewCard>
 					</div>
@@ -157,7 +169,13 @@
 									<el-empty v-if="!box7HasData" description="暂无数据" :image-size="100" />
 									<div v-else id="box7Chart" class="overview-chart"></div>
 								</div>
+								<div class="overview-tip-row">
 									<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')">
+									<AiPane :aiContent="overviewAiContent.box7" />
+								</div>
 							</div>
 						</OverviewCard>
 						<OverviewCard class="overview-card--single box8" title="涉华法案进展分布" :icon="box7HeaderIcon">
@@ -174,7 +192,13 @@
 										<div id="box8Chart" class="overview-chart box8-chart"></div>
 									</template>
 								</div>
+								<div class="overview-tip-row">
 									<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')">
+									<AiPane :aiContent="overviewAiContent.box8" />
+								</div>
 							</div>
 						</OverviewCard>
 						<OverviewCard class="overview-card--single box9" title="涉华法案关键条款" :icon="box7HeaderIcon">
@@ -183,7 +207,13 @@
 									<el-empty v-if="!wordCloudHasData" description="暂无数据" :image-size="100" />
 									<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')"	>
+									<AiPane :aiContent="overviewAiContent.box9" />
+								</div>
 							</div>
 						</OverviewCard>
 					</div>
@@ -221,6 +251,8 @@ import OverviewCard from "./OverviewCard.vue";
 import ResourceLibrarySection from "./ResourceLibrarySection.vue";
 import { useContainerScroll } from "@/hooks/useScrollShow";
 import TipTab from "@/components/base/TipTab/index.vue";
+import AiButton from "@/components/base/Ai/AiButton/index.vue";
+import AiPane from "@/components/base/Ai/AiPane/index.vue";
 import WordCloundChart from "@/components/base/WordCloundChart/index.vue";
 
 import getMultiLineChart from "./utils/multiLineChart";
@@ -370,6 +402,36 @@ const box7YearList = ref([
 	}
 ]);
 
+const aiPaneVisible = ref({
+	box5: false,
+	box6: false,
+	box7: false,
+	box8: false,
+	box9: false
+});
+
+const overviewAiContent = ref({
+	box5: "智能总结生成中...",
+	box6: "智能总结生成中...",
+	box7: "智能总结生成中...",
+	box8: "智能总结生成中...",
+	box9: "智能总结生成中..."
+});
+
+const handleShowAiPane = key => {
+	aiPaneVisible.value = {
+		...aiPaneVisible.value,
+		[key]: true
+	};
+};
+
+const handleHideAiPane = key => {
+	aiPaneVisible.value = {
+		...aiPaneVisible.value,
+		[key]: false
+	};
+};
+
 const box8selectetedTime = ref("2025");
 const box8YearList = ref([
 	{
@@ -2109,6 +2171,20 @@ onUnmounted(() => {
 				.overview-card-body {
 					display: flex;
 					flex-direction: column;
+					position: relative;
+				}
+
+				.overview-ai-pane {
+					position: absolute;
+					left: 0;
+					bottom: 0;
+					width: 100%;
+					z-index: 3;
+					pointer-events: none;
+
+					.ai-pane-wrapper {
+						pointer-events: auto;
+					}
 				}
 
 				.overview-chart-wrap {
@@ -2131,8 +2207,17 @@ onUnmounted(() => {
 					min-height: 0;
 				}
 
-				.overview-tip {
+				.overview-tip-row {
 					margin-top: 10px;
+					position: relative;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+				}
+
+				.overview-tip-action {
+					position: absolute;
+					right: -30px;
 				}
 			}
 		}

src/views/bill/billLayout/components/BillHeader.vue

@@ -78,14 +78,6 @@
 
 				<div class="right-box-bottom" v-if="showActions">
 					<template v-if="isLoading">
-						<div class="btn1 is-skeleton">
-							<div class="icon">
-								<el-skeleton-item class="skeleton-action-icon" variant="text" />
-							</div>
-							<div class="text">
-								<el-skeleton-item class="skeleton-action-text" variant="text" />
-							</div>
-						</div>
 						<div class="btn3 is-skeleton">
 							<div class="icon">
 								<el-skeleton-item class="skeleton-action-icon" variant="text" />
@@ -96,13 +88,6 @@
 						</div>
 					</template>
 					<template v-else>
-						<div class="btn1" @click="emit('open-original-text')">
-							<div class="icon">
-								<img :src="btnIconOriginalText" alt="" />
-							</div>
-							<div class="text">{{ "法案原文" }}</div>
-						</div>
-
 						<div class="btn3" @click="emit('open-analysis')">
 							<div class="icon">
 								<img :src="btnIconAnalysis" alt="" />
@@ -118,7 +103,6 @@
 
 <script setup>
 import { computed } from "vue";
-import btnIconOriginalText from "@/views/thinkTank/ReportDetail/images/btn-icon1.png";
 import btnIconAnalysis from "@/views/thinkTank/ReportDetail/images/btn-icon3.png";
 
 const props = defineProps({
@@ -150,7 +134,7 @@ const props = defineProps({
 
 const isLoading = computed(() => !props.billInfo || !props.billInfo.billName);
 
-const emit = defineEmits(["tab-click", "open-original-text", "open-analysis"]);
+const emit = defineEmits(["tab-click", "open-analysis"]);
 </script>
 
 <style lang="scss" scoped>
@@ -363,41 +347,6 @@ const emit = defineEmits(["tab-click", "open-original-text", "open-analysis"]);
 			justify-content: flex-end;
 			gap: 8px;
 
-			.btn1 {
-				cursor: pointer;
-				width: 120px;
-				height: 36px;
-				box-sizing: border-box;
-				border: 1px solid rgba(230, 231, 232, 1);
-				border-radius: 6px;
-				background: rgba(255, 255, 255, 1);
-				display: flex;
-				justify-content: center;
-				align-items: center;
-				gap: 8px;
-
-				.icon {
-					width: 16px;
-					height: 16px;
-
-					img {
-						width: 100%;
-						height: 100%;
-					}
-				}
-
-				.text {
-					height: 24px;
-					color: rgba(95, 101, 108, 1);
-					font-family: Microsoft YaHei;
-					font-size: 16px;
-					font-weight: 400;
-					line-height: 24px;
-					letter-spacing: 0px;
-					text-align: left;
-				}
-			}
-
 			.btn3 {
 				cursor: pointer;
 				width: 120px;

src/views/bill/billLayout/index.vue

@@ -7,10 +7,9 @@
 				:defaultLogo="USALogo"
 				:tabs="mainHeaderBtnList"
 				:activeTitle="activeTitle"
-				:showTabs="!isBillOriginalTextPage"
-				:showActions="!isBillOriginalTextPage"
+				:showTabs="showHeaderTabs"
+				:showActions="showHeaderActions"
 				@tab-click="handleClickMainHeaderBtn"
-				@open-original-text="handleOpenBillOriginalText"
 				@open-analysis="handleAnalysisClick"
 			/>
 
@@ -22,14 +21,13 @@
 </template>
 
 <script setup>
-import { ref, onMounted, computed, watch } from "vue";
+import { ref, onMounted, watch } from "vue";
 import router from "@/router";
 import { useRoute } from "vue-router";
 import { getBillInfoGlobal } from "@/api/bill";
 import BillHeader from "./components/BillHeader.vue";
 
 const route = useRoute();
-const isBillOriginalTextPage = computed(() => route.path === "/billLayout/originalText");
 
 import icon1 from "./assets/icons/icon1.svg";
 import icon1Active from "./assets/icons/icon1_active.svg";
@@ -55,16 +53,6 @@ const getBillInfoGlobalFn = async () => {
 	}
 };
 
-const handleOpenBillOriginalText = () => {
-	const targetRoute = router.resolve({
-		path: "/billLayout/originalText",
-		query: {
-			billId: route.query.billId
-		}
-	});
-	window.open(targetRoute.href, "_blank");
-};
-
 const mainHeaderBtnList = ref([
 	{
 		icon: icon1,
@@ -93,6 +81,8 @@ const mainHeaderBtnList = ref([
 ]);
 
 const activeTitle = ref("法案概况");
+const showHeaderTabs = ref(true);
+const showHeaderActions = ref(true);
 
 const getActiveTitleByRoutePath = path => {
 	if (path.startsWith("/billLayout/deepDig")) return "深度挖掘";
@@ -102,8 +92,12 @@ const getActiveTitleByRoutePath = path => {
 	return "法案概况";
 };
 
-const syncActiveTitleFromRoute = () => {
+const syncHeaderStateFromRoute = () => {
+	const currentPath = route.path || "";
 	activeTitle.value = getActiveTitleByRoutePath(route.path);
+	const isVersionCompare = currentPath.startsWith("/billLayout/versionCompare");
+	showHeaderTabs.value = !isVersionCompare;
+	showHeaderActions.value = !isVersionCompare;
 };
 
 const handleClickMainHeaderBtn = item => {
@@ -134,7 +128,7 @@ const handleAnalysisClick = () => {
 onMounted(() => {
 	getBillInfoGlobalFn();
 	// 以当前路由为准，避免 sessionStorage 造成高亮错乱
-	syncActiveTitleFromRoute();
+	syncHeaderStateFromRoute();
 	// 兜底：如果未来出现未知路由且有缓存，再用缓存
 	const cachedTitle = window.sessionStorage.getItem("activeTitle");
 	if (!activeTitle.value && cachedTitle) activeTitle.value = cachedTitle;
@@ -143,7 +137,7 @@ onMounted(() => {
 watch(
 	() => route.path,
 	() => {
-		syncActiveTitleFromRoute();
+		syncHeaderStateFromRoute();
 	},
 	{ immediate: true }
 );

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

@@ -697,6 +697,7 @@ onMounted(() => {
 			right: 84px;
 			top: 15px;
 			
+
 			.btn {
 				height: 28px;
 				padding: 0 8px;

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

 <template>
   <div class="process-overview-wrap">
-    <!-- <div class="box-header">
-      <div class="header-left"></div>
-      <div class="title">流程概要</div>
-				<div class="header-right">
-					<div class="icon">
-						<img src="@/assets/icons/box-header-icon2.png" alt="" />
-					</div>
-					<div class="icon">
-						<img src="@/assets/icons/box-header-icon3.png" alt="" />
-					</div>
-				</div>
-    </div>
-    <div class="main">
-      <div class="left" :style="{ width: (maxLineWidth + 250) + 'px' }">
-        <div class="top">
-          <div class="top-line" :style="{ width: lineWidth }">
-            <div class="top-line1"></div>
-          </div>
-          <div class="start">
-            <div class="icon">
-              <img src="./assets/images/logo1.png" alt="" />
-            </div>
-            <div class="name">{{ "参议院" }}</div>
-          </div>
-          <div class="content-box" :style="senateBoxStyle">
-            <div class="item-box" v-for="(item, index) in senateList" :key="item.id" style="width: 280px; flex-shrink: 0;">
-              <div class="item-box-dot">
-                <img src="./assets/images/top-line-dot.png" alt="" />
-              </div>
-              <div class="item-content">
-                <div class="item-header">
-                  <div class="item-title" :title="item.actionTitle">
-                    {{ item.actionTitle }} <span v-if="item.versionId">({{ item.versionId }})</span>
-                  </div>
-                  <div class="item-header-icon" @click="handleClickDetail(true, item, $event)">
-                  <img src="./assets/images/item-header-icon.png" alt="" />
-                </div>
-                </div>
-                <div class="item-info" v-if="item.agreeVote !== null || item.disagreeVote !== null">
-                  {{ (item.agreeVote || 0) + "赞成：" + (item.disagreeVote || 0) + "反对" }}
-                </div>
-                <div class="item-main" v-if="item.fynrList && item.fynrList.length">
-                  <div class="item-main-item" v-for="(sub, subIndex) in item.fynrList" :key="subIndex">
-                    <div class="icon"></div>
-                    <CommonPrompt :content="sub">
-                      <div class="text">{{ sub }}</div>
-                    </CommonPrompt>
-                  </div>
-                </div>
-              </div>
-              <div class="item-time">
-                {{ item.actionDate }}
-              </div>
-            </div>
-          </div>
-        </div>
-
-        <div class="bottom">
-          <div class="bottom-line" :style="{ width: lineWidth }">
-            <div class="bottom-line1"></div>
-          </div>
-          <div class="start">
-            <div class="name">{{ "众议院" }}</div>
-
-            <div class="icon">
-              <img src="./assets/images/logo2.png" alt="" />
-            </div>
-          </div>
-          <div class="content-box" :style="houseBoxStyle">
-            <div class="item-box" v-for="(item, index) in houseList" :key="item.id" style="width: 280px; flex-shrink: 0;">
-              <div class="item-time">
-                {{ item.actionDate }}
-              </div>
-              <div class="item-box-dot">
-                <img src="./assets/images/bottom-line-dot.png" alt="" />
-              </div>
-              <div class="item-content">
-                <div class="item-header">
-                  <div class="item-title" :title="item.actionTitle">
-                    {{ item.actionTitle }} <span v-if="item.versionId">({{ item.versionId }})</span>
-                  </div>
-                  <div class="item-header-icon" @click="handleClickDetail(true, item, $event)">
-                  <img src="./assets/images/item-header-icon.png" alt="" />
-                </div>
-                </div>
-                <div class="item-info" v-if="item.agreeVote !== null || item.disagreeVote !== null">
-                  {{ (item.agreeVote || 0) + "赞成：" + (item.disagreeVote || 0) + "反对" }}
-                </div>
-                <div class="item-main" v-if="item.fynrList && item.fynrList.length">
-                  <div class="item-main-item" v-for="(sub, subIndex) in item.fynrList" :key="subIndex">
-                    <div class="icon"></div>
-                    <CommonPrompt :content="sub">
-                      <div class="text">{{ sub }}</div>
-                    </CommonPrompt>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-        <div class="right" :style="{ left: rightPos }">
-          <div class="junction-dot">
-            <div class="inner-dot"></div>
-          </div>
-          <div class="right-line"></div>
-        </div>
-      </div>
-    </div> -->
     <AnalysisBox title="流程概要" :showAllBtn="false">
       <div class="main">
         <div class="left" :style="{ width: (maxLineWidth + 250) + 'px' }">
@@ -207,17 +99,6 @@
           </div>
         </div>
       </div>
-      <!-- <div class="footer">
-      <div class="footer-left">
-        <img src="./assets/icons/right-icon1.png" alt="" />
-      </div>
-      <div class="footer-center">
-        立法过程始于2025年2月共和党启动预算框架谈判，5月22日众议院以215:214的1票优势通过初始版本；随后参议院历经16小时全文朗读和马拉松式辩论，于7月1日以51:50的票数通过修订版（副总统万斯投关键票）；因参议院版本大改（如永久化减税、提高债限至5万亿美元），法案重返众议院审议，经程序性投票（219:213）和最终表决（218:214），于7月3日深夜通过；特朗普在7月4日独立日签署生效，全程凸显两党对立、党内分歧及程序博弈。
-      </div>
-      <div class="footer-right">
-        <img src="./assets/icons/arrow-right.png" alt="" />
-      </div>
-    </div> -->
     </AnalysisBox>
 
     <ProcessOverviewDetailDialog

src/views/bill/index.vue

@@ -29,7 +29,7 @@ const siderBtnList = ref([
     path: '/billLayout/bill/background'
   },
    {
-    name: '内容概要',
+    name: '法案原文',
     path: '/billLayout/bill/template'
   },
 ])
@@ -38,7 +38,7 @@ const siderBtnActive = ref("法案简介");
 
 const getSiderActiveByRoutePath = path => {
 	if (path.includes("/billLayout/bill/background")) return "法案背景";
-	if (path.includes("/billLayout/bill/template")) return "内容概要";
+	if (path.includes("/billLayout/bill/template")) return "法案原文";
 	return "法案简介";
 };
 

src/views/bill/template/index.vue

@@ -387,7 +387,7 @@ const handleChangeBill = val => {
 };
 
 const handleOpenVersionCompare = () => {
-	const targetUrl = `/billLayout/deepDig/processOverview?billId=${route.query.billId}`;
+	const targetUrl = `/billLayout/versionCompare?billId=${route.query.billId}`;
 	window.open(targetUrl, "_blank");
 };
 
@@ -404,8 +404,8 @@ const handleGetBillList = async () => {
 		billList.value = rawList
 			.map(item => {
 				return {
-					label: item.bbmc,
-					value: item.bbmc
+					label: item.contentZh,
+					value: item.contentZh
 				};
 			})
 			.filter(item => {

src/views/bill/versionCompare/assert/icons/translate-icons.svg

+<svg viewBox="0 0 13.5996 12.666" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="13.599609" height="12.666016" fill="none" customFrame="#000000">
+	<path id="矢量 455" d="M2 8.66667L2 10C1.99999 10.0416 2.00192 10.0831 2.00578 10.1245C2.00965 10.1659 2.01545 10.207 2.02317 10.2479C2.03089 10.2888 2.0405 10.3292 2.052 10.3691C2.0635 10.4091 2.07684 10.4484 2.09202 10.4872C2.1072 10.5259 2.12416 10.5638 2.14289 10.6009C2.16162 10.6381 2.18204 10.6742 2.20416 10.7095C2.22627 10.7447 2.24998 10.7788 2.27529 10.8118C2.3006 10.8448 2.32739 10.8765 2.35566 10.907C2.38394 10.9375 2.41358 10.9666 2.44458 10.9944C2.47558 11.0221 2.50781 11.0483 2.54126 11.073C2.57472 11.0977 2.60925 11.1208 2.64487 11.1423C2.68048 11.1637 2.71702 11.1835 2.75448 11.2016C2.79195 11.2196 2.83017 11.2359 2.86916 11.2503C2.90814 11.2648 2.94772 11.2775 2.98788 11.2882C3.02805 11.299 3.06863 11.3079 3.10963 11.3149C3.15063 11.3218 3.19186 11.3269 3.23333 11.33L3.33333 11.3333L5.33333 11.3333L5.33333 12.6667L3.33333 12.6667C3.246 12.6667 3.15887 12.6624 3.07195 12.6538C2.98504 12.6453 2.89875 12.6325 2.81309 12.6154C2.72743 12.5984 2.64282 12.5772 2.55924 12.5518C2.47566 12.5265 2.39353 12.4971 2.31284 12.4637C2.23216 12.4303 2.1533 12.393 2.07627 12.3518C1.99925 12.3106 1.92443 12.2658 1.85181 12.2173C1.77919 12.1687 1.70913 12.1168 1.64162 12.0614C1.57411 12.006 1.50947 11.9474 1.44771 11.8856C1.38596 11.8239 1.32738 11.7592 1.27197 11.6917C1.21657 11.6242 1.1646 11.5541 1.11608 11.4815C1.06756 11.4089 1.02271 11.3341 0.981543 11.2571C0.940373 11.18 0.903077 11.1012 0.869654 11.0205C0.836232 10.9398 0.806845 10.8577 0.781492 10.7741C0.75614 10.6905 0.734944 10.6059 0.717906 10.5202C0.700867 10.4346 0.688068 10.3483 0.679507 10.2614C0.670947 10.1745 0.666666 10.0873 0.666666 10L0.666666 8.66667L2 8.66667L2 8.66667ZM10.6667 5.33333L13.6 12.6667L12.1633 12.6667L11.3627 10.6667L8.636 10.6667L7.83667 12.6667L6.40067 12.6667L9.33333 5.33333L10.6667 5.33333L10.6667 5.33333ZM10 7.25667L9.16867 9.33333L10.83 9.33333L10 7.25667ZM4 0L4 1.33333L6.66667 1.33333L6.66667 6L4 6L4 8L2.66667 8L2.66667 6L0 6L0 1.33333L2.66667 1.33333L2.66667 0L4 0ZM10 0.666667C10.0873 0.666667 10.1745 0.670947 10.2614 0.679507C10.3483 0.688068 10.4346 0.700867 10.5202 0.717906C10.6059 0.734944 10.6905 0.75614 10.7741 0.781492C10.8577 0.806845 10.9398 0.836232 11.0205 0.869654C11.1012 0.903077 11.18 0.940373 11.2571 0.981543C11.3341 1.02271 11.4089 1.06756 11.4815 1.11608C11.5541 1.1646 11.6242 1.21657 11.6917 1.27197C11.7592 1.32738 11.8239 1.38596 11.8856 1.44772C11.9474 1.50947 12.006 1.57411 12.0614 1.64162C12.1168 1.70913 12.1687 1.77919 12.2173 1.85181C12.2658 1.92443 12.3106 1.99925 12.3518 2.07628C12.393 2.1533 12.4303 2.23216 12.4637 2.31284C12.4971 2.39353 12.5265 2.47566 12.5518 2.55924C12.5772 2.64282 12.5984 2.72743 12.6154 2.81309C12.6325 2.89875 12.6453 2.98504 12.6538 3.07195C12.6624 3.15887 12.6667 3.246 12.6667 3.33333L12.6667 4.66667L11.3333 4.66667L11.3333 3.33333C11.3333 3.28966 11.3312 3.2461 11.3269 3.20264C11.3226 3.15919 11.3162 3.11604 11.3077 3.07321C11.2992 3.03038 11.2886 2.98807 11.2759 2.94629C11.2632 2.9045 11.2486 2.86343 11.2318 2.82309C11.2151 2.78274 11.1965 2.74332 11.1759 2.7048C11.1553 2.66629 11.1329 2.62888 11.1086 2.59257C11.0844 2.55626 11.0584 2.52123 11.0307 2.48748C11.003 2.45372 10.9737 2.4214 10.9428 2.39052C10.9119 2.35965 10.8796 2.33036 10.8459 2.30265C10.8121 2.27495 10.7771 2.24897 10.7408 2.22471C10.7045 2.20045 10.667 2.17802 10.6285 2.15744C10.59 2.13685 10.5506 2.1182 10.5102 2.10149C10.4699 2.08478 10.4288 2.07009 10.387 2.05741C10.3453 2.04474 10.303 2.03414 10.2601 2.02562C10.2173 2.0171 10.1741 2.0107 10.1307 2.00642C10.0872 2.00214 10.0437 2 10 2L8 2L8 0.666667L10 0.666667L10 0.666667ZM2.66667 2.66667L1.33333 2.66667L1.33333 4.66667L2.66667 4.66667L2.66667 2.66667ZM5.33333 2.66667L4 2.66667L4 4.66667L5.33333 4.66667L5.33333 2.66667Z" fill="rgb(95,101,108)" fill-rule="nonzero" />
+</svg>

src/views/dataLibrary/assets/icons/desc-icon.svg

+<svg viewBox="0 0 16 14" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="14.000000" fill="none">
+	<rect id="降序 1" width="16.000000" height="14.000000" x="0.000000" y="0.000000" />
+	<path id="矢量 469" d="M5.19867 14C5.1619 14 5.12548 13.9955 5.08942 13.9865C5.05336 13.9776 5.01834 13.9643 4.98437 13.9467C4.9504 13.9291 4.91813 13.9076 4.88755 13.882C4.85698 13.8565 4.82869 13.8275 4.80269 13.795C4.77669 13.7625 4.75348 13.7271 4.73305 13.6889C4.71262 13.6507 4.69537 13.6103 4.6813 13.5679C4.66723 13.5254 4.65661 13.4816 4.64943 13.4366C4.64226 13.3915 4.63867 13.346 4.63867 13.3L4.63867 0.7C4.63867 0.654037 4.64226 0.608516 4.64943 0.563437C4.65661 0.518357 4.66723 0.474586 4.6813 0.432122C4.69537 0.389658 4.71262 0.349317 4.73305 0.311101C4.75348 0.272884 4.77669 0.237526 4.80269 0.205025C4.82869 0.172525 4.85698 0.143507 4.88755 0.117971C4.91813 0.0924358 4.9504 0.0708735 4.98437 0.0532843C5.01834 0.0356952 5.05336 0.0224172 5.08942 0.0134503C5.12548 0.00448343 5.1619 0 5.19867 0C5.23544 0 5.27186 0.00448343 5.30792 0.0134503C5.34399 0.0224172 5.379 0.0356952 5.41297 0.0532843C5.44695 0.0708735 5.47922 0.0924358 5.50979 0.117971C5.54036 0.143507 5.56865 0.172525 5.59465 0.205025C5.62065 0.237526 5.64387 0.272884 5.66429 0.311101C5.68472 0.349317 5.70197 0.389658 5.71604 0.432122C5.73012 0.474586 5.74074 0.518357 5.74791 0.563437C5.75508 0.608516 5.75867 0.654037 5.75867 0.7L5.75867 13.3C5.75867 13.346 5.75508 13.3915 5.74791 13.4366C5.74074 13.4816 5.73012 13.5254 5.71604 13.5679C5.70197 13.6103 5.68472 13.6507 5.66429 13.6889C5.64387 13.7271 5.62065 13.7625 5.59465 13.795C5.56865 13.8275 5.54036 13.8565 5.50979 13.882C5.47922 13.9076 5.44695 13.9291 5.41297 13.9467C5.379 13.9643 5.34399 13.9776 5.30792 13.9865C5.27186 13.9955 5.23544 14 5.19867 14L5.19867 14ZM11.1963 10.297L8.39627 13.797C8.34144 13.8593 8.27984 13.9083 8.21147 13.944C8.1433 13.979 8.07237 13.9965 7.99867 13.9965C7.92498 13.9965 7.85404 13.979 7.78587 13.944C7.71745 13.9085 7.65705 13.858 7.60467 13.7925C7.55228 13.727 7.51188 13.6515 7.48347 13.566C7.4545 13.481 7.43957 13.3924 7.43867 13.3L7.43867 0.7C7.43867 0.654037 7.44226 0.608516 7.44943 0.563437C7.4566 0.518357 7.46723 0.474586 7.4813 0.432122C7.49537 0.389658 7.51262 0.349317 7.53305 0.311101C7.55348 0.272884 7.57669 0.237526 7.60269 0.205025C7.62869 0.172525 7.65698 0.143507 7.68755 0.117971C7.71813 0.0924358 7.7504 0.0708735 7.78437 0.0532843C7.81834 0.0356952 7.85336 0.0224172 7.88942 0.0134503C7.92548 0.00448343 7.9619 0 7.99867 0C8.03544 0 8.07186 0.00448343 8.10792 0.0134503C8.14399 0.0224172 8.179 0.0356952 8.21297 0.0532843C8.24694 0.0708735 8.27922 0.0924358 8.30979 0.117971C8.34036 0.143507 8.36865 0.172525 8.39465 0.205025C8.42065 0.237526 8.44387 0.272884 8.46429 0.311101C8.48472 0.349317 8.50197 0.389658 8.51604 0.432122C8.53012 0.474586 8.54074 0.518357 8.54791 0.563437C8.55509 0.608516 8.55867 0.654037 8.55867 0.7L8.55867 11.613L10.4011 9.303C10.4272 9.27036 10.4556 9.24123 10.4863 9.21559C10.517 9.18995 10.5494 9.1683 10.5835 9.15064C10.6176 9.13298 10.6528 9.11964 10.689 9.11064C10.7252 9.10164 10.7618 9.09713 10.7987 9.09713C10.8356 9.09713 10.8722 9.10164 10.9084 9.11064C10.9446 9.11964 10.9797 9.13298 11.0139 9.15064C11.048 9.1683 11.0804 9.18995 11.1111 9.21559C11.1418 9.24123 11.1702 9.27036 11.1963 9.303C11.2224 9.33563 11.2457 9.37114 11.2662 9.40951C11.2867 9.44788 11.304 9.48839 11.3182 9.53102C11.3323 9.57366 11.343 9.61761 11.3502 9.66288C11.3574 9.70814 11.361 9.75385 11.361 9.8C11.361 9.84615 11.3574 9.89186 11.3502 9.93712C11.343 9.98238 11.3323 10.0263 11.3182 10.069C11.304 10.1116 11.2867 10.1521 11.2662 10.1905C11.2457 10.2289 11.2224 10.2644 11.1963 10.297L11.1963 10.297Z" fill="rgb(95,101,108)" fill-rule="nonzero" />
+</svg>

src/views/dataLibrary/assets/icons/download.svg

+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none" customFrame="#000000">
+	<rect id="Line/Download" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
+	<path id="形状" d="M7.90156 10.3281C7.95156 10.3922 8.04844 10.3922 8.09844 10.3281L9.84844 8.11406C9.9125 8.03281 9.85469 7.9125 9.75 7.9125L8.59219 7.9125L8.59219 2.625C8.59219 2.55625 8.53594 2.5 8.46719 2.5L7.52969 2.5C7.46094 2.5 7.40469 2.55625 7.40469 2.625L7.40469 7.91094L6.25 7.91094C6.14531 7.91094 6.0875 8.03125 6.15156 8.1125L7.90156 10.3281ZM12.7812 9.78125L13.7188 9.78125C13.7875 9.78125 13.8438 9.8375 13.8438 9.90625L13.8438 13C13.8438 13.2766 13.6203 13.5 13.3438 13.5L2.65625 13.5C2.37969 13.5 2.15625 13.2766 2.15625 13L2.15625 9.90625C2.15625 9.8375 2.2125 9.78125 2.28125 9.78125L3.21875 9.78125C3.2875 9.78125 3.34375 9.8375 3.34375 9.90625L3.34375 12.3125L12.6562 12.3125L12.6562 9.90625C12.6562 9.8375 12.7125 9.78125 12.7812 9.78125Z" fill="rgb(95,101,108)" fill-rule="evenodd" />
+</svg>

src/views/dataLibrary/components/ActiveTag/close.svg

+<svg viewBox="0 0 12.7275 12.7266" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12.727539" height="12.726562" fill="none" customFrame="#000000">
+	<path id="合并" d="M5 4L5 0L4 0L4 4L0 4L0 5L4 5L4 9L5 9L5 5L9 5L9 4L5 4Z" fill="rgb(5,95,194)" fill-rule="evenodd" transform="matrix(0.707107,-0.707107,0.707107,0.707107,0,6.36328)" />
+</svg>

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

+<template>
+  <div class="wrapper">
+    <div class="text">{{ tagName }}</div>
+    <div class="icon" @click="handleClose">
+      <img src="./close.svg" alt="">
+    </div>
+  </div>
+</template>
+
+<script setup>
+
+const props = defineProps({
+  tagName: {
+    type: String,
+    default: ''
+  }
+})
+
+const emit = defineEmits(['close'])
+
+const handleClose = () => {
+  emit('close')
+}
+
+</script>
+
+<style lang="scss" scoped>
+.wrapper{
+  display: flex;
+  padding: 3px 4px 3px 8px;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 4px;
+  border-radius: 4px;
+  border: 1px solid var(--color-primary-35);
+  background: var(--color-primary-2);
+  cursor: pointer;
+}
+</style>
\ No newline at end of file

src/views/dataLibrary/components/BarChart/barChart.js

+import * as echarts from "echarts";
+
+const getBarChart = (data) => {
+  const option = {
+    tooltip: {},
+    grid: {
+      top: '8%',
+      right: '3%',
+      bottom: '3%',
+      left: '3%',
+      containLabel: true
+    },
+    yAxis: {
+      type: 'value',
+      splitLine: {
+        show: true,
+        lineStyle: {
+          color: ['#DEE2E7'],   // 线条颜色，可以是数组，用于不同间隔交替颜色
+          width: 1,           // 线宽
+          type: 'dashed',     // 类型：'solid'（实线）, 'dashed'（虚线）, 'dotted'（点线）
+          // opacity: 0.6        // 透明度
+        }
+      },
+      axisLine: {
+        show: false,
+        lineStyle: {
+          color: 'rgba(95, 101, 108, 1)',
+        }
+      },
+      show: true,
+      textStyle: {
+        color: 'rgba(95, 101, 108, 1)',
+        fontFamily: 'Microsoft YaHei',
+        fontsize: 14,
+      }
+    },
+    xAxis: {
+      type: 'category',
+      data: data.dataX,
+      splitLine: {
+        show: false
+      },
+      axisTick: {
+        show: true
+      },
+      axisLine: {
+        show: true,
+        lineStyle: {
+          color: '#e7f3ff',
+        }
+      },
+      axisLabel: {
+        show: true,
+        textStyle: {
+          color: 'rgba(95, 101, 108, 1)',
+          fontFamily: 'Microsoft YaHei',
+          fontsize: 14,
+        }
+      }
+    },
+    series: [{
+      type: 'bar',
+      data: data.dataY,
+      label: {
+        show: true,
+        position: 'top',
+        color: 'rgb(59, 65, 75)',
+        fontWeight: 'regular',  // 文字加粗
+        fontSize: 16,
+        fontFamily: 'Source Han Sans CN',
+        formatter: function (params) {
+          return params.value
+        },
+      },
+      barWidth: 20,
+      itemStyle: {
+        color: function (params) {
+          return new echarts.graphic.LinearGradient(0, 1, 0, 0,
+            [{
+              offset: 0,
+              color: 'rgba(10, 87, 166, 0)'
+            },
+            {
+              offset: 1,
+              color: 'rgba(5, 95, 194, 1)'
+            }
+            ]);
+        },
+        // barBorderRadius: 10,
+      }
+    }]
+  }
+  return option
+}
+
+export default getBarChart
\ No newline at end of file

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

+<template>
+  <div class="bar-chart-wrapper" id="bar-chart"></div>
+</template>
+
+<script setup>
+import { ref, onMounted, nextTick } from 'vue'
+import setChart from '@/utils/setChart';
+import getBarChart from './barchart';
+
+const props = defineProps({
+  barChartData: {
+    type: Array,
+    default: [
+
+    ]
+  }
+})
+
+onMounted(() => {
+  const barChart = getBarChart(props.barChartData)
+  setChart(barChart, 'bar-chart', )
+})
+
+</script>
+
+<style lang="scss">
+.bar-chart-wrapper {
+  width: 100%;
+  height: 100%;
+}
+</style>
\ No newline at end of file

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

@@ -2,7 +2,7 @@
   <div class="chart-wrapper">
     <div class="header">
       <div class="header-left">
-        <div class="chart-item" v-for="item, index in chartItemList" :key="index">
+        <div class="chart-item" v-for="item, index in chartItemList" :key="index" @click="handleClickChartItem(item)">
           <img v-if="!item.active" :src="item.icon" alt="">
           <img v-else :src="item.activeIcon" alt="">
         </div>
@@ -13,7 +13,9 @@
       </div>
     </div>
     <div class="main">
-      <div class="chart-box" id="chart-box"></div>
+      <div class="chart-box">
+        <slot name="chart-box"></slot>
+      </div>
       <div class="tip-box"></div>
     </div>
   </div>
@@ -56,6 +58,16 @@ const chartItemList = ref([
   },
 ])
 
+const emit = defineEmits('clickChartItem')
+
+const handleClickChartItem = (item) => {
+  chartItemList.value.forEach(chart => {
+    chart.active = false
+  })
+  item.active = true
+  emit('clickChartItem', item)
+}
+
 const props = defineProps({
   chartTitle: {
     type: String,
@@ -92,9 +104,11 @@ const props = defineProps({
         height: 32px;
         border-radius: 4px;
         cursor: pointer;
-        &:hover{
+
+        &:hover {
           background: var(--color-primary-2);
         }
+
         img {
           width: 100%;
           height: 100%;
@@ -108,13 +122,14 @@ const props = defineProps({
       height: 24px;
       text-align: center;
       left: 200px;
-      height: 12px;
+      top: 12px;
       color: var(--text-primary-80-color);
     }
 
     .header-right {
       width: 32px;
       height: 32px;
+      cursor: pointer;
 
       img {
         width: 100%;
@@ -122,5 +137,16 @@ const props = defineProps({
       }
     }
   }
+
+  .main {
+    .chart-box {
+      width: 1520px;
+      height: 580px;
+    }
+
+    .tip-box {
+      height: 54px;
+    }
+  }
 }
 </style>
\ No newline at end of file

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

+<template>
+  <div class="wrapper">
+    <div class="left">
+      <div class="left-text text-tip-1">{{ '统计维度：' }}</div>
+      <div class="left-list">
+        <ActionButton 
+        v-for="item, index in list" 
+        :key="index" 
+        :name="item.name"
+        :type="item.active ? 'active' : 'normal'" 
+        @click="handleClickItem(item)"
+        />
+      </div>
+    </div>
+    <div class="right">
+      <slot name="chart-header-right"></slot>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import ActionButton from '@/components/base/ActionButton/index.vue'
+
+const props = defineProps({
+  list: {
+    type: Array,
+    default: [
+      {
+        name: '时间',
+        active: true
+      },
+      {
+        name: '领域',
+        active: false
+      },
+      {
+        name: '党派',
+        active: false
+      },
+    ]
+  }
+})
+
+const emit = defineEmits(['clickItem'])
+
+const handleClickItem = (item) => {
+  emit('clickItem', item)
+}
+
+</script>
+
+<style lang="scss" scoped>
+.wrapper {
+  width: 1520px;
+  height: 28px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  .left {
+    display: flex;
+    gap: 8px;
+    align-items: center;
+    justify-content: flex-start;
+
+    .left-text {
+      color: var(--text-primary-80-color);
+    }
+
+    .left-list {
+      display: flex;
+      gap: 8px;
+      align-items: center;
+      justify-content: flex-start;
+    }
+  }
+}
+</style>
\ No newline at end of file

src/views/dataLibrary/components/HeaderBtnBox/arrow-down.svg

+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none" customFrame="#000000">
+	<rect id="Line/Up" width="16.000000" height="16.000000" x="0.000000" y="0.000000" transform="matrix(1,0,0,-1,0,16)" />
+	<path id="路径" d="M11.852 7.80156L6.34264 0.20625C6.14264 -0.06875 5.73327 -0.06875 5.53483 0.20625L0.0238932 7.80156C-0.0354818 7.88438 0.0223307 8 0.125456 8L1.29733 8C1.37702 8 1.45202 7.96094 1.49889 7.89687L5.93796 1.77813L10.377 7.89687C10.4239 7.96094 10.4989 8 10.5786 8L11.7505 8C11.852 8 11.9114 7.88438 11.852 7.80156L11.852 7.80156Z" fill="rgb(5,95,194)" fill-rule="evenodd" transform="matrix(1,0,0,-1,2.0625,12)" />
+</svg>

src/views/dataLibrary/components/HeaderBtnBox/arrow-up.svg

+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none" customFrame="#000000">
+	<rect id="Line/Up" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
+	<path id="路径" d="M13.9145 11.8016L8.40514 4.20625C8.20514 3.93125 7.79577 3.93125 7.59733 4.20625L2.08639 11.8016C2.02702 11.8844 2.08483 12 2.18796 12L3.35983 12C3.43952 12 3.51452 11.9609 3.56139 11.8969L8.00046 5.77812L12.4395 11.8969C12.4864 11.9609 12.5614 12 12.6411 12L13.813 12C13.9145 12 13.9739 11.8844 13.9145 11.8016L13.9145 11.8016Z" fill="rgb(5,95,194)" fill-rule="evenodd" />
+</svg>

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

+<template>
+  <div class="wrapper">
+    <div class="show" @click="handleSwitchShowAll">
+      <div class="text text-compact">{{ isShowAll ? '收起' : '展开全部' }}</div>
+      <div class="icon">
+        <img v-if="isShowAll" src="./arrow-up.svg" alt="">
+        <img v-else src="./arrow-down.svg" alt="">
+      </div>
+    </div>
+    <div class="clear text-tip-1" @click="handleClear">
+      {{ '清空条件' }}
+    </div>
+    <div class="confirm text-tip-1" @click="handleConfirm">
+      {{ '确定' }}
+    </div>
+  </div>
+</template>
+
+<script setup>
+import {ref} from 'vue'
+
+const isShowAll = ref(false)
+
+const handleSwitchShowAll = () => {
+  isShowAll.value = !isShowAll.value
+}
+
+const emit = defineEmits(['clear', 'confirm'])
+
+const handleClear = () => {
+  emit('clear')
+}
+
+const handleConfirm = () => {
+  emit('confirm')
+}
+
+</script>
+
+<style lang="scss" scoped>
+.wrapper {
+  height: 36px;
+  display: flex;
+  gap: 12px;
+  justify-content: flex-end;
+  align-items: center;
+
+  .show {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 4px;
+    cursor: pointer;
+
+    .text {
+      color: var(--color-primary-100);
+    }
+
+    .icon {
+      width: 16px;
+      height: 16px;
+
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+
+  .clear {
+    width: 98px;
+    height: 36px;
+    border-radius: 4px;
+    box-sizing: border-box;
+    border: 1px solid var(--bg-black-10);
+    text-align: center;
+    padding: 6px 16px;
+    color: var(--text-primary-65-color);
+    cursor: pointer;
+  }
+
+  .confirm {
+    width: 150px;
+    height: 36px;
+    border-radius: 4px;
+    box-sizing: border-box;
+    padding: 6px 59px;
+    background: var(--color-primary-100);
+    color: var(--bg-white-100);
+    text-align: center;
+    cursor: pointer;
+  }
+}
+</style>
\ No newline at end of file

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

+<template>
+  <div class="line-chart-wrapper" id="line-chart"></div>
+</template>
+
+<script setup>
+import { ref, onMounted, nextTick } from 'vue'
+import setChart from '@/utils/setChart';
+import getLineChart from './lineChart';
+
+const props = defineProps({
+  lineChartData: {
+    type: Object,
+    default: {
+      dataX: [],
+      dataY: []
+
+    }
+  }
+})
+
+onMounted(() => {
+  const lineChart = getLineChart(props.lineChartData.dataX, props.lineChartData.dataY)
+  setChart(lineChart, 'line-chart', )
+})
+
+</script>
+
+<style lang="scss">
+.line-chart-wrapper {
+  width: 100%;
+  height: 100%;
+  // width: 1520px;
+  // height: 580px;
+
+}
+</style>
\ No newline at end of file

src/views/dataLibrary/components/LineChart/lineChart.js

+
+import * as echarts from 'echarts'
+
+const getLineChart = (dataX, dataY) => {
+  return {
+    grid: {
+      left: 24,
+      top: 48,
+      right: 34,
+      bottom: 10,
+      containLabel: true
+    },
+    xAxis: {
+      type: 'category',
+      boundaryGap: false,
+      splitLine: {
+        show: false
+      },
+      axisLine: {
+        show: false
+      },
+      data: dataX
+    },
+    yAxis: {
+      type: 'value',
+      splitLine: {
+        show: true,
+        lineStyle: {
+          color: ['#DEE2E7'],   // 线条颜色，可以是数组，用于不同间隔交替颜色
+          width: 1,           // 线宽
+          type: 'dashed',     // 类型：'solid'（实线）, 'dashed'（虚线）, 'dotted'（点线）
+          // opacity: 0.6        // 透明度
+        }
+      },
+      axisLine: {
+        show: false
+      },
+    },
+    series: [
+      {
+        data: dataY,
+        type: 'line',
+        // showSymbol: false,
+        symbol: 'circle',          // 圆形
+        symbolSize: 8,             // 大小为8px
+        itemStyle: {
+          // color: 'rgba(5, 95, 194, 1)',         // 填充为珊瑚红
+          color: '#fff',
+          borderColor: 'rgba(5, 95, 194, 1)',
+          borderWidth: 4,
+          // 不设置borderColor和borderWidth，即为纯实心
+        },
+        lineStyle: {
+          color: 'rgba(5, 95, 194, 1)'
+        },
+        areaStyle: {
+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+            offset: 0,
+            color: 'rgba(5, 95, 194, 0.8)' // 起始颜色：深色
+          }, {
+            offset: 1,
+            color: 'rgba(5, 95, 194, 0)' // 结束颜色：浅色且透明度降低
+          }])
+        },
+      }
+    ]
+  }
+}
+
+export default getLineChart;
\ No newline at end of file

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

+<template>
+  <div class="pie-chart-wrapper" id="pie-chart"></div>
+</template>
+
+<script setup>
+import { ref, onMounted, nextTick } from 'vue'
+import setChart from '@/utils/setChart';
+import getPieChart from './piechart';
+
+const props = defineProps({
+  pieChartData: {
+    type: Array,
+    default: [
+      // {
+      //   name: 'aaa',
+      //   value: 12
+      // },
+      //  {
+      //   name: 'bbb',
+      //   value: 8
+      // },
+      //  {
+      //   name: 'ccc',
+      //   value: 15
+      // },
+    ]
+  }
+})
+
+onMounted(() => {
+  const pieChart = getPieChart(props.pieChartData)
+  setChart(pieChart, 'pie-chart', )
+})
+
+</script>
+
+<style lang="scss">
+.pie-chart-wrapper {
+  width: 100%;
+  height: 100%;
+  // width: 1520px;
+  // height: 580px;
+
+}
+</style>
\ No newline at end of file

src/views/dataLibrary/components/PieChart/piechart.js

+import { MUTICHARTCOLORS } from "@/common/constant";
+const getPieChart = (data) => {
+  const colorList = MUTICHARTCOLORS
+  let option = {
+    color: colorList,
+    series: [
+      {
+        type: 'pie',
+        radius: [150, 175],
+        height: '100%',
+        left: 'center',
+        width: '98%',
+        itemStyle: {
+          borderColor: '#fff',
+          borderWidth: 1
+        },
+        label: {
+          alignTo: 'edge',
+          formatter: '{name|{b}}\n{time|{c} 条 {d}%}',
+          minMargin: 5,
+          edgeDistance: 10,
+          lineHeight: 25,
+          rich: {
+            name: {
+              color: 'rgba(59, 65, 75, 1)',
+              fontFamily: 'Microsoft YaHei',
+              fontSize: 16,
+              fontWeight: 'bold',
+            },
+            time: {
+              fontSize: 16,
+              fontFamily: 'Microsoft YaHei',
+              color: '#rgba(95, 101, 108, 1)'
+            }
+          }
+        },
+        labelLine: {
+          length: 15,
+          length2: 0,
+          maxSurfaceAngle: 80
+        },
+        labelLayout: function (params) {
+          const isLeft = params.labelRect.x < 556 / 2;
+          const points = params.labelLinePoints;
+          // Update the end point.
+          points[2][0] = isLeft
+            ? params.labelRect.x
+            : params.labelRect.x + params.labelRect.width;
+          return {
+            labelLinePoints: points
+          };
+        },
+        data: data
+      }]
+  }
+  return option
+}
+
+export default getPieChart;
\ No newline at end of file

src/views/dataLibrary/components/bill/countryBill/index.vue

-<template>
-  <div class="countrybill-wrapper">
-    <div class="header-box">我是国会法案</div>
-    <div class="main-box">
-      <div class="info-box">
-        <div class="switch-box" @click="handleSwitchChartData">
-          <img v-if="!isShowChart" src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
-          <img v-else src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
-        </div>
-        <div class="num-box text-title-3-bold">
-          {{ `共 ${totalNum} 条数据` }}
-        </div>
-      </div>
-      <div class="content-box">
-        <ChartBox chartTitle="美国会法案提出数量随时间变化趋势" />
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { ref } from 'vue'
-import ChartBox from '../../chartBox/index.vue'
-
-// 图表/数据
-const isShowChart = ref(true)
-
-const handleSwitchChartData = () => {
-  isShowChart.value = !isShowChart.value
-}
-
-// 总计数据
-const totalNum = ref(12)
-
-</script>
-
-<style lang="scss" scoped>
-.countrybill-wrapper {
-  width: 1600px;
-  height: 968px;
-
-  .headere-box {
-    width: 1568px;
-    height: 112px;
-    border-radius: 10px;
-    background: rgb(255, 255, 255);
-    border: 1px solid var(--bg-black-5);
-    margin: 16px auto;
-  }
-      .header-box {
-      width: 1568px;
-      height: 112px;
-      border-radius: 10px;
-      background: rgb(255, 255, 255);
-      border: 1px solid var(--bg-black-5);
-      margin: 16px auto;
-    }
-
-  .main-box {
-
-
-
-    .info-box {
-      margin: 0 auto;
-      width: 1568px;
-      height: 30px;
-      display: flex;
-      justify-content: space-between;
-
-      .switch-box {
-        width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
-        cursor: pointer;
-
-        img {
-          width: 100%;
-          height: 100%;
-        }
-      }
-
-      .num-box {
-        color: var(--color-red-100);
-      }
-    }
-
-    .content-box {
-      margin: 0 auto;
-      margin-top: 16px;
-      width: 1568px;
-      height: 766px;
-      border-radius: 10px;
-      background: rgba(255, 255, 255);
-      border: 1px solid var(--bg-black-5);
-    }
-  }
-}
-</style>
\ No newline at end of file

src/views/dataLibrary/index.vue

@@ -316,13 +316,25 @@ const siderList = ref([
 const handleSiderItem = (item) => {
   siderList.value.forEach(val => {
     val.active = false
+    val.isExpanded = false
+    if(val.children && val.children.length) {
+      val.children.forEach(vall => {
+        vall.active = false
       })
+    }
+  })
+  item.isExpanded = true
   item.active = true
-  item.isExpanded = !item.isExpanded
+  
   if (item.path) {
     router.push({
       path: item.path
     })
+  } else {
+    item.children[0].active = true
+    router.push({
+      path: item.children[0].path
+    })
   }
 
 }
@@ -360,6 +372,7 @@ const handleClickTab = (tab) => {
   )
   siderList.value.forEach(val => {
     val.active = false
+    val.isExpanded = false
     if (val.children && val.children.length) {
       val.children.forEach(vall => {
         vall.active = false
@@ -374,10 +387,12 @@ const handleClickTab = (tab) => {
         return
       }
     } else {
+      
       val.children.forEach(vall => {
         if (vall.name === tab.meta.title) {
           vall.active = true
           val.active = true
+          val.isExpanded = true
           return
         }
       })
@@ -480,6 +495,7 @@ const handleClickToolBox = () => {
 .data-library-wrapper {
   width: 1920px;
   height: 1080px;
+  overflow: hidden;
 
   // background: orange;
   .data-library-header {