Merge branch 'main' of https://git.opencomputing.cn/yumoqing/kboss
This commit is contained in:
ping
commit
d17712b4f6
@ -33,6 +33,10 @@ export default {
|
||||
viewMore: 'View More →',
|
||||
footerProducts: 'Products & Services',
|
||||
footerContact: 'Contact Us',
|
||||
footerAddress: 'Address',
|
||||
footerEmail: 'Email',
|
||||
footerTel: 'Tel',
|
||||
followOfficialAccount: 'Follow Official Account',
|
||||
onlineChat: 'Online Chat',
|
||||
solutionCards: {
|
||||
collaboration: {
|
||||
@ -164,7 +168,7 @@ export default {
|
||||
intro: {
|
||||
kicker: 'About Us',
|
||||
title: 'About Us',
|
||||
copyHtml: 'Open Computing AI takes <span class="copy-strong">"Make AI Everywhere, Make AI Easy"</span> as its mission. By empowering all industries through integrated technologies, we strive to become a world-leading operator of AI Agent services. The company focuses on key application scenarios including <span class="copy-strong">education & research, engineering & transportation, port & water utilities, energy & power, and life-science & healthcare</span>. We build full-stack AI solutions to drive the industrial intelligent transformation. As a Specialized, Refined, Differentiated and Innovative Enterprise, National High-Tech Enterprise, Tech-Based SME and Innovative SME, the company has obtained ISO 9001, ISO 27001 and ISO 28000 certifications. In 2026, it was selected as one of Forbes China’s AI Commercial Implementation Demonstration Enterprises. We have established in-depth cooperation with top-tier institutions such as Peking University Science and Technology Park (PKUSTP), Zhongguancun NCMatch, Inspur Yunzhou, China Railway Group Smart City R&D Center, Beibu Gulf Port Big Data, Baidu Intelligent Cloud and Alibaba Cloud. Leveraging our self-developed AI Agent Factory, we have achieved dual breakthroughs in AI model services and commercial value. Open Computing AI will continue to deepen the scenario-based implementation of AI in vertical industries to accelerate the realization of our strategic vision.'
|
||||
copyHtml: 'Open Computing AI takes <strong class="copy-strong">"Make AI Everywhere, Make AI Easy"</strong> as its mission. By empowering all industries through integrated technologies, we strive to become a world-leading operator of AI Agent services. The company focuses on key application scenarios including <strong class="copy-strong">education & research, engineering & transportation, port & water utilities, energy & power, and life-science & healthcare</strong>. We build full-stack AI solutions to drive the industrial intelligent transformation. As a Specialized, Refined, Differentiated and Innovative Enterprise, National High-Tech Enterprise, Tech-Based SME and Innovative SME, the company has obtained <span class="copy-nowrap">ISO 9001, ISO 27001 and ISO 28000</span> certifications. In 2026, it was selected as one of Forbes China’s AI Commercial Implementation Demonstration Enterprises. We have established in-depth cooperation with top-tier institutions such as Peking University Science and Technology Park (PKUSTP), Zhongguancun NCMatch, Inspur Yunzhou, China Railway Group Smart City R&D Center, Beibu Gulf Port Big Data, Baidu Intelligent Cloud and Alibaba Cloud. Leveraging our self-developed AI Agent Factory, we have achieved dual breakthroughs in AI model services and commercial value. Open Computing AI will continue to deepen the scenario-based implementation of AI in vertical industries to accelerate the realization of our strategic vision.'
|
||||
},
|
||||
advantages: {
|
||||
kicker: 'Why Choose Us',
|
||||
@ -229,6 +233,20 @@ export default {
|
||||
desc: 'Whether you are seeking AI solutions or a like-minded partner, we look forward to speaking with you.'
|
||||
}
|
||||
},
|
||||
newsView: {
|
||||
badge: 'COMPANY NEWS',
|
||||
title: 'Corporate News',
|
||||
intro: 'Stay up to date with Open Computing AI, explore the latest AI industry insights, and witness the intelligent leap with us.',
|
||||
detail: 'Details',
|
||||
all: 'All',
|
||||
loadFail: 'Failed to load news list',
|
||||
categories: {
|
||||
corporate: 'Corporate News',
|
||||
product: 'Product News',
|
||||
industry: 'Industry Insights',
|
||||
event: 'Event News'
|
||||
}
|
||||
},
|
||||
casePages: {
|
||||
decision: {
|
||||
heroTitle: 'Investment Strategy Agent',
|
||||
@ -334,7 +352,7 @@ export default {
|
||||
largeEnterprise: 'Large Enterprise',
|
||||
sme: 'SME',
|
||||
opcIndividual: 'OPC / Individual',
|
||||
university: 'University / Research Institute',
|
||||
university: 'Academy / Institute',
|
||||
government: 'Government',
|
||||
other: 'Other'
|
||||
}
|
||||
|
||||
@ -33,6 +33,10 @@ export default {
|
||||
viewMore: '查看更多 →',
|
||||
footerProducts: '产品服务',
|
||||
footerContact: '联系我们',
|
||||
footerAddress: '地址',
|
||||
footerEmail: '邮箱',
|
||||
footerTel: '电话',
|
||||
followOfficialAccount: '关注公众号',
|
||||
onlineChat: '在线咨询',
|
||||
solutionCards: {
|
||||
collaboration: {
|
||||
@ -164,7 +168,7 @@ export default {
|
||||
intro: {
|
||||
kicker: 'About Us',
|
||||
title: '关于我们',
|
||||
copyHtml: '开元云科技（Open Computing AI）以<span class="copy-strong">"让AI无处不在，让智能如此简单"</span>为使命，通过融合技术赋能千行百业，致力于成为全球领先的AI智能体服务运营商。公司聚焦<span class="copy-strong">教育科研、工程交通、港口水务、能源电力、生物医药</span>等战略应用场景，构建全栈AI解决方案，推动产业智能化升级。作为专精特新企业，国家级高新技术企业、科技型中小企业、创新型中小企业和ISO 9001/27001/28000认证单位，2026年入选福布斯中国"AI商业落地示范企业"。与北京大学科创园、中关村NCMatch、浪潮云洲、中国中铁智慧城市研发中心、北港大数据、百度智能云、阿里云等顶尖机构建立深度合作。依托自主研发的AI智能体工厂，实现AI模型服务与商业价值的双重突破。开元云将持续深耕垂直领域AI场景化落地，加速实现战略愿景。'
|
||||
copyHtml: '开元云科技（Open Computing AI）以<strong class="copy-strong">"让AI无处不在，让智能如此简单"</strong>为使命，通过融合技术赋能千行百业，致力于成为全球领先的AI智能体服务运营商。公司聚焦<strong class="copy-strong">教育科研、工程交通、港口水务、能源电力、生物医药</strong>等战略应用场景，构建全栈AI解决方案，推动产业智能化升级。作为专精特新企业，国家级高新技术企业、科技型中小企业、创新型中小企业和<span class="copy-nowrap">ISO 9001/27001/28000</span>认证单位，2026年入选福布斯中国"AI商业落地示范企业"。与北京大学科创园、中关村NCMatch、浪潮云洲、中国中铁智慧城市研发中心、北港大数据、百度智能云、阿里云等顶尖机构建立深度合作。依托自主研发的AI智能体工厂，实现AI模型服务与商业价值的双重突破。开元云将持续深耕垂直领域AI场景化落地，加速实现战略愿景。'
|
||||
},
|
||||
advantages: {
|
||||
kicker: 'Why Choose Us',
|
||||
@ -229,6 +233,20 @@ export default {
|
||||
desc: '无论您是寻求AI解决方案的企业，还是志同道合的合作伙伴，我们期待与您对话'
|
||||
}
|
||||
},
|
||||
newsView: {
|
||||
badge: 'COMPANY NEWS',
|
||||
title: '企业动态',
|
||||
intro: '了解开元云最新动态，把握AI行业前沿资讯，与我们一起见证智能跃迁',
|
||||
detail: '详情',
|
||||
all: '全部',
|
||||
loadFail: '新闻列表加载失败',
|
||||
categories: {
|
||||
corporate: '企业动态',
|
||||
product: '产品动态',
|
||||
industry: '行业洞察',
|
||||
event: '活动资讯'
|
||||
}
|
||||
},
|
||||
casePages: {
|
||||
decision: {
|
||||
heroTitle: '投策智能体',
|
||||
|
||||
@ -1,6 +1,12 @@
|
||||
|
||||
<template>
|
||||
<div class="content-layer">
|
||||
<div class="about-page">
|
||||
<div class="aurora-bg" aria-hidden="true">
|
||||
<div class="aurora-blob aurora-blob--1" />
|
||||
<div class="aurora-blob aurora-blob--2" />
|
||||
<div class="aurora-blob aurora-blob--3" />
|
||||
</div>
|
||||
<div class="content-layer">
|
||||
<section class="about-section">
|
||||
<div class="about-container">
|
||||
<div class="section-title reveal visible">
|
||||
@ -23,7 +29,7 @@
|
||||
<div class="card-grid">
|
||||
<div
|
||||
class="advantage-card glass-card glow-border reveal visible"
|
||||
style="--accent: #4f46e5; --soft: #e0e7ff; --x: 50%; --y: 50%;"
|
||||
style="--accent: #4f46e5; --soft: #e0e7ff; --soft-border: #c7d2fe; --number: #c7d2fe; --number-hover: #6366f1; --subtitle: #4f46e5; --tag-text: #4338ca; --shadow: rgba(79, 70, 229, 0.12); --x: 50%; --y: 50%;"
|
||||
@mousemove="moveCardGlow"
|
||||
@mouseleave="resetCardGlow"
|
||||
>
|
||||
@ -45,7 +51,7 @@
|
||||
|
||||
<div
|
||||
class="advantage-card glass-card glow-border reveal visible"
|
||||
style="--accent: #0891b2; --soft: #cffafe; --x: 50%; --y: 50%;"
|
||||
style="--accent: #0891b2; --soft: #cffafe; --soft-border: #a5f3fc; --number: #a5f3fc; --number-hover: #06b6d4; --subtitle: #0891b2; --tag-text: #0e7490; --shadow: rgba(8, 145, 178, 0.12); --x: 50%; --y: 50%;"
|
||||
@mousemove="moveCardGlow"
|
||||
@mouseleave="resetCardGlow"
|
||||
>
|
||||
@ -67,7 +73,7 @@
|
||||
|
||||
<div
|
||||
class="advantage-card glass-card glow-border reveal visible"
|
||||
style="--accent: #4f46e5; --soft: #e0e7ff; --x: 50%; --y: 50%;"
|
||||
style="--accent: #7c3aed; --soft: #f3e8ff; --soft-border: #e9d5ff; --number: #e9d5ff; --number-hover: #a855f7; --subtitle: #9333ea; --tag-text: #7e22ce; --shadow: rgba(124, 58, 237, 0.12); --x: 50%; --y: 50%;"
|
||||
@mousemove="moveCardGlow"
|
||||
@mouseleave="resetCardGlow"
|
||||
>
|
||||
@ -89,7 +95,7 @@
|
||||
|
||||
<div
|
||||
class="advantage-card glass-card glow-border reveal visible"
|
||||
style="--accent: #0891b2; --soft: #cffafe; --x: 50%; --y: 50%;"
|
||||
style="--accent: #059669; --soft: #d1fae5; --soft-border: #a7f3d0; --number: #a7f3d0; --number-hover: #10b981; --subtitle: #059669; --tag-text: #047857; --shadow: rgba(5, 150, 105, 0.12); --x: 50%; --y: 50%;"
|
||||
@mousemove="moveCardGlow"
|
||||
@mouseleave="resetCardGlow"
|
||||
>
|
||||
@ -194,6 +200,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -223,14 +230,95 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.about-page {
|
||||
position: relative;
|
||||
min-height: 100%;
|
||||
color: #1e293b;
|
||||
background: #f0f4ff;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.aurora-bg {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.aurora-blob {
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
filter: blur(90px);
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.aurora-blob--1 {
|
||||
top: -18%;
|
||||
left: -12%;
|
||||
width: min(680px, 55vw);
|
||||
height: min(680px, 55vw);
|
||||
background: rgba(99, 102, 241, 0.08);
|
||||
animation: aurora-drift-1 15s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.aurora-blob--2 {
|
||||
right: -14%;
|
||||
bottom: -10%;
|
||||
width: min(620px, 50vw);
|
||||
height: min(620px, 50vw);
|
||||
background: rgba(168, 85, 247, 0.06);
|
||||
animation: aurora-drift-2 15s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.aurora-blob--3 {
|
||||
left: 15%;
|
||||
bottom: -22%;
|
||||
width: min(900px, 70vw);
|
||||
height: min(320px, 38vw);
|
||||
background: rgba(59, 130, 246, 0.05);
|
||||
animation: aurora-drift-3 15s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes aurora-drift-1 {
|
||||
0%,
|
||||
100% {
|
||||
transform: translate(0, 0) scale(1);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: translate(14%, 12%) scale(1.06);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes aurora-drift-2 {
|
||||
0%,
|
||||
100% {
|
||||
transform: translate(0, 0) scale(1);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: translate(-12%, -10%) scale(1.05);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes aurora-drift-3 {
|
||||
0%,
|
||||
100% {
|
||||
transform: translate(0, 0) scale(1);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: translate(-10%, -14%) scale(1.04);
|
||||
}
|
||||
}
|
||||
|
||||
.content-layer {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
min-height: 100%;
|
||||
padding: 88px 24px 72px;
|
||||
color: #111827;
|
||||
background:
|
||||
radial-gradient(circle at 10% 20%, rgba(224, 231, 255, 0.46), transparent 28%),
|
||||
radial-gradient(circle at 92% 52%, rgba(207, 250, 254, 0.36), transparent 30%),
|
||||
linear-gradient(180deg, #f8faff 0%, #f7f9ff 100%);
|
||||
color: #1e293b;
|
||||
}
|
||||
|
||||
.about-section {
|
||||
@ -271,7 +359,7 @@ export default {
|
||||
|
||||
.section-title h2 {
|
||||
margin: 0;
|
||||
color: #111827;
|
||||
color: #1e293b;
|
||||
font-size: clamp(34px, 4.5vw, 48px);
|
||||
line-height: 1.2;
|
||||
font-weight: 800;
|
||||
@ -280,14 +368,28 @@ export default {
|
||||
|
||||
.about-copy {
|
||||
margin: 0;
|
||||
color: #4b5563;
|
||||
color: #475569;
|
||||
font-size: 16px;
|
||||
line-height: 1.9;
|
||||
text-align: justify;
|
||||
text-wrap: pretty;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.copy-strong {
|
||||
color: #111827;
|
||||
font-weight: 600;
|
||||
color: #1e293b;
|
||||
font-weight: 800;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
::v-deep .copy-strong {
|
||||
color: #1e293b;
|
||||
font-weight: 800;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
::v-deep .copy-nowrap {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.card-grid {
|
||||
@ -313,12 +415,25 @@ export default {
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.advantage-card.glow-border {
|
||||
transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
|
||||
}
|
||||
|
||||
.advantage-card.glow-border:hover {
|
||||
border-color: var(--soft-border, var(--accent));
|
||||
box-shadow: 0 20px 60px var(--shadow, rgba(99, 102, 241, 0.1));
|
||||
transform: translateY(-4px);
|
||||
}
|
||||
|
||||
.advantage-card {
|
||||
position: relative;
|
||||
min-height: 246px;
|
||||
padding: 40px;
|
||||
overflow: hidden;
|
||||
border-radius: 16px;
|
||||
background: rgba(248, 250, 252, 0.94);
|
||||
border-color: rgba(203, 213, 225, 0.82);
|
||||
box-shadow: 0 12px 28px rgba(71, 85, 105, 0.06);
|
||||
}
|
||||
|
||||
.advantage-card::before,
|
||||
@ -370,14 +485,18 @@ export default {
|
||||
}
|
||||
|
||||
.advantage-card.is-glowing .card-glow {
|
||||
opacity: 0.42;
|
||||
opacity: 0.32;
|
||||
}
|
||||
|
||||
.advantage-card.is-glowing .card-glow-bottom {
|
||||
opacity: 0.2;
|
||||
opacity: 0.16;
|
||||
animation: card-glow-sweep 2.4s linear infinite;
|
||||
}
|
||||
|
||||
.advantage-card.is-glowing .card-bg {
|
||||
opacity: 0.42;
|
||||
}
|
||||
|
||||
@keyframes card-glow-sweep {
|
||||
0% {
|
||||
background-position: -100% 100%;
|
||||
@ -409,7 +528,9 @@ export default {
|
||||
}
|
||||
|
||||
.card-bg {
|
||||
background: linear-gradient(135deg, rgba(255, 255, 255, 0.62), transparent);
|
||||
background: radial-gradient(circle at var(--x) var(--y), var(--soft, rgba(241, 245, 249, 0.72)), transparent 52%);
|
||||
opacity: 0;
|
||||
transition: opacity 0.25s ease;
|
||||
}
|
||||
|
||||
.relative {
|
||||
@ -425,45 +546,60 @@ export default {
|
||||
}
|
||||
|
||||
.card-number {
|
||||
color: var(--soft);
|
||||
color: var(--number, var(--soft));
|
||||
font-size: 48px;
|
||||
line-height: 1;
|
||||
font-weight: 900;
|
||||
letter-spacing: -0.07em;
|
||||
text-shadow: 0 1px 0 var(--accent);
|
||||
transition: color 0.25s ease;
|
||||
}
|
||||
|
||||
.advantage-card:hover .card-number {
|
||||
color: var(--number-hover, var(--accent));
|
||||
}
|
||||
|
||||
.card-title {
|
||||
color: #111827;
|
||||
font-size: 28px;
|
||||
color: #1e293b;
|
||||
font-size: 30px;
|
||||
line-height: 1.15;
|
||||
font-weight: 800;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.card-subtitle {
|
||||
margin-top: 4px;
|
||||
color: var(--accent);
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: var(--subtitle, var(--accent));
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
font-weight: 500;
|
||||
transition: color 0.25s ease;
|
||||
}
|
||||
|
||||
.advantage-card:hover .card-subtitle {
|
||||
filter: brightness(0.88);
|
||||
}
|
||||
|
||||
.card-tag {
|
||||
display: inline-block;
|
||||
margin-bottom: 16px;
|
||||
padding: 5px 10px;
|
||||
color: var(--accent);
|
||||
font-size: 11px;
|
||||
padding: 4px 12px;
|
||||
color: var(--tag-text, var(--accent));
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
background: var(--soft);
|
||||
border: 1px solid var(--soft);
|
||||
border: 1px solid var(--soft-border, var(--soft));
|
||||
border-radius: 999px;
|
||||
transition: color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
|
||||
}
|
||||
|
||||
.advantage-card:hover .card-tag {
|
||||
border-color: var(--accent);
|
||||
}
|
||||
|
||||
.advantage-card p {
|
||||
margin: 0;
|
||||
color: #4b5563;
|
||||
color: #475569;
|
||||
font-size: 14px;
|
||||
line-height: 1.75;
|
||||
line-height: 1.625;
|
||||
}
|
||||
|
||||
.credential-card {
|
||||
@ -545,7 +681,7 @@ export default {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
margin: 2px 0 10px;
|
||||
color: #111827;
|
||||
color: #1e293b;
|
||||
font-size: 18px;
|
||||
line-height: 1.35;
|
||||
font-weight: 700;
|
||||
@ -555,7 +691,7 @@ export default {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
margin: 0;
|
||||
color: #6b7280;
|
||||
color: #64748b;
|
||||
font-size: 14px;
|
||||
line-height: 1.7;
|
||||
}
|
||||
@ -580,7 +716,7 @@ export default {
|
||||
|
||||
.cta-card h2 {
|
||||
margin: 0 0 16px;
|
||||
color: #111827;
|
||||
color: #1e293b;
|
||||
font-size: clamp(28px, 3.4vw, 36px);
|
||||
line-height: 1.3;
|
||||
font-weight: 800;
|
||||
@ -588,7 +724,7 @@ export default {
|
||||
|
||||
.cta-card p {
|
||||
margin: 0;
|
||||
color: #6b7280;
|
||||
color: #64748b;
|
||||
font-size: 15px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
@ -182,11 +182,16 @@ export default Vue.extend({
|
||||
中小企业: 'sme',
|
||||
OPC个人: 'opcIndividual',
|
||||
高校科研机构: 'university',
|
||||
高校: 'university',
|
||||
政府: 'government',
|
||||
其他: 'other'
|
||||
}
|
||||
const key = map[name]
|
||||
return key ? this.$t(`contactSales.enterpriseOptions.${key}`) : name
|
||||
if (!key) return name
|
||||
|
||||
const i18nKey = `contactSales.enterpriseOptions.${key}`
|
||||
const translated = this.$t(i18nKey)
|
||||
return translated === i18nKey ? name : translated
|
||||
},
|
||||
getDefaultFormData() {
|
||||
return {
|
||||
|
||||
@ -24,7 +24,7 @@
|
||||
<h4 class="footer-col-title">{{ $t('home.footerProducts') }}</h4>
|
||||
<ul class="footer-link-list">
|
||||
<li
|
||||
v-for="item in footerProductServices"
|
||||
v-for="item in localizedFooterProductServices"
|
||||
:key="item.label"
|
||||
class="footer-link-item"
|
||||
:class="{ clickable: !!item.path }"
|
||||
@ -38,9 +38,9 @@
|
||||
<div class="footer-contact-col">
|
||||
<h4 class="footer-col-title">{{ $t('home.footerContact') }}</h4>
|
||||
<ul class="footer-contact-list">
|
||||
<li>地址：<span>{{ footerHomeInfo.adress }}</span></li>
|
||||
<li>邮箱：<span>{{ footerHomeInfo.email }}</span></li>
|
||||
<li>电话：<span>{{ footerHomeInfo.mobile }}</span></li>
|
||||
<li>{{ $t('home.footerAddress') }}:<span>{{ footerHomeInfo.adress }}</span></li>
|
||||
<li>{{ $t('home.footerEmail') }}:<span>{{ footerHomeInfo.email }}</span></li>
|
||||
<li>{{ $t('home.footerTel') }}:<span>{{ footerHomeInfo.mobile }}</span></li>
|
||||
</ul>
|
||||
<div v-if="showFooterQrcode" class="footer-qrcode-row">
|
||||
<div class="qr-box">
|
||||
@ -53,7 +53,7 @@
|
||||
<div class="qr-code">
|
||||
<img src="./img/kefu.jpg" alt="">
|
||||
</div>
|
||||
<span class="qr-content">关注公众号</span>
|
||||
<span class="qr-content">{{ $t('home.followOfficialAccount') }}</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -133,12 +133,13 @@ export default Vue.extend({
|
||||
}
|
||||
],
|
||||
footerProductServices: [
|
||||
{ label: 'Token市集', path: '/homePage/tokenMarket' },
|
||||
{ label: '算力市场', path: '/homePage/computeMarket' },
|
||||
{ label: 'OPC公共服务平台', path: '/homePage/opc' },
|
||||
{ label: '训推平台', path: '/homePage/trainPlatform' },
|
||||
{ label: '智能体商店', path: '/homePage/agentStore' },
|
||||
{ label: '供需广场', path: '/ncmatchHome/supplyAndDemandSquare' },
|
||||
{ action: 'tokenMarket', label: 'Token市集', path: '/homePage/tokenMarket' },
|
||||
{ action: 'computeMarket', label: '算力市场', path: '/homePage/computeMarket' },
|
||||
{ action: 'opc', label: 'OPC公共服务平台', path: '/homePage/opc' },
|
||||
{ action: 'yuanjing', label: '元境', path: '/homePage/yuanJing' },
|
||||
{ action: 'trainPlatform', label: '训推平台', path: '/homePage/trainPlatform' },
|
||||
{ action: 'agentStore', label: '智能体商店', path: '/homePage/agentStore' },
|
||||
{ action: 'supplySquare', label: '供需广场', path: '/ncmatchHome/supplyAndDemandSquare' },
|
||||
],
|
||||
footerAboutUs: [
|
||||
{ label: '关于我们', path: '/homePage/about' },
|
||||
@ -192,6 +193,22 @@ export default Vue.extend({
|
||||
showFooterQrcode() {
|
||||
return this.hasLogoInfo && this.footerHomeInfo.bannerTitle !== '开元数智'
|
||||
},
|
||||
localizedFooterProductServices() {
|
||||
const isEn = this.$i18n && this.$i18n.locale === 'en-US'
|
||||
const labels = {
|
||||
opc: 'OPC',
|
||||
computeMarket: isEn ? 'Compute Market' : '算力市场',
|
||||
tokenMarket: isEn ? 'Token Market' : 'Token市集',
|
||||
yuanjing: isEn ? 'Yuanjing' : '元境',
|
||||
trainPlatform: isEn ? 'Train & Infer' : '训推平台',
|
||||
agentStore: isEn ? 'Agent Store' : '智能体商店',
|
||||
supplySquare: isEn ? 'Supply Square' : '供需广场'
|
||||
}
|
||||
return this.footerProductServices.map(item => ({
|
||||
...item,
|
||||
label: labels[item.action] || item.label
|
||||
}))
|
||||
},
|
||||
username() {
|
||||
return sessionStorage.getItem('username') || '';
|
||||
},
|
||||
|
||||
@ -825,11 +825,13 @@ body.dark-theme .bg-orb {
|
||||
h3 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
margin: 24px 0 8px;
|
||||
font-size: 24px;
|
||||
line-height: 1.3;
|
||||
font-weight: 800;
|
||||
letter-spacing: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
span {
|
||||
@ -872,10 +874,12 @@ body.dark-theme .bg-orb {
|
||||
.solution-card__front {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
transition: all 0.28s ease;
|
||||
}
|
||||
|
||||
@ -1321,6 +1325,7 @@ body.dark-theme .bg-orb {
|
||||
font-size: 34px;
|
||||
line-height: 1.25;
|
||||
font-weight: 800;
|
||||
text-align: center ;
|
||||
}
|
||||
|
||||
p {
|
||||
|
||||
@ -9,11 +9,11 @@
|
||||
<div class="news-hero-glow news-hero-glow-2"></div>
|
||||
<div class="news-shell">
|
||||
<div class="hero-content">
|
||||
<span class="hero-badge">COMPANY NEWS</span>
|
||||
<span class="hero-badge">{{ $t('newsView.badge') }}</span>
|
||||
<div class="hero-title-row">
|
||||
<h1>{{ isEnglish ? 'Company News' : '企业动态' }}</h1>
|
||||
<h1>{{ $t('newsView.title') }}</h1>
|
||||
</div>
|
||||
<p>{{ isEnglish ? 'Stay up to date with Open Computing AI, explore the latest AI industry insights, and witness the intelligent leap with us.' : '了解开元云最新动态，把握AI行业前沿资讯，与我们一起见证智能跃迁' }}</p>
|
||||
<p>{{ $t('newsView.intro') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@ -22,7 +22,7 @@
|
||||
<div class="news-shell">
|
||||
<div class="filter-tabs">
|
||||
<button
|
||||
v-for="item in filterTabs"
|
||||
v-for="item in localizedFilterTabs"
|
||||
:key="item.value"
|
||||
type="button"
|
||||
class="filter-tab"
|
||||
@ -39,7 +39,7 @@
|
||||
<div class="news-shell">
|
||||
<article v-if="featuredNews" class="news-featured" @click="goNewsDetail(featuredNews)">
|
||||
<div class="news-item-glow"></div>
|
||||
<span class="hover-detail">详情 <i class="el-icon-arrow-right"></i></span>
|
||||
<span class="hover-detail">{{ $t('newsView.detail') }} <i class="el-icon-arrow-right"></i></span>
|
||||
<div class="news-featured-inner">
|
||||
<div class="news-featured-img">
|
||||
<img :src="featuredNews.img || fallbackNewsImage" :alt="featuredNews.title" @error="handleImageError">
|
||||
@ -68,7 +68,7 @@
|
||||
@click="goNewsDetail(item)"
|
||||
>
|
||||
<div class="news-item-glow"></div>
|
||||
<span class="hover-detail">详情 <i class="el-icon-arrow-right"></i></span>
|
||||
<span class="hover-detail">{{ $t('newsView.detail') }} <i class="el-icon-arrow-right"></i></span>
|
||||
<div class="news-item-img">
|
||||
<img :src="item.img || fallbackNewsImage" :alt="item.title" @error="handleImageError">
|
||||
<div class="news-item-img-overlay"></div>
|
||||
@ -108,7 +108,7 @@
|
||||
<script>
|
||||
import { reqNewsList } from '@/api/newsapi/newsapi'
|
||||
export default {
|
||||
name: 'NewsView',
|
||||
name: 'NewsView',
|
||||
data() {
|
||||
return {
|
||||
fallbackNewsImage: require('@/assets/image/news.jpg'),
|
||||
@ -116,12 +116,12 @@ export default {
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
total: 0,
|
||||
filterTabs: [
|
||||
{ label: '全部', value: 'all' },
|
||||
{ label: '企业动态', value: '企业动态' },
|
||||
{ label: '产品动态', value: '产品动态' },
|
||||
{ label: '行业洞察', value: '行业洞察' },
|
||||
{ label: '活动资讯', value: '活动资讯' }
|
||||
filterTabValues: [
|
||||
{ key: 'all', value: 'all', zh: '', en: '' },
|
||||
{ key: 'corporate', value: 'corporate', zh: '企业动态', en: 'Corporate News' },
|
||||
{ key: 'product', value: 'product', zh: '产品动态', en: 'Product News' },
|
||||
{ key: 'industry', value: 'industry', zh: '行业洞察', en: 'Industry Insights' },
|
||||
{ key: 'event', value: 'event', zh: '活动资讯', en: 'Event News' }
|
||||
],
|
||||
newsList: []
|
||||
}
|
||||
@ -136,6 +136,12 @@ export default {
|
||||
filteredNewsList() {
|
||||
return this.newsList.slice(1)
|
||||
},
|
||||
localizedFilterTabs() {
|
||||
return this.filterTabValues.map(item => ({
|
||||
...item,
|
||||
label: item.key === 'all' ? this.$t('newsView.all') : this.$t(`newsView.categories.${item.key}`)
|
||||
}))
|
||||
},
|
||||
totalPages() {
|
||||
return Math.max(Math.ceil(this.total / this.pageSize), 1)
|
||||
},
|
||||
@ -179,27 +185,53 @@ export default {
|
||||
this.page = page
|
||||
this.getNewsList()
|
||||
},
|
||||
getActiveCategoryConfig() {
|
||||
return this.filterTabValues.find(item => item.value === this.activeCategory) || this.filterTabValues[0]
|
||||
},
|
||||
buildNewsParams() {
|
||||
const category = this.getActiveCategoryConfig()
|
||||
return {
|
||||
url_link: window.location.href.split('#')[0] || window.location.href,
|
||||
title_zh: '',
|
||||
title_en: '',
|
||||
article_type_zh: category.zh || '',
|
||||
article_type_en: category.en || '',
|
||||
current_page: String(this.page),
|
||||
page_size: String(this.pageSize),
|
||||
article_type: this.activeCategory === 'all' ? '' : this.activeCategory,
|
||||
title: ''
|
||||
page_size: String(this.pageSize)
|
||||
}
|
||||
},
|
||||
getTagColor(type) {
|
||||
const map = {
|
||||
企业动态: 'rgba(16,185,129,0.85)',
|
||||
产品动态: 'rgba(99,102,241,0.85)',
|
||||
行业洞察: 'rgba(13,148,136,0.85)',
|
||||
活动资讯: 'rgba(245,158,11,0.85)',
|
||||
'Corporate News': 'rgba(16,185,129,0.85)',
|
||||
'Product News': 'rgba(99,102,241,0.85)',
|
||||
'Industry Insights': 'rgba(13,148,136,0.85)',
|
||||
'Event News': 'rgba(245,158,11,0.85)'
|
||||
corporate: 'rgba(16,185,129,0.85)',
|
||||
product: 'rgba(99,102,241,0.85)',
|
||||
industry: 'rgba(13,148,136,0.85)',
|
||||
event: 'rgba(245,158,11,0.85)'
|
||||
}
|
||||
return map[type] || 'rgba(99,102,241,0.85)'
|
||||
return map[this.getCategoryKey(type)] || 'rgba(99,102,241,0.85)'
|
||||
},
|
||||
getCategoryKey(type) {
|
||||
const map = {
|
||||
企业动态: 'corporate',
|
||||
'Corporate News': 'corporate',
|
||||
产品动态: 'product',
|
||||
'Product News': 'product',
|
||||
行业洞察: 'industry',
|
||||
'Industry Insights': 'industry',
|
||||
活动资讯: 'event',
|
||||
'Event News': 'event'
|
||||
}
|
||||
if (map[type]) return map[type]
|
||||
const matchedLabel = Object.keys(map).find(label => String(type || '').startsWith(label))
|
||||
return matchedLabel ? map[matchedLabel] : ''
|
||||
},
|
||||
getCategorySuffix(type) {
|
||||
const labels = ['企业动态', 'Corporate News', '产品动态', 'Product News', '行业洞察', 'Industry Insights', '活动资讯', 'Event News']
|
||||
const matchedLabel = labels.find(label => String(type || '').startsWith(label))
|
||||
return matchedLabel ? String(type).slice(matchedLabel.length) : ''
|
||||
},
|
||||
getLocalizedCategory(type) {
|
||||
const key = this.getCategoryKey(type)
|
||||
return key ? `${this.$t(`newsView.categories.${key}`)}${this.getCategorySuffix(type)}` : type
|
||||
},
|
||||
getLocalizedField(row, zhField, enField, legacyField) {
|
||||
if (this.isEnglish && row[enField]) return row[enField]
|
||||
@ -212,10 +244,11 @@ export default {
|
||||
},
|
||||
normalizeNewsItem(row) {
|
||||
const type = this.getLocalizedField(row, 'article_type_zh', 'article_type_en', 'article_type') || '企业动态'
|
||||
const localizedType = this.getLocalizedCategory(type)
|
||||
return {
|
||||
id: row.id,
|
||||
category: type,
|
||||
tag: type,
|
||||
category: localizedType,
|
||||
tag: localizedType,
|
||||
tagColor: this.getTagColor(type),
|
||||
date: this.getLocalizedField(row, 'publish_time_zh', 'publish_time_en', 'publish_time'),
|
||||
title: this.getLocalizedField(row, 'title_zh', 'title_en', 'title') || '未命名文章',
|
||||
@ -240,7 +273,7 @@ export default {
|
||||
} catch (error) {
|
||||
this.newsList = []
|
||||
this.total = 0
|
||||
this.$message.error('新闻列表加载失败')
|
||||
this.$message.error(this.$t('newsView.loadFail'))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user