feat(homepage): 添加国际化标签并新增企业服务和部署选项卡组件

- 在成本优势部分添加 data-i18n 国际化标签
- 新增 CTASection 组件包含企业服务区块和行动号召区域
- 新增 DeploymentSection 组件提供 Docker 和手动部署选项卡
- 实现微信二维码弹窗功能用于企业咨询
- 添加响应式设计适配不同屏幕尺寸
- 集成国际化文本支持多语言切换

Author: smthing

pages/src/components/CTASection.astro

@@ -6,9 +6,9 @@
 <section class="enterprise-section" id="enterprise">
   <div class="enterprise-container">
     <div class="enterprise-header">
-      <span class="enterprise-tag">企业服务</span>
-      <h2 class="enterprise-title">为大型企业提供专业服务</h2>
-      <p class="enterprise-description">
+      <span class="enterprise-tag" data-i18n="enterprise.tag">企业服务</span>
+      <h2 class="enterprise-title" data-i18n="enterprise.title">为大型企业提供专业服务</h2>
+      <p class="enterprise-description" data-i18n="enterprise.description">
         企业版在专业版基础上，提供更高级的功能和专属技术支持
       </p>
     </div>
@@ -20,8 +20,8 @@
             <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
           </svg>
         </div>
-        <h3>专属技术支持</h3>
-        <p>7x24小时响应，专属技术顾问一对一服务</p>
+        <h3 data-i18n="enterprise.features.support.title">专属技术支持</h3>
+        <p data-i18n="enterprise.features.support.desc">7x24小时响应，专属技术顾问一对一服务</p>
       </div>
 
       <div class="enterprise-feature">
@@ -31,8 +31,8 @@
             <polyline points="12 6 12 12 16 14"/>
           </svg>
         </div>
-        <h3>定制化开发</h3>
-        <p>根据业务需求定制功能，满足特殊场景需求</p>
+        <h3 data-i18n="enterprise.features.custom.title">定制化开发</h3>
+        <p data-i18n="enterprise.features.custom.desc">根据业务需求定制功能，满足特殊场景需求</p>
       </div>
 
       <div class="enterprise-feature">
@@ -44,8 +44,8 @@
             <path d="M16 3.13a4 4 0 0 1 0 7.75"/>
           </svg>
         </div>
-        <h3>集群部署方案</h3>
-        <p>专业的集群架构设计，支持高可用负载均衡</p>
+        <h3 data-i18n="enterprise.features.cluster.title">集群部署方案</h3>
+        <p data-i18n="enterprise.features.cluster.desc">专业的集群架构设计，支持高可用负载均衡</p>
       </div>
 
       <div class="enterprise-feature">
@@ -58,14 +58,14 @@
             <polyline points="10 9 9 9 8 9"/>
           </svg>
         </div>
-        <h3>SLA 服务保障</h3>
-        <p>99.99% 服务可用性保障，完善的灾备方案</p>
+        <h3 data-i18n="enterprise.features.sla.title">SLA 服务保障</h3>
+        <p data-i18n="enterprise.features.sla.desc">99.99% 服务可用性保障，完善的灾备方案</p>
       </div>
     </div>
 
     <div class="enterprise-cta">
       <button class="btn-enterprise" id="contactEnterpriseBtn">
-        <span>联系我们获取方案</span>
+        <span data-i18n="enterprise.contactBtn">联系我们获取方案</span>
         <svg width="16" height="16" viewBox="0 0 16 16" fill="none">
           <path d="M6 12L10 8L6 4" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
         </svg>
@@ -82,8 +82,8 @@
   </div>
 
   <div class="cta-content">
-    <h2 class="cta-title">代码开源，即刻体验</h2>
-    <p class="cta-description">
+    <h2 class="cta-title" data-i18n="cta.title">代码开源，即刻体验</h2>
+    <p class="cta-description" data-i18n="cta.description">
       AGPL 协议开源，商业授权可选。<br/>
       Docker 一键部署，5分钟完成接入。
     </p>
@@ -93,13 +93,13 @@
         <svg viewBox="0 0 24 24" fill="currentColor" width="20" height="20">
           <path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0 0 24 12c0-6.63-5.37-12-12-12z"/>
         </svg>
-        <span>访问 GitHub</span>
+        <span data-i18n="cta.github">访问 GitHub</span>
       </a>
       <a href="https://gitee.com/smartboot/smart-mqtt" class="btn-secondary btn-large" target="_blank" rel="noopener">
         <svg viewBox="0 0 1024 1024" width="20" height="20">
           <path fill="currentColor" d="M512 1024q-104 0-199-40-92-39-163-110T40 711Q0 616 0 512t40-199Q79 221 150 150T313 40q95-40 199-40t199 40q92 39 163 110t110 163q40 95 40 199t-40 199q-39 92-110 163T711 984q-95 40-199 40z m259-569H480q-10 0-17.5 7.5T455 480v64q0 10 7.5 17.5T480 569h177q11 0 18.5 7.5T683 594v13q0 31-22.5 53.5T607 683H367q-11 0-18.5-7.5T341 657V417q0-31 22.5-53.5T417 341h354q11 0 18-7t7-18v-63q0-11-7-18t-18-7H417q-38 0-72.5 14T283 283q-27 27-41 61.5T228 417v354q0 11 7 18t18 7h373q46 0 85.5-22.5t62-62Q796 672 796 626V480q0-10-7-17.5t-18-7.5z"/>
         </svg>
-        <span>访问 Gitee</span>
+        <span data-i18n="cta.gitee">访问 Gitee</span>
       </a>
     </div>
 
@@ -108,19 +108,19 @@
         <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
           <polyline points="20 6 9 17 4 12"/>
         </svg>
-        <span>企业级服务保障</span>
+        <span data-i18n="cta.trust1">企业级服务保障</span>
       </div>
       <div class="trust-item">
         <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
           <polyline points="20 6 9 17 4 12"/>
         </svg>
-        <span>专业技术服务</span>
+        <span data-i18n="cta.trust2">专业技术服务</span>
       </div>
       <div class="trust-item">
         <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
           <polyline points="20 6 9 17 4 12"/>
         </svg>
-        <span>社区支持</span>
+        <span data-i18n="cta.trust3">社区支持</span>
       </div>
     </div>
   </div>
@@ -141,17 +141,17 @@
             <path d="M8.691 2.188C3.891 2.188 0 5.476 0 9.53c0 2.212 1.17 4.203 3.002 5.55a.59.59 0 0 1 .213.665l-.39 1.48c-.019.07-.048.141-.048.213 0 .163.13.295.29.295a.32.32 0 0 0 .167-.054l1.903-1.114a.864.864 0 0 1 .717-.098 10.16 10.16 0 0 0 2.837.403c.276 0 .543-.027.811-.05-.857-2.578.157-4.972 1.932-6.446 1.703-1.415 3.882-1.98 5.853-1.838-.576-3.583-4.196-6.348-8.596-6.348zM5.785 5.991c.642 0 1.162.529 1.162 1.18a1.17 1.17 0 0 1-1.162 1.178A1.17 1.17 0 0 1 4.623 7.17c0-.651.52-1.18 1.162-1.18zm5.813 0c.642 0 1.162.529 1.162 1.18a1.17 1.17 0 0 1-1.162 1.178 1.17 1.17 0 0 1-1.162-1.178c0-.651.52-1.18 1.162-1.18zm5.34 2.867c-1.797-.052-3.746.512-5.28 1.786-1.72 1.428-2.687 3.72-1.78 6.22.942 2.453 3.666 4.229 6.884 4.229.826 0 1.622-.12 2.361-.336a.722.722 0 0 1 .598.082l1.584.926a.272.272 0 0 0 .14.047c.134 0 .24-.111.24-.247 0-.06-.023-.12-.038-.177l-.327-1.233a.49.49 0 0 1 .176-.553C23.016 18.35 24 16.62 24 14.628c0-3.06-2.656-5.57-5.996-5.77h-.067zm-2.838 2.393c.535 0 .969.44.969.982a.976.976 0 0 1-.969.983.976.976 0 0 1-.969-.983c0-.542.434-.982.97-.982zm4.838 0c.535 0 .969.44.969.982a.976.976 0 0 1-.969.983.976.976 0 0 1-.969-.983c0-.542.434-.982.97-.982z"/>
           </svg>
         </div>
-        <h3 class="qr-modal-title">联系销售团队</h3>
+        <h3 class="qr-modal-title" data-i18n="cta.qrTitle">联系销售团队</h3>
       </div>
-      <p class="qr-modal-desc">扫描二维码，添加微信咨询</p>
+      <p class="qr-modal-desc" data-i18n="cta.qrDesc">扫描二维码，添加微信咨询</p>
       <div class="qr-image-wrapper">
         <img src="https://smartboot.tech/img/qrcode/personal_wx.png" alt="微信二维码" class="qr-image" id="qrImage" />
         <div class="qr-loading" id="qrLoading">
           <div class="qr-loading-spinner"></div>
         </div>
       </div>
       <div class="qr-modal-footer">
-        <p class="qr-modal-tip">工作时间：周一至周五 9:00-18:00</p>
+        <p class="qr-modal-tip" data-i18n="cta.qrWorkHours">工作时间：周一至周五 9:00-18:00</p>
       </div>
     </div>
   </div>

pages/src/components/CostAdvantageSection.astro

@@ -15,10 +15,10 @@ import CostTimeline from './CostTimeline.astro';
     <header class="cost-header">
       <div class="cost-badge">
         <span class="badge-dot"></span>
-        成本优势
+        <span data-i18n="cost.badge">成本优势</span>
       </div>
       <h2 class="cost-title">
-        <span class="title-line">实现成本降至原先的</span>
+        <span class="title-line" data-i18n="cost.title">实现成本降至原先的</span>
         <span class="title-highlight">
           <span class="fraction">
             <span class="numerator" data-count="1">0</span>

pages/src/components/DeploymentSection.astro

@@ -4,9 +4,9 @@
 <section class="deployment-section" id="deployment">
   <div class="deployment-container">
     <div class="deployment-header">
-      <span class="deployment-tag">快速部署</span>
-      <h2 class="deployment-title">选择适合你的部署方式</h2>
-      <p class="deployment-description">
+      <span class="deployment-tag" data-i18n="deployment.tag">快速部署</span>
+      <h2 class="deployment-title" data-i18n="deployment.title">选择适合你的部署方式</h2>
+      <p class="deployment-description" data-i18n="deployment.description">
         提供 Docker 和手动部署两种方式，5 分钟内即可启动服务
       </p>
     </div>
@@ -17,15 +17,15 @@
           <svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18">
             <path d="M13.983 11.078h2.119a.186.186 0 00.186-.185V9.006a.186.186 0 00-.186-.186h-2.119a.185.185 0 00-.185.185v1.888c0 .102.083.185.185.185m-2.954-5.43h2.118a.186.186 0 00.186-.186V3.574a.186.186 0 00-.186-.185h-2.118a.185.185 0 00-.185.185v1.888c0 .102.082.185.185.186m0 2.716h2.118a.187.187 0 00.186-.186V6.29a.186.186 0 00-.186-.185h-2.118a.185.185 0 00-.185.185v1.887c0 .102.082.185.185.186m-2.93 0h2.12a.186.186 0 00.184-.186V6.29a.185.185 0 00-.185-.185H8.1a.185.185 0 00-.185.185v1.887c0 .102.083.185.185.186m-2.964 0h2.119a.186.186 0 00.185-.186V6.29a.185.185 0 00-.185-.185H5.136a.186.186 0 00-.186.185v1.887c0 .102.084.185.186.186m5.893 2.715h2.118a.186.186 0 00.186-.185V9.006a.186.186 0 00-.186-.186h-2.118a.185.185 0 00-.185.185v1.888c0 .102.082.185.185.185m-2.93 0h2.12a.185.185 0 00.184-.185V9.006a.185.185 0 00-.184-.186h-2.12a.185.185 0 00-.184.185v1.888c0 .102.083.185.185.185m-2.964 0h2.119a.185.185 0 00.185-.185V9.006a.185.185 0 00-.184-.186h-2.12a.186.186 0 00-.186.186v1.887c0 .102.084.185.186.185m-2.92 0h2.12a.185.185 0 00.184-.185V9.006a.185.185 0 00-.184-.186h-2.12a.185.185 0 00-.184.185v1.888c0 .102.082.185.185.185M23.763 9.89c-.065-.051-.672-.51-1.954-.51-.338.001-.676.03-1.01.087-.248-1.7-1.653-2.53-1.716-2.566l-.344-.199-.226.327c-.284.438-.49.922-.612 1.43-.23.97-.09 1.882.403 2.661-.595.332-1.55.413-1.744.42H.751a.751.751 0 00-.75.748 11.376 11.376 0 00.692 4.062c.545 1.428 1.355 2.48 2.41 3.124 1.18.723 3.1 1.137 5.275 1.137.983.003 1.963-.086 2.93-.266a12.248 12.248 0 00.824-1.389c.98-.567 1.86-1.288 2.61-2.136 1.252-1.418 1.998-2.997 2.553-4.4h.221c1.372 0 2.215-.549 2.68-1.009.309-.293.55-.65.707-1.046l.098-.288Z"/>
           </svg>
-          Docker 部署（推荐）
+          <span data-i18n="deployment.dockerTab">Docker 部署（推荐）</span>
         </button>
         <button class="tab-btn" data-tab="manual">
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="18" height="18">
             <path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"/>
             <polyline points="3.27 6.96 12 12.01 20.73 6.96"/>
             <line x1="12" y1="17" x2="12" y2="21"/>
           </svg>
-          手动部署
+          <span data-i18n="deployment.manualTab">手动部署</span>
         </button>
       </div>
 
@@ -36,9 +36,9 @@
             <div class="method-card">
               <div class="method-header">
                 <span class="method-number">01</span>
-                <h3>使用 Docker Compose</h3>
+                <h3 data-i18n="deployment.docker.compose.title">使用 Docker Compose</h3>
               </div>
-              <p class="method-desc">最简单的部署方式，一键启动完整服务</p>
+              <p class="method-desc" data-i18n="deployment.docker.compose.desc">最简单的部署方式，一键启动完整服务</p>
               <div class="code-block">
                 <div class="code-header">
                   <span>docker-compose.yaml</span>
@@ -74,9 +74,9 @@ services:
             <div class="method-card">
               <div class="method-header">
                 <span class="method-number">02</span>
-                <h3>直接运行 Docker</h3>
+                <h3 data-i18n="deployment.docker.direct.title">直接运行 Docker</h3>
               </div>
-              <p class="method-desc">快速启动单个容器</p>
+              <p class="method-desc" data-i18n="deployment.docker.direct.desc">快速启动单个容器</p>
               <div class="code-block">
                 <div class="code-header">
                   <span>终端命令</span>
@@ -97,11 +97,11 @@ services:
               <div class="port-info">
                 <div class="port-item">
                   <span class="port-label">1883</span>
-                  <span class="port-desc">MQTT 协议端口</span>
+                  <span class="port-desc" data-i18n="deployment.docker.direct.mqttPort">MQTT 协议端口</span>
                 </div>
                 <div class="port-item">
                   <span class="port-label">18083</span>
-                  <span class="port-desc">Dashboard 端口</span>
+                  <span class="port-desc" data-i18n="deployment.docker.direct.dashboardPort">Dashboard 端口</span>
                 </div>
               </div>
             </div>
@@ -114,9 +114,9 @@ services:
             <div class="method-card">
               <div class="method-header">
                 <span class="method-number">01</span>
-                <h3>下载发行包</h3>
+                <h3 data-i18n="deployment.manual.download.title">下载发行包</h3>
               </div>
-              <p class="method-desc">从 Gitee 或 GitHub Releases 下载最新版本</p>
+              <p class="method-desc" data-i18n="deployment.manual.download.desc">从 Gitee 或 GitHub Releases 下载最新版本</p>
               <div class="code-block">
                 <div class="code-header">
                   <span>下载并解压</span>
@@ -151,9 +151,9 @@ cd smart-mqtt</code></pre>
             <div class="method-card">
               <div class="method-header">
                 <span class="method-number">02</span>
-                <h3>启动服务</h3>
+                <h3 data-i18n="deployment.manual.start.title">启动服务</h3>
               </div>
-              <p class="method-desc">执行启动脚本运行 smart-mqtt</p>
+              <p class="method-desc" data-i18n="deployment.manual.start.desc">执行启动脚本运行 smart-mqtt</p>
               <div class="code-block">
                 <div class="code-header">
                   <span>启动命令</span>
@@ -173,7 +173,7 @@ cd smart-mqtt</code></pre>
                   <line x1="12" y1="16" x2="12" y2="12"/>
                   <line x1="12" y1="8" x2="12.01" y2="8"/>
                 </svg>
-                <span>确保已安装 JDK 8 或更高版本</span>
+                <span data-i18n="deployment.manual.start.note">确保已安装 JDK 8 或更高版本</span>
               </div>
             </div>
           </div>