Merge branch 'dev' of https://gitee.com/fumk/open-repo_-portal into dev

src/components/Header/index.vue

@@ -14,7 +14,27 @@
           </li>
 
           <li><router-link to="/solutions" class="LNK">解决方案</router-link></li>
-          <li><router-link to="/data" class="LNK">数据服务</router-link></li>
+<!--          <li><router-link to="/data" class="LNK">数据服务</router-link></li>-->
+
+          <li class="has-submenu dropdown-trigger">
+            <router-link to="/data" class="LNK">数据服务</router-link>
+
+            <div class="dropdown-menu">
+              <div class="dropdown-inner">
+                <div v-for="(sub, idx) in dataSubMenus" :key="idx" class="dropdown-item" @click="router.push(sub.path)">
+                  <div class="item-icon">{{ sub.icon }}</div>
+                  <div class="item-content">
+                    <h4 class="item-title">{{ sub.title }}</h4>
+                    <p class="item-desc">{{ sub.desc }}</p>
+                    <router-link :to="sub.path"  class="item-link">
+                      <i class="ico-dp"></i> {{ sub.linkText }}
+                    </router-link>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </li>
+
           <li><router-link to="/Situation" class="LNK">态势感知中心</router-link></li>
           <li><router-link to="/pricing" class="LNK">定价</router-link></li>
           <li><router-link to="/intro" class="LNK">关于我们</router-link></li>
@@ -30,6 +50,30 @@
 import {ref, reactive} from 'vue';
 import {emitEvent} from "@/utils/eventBus";
 
+const dataSubMenus = [
+  {
+    icon: '🗄️',
+    title: '漏洞数据库',
+    desc: '聚合 NVD/CNNVD/OSV 数据，提供标准化漏洞详情查询。',
+    linkText: '[ 查询漏洞 > ]',
+    path: '/VulnerabilityDatabase'
+  },
+  {
+    icon: '🧠',
+    title: '威胁情报库',
+    desc: '实时推送 CISA KEV 列表及供应链攻击情报 IOC。',
+    linkText: '[ 订阅情报 > ]',
+    path: '/ThreatIntelligence'
+  },
+  {
+    icon: '🚨',
+    title: '安全事件中心',
+    desc: '全球重大开源安全事件历史档案与复盘分析。',
+    linkText: '[ 查看事件 > ]',
+    path: '/News'
+  }
+];
+
 const handleLogin = (type) => {
   emitEvent('login', {type, triggerType: '主动注册'});
 };
@@ -111,4 +155,90 @@ const handleLogin = (type) => {
     background: #A01218;
   }
 }
+
+
+.dropdown-trigger {
+  position: relative;
+
+  &:hover .dropdown-menu {
+    opacity: 1;
+    visibility: visible;
+    transform: translateY(0);
+  }
+}
+
+.dropdown-menu {
+  position: absolute;
+  top: 30px;
+  left: -130px;
+  transform: translateX(-50%) translateY(10px);
+  width: 320px;
+  background: #1a1a1a; /* 深色背景符合专业感 */
+  border-radius: 8px;
+  box-shadow: 0 10px 40px rgba(0,0,0,0.2);
+  opacity: 0;
+  visibility: hidden;
+  transition: all 0.3s ease;
+  z-index: 1001;
+  padding: 12px;
+
+  /* 顶部三角形箭头 */
+  &::before {
+    content: '';
+    position: absolute;
+    top: -6px; left: 50%;
+    transform: translateX(-50%);
+    border-left: 6px solid transparent;
+    border-right: 6px solid transparent;
+    border-bottom: 6px solid #1a1a1a;
+  }
+}
+
+.dropdown-item {
+  display: flex;
+  padding: 16px;
+  border-radius: 6px;
+  cursor: pointer;
+  transition: background 0.2s;
+  text-decoration: none;
+
+  &:hover {
+    background: #262626;
+
+    .item-title { color: #C8161D; }
+    .item-link { color: #C8161D; }
+  }
+}
+
+.item-icon {
+  font-size: 24px;
+  margin-right: 16px;
+  padding-top: 2px;
+}
+
+.item-content {
+  flex: 1;
+}
+
+.item-title {
+  margin: 0 0 6px 0;
+  color: #fff;
+  font-size: 15px;
+  font-weight: 600;
+  transition: color 0.2s;
+}
+
+.item-desc {
+  margin: 0 0 8px 0;
+  color: #999;
+  font-size: 12px;
+  line-height: 1.5;
+}
+
+.item-link {
+  font-size: 12px;
+  color: #666;
+  font-weight: 500;
+  transition: color 0.2s;
+}
 </style>

src/views/Jyh/Home/component/ComProject/product3.vue

@@ -33,10 +33,10 @@
     <div class="oneStop" :ref="(el) => setTargetRef(el, 'oneStop')" id="oneStop">
       <div class="oneStopContent">
         <div class="osLeftMain">
-          <img src="@/assets/v3/Line/jushu1.png" alt="技术优势图1" width="560px" class="osleftPosi">
+          <img src="@/assets/v3/Line/jishu4.png" alt="技术优势图4" width="500px" height="300px" class="img1">
-          <img src="@/assets/v3/Line/jushu2.png" alt="技术优势图2" width="240px" class="jushuCenter">
+          <!-- <img src="@/assets/v3/Line/jishu3.png" alt="技术优势图3" width="180px" class="img2"> -->
-          <img src="@/assets/v3/Line/jushu3.png" alt="技术优势图3" width="680px" class="osleftPosi1">
+          <img src="@/assets/v3/Line/jishu2.png" alt="技术优势图2" width="540px" height="350px" class="img3">
-          <img src="@/assets/v3/Line/jushu4.png" alt="技术优势图4" width="400px" class="osleftPosi2">
+          <img src="@/assets/v3/Line/jishu1.png" alt="技术优势图1" width="360px" height="300px" class="img4">
         </div>
         <div class="osRightMain">
           <p class="osRightTitle">💡 技术优势</p>
@@ -62,24 +62,20 @@
         <b>03.</b>以组件知识图谱与漏洞知识图谱为核心，构建影响软件版本节点与组件节点的关联，形成完整供应链知识图谱
       </div>
       <div class="highDoContent">
-        <div><img src="@/assets/v3/Line/2-3-1.bcb33d47.png" alt="" width="794px">
+        <div>
-          <div style="margin-bottom: 100px; margin-top: 25px; position: relative;"><img
+          <img src="@/assets/v3/Line/chuangxin1.png" alt="" width="600px">
-              src="@/assets/v3/Line/2-3-2.57ef08ae.png" alt="" width="520px"></div>
+          <img src="@/assets/v3/Line/chuangxin2.png" alt="" width="600px">
-          <img src="@/assets/v3/Line/2-3-3.52733627.png" alt="" width="427px" class="highImg2"><img
+         
-            src="@/assets/v3/Line/2-3-4.339b2f1c.png" alt="" width="413px" class="highImg1">
         </div>
       </div>
     </div>
 
     <div class="multipleAnalyse" :ref="(el) => setTargetRef(el, 'multipleAnalyse')" id="multipleAnalyse">
-      <span class="title">🎯 市场推广</span>
+      <span class="title">🎯 客户群体</span>
       <div class="maContent">
       </div>
 
-      <p class="desc">
+
-        <b>面向客户：</b>强合规型（能源、金融、运营商、政务/信创等）、高敏捷型（互联网大厂、车联网、AI厂商等）<br>
-        <b>收费模式：</b>订阅服务（定期按月/年支付费用，获取软件的使用权、更新和支持服务）、解决方案服务（一次性支付费用，满足定制化、高安全和完全内网部署需求）
-      </p>
     </div>
 
     <div class="multidimensional" style="opacity: 1">
@@ -93,12 +89,12 @@
               <b>包管理器SCA引擎：</b>针对常见包管理器（如npm、PyPI、Maven）的依赖分析引擎，自动识别组件及其版本
             </p>
           </div>
-          <div style="width: 820px; margin-left: 34px;"><img src="@/assets/v3/Line/2-6-1.302b729e.png" alt=""
+          <div style="width: 820px; margin-left: 34px;"><img src="@/assets/v3/Line/chanpin1.png" alt=""
               width="820px"></div>
         </div>
         <div class="multidimensinalPart">
-          <div style="width: 614px; margin-right: 40px;"><img src="@/assets/v3/Line/2-6-2.b262b91e.png" alt=""
+          <div style="width: 614px; margin-right: 40px;"><img src="@/assets/v3/Line/chanpin2.png" alt=""
-              width="614px"></div>
+              width="714px" class="wdsdsf"></div>
           <div>
             <p><b>C/C++ SCA引擎：</b>处理C/C++项目成分分析，支持源代码和编译依赖扫描<br><br>
               <b>二进制SCA引擎：</b>针对二进制文件分析，通过反编译和特征匹配识别成分和漏洞<br><br>
@@ -289,7 +285,7 @@ onUnmounted(() => {
   font-weight: 500;
   color: #fff;
   line-height: 36px;
-  margin-top: 90px
+  margin-top: 90px;
 }
 
 .secondEdition .secondEditionContent .hadoop .hadoopdesc {
@@ -311,20 +307,29 @@ onUnmounted(() => {
 }
 
 .secondEdition .secondEditionContent .oneStop .oneStopContent {
-  display: flex
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  justify-content: flex-start
 }
 
 .secondEdition .secondEditionContent .oneStop .oneStopContent .osLeftMain {
-  display: flex;
+  display: grid;
-  justify-content: flex-start;
+  grid-template-columns: 1fr 1fr;
-  align-items: flex-start;
+  grid-template-rows: 1fr 1fr;
+  gap: 15px;
   position: relative;
-  margin-bottom: 182px
+  margin-bottom: 182px;
+  margin-left: 290px;
+  width: 450px;
+  height: 320px;
+  flex-shrink: 0
 }
 
 .secondEdition .secondEditionContent .oneStop .oneStopContent .osRightMain {
-  margin-left: 22px;
+  margin-left: 30px;
-  text-align: left
+  text-align: left;
+  flex: 1
 }
 
 .secondEdition .secondEditionContent .oneStop .oneStopContent .osRightMain .osRightTitle {
@@ -336,7 +341,7 @@ onUnmounted(() => {
   background: -webkit-linear-gradient(112deg, #ff8b75, #dd2476);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
-  margin-top: 28px
+  margin-top: 0
 }
 
 .secondEdition .secondEditionContent .oneStop .oneStopContent .osRightMain p {
@@ -352,42 +357,74 @@ onUnmounted(() => {
   font-weight: 500
 }
 
-.secondEdition .secondEditionContent .oneStop .imgring,
+.secondEdition .secondEditionContent .oneStop .imgring {
-.secondEdition .secondEditionContent .oneStop .osleftPosi {
   transition: 3s;
   opacity: 0
 }
 
-.secondEdition .secondEditionContent .oneStop .osleftPosi1,
+.secondEdition .secondEditionContent .oneStop .osLeftMain img {
-.secondEdition .secondEditionContent .oneStop .osleftPosi2 {
-  position: absolute;
-  right: -200px;
-  top: 102px;
-  transition: 2s;
   opacity: 0;
+  transition: all 2s ease-out;
+  position: absolute;
+  border-radius: 8px;
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12)
+}
+
+.secondEdition .secondEditionContent .oneStop .osLeftMain .img1 {
+  left: -150px;
+  top: 10px;
   z-index: 1
 }
 
-.secondEdition .secondEditionContent .oneStop .osleftPosi2 {
+.secondEdition .secondEditionContent .oneStop .osLeftMain .img2 {
-  top: 317px;
+  right: -150px;
-  right: 10px;
+  top: 0;
-  transition: 2.5s;
+  z-index: 3;
-  z-index: 2
+  transition-delay: 0.3s
 }
 
-.secondEdition .secondEditionContent .oneStop.activeCode,
+.secondEdition .secondEditionContent .oneStop .osLeftMain .img3 {
-.secondEdition .secondEditionContent .oneStop.activeCode .osleftPosi,
+  left: -150px;
-.secondEdition .secondEditionContent .oneStop.activeCode .osleftPosi1,
+  bottom: -50px;
-.secondEdition .secondEditionContent .oneStop.activeCode .osleftPosi2 {
+  z-index: 2;
+  transition-delay: 0.2s
+}
+
+.secondEdition .secondEditionContent .oneStop .osLeftMain .img4 {
+  right: -150px;
+  bottom: 20px;
+  z-index: 4;
+  transition-delay: 0.4s
+}
+
+.secondEdition .secondEditionContent .oneStop.activeCode {
   opacity: 1
 }
 
-.secondEdition .secondEditionContent .oneStop.activeCode .osleftPosi1 {
+.secondEdition .secondEditionContent .oneStop.activeCode .osLeftMain img {
-  right: 10px
+  opacity: 1
 }
 
-.secondEdition .secondEditionContent .oneStop.activeCode .osleftPosi2 {
+.secondEdition .secondEditionContent .oneStop.activeCode .osLeftMain .img1 {
-  top: 217px
+  left: -190px;
+  top: 15px
+}
+
+.secondEdition .secondEditionContent .oneStop.activeCode .osLeftMain .img2 {
+  right: 30px;
+  top: 0
+}
+
+.secondEdition .secondEditionContent .oneStop.activeCode .osLeftMain .img3 {
+  left: -150px;
+  bottom: 15px;
+  top: 100px;
+}
+
+.secondEdition .secondEditionContent .oneStop.activeCode .osLeftMain .img4 {
+  right: 15px;
+  bottom: 20px;
+  top: 200px;
 }
 
 .secondEdition .secondEditionContent .oneStop.activeCode .imgring {
@@ -399,7 +436,8 @@ onUnmounted(() => {
 }
 
 .secondEdition .secondEditionContent .highDevops.activeCode .highDoContent img {
-  opacity: 1
+  opacity: 1;
+  padding-top:10px;
 }
 
 .secondEdition .secondEditionContent .highDevops.activeCode .highDoContent img.highImg1 {
@@ -550,13 +588,13 @@ onUnmounted(() => {
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   line-height: 50px;
-  margin-top: 20px
+  margin-top: -20px
 }
 
 .secondEdition .secondEditionContent .multipleAnalyse .maContent {
-  height: 400px;
+  height: 150px;
-  width: 723px;
+  width: 600px;
-  background: url(@/assets/v3/Line/2-4-1.802eb322.png) no-repeat;
+  background: url(@/assets/v3/Line/kehu.png) no-repeat;
   background-size: 100% 100%;
   margin: 26px 0;
   transition: 3s
@@ -628,7 +666,8 @@ onUnmounted(() => {
 
 .secondEdition .secondEditionContent .multidimensional .activeCode .multidimensinalPart img {
   left: 0;
-  opacity: 1
+  opacity: 1;
+  top:10
 }
 
 .secondEdition .secondEditionContent .multidimensional .activeCode .multidimensinalhalf img {
@@ -650,7 +689,7 @@ onUnmounted(() => {
   left: 620px;
   bottom: -20px;
   opacity: 0;
-  transition: 3s
+  transition: 3s;
 }
 
 .secondEdition .secondEditionContent .multidimensinalPart p {
@@ -729,7 +768,9 @@ onUnmounted(() => {
   transform: translateX(-50%);
   transition: top 0.3s ease-in-out;
 }
-
+.wdsdsf{
+  margin-left: -100px;
+}
 html li {
   list-style: none;
 }
@@ -796,7 +837,7 @@ video {
 
 .activeCode>img.activeImg {
   right: 0;
-  top: 0px;
+  top: 30px;
   opacity: 1;
   width: 705px;
   transition: 1s;

src/views/Jyh/Pricing/component/PricingComparisonTable.vue

@@ -257,7 +257,7 @@ const comparisonData = ref<FeatureSection[]>([
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  background-color: #000;
+  background-color: #BD2025;
   color: #fff;
   text-decoration: none;
   padding: 8px 16px;

src/views/Jyh/Pricing/index.vue

@@ -1,10 +1,21 @@
 <template>
   <div class="pricing">
     <div class="pricing-container">
-      <header class="page-header">
+
-        <h1 class="page-title">定价</h1>
+
-        <p class="page-subtitle">查看我们的个人、Business 和 Enterprise 套餐定价。</p>
+      <div class="title-group text-center mb-16">
-      </header>
+        <div class="flex justify-center items-center mb-6">
+          <div class="title-arrow-left"></div>
+          <h2 class="text-[36px] md:text-[42px] font-bold text-[#1a1a1a] px-6 tracking-tight">
+            定价
+          </h2>
+          <div class="title-arrow-right"></div>
+        </div>
+
+        <p class="text-[#888] text-[16px] leading-relaxed max-w-4xl mx-auto font-light">
+          查看我们的个人、Business 和 Enterprise 套餐定价。
+        </p>
+      </div>
 
       <div class="pricing-grid">
         <div
@@ -300,7 +311,7 @@ const plans = ref<Plan[]>([
 /* 按钮样式 */
 .action-btn {
   width: 100%;
-  background-color: #0d0d0d;
+  background-color: #BD2025;
   color: #fff;
   border: none;
   padding: 12px 16px;
@@ -316,7 +327,7 @@ const plans = ref<Plan[]>([
 }
 
 .action-btn:hover {
-  background-color: #333;
+  background-color: #BD2025;
 }
 
 .arrow-icon {
@@ -370,7 +381,7 @@ const plans = ref<Plan[]>([
 }
 
 .card-footer a, .page-footer-link a {
-  color: #0d0d0d;
+  color: #BD2025;
   text-decoration: underline;
   text-underline-offset: 2px;
 }
@@ -381,4 +392,30 @@ const plans = ref<Plan[]>([
   font-size: 0.875rem;
   color: #6e6e80;
 }
+
+/* 标题装饰三角形：严格对齐图片比例 */
+.title-arrow-left {
+  width: 0;
+  height: 0;
+  border-top: 10px solid transparent;
+  border-bottom: 10px solid transparent;
+  border-left: 14px solid #C8161D;
+}
+.title-arrow-right {
+  width: 0;
+  height: 0;
+  border-top: 10px solid transparent;
+  border-bottom: 10px solid transparent;
+  border-right: 14px solid #C8161D;
+}
+
+/* 字体优化 */
+h2, h3 {
+  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
+}
+
+p {
+  font-family: "PingFang SC", sans-serif;
+  letter-spacing: 0.02em;
+}
 </style>