代码合并

4b63bc6c · 张烨 · 42c74a3f · 31752ccc · 4b63bc6c · 4b63bc6c
--- a/src/api/marketAccessRestrictions/index.js
+++ b/src/api/marketAccessRestrictions/index.js
@@ -2,10 +2,11 @@ import request from "@/api/request.js";

 // 概览页--------------------------------------------------------------------
 // 概览统计
-export function getStatCount() {
+export function getStatCount(params) {
    return request({
        method: 'GET',
-        url: `/api/marketsearchHome/statCount`
+        url: `/api/marketsearchHome/statCount`,
+        params
    })
 }


--- a/src/assets/icons/symbol.png
+++ b/src/assets/icons/symbol.png
--- a/src/components/base/WarningPane/icons/level1.svg
+++ b/src/components/base/WarningPane/icons/level1.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="url(#clipPath_0)">
+	<defs>
+		<clipPath id="clipPath_0">
+			<rect width="16.000000" height="16.000000" x="0.000000" y="0.000000" rx="8.000000" fill="rgb(255,255,255)" />
+		</clipPath>
+	</defs>
+	<rect id="容器 767" width="16.000000" height="16.000000" x="0.000000" y="0.000000" rx="8.000000" />
+	<g id="组合 1059">
+		<path id="矩形 350" d="M2.50019 7.57031L12.4998 7.57048C12.7759 7.57048 12.9992 7.79409 12.9995 8.07012L13 8.07012C13.0001 8.34632 12.776 8.57031 12.4998 8.57031L2.50018 8.57015C2.22419 8.57015 2.00069 8.34649 2.00054 8.07051L2 8.07051C1.9997 7.79434 2.22403 7.57031 2.50019 7.57031Z" fill="rgb(206,79,81)" fill-rule="evenodd" />
+		<path id="矢量 610" d="M8 3L13 8L8 13" stroke="rgb(206,79,81)" stroke-linecap="round" stroke-width="1.000000" />
+	</g>
+</svg>
--- a/src/components/base/WarningPane/icons/level2.svg
+++ b/src/components/base/WarningPane/icons/level2.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="url(#clipPath_0)">
+	<defs>
+		<clipPath id="clipPath_0">
+			<rect width="16.000000" height="16.000000" x="0.000000" y="0.000000" rx="8.000000" fill="rgb(255,255,255)" />
+		</clipPath>
+	</defs>
+	<rect id="容器 767" width="16.000000" height="16.000000" x="0.000000" y="0.000000" rx="8.000000" />
+	<g id="组合 1059">
+		<path id="矩形 350" d="M2.50019 7.57031L12.4998 7.57048C12.7759 7.57048 12.9992 7.79409 12.9995 8.07012L13 8.07012C13.0001 8.34632 12.776 8.57031 12.4998 8.57031L2.50018 8.57015C2.22419 8.57015 2.00069 8.34649 2.00054 8.07051L2 8.07051C1.9997 7.79434 2.22403 7.57031 2.50019 7.57031Z" fill="rgb(255, 149, 77)" fill-rule="evenodd" />
+		<path id="矢量 610" d="M8 3L13 8L8 13" stroke="rgb(255, 149, 77)" stroke-linecap="round" stroke-width="1.000000" />
+	</g>
+</svg>
--- a/src/components/base/WarningPane/icons/level3.svg
+++ b/src/components/base/WarningPane/icons/level3.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="url(#clipPath_0)">
+	<defs>
+		<clipPath id="clipPath_0">
+			<rect width="16.000000" height="16.000000" x="0.000000" y="0.000000" rx="8.000000" fill="rgb(255,255,255)" />
+		</clipPath>
+	</defs>
+	<rect id="容器 767" width="16.000000" height="16.000000" x="0.000000" y="0.000000" rx="8.000000" />
+	<g id="组合 1059">
+		<path id="矩形 350" d="M2.50019 7.57031L12.4998 7.57048C12.7759 7.57048 12.9992 7.79409 12.9995 8.07012L13 8.07012C13.0001 8.34632 12.776 8.57031 12.4998 8.57031L2.50018 8.57015C2.22419 8.57015 2.00069 8.34649 2.00054 8.07051L2 8.07051C1.9997 7.79434 2.22403 7.57031 2.50019 7.57031Z" fill="rgb(232, 189, 11)" fill-rule="evenodd" />
+		<path id="矢量 610" d="M8 3L13 8L8 13" stroke="rgb(232, 189, 11)" stroke-linecap="round" stroke-width="1.000000" />
+	</g>
+</svg>
--- a/src/components/base/WarningPane/icons/level4.svg
+++ b/src/components/base/WarningPane/icons/level4.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="url(#clipPath_0)">
+	<defs>
+		<clipPath id="clipPath_0">
+			<rect width="16.000000" height="16.000000" x="0.000000" y="0.000000" rx="8.000000" fill="rgb(255,255,255)" />
+		</clipPath>
+	</defs>
+	<rect id="容器 767" width="16.000000" height="16.000000" x="0.000000" y="0.000000" rx="8.000000" />
+	<g id="组合 1059">
+		<path id="矩形 350" d="M2.50019 7.57031L12.4998 7.57048C12.7759 7.57048 12.9992 7.79409 12.9995 8.07012L13 8.07012C13.0001 8.34632 12.776 8.57031 12.4998 8.57031L2.50018 8.57015C2.22419 8.57015 2.00069 8.34649 2.00054 8.07051L2 8.07051C1.9997 7.79434 2.22403 7.57031 2.50019 7.57031Z" fill="rgb(33, 129, 57)" fill-rule="evenodd" />
+		<path id="矢量 610" d="M8 3L13 8L8 13" stroke="rgb(33, 129, 57)" stroke-linecap="round" stroke-width="1.000000" />
+	</g>
+</svg>
--- a/src/components/base/WarningPane/icons/level5.svg
+++ b/src/components/base/WarningPane/icons/level5.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="url(#clipPath_0)">
+	<defs>
+		<clipPath id="clipPath_0">
+			<rect width="16.000000" height="16.000000" x="0.000000" y="0.000000" rx="8.000000" fill="rgb(255,255,255)" />
+		</clipPath>
+	</defs>
+	<rect id="容器 767" width="16.000000" height="16.000000" x="0.000000" y="0.000000" rx="8.000000" />
+	<g id="组合 1059">
+		<path id="矩形 350" d="M2.50019 7.57031L12.4998 7.57048C12.7759 7.57048 12.9992 7.79409 12.9995 8.07012L13 8.07012C13.0001 8.34632 12.776 8.57031 12.4998 8.57031L2.50018 8.57015C2.22419 8.57015 2.00069 8.34649 2.00054 8.07051L2 8.07051C1.9997 7.79434 2.22403 7.57031 2.50019 7.57031Z" fill="rgb(5, 95, 194)" fill-rule="evenodd" />
+		<path id="矢量 610" d="M8 3L13 8L8 13" stroke="rgb(5, 95, 194)" stroke-linecap="round" stroke-width="1.000000" />
+	</g>
+</svg>
--- a/src/components/base/WarningPane/icons/warnning-icon.svg
+++ b/src/components/base/WarningPane/icons/warnning-icon.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="容器 1922" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
+	<path id="减去顶层" d="M15.8612 13.4253L8.86371 1.38047C8.47821 0.716925 7.51986 0.716925 7.13436 1.38047L0.136829 13.4253C-0.250475 14.0919 0.230498 14.9276 1.0015 14.9276L14.9966 14.9276C15.7676 14.9276 16.2485 14.0919 15.8612 13.4253ZM8.73076 9.86062C8.71726 10.2202 8.42184 10.5047 8.06201 10.5047C7.7017 10.5047 7.40606 10.2195 7.39322 9.85936L7.25891 6.0939C7.24261 5.63713 7.60849 5.25797 8.06555 5.25797C8.5232 5.25797 8.8893 5.63808 8.87213 6.09541L8.73076 9.86062ZM7.21926 11.7574C7.26412 11.6666 7.32814 11.5851 7.41131 11.513C7.46859 11.4633 7.52999 11.4215 7.59553 11.3876C7.73661 11.3146 7.89683 11.278 8.07618 11.278C8.26676 11.278 8.43415 11.3187 8.57836 11.3999C8.6354 11.4321 8.68881 11.4706 8.73859 11.5154C8.81988 11.5886 8.88236 11.6708 8.92603 11.7618C8.97673 11.8675 9.00208 11.9853 9.00208 12.115C9.00208 12.2317 8.981 12.3396 8.93885 12.4386C8.89617 12.5388 8.83188 12.63 8.74598 12.7121C8.66424 12.7902 8.5746 12.8496 8.47706 12.8903C8.37086 12.9346 8.25529 12.9568 8.13036 12.9568C7.86357 12.9568 7.64481 12.8932 7.47407 12.7659C7.45149 12.7491 7.42975 12.7311 7.40885 12.7121C7.31197 12.6238 7.24131 12.5249 7.19688 12.4155C7.15926 12.3229 7.14044 12.2227 7.14044 12.115C7.14044 11.983 7.16671 11.8638 7.21926 11.7574Z" fill="rgb(255,255,255)" fill-rule="evenodd" />
+</svg>
--- a/src/components/base/WarningPane/index.vue
+++ b/src/components/base/WarningPane/index.vue
+<template>
+  <div class="warnning-pane-wrapper" :style="{ width: width ? width : '1600px', height: height ? height : '116px' }"
+    :class="{
+      level1: warnningLevel === '特别重大风险',
+      level2: warnningLevel === '重大风险',
+      level3: warnningLevel === '较大风险',
+      level4: warnningLevel === '一般风险',
+    }" @click="handleClickPane">
+    <div class="warnning-pane-header">
+      <div class="header-left" :class="{
+        'header-left-level1': warnningLevel === '特别重大风险',
+        'header-left-level2': warnningLevel === '重大风险',
+        'header-left-level3': warnningLevel === '较大风险',
+        'header-left-level4': warnningLevel === '一般风险',
+      }">
+        <div class="warnning-icon">
+          <img src="./icons/warnning-icon.svg" alt="">
+        </div>
+        <div class="warnning-text text-title-3-bold">{{ warnningLevel }}</div>
+      </div>
+      <div class="header-right">
+        <img v-if="warnningLevel === '特别重大风险'" src="./icons/level1.svg" alt="">
+        <img v-else-if="warnningLevel === '重大风险'" src="./icons/level2.svg" alt="">
+        <img v-else-if="warnningLevel === '较大风险'" src="./icons/level3.svg" alt="">
+        <img v-else-if="warnningLevel === '一般风险'" src="./icons/level4.svg" alt="">
+        <img v-else src="./icons/level5.svg" alt="">
+      </div>
+    </div>
+    <div class="warnning-pane-content text-regular">
+      {{ warnningContent }}
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ElMessage } from 'element-plus'
+
+
+const props = defineProps(
+  {
+    warnningContent: {
+      type: String,
+      default: ''
+    },
+
+    warnningLevel: {
+      type: String,
+      default: '低风险'
+    }
+  }
+)
+
+const emit = defineEmits(['clickPane'])
+
+const handleClickPane = () => {
+  ElMessage.success('点击了预警面板')
+  emit('clickPane')
+}
+
+</script>
+
+<style lang="scss" scoped>
+.warnning-pane-wrapper {
+  border-radius: 10px;
+  border: 1px solid var(--color-primary-100);
+  box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
+}
+
+.level1 {
+  border: 1px solid var(--color-red-100) !important;
+}
+
+.level2 {
+  border: 1px solid var(--color-orange-100) !important;
+}
+
+.level3 {
+  border: 1px solid var(--color-yellow-100) !important;
+}
+
+.level4 {
+  border: 1px solid var(--color-green-100) !important;
+}
+
+.warnning-pane-header {
+  height: 44px;
+  display: flex;
+  justify-content: space-between;
+
+}
+
+.header-left {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 10px;
+  width: 164px;
+  height: 32px;
+  background: var(--color-main-active);
+  border-radius: 10px 0 10px 0;
+}
+
+.header-left-level1 {
+  background: var(--color-red-100) !important;
+}
+
+.header-left-level2 {
+  background: var(--color-orange-100) !important;
+}
+
+.header-left-level3 {
+  background: var(--color-yellow-100) !important;
+}
+
+.header-left-level4 {
+  background: var(--color-green-100) !important;
+}
+
+.warnning-icon {
+  width: 16px;
+  height: 16px;
+
+  img {
+    width: 100%;
+    height: 100%;
+  }
+}
+
+.warnning-text {
+  color: #fff;
+}
+
+.header-right {
+  width: 16px;
+  height: 16px;
+  margin-top: 17px;
+  margin-right: 16px;
+
+  img {
+    width: 100%;
+    height: 100%;
+  }
+}
+
+.warnning-pane-content{
+  width: calc(100% - 40px);
+  margin: 0 auto;
+  height: 60px;
+  display: -webkit-box;
+  /* 2. 设置内部布局方向为垂直 */
+  -webkit-box-orient: vertical;
+  /* 3. 限制显示的行数为 2 行 */
+  -webkit-line-clamp: 2;
+  /* 4. 隐藏超出部分 */
+  overflow: hidden;
+  /* 5. 设置文本溢出显示省略号 */
+  text-overflow: ellipsis;
+}
+</style>
\ No newline at end of file
--- a/src/components/base/boxBackground/analysisBox.vue
+++ b/src/components/base/boxBackground/analysisBox.vue
@@ -116,11 +116,17 @@ const emit = defineEmits(['save', 'download', 'collect'])
      }
    }

-    .header-btn {
-      // display: flex;
-      // justify-content: flex-end;
-      // gap: 8px;
-    }
+    // .header-btn {
+    //   display: flex;
+    //   justify-content: flex-end;
+    //   gap: 8px;
+    // }
+
+    // .header-btn1 {
+    //   position: absolute;
+    //   top: 14px;
+    //   right: 116px;
+    // }

    .header-right {
      height: 28px;

--- a/src/components/base/newsList/NewsItem2.vue
+++ b/src/components/base/newsList/NewsItem2.vue
+<template>
+    <div class="news-item">
+        <el-space direction="vertical" class="flex-fill" alignment='flex-start'>
+            <common-text :lineLimit="1" class="text-bold" color="var(--text-primary-80-color)">{{
+                props.title
+                }}</common-text>
+            <common-text class="text-tip-2" color="var(--text-primary-65-color)">
+                {{ props.from }}
+            </common-text>
+            <el-space v-if="props.aeraTags">
+                <area-tag v-for="(tag, index) in props.aeraTags" :key="index" :tagName="tag" />
+            </el-space>
+        </el-space>
+        <img style="width: 122px; height: 82px" :src="props.img">
+        <!-- <img v-else style="width: 122px; height: 82px" :src="DefaultIconNews"> -->
+    </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { ElSpace } from 'element-plus'
+import AreaTag from '@/components/base/AreaTag/index.vue'
+import DefaultIconNews from "@/assets/icons/default-icon-news.png";
+import CommonText from '../texts/CommonText.vue';
+
+const props = defineProps({
+
+    img: {
+        type: String,
+        default: 'img'
+    },
+    title: {
+        type: String,
+        default: "title"
+    },
+    from: {
+        type: String,
+        default: "from"
+    },
+    aeraTags: {
+        type: Array,
+        default: []
+    },
+    content: {
+        type: String,
+        default: "content"
+    },
+
+});
+const emit = defineEmits(['item-click', 'more-click']);
+</script>
+<style lang="scss" scoped>
+@use '@/styles/common.scss';
+
+.news-item {
+    display: flex;
+    margin-top: 10px;
+}
+</style>
\ No newline at end of file
--- a/src/components/base/panes/AiTipPane.vue
+++ b/src/components/base/panes/AiTipPane.vue
-<script setup>
-
-</script>
 <template>
    <div class="flex-display box">
-        <div class="img"></div>
+        <div class="img">
+            <img src="@/assets/icons/box-footer-left-icon.png" alt="">
+        </div>
        <div class="flex-fill txt text-tip-1">
            <slot></slot>
        </div>
-        <div class="arrow"><span>→</span></div>
+        <div class="arrow">
+            <img src="@/assets/icons/box-footer-right-icon.png" alt="">
+        </div>
    </div>
 </template>
+<script setup>
+
+</script>
 <style scoped lang="scss">
 @use '@/styles/common.scss';

@@ -29,7 +33,11 @@
 .img {
    width: 19px;
    height: 20px;
-    background-image: url("@/assets/icons/model.png");
+
+    img {
+        width: 100%;
+        height: 100%;
+    }
 }

 .txt {
@@ -42,21 +50,12 @@
 }

 .arrow {
-    border-radius: 50%;
-    min-width: 24px;
    width: 24px;
    height: 24px;
-    background: var(--color-primary-10);
-    display: flex;
-    align-items: center;
-    justify-content: center;

-    span {
-        font-size: 22px;
-        font-weight: bold;
-        position: relative;
-        top: -3px;
-        /* 向上偏移2px */
+    img {
+        width: 100%;
+        height: 100%;
    }
 }
 </style>
\ No newline at end of file
--- a/src/components/base/texts/CommonText.vue
+++ b/src/components/base/texts/CommonText.vue
+<template>
+    <div class="common-text">
+        <slot></slot>
+    </div>
+</template>
+<script setup lang="js">
+const props = defineProps({
+    color: {
+        type: String,
+        default: "#000"
+    },
+    lineLimit: {
+        type: Number,
+        default: null
+    }
+});
+</script>
+<style lang="scss" scoped>
+@use '@/styles/common.scss';
+
+.common-text {
+    color: v-bind(color);
+
+    @if('v-bind(lineLimit) !==null') {
+        @include common.text-ellipsis(v-bind(lineLimit));
+    }
+}
+</style>
--- a/src/router/common.js
+++ b/src/router/common.js
+import { useRouter } from "vue-router";
+export function useGotoPage() {
+    const router = useRouter();
+    return (path, data, isNewTabs = true) => {
+        console.log('path', path);
+        if (isNewTabs) {
+            // 打开新页面
+            const url = new URL(window.location.origin + path);
+            if (data) {
+                Object.entries(data).forEach(([key, value]) => {
+                    url.searchParams.append(key, value);
+                });
+            }
+            window.open(url.toString(), '_blank');
+        } else {
+            // 当前页面打开
+            router.push({ path, query: data });
+        }
+    }
+}
\ No newline at end of file
--- a/src/router/modules/news.js
+++ b/src/router/modules/news.js
 const newsBrief = () => import('@/views/newsBrief/index.vue')
+const ModeuleNews = () => import('@/views/newsBrief/ModeuleNews.vue')
+const NewsDetial = () => import('@/views/newsBrief/NewsDetial.vue')
 const NewsAnalysis = () => import('@/views/newsAnalysis/index.vue')

 const newsRoutes = [
@@ -11,6 +13,25 @@ const newsRoutes = [
 			title: "新闻速览"
 		}
 	},
+	//新闻模块页面路由
+	{
+		path: "/newsModeule/:id",
+		name: "newsModeule",
+		component: ModeuleNews,
+		meta: {
+			title: "新闻模块"
+		}
+	},
+
+	//新闻详情页面路由
+	{
+		path: "/newsDetail/:id",
+		name: "newsDetail",
+		component: NewsDetial,
+		meta: {
+			title: "新闻详情"
+		}
+	},

 	// 新闻事件分析
 	{
@@ -22,5 +43,21 @@ const newsRoutes = [
 		}
 	}
 ];
+import { useGotoPage } from "../common.js";
+
+export function useGotoNewsBrief() {
+	const gotoPage = useGotoPage();
+	return (isNewTabs = true) => gotoPage("/newsBrief/", {}, isNewTabs)
+}
+export function useGotoNewsDetail() {
+	const gotoPage = useGotoPage();
+	return (id, isNewTabs = true) => gotoPage("/newsDetail/" + id, {}, isNewTabs)
+}
+export function useGotoNewsModule() {
+	const gotoPage = useGotoPage();
+	return (id, name, isNewTabs = true) =>
+		gotoPage("/newsModeule/" + id, { name }, isNewTabs)
+}
+

 export default newsRoutes;
--- a/src/styles/buttons.scss
+++ b/src/styles/buttons.scss
--- a/src/styles/common.scss
+++ b/src/styles/common.scss
@@ -11,19 +11,19 @@
    display: flex;
 }

-.flex-display-center{
+.flex-display-center {
    @extend .flex-display;
    justify-content: center;
    align-items: center;
 }

-.flex-display-end{
+.flex-display-end {
    @extend .flex-display;
    justify-content: flex-end;
    align-items: center;
 }

-.flex-display-start{
+.flex-display-start {
    @extend .flex-display;
    justify-content: flex-start;
    align-items: center;
@@ -37,6 +37,13 @@
    width: 100%;
 }

+.mouse-hover:hover {
+    cursor: pointer;
+    box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.082);
+    // margin-top: 1px;
+    // margin-left: 1px;
+}
+
 // 文本超出指定行数省略号显示
 @mixin text-ellipsis($line-clamp) {
    overflow: hidden;

--- a/src/styles/components/CommonPage/index.vue
+++ b/src/styles/components/CommonPage/index.vue
@@ -14,12 +14,30 @@ const span = 12
 </template>
 `}}
 </pre>
-            <div class="background-as-card">
-                <div v-for="item in [1, 2, 3, 4]" :key="item">
-                    {{ item }}
+            <div class="common-padding">
+                <div class="background-as-card">
+                    <div v-for="item in [1, 2, 3, 4]" :key="item">
+                        {{ item }}
+                    </div>
                </div>
            </div>
        </el-col>
+        <el-col :span="span">
+            <pre>{{ `import '@/styles/container.scss';\n<template>
+    <div class="common-page"></div>
+</template>
+        `}}
+    </pre>
+            通用的页面容器，限定了页面宽度为1600px，居中显示
+        </el-col>
+        <el-col :span="span">
+            <pre>{{ `import '@/styles/common.scss';\n<template>
+    <div class="mouse-hover"></div>
+</template>
+        `}}
+    </pre>
+            <div class="mouse-hover">鼠标悬停</div>
+        </el-col>
    </el-row>
 </template>


--- a/src/styles/components/RadioPage/index.vue
+++ b/src/styles/components/RadioPage/index.vue
@@ -24,6 +24,19 @@ const span = 12
                <el-radio-button :value="3">选项3</el-radio-button>
            </el-radio-group>
        </el-col>
+        <el-col :span="span">
+            <pre>{{ `import '@/styles/radio.scss';\n <template>
+    <el-radio-group class="radio-group-as-radius-btn">
+    </el-radio-group>
+</template>
+        `}}
+    </pre>
+            <el-radio-group v-model="radio" class="radio-group-as-radius-btn">
+                <el-space>
+                    <el-radio-button v-for="item in 3" :key="item" :value="item">选项{{ item }} ></el-radio-button>
+                </el-space>
+            </el-radio-group>
+        </el-col>
    </el-row>
 </template>


--- a/src/styles/components/TextPage/index.vue
+++ b/src/styles/components/TextPage/index.vue
@@ -3,6 +3,7 @@ import { ElSpace, ElRow, ElCol } from 'element-plus';
 import '@/styles/tabs.scss'
 import ColorPrefixTitle from '@/components/base/texts/ColorPrefixTitle.vue';
 import AiTipPane from '@/components/base/panes/AiTipPane.vue';
+import CommonText from '@/components/base/texts/CommonText.vue';
 const span = 12
 </script>

@@ -10,20 +11,37 @@ const span = 12
    <el-row class="layout-grid-line">
        <el-col :span="span">
            <pre>
-{{ `import ColorPrefixTitle from '@/components/base/texts/ColorPrefixTitle.vue';
+{{ `import CommonText from '@/components/base/texts/CommonText.vue';
 <template>
+    <common-text>科技领域</common-text>
+    <common-text class="text-title-1-show" color="var(--color-yellow-100)">科技领域</common-text>
+    <common-text color="red" :lineLimit="1">科技领域</common-text>
+</template>
+`}}
+</pre>
+            <el-space direction="vertical">
+                <common-text>科技领域</common-text>
+                <common-text class="text-title-1-show" color="var(--color-yellow-100)">科技领域</common-text>
+                <common-text color="red"
+                    :lineLimit="1">超出行数则省略号。超出行数则省略号。超出行数则省略号。超出行数则省略号。超出行数则省略号。超出行数则省略号。超出行数则省略号。超出行数则省略号。超出行数则省略号。</common-text>
+            </el-space>
+        </el-col>
+
+        <el-col :span="span">
+            <pre>{{ `import ColorPrefixTitle from '@/components/base/texts/ColorPrefixTitle.vue';\n <template>
    <color-prefix-title>科技领域</color-prefix-title>
    <color-prefix-title color="var(--color-yellow-100)">科技领域</color-prefix-title>
    <color-prefix-title color="red">科技领域</color-prefix-title>
 </template>
-`}}
-</pre>
+        `}}
+    </pre>
            <el-space direction="vertical">
                <color-prefix-title>科技领域</color-prefix-title>
                <color-prefix-title color="var(--color-yellow-100)">科技领域</color-prefix-title>
                <color-prefix-title color="red">科技领域</color-prefix-title>
            </el-space>
        </el-col>
+
        <el-col :span="span">
            <pre>{{ `import AiTipPane from '@/components/base/panes/AiTipPane.vue';\n<template>
    <ai-tip-pane>huidadadadadasda</ai-tip-pane>

--- a/src/styles/components/WarnningPane/index.vue
+++ b/src/styles/components/WarnningPane/index.vue
+<script setup>
+import { ElRow, ElCol } from 'element-plus';
+import '@/styles/common.scss'
+import WarnningPane from '@/components/base/WarningPane/index.vue'
+const span = 12
+</script>
+
+<template>
+  <el-row class="wrapper layout-grid-line">
+    <el-col :span="span">
+      <pre>
+{{
+  `import WarnningPane from '@/components/base/WarningPane/index.vue';
+<template>
+    <WarnningPane warnningLevel="特别重大风险" warnningContent="我是特别重大风险内容文字">
+    </WarnningPane>
+</template>
+`}}
+</pre>
+      <WarnningPane warnningLevel="特别重大风险" warnningContent="我是特别重大风险内容文字">
+      </WarnningPane>
+    </el-col>
+  </el-row>
+</template>
+
+<style lang="scss" scoped>
+.person-avatar {
+  width: 200px;
+}
+</style>
\ No newline at end of file
--- a/src/styles/components/index.vue
+++ b/src/styles/components/index.vue
@@ -28,6 +28,9 @@
                        <el-tab-pane label="人物" lazy>
                            <people-page />
                        </el-tab-pane>
+                        <el-tab-pane label="预警面板" lazy>
+                            <WarnningPane />
+                        </el-tab-pane>
                    </el-tabs>
                </div>
            </el-space>
@@ -47,6 +50,7 @@ import CommonPage from './CommonPage/index.vue';
 import TextPage from './TextPage/index.vue';
 import ImagesPage from './Images/index.vue';
 import PeoplePage from './People/index.vue';
+import WarnningPane from './WarnningPane/index.vue'
 </script>

 <style lang="scss" scoped>

--- a/src/styles/container.scss
+++ b/src/styles/container.scss
@@ -5,4 +5,15 @@
    padding: 16px 160px;
    // width: 1600px;
    align-items: center;
+}
+
+//水平居中
+.h-center {
+    //水平居中
+    margin: 0 auto;
+    display: block; // 强制设置为块级元素
+}
+
+.common-padding {
+    padding: 20px 24px;
 }
\ No newline at end of file
--- a/src/styles/divider.scss
+++ b/src/styles/divider.scss
--- a/src/styles/radio.scss
+++ b/src/styles/radio.scss
@@ -16,4 +16,35 @@
        --el-radio-button-checked-border-color: var(--color-primary-5);
        border-radius: 4px;
    }
+}
+
+.radio-group-as-radius-btn {
+
+
+    .el-radio-button {
+        --el-radio-button-checked-bg-color: transparent;
+        --el-radio-button-checked-border-color: transparent;
+
+        .el-radio-button__inner {
+            border-radius: 32px !important;
+            // height: 40px;
+            @extend .text-regular;
+            background-color: var(--bg-white-65);
+            border-color: var(--bg-white-100);
+            border-width: 1px;
+            color: var(--text-primary-65-color);
+            //垂直居中
+            // display: flex;
+            // justify-content: center;
+        }
+    }
+
+    .el-radio-button.is-active {
+        --el-radio-button-checked-text-color: var(--color-primary-100);
+
+        .el-radio-button__inner {
+            background-color: var(--color-primary-10) !important;
+            border-color: var(--color-primary-35) !important;
+        }
+    }
 }
\ No newline at end of file
--- a/src/views/marketAccessRestrictions/marketAccessHome/index.vue
+++ b/src/views/marketAccessRestrictions/marketAccessHome/index.vue
@@ -390,6 +390,8 @@
 <script setup>
 import { onMounted, ref } from "vue";

+import LeftBtn from "@/components/base/PageBtn/LeftBtn.vue";
+import RightBtn from "@/components/base/PageBtn/RightBtn.vue";
 import RiskSignal from "@/components/base/RiskSignal/index.vue";
 import TipTab from "@/components/base/TipTab/index.vue"
 import MessageBubble from "@/components/base/MessageBubble/index.vue"

--- a/src/views/marketAccessRestrictions/marketAccessLayout/assets/icons/icon1.svg
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/assets/icons/icon1.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="Icon/Line/AntDesign" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
+	<path id="合并" d="M2 4C2 4.21118 2.06685 4.41694 2.19098 4.58779C2.31511 4.75863 2.49014 4.8858 2.69098 4.95106C2.89183 5.01631 3.10817 5.01631 3.30902 4.95106C3.50986 4.8858 3.68489 4.75863 3.80902 4.58779C3.93315 4.41694 4 4.21118 4 4C4 3.78882 3.93315 3.58306 3.80902 3.41221C3.68489 3.24137 3.50986 3.1142 3.30902 3.04894C3.10817 2.98369 2.89183 2.98369 2.69098 3.04894C2.49014 3.1142 2.31511 3.24137 2.19098 3.41221C2.06685 3.58306 2 3.78882 2 4ZM6.11111 5L13.8889 5C14.5 5 15 4.55 15 4C15 3.45 14.5 3 13.8889 3L6.11111 3C5.5 3 5 3.45 5 4C5 4.55 5.5 5 6.11111 5ZM2.19098 8.50064C2.06685 8.32979 2 8.12403 2 7.91285C2 7.70167 2.06685 7.49592 2.19098 7.32507C2.31511 7.15422 2.49014 7.02705 2.69098 6.9618C2.89183 6.89654 3.10817 6.89654 3.30902 6.9618C3.50986 7.02705 3.68489 7.15422 3.80902 7.32507C3.93315 7.49592 4 7.70167 4 7.91285C4 8.12403 3.93315 8.32979 3.80902 8.50064C3.68489 8.67149 3.50986 8.79865 3.30902 8.86391C3.10817 8.92917 2.89183 8.92917 2.69098 8.86391C2.49014 8.79865 2.31511 8.67149 2.19098 8.50064ZM6.11111 8.91309L13.8889 8.91309C14.5 8.91309 15 8.46309 15 7.91309C15 7.36309 14.5 6.91309 13.8889 6.91309L6.11111 6.91309C5.5 6.91309 5 7.36309 5 7.91309C5 8.46309 5.5 8.91309 6.11111 8.91309ZM2 11.8261C2 12.0373 2.06685 12.243 2.19098 12.4139C2.31511 12.5847 2.49014 12.7119 2.69098 12.7772C2.89183 12.8424 3.10817 12.8424 3.30902 12.7772C3.50986 12.7119 3.68489 12.5847 3.80902 12.4139C3.93315 12.243 4 12.0373 4 11.8261C4 11.6149 3.93315 11.4092 3.80902 11.2383C3.68489 11.0675 3.50986 10.9403 3.30902 10.875C3.10817 10.8098 2.89183 10.8098 2.69098 10.875C2.49014 10.9403 2.31511 11.0675 2.19098 11.2383C2.06685 11.4092 2 11.6149 2 11.8261ZM6.11111 12.8262L13.8889 12.8262C14.5 12.8262 15 12.3762 15 11.8262C15 11.2762 14.5 10.8262 13.8889 10.8262L6.11111 10.8262C5.5 10.8262 5 11.2762 5 11.8262C5 12.3762 5.5 12.8262 6.11111 12.8262Z" fill="rgb(59,65,75)" fill-rule="evenodd" />
+</svg>
--- a/src/views/marketAccessRestrictions/marketAccessLayout/assets/icons/icon1_active.svg
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/assets/icons/icon1_active.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="Icon/Line/AntDesign" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
+	<path id="合并" d="M2 4C2 4.21118 2.06685 4.41694 2.19098 4.58779C2.31511 4.75863 2.49014 4.8858 2.69098 4.95106C2.89183 5.01631 3.10817 5.01631 3.30902 4.95106C3.50986 4.8858 3.68489 4.75863 3.80902 4.58779C3.93315 4.41694 4 4.21118 4 4C4 3.78882 3.93315 3.58306 3.80902 3.41221C3.68489 3.24137 3.50986 3.1142 3.30902 3.04894C3.10817 2.98369 2.89183 2.98369 2.69098 3.04894C2.49014 3.1142 2.31511 3.24137 2.19098 3.41221C2.06685 3.58306 2 3.78882 2 4ZM6.11111 5L13.8889 5C14.5 5 15 4.55 15 4C15 3.45 14.5 3 13.8889 3L6.11111 3C5.5 3 5 3.45 5 4C5 4.55 5.5 5 6.11111 5ZM2.19098 8.50064C2.06685 8.32979 2 8.12403 2 7.91285C2 7.70167 2.06685 7.49592 2.19098 7.32507C2.31511 7.15422 2.49014 7.02705 2.69098 6.9618C2.89183 6.89654 3.10817 6.89654 3.30902 6.9618C3.50986 7.02705 3.68489 7.15422 3.80902 7.32507C3.93315 7.49592 4 7.70167 4 7.91285C4 8.12403 3.93315 8.32979 3.80902 8.50064C3.68489 8.67149 3.50986 8.79865 3.30902 8.86391C3.10817 8.92917 2.89183 8.92917 2.69098 8.86391C2.49014 8.79865 2.31511 8.67149 2.19098 8.50064ZM6.11111 8.91309L13.8889 8.91309C14.5 8.91309 15 8.46309 15 7.91309C15 7.36309 14.5 6.91309 13.8889 6.91309L6.11111 6.91309C5.5 6.91309 5 7.36309 5 7.91309C5 8.46309 5.5 8.91309 6.11111 8.91309ZM2 11.8261C2 12.0373 2.06685 12.243 2.19098 12.4139C2.31511 12.5847 2.49014 12.7119 2.69098 12.7772C2.89183 12.8424 3.10817 12.8424 3.30902 12.7772C3.50986 12.7119 3.68489 12.5847 3.80902 12.4139C3.93315 12.243 4 12.0373 4 11.8261C4 11.6149 3.93315 11.4092 3.80902 11.2383C3.68489 11.0675 3.50986 10.9403 3.30902 10.875C3.10817 10.8098 2.89183 10.8098 2.69098 10.875C2.49014 10.9403 2.31511 11.0675 2.19098 11.2383C2.06685 11.4092 2 11.6149 2 11.8261ZM6.11111 12.8262L13.8889 12.8262C14.5 12.8262 15 12.3762 15 11.8262C15 11.2762 14.5 10.8262 13.8889 10.8262L6.11111 10.8262C5.5 10.8262 5 11.2762 5 11.8262C5 12.3762 5.5 12.8262 6.11111 12.8262Z" fill="rgb(5,95,194)" fill-rule="evenodd" />
+</svg>
--- a/src/views/marketAccessRestrictions/marketAccessLayout/assets/icons/icon2.svg
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/assets/icons/icon2.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">
+	<rect id="分析 1" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
+	<path id="矢量 828" d="M13.3712 9C13.032 9 12.7507 9.22792 12.7507 9.51994C12.6266 9.78348 11.038 10.4316 7.99328 10.4316C4.94855 10.4316 3.35172 9.77635 3.23589 9.54131C3.23589 9.5057 3.21934 9.47009 3.21107 9.43447C3.21107 9.39886 3.20279 9.36325 3.18624 9.33476C3.1697 9.29914 3.1366 9.27065 3.11178 9.23504C3.09523 9.21367 3.07869 9.18518 3.05387 9.16382C3.02077 9.13533 2.9794 9.11396 2.93803 9.09259C2.91321 9.07835 2.88839 9.05698 2.86357 9.04986C2.8222 9.03561 2.77256 9.03561 2.73119 9.02849C2.6981 9.02849 2.665 9.00712 2.62363 9.00712C2.54089 9.00712 2.45816 9.02137 2.38369 9.04986C2.36715 9.04986 2.35887 9.0641 2.3506 9.07122C2.29268 9.09971 2.23477 9.1282 2.18512 9.16382C2.17685 9.17094 2.16858 9.18518 2.1603 9.19943C2.11893 9.24216 2.07757 9.2849 2.05274 9.33476C2.04447 9.35612 2.04447 9.38461 2.0362 9.40598C2.01965 9.44872 2.0031 9.49145 2.0031 9.54131L2.0031 12.0342C1.99483 12.084 2.0031 12.1339 2.02792 12.1838C2.25959 13.6083 5.85038 14 8.00155 14C10.1527 14 14 13.5869 14 12.0413C14 12.0271 13.9917 12.0128 13.9917 11.9915L13.9917 9.54843L14 9.54843C14 9.25641 13.727 9 13.3795 9L13.3712 9ZM7.99328 12.9316C4.94027 12.9316 3.35172 12.2764 3.23589 12.0413C3.23589 12.0271 3.22761 12.0128 3.22761 11.9915L3.22761 10.8091C4.52659 11.3291 6.57847 11.5 7.99328 11.5C9.40808 11.5 11.4434 11.3291 12.7424 10.8162L12.7424 12.0271C12.5686 12.2977 10.9884 12.9245 7.99328 12.9245L7.99328 12.9316Z" fill="rgb(59,65,75)" fill-rule="nonzero" />
+	<path id="矢量 829" d="M14 4.10383C14 2.44372 10.2272 2 8.00155 2C5.77592 2 2.01138 2.44372 2.0031 4.09618L2.0031 6.88853C1.99483 6.94208 2.0031 6.99563 2.02792 7.04918C2.25959 8.57924 5.85038 9 8.00155 9C10.1527 9 14 8.55628 14 6.89617C14 6.88087 13.9917 6.86557 13.9917 6.84262L13.9917 4.10383L14 4.10383ZM8.00155 3.14754C10.9635 3.14754 12.5521 3.81311 12.7507 4.10383C12.5521 4.39454 10.9635 5.06011 8.00155 5.06011C5.03956 5.06011 3.37654 4.36393 3.24416 4.13443C3.37654 3.84372 4.96509 3.14754 8.00155 3.14754ZM8.00155 7.85246C4.94855 7.85246 3.35999 7.14863 3.24416 6.89618C3.24416 6.88087 3.23589 6.86557 3.23589 6.84262L3.23589 5.45792C4.54314 6.01639 6.58674 6.2 8.00155 6.2C9.41636 6.2 11.4517 6.01639 12.7507 5.46557L12.7507 6.88087C12.5769 7.17159 10.9966 7.84481 8.00155 7.84481L8.00155 7.85246Z" fill="rgb(59,65,75)" fill-rule="nonzero" />
+</svg>
--- a/src/views/marketAccessRestrictions/marketAccessLayout/assets/icons/icon2_active.svg
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/assets/icons/icon2_active.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">
+	<rect id="分析 1" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
+	<path id="矢量 828" d="M13.3712 9C13.032 9 12.7507 9.22792 12.7507 9.51994C12.6266 9.78348 11.038 10.4316 7.99328 10.4316C4.94855 10.4316 3.35172 9.77635 3.23589 9.54131C3.23589 9.5057 3.21934 9.47009 3.21107 9.43447C3.21107 9.39886 3.20279 9.36325 3.18624 9.33476C3.1697 9.29914 3.1366 9.27065 3.11178 9.23504C3.09523 9.21367 3.07869 9.18518 3.05387 9.16382C3.02077 9.13533 2.9794 9.11396 2.93803 9.09259C2.91321 9.07835 2.88839 9.05698 2.86357 9.04986C2.8222 9.03561 2.77256 9.03561 2.73119 9.02849C2.6981 9.02849 2.665 9.00712 2.62363 9.00712C2.54089 9.00712 2.45816 9.02137 2.38369 9.04986C2.36715 9.04986 2.35887 9.0641 2.3506 9.07122C2.29268 9.09971 2.23477 9.1282 2.18512 9.16382C2.17685 9.17094 2.16858 9.18518 2.1603 9.19943C2.11893 9.24216 2.07757 9.2849 2.05274 9.33476C2.04447 9.35612 2.04447 9.38461 2.0362 9.40598C2.01965 9.44872 2.0031 9.49145 2.0031 9.54131L2.0031 12.0342C1.99483 12.084 2.0031 12.1339 2.02792 12.1838C2.25959 13.6083 5.85038 14 8.00155 14C10.1527 14 14 13.5869 14 12.0413C14 12.0271 13.9917 12.0128 13.9917 11.9915L13.9917 9.54843L14 9.54843C14 9.25641 13.727 9 13.3795 9L13.3712 9ZM7.99328 12.9316C4.94027 12.9316 3.35172 12.2764 3.23589 12.0413C3.23589 12.0271 3.22761 12.0128 3.22761 11.9915L3.22761 10.8091C4.52659 11.3291 6.57847 11.5 7.99328 11.5C9.40808 11.5 11.4434 11.3291 12.7424 10.8162L12.7424 12.0271C12.5686 12.2977 10.9884 12.9245 7.99328 12.9245L7.99328 12.9316Z" fill="rgb(5,95,194)" fill-rule="nonzero" />
+	<path id="矢量 829" d="M14 4.10383C14 2.44372 10.2272 2 8.00155 2C5.77592 2 2.01138 2.44372 2.0031 4.09618L2.0031 6.88853C1.99483 6.94208 2.0031 6.99563 2.02792 7.04918C2.25959 8.57924 5.85038 9 8.00155 9C10.1527 9 14 8.55628 14 6.89617C14 6.88087 13.9917 6.86557 13.9917 6.84262L13.9917 4.10383L14 4.10383ZM8.00155 3.14754C10.9635 3.14754 12.5521 3.81311 12.7507 4.10383C12.5521 4.39454 10.9635 5.06011 8.00155 5.06011C5.03956 5.06011 3.37654 4.36393 3.24416 4.13443C3.37654 3.84372 4.96509 3.14754 8.00155 3.14754ZM8.00155 7.85246C4.94855 7.85246 3.35999 7.14863 3.24416 6.89618C3.24416 6.88087 3.23589 6.86557 3.23589 6.84262L3.23589 5.45792C4.54314 6.01639 6.58674 6.2 8.00155 6.2C9.41636 6.2 11.4517 6.01639 12.7507 5.46557L12.7507 6.88087C12.5769 7.17159 10.9966 7.84481 8.00155 7.84481L8.00155 7.85246Z" fill="rgb(5,95,194)" fill-rule="nonzero" />
+</svg>
--- a/src/views/marketAccessRestrictions/marketAccessLayout/case/337/index.vue
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/case/337/index.vue
@@ -203,7 +203,6 @@
 				</AnalysisBox>
 			</div>
 		</div>
-		<SearchBox placeholder="请输入搜索条件" v-model:search-text="searchData" @search="handleSearch" />
 	</div>
 </template>

@@ -215,13 +214,6 @@ import { Search, ArrowDown, ArrowUp } from "@element-plus/icons-vue";
 import { getSearchAllArea, getSearchAllYear, getSurveyList, getSearchAllCountry } from "@/api/marketAccessRestrictions";

 import AnalysisBox from "@/components/base/BoxBackground/AnalysisBox.vue"
-import SearchBox from "@/components/base/SearchBox/index.vue"
-
-const searchData = ref('你好啊')
-const handleSearch1 = () => {
-	console.log(searchData.value)
-}
-

 const route = useRoute();


--- a/src/views/marketAccessRestrictions/marketAccessLayout/index.vue
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/index.vue
@@ -47,10 +47,10 @@
 <script setup>
 import { ref, computed, onMounted } from "vue";
 import router from "@/router/index";
-import icon1 from "./assets/images/icon1.png";
-import icon1Active from "./assets/images/icon1_active.png";
-import icon2 from "./assets/images/icon2.png";
-import icon2Active from "./assets/images/icon2_active.png";
+import icon1 from "./assets/icons/icon1.svg";
+import icon1Active from "./assets/icons/icon1_active.svg";
+import icon2 from "./assets/icons/icon2.svg";
+import icon2Active from "./assets/icons/icon2_active.svg";
 import Img337 from "./assets/images/337.png";
 import Img232 from "./assets/images/232.png";
 import Img301 from "./assets/images/301.png";
@@ -207,10 +207,10 @@ onMounted(() => {
 			height: 48px;
 			margin-left: 160px;
 			display: flex;
+			gap: 24px;
 			.btn-item {
 				display: flex;
-				width: 92px;
-				margin-right: 30px;
+				gap: 4px;
 				cursor: pointer;
 				.icon {
 					width: 16px;

--- a/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/index.vue
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/index.vue
--- a/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/symbol.png
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/symbol.png
--- a/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/utils/barChart.js
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/utils/barChart.js
@@ -4,10 +4,10 @@ const getBarChart = (nameList, valueList) => {
  const option = {
    tooltip: {},
    grid: {
-      top: '3%',
-      right: '3%',
-      bottom: '1%',
-      left: '1%',
+      top: 40,
+      right: 64,
+      bottom: 24,
+      left: 24,
      containLabel: true
    },
    xAxis: {
@@ -30,7 +30,12 @@ const getBarChart = (nameList, valueList) => {
        show: false
      },
      axisLabel: {
-        show: true
+        show: true,
+        textStyle: {
+          color: 'rgb(59, 65, 75)',
+          fontSize: '16px',
+          fontFamliy: 'Source Han Sans CN'
+        }
      }
    },
    series: [{
@@ -38,9 +43,14 @@ const getBarChart = (nameList, valueList) => {
      data: valueList,
      label: {
        show: true,
-        position: [610, 0],
+        position: [480, 0],
        formatter: function (params) {
          return params.value + ' 次'
+        },
+        textStyle: {
+          color: 'rgb(59, 65, 75)',
+          fontSize: '16px',
+          fontFamliy: 'Source Han Sans CN'
        }
      },
      barWidth: 8,
@@ -49,11 +59,11 @@ const getBarChart = (nameList, valueList) => {
          return new echarts.graphic.LinearGradient(0, 0, 1, 0,
            [{
              offset: 0,
-              color: 'rgba(255,255,255,0)'
+              color: 'rgb(231, 243, 255)'
            },
            {
              offset: 1,
-              color: '#1778ff'
+              color: 'rgb(5, 95, 194)'
            }
            ]);
        },

--- a/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/utils/graph.js
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/utils/graph.js
+import CompanyImg from "../symbol.png"
+
+const getGraph = () => {
+  const nodes = [
+    '宁德时代', '泰丰先行', '国轩高科', '晶科能源', '容百科技',
+    '江西紫宸', '比亚迪', '长盈精密', '昆仑化学',
+    '海辰储能', '华阳集团', '嘉源科技', '天合光能',
+    '铜陵有色', '紫江企业', '格林美', '德方纳米'
+  ];
+
+  return {
+    series: [{
+      type: 'graph',
+      layout: 'force',
+      symbolSize: 60,
+      roam: true,
+      label: {
+        show: true,
+        position: 'bottom',
+        color: '#333',
+        fontWeight: 'bold'
+      },
+      edgeSymbol: ['arrow', 'none'],
+      edgeSymbolSize: [8, 4],
+      force: {
+        repulsion: 800,
+        gravity: 0.1,
+        edgeLength: 240
+      },
+      data: nodes.map((name, idx) => ({
+        name,
+        draggable: true,
+        symbol: `image://${CompanyImg}`,
+        itemStyle: { 
+          color: '#fff', // 设置圆形背景色
+          borderColor: 'rgb(59, 65, 75)', // 可选：圆形边框色
+          borderWidth: 3 // 可选：圆形边框宽度
+        },
+        symbolKeepAspect: true, // 保持图片比例
+        symbolSize: 60,
+        symbolClip: true, // 裁剪为圆形
+        label: {
+          show: true,
+          position: 'bottom',
+          color: '#333',
+          fontWeight: 'bold'
+        }
+      })),
+      links: [
+        { source: 0, target: 1, label: { show: true, formatter: '合作' } },
+        { source: 0, target: 2, label: { show: true, formatter: '持股' } },
+        { source: 0, target: 3, label: { show: true, formatter: '合作' } },
+        { source: 0, target: 4, lineStyle: { type: 'dashed', color: '#d32f2f' }, label: { show: true, formatter: '从属' } },
+        { source: 0, target: 5, label: { show: true, formatter: '合作' } },
+        { source: 0, target: 6, label: { show: true, formatter: '持股' } },
+        { source: 0, target: 7, label: { show: true, formatter: '合作' } },
+        { source: 0, target: 8, label: { show: true, formatter: '合作' } },
+        { source: 0, target: 9, lineStyle: { type: 'dashed', color: '#d32f2f' }, label: { show: true, formatter: '从属' } },
+        { source: 0, target: 10, lineStyle: { type: 'dashed', color: '#d32f2f' }, label: { show: true, formatter: '合作' } },
+        { source: 0, target: 11, label: { show: true, formatter: '合作' } },
+        { source: 0, target: 12, label: { show: true, formatter: '合作' } },
+        { source: 0, target: 13, label: { show: true, formatter: '合作' } },
+        { source: 0, target: 14, label: { show: true, formatter: '合作' } },
+        { source: 0, target: 15, label: { show: true, formatter: '合作' } },
+        { source: 0, target: 16, label: { show: true, formatter: '合作' } }
+      ],
+      edgeLabel: {
+        show: true,
+        position: 'middle',
+        fontSize: 14,
+        color: '#666',
+        backgroundColor: 'rgba(255,255,255,0.9)',
+        borderColor: '#bbb',
+        borderWidth: 1,
+        borderRadius: 8,
+        padding: [4, 8],
+        formatter: params => params.data.label ? params.data.label.formatter : ''
+      }
+    }]
+  }
+}
+
+export default getGraph
\ No newline at end of file
--- a/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/utils/graphChart.js
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/utils/graphChart.js
+
+
+const getGraphChart = (nodes, links) => {
+
+  const option = {
+    // title: {
+    //   text: '企业关系网络',
+    //   subtext: '节点图标表示企业，箭头表示关联方向',
+    //   top: 'top',
+    //   left: 'center',
+    //   textStyle: {
+    //     fontSize: 20,
+    //     color: '#2c3e50'
+    //   }
+    // },
+    // tooltip: {
+    //   formatter: function (params) {
+    //     if (params.dataType === 'node') {
+    //       return `<div style="font-weight:bold;margin-bottom:5px">${params.data.name}</div>
+    //                       <div>类别: ${categories[params.data.category].name}</div>
+    //                       <div>关联度: ${params.data.value}</div>`;
+    //     } else {
+    //       return `<div>${nodes[params.data.source].name} → ${nodes[params.data.target].name}</div>
+    //                       <div>关联强度: ${params.data.value}</div>`;
+    //     }
+    //   }
+    // },
+    legend: {
+      // data: categories.map(c => c.name),
+      show: false,
+      top: 40,
+      textStyle: {
+        fontSize: 12
+      }
+    },
+    animation: true,
+    animationDuration: 1000,
+    animationEasing: 'cubicOut',
+    series: [{
+      type: 'graph',
+      itemStyle: {
+        color: '#73C0DE'
+      },
+      layout: 'force',
+      data: nodes,
+      links: links,
+      // categories: categories,
+      roam: true,
+      label: {
+        show: true,
+        position: 'bottom',
+        formatter: '{b}',
+        fontSize: 12,
+        fontWeight: 'bold',
+        // backgroundColor: 'rgba(255,255,255,0.8)',
+        padding: [4, 6],
+        borderRadius: 4
+      },
+      lineStyle: {
+        color: 'source',
+        curveness: 0,
+        width: 2,
+        type: 'dashed',
+        color: '#AED6FF'
+      },
+      edgeSymbol: ['none', 'arrow'],
+      edgeSymbolSize: [0, 10],
+      emphasis: {
+        focus: 'adjacency',
+        lineStyle: {
+          width: 4
+        },
+        label: {
+          show: true,
+          fontSize: 14
+        }
+      },
+      force: {
+        repulsion: 300,
+        gravity: 0,
+        edgeLength: 300
+      },
+      edgeLabel: {
+        show: true,
+        position: 'middle',
+        fontSize: 14,
+        color: '#666',
+        backgroundColor: 'rgba(255,255,255,0.9)',
+        borderColor: '#bbb',
+        borderWidth: 1,
+        borderRadius: 4,
+        padding: [4, 8],
+        formatter: params => params.data.label ? params.data.label.formatter : ''
+      }
+    }],
+    // color: ['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de']
+  };
+
+  return option
+
+}
+
+export default getGraphChart
\ No newline at end of file
--- a/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/utils/multiLineChart.js
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/utils/multiLineChart.js
@@ -12,10 +12,10 @@ const getMultiLineChart = (dataX, dataY1, dataY2) => {
      }
    },
    grid: {
-      top: '8%',
-      right: '5%',
-      bottom: '5%',
-      left: '5%',
+      top: 40,
+      right: 24,
+      bottom: 24,
+      left: 24,
      containLabel: true
    },
    legend: {
@@ -32,7 +32,16 @@ const getMultiLineChart = (dataX, dataY1, dataY2) => {
    ],
    yAxis: [
      {
-        type: 'value'
+        type: 'value',
+        name: '数量',
+        splitLine: {
+          show: true,
+          lineStyle: {
+            type: 'dashed',    // 虚线类型
+            color: 'rgb(231, 243, 255)',      // 灰色线条
+            width: 1            // 线宽为1
+          }
+        }
      }
    ],
    series: [

--- a/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/utils/piechart.js
+++ b/src/views/marketAccessRestrictions/marketAccessLayout/overview/337/utils/piechart.js
-const getPieChart = (data,colorList) => {
+const getPieChart = (data) => {
+  const colorList = ['#69B1FF','#FF7875','#B37FEB','#FFC069','#1677FF','#87E8DE','#ADC6FF','#FFBB96','#BAE0FF','#FFD591']
  let option = {
    color: colorList,
    series: [
@@ -7,6 +8,7 @@ const getPieChart = (data,colorList) => {
      radius: [80, 100],
      height: '100%',
      left: 'center',
+      top: 'center',
      width: '100%',
      itemStyle: {
        borderColor: '#fff',
@@ -17,13 +19,20 @@ const getPieChart = (data,colorList) => {
        formatter: '{name|{b}}   {time|{c} 项   {d}%}\n',
        minMargin: 5,
        edgeDistance: 10,
-        lineHeight: 15,
+        lineHeight: 24,
        rich: {
-          time: {
-            fontSize: 12,
-            color: '#999'
+            name: {
+              color: 'rgba(59, 65, 75, 1)',
+              fontFamily: 'Source Han Sans CN',
+              fontSize: 16,
+              fontWeight: 'bold',
+            },
+            time: {
+              fontSize: 14,
+              fontFamily: 'Source Han Sans CN',
+              color: 'rgba(95, 101, 108, 1)',
+            }
          }
-        }
      },
      labelLine: {
        length: 15,

--- a/src/views/newsBrief/ModeuleNews.vue
+++ b/src/views/newsBrief/ModeuleNews.vue
+<template>
+    <el-space direction="vertical" class="full-width news-image-background">
+        <el-button class="float-btn" @click="gotoNewsBrief(false)"><el-icon>
+                <back />
+            </el-icon> 返回</el-button>
+        <el-space style="width: 993px;" direction="vertical" alignment="flex-start">
+            <div style="margin-top: 50px; margin-bottom: 24px; margin-left: 24px;">
+                <common-text class="text-title-0-show" color="var(--text-primary-90-color)">{{
+                    moduleName
+                }}</common-text>
+                <common-text class="text-regular"
+                    color="var(--text-primary-65-color)">基于情报价值评估预测算法，掌握全球重要潜在动向</common-text>
+            </div>
+            <el-space direction="vertical" fill alignment="flex-start" class="background-as-card common-padding">
+                <el-radio-group v-model="currentAreaId" class="radio-group-as-gap-btn">
+                    <el-space direction="horizontal" wrap alignment="center">
+                        <el-radio-button :label="''" @click="changeArea('')">全部</el-radio-button>
+                        <el-radio-button v-for="(t, i) in AreaList" :key="i" :label="t.id" @click="changeArea(t.id)">{{
+                            t.name }}
+                        </el-radio-button>
+                    </el-space>
+                </el-radio-group>
+                <el-divider style="margin: 10px 0px;"></el-divider>
+                <div class="">
+                    <news-list :news="NewsData" />
+                </div>
+            </el-space>
+        </el-space>
+    </el-space>
+</template>
+
+<script setup>
+import { ref, onMounted } from "vue";
+import { useRoute } from 'vue-router';
+import '@/styles/container.scss';
+import '@/styles/radio.scss';
+import NewsList from "./NewsList.vue";
+import { getAreaList, getHotNewsByArea } from "@/api/news/newsBrief";
+import { ElSpace, ElDivider, ElRadioButton, ElRadioGroup, ElButton, ElIcon } from "element-plus";
+import CommonText from "@/components/base/texts/CommonText.vue";
+import AreaTag from "@/components/base/AreaTag/index.vue";
+import { useGotoNewsBrief } from "@/router/modules/news";
+
+const route = useRoute();
+const gotoNewsBrief = useGotoNewsBrief();
+const moduleId = ref(route.params.id);
+const moduleName = ref(route.query.name ?? "");
+const NewsData = ref([]);
+const AreaList = ref([]);
+const currentAreaId = ref("");
+onMounted(async () => {
+    console.log(route.query.name, moduleId.value, moduleName.value);
+    const { data: areaList } = await getAreaList();
+    AreaList.value = areaList ?? [];
+    await changeArea("")
+});
+async function changeArea(id) {
+    const { data } = await getHotNewsByArea({
+        moduleId: moduleId.value,
+        industryId: id,
+    });
+    NewsData.value = data ?? [];
+}
+
+</script>
+
+<style lang="scss" scoped>
+@use '@/styles/common.scss' as *;
+@import url("./style.css");
+
+
+.float-btn {
+    position: absolute;
+    top: 24px;
+    left: 40px;
+    width: 92px;
+    height: 40px;
+    display: flex;
+    gap: 4px;
+    align-items: center;
+    justify-content: center;
+    box-sizing: border-box;
+    border: 1px solid rgba(255, 255, 255, 1);
+    border-radius: 32px;
+    @extend .text-regular;
+    color: var(--text-primary-65-color);
+}
+</style>
\ No newline at end of file
--- a/src/views/newsBrief/NewsDetial.vue
+++ b/src/views/newsBrief/NewsDetial.vue
+<template>
+
+</template>
+<script setup>
+
+</script>
+<style lang="scss" scoped>
+@import url("./style.css");
+</style>
\ No newline at end of file
--- a/src/views/newsBrief/NewsList.vue
+++ b/src/views/newsBrief/NewsList.vue
+<template>
+    <el-space direction="vertical" fill class="full-width mouse-hover" v-for="(item, index) in props.news" :key="index">
+        <news-item2 :img="item.newsImage" :title="item.newsTitle" :from="`新闻来源：${item.newsOrg} 发表时间：${item.newsDate}`"
+            :aeraTags="item.industryList?.map(t => t.industryName)" @click="gotoNewsDetail(item.newsId)" />
+        <div class="divider"></div>
+    </el-space>
+</template>
+<script setup>
+import NewsItem2 from '@/components/base/newsList/NewsItem2.vue';
+import { useGotoNewsDetail } from '@/router/modules/news';
+import { ElSpace } from 'element-plus';
+
+const gotoNewsDetail = useGotoNewsDetail();
+
+const props = defineProps({
+    news: {
+        type: Array,
+        default: () => []
+    }
+})
+</script>
+
+<style lang="css" scoped>
+.divider {
+    width: 100%;
+    height: 1px;
+    background: #eaecee;
+}
+</style>
\ No newline at end of file
--- a/src/views/newsBrief/NewsMain.vue
+++ b/src/views/newsBrief/NewsMain.vue
+<template>
+    <el-space direction="vertical" class="full-width" :size=24>
+        <el-radio-group class="radio-group-as-radius-btn">
+            <el-space>
+                <el-radio-button v-for="item in moduleList" :key="item.moduleId" :value="item.moduleId"
+                    @click="() => gotoNewsModule(item.moduleId, item.moduleName, false)">{{
+                        item.moduleName
+                    }} ></el-radio-button>
+                <!-- <el-radio-button value="nul"><img src="@/assets/icons/adjustment.png" /></el-radio-button> -->
+            </el-space>
+        </el-radio-group>
+
+        <el-space :size="16" alignment="flex-start">
+            <box-background width="712px" height="100%" title="今日要闻">
+                <template #header-icon>
+                    <img src="@/assets/icons/Headlines-icon.svg" />
+                </template>
+                <div class="common-padding">
+                    <news-list :news="HeadlinesData" />
+                </div>
+            </box-background>
+
+            <box-background width="712px" title="中美博弈专题">
+                <template #header-icon>
+                    <img src="@/assets/icons/subject-icon.png" />
+                </template>
+                <el-space :size="16" direction="vertical" fill class="full-width common-padding">
+                    <el-space v-for="(item, index) in subjectData.slice(0, 3)" :key="index" class="mouse-hover"
+                        @click="() => gotoNewsDetail(item.newsId)" alignment="center">
+                        <common-text class="text-bold"
+                            :color="index === 0 ? 'var(--color-red-100)' : (index === 1 ? 'var(--color-orange-100)' : 'var(--text-primary-65-color)')">
+                            {{ `${index + 1}` }}
+                        </common-text>
+                        <common-text class="text-bold" color="var(--text-primary-80-color)">{{
+                            item.newsTitle
+                        }}</common-text>
+                    </el-space>
+                    <el-space v-for="(item, index) in subjectData.slice(3)" :key="index" class="mouse-hover">
+                        <common-text class="text-regular" color="var(--text-primary-80-color)">{{
+                            "• " + item.newsTitle
+                        }}</common-text>
+                    </el-space>
+                </el-space>
+            </box-background>
+
+        </el-space>
+    </el-space>
+</template>
+<script setup>
+import { ref, onMounted } from "vue";
+import '@/styles/container.scss';
+import '@/styles/radio.scss';
+import { useGotoNewsModule, useGotoNewsDetail } from "@/router/modules/news";
+import { getMoudleType, getTodayNews, getTodayNewByArea, getHotNewsByArea, getHotNews } from "@/api/news/newsBrief";
+import { ElInput, ElSpace, ElImage, ElDivider, ElCol, ElRow, ElRadioButton, ElRadioGroup } from "element-plus";
+import AreaTag from '@/components/base/AreaTag/index.vue'
+import CommonText from "@/components/base/texts/CommonText.vue";
+import BoxBackground from '@/components/base/boxBackground/overviewNormalBox.vue'
+import NewsList from "./NewsList.vue";
+//博弈专题新闻数据
+const subjectData = ref([]);
+// 今日要闻
+const HeadlinesData = ref([
+]);
+const moduleList = ref([]);
+const gotoNewsDetail = useGotoNewsDetail();
+const gotoNewsModule = useGotoNewsModule();
+onMounted(async () => {
+    await initData();
+});
+
+const handleGetModuleType = async () => {
+    try {
+        const res = await getMoudleType();
+        console.log("模块类别", res);
+        if (res.code === 200 && res.data) {
+            moduleList.value = res.data;
+        }
+    } catch (error) { }
+};
+
+async function updateToday() {
+    const { data: todayNews } = await getTodayNews();
+    HeadlinesData.value = todayNews ?? [];
+}
+async function updateHotNews() {
+    const { data: hotNews } = await getHotNews();
+    subjectData.value = hotNews ?? [];
+}
+
+
+async function initData() {
+    await handleGetModuleType();
+    await updateToday();
+    await updateHotNews();
+}
+
+</script>
+
+<style lang="scss" scoped>
+@import url("./style.css");
+</style>
\ No newline at end of file
--- a/src/views/newsBrief/assets/images/概览页顶端背景.png
+++ b/src/views/newsBrief/assets/images/概览页顶端背景.png
--- a/src/views/newsBrief/index.vue
+++ b/src/views/newsBrief/index.vue
 <template>
-	<div class="newsBrief-page">
-		<div v-if="showPage === 'home'">
-			<div style="justify-content: space-between">
-				<div class="news-header">新闻速览</div>
-				<div class="input-box">
-					<el-input placeholder="请输入关键词" :suffix-icon="searchInput" clearable style="width: 800px; height: 48px">
-					</el-input>
-				</div>
-
-				<div class="btn-box">
-					<div
-						v-for="(item, index) in moduleList"
-						:key="index"
-						:class="moduleActiveId !== item.moduleId ? 'header-btn' : 'header-btn-select'"
-						@click="handleToWorldHot(item)"
-						@mouseenter="handleActiveModule(true, item)"
-						@mouseleave="handleActiveModule(false, item)"
-					>
-						<div class="btn-box-text">{{ item.moduleName }}</div>
-						<div class="btn-box-icon">
-							<img v-if="moduleActiveId === item.moduleId" src="@/assets/icons/btn-arrow-right-active.png" alt="" />
-							<img v-else src="@/assets/icons/btn-arrow-right.png" alt="" />
-						</div>
-					</div>
-					<div class="header-btn-more" v-if="moduleList.length">
-						<img src="@/assets/icons/adjustment.png" />
-					</div>
-				</div>
-			</div>
-			<div class="main">
-				<div class="box">
-					<div class="box-header">
-						<div class="box-header-img">
-							<img src="@/assets/icons/Headlines-icon.svg" />
-						</div>
-						<div class="box-header-title" @click="changePage('headlines')">今日要闻 ></div>
-					</div>
-					<div class="divider"></div>
-					<div v-for="(item, index) in HeadlinesData" :key="index">
-						<div class="box1-item">
-							<div class="box1-item-left">
-								<div class="box1-item-title">
-									{{ item.title }}
-								</div>
-								<div class="box1-item-content">
-									<div class="source">新闻来源： {{ item.from }}</div>
-									<div class="time">发表时间：{{ item.time }}</div>
-								</div>
-								<div class="tag-box">
-									<div v-for="(tag, index) in item.tag" :key="index" class="tag">
-										{{ tag }}
-									</div>
-								</div>
-							</div>
-							<div style="margin-left: auto; padding: 10px">
-								<img :src="item.image" />
-							</div>
-						</div>
-
-						<div class="divider"></div>
-					</div>
-				</div>
-				<div class="box">
-					<div class="box-header">
-						<div class="box-header-img"><img src="@/assets/icons/subject-icon.png" /></div>
-						<div class="box-header-title">中美博弈专题</div>
-					</div>
-					<div class="divider"></div>
-					<div v-for="(item, index) in subjectData" :key="index">
-						<div class="subject-line">
-							<div style="display: flex; align-items: center">
-								<div
-									class="subject-line-id"
-									:class="{
-										subjectLineId1: index === 0,
-										subjectLineId2: index === 1,
-										subjectLineId3: index === 2
-									}"
-								>
-									{{ index <= 2 ? index + 1 : "•" }}
-								</div>
-								<div class="text" :class="{ textTop: index < 3 }">
-									{{ item.newsTitle }}
-								</div>
-							</div>
-							<img v-if="item.hot" :src="`src/assets/icons/arrow-0.png`" />
-							<img v-else :src="`src/assets/icons/arrow-1.png`" />
-						</div>
-					</div>
-				</div>
-			</div>
+	<el-scrollbar class="news-image-background">
+		<div class="common-page">
+			<el-space direction="vertical" class="full-width">
+				<div class="text-title-0-show" style="margin-top: 50px;">新闻速览</div>
+				<search-box placeholder="请输入关键词" style="margin-top: 19px;margin-bottom: 42px;"></search-box>
+				<news-main></news-main>
+				<!-- <Headlines v-if="showPage === 'headlines'" @type="showPage" @back="changePage" />
+				<Subject v-if="showPage === 'subject'" @back="changePage" /> -->
+			</el-space>
 		</div>
-
-		<Headlines v-if="showPage === 'headlines'" @type="showPage" @back="changePage" />
-		<Subject v-if="showPage === 'subject'" @back="changePage" />
-	</div>
+	</el-scrollbar>
 </template>

 <script setup>
 import { ref, onMounted } from "vue";
-import { getMoudleType, getTodayNews, getHotNews } from "@/api/news/newsBrief";
+import '@/styles/container.scss';
 import { useRoute } from "vue-router";
 import Headlines from "./Headlines.vue";
 import Subject from "./Subject.vue";
-// import style from './style.css'
+import { ElInput, ElSpace, ElImage, ElDivider, ElCol, ElRow } from "element-plus";
+import AreaTag from '@/components/base/AreaTag/index.vue'
+import CommonText from "@/components/base/texts/CommonText.vue";
+import NewsMain from "./NewsMain.vue";
+import SearchBox from "@/components/base/SearchBox/index.vue";

-const route = useRoute();

 //顶部数据搜索
 const searchInput = ref("");
-const moduleList = ref([]);
-const moduleActiveId = ref("");
-const handleGetModuleType = async () => {
-	try {
-		const res = await getMoudleType();
-		console.log("模块类别", res);
-		if (res.code === 200 && res.data) {
-			moduleList.value = res.data;
-		}
-	} catch (error) {}
-};

-// 今日要闻
-const HeadlinesData = ref([
-	{
-		title: "黎巴嫩真主党指责美国破坏黎稳定 谴责以色列“蓄意挑衅”",
-		from: "人民网",
-		time: "2025-10-05",
-		tag: ["以色列", "美国"],
-		image: "/testData/HeadlinesData-img.png"
-	},
-	{
-		title: "IMF上调中东和北非地区经济增长预期",
-		from: "CNN",
-		time: "2025-10-05",
-		tag: ["经济", "中东", "IMF"],
-		image: "/testData/HeadlinesData-img.png"
-	},
-	{
-		title: "日本外务省亚洲大洋洲局局长金井正彰启程访华 预计18日与中方会面",
-		from: "人民网",
-		time: "2025-10-05",
-		tag: ["日本", "访华"],
-		image: "/testData/HeadlinesData-img.png"
-	},
-	{
-		title: "韩日因独岛主权争议暂停本月联合搜救演习",
-		from: "凤凰网",
-		time: "2025-10-05",
-		tag: ["独岛", "联合军演", "韩国", "日本"],
-		image: "/testData/HeadlinesData-img.png"
-	},
-	{
-		title: "美“福特”号航母抵达加勒比海 于委内瑞拉附近展开大规模军事集结",
-		from: "央视网",
-		time: "2025-10-05",
-		tag: ["美国", "航母", "加勒比海"],
-		image: "/testData/HeadlinesData-img.png"
-	}
-]);
-const handleGetTodayNews = async () => {
-	try {
-		const res = await getTodayNews();
-		console.log("今日要闻", res);
-		if (res.code === 200 && res.data) {
-		} else {
-			HeadlinesData.value = [];
-		}
-	} catch (error) {
-		HeadlinesData.value = [];
-	}
-};
+
+
+

 //当前页面显示
 const showPage = ref("home");
@@ -178,54 +38,23 @@ const changePage = page => {
 	console.log(page);
 	showPage.value = page;
 };
-//博弈专题新闻数据
-const subjectData = ref([
-	// { id: 1, text: "乌克兰与法国签署意向书 将获 100 架“阵风”战机及多套防空系统", arrow: 0 },
-	// { id: 2, text: "安理会通过涉加沙决议 建立和平委员会作为过渡行政机构", arrow: 1 },
-	// { id: 3, text: "日本首相高市早苗涉台及修“无核三原则”言论遭多方强烈反对", arrow: 1 },
-	// { id: 4, text: "美“福特”号航母打击群进入加勒比海 委方谴责其意图策动政权更迭", arrow: 1 },
-	// { id: 5, text: "BBC回应特朗普10亿-50亿美元索赔诉讼 称诽谤指控无依据", arrow: 1 },
-	// { id: 6, text: "俄军打击乌142个区域设施 乌军击落或压制91架俄无人机", arrow: 1 },
-]);
-const handleGetHotNews = async () => {
-	try {
-		const res = await getHotNews();
-		console.log("中美博弈专题", res);
-		if (res.code === 200 && res.data) {
-			subjectData.value = res.data;
-		} else {
-			subjectData.value = [];
-		}
-	} catch (error) {
-		subjectData.value = [];
-	}
-};

-const handleActiveModule = (isIn, module) => {
-	moduleActiveId.value = isIn ? module.moduleId : "";
-};

-const handleToWorldHot = () => {
-	showPage.value = "subject";
-	moduleActiveId.value = "";
-};

-onMounted(() => {
-	handleGetModuleType();
-	handleGetTodayNews();
-	handleGetHotNews();
-});
 </script>
 <style lang="scss" scoped>
 @import url("./style.css");

-.newsBrief-page {
-	height: 100%;
-	background: url("@/assets/images/background.png") no-repeat;
-	background-position: center -100px;
-	background-size: 100% 100%;
-	padding-top: 50px;
-	overflow: hidden;
-	overflow-y: auto;
+.search-container {
+	margin: 0 auto;
+}
+
+.search-input {
+	width: 800px;
+	height: 48px;
+
+	//水平居中
+	margin: 0 auto;
+	display: block; // 强制设置为块级元素
 }
 </style>
--- a/src/views/newsBrief/style.css
+++ b/src/views/newsBrief/style.css
+.news-image-background {
+	height: 100%;
+	background-image: url("./assets/images/概览页顶端背景.png");
+	background-position: center -100px;
+	background-size: 100% 100%;
+	background-repeat: no-repeat;
+	overflow: hidden;
+	overflow-y: auto;
+}
+
 .news-header {
 	color: rgba(34, 41, 52, 1);
 	font-family: YouSheBiaoTiHei;