diff --git a/src/assets/v3/bj11.png b/src/assets/v3/bj11.png
new file mode 100644
index 0000000..91e7d05
Binary files /dev/null and b/src/assets/v3/bj11.png differ
diff --git a/src/components/Header/index.vue b/src/components/Header/index.vue
index 3ebc64d..d96d89a 100644
--- a/src/components/Header/index.vue
+++ b/src/components/Header/index.vue
@@ -10,7 +10,7 @@
           <li><router-link to="/home" class="LNK">首页</router-link></li>
 
           <li class="has-submenu">
-            <router-link to="/products" class="LNK">产品服务</router-link>
+            <router-link to="/ProductServices" class="LNK">产品服务</router-link>
           </li>
 
           <li><router-link to="/solutions" class="LNK">解决方案</router-link></li>
diff --git a/src/router/config/home.ts b/src/router/config/home.ts
index 3413e15..eb55bf3 100644
--- a/src/router/config/home.ts
+++ b/src/router/config/home.ts
@@ -265,6 +265,19 @@ export default [
           asideMenu: 'drawer' // 左侧菜单抽屉模式
         }
       },
+      {
+        path: '/ProductServices',
+        name: 'ProductServices',
+        component: () => import('@/views/Jyh/ProductServices/index.vue'),
+        meta: {
+          title: '可信开源态势感知平台 (源感)',
+          reportTitle: '可信开源态势感知平台 (源感)',
+          className: 'w-full min-w-full',
+          hiddenFooter: true,
+          hasMobile: true,
+          asideMenu: 'drawer' // 左侧菜单抽屉模式
+        }
+      },
       {
         path: '/ProductServices/1',
         name: 'ProductServices1',
diff --git a/src/views/Jyh/ProductServices/ModBanner.vue b/src/views/Jyh/ProductServices/ModBanner.vue
index 7b45764..e032710 100644
--- a/src/views/Jyh/ProductServices/ModBanner.vue
+++ b/src/views/Jyh/ProductServices/ModBanner.vue
@@ -1,41 +1,103 @@
 <template>
   <div class="mod-banner">
-    <div class="txt xCenter"><p class="zh wow animated" style="visibility: visible;">全栈式开源安全检测与治理工具链</p></div>
+    <div class="banner-container">
+      <div class="txt-content wow fadeInUp">
+        <h1 class="zh-title">全栈式开源安全检测<br/>与治理工具链</h1>
+        <p class="en-desc">
+          构建国家级开源安全数据底座，聚合全球漏洞情报。基于安全数据湖仓，<br/>
+          实现全景风险实时感知。
+        </p>
+        <a href="javascript:void(0);" class="action-btn">
+          了解研究方向
+        </a>
+      </div>
+    </div>
   </div>
 </template>
 
-<script>
-export default {
-  name: "ModBanner"
-}
+<script setup>
+// 使用 script setup 语法
 </script>
 
-<style scoped>
-.pg-evaluate .mod-banner {
-  background: #eceded url(@/assets/v3/banner.DfCkZ1gw.png) no-repeat 100%;
-  background-size: auto 100%;
-  height: 460px;
-  position: relative
+<style scoped lang="scss">
+.mod-banner {
+  /* 背景图替换为 image_b14311.jpg，使用 cover 确保全屏覆盖 */
+  background: #001529 url('@/assets/v3/bj11.png') no-repeat center center;
+  background-size: cover;
+  height: 520px; /* 增加高度以匹配大屏视觉 */
+  position: relative;
+  display: flex;
+  align-items: center; /* 垂直居中内容 */
+  overflow: hidden;
+
+  /* 增加一个深色遮罩，确保文字更清晰（可选） */
+  &::before {
+    content: '';
+    position: absolute;
+    top: 0; left: 0; right: 0; bottom: 0;
+    background: linear-gradient(90deg, rgba(0, 21, 41, 0.4) 0%, transparent 100%);
+    z-index: 1;
+  }
 }
 
-.pg-evaluate .mod-banner .txt {
-  left: 50%;
-  position: absolute;
-  top: 177px;
-  width: 1292px
+.banner-container {
+  width: 100%;
+  max-width: 1400px;
+  margin: 0 auto;
+  padding: 0 40px;
+  position: relative;
+  z-index: 2; /* 位于遮罩层上方 */
 }
 
-.pg-evaluate .mod-banner .txt .zh {
-  font-size: 40px;
-  font-style: normal;
-  font-weight: 400;
-  letter-spacing: 1px;
-  line-height: 56px;
-  text-align: left
+.txt-content {
+  max-width: 800px;
+  color: #ffffff;
+  text-align: left;
 }
 
-.xCenter {
-  -webkit-transform: translate(-50%);
-  transform: translate(-50%);
+.zh-title {
+  font-size: 48px; /* 增大字号 */
+  font-weight: 700;
+  line-height: 1.3;
+  letter-spacing: 2px;
+  margin-bottom: 24px;
+  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
+}
+
+.en-desc {
+  font-size: 18px;
+  color: rgba(255, 255, 255, 0.85);
+  line-height: 1.6;
+  margin-bottom: 40px;
+  font-weight: 300;
+  letter-spacing: 0.5px;
+}
+
+/* 红色操作按钮：完全还原 image_932d00.jpg 风格 */
+.action-btn {
+  display: inline-block;
+  background-color: #C8161D;
+  color: #ffffff;
+  padding: 12px 32px;
+  font-size: 16px;
+  font-weight: 500;
+  text-decoration: none;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  border: 1px solid transparent;
+
+  &:hover {
+    background-color: #A01218;
+    box-shadow: 0 4px 15px rgba(200, 22, 29, 0.4);
+    transform: translateY(-2px);
+  }
+}
+
+/* 响应式适配 */
+@media (max-width: 768px) {
+  .mod-banner { height: 400px; }
+  .zh-title { font-size: 32px; }
+  .en-desc { font-size: 14px; }
+  .banner-container { padding: 0 20px; }
 }
 </style>
diff --git a/src/views/Jyh/ProductServices/ModContent.vue b/src/views/Jyh/ProductServices/ModContent.vue
new file mode 100644
index 0000000..1a7162d
--- /dev/null
+++ b/src/views/Jyh/ProductServices/ModContent.vue
@@ -0,0 +1,215 @@
+<template>
+  <div class="product-section">
+    <div class="container">
+      <div class="product-grid">
+        <div
+          v-for="(item, index) in products"
+          :key="index"
+          class="product-card-wrapper"
+        >
+          <div class="badge-number">{{ index + 1 }}</div>
+
+          <d-card class="custom-product-card">
+            <template #title>
+              <div class="card-header">
+                <h3 class="product-title">{{ item.title }}</h3>
+              </div>
+            </template>
+
+            <template #content>
+              <div class="card-body">
+                <ul class="feature-list">
+                  <li v-for="(feature, fIdx) in item.features" :key="fIdx">
+                    <div class="feature-icon-wrapper">
+                      <span v-if="feature.emoji" class="feature-emoji">{{ feature.emoji }}</span>
+                      <div v-else class="icon-check-circle"></div>
+                    </div>
+                    <div class="feature-text">
+                      <strong>{{ feature.label }}：</strong>
+                      <span>{{ feature.desc }}</span>
+                    </div>
+                  </li>
+                </ul>
+              </div>
+            </template>
+
+            <template #actions>
+              <div class="card-footer">
+                <d-button
+                  variant="solid"
+                  color="danger"
+                  class="more-btn"
+                  @click="goToDetail(index + 1)"
+                >
+                  了解详情 >
+                </d-button>
+              </div>
+            </template>
+          </d-card>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+const router = useRouter();
+
+// 编程式导航函数
+const goToDetail = (id) => {
+  router.push(`/ProductServices/${id}`);
+};
+
+const products = ref([
+  {
+    title: '可信开源态势感知平台 (源感)',
+    features: [
+      { emoji: '🕹️', label: '数据标签', desc: '基于机器学习与知识图谱技术，智能化为全量开源项目提供精准分类与多维度评分。' },
+      { emoji: '🛡️', label: '风险感知', desc: '基于3D地球与热力图技术，实时可视化展示全球开源漏洞、投毒攻击的爆发点及受影响行业分布。' },
+      { emoji: '📊', label: '数据定制', desc: '提供情报订阅中心、深度分析报告、API数据对接等服务，满足企业个性化威胁情报需求。' }
+    ]
+  },
+  {
+    title: '金银湖安全大模型 (源鉴)',
+    features: [
+      { emoji: '🔍', label: '漏洞检测', desc: '基于AST与CPG图构建，结合静态分析、动态增量分析、AI语义理解，检测准确率提升85%以上。' },
+      { emoji: '🩹', label: '漏洞修复', desc: '基于多智能体协同修复技术，自动生成修复方案并完成验证测试，修复准确率提升75%以上。' },
+      { emoji: '💬', label: '安全知识问答', desc: '基于漏洞知识图谱与RAG检索增强技术，提供高质量、可解释的漏洞分析，问答准确率达92%以上。' },
+      { emoji: '🛠️', label: '安全工具调用', desc: '基于Function Calling技术，智能调用第三方安全工具，实现漏洞扫描、代码审计等自动化任务编排。' }
+    ]
+  },
+  {
+    title: '软件供应链检测平台 (源链)',
+    features: [
+      { emoji: '⚙️', label: '平台管理与数据服务', desc: '提供用户友好的Web界面和API，确保数据准确性与时效性。' },
+      { emoji: '📦', label: '包管理器成分分析', desc: '针对常见包管理器（如npm、PyPI、Maven）的依赖分析引擎，自动识别组件及其版本。' },
+      { emoji: '💻', label: 'C/C++/项目成分分析', desc: '专门处理C/C++项目的成分分析，识别第三方库和潜在风险。' },
+      { emoji: '📑', label: '二进制文件成分分析', desc: '针对二进制文件的分析引擎，通过反编译和特征匹配识别成分和漏洞。' },
+      { emoji: '🛡️', label: '供应测链安全检测', desc: '精准漏洞检测、恶意代码防护、合规性保障。' },
+      { emoji: '⚖️', label: '合规性检测', desc: '分析软件组件的许可证信息，检查兼容性和合规性，避免法律冲突。' }
+    ]
+  },
+  {
+    title: '智能终端安全监测平台 (源端)',
+    features: [
+      { emoji: '🔍', label: '极速扫描服务', desc: '百万级样本秒级初筛能力，支持海量应用快速筛查，检测准确率高达99%。' },
+      { emoji: '🔬', label: '深度分析服务', desc: '精准定位恶意逻辑核心，可视化展示攻击路径，分析准确率达88%以上。' },
+      { emoji: '🛡️', label: '持续免疫服务', desc: '自适应进化检测模型，秒级响应恶意变种，支持跨平台识别演进。' },
+      { emoji: '🌐', label: '威胁情报服务', desc: 'Zero-day预警能力，已挖掘498个普通及31个高隐蔽性Zero-day恶意软件。' }
+    ]
+  }
+]);
+</script>
+
+<style lang="scss" scoped>
+.product-section {
+  background-color: #f8faff;
+  padding: 80px 0;
+  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
+}
+
+.container {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 0 20px;
+}
+
+.product-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 40px;
+
+  @media (max-width: 992px) {
+    grid-template-columns: 1fr;
+  }
+}
+
+.product-card-wrapper {
+  position: relative;
+  transition: transform 0.3s ease;
+  &:hover { transform: translateY(-5px); }
+}
+
+.badge-number {
+  position: absolute;
+  top: 0; left: 0;
+  width: 44px; height: 44px;
+  background-color: #c8161d;
+  color: white;
+  display: flex; align-items: center; justify-content: center;
+  font-size: 20px; font-weight: bold;
+  border-bottom-right-radius: 20px;
+  z-index: 10;
+}
+
+.custom-product-card {
+  height: 100%;
+  min-height: 520px;
+  border: none !important;
+  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
+  border-radius: 8px !important;
+  overflow: visible !important;
+  background: white;
+  padding: 20px;
+}
+
+.product-title {
+  font-size: 18px;
+  color: #333;
+  font-weight: 600;
+  margin: 15px 0 25px 25px;
+}
+
+.feature-list {
+  list-style: none;
+  padding: 0; margin: 0;
+  li {
+    display: flex;
+    align-items: flex-start;
+    margin-bottom: 18px;
+    line-height: 1.6;
+  }
+}
+
+.feature-icon-wrapper {
+  margin-right: 12px;
+  margin-top: 2px;
+  min-width: 20px;
+  display: flex;
+  justify-content: center;
+}
+
+.feature-emoji {
+  font-size: 16px;
+  line-height: 1;
+}
+
+.feature-text {
+  font-size: 14px;
+  color: #666;
+  strong { color: #444; }
+}
+
+.card-footer {
+  position: absolute;
+  bottom: 25px;
+  right: 25px;
+}
+
+.more-btn {
+  background-color: #c8161d !important;
+  border-color: #c8161d !important;
+  border-radius: 4px !important;
+  padding: 0 20px !important;
+  height: 36px !important;
+  font-weight: bold !important;
+  cursor: pointer;
+
+  &:hover {
+    background-color: #a01218 !important;
+  }
+}
+</style>
diff --git a/src/views/Jyh/ProductServices/ProductServices1/ModBanner.vue b/src/views/Jyh/ProductServices/ProductServices1/ModBanner.vue
index e95e500..3437129 100644
--- a/src/views/Jyh/ProductServices/ProductServices1/ModBanner.vue
+++ b/src/views/Jyh/ProductServices/ProductServices1/ModBanner.vue
@@ -1,41 +1,102 @@
 <template>
   <div class="mod-banner">
-    <div class="txt xCenter"><p class="zh wow animated" style="visibility: visible;">全网态势，一屏尽览</p></div>
+    <div class="banner-container">
+      <div class="txt-content wow fadejinzhiInUp">
+        <h1 class="zh-title">可信开源态势感知平台 (源感)</h1>
+        <p class="en-desc">
+          全网态势，一屏尽览
+        </p>
+        <a href="javascript:void(0);" class="action-btn">
+          了解研究方向
+        </a>
+      </div>
+    </div>
   </div>
 </template>
 
-<script>
-export default {
-  name: "ModBanner"
-}
+<script setup>
+// 使用 script setup 语法
 </script>
 
-<style scoped>
-.pg-evaluate .mod-banner {
-  background: #eceded url(@/assets/v3/banner.DfCkZ1gw.png) no-repeat 100%;
-  background-size: auto 100%;
-  height: 460px;
-  position: relative
+<style scoped lang="scss">
+.mod-banner {
+  /* 背景图替换为 image_b14311.jpg，使用 cover 确保全屏覆盖 */
+  background: #001529 url('@/assets/v3/bj11.png') no-repeat center center;
+  background-size: cover;
+  height: 520px; /* 增加高度以匹配大屏视觉 */
+  position: relative;
+  display: flex;
+  align-items: center; /* 垂直居中内容 */
+  overflow: hidden;
+
+  /* 增加一个深色遮罩，确保文字更清晰（可选） */
+  &::before {
+    content: '';
+    position: absolute;
+    top: 0; left: 0; right: 0; bottom: 0;
+    background: linear-gradient(90deg, rgba(0, 21, 41, 0.4) 0%, transparent 100%);
+    z-index: 1;
+  }
 }
 
-.pg-evaluate .mod-banner .txt {
-  left: 50%;
-  position: absolute;
-  top: 177px;
-  width: 1292px
+.banner-container {
+  width: 100%;
+  max-width: 1400px;
+  margin: 0 auto;
+  padding: 0 40px;
+  position: relative;
+  z-index: 2; /* 位于遮罩层上方 */
 }
 
-.pg-evaluate .mod-banner .txt .zh {
-  font-size: 40px;
-  font-style: normal;
-  font-weight: 400;
-  letter-spacing: 1px;
-  line-height: 56px;
-  text-align: left
+.txt-content {
+  max-width: 800px;
+  color: #ffffff;
+  text-align: left;
 }
 
-.xCenter {
-  -webkit-transform: translate(-50%);
-  transform: translate(-50%);
+.zh-title {
+  font-size: 48px; /* 增大字号 */
+  font-weight: 700;
+  line-height: 1.3;
+  letter-spacing: 2px;
+  margin-bottom: 24px;
+  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
+}
+
+.en-desc {
+  font-size: 18px;
+  color: rgba(255, 255, 255, 0.85);
+  line-height: 1.6;
+  margin-bottom: 40px;
+  font-weight: 300;
+  letter-spacing: 0.5px;
+}
+
+/* 红色操作按钮：完全还原 image_932d00.jpg 风格 */
+.action-btn {
+  display: inline-block;
+  background-color: #C8161D;
+  color: #ffffff;
+  padding: 12px 32px;
+  font-size: 16px;
+  font-weight: 500;
+  text-decoration: none;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  border: 1px solid transparent;
+
+  &:hover {
+    background-color: #A01218;
+    box-shadow: 0 4px 15px rgba(200, 22, 29, 0.4);
+    transform: translateY(-2px);
+  }
+}
+
+/* 响应式适配 */
+@media (max-width: 768px) {
+  .mod-banner { height: 400px; }
+  .zh-title { font-size: 32px; }
+  .en-desc { font-size: 14px; }
+  .banner-container { padding: 0 20px; }
 }
 </style>
diff --git a/src/views/Jyh/ProductServices/ProductServices1/index.vue b/src/views/Jyh/ProductServices/ProductServices1/index.vue
index 168089d..1af654c 100644
--- a/src/views/Jyh/ProductServices/ProductServices1/index.vue
+++ b/src/views/Jyh/ProductServices/ProductServices1/index.vue
@@ -1,8 +1,13 @@
 <template>
-  <div class="pg-evaluate">
-    <ModBanner />
-    <ModTabs :defaultTab="activeTab" />
-    <ModTotal />
+
+  <div class="secondEdition">
+    <div class="product-content pg-evaluate">
+      <ModBanner />
+      <div  class="component-box">
+        <Product1 />
+      </div>
+      <ModTotal />
+    </div>
   </div>
 </template>
 
@@ -11,6 +16,10 @@ import { ref, onMounted } from 'vue';
 import ModBanner from './ModBanner.vue';
 import ModTabs from './ModTabs.vue';
 import ModTotal from './ModTotal.vue';
+import Product1 from '@/views/Jyh/Home/component/ComProject/product1.vue'
+import Product2 from '@/views/Jyh/Home/component/ComProject/product2.vue'
+import Product3 from '@/views/Jyh/Home/component/ComProject/product3.vue'
+import Product4 from '@/views/Jyh/Home/component/ComProject/product4.vue'
 
 const activeTab = ref<string | number>('');
 
@@ -34,7 +43,7 @@ onMounted(() => {
 </script>
 
 <style lang="scss" scoped>
-.pg-evaluate {
+.product-content {
   background-color: #fafafa;
   color: #333;
 }
diff --git a/src/views/Jyh/ProductServices/ProductServices1/indexOld.vue b/src/views/Jyh/ProductServices/ProductServices1/indexOld.vue
new file mode 100644
index 0000000..168089d
--- /dev/null
+++ b/src/views/Jyh/ProductServices/ProductServices1/indexOld.vue
@@ -0,0 +1,41 @@
+<template>
+  <div class="pg-evaluate">
+    <ModBanner />
+    <ModTabs :defaultTab="activeTab" />
+    <ModTotal />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import ModBanner from './ModBanner.vue';
+import ModTabs from './ModTabs.vue';
+import ModTotal from './ModTotal.vue';
+
+const activeTab = ref<string | number>('');
+
+// 解析URL参数的方法
+const getUrlParam = (paramName: string): string | null => {
+  // 获取当前URL的查询参数
+  const searchParams = new URLSearchParams(window.location.search);
+  // 返回指定参数的值
+  return searchParams.get(paramName);
+};
+
+onMounted(() => {
+  // 获取url中tab参数的值
+  const tabParam = getUrlParam('tab');
+  if (tabParam) {
+    activeTab.value = /^\d+$/.test(tabParam) ? Number(tabParam) : tabParam;
+  } else {
+    activeTab.value = 0;
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+.pg-evaluate {
+  background-color: #fafafa;
+  color: #333;
+}
+</style>
diff --git a/src/views/Jyh/ProductServices/ProductServices2/ModBanner.vue b/src/views/Jyh/ProductServices/ProductServices2/ModBanner.vue
index 0571106..8212262 100644
--- a/src/views/Jyh/ProductServices/ProductServices2/ModBanner.vue
+++ b/src/views/Jyh/ProductServices/ProductServices2/ModBanner.vue
@@ -1,41 +1,102 @@
 <template>
   <div class="mod-banner">
-    <div class="txt xCenter"><p class="zh wow animated" style="visibility: visible;">懂代码，更懂安全的 AI 专家</p></div>
+    <div class="banner-container">
+      <div class="txt-content wow fadejinzhiInUp">
+        <h1 class="zh-title">金银湖安全大模型 (源鉴)</h1>
+        <p class="en-desc">
+          懂代码，更懂安全的 AI 专家
+        </p>
+        <a href="javascript:void(0);" class="action-btn">
+          了解研究方向
+        </a>
+      </div>
+    </div>
   </div>
 </template>
 
-<script>
-export default {
-  name: "ModBanner"
-}
+<script setup>
+// 使用 script setup 语法
 </script>
 
-<style scoped>
-.pg-evaluate .mod-banner {
-  background: #eceded url(@/assets/v3/banner.DfCkZ1gw.png) no-repeat 100%;
-  background-size: auto 100%;
-  height: 460px;
-  position: relative
+<style scoped lang="scss">
+.mod-banner {
+  /* 背景图替换为 image_b14311.jpg，使用 cover 确保全屏覆盖 */
+  background: #001529 url('@/assets/v3/bj11.png') no-repeat center center;
+  background-size: cover;
+  height: 520px; /* 增加高度以匹配大屏视觉 */
+  position: relative;
+  display: flex;
+  align-items: center; /* 垂直居中内容 */
+  overflow: hidden;
+
+  /* 增加一个深色遮罩，确保文字更清晰（可选） */
+  &::before {
+    content: '';
+    position: absolute;
+    top: 0; left: 0; right: 0; bottom: 0;
+    background: linear-gradient(90deg, rgba(0, 21, 41, 0.4) 0%, transparent 100%);
+    z-index: 1;
+  }
 }
 
-.pg-evaluate .mod-banner .txt {
-  left: 50%;
-  position: absolute;
-  top: 177px;
-  width: 1292px
+.banner-container {
+  width: 100%;
+  max-width: 1400px;
+  margin: 0 auto;
+  padding: 0 40px;
+  position: relative;
+  z-index: 2; /* 位于遮罩层上方 */
 }
 
-.pg-evaluate .mod-banner .txt .zh {
-  font-size: 40px;
-  font-style: normal;
-  font-weight: 400;
-  letter-spacing: 1px;
-  line-height: 56px;
-  text-align: left
+.txt-content {
+  max-width: 800px;
+  color: #ffffff;
+  text-align: left;
 }
 
-.xCenter {
-  -webkit-transform: translate(-50%);
-  transform: translate(-50%);
+.zh-title {
+  font-size: 48px; /* 增大字号 */
+  font-weight: 700;
+  line-height: 1.3;
+  letter-spacing: 2px;
+  margin-bottom: 24px;
+  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
+}
+
+.en-desc {
+  font-size: 18px;
+  color: rgba(255, 255, 255, 0.85);
+  line-height: 1.6;
+  margin-bottom: 40px;
+  font-weight: 300;
+  letter-spacing: 0.5px;
+}
+
+/* 红色操作按钮：完全还原 image_932d00.jpg 风格 */
+.action-btn {
+  display: inline-block;
+  background-color: #C8161D;
+  color: #ffffff;
+  padding: 12px 32px;
+  font-size: 16px;
+  font-weight: 500;
+  text-decoration: none;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  border: 1px solid transparent;
+
+  &:hover {
+    background-color: #A01218;
+    box-shadow: 0 4px 15px rgba(200, 22, 29, 0.4);
+    transform: translateY(-2px);
+  }
+}
+
+/* 响应式适配 */
+@media (max-width: 768px) {
+  .mod-banner { height: 400px; }
+  .zh-title { font-size: 32px; }
+  .en-desc { font-size: 14px; }
+  .banner-container { padding: 0 20px; }
 }
 </style>
diff --git a/src/views/Jyh/ProductServices/ProductServices2/index.vue b/src/views/Jyh/ProductServices/ProductServices2/index.vue
index 168089d..8957d10 100644
--- a/src/views/Jyh/ProductServices/ProductServices2/index.vue
+++ b/src/views/Jyh/ProductServices/ProductServices2/index.vue
@@ -1,8 +1,13 @@
 <template>
-  <div class="pg-evaluate">
-    <ModBanner />
-    <ModTabs :defaultTab="activeTab" />
-    <ModTotal />
+
+  <div class="secondEdition">
+    <div class="product-content pg-evaluate">
+      <ModBanner />
+      <div  class="component-box">
+        <Product2 />
+      </div>
+      <ModTotal />
+    </div>
   </div>
 </template>
 
@@ -11,6 +16,10 @@ import { ref, onMounted } from 'vue';
 import ModBanner from './ModBanner.vue';
 import ModTabs from './ModTabs.vue';
 import ModTotal from './ModTotal.vue';
+import Product1 from '@/views/Jyh/Home/component/ComProject/product1.vue'
+import Product2 from '@/views/Jyh/Home/component/ComProject/product2.vue'
+import Product3 from '@/views/Jyh/Home/component/ComProject/product3.vue'
+import Product4 from '@/views/Jyh/Home/component/ComProject/product4.vue'
 
 const activeTab = ref<string | number>('');
 
@@ -34,7 +43,7 @@ onMounted(() => {
 </script>
 
 <style lang="scss" scoped>
-.pg-evaluate {
+.product-content {
   background-color: #fafafa;
   color: #333;
 }
diff --git a/src/views/Jyh/ProductServices/ProductServices2/indexOld.vue b/src/views/Jyh/ProductServices/ProductServices2/indexOld.vue
new file mode 100644
index 0000000..168089d
--- /dev/null
+++ b/src/views/Jyh/ProductServices/ProductServices2/indexOld.vue
@@ -0,0 +1,41 @@
+<template>
+  <div class="pg-evaluate">
+    <ModBanner />
+    <ModTabs :defaultTab="activeTab" />
+    <ModTotal />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import ModBanner from './ModBanner.vue';
+import ModTabs from './ModTabs.vue';
+import ModTotal from './ModTotal.vue';
+
+const activeTab = ref<string | number>('');
+
+// 解析URL参数的方法
+const getUrlParam = (paramName: string): string | null => {
+  // 获取当前URL的查询参数
+  const searchParams = new URLSearchParams(window.location.search);
+  // 返回指定参数的值
+  return searchParams.get(paramName);
+};
+
+onMounted(() => {
+  // 获取url中tab参数的值
+  const tabParam = getUrlParam('tab');
+  if (tabParam) {
+    activeTab.value = /^\d+$/.test(tabParam) ? Number(tabParam) : tabParam;
+  } else {
+    activeTab.value = 0;
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+.pg-evaluate {
+  background-color: #fafafa;
+  color: #333;
+}
+</style>
diff --git a/src/views/Jyh/ProductServices/ProductServices3/ModBanner.vue b/src/views/Jyh/ProductServices/ProductServices3/ModBanner.vue
index 14b3551..3bbafa1 100644
--- a/src/views/Jyh/ProductServices/ProductServices3/ModBanner.vue
+++ b/src/views/Jyh/ProductServices/ProductServices3/ModBanner.vue
@@ -1,41 +1,102 @@
 <template>
   <div class="mod-banner">
-    <div class="txt xCenter"><p class="zh wow animated" style="visibility: visible;">透视黑盒，溯源无忧</p></div>
+    <div class="banner-container">
+      <div class="txt-content wow fadejinzhiInUp">
+        <h1 class="zh-title">软件供应链检测平台 (源链)</h1>
+        <p class="en-desc">
+          透视黑盒，溯源无忧
+        </p>
+        <a href="javascript:void(0);" class="action-btn">
+          了解研究方向
+        </a>
+      </div>
+    </div>
   </div>
 </template>
 
-<script>
-export default {
-  name: "ModBanner"
-}
+<script setup>
+// 使用 script setup 语法
 </script>
 
-<style scoped>
-.pg-evaluate .mod-banner {
-  background: #eceded url(@/assets/v3/banner.DfCkZ1gw.png) no-repeat 100%;
-  background-size: auto 100%;
-  height: 460px;
-  position: relative
+<style scoped lang="scss">
+.mod-banner {
+  /* 背景图替换为 image_b14311.jpg，使用 cover 确保全屏覆盖 */
+  background: #001529 url('@/assets/v3/bj11.png') no-repeat center center;
+  background-size: cover;
+  height: 520px; /* 增加高度以匹配大屏视觉 */
+  position: relative;
+  display: flex;
+  align-items: center; /* 垂直居中内容 */
+  overflow: hidden;
+
+  /* 增加一个深色遮罩，确保文字更清晰（可选） */
+  &::before {
+    content: '';
+    position: absolute;
+    top: 0; left: 0; right: 0; bottom: 0;
+    background: linear-gradient(90deg, rgba(0, 21, 41, 0.4) 0%, transparent 100%);
+    z-index: 1;
+  }
 }
 
-.pg-evaluate .mod-banner .txt {
-  left: 50%;
-  position: absolute;
-  top: 177px;
-  width: 1292px
+.banner-container {
+  width: 100%;
+  max-width: 1400px;
+  margin: 0 auto;
+  padding: 0 40px;
+  position: relative;
+  z-index: 2; /* 位于遮罩层上方 */
 }
 
-.pg-evaluate .mod-banner .txt .zh {
-  font-size: 40px;
-  font-style: normal;
-  font-weight: 400;
-  letter-spacing: 1px;
-  line-height: 56px;
-  text-align: left
+.txt-content {
+  max-width: 800px;
+  color: #ffffff;
+  text-align: left;
 }
 
-.xCenter {
-  -webkit-transform: translate(-50%);
-  transform: translate(-50%);
+.zh-title {
+  font-size: 48px; /* 增大字号 */
+  font-weight: 700;
+  line-height: 1.3;
+  letter-spacing: 2px;
+  margin-bottom: 24px;
+  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
+}
+
+.en-desc {
+  font-size: 18px;
+  color: rgba(255, 255, 255, 0.85);
+  line-height: 1.6;
+  margin-bottom: 40px;
+  font-weight: 300;
+  letter-spacing: 0.5px;
+}
+
+/* 红色操作按钮：完全还原 image_932d00.jpg 风格 */
+.action-btn {
+  display: inline-block;
+  background-color: #C8161D;
+  color: #ffffff;
+  padding: 12px 32px;
+  font-size: 16px;
+  font-weight: 500;
+  text-decoration: none;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  border: 1px solid transparent;
+
+  &:hover {
+    background-color: #A01218;
+    box-shadow: 0 4px 15px rgba(200, 22, 29, 0.4);
+    transform: translateY(-2px);
+  }
+}
+
+/* 响应式适配 */
+@media (max-width: 768px) {
+  .mod-banner { height: 400px; }
+  .zh-title { font-size: 32px; }
+  .en-desc { font-size: 14px; }
+  .banner-container { padding: 0 20px; }
 }
 </style>
diff --git a/src/views/Jyh/ProductServices/ProductServices3/index.vue b/src/views/Jyh/ProductServices/ProductServices3/index.vue
index 168089d..6c7aed3 100644
--- a/src/views/Jyh/ProductServices/ProductServices3/index.vue
+++ b/src/views/Jyh/ProductServices/ProductServices3/index.vue
@@ -1,8 +1,13 @@
 <template>
-  <div class="pg-evaluate">
-    <ModBanner />
-    <ModTabs :defaultTab="activeTab" />
-    <ModTotal />
+
+  <div class="secondEdition">
+    <div class="product-content pg-evaluate">
+      <ModBanner />
+      <div  class="component-box">
+        <Product3 />
+      </div>
+      <ModTotal />
+    </div>
   </div>
 </template>
 
@@ -11,6 +16,10 @@ import { ref, onMounted } from 'vue';
 import ModBanner from './ModBanner.vue';
 import ModTabs from './ModTabs.vue';
 import ModTotal from './ModTotal.vue';
+import Product1 from '@/views/Jyh/Home/component/ComProject/product1.vue'
+import Product2 from '@/views/Jyh/Home/component/ComProject/product2.vue'
+import Product3 from '@/views/Jyh/Home/component/ComProject/product3.vue'
+import Product4 from '@/views/Jyh/Home/component/ComProject/product4.vue'
 
 const activeTab = ref<string | number>('');
 
@@ -34,7 +43,7 @@ onMounted(() => {
 </script>
 
 <style lang="scss" scoped>
-.pg-evaluate {
+.product-content {
   background-color: #fafafa;
   color: #333;
 }
diff --git a/src/views/Jyh/ProductServices/ProductServices3/indexOld.vue b/src/views/Jyh/ProductServices/ProductServices3/indexOld.vue
new file mode 100644
index 0000000..168089d
--- /dev/null
+++ b/src/views/Jyh/ProductServices/ProductServices3/indexOld.vue
@@ -0,0 +1,41 @@
+<template>
+  <div class="pg-evaluate">
+    <ModBanner />
+    <ModTabs :defaultTab="activeTab" />
+    <ModTotal />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import ModBanner from './ModBanner.vue';
+import ModTabs from './ModTabs.vue';
+import ModTotal from './ModTotal.vue';
+
+const activeTab = ref<string | number>('');
+
+// 解析URL参数的方法
+const getUrlParam = (paramName: string): string | null => {
+  // 获取当前URL的查询参数
+  const searchParams = new URLSearchParams(window.location.search);
+  // 返回指定参数的值
+  return searchParams.get(paramName);
+};
+
+onMounted(() => {
+  // 获取url中tab参数的值
+  const tabParam = getUrlParam('tab');
+  if (tabParam) {
+    activeTab.value = /^\d+$/.test(tabParam) ? Number(tabParam) : tabParam;
+  } else {
+    activeTab.value = 0;
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+.pg-evaluate {
+  background-color: #fafafa;
+  color: #333;
+}
+</style>
diff --git a/src/views/Jyh/ProductServices/ProductServices4/ModBanner.vue b/src/views/Jyh/ProductServices/ProductServices4/ModBanner.vue
index e1b9a3d..91301d9 100644
--- a/src/views/Jyh/ProductServices/ProductServices4/ModBanner.vue
+++ b/src/views/Jyh/ProductServices/ProductServices4/ModBanner.vue
@@ -1,41 +1,102 @@
 <template>
   <div class="mod-banner">
-    <div class="txt xCenter"><p class="zh wow animated" style="visibility: visible;">守护终端，运行无界</p></div>
+    <div class="banner-container">
+      <div class="txt-content wow fadejinzhiInUp">
+        <h1 class="zh-title">智能终端安全监测平台 (源端)</h1>
+        <p class="en-desc">
+          守护终端，运行无界
+        </p>
+        <a href="javascript:void(0);" class="action-btn">
+          了解研究方向
+        </a>
+      </div>
+    </div>
   </div>
 </template>
 
-<script>
-export default {
-  name: "ModBanner"
-}
+<script setup>
+// 使用 script setup 语法
 </script>
 
-<style scoped>
-.pg-evaluate .mod-banner {
-  background: #eceded url(@/assets/v3/banner.DfCkZ1gw.png) no-repeat 100%;
-  background-size: auto 100%;
-  height: 460px;
-  position: relative
+<style scoped lang="scss">
+.mod-banner {
+  /* 背景图替换为 image_b14311.jpg，使用 cover 确保全屏覆盖 */
+  background: #001529 url('@/assets/v3/bj11.png') no-repeat center center;
+  background-size: cover;
+  height: 520px; /* 增加高度以匹配大屏视觉 */
+  position: relative;
+  display: flex;
+  align-items: center; /* 垂直居中内容 */
+  overflow: hidden;
+
+  /* 增加一个深色遮罩，确保文字更清晰（可选） */
+  &::before {
+    content: '';
+    position: absolute;
+    top: 0; left: 0; right: 0; bottom: 0;
+    background: linear-gradient(90deg, rgba(0, 21, 41, 0.4) 0%, transparent 100%);
+    z-index: 1;
+  }
 }
 
-.pg-evaluate .mod-banner .txt {
-  left: 50%;
-  position: absolute;
-  top: 177px;
-  width: 1292px
+.banner-container {
+  width: 100%;
+  max-width: 1400px;
+  margin: 0 auto;
+  padding: 0 40px;
+  position: relative;
+  z-index: 2; /* 位于遮罩层上方 */
 }
 
-.pg-evaluate .mod-banner .txt .zh {
-  font-size: 40px;
-  font-style: normal;
-  font-weight: 400;
-  letter-spacing: 1px;
-  line-height: 56px;
-  text-align: left
+.txt-content {
+  max-width: 800px;
+  color: #ffffff;
+  text-align: left;
 }
 
-.xCenter {
-  -webkit-transform: translate(-50%);
-  transform: translate(-50%);
+.zh-title {
+  font-size: 48px; /* 增大字号 */
+  font-weight: 700;
+  line-height: 1.3;
+  letter-spacing: 2px;
+  margin-bottom: 24px;
+  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
+}
+
+.en-desc {
+  font-size: 18px;
+  color: rgba(255, 255, 255, 0.85);
+  line-height: 1.6;
+  margin-bottom: 40px;
+  font-weight: 300;
+  letter-spacing: 0.5px;
+}
+
+/* 红色操作按钮：完全还原 image_932d00.jpg 风格 */
+.action-btn {
+  display: inline-block;
+  background-color: #C8161D;
+  color: #ffffff;
+  padding: 12px 32px;
+  font-size: 16px;
+  font-weight: 500;
+  text-decoration: none;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  border: 1px solid transparent;
+
+  &:hover {
+    background-color: #A01218;
+    box-shadow: 0 4px 15px rgba(200, 22, 29, 0.4);
+    transform: translateY(-2px);
+  }
+}
+
+/* 响应式适配 */
+@media (max-width: 768px) {
+  .mod-banner { height: 400px; }
+  .zh-title { font-size: 32px; }
+  .en-desc { font-size: 14px; }
+  .banner-container { padding: 0 20px; }
 }
 </style>
diff --git a/src/views/Jyh/ProductServices/ProductServices4/index.vue b/src/views/Jyh/ProductServices/ProductServices4/index.vue
index 168089d..8886715 100644
--- a/src/views/Jyh/ProductServices/ProductServices4/index.vue
+++ b/src/views/Jyh/ProductServices/ProductServices4/index.vue
@@ -1,8 +1,13 @@
 <template>
-  <div class="pg-evaluate">
-    <ModBanner />
-    <ModTabs :defaultTab="activeTab" />
-    <ModTotal />
+
+  <div class="secondEdition">
+    <div class="product-content pg-evaluate">
+      <ModBanner />
+      <div  class="component-box">
+        <Product4 />
+      </div>
+      <ModTotal />
+    </div>
   </div>
 </template>
 
@@ -11,6 +16,10 @@ import { ref, onMounted } from 'vue';
 import ModBanner from './ModBanner.vue';
 import ModTabs from './ModTabs.vue';
 import ModTotal from './ModTotal.vue';
+import Product1 from '@/views/Jyh/Home/component/ComProject/product1.vue'
+import Product2 from '@/views/Jyh/Home/component/ComProject/product2.vue'
+import Product3 from '@/views/Jyh/Home/component/ComProject/product3.vue'
+import Product4 from '@/views/Jyh/Home/component/ComProject/product4.vue'
 
 const activeTab = ref<string | number>('');
 
@@ -34,7 +43,7 @@ onMounted(() => {
 </script>
 
 <style lang="scss" scoped>
-.pg-evaluate {
+.product-content {
   background-color: #fafafa;
   color: #333;
 }
diff --git a/src/views/Jyh/ProductServices/ProductServices4/indexOld.vue b/src/views/Jyh/ProductServices/ProductServices4/indexOld.vue
new file mode 100644
index 0000000..168089d
--- /dev/null
+++ b/src/views/Jyh/ProductServices/ProductServices4/indexOld.vue
@@ -0,0 +1,41 @@
+<template>
+  <div class="pg-evaluate">
+    <ModBanner />
+    <ModTabs :defaultTab="activeTab" />
+    <ModTotal />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import ModBanner from './ModBanner.vue';
+import ModTabs from './ModTabs.vue';
+import ModTotal from './ModTotal.vue';
+
+const activeTab = ref<string | number>('');
+
+// 解析URL参数的方法
+const getUrlParam = (paramName: string): string | null => {
+  // 获取当前URL的查询参数
+  const searchParams = new URLSearchParams(window.location.search);
+  // 返回指定参数的值
+  return searchParams.get(paramName);
+};
+
+onMounted(() => {
+  // 获取url中tab参数的值
+  const tabParam = getUrlParam('tab');
+  if (tabParam) {
+    activeTab.value = /^\d+$/.test(tabParam) ? Number(tabParam) : tabParam;
+  } else {
+    activeTab.value = 0;
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+.pg-evaluate {
+  background-color: #fafafa;
+  color: #333;
+}
+</style>
diff --git a/src/views/Jyh/ProductServices/index.vue b/src/views/Jyh/ProductServices/index.vue
index aa47c6e..ef76a35 100644
--- a/src/views/Jyh/ProductServices/index.vue
+++ b/src/views/Jyh/ProductServices/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="pg-evaluate">
     <ModBanner />
-    <ModTabs :defaultTab="activeTab" />
+    <ModContent />
     <ModTotal />
   </div>
 </template>
@@ -9,28 +9,9 @@
 <script setup lang="ts">
 import { ref, onMounted } from 'vue';
 import ModBanner from './ModBanner.vue';
-import ModTabs from './ModTabs.vue';
+import ModContent from './ModContent.vue';
 import ModTotal from './ModTotal.vue';
 
-const activeTab = ref<string | number>('');
-
-// 解析URL参数的方法
-const getUrlParam = (paramName: string): string | null => {
-  // 获取当前URL的查询参数
-  const searchParams = new URLSearchParams(window.location.search);
-  // 返回指定参数的值
-  return searchParams.get(paramName);
-};
-
-onMounted(() => {
-  // 获取url中tab参数的值
-  const tabParam = getUrlParam('tab');
-  if (tabParam) {
-    activeTab.value = /^\d+$/.test(tabParam) ? Number(tabParam) : tabParam;
-  } else {
-    activeTab.value = '1';
-  }
-});
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/views/Jyh/ProductServices/indexOld.vue b/src/views/Jyh/ProductServices/indexOld.vue
new file mode 100644
index 0000000..aa47c6e
--- /dev/null
+++ b/src/views/Jyh/ProductServices/indexOld.vue
@@ -0,0 +1,41 @@
+<template>
+  <div class="pg-evaluate">
+    <ModBanner />
+    <ModTabs :defaultTab="activeTab" />
+    <ModTotal />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import ModBanner from './ModBanner.vue';
+import ModTabs from './ModTabs.vue';
+import ModTotal from './ModTotal.vue';
+
+const activeTab = ref<string | number>('');
+
+// 解析URL参数的方法
+const getUrlParam = (paramName: string): string | null => {
+  // 获取当前URL的查询参数
+  const searchParams = new URLSearchParams(window.location.search);
+  // 返回指定参数的值
+  return searchParams.get(paramName);
+};
+
+onMounted(() => {
+  // 获取url中tab参数的值
+  const tabParam = getUrlParam('tab');
+  if (tabParam) {
+    activeTab.value = /^\d+$/.test(tabParam) ? Number(tabParam) : tabParam;
+  } else {
+    activeTab.value = '1';
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+.pg-evaluate {
+  background-color: #fafafa;
+  color: #333;
+}
+</style>