Merge branch 'pre' of http://8.140.26.4:10003/caijian/risk-monitor into fk-dev

src/api/marketAccessRestrictions/index.js

@@ -178,7 +178,7 @@ export function getSearchBlurb(params) {
     })
 }
 
-// 获取相关事件getRelatedEvents
+// 获取相关事件
 export function getRelatedEvents(params) {
     return request({
         method: 'GET',
@@ -186,8 +186,16 @@ export function getRelatedEvents(params) {
         params
     })
 }
+// 获取相关行政举措
+export function getSearchAOMeasures(params) {
+    return request({
+        method: 'GET',
+        url: `/api/marketsearchDetails/getSearchAOMeasures`,
+        params
+    })
+}
 
-// 获取事件脉络 getSearchContext
+// 获取事件脉络
 export function getSearchContext(params) {
     return request({
         method: 'GET',

src/api/scientificFunding/overview.js

@@ -126,11 +126,25 @@ export function getAreaType() {
   })
 }
 
+/**
+ * 资助项目列表：领域、年份用逗号拼接为一个查询参数（arealist=1,2,3&yearlist=2025,2024）
+ */
+function normalizeProjectListQueryParams(params) {
+  const next = { ...(params || {}) }
+  if (Array.isArray(next.arealist)) {
+    next.arealist = next.arealist.filter((v) => v !== undefined && v !== null && v !== "").join(",")
+  }
+  if (Array.isArray(next.yearlist)) {
+    next.yearlist = next.yearlist.filter((v) => v !== undefined && v !== null && v !== "").join(",")
+  }
+  return next
+}
+
 //资助体系v2.0:资助项目列表分页
 export function getProjectListNew(params) {
   return request({
     method: 'GET',
     url: `/api/fund/getProjectListNew`,
-    params
+    params: normalizeProjectListQueryParams(params)
   })
 }

src/router/index.js

@@ -70,7 +70,9 @@ router.beforeEach((to, from, next) => {
     if (to.meta.dynamicTitle) {
       console.log('to', to);
       const storageKey = to.meta.titleStorageKey || "curTabName";
-      document.title = window.sessionStorage.getItem(storageKey) || to.meta.title;
+      // 新开页签时 sessionStorage 不共享，优先用 query 带过来的 title/name
+      const queryTitle = (to.query && (to.query.title || to.query.name)) ? String(to.query.title || to.query.name) : "";
+      document.title = queryTitle || window.sessionStorage.getItem(storageKey) || to.meta.title;
     } else {
       document.title = to.meta.title
 

src/router/modules/decree.js

@@ -88,7 +88,8 @@ const decreeRoutes = [
     component: Institution,
     meta: {
       title: "行政机构主页",
-      dynamicTitle: true
+      dynamicTitle: true,
+      titleStorageKey: "institutionTabName"
     }
   },
   {

src/styles/bill-tokens.scss

+// Bill layout & visual tokens
+// 统一用于 bill 板块布局改造，后续可并入全局设计变量体系
+
+// spacing
+$bill-space-8: 8px;
+$bill-space-12: 12px;
+$bill-space-16: 16px;
+$bill-space-24: 24px;
+$bill-space-30: 30px;
+
+// layout
+$bill-column-gap: 16px;
+$bill-left-column-width: 1064px;
+$bill-right-column-width: 520px;
+
+// typography
+$bill-title-font-size: 16px;
+$bill-title-font-weight: 600;
+$bill-body-font-size: 14px;
+$bill-body-font-weight: 400;
+
+// surface
+$bill-panel-radius: 8px;
+$bill-panel-border-color: #e8ecf3;
+$bill-panel-shadow: 0 2px 8px rgba(15, 35, 95, 0.06);
+$bill-panel-bg: #ffffff;
+
+// text & color
+$bill-text-primary: #1f2a44;
+$bill-text-secondary: #5b6b88;
+$bill-text-muted: #8b97ad;
+$bill-color-accent: #2f66ff;
+$bill-color-success: #19be6b;
+$bill-color-warning: #ff9f43;
+$bill-color-danger: #f56c6c;

src/views/bill/BILL_LAYOUT_UNIFICATION_PLAN.md

+# Bill 板块布局统一改造计划
+
+> 目标：统一 `@src/views/bill` 下页面布局与视觉风格，解决“底部 30px 留白不稳定”问题，并沉淀可复用布局组件，便于后续新会话直接接续执行。
+
+## 1. 背景与问题
+
+当前 `bill` 板块存在以下共性问题：
+
+1. 页面布局实现不统一（外层滚动、内层滚动、固定高度混用）。
+2. 多数页面为“左右两列 + 多卡片”结构，但容器命名、间距、宽高策略不一致。
+3. `30px` 底部留白在不同页面生效机制不同，容易出现：
+   - 某页不生效
+   - 增加占位后挤压布局
+   - Header（Tab/操作按钮）受影响
+4. 样式硬编码较多（固定宽高、局部 margin/padding），复用性低。
+
+## 2. 总体改造策略
+
+采用“**分层统一 + 渐进迁移**”策略，避免一次性大改风险：
+
+- **第一层：板块承载层统一**
+  - 统一滚动、内容宽度、底部安全留白机制。
+- **第二层：页面布局骨架统一**
+  - 抽象“页面壳 + 双列布局 + 卡片容器”组件。
+- **第三层：业务页迁移**
+  - 先迁移典型页，再批量替换。
+
+## 3. 分阶段计划
+
+### 阶段 A：基线确认与止血（进行中）
+
+- 修复当前试错引入的结构问题（例如模板闭合错误、布局挤压）。
+- 保证关键页面可用：
+  - `background`
+  - `processAnalysis`
+  - `introdoction`
+
+### 阶段 B：新增通用布局组件（进行中）
+
+#### 完成备注（2026-04-02）
+
+- [x] 第一步已完成并通过验收：完成布局组件目录与基础文件脚手架
+  - `src/views/bill/components/layout/BillPageShell.vue`
+  - `src/views/bill/components/layout/BillTwoColumn.vue`
+  - `src/views/bill/components/layout/BillPanel.vue`
+  - `src/views/bill/components/layout/index.js`
+- [x] 第二步已完成并通过验收：实现 `BillPageShell` 滚动容器与底部 `30px` 安全留白机制
+- [x] 第三步已完成并通过验收：实现 `BillTwoColumn` 统一双列布局（1064/520 + gap 16 + 响应式堆叠）
+- [x] 第四步已完成并通过验收：实现 `BillPanel` 统一卡片结构与基础样式（header/body/footer + 可配置边框/圆角/阴影）
+- [x] 第五步已完成并通过验收：`bill-tokens.scss` 接入 `BillPageShell/BillTwoColumn/BillPanel` 并替换关键样式硬编码
+- [x] 第六步已完成并通过验收：试点页 `background/index.vue` 已迁移到统一布局骨架（`BillPageShell + BillTwoColumn`）
+- [x] 第六步修正项（验收反馈已落实）：
+  - 修正 1：移除 `.right-panel` 的 `margin-left/margin-right`，避免右列偏移与原样式不一致
+  - 修正 2：`BillPageShell` 不再使用内部滚动容器；页面滚动回到外层 `layout-main`，确保 Header 与内容一起滚动
+- [x] 第七步已完成并通过验收：`introdoction/index.vue` 迁移到统一布局骨架（`BillPageShell + BillTwoColumn`）
+- [x] 第七步修正项（验收反馈已落实）：
+  - 修正 1：移除 `.introduction-wrap-right` 的 `margin-left/margin-right`，消除右列偏移
+  - 修正 2：在 `.introduction-wrap-content` 增加 `margin-bottom: 30px`，确保外层滚动时可见底部留白
+- [x] 第八步已完成并通过验收：`template/index.vue` 迁移到统一布局骨架（`BillPageShell + BillTwoColumn`）
+- [x] 第八步注意点（已沉淀）：
+  - 删除 `page-bottom-gap` 占位节点，避免与统一留白策略重复
+  - 在双列容器 `.content-row` 增加 `margin-bottom: 30px`，适配“外层 `layout-main` 滚动”模式
+  - 迁移后需检查未使用变量并清理，避免 lint 噪音影响后续页面迁移
+- [x] 第九步已完成并通过验收：`deepDig/processOverview/index.vue` 迁移到统一页面壳（`BillPageShell`）
+- [x] 第九步注意点（已沉淀）：
+  - 保留页面内部横向滚动容器（`.main`），仅替换页面根壳，避免时间轴布局回归风险
+  - 删除 `page-bottom-gap`，改用页面容器底部留白（`margin-bottom: 30px`）适配外层滚动
+- [x] 第十步已完成并通过验收：`deepDig/processAnalysis/index.vue` 迁移到统一页面壳（`BillPageShell`）
+- [x] 第十步注意点（已沉淀）：
+  - 保持原双列业务结构与内部滚动策略不变，仅替换页面根壳
+  - 页面底部留白统一为容器 `margin-bottom: 30px`，与外层 `layout-main` 滚动机制一致
+
+新增组件建议放在：`src/views/bill/components/layout/`
+
+#### 计划新增组件索引
+
+1. `src/views/bill/components/layout/BillPageShell.vue`
+   - 作用：统一页面根容器、内容区、底部留白（30px）机制。
+
+2. `src/views/bill/components/layout/BillTwoColumn.vue`
+   - 作用：统一左右列布局（默认 1064 / 520）、列间距、响应式策略。
+
+3. `src/views/bill/components/layout/BillPanel.vue`
+   - 作用：统一卡片容器（header/body/footer）结构、间距、基础样式。
+
+4. `src/views/bill/components/layout/index.js`
+   - 作用：导出布局组件，便于页面统一引入。
+
+> 可选（后续）：
+> - `BillPanelGroup.vue`（同列多卡片统一间距）
+> - `BillPageSection.vue`（统一页面内 section 标题与辅助动作区）
+
+### 阶段 C：样式 Token 统一（计划）
+
+新增：`src/styles/bill-tokens.scss`（或接入现有变量体系）
+
+- 间距：`8/12/16/24/30`
+- 列间距：`16`
+- 标题字号/字重
+- 卡片边框、阴影、圆角
+- 统一颜色 token（主文字、次文字、强调色）
+
+### 阶段 D：页面迁移（计划）
+
+按“先典型、后批量”执行：
+
+1. 试点页（先迁移）
+   - `background/index.vue`（典型双列 + 卡片 + 多交互）
+
+2. 法案概况组
+   - `introdoction/index.vue`
+   - `template/index.vue`
+   - `background/index.vue`
+
+3. 深度挖掘组
+   - `deepDig/processOverview/index.vue`
+   - `deepDig/processAnalysis/index.vue`
+   - `deepDig/poliContribution/index.vue`
+
+4. 影响分析组
+   - `influence/industry/index.vue`
+   - `influence/scientificResearch/index.vue`
+   - `influence/index.vue`（承载层）
+
+### 阶段 E：收口与回归（计划）
+
+- 清理临时样式补丁（历史试错 `gap/margin-bottom` 等）。
+- 回归检查：
+  1. 所有页面底部留白可见
+  2. 无横向滚动条
+  3. Header 不丢失
+  4. 双列不挤压
+
+## 4. 现有页面索引（改造范围）
+
+### 4.1 板块承载与导航层
+
+- `src/views/bill/billLayout/index.vue`
+- `src/views/bill/billLayout/components/BillHeader.vue`
+- `src/views/bill/index.vue`
+- `src/views/bill/deepDig/index.vue`
+- `src/views/bill/influence/index.vue`
+
+### 4.2 法案概况（Bill）
+
+- `src/views/bill/introdoction/index.vue`
+- `src/views/bill/background/index.vue`
+- `src/views/bill/template/index.vue`
+- `src/views/bill/billOriginalText/index.vue`
+
+### 4.3 深度挖掘（DeepDig）
+
+- `src/views/bill/deepDig/processOverview/index.vue`
+- `src/views/bill/deepDig/processAnalysis/index.vue`
+- `src/views/bill/deepDig/poliContribution/index.vue`
+
+### 4.4 影响分析（Influence）
+
+- `src/views/bill/influence/industry/index.vue`
+- `src/views/bill/influence/scientificResearch/index.vue`
+- `src/views/bill/influence/ProgressForecast/index.vue`
+
+### 4.5 其他相关页面
+
+- `src/views/bill/relevantCircumstance/index.vue`
+- `src/views/bill/versionCompare/index.vue`
+- `src/views/bill/billHome/index.vue`
+
+## 5. 迁移原则（执行时必须遵守）
+
+1. 不改变业务逻辑（API、状态、路由行为）
+2. 先替换布局骨架，再替换样式细节
+3. 每次只迁移少量页面，保证可回滚
+4. 对“固定高度 + 内部滚动”页面优先保守改造
+5. 若页面是横向 flex 主体，禁止直接插入会改变横向布局的占位节点
+
+## 6. 验收标准
+
+1. `@bill` 目标页面滚动到底统一可见 `30px` 留白
+2. 页面核心布局（左右列、卡片）不变形
+3. `BillHeader` 的 Tab 与功能按钮稳定显示
+4. 不新增横向滚动条
+5. 关键路由刷新后视觉一致
+
+## 7. 新会话接续建议
+
+新会话可直接按以下顺序继续：
+
+1. 先读取本文件：
+   - `src/views/bill/BILL_LAYOUT_UNIFICATION_PLAN.md`
+2. 先完成组件脚手架：
+   - `BillPageShell.vue`
+   - `BillTwoColumn.vue`
+   - `BillPanel.vue`
+3. 首个迁移页：
+   - `src/views/bill/background/index.vue`
+4. 迁移完成后逐页扩展到 `introdoction/template/processOverview/processAnalysis`
+
+---
+
+最后更新：2026-04-02

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

@@ -61,7 +61,7 @@
 				</div>
 
 				<div class="right-box-bottom" v-if="showActions">
-					<div class="btn2" @click="emit('open-analysis', 'forsee')">
+					<div class="btn2" v-if="showForsee" @click="emit('open-analysis', 'forsee')">
 						<div class="icon">
 							<img :src="btnIconForsee" alt="" />
 						</div>
@@ -108,6 +108,10 @@ const props = defineProps({
 	showActions: {
 		type: Boolean,
 		default: true
+	},
+	showForsee: {
+		type: Boolean,
+		default: true
 	}
 });
 
@@ -154,9 +158,7 @@ const emit = defineEmits(["tab-click", "open-analysis"]);
 }
 
 .header-main {
-	position: sticky;
-	top: 0;
-	z-index: 1000;
+	position: relative;
 	width: 100%;
 	background-color: #fff;
 	box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05);

src/views/bill/billLayout/index.vue

@@ -4,7 +4,8 @@
 		<div class="layout-main">
 			<BillHeader :billInfo="billInfoGlobal" :defaultLogo="USALogo" :tabs="mainHeaderBtnList"
 				:activeTitle="activeTitle" :showTabs="showHeaderTabs" :showActions="showHeaderActions"
-				@tab-click="handleClickMainHeaderBtn" @open-analysis="handleAnalysisClick" />
+				:showForsee="showForseeAction" @tab-click="handleClickMainHeaderBtn"
+				@open-analysis="handleAnalysisClick" />
 
 			<div class="layout-main-center">
 				<router-view />
@@ -14,10 +15,10 @@
 </template>
 
 <script setup>
-import { ref, onMounted, watch } from "vue";
+import { ref, onMounted, watch, computed } from "vue";
 import router from "@/router";
 import { useRoute } from "vue-router";
-import { getBillInfoGlobal } from "@/api/bill";
+import { getBillInfoGlobal, getBillInfo } from "@/api/bill";
 import BillHeader from "./components/BillHeader.vue";
 
 const route = useRoute();
@@ -77,6 +78,25 @@ const activeTitle = ref("法案概况");
 const showHeaderTabs = ref(true);
 const showHeaderActions = ref(true);
 
+const billBasicInfo = ref({});
+const getBillBasicInfoFn = async () => {
+	const billId = route.query.billId;
+	if (!billId) return;
+	try {
+		const res = await getBillInfo({ id: billId });
+		billBasicInfo.value = res?.data || {};
+	} catch (error) {
+		console.error(error);
+		billBasicInfo.value = {};
+	}
+};
+
+const showForseeAction = computed(() => {
+	const stageList = Array.isArray(billBasicInfo.value?.stageList) ? billBasicInfo.value.stageList : [];
+	const latestStage = stageList.length ? String(stageList[stageList.length - 1] || "").trim() : "";
+	return !latestStage.includes("完成立法");
+});
+
 const getActiveTitleByRoutePath = path => {
 	if (path.startsWith("/billLayout/deepDig")) return "深度挖掘";
 	if (path.startsWith("/billLayout/influence")) return "影响分析";
@@ -132,6 +152,7 @@ const handleAnalysisClick = analysisType => {
 
 onMounted(() => {
 	getBillInfoGlobalFn();
+	getBillBasicInfoFn();
 	// 以当前路由为准，避免 sessionStorage 造成高亮错乱
 	syncHeaderStateFromRoute();
 	// 兜底：如果未来出现未知路由且有缓存，再用缓存
@@ -143,6 +164,14 @@ watch(
 	() => route.path,
 	() => {
 		syncHeaderStateFromRoute();
+	}
+);
+
+watch(
+	() => route.query.billId,
+	() => {
+		getBillInfoGlobalFn();
+		getBillBasicInfoFn();
 	},
 	{ immediate: true }
 );
@@ -160,12 +189,12 @@ watch(
 		width: 100%;
 		height: 100vh;
 		overflow-y: auto;
+		overflow-x: hidden;
 
 		.layout-main-center {
-			// height: calc(100% - 137px);
 			width: 1600px;
+			max-width: 100%;
 			margin: 0 auto;
-			padding-bottom: 20px;
 		}
 	}
 }

src/views/bill/components/layout/BillPageShell.vue

+<template>
+  <div class="bill-page-shell" :class="shellClass" :style="shellStyle">
+    <div class="bill-page-shell__content" :class="contentClass">
+      <slot />
+    </div>
+  </div>
+</template>
+
+<script>
+const BILL_DEFAULT_BOTTOM_SAFE_SPACE = 30
+
+export default {
+  name: 'BillPageShell',
+  props: {
+    bottomSafeSpace: {
+      type: Number,
+      default: BILL_DEFAULT_BOTTOM_SAFE_SPACE
+    },
+    shellClass: {
+      type: [String, Array, Object],
+      default: ''
+    },
+    contentClass: {
+      type: [String, Array, Object],
+      default: ''
+    }
+  },
+  computed: {
+    shellStyle() {
+      return {
+        paddingBottom: `${this.bottomSafeSpace}px`
+      }
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@import '@/styles/bill-tokens.scss';
+
+.bill-page-shell {
+  width: 100%;
+  min-height: 0;
+  box-sizing: border-box;
+}
+
+.bill-page-shell__content {
+  width: 100%;
+  color: $bill-text-primary;
+}
+</style>

src/views/bill/components/layout/BillPanel.vue

+<template>
+  <section class="bill-panel" :class="panelClass" :style="panelStyle">
+    <header
+      v-if="$slots.header"
+      class="bill-panel__header"
+      :class="headerClass"
+      :style="sectionStyle"
+    >
+      <slot name="header" />
+    </header>
+
+    <div class="bill-panel__body" :class="bodyClass" :style="sectionStyle">
+      <slot />
+    </div>
+
+    <footer
+      v-if="$slots.footer"
+      class="bill-panel__footer"
+      :class="footerClass"
+      :style="sectionStyle"
+    >
+      <slot name="footer" />
+    </footer>
+  </section>
+</template>
+
+<script>
+const BILL_DEFAULT_PANEL_PADDING = 16
+const BILL_DEFAULT_PANEL_RADIUS = 8
+
+export default {
+  name: 'BillPanel',
+  props: {
+    panelClass: {
+      type: [String, Array, Object],
+      default: ''
+    },
+    headerClass: {
+      type: [String, Array, Object],
+      default: ''
+    },
+    bodyClass: {
+      type: [String, Array, Object],
+      default: ''
+    },
+    footerClass: {
+      type: [String, Array, Object],
+      default: ''
+    },
+    padding: {
+      type: Number,
+      default: BILL_DEFAULT_PANEL_PADDING
+    },
+    borderRadius: {
+      type: Number,
+      default: BILL_DEFAULT_PANEL_RADIUS
+    },
+    bordered: {
+      type: Boolean,
+      default: true
+    },
+    shadow: {
+      type: Boolean,
+      default: false
+    },
+    background: {
+      type: String,
+      default: '#fff'
+    }
+  },
+  computed: {
+    panelStyle() {
+      return {
+        background: this.background,
+        borderRadius: `${this.borderRadius}px`,
+        border: this.bordered ? '1px solid #e8ecf3' : 'none',
+        boxShadow: this.shadow ? '0 2px 8px rgba(15, 35, 95, 0.06)' : 'none'
+      }
+    },
+    sectionStyle() {
+      return {
+        padding: `${this.padding}px`
+      }
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@import '@/styles/bill-tokens.scss';
+
+.bill-panel {
+  width: 100%;
+  box-sizing: border-box;
+  color: $bill-text-primary;
+}
+
+.bill-panel__header,
+.bill-panel__body,
+.bill-panel__footer {
+  width: 100%;
+  box-sizing: border-box;
+}
+
+.bill-panel__header {
+  padding-bottom: $bill-space-12;
+}
+
+.bill-panel__footer {
+  padding-top: $bill-space-12;
+}
+
+.bill-panel__header:empty,
+.bill-panel__footer:empty {
+  display: none;
+}
+</style>

src/views/bill/components/layout/BillTwoColumn.vue

+<template>
+  <div class="bill-two-column" :class="wrapperClass" :style="wrapperStyle">
+    <div class="bill-two-column__left" :style="leftStyle">
+      <slot name="left" />
+    </div>
+    <div class="bill-two-column__right" :style="rightStyle">
+      <slot name="right" />
+    </div>
+  </div>
+</template>
+
+<script>
+const BILL_DEFAULT_LEFT_WIDTH = 1064
+const BILL_DEFAULT_RIGHT_WIDTH = 520
+const BILL_DEFAULT_COLUMN_GAP = 16
+const BILL_DEFAULT_MIN_STACK_WIDTH = 1660
+
+export default {
+  name: 'BillTwoColumn',
+  props: {
+    leftWidth: {
+      type: Number,
+      default: BILL_DEFAULT_LEFT_WIDTH
+    },
+    rightWidth: {
+      type: Number,
+      default: BILL_DEFAULT_RIGHT_WIDTH
+    },
+    gap: {
+      type: Number,
+      default: BILL_DEFAULT_COLUMN_GAP
+    },
+    minStackWidth: {
+      type: Number,
+      default: BILL_DEFAULT_MIN_STACK_WIDTH
+    },
+    stackOnNarrow: {
+      type: Boolean,
+      default: true
+    },
+    wrapperClass: {
+      type: [String, Array, Object],
+      default: ''
+    }
+  },
+  computed: {
+    shouldStack() {
+      if (!this.stackOnNarrow || typeof window === 'undefined') {
+        return false
+      }
+      return window.innerWidth < this.minStackWidth
+    },
+    wrapperStyle() {
+      if (this.shouldStack) {
+        return {
+          display: 'flex',
+          flexDirection: 'column',
+          gap: `${this.gap}px`
+        }
+      }
+
+      return {
+        display: 'grid',
+        gridTemplateColumns: `${this.leftWidth}px ${this.rightWidth}px`,
+        columnGap: `${this.gap}px`,
+        alignItems: 'start'
+      }
+    },
+    leftStyle() {
+      if (this.shouldStack) {
+        return {
+          width: '100%'
+        }
+      }
+
+      return {
+        minWidth: '0'
+      }
+    },
+    rightStyle() {
+      if (this.shouldStack) {
+        return {
+          width: '100%'
+        }
+      }
+
+      return {
+        minWidth: '0'
+      }
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@import '@/styles/bill-tokens.scss';
+
+.bill-two-column {
+  width: 100%;
+  min-width: 0;
+  color: $bill-text-primary;
+}
+
+.bill-two-column__left,
+.bill-two-column__right {
+  min-width: 0;
+}
+</style>

src/views/bill/components/layout/index.js

+import BillPageShell from './BillPageShell.vue'
+import BillTwoColumn from './BillTwoColumn.vue'
+import BillPanel from './BillPanel.vue'
+
+export {
+  BillPageShell,
+  BillTwoColumn,
+  BillPanel
+}

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

 <template>
-	<div class="wrap">
+	<BillPageShell class="wrap">
 		<div class="left">
 			<div class="box1">
 				<!-- <div class="box-header">
@@ -31,7 +31,7 @@
 						</div>
 					</div>
 				</div> -->
-				<AnalysisBox title="典型阶段耗时">
+				<AnalysisBox title="典型阶段耗时分析">
 					<div class="analysis-ai-wrapper analysis-ai-wrapper--box1">
 						<div class="box1-main" :class="{ 'box1-main--full': !timeFooterText }">
 							<div class="box1-main-center" id="chart1"></div>
@@ -48,7 +48,7 @@
 							</div>
 						</div>
 						<div v-if="!aiPaneVisible.box1" class="analysis-ai-tip-row">
-							<TipTab class="analysis-ai-tip" />
+							<TipTab class="analysis-ai-tip" :text="'与历史同类法案的典型阶段耗时对比分析,数据来源：美国国会官网'"/>
 							<AiButton class="analysis-ai-tip-action" @mouseenter="handleShowAiPane('box1')" />
 						</div>
 						<div v-if="aiPaneVisible.box1" class="analysis-ai-pane" @mouseleave="handleHideAiPane('box1')">
@@ -105,7 +105,7 @@
 							</div>
 						</div>
 						<div v-if="!aiPaneVisible.box2" class="analysis-ai-tip-row">
-							<TipTab class="analysis-ai-tip" />
+							<TipTab class="analysis-ai-tip" :text="'与历史同类法案的修正案次数对比分析,数据来源：美国国会官网'"/>
 							<AiButton class="analysis-ai-tip-action" @mouseenter="handleShowAiPane('box2')" />
 						</div>
 						<div v-if="aiPaneVisible.box2" class="analysis-ai-pane" @mouseleave="handleHideAiPane('box2')">
@@ -716,7 +716,7 @@
 				</AnalysisBox>
 			</div>
 		</div>
-	</div>
+	</BillPageShell>
 </template>
 
 <script setup>
@@ -728,6 +728,7 @@ import { getChartAnalysis } from "@/api/aiAnalysis/index";
 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 { BillPageShell } from "../../components/layout";
 
 import icon1 from "./assets/images/icon1.png";
 import icon2 from "./assets/images/icon2.png";
@@ -1160,7 +1161,7 @@ onMounted(async () => {
 		min: "最小次数",
 		current: "该法案修正案数量"
 	};
-	let chart2 = getBoxPlotChcart(chartData2.value, "次", countLabels);
+	let chart2 = getBoxPlotChcart(chartData2.value, "项", countLabels);
 	setChart(chart2, "chart2");
 });
 </script>
@@ -1168,6 +1169,8 @@ onMounted(async () => {
 <style lang="scss" scoped>
 .wrap {
 	display: flex;
+	margin-bottom: 30px;
+
 
 	.box-header {
 		height: 56px;

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

 <template>
-  <div class="process-overview-wrap">
+  <BillPageShell class="process-overview-wrap">
     <AnalysisBox title="流程概要" :showAllBtn="false">
       <div class="main">
         <div class="left" :style="{ width: boardWidth + 'px' }">
@@ -194,7 +194,7 @@
       :position="dialogPos"
       @close="handleClickDetail(false)"
     />
-  </div>
+  </BillPageShell>
 </template>
 
 <script setup>
@@ -202,6 +202,7 @@ import { ref, onMounted, computed, nextTick } from "vue";
 import { getBillDyqkSummary } from "@/api/bill";
 import CommonPrompt from "../../commonPrompt/index.vue";
 import ProcessOverviewDetailDialog from "../../ProcessOverviewDetailDialog.vue";
+import { BillPageShell } from "../../components/layout";
 
 const actionList = ref([]);
 const isShowDetailDialog = ref(false);
@@ -499,6 +500,7 @@ const updateRightTop = () => {
   width: 1600px;
   height: 848px;
   margin-top: 16px;
+  margin-bottom: 30px;
   position: relative;
 
   .main {
@@ -799,20 +801,13 @@ const updateRightTop = () => {
 
             .text {
               width: 240px;
+              max-width: 100%;
               color: rgb(59, 65, 75);
               font-size: 16px;
               line-height: 24px;
-              display: -webkit-box;
-              line-clamp: 2;
-              -webkit-line-clamp: 2;
-              -webkit-box-orient: vertical;
+              white-space: nowrap;
               overflow: hidden;
               text-overflow: ellipsis;
-              height: 48px;
-            }
-
-            :deep(.text-ellipsis) {
-              white-space: normal !important;
             }
           }
         }

src/views/bill/introdoction/index.vue

 <template>
-	<div class="introduction-wrap">
+	<BillPageShell class="introduction-wrap">
 		<WarningPane v-if="riskSignal" class="risk-signal-pane-top" :warnningLevel="riskSignal.riskLevel"
 			:warnningContent="riskSignal.riskContent" />
-		<div class="introduction-wrap-content">
-			<div class="introduction-wrap-left">
+		<BillTwoColumn class="introduction-wrap-content" :stack-on-narrow="false">
+			<template #left>
+				<div class="introduction-wrap-left">
 				<div class="introduction-wrap-left-box1">
 
 					<AnalysisBox title="基本信息" :showAllBtn="false">
@@ -69,10 +70,12 @@
 						</div>
 					</AnalysisBox>
 				</div>
-			</div>
-			<div class="introduction-wrap-right">
-				<AnalysisBox title="提出人" :showAllBtn="false">
-					<div class="introduction-wrap-right-main">
+				</div>
+			</template>
+			<template #right>
+				<div class="introduction-wrap-right">
+					<AnalysisBox title="提出人" :showAllBtn="false">
+						<div class="introduction-wrap-right-main">
 						<div class="right-main-box1">
 							<div class="name-box">
 								<div class="person-box">
@@ -139,10 +142,11 @@
 							</div>
 						</div>
 					</div>
-				</AnalysisBox>
-			</div>
-		</div>
-	</div>
+					</AnalysisBox>
+				</div>
+			</template>
+		</BillTwoColumn>
+	</BillPageShell>
 </template>
 
 <script setup>
@@ -151,6 +155,7 @@ import { useRoute, useRouter } from "vue-router";
 import WordCloudMap from "./WordCloudMap.vue";
 import STimeline from "./STimeline.vue";
 import WarningPane from "@/components/base/WarningPane/index.vue";
+import { BillPageShell, BillTwoColumn } from "../components/layout";
 import { getBillInfo, getBillPerson, getBillEvent, getBillDyqk } from "@/api/bill";
 import { getPersonSummaryInfo } from "@/api/common/index";
 import defaultAvatar from "../assets/images/default-icon1.png";
@@ -338,6 +343,14 @@ onMounted(() => {
 	height: auto;
 	display: flex;
 	flex-direction: column;
+	box-sizing: border-box;
+
+	.page-bottom-gap {
+		height: 30px;
+		width: 100%;
+		flex-shrink: 0;
+		pointer-events: none;
+	}
 
 	.progress-header-btns {
 		display: flex;
@@ -432,6 +445,7 @@ onMounted(() => {
 
 	.introduction-wrap-content {
 		display: flex;
+		margin-bottom: 30px;
 	}
 
 	.introduction-wrap-left {
@@ -497,7 +511,6 @@ onMounted(() => {
 							flex-wrap: wrap;
 							align-items: center;
 							width: 700px;
-							min-height: 40px;
 							gap: 8px;
 
 							.right1-item {
@@ -769,8 +782,6 @@ onMounted(() => {
 
 	.introduction-wrap-right {
 		margin-top: 16px;
-		margin-left: 16px;
-		margin-right: 18px;
 		width: 520px;
 		height: 845px;
 

src/views/decree/decreeOriginal/index.vue

@@ -26,7 +26,7 @@
 			</div>
 
 			<div class="layout-main-center">
-				<BaseDecreeOriginal :report-data="reportData" @download="handleDownload" />
+				<newOriginal ref="refNewOriginal" @download="handleDownload"></newOriginal>
 			</div>
 		</div>
 	</div>
@@ -38,7 +38,7 @@ import { useRoute } from "vue-router";
 import { ElMessage } from "element-plus";
 import { getDecreeSummary } from "@/api/decree/introduction";
 import { getDecreeReport } from "@/api/decree/introduction";
-import BaseDecreeOriginal from "@/components/base/DecreeOriginal/index.vue";
+import newOriginal from "@/components/base/DecreeOriginal/newOriginal.vue";
 
 const route = useRoute();
 let pdfUrl = "";
@@ -98,26 +98,16 @@ const handleGetSummary = async () => {
 };
 
 // 获取报告原文 - 修改为获取分段数组
-const reportData = ref([]);
+const refNewOriginal = ref(null);
 const handleGetReport = async () => {
 	try {
 		const res = await getDecreeReport({id: route.query.id});
 		console.log("报告原文", res);
-		if (res.code === 200 && res.data) {
+		if (res.code === 200) {
 			pdfUrl = res.data.pdfUrl;
-			const originData = [];
-			let num = Math.max(res.data.content.length, res.data.contentEn.length)
-			for (let i = 0; i < num; i++) {
-				let obj = {
-					content: res.data.content[i] || "",
-					contentEn: res.data.contentEn[i] || "",
-					num: i + 1,
-				}
-				originData.push(obj);
-			}
-			reportData.value = JSON.parse(JSON.stringify(originData));
+			refNewOriginal.value.setOriginalData({...res.data});
 		}
-	} catch (error) { }
+	} catch (error) {}
 };
 
 onMounted(() => {

src/views/marketAccessRestrictions/com/RelatedEvent.vue

 <template>
   <AnalysisBox :title="props.title" :showAllBtn="false" height="auto">
     <div class="box-main">
+			<el-empty v-if="!props.listData?.length" description="暂无数据" :image-size="200" />
       <div v-for="(item, index) in props.listData" :key="index" class="box-item">
-        <div class="item-tag">行政令</div>
-        <div class="item-right">
+        <div class="item-tag" :class="getClassName(item)">{{ item.TYPE }}</div>
+        <div class="item-right" @click="onNavigateTo(item)">
           <div class="item-head">
-            <div class="item-name one-line-ellipsis">{{ item.name }}</div>
-            <div class="item-time">{{ item.time }}</div>
+            <div class="item-name one-line-ellipsis text-click-hover">{{ item.NAME }}</div>
+            <div class="item-time">{{ item.DATE }}</div>
           </div>
-          <div class="item-text one-line-ellipsis">{{ item.text }}</div>
+          <div class="item-text one-line-ellipsis">{{ item.SUMMARY }}</div>
         </div>
       </div>
     </div>
@@ -16,6 +17,8 @@
 </template>
 
 <script setup lang="ts" name="RelatedEvent">
+import router from "@/router";
+import { useGotoNewsDetail } from '@/router/modules/news';
 
 const props = defineProps({
   listData: {
@@ -28,6 +31,43 @@ const props = defineProps({
   }
 })
 
+const getClassName = (item: any) => {
+	switch (item.TYPE) {
+		case "行政令":
+			return "theme1"
+		case "新闻":
+			return "theme2"
+		case "法案":
+			return "theme3"
+		default:
+			return "theme1"
+	}
+}
+
+// 跳转相关事件
+const gotoNewsDetail = useGotoNewsDetail()
+const onNavigateTo = (item: any) => {
+		switch (item.TYPE) {
+		case "行政令":
+			let route1 = router.resolve({
+				path: "/decreeLayout",
+				query: { id: item.ID }
+			});
+			window.open(route1.href, "_blank");
+		break;
+		case "新闻":
+			gotoNewsDetail(item.ID)
+		break;
+		case "法案":
+			let route2 = router.resolve({
+				path: "/billLayout",
+				query: { billId: item.ID }
+			});
+			window.open(route2.href, "_blank");
+		break;
+	}
+}
+
 </script>
 
 <style scoped lang="scss">
@@ -47,10 +87,9 @@ const props = defineProps({
 			text-align: center;
 			margin-right: 16px;
 			margin-top: 7px;
-			color: var(--color-yellow-100);
-			background-color: var(--color-yellow-10);
 		}
 		.item-right {
+			cursor: pointer;
 			width: 20px;
 			flex: auto;
 			line-height: 30px;
@@ -77,4 +116,17 @@ const props = defineProps({
 		border-bottom: 1px solid var(--bg-black-5);
 	}
 }
+
+.theme1 {
+	background-color: var(--color-yellow-10);
+	color: var(--color-yellow-100);
+}
+.theme2 {
+	background-color: var(--color-green-10);
+	color: var(--color-green-100);
+}
+.theme3 {
+	background-color: var(--color-orange-10);
+	color: var(--color-orange-100);
+}
 </style>
\ No newline at end of file

src/views/marketAccessRestrictions/com/SurveyAffiche.vue

+<template>
+  <AnalysisBox :title="props.title" :showAllBtn="false" height="auto">
+    <div class="box-main">
+      <el-empty v-if="!props.listData?.length" description="暂无数据" :image-size="100" />
+      <div v-for="(item, index) in props.listData" :key="index" class="box-item">
+        <div class="item-icon">
+          <img src="@/views/marketAccessRestrictions/singleCaseLayout/assets/images/icon_affiche.png" alt="">
+        </div>
+        <div class="item-right">
+          <div class="item-time">{{ item.time }}</div>
+          <div class="item-text">{{ item.content }}</div>
+        </div>
+      </div>
+    </div>
+  </AnalysisBox>
+</template>
+
+<script setup lang="ts" name="SurveyAffiche">
+
+const props = defineProps({
+  listData: {
+    type: Array as any,
+    default: () => ([])
+  },
+  title: {
+    type: String,
+    default: ""
+  }
+})
+
+</script>
+
+<style scoped lang="scss">
+.box-main {
+	padding: 0 16px 16px;
+	.box-item {
+		border-top: 1px solid var(--bg-black-5);
+		padding: 6px;
+		display: flex;
+		.item-icon {
+			width: 15px;
+			height: 15px;
+			font-size: 0px;
+			margin-right: 16px;
+			margin-top: 7px;
+			img {
+				width: 100%;
+				height: 100%;
+			}
+		}
+		.item-right {
+			width: 20px;
+			flex: auto;
+			font-family: Source Han Sans CN;
+			font-size: 16px;
+			line-height: 30px;
+			.item-time {
+				font-weight: bold;
+				color: var(--text-primary-80-color);
+			}
+			.item-text {
+				color: var(--text-primary-65-color);
+			}
+		}
+	}
+	.box-item:last-child {
+		border-bottom: 1px solid var(--bg-black-5);
+	}
+}
+</style>
\ No newline at end of file

src/views/marketAccessRestrictions/com/SurveyHistory.vue

 <template>
   <div class="view-box">
-    <el-empty v-if="!props.surveyList?.length" description="当前条件下暂无数据" :image-size="200" />
+    <el-empty v-if="!props.surveyList?.length" description="暂无数据" :image-size="100" />
     <div class="timeline-item" v-for="(item, index) in props.surveyList" :key="item.searchid" @click="onNavigateToDetail(item)">
       <div class="timeline-date">
         <div class="date-text">{{ item.searchdatezh.slice(0,4) }}</div>
@@ -16,14 +16,12 @@
       <div class="timeline-content-card">
         <div class="item-head">
           <div :class="`item-tag tag-${item.sortcode}`">{{ item.sortcode }}</div>
-          <div class="item-name">{{ item.searchname }}</div>
+          <div class="item-name one-line-ellipsis">{{ item.searchname }}</div>
           <div class="item-state">
             <span class="dot">•</span> {{ item.casestatus }}
           </div>
         </div>
-        <div class="card-body">
-          {{ item.content }}
-        </div>
+        <div class="card-body">{{ item.content }}</div>
         <div class="card-footer">
           <div class="footer-left-tags">
             <AreaTag v-for="(name, num) in item.searchArea" :key="num" :tagName="name"></AreaTag>
@@ -129,7 +127,7 @@ const onNavigateToDetail = item => {
   .timeline-content-card {
     width: 20px;
     flex: auto;
-    padding: 2px 16px 0;
+    padding: 4px 16px 0;
     margin-bottom: 30px;
 
     &:hover .item-head .item-name {

src/views/marketAccessRestrictions/marketAccessLayout/case/232/index.vue

@@ -32,39 +32,26 @@
 		<div class="wrapper-main">
 			<div class="left">
 				<!-- 科技领域 -->
-				<div class="left-box">
-					<div class="left-header">
-						<div class="icon"></div>
-						<div class="title">{{ "科技领域" }}</div>
-					</div>
-					<div class="left-main">
-						<el-checkbox-group class="checkbox-group" v-model="checkedAreaList" @change="handleCheckedAreasChange">
-							<el-checkbox class="filter-checkbox" label="全部领域"> 全部领域 </el-checkbox>
-							<el-checkbox v-for="area in surveyAreaList" :key="area.id" :label="area.id" class="filter-checkbox">
-								{{ area.name }}
-							</el-checkbox>
-						</el-checkbox-group>
+				<div class="check-box">
+					<div class="check-head">
+						<div class="head-name">{{ "科技领域" }}</div>
 					</div>
+					<el-checkbox-group class="check-list" v-model="checkedAreaList" @change="handleCheckedAreasChange">
+						<el-checkbox class="check-item" v-for="item in surveyAreaList" :key="item.id" :label="item.id">
+							{{ item.name }}
+						</el-checkbox>
+					</el-checkbox-group>
 				</div>
 				<!-- 发布时间 -->
-				<div class="left-box">
-					<div class="left-header">
-						<div class="icon"></div>
-						<div class="title">{{ "发布时间" }}</div>
+				<div class="check-box">
+					<div class="check-head">
+						<div class="head-name">{{ "发布时间" }}</div>
 					</div>
 					<div class="left-main">
-						<el-checkbox-group class="checkbox-group" v-model="checkedSurveyYears" @change="handleCheckedYearsChange">
-							<el-checkbox class="filter-checkbox" label="全部时间"> 全部时间 </el-checkbox>
-							<el-checkbox v-for="year in displayedYearList" :key="year.id" :label="year.id" class="filter-checkbox">
-								{{ year.name }}
+						<el-checkbox-group class="check-list" v-model="checkedYearList" @change="handleCheckedYearsChange">
+							<el-checkbox class="check-item" v-for="item in surveyYearList" :key="item.id" :label="item.id">
+								{{ item.name }}
 							</el-checkbox>
-							<div v-if="surveyYearList.length > 6" class="expand-btn" @click="isYearExpanded = !isYearExpanded">
-								{{ isYearExpanded ? "收起" : "更早" }}
-								<el-icon>
-									<ArrowUp v-if="isYearExpanded" />
-									<ArrowDown v-else />
-								</el-icon>
-							</div>
 						</el-checkbox-group>
 					</div>
 				</div>
@@ -98,8 +85,8 @@
 </template>
 
 <script setup>
-import { ref, onMounted, watch, computed } from "vue";
-import { Search, ArrowDown, ArrowUp } from "@element-plus/icons-vue";
+import { ref, onMounted, watch } from "vue";
+import { Search } from "@element-plus/icons-vue";
 import { getSearchAllArea, getSearchAllYear, getSurveyList } from "@/api/marketAccessRestrictions";
 import SurveyHistory from "@/views/marketAccessRestrictions/com/SurveyHistory.vue"
 
@@ -116,42 +103,49 @@ const handleSwithSort = () => {
 
 // 科技领域过滤
 const surveyAreaList = ref([]);
-const checkedAreaList = ref([]);
-const checkAllAreas = ref(true);
-const isIndeterminateAreas = ref(false);
-
-const handleCheckAllAreasChange = val => {
-	checkedAreaList.value = val ? surveyAreaList.value.map(a => a.id) : [];
-	isIndeterminateAreas.value = false;
+const checkedAreaList = ref(['']);
+const handleGetSearchAllArea = async () => {
+	try {
+		const res = await getSearchAllArea({ sortCode: "232" });
+		if (res.code === 200) {
+			surveyAreaList.value = res.data.map(item => ({ name: item.AREANAME, id: item.AREACODE }));
+		}
+	} catch (error) {}
+	surveyAreaList.value.unshift({ name: "全部领域", id: "" });
 };
-
-const handleCheckedAreasChange = value => {
-	const checkedCount = value.length;
-	checkAllAreas.value = checkedCount === surveyAreaList.value.length;
-	isIndeterminateAreas.value = checkedCount > 0 && checkedCount < surveyAreaList.value.length;
+const handleCheckedAreasChange = event => {
+	if (event.length && event[event.length-1] !== "") {
+		checkedAreaList.value = event.filter(item => item !== "");
+	} else {
+		checkedAreaList.value = [""];
+	}
+	currentPage.value = 1;
+	handleFetchSurveyList();
 };
 
 // 发布时间过滤
 const surveyYearList = ref([]);
-const checkedSurveyYears = ref([]);
-const checkAllYears = ref(true);
-const isIndeterminateYears = ref(false);
-const isYearExpanded = ref(false);
-
-const displayedYearList = computed(() => {
-	if (isYearExpanded.value) return surveyYearList.value;
-	return surveyYearList.value.slice(0, 6);
-});
-
-const handleCheckAllYearsChange = val => {
-	checkedSurveyYears.value = val ? surveyYearList.value.map(y => y.id) : [];
-	isIndeterminateYears.value = false;
+const checkedYearList = ref(['']);
+const handleGetSearchAllYear = async () => {
+	try {
+		const res = await getSearchAllYear({ sortCode: "232" });
+		if (res.code === 200) {
+			let allYear = res.data.sort((a, b) => (b-a));
+			let beforeYear = allYear.slice(6).join(',');
+			surveyYearList.value = allYear.slice(0, 6).map(item => ({ name: item + "年", id: item }));
+			if (beforeYear) surveyYearList.value.push({ name: "更早", id: beforeYear });
+		}
+	} catch (error) {}
+	surveyYearList.value.unshift({ name: "全部时间", id: "" });
 };
-
-const handleCheckedYearsChange = value => {
-	const checkedCount = value.length;
-	checkAllYears.value = checkedCount === surveyYearList.value.length;
-	isIndeterminateYears.value = checkedCount > 0 && checkedCount < surveyYearList.value.length;
+const handleCheckedYearsChange = event => {
+	if (event.length && event[event.length-1] !== "") {
+		checkedYearList.value = event.filter(item => item !== "");
+	} else {
+		checkedYearList.value = [""];
+	}
+	currentPage.value = 1;
+	handleFetchSurveyList();
 };
 
 // 数据列表
@@ -169,8 +163,8 @@ const handleFetchSurveyList = async () => {
 			currentPage: currentPage.value - 1,
 			pageSize: pageSize.value,
 			sortCode: "232",
-			publishYear: checkAllYears.value ? "" : checkedSurveyYears.value.toString(),
-			Area: checkAllAreas.value ? "" : checkedAreaList.value.toString(),
+			publishYear: checkedYearList.value.join(',') || null,
+			Area: checkedAreaList.value.join(',') || null,
 			caseStatus: filterStage.value,
 			keywords: searchText.value,
 			sortField: "date",
@@ -199,39 +193,12 @@ const handleSearch = () => {
 };
 
 // 监听过滤条件
-watch([checkedSurveyYears, checkedAreaList, isSort, filterStage, filterParty, filterReason], () => {
+watch([isSort, filterStage, filterParty, filterReason], () => {
 	if (isInitializing.value) return;
 	currentPage.value = 1;
 	handleFetchSurveyList();
 });
 
-const handleGetSearchAllArea = async () => {
-	try {
-		const res = await getSearchAllArea({ sortCode: "232" });
-		if (res.code === 200 && res.data) {
-			surveyAreaList.value = res.data.map(item => ({
-				name: item.AREANAME,
-				id: item.AREACODE
-			}));
-			handleCheckAllAreasChange(true);
-		}
-	} catch (error) {}
-};
-
-const handleGetSearchAllYear = async () => {
-	try {
-		const res = await getSearchAllYear({ sortCode: "232" });
-		if (res.code === 200 && res.data) {
-			const sortedYears = res.data.sort((a, b) => b - a);
-			surveyYearList.value = sortedYears.map(item => ({
-				name: item + "年",
-				id: item
-			}));
-			handleCheckAllYearsChange(true);
-		}
-	} catch (error) {}
-};
-
 onMounted(async () => {
 	await Promise.all([handleGetSearchAllArea(), handleGetSearchAllYear()]);
 	isInitializing.value = false;
@@ -306,58 +273,50 @@ onMounted(async () => {
 
 		.left {
 			width: 360px;
-			min-height: 560px;
+			min-height: 300px;
 			height: fit-content;
 			padding-bottom: 20px;
 			border-radius: 10px;
 			box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
 			background: #fff;
 
-			.left-box {
-				margin-top: 17px;
-
-				.left-header {
-					display: flex;
-					align-items: center;
-
-					.icon {
+			.check-box {
+				margin-top: 18px;
+				.check-head {
+					position: relative;
+					margin-bottom: 12px;
+					&::before {
+						content: "";
+						position: absolute;
+						top: 0px;
+						left: 0px;
 						width: 8px;
-						height: 16px;
-						background: var(--color-main-active);
+						height: 100%;
+						background: var(--color-primary-100);
 						border-radius: 0 2px 2px 0;
 					}
-
-					.title {
-						margin-left: 17px;
-						color: var(--color-main-active);
+					.head-name {
+						margin-left: 25px;
+						color: var(--color-primary-100);
 						font-size: 16px;
-						font-weight: 700;
+						line-height: 16px;
+						font-family: Source Han Sans CN;
+						font-weight: bold;
 					}
 				}
-			}
-
-			.checkbox-group {
-				padding: 10px 0 0 25px;
-				.filter-checkbox {
-					width: 130px;
-					margin-bottom: 8px;
-					height: 32px;
-					:deep(.el-checkbox__label) {
-						font-size: 16px;
-						color: #5f656c;
-					}
-				}
-
-				.expand-btn {
-					color: var(--color-main-active);
-					font-size: 14px;
-					cursor: pointer;
-					display: flex;
-					align-items: center;
-					margin-top: 4px;
-
-					.el-icon {
-						margin-left: 4px;
+				.check-list {
+					padding: 0 10px 0 25px;
+					display: grid;
+					grid-template-columns: repeat(2, 1fr);
+					grid-gap: 0 12px;
+					.check-item {
+						width: 100%;
+						height: 32px;
+						:deep(.el-checkbox__label) {
+							font-family: Source Han Sans CN;
+							font-size: 16px;
+							color: var(--text-primary-65-color);
+						}
 					}
 				}
 			}

src/views/marketAccessRestrictions/marketAccessLayout/case/301/index.vue

@@ -21,39 +21,26 @@
 		<div class="wrapper-main">
 			<div class="left">
         <!-- 科技领域 -->
-				<div class="left-box">
-					<div class="left-header">
-						<div class="icon"></div>
-						<div class="title">{{ "科技领域" }}</div>
-					</div>
-					<div class="left-main">
-						<el-checkbox-group class="checkbox-group" v-model="checkedAreaList" @change="handleCheckedAreasChange">
-							<el-checkbox class="filter-checkbox" label="全部领域"> 全部领域 </el-checkbox>
-							<el-checkbox v-for="area in surveyAreaList" :key="area.id" :label="area.id" class="filter-checkbox">
-								{{ area.name }}
-							</el-checkbox>
-						</el-checkbox-group>
+				<div class="check-box">
+					<div class="check-head">
+						<div class="head-name">{{ "科技领域" }}</div>
 					</div>
+					<el-checkbox-group class="check-list" v-model="checkedAreaList" @change="handleCheckedAreasChange">
+						<el-checkbox class="check-item" v-for="item in surveyAreaList" :key="item.id" :label="item.id">
+							{{ item.name }}
+						</el-checkbox>
+					</el-checkbox-group>
 				</div>
 				<!-- 发布时间 -->
-				<div class="left-box">
-					<div class="left-header">
-						<div class="icon"></div>
-						<div class="title">{{ "发布时间" }}</div>
+				<div class="check-box">
+					<div class="check-head">
+						<div class="head-name">{{ "发布时间" }}</div>
 					</div>
 					<div class="left-main">
-						<el-checkbox-group class="checkbox-group" v-model="checkedSurveyYears" @change="handleCheckedYearsChange">
-							<el-checkbox class="filter-checkbox" label="全部时间"> 全部时间 </el-checkbox>
-							<el-checkbox v-for="year in displayedYearList" :key="year.id" :label="year.id" class="filter-checkbox">
-								{{ year.name }}
+						<el-checkbox-group class="check-list" v-model="checkedYearList" @change="handleCheckedYearsChange">
+							<el-checkbox class="check-item" v-for="item in surveyYearList" :key="item.id" :label="item.id">
+								{{ item.name }}
 							</el-checkbox>
-							<div v-if="surveyYearList.length > 6" class="expand-btn" @click="isYearExpanded = !isYearExpanded">
-								{{ isYearExpanded ? "收起" : "更早" }}
-								<el-icon>
-									<ArrowUp v-if="isYearExpanded" />
-									<ArrowDown v-else />
-								</el-icon>
-							</div>
 						</el-checkbox-group>
 					</div>
 				</div>
@@ -78,8 +65,8 @@
 </template>
 
 <script setup>
-import { ref, onMounted, watch, computed } from "vue";
-import { Search, ArrowDown, ArrowUp } from "@element-plus/icons-vue";
+import { ref, onMounted, watch } from "vue";
+import { Search } from "@element-plus/icons-vue";
 import { getSearchAllArea, getSearchAllYear, getSurveyList } from "@/api/marketAccessRestrictions";
 import SurveyHistory from "@/views/marketAccessRestrictions/com/SurveyHistory.vue"
 
@@ -88,46 +75,51 @@ const handleSwithSort = () => {
 	isSort.value = !isSort.value;
 };
 
-const surveyYearList = ref([]);
-const checkedSurveyYears = ref([]);
-const isYearExpanded = ref(false);
-
-const displayedYearList = computed(() => {
-	if (isYearExpanded.value) {
-		return surveyYearList.value;
-	}
-	return surveyYearList.value.slice(0, 6);
-});
-
-const checkAllYears = ref(false);
-const isIndeterminateYears = ref(false);
-
-const handleCheckAllYearsChange = (val) => {
-	checkedSurveyYears.value = val ? surveyYearList.value.map(y => y.id) : [];
-	isIndeterminateYears.value = false;
+// 科技领域过滤
+const surveyAreaList = ref([]);
+const checkedAreaList = ref(['']);
+const handleGetSearchAllArea = async () => {
+	try {
+		const res = await getSearchAllArea({ sortCode: "301" });
+		if (res.code === 200) {
+			surveyAreaList.value = res.data.map(item => ({ name: item.AREANAME, id: item.AREACODE }));
+		}
+	} catch (error) {}
+	surveyAreaList.value.unshift({ name: "全部领域", id: "" });
 };
-
-const handleCheckedYearsChange = (value) => {
-	const checkedCount = value.length;
-	checkAllYears.value = checkedCount === surveyYearList.value.length;
-	isIndeterminateYears.value = checkedCount > 0 && checkedCount < surveyYearList.value.length;
+const handleCheckedAreasChange = event => {
+	if (event.length && event[event.length-1] !== "") {
+		checkedAreaList.value = event.filter(item => item !== "");
+	} else {
+		checkedAreaList.value = [""];
+	}
+	currentPage.value = 1;
+	handleFetchSurveyList();
 };
 
-const surveyAreaList = ref([]);
-const checkedAreaList = ref([]);
-
-const checkAllAreas = ref(false);
-const isIndeterminateAreas = ref(false);
-
-const handleCheckAllAreasChange = (val) => {
-	checkedAreaList.value = val ? surveyAreaList.value.map(a => a.id) : [];
-	isIndeterminateAreas.value = false;
+// 发布时间过滤
+const surveyYearList = ref([]);
+const checkedYearList = ref(['']);
+const handleGetSearchAllYear = async () => {
+	try {
+		const res = await getSearchAllYear({ sortCode: "301" });
+		if (res.code === 200) {
+			let allYear = res.data.sort((a, b) => (b-a));
+			let beforeYear = allYear.slice(6).join(',');
+			surveyYearList.value = allYear.slice(0, 6).map(item => ({ name: item + "年", id: item }));
+			if (beforeYear) surveyYearList.value.push({ name: "更早", id: beforeYear });
+		}
+	} catch (error) {}
+	surveyYearList.value.unshift({ name: "全部时间", id: "" });
 };
-
-const handleCheckedAreasChange = (value) => {
-	const checkedCount = value.length;
-	checkAllAreas.value = checkedCount === surveyAreaList.value.length;
-	isIndeterminateAreas.value = checkedCount > 0 && checkedCount < surveyAreaList.value.length;
+const handleCheckedYearsChange = event => {
+	if (event.length && event[event.length-1] !== "") {
+		checkedYearList.value = event.filter(item => item !== "");
+	} else {
+		checkedYearList.value = [""];
+	}
+	currentPage.value = 1;
+	handleFetchSurveyList();
 };
 
 const totalDiscussNum = ref(0);
@@ -145,8 +137,8 @@ const handleFetchSurveyList = async () => {
 			currentPage: currentPage.value - 1,
 			pageSize: pageSize.value,
 			sortCode: "301",
-			publishYear: checkAllYears.value ? "" : checkedSurveyYears.value.toString(),
-			Area: checkAllAreas.value ? "" : checkedAreaList.value.toString(),
+			publishYear: checkedYearList.value.join(',') || null,
+			Area: checkedAreaList.value.join(',') || null,
 			// keywords: searchText.value,
 			sortField: "date",
 			sortOrder: isSort.value ? "asc" : "desc"
@@ -173,60 +165,11 @@ const handleSearch = () => {
 	handleFetchSurveyList();
 };
 
-watch(
-	[checkedSurveyYears, checkedAreaList, isSort],
-	() => {
-		if (isInitializing.value) return;
-		currentPage.value = 1;
-		handleFetchSurveyList();
-	},
-	{
-		deep: true
-	}
-);
-
-const handleGetSearchAllArea = async () => {
-	try {
-		const res = await getSearchAllArea({
-			sortCode: '301'
-		});
-		if(res.code === 200 && res.data) {
-			surveyAreaList.value = res.data.map(item => {
-				return {
-					name: item.AREANAME,
-					id: item.AREACODE
-				};
-			});
-			// 默认选中全部
-			checkAllAreas.value = true;
-			handleCheckAllAreasChange(true);
-		}
-	} catch (error) {
-	}
-}
-
-const handleGetSearchAllYear = async () => {
-	try {
-		const res = await getSearchAllYear({
-			sortCode: '301'
-		});
-		if(res.code === 200 && res.data) {
-			// 排序并格式化
-			const sortedYears = res.data.sort((a, b) => b - a);
-			surveyYearList.value = sortedYears.map(item => {
-				return {
-					name: item + '年',
-					id: item
-				};
-			});
-			// 默认选中全部
-			checkAllYears.value = true;
-			handleCheckAllYearsChange(true);
-		}
-	} catch (error) {
-		
-	}
-}
+watch([isSort], () => {
+	if (isInitializing.value) return;
+	currentPage.value = 1;
+	handleFetchSurveyList();
+});
 
 onMounted(async () => {
 	await Promise.all([handleGetSearchAllArea(), handleGetSearchAllYear()]);
@@ -309,58 +252,50 @@ onMounted(async () => {
 		
 		.left {
 			width: 360px;
-			min-height: 560px;
+			min-height: 300px;
 			height: fit-content;
 			padding-bottom: 20px;
 			border-radius: 10px;
 			box-shadow: 0px 0px 15px 0px rgba(60, 87, 126, 0.2);
 			background: #fff;
 
-			.left-box {
-				margin-top: 17px;
-
-				.left-header {
-					display: flex;
-					align-items: center;
-
-					.icon {
+			.check-box {
+				margin-top: 18px;
+				.check-head {
+					position: relative;
+					margin-bottom: 12px;
+					&::before {
+						content: "";
+						position: absolute;
+						top: 0px;
+						left: 0px;
 						width: 8px;
-						height: 16px;
-						background: var(--color-main-active);
+						height: 100%;
+						background: var(--color-primary-100);
 						border-radius: 0 2px 2px 0;
 					}
-
-					.title {
-						margin-left: 17px;
-						color: var(--color-main-active);
+					.head-name {
+						margin-left: 25px;
+						color: var(--color-primary-100);
 						font-size: 16px;
-						font-weight: 700;
+						line-height: 16px;
+						font-family: Source Han Sans CN;
+						font-weight: bold;
 					}
 				}
-			}
-
-			.checkbox-group {
-				padding: 10px 0 0 25px;
-				.filter-checkbox {
-					width: 130px;
-					margin-bottom: 8px;
-					height: 32px;
-					:deep(.el-checkbox__label) {
-						font-size: 16px;
-						color: #5f656c;
-					}
-				}
-
-				.expand-btn {
-					color: var(--color-main-active);
-					font-size: 14px;
-					cursor: pointer;
-					display: flex;
-					align-items: center;
-					margin-top: 4px;
-
-					.el-icon {
-						margin-left: 4px;
+				.check-list {
+					padding: 0 10px 0 25px;
+					display: grid;
+					grid-template-columns: repeat(2, 1fr);
+					grid-gap: 0 12px;
+					.check-item {
+						width: 100%;
+						height: 32px;
+						:deep(.el-checkbox__label) {
+							font-family: Source Han Sans CN;
+							font-size: 16px;
+							color: var(--text-primary-65-color);
+						}
 					}
 				}
 			}

src/views/marketAccessRestrictions/singleCaseLayout/overview/232/index.vue

@@ -100,7 +100,12 @@
 <script setup>
 import { ref, onMounted } from "vue";
 import { useRoute } from "vue-router";
-import { getSearchBlurb, getSearchContext, getSearchConclusion } from "@/api/marketAccessRestrictions";
+import {
+	getSearchBlurb,
+	getSearchContext,
+	getSearchConclusion,
+	getRelatedEvents,
+} from "@/api/marketAccessRestrictions";
 import RelatedEvent from "@/views/marketAccessRestrictions/com/RelatedEvent.vue";
 import SurveyConclusion from "@/views/marketAccessRestrictions/com/SurveyConclusion.vue";
 
@@ -181,26 +186,21 @@ const handleGetSearchConclusion = async () => {
 };
 
 // 相关行政举措
-const eventList = ref([
-	{
-		name: "某些特定外国制造的半导体器件及其下游产品和组件;委员会最终裁定未违反第337条的通知;调查终止",
-		text: "特此通知，2025 年 2 月 18 日，根据 1930 年《关税法》第 337 条（经修订）已代表爱尔兰 Longitude Licensing Ltd.和爱尔",
-		time: "2025年4月15日"
-	},
-	{
-		name: "某些特定外国制造的半导体器件及其下游产品和组件;委员会最终裁定未违反第337条的通知;调查终止",
-		text: "特此通知，2025 年 2 月 18 日，根据 1930 年《关税法》第 337 条（经修订）已代表爱尔兰 Longitude Licensing Ltd.和爱尔",
-		time: "2025年4月15日"
-	},
-	{
-		name: "某些特定外国制造的半导体器件及其下游产品和组件;委员会最终裁定未违反第337条的通知;调查终止",
-		text: "特此通知，2025 年 2 月 18 日，根据 1930 年《关税法》第 337 条（经修订）已代表爱尔兰 Longitude Licensing Ltd.和爱尔",
-		time: "2025年4月15日"
-	},
-])
+const eventList = ref([])
+const handleGetRelatedEvents = async () => {
+	try {
+		const res = await getRelatedEvents({
+			searchId: route.query.searchId
+		});
+		if(res.code === 200) eventList.value = res.data || [];
+	} catch (error) {
+		console.error("获取相关行政举措失败", error);
+	}
+};
 
 onMounted(() => {
 	handleGetSearchBlurb();
+	handleGetRelatedEvents();
 	handleGetSearchContext();
 	handleGetSearchConclusion();
 });