Tcode平台改造升级-态势感知中心页面开发及菜单栏展示修改

This commit is contained in:
fmk1023
2025-12-09 18:12:33 +08:00
parent d72546c81b
commit c249b9d70f
3 changed files with 223 additions and 448 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 573 KiB

View File

@@ -1,246 +1,3 @@
<!--<template>-->
<!-- <div class="comHeader">-->
<!-- <div class="nav"><a aria-current="page" href="/" class="router-link-active router-link-exact-active logo"><img-->
<!-- src="@/assets/imgs/logo3.png" alt="Tcode"></a>-->
<!-- <ul>-->
<!-- <li><a href="javascript:;" rel="noopener noreferrer" class="LNK">知攻善防</a>-->
<!-- <div class="nav-hover hover-product">-->
<!-- <div data-v-bc7d8fb8="" class="menu-zh">-->
<!-- <div data-v-bc7d8fb8="" class="menu-row menu-row1">-->
<!-- <div data-v-bc7d8fb8="" class="menu-row-title">单点安全建设</div>-->
<!-- <div data-v-bc7d8fb8="" class="menu-row-items">-->
<!-- <div data-v-bc7d8fb8="" class="menu-section"><span data-v-bc7d8fb8=""-->
<!-- class="menu-section-title">事前防御</span><h4-->
<!-- data-v-bc7d8fb8="" class="item-tit">安全开发</h4>-->
<!-- <ul data-v-bc7d8fb8="" class="hover-child">-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/evaluate" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-yh"></i> 代码审计服务 </a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/evaluate?tab=4"-->
<!-- class="LNK"><i data-v-bc7d8fb8="" class="ico-yh"></i>-->
<!-- 上线前安全评估渗透测试服务 </a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/codeinsight" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-yh"></i> 智能静态应用程序安全测试系统慧鉴 </a></li>-->
<!-- </ul>-->
<!-- <h4 data-v-bc7d8fb8="" class="item-tit">安全能力提升</h4>-->
<!-- <ul data-v-bc7d8fb8="" class="hover-child">-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/training" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-mz"></i> 人才培训与能力提升</a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/training" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-mz"></i> CTF 办赛与培训</a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/evaluate" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-mz"></i> 红蓝军建设服务</a></li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- <div data-v-bc7d8fb8="" class="menu-section"><span data-v-bc7d8fb8="" class="menu-section-title">脆弱暴露评估</span>-->
<!-- <ul data-v-bc7d8fb8="" class="hover-child">-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/xray" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> 风险评估系统洞鉴 <i data-v-bc7d8fb8="" class="ico-zn2"></i></a>-->
<!-- </li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/cloudatlas" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> 资产暴露面运营管理云图 <i data-v-bc7d8fb8="" class="ico-zn2"></i></a>-->
<!-- </li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/alioth" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> 安全验证平台御衡</a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/xblade" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> 自动化渗透测试平台无锋</a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/aigc" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-yh"></i> 大模型系统安全评估服务</a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/evaluate" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-yh"></i> 风险评估服务</a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/evaluate?tab=3"-->
<!-- class="LNK"><i data-v-bc7d8fb8="" class="ico-yh"></i>-->
<!-- 互联网渗透测试服务</a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/defend" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-yh"></i> 安全验证服务</a></li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- <div data-v-bc7d8fb8="" class="menu-section"><span data-v-bc7d8fb8="" class="menu-section-title">网络边界防护</span>-->
<!-- <ul data-v-bc7d8fb8="" class="hover-child">-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/safeline" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> Web 应用防火墙雷池 <i data-v-bc7d8fb8=""-->
<!-- class="ico-zn"></i></a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/safeline" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> Web 应用与 API 防护雷池 <i data-v-bc7d8fb8=""-->
<!-- class="ico-zn"></i></a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/tanswer" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> 流量威胁检测响应系统全悉 <i data-v-bc7d8fb8="" class="ico-zn"></i></a>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- <div data-v-bc7d8fb8="" class="menu-section"><span data-v-bc7d8fb8="" class="menu-section-title">入侵检测防御</span>-->
<!-- <ul data-v-bc7d8fb8="" class="hover-child">-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/dsensor" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> 主动威胁欺骗防御系统谛听 <i data-v-bc7d8fb8="" class="ico-zn2"></i></a>-->
<!-- </li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/evaluate" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> 日志审计 </a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/evaluate" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> 数据库审计 </a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/training?tab=5"-->
<!-- class="LNK"><i data-v-bc7d8fb8="" class="ico-yh"></i>-->
<!-- 沙盘推演服务</a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/evaluate?tab=6"-->
<!-- class="LNK"><i data-v-bc7d8fb8="" class="ico-yh"></i>-->
<!-- 攻防演练服务</a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/defend?tab=2"-->
<!-- class="LNK"><i data-v-bc7d8fb8="" class="ico-yh"></i>-->
<!-- 勒索病毒演练服务</a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/defend?tab=3"-->
<!-- class="LNK"><i data-v-bc7d8fb8="" class="ico-yh"></i>-->
<!-- 邮件钓鱼演练服务</a></li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- <div data-v-bc7d8fb8="" class="menu-section"><span data-v-bc7d8fb8="" class="menu-section-title">主机应用防护</span>-->
<!-- <h4 data-v-bc7d8fb8="" class="item-tit">主机与终端防护</h4>-->
<!-- <ul data-v-bc7d8fb8="" class="hover-child">-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/cloudwalker" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> 云工作负载保护平台牧云</a></li>-->
<!-- </ul>-->
<!-- <h4 data-v-bc7d8fb8="" class="item-tit">应用防护</h4>-->
<!-- <ul data-v-bc7d8fb8="" class="hover-child">-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/enterprise" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> 网站监测</a></li>-->
<!-- <li data-v-bc7d8fb8="" class="child-item"><a data-v-bc7d8fb8="" href="/enterprise" class="LNK"><i-->
<!-- data-v-bc7d8fb8="" class="ico-dp"></i> 网页防篡改</a></li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div data-v-bc7d8fb8="" class="menu-row menu-row2">-->
<!-- <div data-v-bc7d8fb8="" class="menu-row-title">智能运营平台</div>-->
<!-- <div data-v-bc7d8fb8="" class="menu-row-content">-->
<!-- <div data-v-bc7d8fb8="" class="content1"><a data-v-bc7d8fb8="" href="/cosmos" class="link-item"><img-->
<!-- data-v-bc7d8fb8="" src="https://www.chaitin.cn/_nuxt/3.B1j6TFrJ.png"><span data-v-bc7d8fb8="">安全分析与运营管理平台万象</span></a><a-->
<!-- data-v-bc7d8fb8="" href="/mssSafe" class="link-item"><img data-v-bc7d8fb8=""-->
<!-- src="https://www.chaitin.cn/_nuxt/3.B1j6TFrJ.png"><span-->
<!-- data-v-bc7d8fb8="">MSS安全托管服务大观</span></a><a data-v-bc7d8fb8="" href="/insight"-->
<!-- class="link-item"><img data-v-bc7d8fb8=""-->
<!-- src="https://www.chaitin.cn/_nuxt/3.B1j6TFrJ.png"><span-->
<!-- data-v-bc7d8fb8="">风险运营管理平台鉴微</span></a><a data-v-bc7d8fb8="" href="/training?tab=4"-->
<!-- class="link-item"><img data-v-bc7d8fb8=""-->
<!-- src="https://www.chaitin.cn/_nuxt/3.B1j6TFrJ.png"><span-->
<!-- data-v-bc7d8fb8="">网络安全实训平台墨攻</span></a></div>-->
<!-- <div data-v-bc7d8fb8="" class="content2"><a data-v-bc7d8fb8="" href="/chaitinAI"-->
<!-- class="link-item"><span-->
<!-- data-v-bc7d8fb8="">安全模型平台问津</span></a></div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>&lt;!&ndash;&ndash;&gt;</li>-->
<!-- <li><a href="javascript:;" rel="noopener noreferrer" class="LNK">智能安全</a>-->
<!-- <div class="nav-hover hover-product hover-product2 EN" style="left: 266px;">-->
<!-- <div class="product-list">-->
<!-- <div class="plist">-->
<!-- <div class="list-item">-->
<!-- <ul>-->
<!-- <li class="hover-item"><a href="javascript:;" rel="noopener noreferrer" class="LNK">AI 赋能安全</a><h4-->
<!-- class="item-tit">攻击入侵平台</h4>-->
<!-- <ul class="hover-child">-->
<!-- <li class="child-item"><a href="/xblade" class="LNK"><i class="ico-dp"></i> AI 自动化渗透测试平台无锋-->
<!-- </a></li>-->
<!-- </ul>-->
<!-- <h4 class="item-tit">安全建设平台</h4>-->
<!-- <ul class="hover-child">-->
<!-- <li class="child-item"><a href="/insight" class="LNK"><i class="ico-dp"></i> AI 风险运营管理平台鉴微-->
<!-- </a></li>-->
<!-- <li class="child-item"><a href="/cosmos" class="LNK"><i class="ico-dp"></i> AI 安全分析与运营管理平台万象-->
<!-- </a></li>-->
<!-- <li class="child-item"><a href="/chaitinAI" class="LNK"><i class="ico-dp"></i> AI 安全运营大模型平台问津-->
<!-- </a></li>-->
<!-- </ul>-->
<!-- </li>-->
<!-- <li class="hover-item"><a href="javascript:;" rel="noopener noreferrer" class="LNK">AI 自身安全</a><h4-->
<!-- class="item-tit">代码安全</h4>-->
<!-- <ul class="hover-child">-->
<!-- <li class="child-item"><a href="/codeinsight" class="LNK"><i class="ico-dp"></i>-->
<!-- 智能静态应用程序安全测试系统慧鉴 </a></li>-->
<!-- <li class="child-item"><a href="/codeforce" class="LNK"><i class="ico-dp"></i> 智能开发与安全一体化平台码力-->
<!-- </a></li>-->
<!-- </ul>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>&lt;!&ndash;&ndash;&gt;</li>-->
<!-- <li><a href="/solutions" class="LNK">解决方案</a></li>-->
<!-- <li><a href="javascript:;" rel="noopener noreferrer" class="LNK">资源中心</a>-->
<!-- <div class="nav-hover">-->
<!-- <ul>-->
<!-- <li class="hover-item">-->
<!-- <ul class="hover-child">-->
<!-- <li class="child-item"><a target="_self" class="LNK" href="/showcase">客户案例</a>&lt;!&ndash;&ndash;&gt;</li>-->
<!-- <li class="child-item"><a target="_self" class="LNK" href="/reports">资料下载</a>&lt;!&ndash;&ndash;&gt;</li>-->
<!-- <li class="child-item"><a target="_blank" class="LNK" href="https://stack.chaitin.com/vuldb/index">漏洞检测</a>-->
<!-- &lt;!&ndash;&ndash;&gt;</li>-->
<!-- <li class="child-item"><a target="_blank" class="LNK" href="https://stack.chaitin.com/techblog/index">技术博客</a>-->
<!-- &lt;!&ndash;&ndash;&gt;</li>-->
<!-- </ul>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- </li>-->
<!-- <li><a href="javascript:;" rel="noopener noreferrer" class="LNK">合作伙伴</a>-->
<!-- <div class="nav-hover">-->
<!-- <ul>-->
<!-- <li class="hover-item">-->
<!-- <ul class="hover-child">-->
<!-- <li class="child-item"><a target="_blank" class="LNK" href="https://wanzhong.chaitin.cn">万众平台</a>-->
<!-- &lt;!&ndash;&ndash;&gt;</li>-->
<!-- <li class="child-item"><a target="_blank" class="LNK" href="https://bbs.chaitin.cn">CT TALK - -->
<!-- 伙伴技术社区</a>&lt;!&ndash;&ndash;&gt;</li>-->
<!-- </ul>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- </li>-->
<!-- <li><a href="/intro" class="LNK">关于我们</a>-->
<!-- <div class="nav-hover">-->
<!-- <ul>-->
<!-- <li class="hover-item">-->
<!-- <ul class="hover-child">-->
<!-- <li class="child-item">&lt;!&ndash;&ndash;&gt;<a href="/intro" class="LNK">公司介绍</a></li>-->
<!-- <li class="child-item"><a target="_self" class="LNK" href="/news">新闻动态</a>&lt;!&ndash;&ndash;&gt;</li>-->
<!-- <li class="child-item"><a target="_blank" class="LNK"-->
<!-- href="https://app.mokahr.com/campus-recruitment/chaitin">加入我们</a>&lt;!&ndash;&ndash;&gt;-->
<!-- </li>-->
<!-- <li class="child-item">&lt;!&ndash;&ndash;&gt;<a href="/contact-us" class="LNK">联系我们</a></li>-->
<!-- </ul>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- </li>-->
<!-- <li><a href="javascript:;" rel="noopener noreferrer" class="LNK">Tcode站点</a>-->
<!-- <div class="nav-hover">-->
<!-- <ul>-->
<!-- <li class="hover-item">-->
<!-- <ul class="hover-child">-->
<!-- <li class="child-item"><a target="_blank" class="LNK" href="https://rivers.chaitin.cn">Tcode百川云</a>-->
<!-- &lt;!&ndash;&ndash;&gt;</li>-->
<!-- <li class="child-item"><a target="_blank" class="LNK" href="https://baizhi.cloud">Tcode百智云</a>&lt;!&ndash;&ndash;&gt;-->
<!-- </li>-->
<!-- <li class="child-item"><a target="_blank" class="LNK" href="https://wanzhong.chaitin.cn">万众平台</a>-->
<!-- &lt;!&ndash;&ndash;&gt;</li>-->
<!-- <li class="child-item"><a target="_blank" class="LNK" href="https://stack.chaitin.com">CT Stack-->
<!-- 安全社区</a>&lt;!&ndash;&ndash;&gt;</li>-->
<!-- <li class="child-item"><a target="_blank" class="LNK" href="https://bbs.chaitin.cn">CT TALK - -->
<!-- 伙伴技术社区</a>&lt;!&ndash;&ndash;&gt;</li>-->
<!-- <li class="child-item"><a target="_blank" class="LNK" href="https://xray.cool">Xray 社区</a>&lt;!&ndash;&ndash;&gt;</li>-->
<!-- </ul>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- <div class="promo">-->
<!-- <ul>-->
<!-- <li><a class="LNK" href="javascript:;" @click="handleLogin('register')">注册</a></li>-->
<!-- <li><a class="LNK" href="javascript:;" @click="handleLogin('login')">登录</a></li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- </div>-->
<!--</template>-->
<template>
<div class="comHeader">
<div class="nav">
@@ -249,89 +6,30 @@
</a>
<ul>
<li><router-link to="/" class="LNK router-link-exact-active router-link-active">首页</router-link></li>
<li>
<router-link to="/" class="LNK router-link-exact-active router-link-active">首页</router-link>
</li>
<li>
<a href="javascript:;" rel="noopener noreferrer" class="LNK">产品服务</a>
<div class="nav-hover hover-product">
<div data-v-bc7d8fb8="" class="menu-zh">
<!-- 第一行主标题 + 3个核心模块复用menu-row1样式 -->
<div data-v-bc7d8fb8="" class="menu-row menu-row1">
<!-- 左侧垂直标题复用原有渐变背景+垂直文字样式 -->
<div data-v-bc7d8fb8="" class="menu-row-title">全栈式开源安全检测与治理工具链</div>
<!-- 右侧模块容器复用menu-row-items Flex布局 -->
<div data-v-bc7d8fb8="" class="menu-row-items">
<div class="menu-zh">
<div class="menu-row menu-row1">
<div class="menu-row-title">全栈式开源安全检测与治理工具链</div>
<div class="menu-row-items">
<!-- 模块1SBOM 自动化分析 -->
<div data-v-bc7d8fb8="" class="menu-section">
<span data-v-bc7d8fb8="" class="menu-section-title">SBOM 自动化分析</span>
<!-- <h4 data-v-bc7d8fb8="" class="item-tit">安全开发</h4>-->
<ul data-v-bc7d8fb8="" class="hover-child">
<li data-v-bc7d8fb8="" class="child-item">
<a data-v-bc7d8fb8="" href="javascript:;" class="LNK"><i data-v-bc7d8fb8="" class="ico-yh"></i>生成标准 CycloneDX/SPDX 物料清单透视组件资产</a>
<div v-for="(item, index) in coreModules" :key="index" class="menu-section">
<span class="menu-section-title">{{item.title}}</span>
<ul class="hover-child">
<li class="child-item">
<a href="javascript:;" class="LNK"><i class="ico-yh"></i>{{item.desc1}} {{item.desc2}}</a>
</li>
<li data-v-bc7d8fb8="" class="child-item">
<a data-v-bc7d8fb8="" href="javascript:;" class="LNK">
了解详情 &gt;</a>
<li class="child-item">
<a href="javascript:;" class="LNK">
{{item.linkText}}</a>
</li>
</ul>
</div>
<!-- 模块2供应链漏洞检测分析 -->
<div data-v-bc7d8fb8="" class="menu-section">
<span data-v-bc7d8fb8="" class="menu-section-title">供应链漏洞检测分析</span>
<ul data-v-bc7d8fb8="" class="hover-child">
<li data-v-bc7d8fb8="" class="child-item">
<a data-v-bc7d8fb8="" href="javascript:;" class="LNK"><i data-v-bc7d8fb8="" class="ico-yh"></i>深度解析依赖树精准定位 CVE 漏洞与传播路径</a>
</li>
<li data-v-bc7d8fb8="" class="child-item">
<a data-v-bc7d8fb8="" href="javascript:;" class="LNK">
了解详情 &gt;</a>
</li>
</ul>
</div>
<!-- 模块3恶意代码投毒检测 -->
<div data-v-bc7d8fb8="" class="menu-section">
<span data-v-bc7d8fb8="" class="menu-section-title">恶意代码投毒检测</span>
<ul data-v-bc7d8fb8="" class="hover-child">
<li data-v-bc7d8fb8="" class="child-item">
<a data-v-bc7d8fb8="" href="javascript:;" class="LNK"><i data-v-bc7d8fb8="" class="ico-yh"></i>识别依赖混淆组件篡改及后门植入攻击</a>
</li>
<li data-v-bc7d8fb8="" class="child-item">
<a data-v-bc7d8fb8="" href="javascript:;" class="LNK">
了解详情 &gt;</a>
</li>
</ul>
</div>
</div>
</div>
<!-- 第二行补充2个模块 -->
<div data-v-bc7d8fb8="" class="menu-row menu-row2">
<div data-v-bc7d8fb8="" class="menu-row-title">核心能力延伸</div>
<div data-v-bc7d8fb8="" class="menu-row-content product-content-row2">
<div data-v-bc7d8fb8="" class="content1 content1-custom-layout">
<a data-v-bc7d8fb8="" :href="item.link" class="link-item LNK product-link-card"
v-for="(item, index) in coreModules.slice(3)" :key="'mod-2-' + index">
<span data-v-bc7d8fb8="" class="link-item-title">
<strong>{{ item.title }}</strong>
</span>
<div data-v-bc7d8fb8="" class="link-item-body">
<p class="card-desc-row2">
{{ item.desc1 }}<br>
{{ item.desc2 }}
</p>
<span data-v-bc7d8fb8="" class="link-item-link">{{ item.linkText }}</span>
</div>
</a>
<div data-v-bc7d8fb8="" class="link-item link-item-placeholder"></div>
<div data-v-bc7d8fb8="" class="link-item link-item-placeholder"></div>
</div>
<div data-v-bc7d8fb8="" class="content2 content2-hidden"></div>
</div>
</div>
</div>
@@ -339,123 +37,101 @@
<!---->
</li>
<li><router-link to="/solutions" class="LNK">解决方案 <i class="ico-arrow-down"></i></router-link>
<!-- <div class="nav-hover">-->
<!-- <ul class="hover-child">-->
<!-- <li class="child-item"><a href="/solutions/industry1" class="LNK">行业解决方案 1</a></li>-->
<!-- <li class="child-item"><a href="/solutions/industry2" class="LNK">行业解决方案 2</a></li>-->
<!-- </ul>-->
<!-- </div>-->
<li>
<router-link to="/solutions" class="LNK">解决方案 <i class="ico-arrow-down"></i></router-link>
</li>
<li><a href="javascript:;" class="LNK">数据服务 <i class="ico-arrow-down"></i></a>
<div class="nav-hover hover-product hover-product2 EN" style="left: 200px;">
<div data-v-bc7d8fb8="" class="menu-row-title">核心安全数据要素服务</div>
<div class="product-list">
<div class="plist">
<div class="list-item">
<ul>
<!-- 漏洞数据库 -->
<li class="hover-item">
<router-link to="/VulnerabilityDatabase" rel="noopener noreferrer" class="LNK">🗄 漏洞数据库</router-link>
<h4 class="item-tit">标准化漏洞查询</h4>
<ul class="hover-child">
<li class="child-item"><a href="javascript:;" target="_blank" class="LNK">聚合 NVD/CNNVD/OSV 数据提供标准化漏洞详情查询</a></li>
<li class="child-item child-item-2"><router-link to="/VulnerabilityDatabase" class="LNK"><i class="ico-dp"></i> [ 查询漏洞 > ]</router-link></li>
</ul>
</li>
<!-- 威胁情报库 -->
<li class="hover-item">
<a href="javascript:;" rel="noopener noreferrer" class="LNK">🧠 威胁情报库</a>
<h4 class="item-tit">实时情报推送</h4>
<ul class="hover-child">
<li class="child-item"><a href="javascript:;" target="_blank" class="LNK">实时推送 CISA KEV 列表及供应链攻击情报 IOC</a></li>
<li class="child-item child-item-2"><router-link to="/ThreatIntelligence" class="LNK"><i class="ico-dp"></i> [ 订阅情报 > ]</router-link></li>
</ul>
</li>
<!-- 安全事件中心 -->
<li class="hover-item">
<a href="javascript:;" rel="noopener noreferrer" class="LNK">🚨 安全事件中心</a>
<h4 class="item-tit">事件复盘分析</h4>
<ul class="hover-child">
<li class="child-item"><a href="javascript:;" target="_blank" class="LNK">全球重大开源安全事件历史档案与复盘分析</a></li>
<li class="child-item child-item-2"><router-link to="/News" class="LNK"><i class="ico-dp"></i> [ 查看事件 > ]</router-link></li>
</ul>
</li>
</ul>
<li>
<a href="javascript:;" rel="noopener noreferrer" class="LNK">数据服务 <i class="ico-arrow-down"></i></a>
<div class="nav-hover hover-product">
<div class="menu-zh">
<div class="menu-row menu-row1">
<div class="menu-row-title">核心安全数据要素服务</div>
<div class="menu-row-items">
<!-- 循环渲染数据服务模块 -->
<div
v-for="(item, index) in dataServiceModules"
:key="index"
class="menu-section"
>
<span class="menu-section-title">{{item.icon}} {{item.title}}</span>
<ul class="hover-child">
<li class="child-item">
<a href="javascript:;" class="LNK"><i class="ico-yh"></i>{{item.desc}}</a>
</li>
<li class="child-item">
<router-link
:to="item.link"
class="LNK"
>
<i class="ico-dp"></i> {{item.linkText}}
</router-link>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</li>
<li><router-link to="/Situation" class="LNK">态势感知中心 <i class="ico-arrow-down"></i></router-link>
<!-- <div class="nav-hover">-->
<!-- <ul class="hover-child">-->
<!-- <li class="child-item"><a href="/awareness/dashboard" class="LNK">实时态势面板</a></li>-->
<!-- </ul>-->
<!-- </div>-->
<li>
<router-link to="/Situation" class="LNK">态势感知中心 <i class="ico-arrow-down"></i></router-link>
</li>
<li><router-link to="/pricing" class="LNK">定价</router-link></li>
<li>
<router-link to="/pricing" class="LNK">定价</router-link>
</li>
<li><a href="javascript:;" class="LNK">开源服务专区 <i class="ico-arrow-down"></i></a>
<div class="nav-hover hover-product hover-product2 EN" style="left: 400px;">
<div data-v-bc7d8fb8="" class="menu-row-title">全栈式开源安全检测与治理工具链</div>
<div class="product-list">
<div class="plist">
<div class="list-item">
<ul>
<!-- 创新资助计划 -->
<li class="hover-item">
<a href="javascript:;" rel="noopener noreferrer" class="LNK">💰 创新资助计划</a>
<h4 class="item-tit">助力生态孵化</h4>
<ul class="hover-child">
<li class="child-item"><a href="https://zzjh.org.cn/#/" target="_blank" class="LNK">为潜力开源项目提供资金支持助力生态孵化 </a></li>
<li class="child-item child-item-2"><a href="https://zzjh.org.cn/#/" target="_blank" class="LNK"><i class="ico-dp"></i> [ 申请资助 > ]</a></li>
</ul>
</li>
<!-- 开源安全奖励计划 -->
<li class="hover-item">
<a href="http://222.20.126.217:9700/#/" target="_blank" rel="noopener noreferrer" class="LNK">🏆 开源安全奖励计划</a>
<h4 class="item-tit">提升社区安全性</h4>
<ul class="hover-child">
<li class="child-item"><a target="_blank" href="http://222.20.126.217:9700/#/" class="LNK">悬赏发现开源组件漏洞的白帽黑客提升社区安全性</a></li>
<li class="child-item child-item-2"><a target="_blank" href="http://222.20.126.217:9700/#/" class="LNK"><i class="ico-dp"></i> [ 提交漏洞 > ]</a></li>
</ul>
</li>
<!-- 网络安全众测平台 -->
<li class="hover-item">
<a href="javascript:;" rel="noopener noreferrer" class="LNK">👥 网络安全众测平台</a>
<h4 class="item-tit">汇聚社区力量</h4>
<ul class="hover-child">
<li class="child-item"><a href="javascript:;" class="LNK">汇聚社区力量进行产品安全众测与代码审计</a></li>
<li class="child-item child-item-2"><a href="javascript:;" class="LNK"><i class="ico-dp"></i> [ 参与众测 > ]</a></li>
</ul>
</li>
<!-- 靶场互联平台 -->
<li class="hover-item">
<a href="javascript:;" rel="noopener noreferrer" class="LNK">🎯 靶场互联平台</a>
<h4 class="item-tit">实战演练培训</h4>
<ul class="hover-child">
<li class="child-item"><a href="javascript:;" class="LNK">模拟真实攻防环境提供实战演练与技能培训</a></li>
<li class="child-item child-item-2"><a href="javascript:;" class="LNK"><i class="ico-dp"></i> [ 进入靶场 > ]</a></li>
</ul>
</li>
</ul>
<li>
<a href="javascript:;" rel="noopener noreferrer" class="LNK">开源服务专区 <i class="ico-arrow-down"></i></a>
<div class="nav-hover hover-product">
<div class="menu-zh">
<div class="menu-row menu-row1">
<div class="menu-row-title">全栈式开源安全检测与治理工具链</div>
<div class="menu-row-items">
<!-- 循环渲染开源服务专区模块 -->
<div
v-for="(item, index) in openSourceServiceModules"
:key="index"
class="menu-section"
>
<span class="menu-section-title">{{item.icon}} {{item.title}}</span>
<ul class="hover-child">
<li class="child-item">
<a
:href="item.descLink"
:target="item.isExternal ? '_blank' : '_self'"
class="LNK"
>
<i class="ico-yh"></i>{{item.desc}}
</a>
</li>
<li class="child-item">
<a
:href="item.operateLink"
:target="item.isExternal ? '_blank' : '_self'"
class="LNK"
>
<i class="ico-dp"></i> {{item.operateText}}
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</li>
<li><router-link to="/intro" class="LNK">关于我们 <i class="ico-arrow-down"></i></router-link>
<!-- <div class="nav-hover">-->
<!-- <ul class="hover-child">-->
<!-- <li class="child-item"><a href="/about/intro" class="LNK">公司介绍</a></li>-->
<!-- <li class="child-item"><a href="/about/contact" class="LNK">联系我们</a></li>-->
<!-- </ul>-->
<!-- </div>-->
<li>
<router-link to="/intro" class="LNK">关于我们 <i class="ico-arrow-down"></i></router-link>
<!-- <div class="nav-hover">-->
<!-- <ul class="hover-child">-->
<!-- <li class="child-item"><a href="/about/intro" class="LNK">公司介绍</a></li>-->
<!-- <li class="child-item"><a href="/about/contact" class="LNK">联系我们</a></li>-->
<!-- </ul>-->
<!-- </div>-->
</li>
</ul>
</div>
@@ -514,6 +190,68 @@ const coreModules = reactive([
},
]);
const dataServiceModules = reactive([
{
icon: "🗄️",
title: "漏洞数据库",
desc: "聚合 NVD/CNNVD/OSV 数据,提供标准化漏洞详情查询。",
link: "/VulnerabilityDatabase",
linkText: "[ 查询漏洞 > ]"
},
{
icon: "🧠",
title: "威胁情报库",
desc: "实时推送 CISA KEV 列表及供应链攻击情报 IOC。",
link: "/ThreatIntelligence",
linkText: "[ 订阅情报 > ]"
},
{
icon: "🚨",
title: "安全事件中心",
desc: "全球重大开源安全事件历史档案与复盘分析。",
link: "/News",
linkText: "[ 查看事件 > ]"
}
]);
const openSourceServiceModules = reactive([
{
icon: "💰",
title: "创新资助计划",
desc: "为潜力开源项目提供资金支持,助力生态孵化。",
descLink: "https://zzjh.org.cn/#/",
operateText: "[ 申请资助 > ]",
operateLink: "https://zzjh.org.cn/#/",
isExternal: true // 外链,打开新窗口
},
{
icon: "🏆",
title: "开源安全奖励计划",
desc: "悬赏发现开源组件漏洞的白帽黑客,提升社区安全性。",
descLink: "http://222.20.126.217:9700/#/",
operateText: "[ 提交漏洞 > ]",
operateLink: "http://222.20.126.217:9700/#/",
isExternal: true // 外链,打开新窗口
},
{
icon: "👥",
title: "网络安全众测平台",
desc: "汇聚社区力量进行产品安全众测与代码审计。",
descLink: "javascript:;",
operateText: "[ 参与众测 > ]",
operateLink: "javascript:;",
isExternal: false // 内部链接,当前窗口
},
{
icon: "🎯",
title: "靶场互联平台",
desc: "模拟真实攻防环境,提供实战演练与技能培训。",
descLink: "javascript:;",
operateText: "[ 进入靶场 > ]",
operateLink: "javascript:;",
isExternal: false // 内部链接,当前窗口
}
]);
const handleLogin = (type) => {
emitEvent('login', {type, triggerType: '主动注册'});
};
@@ -1185,7 +923,7 @@ const handleLogin = (type) => {
}
.menu-zh[data-v-bc7d8fb8] {
.menu-zh {
background: #040705;
-webkit-box-shadow: 0 2px 16px rgba(0, 0, 0, .06);
box-shadow: 0 2px 16px #0000000f;
@@ -1199,13 +937,13 @@ const handleLogin = (type) => {
row-gap: 20px
}
.menu-zh[data-v-bc7d8fb8], .menu-zh .menu-row[data-v-bc7d8fb8], .menu-zh .menu-row .menu-row-title[data-v-bc7d8fb8] {
.menu-zh, .menu-zh .menu-row, .menu-zh .menu-row .menu-row-title {
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
.menu-zh .menu-row .menu-row-title[data-v-bc7d8fb8] {
.menu-zh .menu-row .menu-row-title {
color: #fff;
font-size: 13px;
padding: 20px 0;
@@ -1223,7 +961,7 @@ const handleLogin = (type) => {
width: 60px
}
.menu-zh .menu-row .menu-row-items[data-v-bc7d8fb8] {
.menu-zh .menu-row .menu-row-items {
-webkit-column-gap: 10px;
-moz-column-gap: 10px;
column-gap: 10px;
@@ -1234,14 +972,15 @@ const handleLogin = (type) => {
width: 100%
}
.menu-zh .menu-row .menu-row-items .menu-section[data-v-bc7d8fb8] {
.menu-zh .menu-row .menu-row-items .menu-section {
background-color: #15210f;
border: 1px solid #23e98e;
padding: 0 0 20px;
width: 20%
//width: 20%
flex: 1;
}
.menu-zh .menu-row .menu-row-items .menu-section .item-tit[data-v-bc7d8fb8] {
.menu-zh .menu-row .menu-row-items .menu-section .item-tit {
color: #00e07b;
font-size: 12px;
line-height: 18px;
@@ -1251,7 +990,7 @@ const handleLogin = (type) => {
white-space: normal
}
.menu-zh .menu-row .menu-row-items .menu-section .item-tit[data-v-bc7d8fb8]:before {
.menu-zh .menu-row .menu-row-items .menu-section .item-tit:before {
background-color: #00e07b;
content: "";
height: 100%;
@@ -1261,17 +1000,17 @@ const handleLogin = (type) => {
width: 2px
}
.menu-zh .menu-row .menu-row-items .menu-section .item-tit[data-v-bc7d8fb8], .menu-zh .menu-row .menu-row-items .menu-section > ul[data-v-bc7d8fb8] {
.menu-zh .menu-row .menu-row-items .menu-section .item-tit, .menu-zh .menu-row .menu-row-items .menu-section > ul {
margin: 0 20px
}
.menu-zh .menu-row .menu-row-items .menu-section .hover-child a[data-v-bc7d8fb8] {
.menu-zh .menu-row .menu-row-items .menu-section .hover-child a {
color: #dcdbde;
font-size: 12px;
line-height: 18px
}
.menu-zh .menu-row .menu-row-items .menu-section .menu-section-title[data-v-bc7d8fb8] {
.menu-zh .menu-row .menu-row-items .menu-section .menu-section-title {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
@@ -1291,11 +1030,11 @@ const handleLogin = (type) => {
text-align: center
}
.menu-zh .menu-row.menu-row2 .menu-row-title[data-v-bc7d8fb8] {
.menu-zh .menu-row.menu-row2 .menu-row-title {
background: linear-gradient(135deg, #ffcd68, #fe682d)
}
.menu-zh .menu-row.menu-row2 .menu-row-content[data-v-bc7d8fb8] {
.menu-zh .menu-row.menu-row2 .menu-row-content {
background-color: #2d1d08;
border: 1px solid #ffa24b;
margin-left: 10px;
@@ -1303,7 +1042,7 @@ const handleLogin = (type) => {
width: 100%
}
.menu-zh .menu-row.menu-row2 .menu-row-content .link-item[data-v-bc7d8fb8] {
.menu-zh .menu-row.menu-row2 .menu-row-content .link-item {
background: linear-gradient(135deg, #442e10, #44230c);
color: #dcdbde;
font-size: 12px;
@@ -1315,7 +1054,7 @@ const handleLogin = (type) => {
margin: 7px .5% 0
}
.menu-zh .menu-row.menu-row2 .menu-row-content .content1[data-v-bc7d8fb8] {
.menu-zh .menu-row.menu-row2 .menu-row-content .content1 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
@@ -1328,7 +1067,7 @@ const handleLogin = (type) => {
justify-content: space-between
}
.menu-zh .menu-row.menu-row2 .menu-row-content .content1 .link-item[data-v-bc7d8fb8] {
.menu-zh .menu-row.menu-row2 .menu-row-content .content1 .link-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
@@ -1341,16 +1080,16 @@ const handleLogin = (type) => {
font-weight: 500
}
.menu-zh .menu-row.menu-row2 .menu-row-content .content1 .link-item img[data-v-bc7d8fb8] {
.menu-zh .menu-row.menu-row2 .menu-row-content .content1 .link-item img {
height: 14px;
width: 14px
}
.menu-zh .menu-row.menu-row2 .menu-row-content .content2[data-v-bc7d8fb8] {
.menu-zh .menu-row.menu-row2 .menu-row-content .content2 {
padding: 15px
}
.menu-zh .menu-row.menu-row2 .menu-row-content .content2[data-v-bc7d8fb8], .menu-zh .menu-row.menu-row2 .menu-row-content .content2 .link-item[data-v-bc7d8fb8] {
.menu-zh .menu-row.menu-row2 .menu-row-content .content2, .menu-zh .menu-row.menu-row2 .menu-row-content .content2 .link-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
@@ -1362,7 +1101,7 @@ const handleLogin = (type) => {
justify-content: center
}
.menu-zh .menu-row.menu-row2 .menu-row-content .content2 .link-item[data-v-bc7d8fb8] {
.menu-zh .menu-row.menu-row2 .menu-row-content .content2 .link-item {
background-color: #ffe5c8;
-webkit-column-gap: 10px;
-moz-column-gap: 10px;
@@ -1372,7 +1111,7 @@ const handleLogin = (type) => {
padding-right: 0
}
.menu-zh .menu-row.menu-row2 .menu-row-content .content2 .splitter[data-v-bc7d8fb8] {
.menu-zh .menu-row.menu-row2 .menu-row-content .content2 .splitter {
color: #fee4c4;
font-size: 18px;
letter-spacing: 8px;
@@ -1451,21 +1190,42 @@ const handleLogin = (type) => {
}
.hover-product2 {
//.menu-row-title {
// color: #fff;
// font-size: 18px;
// padding: 20px 0;
// /*writing-mode: vertical-rl;*/
// align-items: center;
// -webkit-box-pack: center;
// -ms-flex-pack: center;
// background: linear-gradient(135deg, #22e68b, #008d35);
// justify-content: center;
// letter-spacing: 8px;
// padding: 10px;
// margin: 0 16px 0 14px;
// text-align: center;
// /*width: 60px;*/
//}
.menu-row-title {
color: #fff;
font-size: 18px;
font-size: 13px;
padding: 20px 0;
/*writing-mode: vertical-rl;*/
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
background: linear-gradient(135deg, #22e68b, #008d35);
justify-content: center;
letter-spacing: 8px;
padding: 10px;
margin: 0 16px 0 14px;
text-align: center;
/*width: 60px;*/
width: 60px;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
</style>

View File

@@ -8,14 +8,20 @@
:autoplay="{ delay: 3000, disableOnInteraction: false }"
:speed="800"
>
<swiper-slide class="slide" @click="handleSlideClick('page1')">
<swiper-slide class="slide bigscreen3" @click="handleSlideClick('kxky')">
<div class="slide-content">
<h2>可信开源态势感知中心</h2>
<p>携手共建安全新生态</p>
</div>
</swiper-slide>
<swiper-slide class="slide bigscreen2" @click="handleSlideClick('page1')">
<div class="slide-content">
<h2>全球开源风险态势感知监控中心</h2>
<p>金银湖实验室与您共同成长</p>
</div>
<!-- <iframe src="http://222.20.126.217:10010/bigScreen/#/security-situation-awareness" style="height: 100%;width: 100%"></iframe>-->
</swiper-slide>
<swiper-slide class="slide" @click="handleSlideClick('page2')">
<swiper-slide class="slide bigscreen1" @click="handleSlideClick('page2')">
<div class="slide-content">
<h2>开源生态与贡献价值全景</h2>
<p>携手共建安全新生态</p>
@@ -43,6 +49,9 @@ const handleSlideClick = (pageType) => {
case 'page2':
window.open('http://222.20.126.217:10010/bigScreen/#/ecosystem-and-contribution');
break;
case 'kxky':
window.open('http://222.20.126.217:10010/bigScreen/#/kxky');
break;
default:
break;
}
@@ -70,13 +79,19 @@ const handleSlideClick = (pageType) => {
display: flex;
align-items: center;
justify-content: center;
background: url(@/assets/v3/bigscreen/bigscreen1.png) center/cover no-repeat;
/*background: url(@/assets/v3/bigscreen/bigscreen1.png) center/cover no-repeat;*/
cursor: pointer;
}
.slide:nth-child(2) {
.bigscreen1 {
background: url(@/assets/v3/bigscreen/bigscreen1.png) center/cover no-repeat;
}
.bigscreen2 {
background: url(@/assets/v3/bigscreen/bigscreen2.png) center/cover no-repeat;
}
.bigscreen3 {
background: url(@/assets/v3/bigscreen/bigscreen3.png) center/cover no-repeat;
}
.slide-content {
text-align: center;