|
Before Width: | Height: | Size: 3.4 MiB After Width: | Height: | Size: 3.4 MiB |
|
Before Width: | Height: | Size: 519 KiB After Width: | Height: | Size: 520 KiB |
|
Before Width: | Height: | Size: 95 KiB After Width: | Height: | Size: 96 KiB |
BIN
src/assets/v3/Line/1-1.png
Normal file
|
After Width: | Height: | Size: 175 KiB |
BIN
src/assets/v3/Line/1-3.png
Normal file
|
After Width: | Height: | Size: 125 KiB |
BIN
src/assets/v3/Line/1-5.png
Normal file
|
After Width: | Height: | Size: 116 KiB |
BIN
src/assets/v3/Line/1-6.jpg
Normal file
|
After Width: | Height: | Size: 3.9 MiB |
BIN
src/assets/v3/Line/1-7.jpg
Normal file
|
After Width: | Height: | Size: 161 KiB |
BIN
src/assets/v3/Line/1.png
Normal file
|
After Width: | Height: | Size: 166 KiB |
BIN
src/assets/v3/Line/sec10.png
Normal file
|
After Width: | Height: | Size: 681 KiB |
BIN
src/assets/v3/Line/sec11.png
Normal file
|
After Width: | Height: | Size: 192 KiB |
BIN
src/assets/v3/Line/sec2.png
Normal file
|
After Width: | Height: | Size: 1.3 MiB |
BIN
src/assets/v3/Line/sec3.jpeg
Normal file
|
After Width: | Height: | Size: 204 KiB |
BIN
src/assets/v3/Line/sec5.png
Normal file
|
After Width: | Height: | Size: 87 KiB |
BIN
src/assets/v3/Line/sec7.png
Normal file
|
After Width: | Height: | Size: 75 KiB |
BIN
src/assets/v3/bj11.png
Normal file
|
After Width: | Height: | Size: 1.3 MiB |
1283
src/components/Header/indexOld.vue
Normal file
@@ -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',
|
||||
|
||||
@@ -106,7 +106,7 @@ const changeTab = (index) => {
|
||||
padding: 18px 19px;
|
||||
margin: 0 10px;
|
||||
position: relative;
|
||||
font-size: 18px;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
@@ -24,7 +24,7 @@
|
||||
</div>
|
||||
|
||||
<div class="hadoopCode activeCode" :ref="(el) => setTargetRef(el, 'hadoop')">
|
||||
<img src="@/assets/v3/Line/taishi.png" alt="态势感知运行结果" class="activeImg">
|
||||
<img src="@/assets/v3/Line/sec2.png" alt="态势感知运行结果" class="activeImg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -34,10 +34,7 @@
|
||||
<div class="oneStop" :ref="(el) => setTargetRef(el, 'oneStop')" id="oneStop">
|
||||
<div class="oneStopContent">
|
||||
<div class="osLeftMain">
|
||||
<img src="@/assets/v3/Line/2-2-1.afd0f2f5.png" alt="" width="520px"class="osleftPosi">
|
||||
<img src="@/assets/v3/Line/2-2-head.5e69dbb2.png" alt="" width="213px"style="margin-left: -12px;">
|
||||
<img src="@/assets/v3/Line/2-2-2.26bc3301.png" alt="" width="653px"class="osleftPosi1">
|
||||
<img src="@/assets/v3/Line/2-2-3.6d6ce99c.png" alt="" width="367px" class="osleftPosi2">
|
||||
<img src="@/assets/v3/Line/sec3.jpeg" alt="" width="700px" class="osleftPosi">
|
||||
</div>
|
||||
<div class="osRightMain">
|
||||
<p class="osRightTitle">技术优势</p>
|
||||
@@ -64,11 +61,7 @@
|
||||
<b>d.实时风险预警与应急响应:</b>智能感知异常事件的人工分析与现场处置,可视化决策支持
|
||||
</div>
|
||||
<div class="highDoContent">
|
||||
<div><img src="@/assets/v3/Line/2-3-1.bcb33d47.png" alt="" width="794px">
|
||||
<div style="margin-bottom: 100px; margin-top: 25px; position: relative;"><img
|
||||
src="@/assets/v3/Line/2-3-2.57ef08ae.png" alt="" width="520px"></div>
|
||||
<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><img src="@/assets/v3/Line/sec10.png" alt="" width="1200px">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -96,11 +89,11 @@
|
||||
<b>风险感知服务:</b>态势大屏、情报推送、攻击面管理
|
||||
</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/sec5.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/sec11.png" alt=""
|
||||
width="614px"></div>
|
||||
<div>
|
||||
<p><b>数据定制服务:</b>情报订阅、深度分析、API对接<br><br>
|
||||
@@ -523,7 +516,7 @@ onUnmounted(() => {
|
||||
.secondEdition .secondEditionContent .multipleAnalyse {
|
||||
background: url(@/assets/v3/Line/2-4bg.45478d20.png) no-repeat 50%;
|
||||
background-size: cover;
|
||||
height: 710px;
|
||||
height: 850px;
|
||||
padding-left: 58px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -555,8 +548,8 @@ onUnmounted(() => {
|
||||
|
||||
.secondEdition .secondEditionContent .multipleAnalyse .maContent {
|
||||
height: 400px;
|
||||
width: 723px;
|
||||
background: url(@/assets/v3/Line/2-4-1.802eb322.png) no-repeat;
|
||||
width: 1000px;
|
||||
background: url(@/assets/v3/Line/sec7.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 26px 0;
|
||||
transition: 3s
|
||||
|
||||
@@ -23,7 +23,7 @@
|
||||
</div>
|
||||
|
||||
<div class="hadoopCode activeCode" :ref="(el) => setTargetRef(el, 'hadoop')">
|
||||
<img src="@/assets/v3/Line/damoxing.png" alt="金银湖安全大模型架构示意图" class="activeImg">
|
||||
<img src="@/assets/v3/Line/1.png" alt="金银湖安全大模型架构示意图" class="activeImg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -32,11 +32,11 @@
|
||||
|
||||
<div class="oneStop" :ref="(el) => setTargetRef(el, 'oneStop')" id="oneStop">
|
||||
<div class="oneStopContent">
|
||||
<div class="osLeftMain"><img src="@/assets/v3/Line/2-2-1.afd0f2f5.png" alt="" width="520px"
|
||||
<div class="osLeftMain"><img src="@/assets/v3/Line/1-1.png" alt="" width="520px"
|
||||
class="osleftPosi"><img src="@/assets/v3/Line/2-2-head.5e69dbb2.png" alt=""
|
||||
width="213px" style="margin-left: -12px;"><img
|
||||
src="@/assets/v3/Line/2-2-2.26bc3301.png" alt="" width="653px" class="osleftPosi1"><img
|
||||
src="@/assets/v3/Line/2-2-3.6d6ce99c.png" alt="" width="367px" class="osleftPosi2"></div>
|
||||
src="@/assets/v3/Line/1-3.png" alt="" width="653px" class="osleftPosi1"><img
|
||||
src="@/assets/v3/Line/1-5.png" alt="" width="367px" class="osleftPosi2"></div>
|
||||
<div class="osRightMain">
|
||||
<p class="osRightTitle">💡 创新亮点</p>
|
||||
|
||||
@@ -63,7 +63,7 @@
|
||||
<th class="headerCol">对比维度</th>
|
||||
<th class="highlightCol">金银湖安全大模型</th>
|
||||
<th>传统工具<br><span style="font-size: 14px; font-weight: 400;">(Fortify SCA、coverity等)</span></th>
|
||||
<th>类似大模型平台<br><span style="font-size: 14px; font-weight: 400;">(BiDeepSeek、ChatGPT等)</span></th>
|
||||
<th>类似大模型平台<br><span style="font-size: 14px; font-weight: 400;">(BiDeepSeek、Chat金银湖大模型等)</span></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@@ -149,11 +149,11 @@
|
||||
高敏捷型:互联网大厂、车联网、AI厂商等。
|
||||
</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/1-7.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/1-6" alt=""
|
||||
width="614px"></div>
|
||||
<div>
|
||||
<p class="halfsubTitle">
|
||||
|
||||
@@ -109,7 +109,7 @@ const adminFeatures = ref<FeatureRow[]>([
|
||||
{ name: 'SAML SSO', values: ['dash', 'dash', 'dash', 'check', 'check'] },
|
||||
{ name: '统一搜索', values: ['dash', 'dash', 'dash', 'check', 'check'] },
|
||||
{ name: '专属工作空间', values: ['dash', 'dash', 'dash', 'check', 'check'] },
|
||||
{ name: 'GPT 分析与管理', values: ['dash', 'dash', 'dash', 'check', 'check'] },
|
||||
{ name: '金银湖大模型 分析与管理', values: ['dash', 'dash', 'dash', 'check', 'check'] },
|
||||
{ name: '管理员控制台', values: ['dash', 'dash', 'dash', 'check', 'check'] },
|
||||
{ name: '批量成员管理', values: ['dash', 'dash', 'dash', 'check', 'check'] },
|
||||
{ name: '管理员角色', values: ['dash', 'dash', 'dash', 'check', 'check'] },
|
||||
@@ -141,13 +141,13 @@ const comparisonData = ref<FeatureSection[]>([
|
||||
{
|
||||
category: '模型',
|
||||
featureRows: [
|
||||
{ name: 'GPT-5', values: ['check', '扩展', '无限制*', '无限制*', '无限制*'] },
|
||||
{ name: 'GPT-5 Thinking', values: ['check', '扩展', '无限制*', '灵活**', '灵活**'] },
|
||||
{ name: 'GPT-5 pro', values: ['dash', 'dash', 'check', '灵活**', '灵活**'] },
|
||||
{ name: 'GPT-5 Thinking mini', values: ['check', '扩展', '无限制*', '灵活**', '灵活**'] },
|
||||
{ name: 'GPT-4o', values: ['dash', '标准', '无限制*', '无限制*', '无限制*'] },
|
||||
{ name: 'GPT-4.1', values: ['dash', '标准', '无限制*', '灵活**', '灵活**'] },
|
||||
{ name: 'GPT-4.5', values: ['dash', 'dash', 'check', 'dash', '灵活**'] },
|
||||
{ name: '金银湖大模型-5', values: ['check', '扩展', '无限制*', '无限制*', '无限制*'] },
|
||||
{ name: '金银湖大模型-5 Thinking', values: ['check', '扩展', '无限制*', '灵活**', '灵活**'] },
|
||||
{ name: '金银湖大模型-5 pro', values: ['dash', 'dash', 'check', '灵活**', '灵活**'] },
|
||||
{ name: '金银湖大模型-5 Thinking mini', values: ['check', '扩展', '无限制*', '灵活**', '灵活**'] },
|
||||
{ name: '金银湖大模型-4o', values: ['dash', '标准', '无限制*', '无限制*', '无限制*'] },
|
||||
{ name: '金银湖大模型-4.1', values: ['dash', '标准', '无限制*', '灵活**', '灵活**'] },
|
||||
{ name: '金银湖大模型-4.5', values: ['dash', 'dash', 'check', 'dash', '灵活**'] },
|
||||
{ name: 'OpenAI o3', values: ['dash', '标准', '无限制*', '灵活**', '灵活**'] },
|
||||
{ name: 'OpenAI o3 pro', values: ['dash', 'dash', '无限制*', 'dash', '灵活**'] },
|
||||
{ name: 'OpenAI o4-mini', values: ['dash', '无限制*', '无限制*', '灵活**', '灵活**'] },
|
||||
@@ -174,7 +174,7 @@ const comparisonData = ref<FeatureSection[]>([
|
||||
{ name: '搜索', values: ['check', 'check', 'check', 'check', 'check'] },
|
||||
{ name: 'Canvas', values: ['check', 'check', 'check', 'check', 'check'] },
|
||||
{ name: '在 macOS 上进行代码编辑', values: ['check', 'check', 'check', 'check', 'check'] },
|
||||
{ name: 'ChatGPT 副驾驶', values: ['dash', '带限制', 'check', 'check', 'check'] },
|
||||
{ name: 'Chat金银湖大模型 副驾驶', values: ['dash', '带限制', 'check', 'check', 'check'] },
|
||||
{ name: '项目', values: ['dash', 'dash', 'check', 'check', 'check'] },
|
||||
{ name: '共享链路', values: ['dash', 'dash', 'dash', 'check', 'check'] },
|
||||
{ name: '任务', values: ['dash', 'dash', 'check', 'check', 'check'] },
|
||||
@@ -183,11 +183,11 @@ const comparisonData = ref<FeatureSection[]>([
|
||||
{ name: '连接内部资源的浏览器', values: ['dash', 'check', 'check', 'check', 'check'] },
|
||||
{ name: '公司知识库', values: ['dash', 'dash', 'dash', 'check', 'check'] },
|
||||
{ name: '自定义 GCF(由选定的开发者人员提供)', values: ['dash', 'check', 'check', 'check', 'check'] },
|
||||
{ name: 'ChatGPT 考试模式', values: ['dash', 'check', 'check', 'check', 'check'] },
|
||||
{ name: 'Chat金银湖大模型 考试模式', values: ['dash', 'check', 'check', 'check', 'check'] },
|
||||
{ name: '文件上传', values: ['带限制', 'check', 'check', 'check', 'check'] },
|
||||
{ name: '发现并使用 GPT', values: ['dash', 'check', 'check', 'check', 'check'] },
|
||||
{ name: '创建和共享 GPT', values: ['dash', 'check', 'check', 'check', 'check'] },
|
||||
{ name: '与你的工作空间共享 GPT', values: ['dash', 'dash', 'check', 'check', 'check'] },
|
||||
{ name: '发现并使用 金银湖大模型', values: ['dash', 'check', 'check', 'check', 'check'] },
|
||||
{ name: '创建和共享 金银湖大模型', values: ['dash', 'check', 'check', 'check', 'check'] },
|
||||
{ name: '与你的工作空间共享 金银湖大模型', values: ['dash', 'dash', 'check', 'check', 'check'] },
|
||||
{ name: '测试新功能的机会', values: ['带限制', 'check', 'check', 'check', 'check'] },
|
||||
{ name: '图像生成', values: ['带限制', 'check', 'check', 'check', 'check'] },
|
||||
{ name: '交互式表格和图表', values: ['带限制', 'check', 'check', 'check', 'check'] },
|
||||
@@ -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;
|
||||
|
||||
@@ -31,15 +31,15 @@ const activeIndex = ref<number | null>(null);
|
||||
// FAQ 数据
|
||||
const faqItems = ref([
|
||||
{
|
||||
question: 'ChatGPT 如何定价?',
|
||||
answer: '每个人均可使用 ChatGPT 的免费版。付费套餐(Plus、Business 和 Enterprise 版本)按每个用户每月计算。Plus 和 Business 版本提供月度套餐,Business 和 Enterprise 版本提供年度套餐。',
|
||||
question: 'Chat金银湖大模型 如何定价?',
|
||||
answer: '每个人均可使用 Chat金银湖大模型 的免费版。付费套餐(Plus、Business 和 Enterprise 版本)按每个用户每月计算。Plus 和 Business 版本提供月度套餐,Business 和 Enterprise 版本提供年度套餐。',
|
||||
},
|
||||
{
|
||||
question: 'ChatGPT 是否免费使用?',
|
||||
answer: '是的,ChatGPT 免费版是永久免费的,但具有使用限制。付费套餐提供更多功能和更快的访问速度。'
|
||||
question: 'Chat金银湖大模型 是否免费使用?',
|
||||
answer: '是的,Chat金银湖大模型 免费版是永久免费的,但具有使用限制。付费套餐提供更多功能和更快的访问速度。'
|
||||
},
|
||||
{
|
||||
question: 'OpenAI 是否为教育机构提供 ChatGPT 套餐?',
|
||||
question: 'OpenAI 是否为教育机构提供 Chat金银湖大模型 套餐?',
|
||||
answer: '请联系我们的销售团队或访问教育相关页面了解针对教育机构的专属折扣和套餐信息。'
|
||||
},
|
||||
{
|
||||
@@ -55,11 +55,11 @@ const faqItems = ref([
|
||||
answer: '我们接受主流的信用卡付款。年度套餐和企业级套餐可能支持更多支付方式,请在结账页面查看详细信息。'
|
||||
},
|
||||
{
|
||||
question: 'ChatGPT 的安全性如何?',
|
||||
answer: 'ChatGPT 采取了严格的安全措施来保护用户数据和隐私。Business 和 Enterprise 版本提供了更高级别的安全和行政管理功能。'
|
||||
question: 'Chat金银湖大模型 的安全性如何?',
|
||||
answer: 'Chat金银湖大模型 采取了严格的安全措施来保护用户数据和隐私。Business 和 Enterprise 版本提供了更高级别的安全和行政管理功能。'
|
||||
},
|
||||
{
|
||||
question: 'ChatGPT 如何使用我的数据?',
|
||||
question: 'Chat金银湖大模型 如何使用我的数据?',
|
||||
answer: '在免费版和 Plus 版中,您有权选择是否允许内容用于训练模型。Business 和 Enterprise 版本默认不会将您的数据用于模型训练。'
|
||||
},
|
||||
]);
|
||||
|
||||
@@ -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>
|
||||
</header>
|
||||
|
||||
|
||||
<div class="title-group text-center mb-16">
|
||||
<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
|
||||
@@ -105,30 +116,30 @@ const plans = ref<Plan[]>([
|
||||
buttonText: '获取 Plus 版本',
|
||||
featuresTitle: '免费版中的全部内容,以及:',
|
||||
features: [
|
||||
'使用 GPT-4, GPT-4o, GPT-4o mini',
|
||||
'使用 金银湖大模型-4, 金银湖大模型-4o, 金银湖大模型-4o mini',
|
||||
'判断和上传的数据更高',
|
||||
'图片生成(DALL·E 3)',
|
||||
'更深入的记忆与高级数据分析功能',
|
||||
'记忆与上下文支持增强',
|
||||
'联网、语音和自定义 GPT',
|
||||
'联网、语音和自定义 金银湖大模型',
|
||||
'抢先体验新功能'
|
||||
],
|
||||
footerLink: '查看适用范围'
|
||||
},
|
||||
{
|
||||
name: 'Pro',
|
||||
description: '全面运用 ChatGPT 的最佳功能',
|
||||
description: '全面运用 Chat金银湖大模型 的最佳功能',
|
||||
price: 200,
|
||||
unit: '/月',
|
||||
buttonText: '获取 Pro 版本',
|
||||
featuresTitle: 'Plus 中的全部功能,以及:',
|
||||
features: [
|
||||
'使用 GPT-4o Pro 进行专业推理',
|
||||
'使用 金银湖大模型-4o Pro 进行专业推理',
|
||||
'判断和上传数据无上限',
|
||||
'无限制的高级图片生成',
|
||||
'深度思考和复杂任务的最大支持',
|
||||
'最大记忆与上下文支持',
|
||||
'扩展限制、任务和自定义 GPT',
|
||||
'扩展限制、任务和自定义 金银湖大模型',
|
||||
'o1 (原 o1-preview) 的高级推理能力',
|
||||
'扩展的代码解释器',
|
||||
'更深层的研究浏览'
|
||||
@@ -137,7 +148,7 @@ const plans = ref<Plan[]>([
|
||||
},
|
||||
{
|
||||
name: 'Business Free',
|
||||
description: 'A secure way to try ChatGPT at work',
|
||||
description: 'A secure way to try Chat金银湖大模型 at work',
|
||||
price: 0,
|
||||
unit: '/month',
|
||||
buttonText: 'Get Business Free',
|
||||
@@ -145,7 +156,7 @@ const plans = ref<Plan[]>([
|
||||
'Limited access to our best model for work',
|
||||
'Privacy built in; data never used for training',
|
||||
'Limited video and image creation',
|
||||
'Tools for teams like projects, custom GPTs',
|
||||
'Tools for teams like projects, custom 金银湖大模型s',
|
||||
'Unlimited collaborator invites',
|
||||
'Integration with select business apps'
|
||||
]
|
||||
@@ -158,11 +169,11 @@ const plans = ref<Plan[]>([
|
||||
buttonText: '购买订阅',
|
||||
featuresTitle: '包含 Plus 版套餐中的所有功能,并含:',
|
||||
features: [
|
||||
'无限制使用 GPT-4o 模型功能,并扩大使用 GPT-4 Turbo,以及对 GPT-4... 的访问',
|
||||
'无限制使用 金银湖大模型-4o 模型功能,并扩大使用 金银湖大模型-4 Turbo,以及对 金银湖大模型-4... 的访问',
|
||||
'企业级环境,提供更长久的历史记录与 Slack, Google Drive... 等工具集成',
|
||||
'安全的企业工作空间,拥有基本的管理控制、SAML SSO 和 MFA',
|
||||
'数据不会用于训练模型',
|
||||
'分享聊天、记录模式、Canvas、共享快捷指令和自定义工作区 GPT 等业务功能'
|
||||
'分享聊天、记录模式、Canvas、共享快捷指令和自定义工作区 金银湖大模型 等业务功能'
|
||||
],
|
||||
footerLink: '无限制、团队协作功能等,了解更多'
|
||||
},
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
215
src/views/Jyh/ProductServices/ModContent.vue
Normal file
@@ -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>
|
||||
@@ -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>
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
41
src/views/Jyh/ProductServices/ProductServices1/indexOld.vue
Normal file
@@ -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>
|
||||
@@ -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>
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
41
src/views/Jyh/ProductServices/ProductServices2/indexOld.vue
Normal file
@@ -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>
|
||||
@@ -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>
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
41
src/views/Jyh/ProductServices/ProductServices3/indexOld.vue
Normal file
@@ -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>
|
||||
@@ -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>
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
41
src/views/Jyh/ProductServices/ProductServices4/indexOld.vue
Normal file
@@ -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>
|
||||
@@ -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>
|
||||
|
||||
41
src/views/Jyh/ProductServices/indexOld.vue
Normal file
@@ -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>
|
||||
@@ -15,21 +15,21 @@
|
||||
<!-- <h2>可信开源态势感知中心</h2>-->
|
||||
<!-- <p>携手共建安全新生态</p>-->
|
||||
<!-- </div>-->
|
||||
<iframe src="http://localhost:8080/#/kxky" style="height: 100%;width: 100%" loading="lazy"></iframe>
|
||||
<iframe src="http://222.20.126.217:10010/bigScreen/#/kxky" style="height: 100%;width: 100%" loading="lazy"></iframe>
|
||||
</swiper-slide>
|
||||
<swiper-slide class="slide bigscreen2" @click="handleSlideClick('page1')">
|
||||
<!-- <div class="slide-content">-->
|
||||
<!-- <h2>全球开源风险态势感知监控中心</h2>-->
|
||||
<!-- <p>金银湖实验室与您共同成长</p>-->
|
||||
<!-- </div>-->
|
||||
<iframe src="http://localhost:8080/#/security-situation-awareness" style="height: 100%;width: 100%" loading="lazy"></iframe>
|
||||
<iframe src="http://222.20.126.217:10010/bigScreen/#/security-situation-awareness" style="height: 100%;width: 100%" loading="lazy"></iframe>
|
||||
</swiper-slide>
|
||||
<swiper-slide class="slide bigscreen1" @click="handleSlideClick('page2')">
|
||||
<!-- <div class="slide-content">-->
|
||||
<!-- <h2>开源生态与贡献价值全景</h2>-->
|
||||
<!-- <p>携手共建安全新生态</p>-->
|
||||
<!-- </div>-->
|
||||
<iframe src="http://localhost:8080/#/ecosystem-and-contribution" style="height: 100%;width: 100%" loading="lazy"></iframe>
|
||||
<iframe src="http://222.20.126.217:10010/bigScreen/#/ecosystem-and-contribution" style="height: 100%;width: 100%" loading="lazy"></iframe>
|
||||
</swiper-slide>
|
||||
</swiper>
|
||||
</div>
|
||||
|
||||
@@ -25,7 +25,7 @@ const data = ref([
|
||||
{ label: 'JupyterNotebook', value: 'JupyterNotebook' },
|
||||
{ label: 'Git', value: 'Git' },
|
||||
{ label: 'AI', value: 'AI' },
|
||||
{ label: 'ChatGPT LLM', value: 'ChatGPT LLM' }
|
||||
{ label: 'Chat金银湖大模型 LLM', value: 'Chat金银湖大模型 LLM' }
|
||||
]);
|
||||
</script>
|
||||
|
||||
|
||||