79 lines
2.8 KiB
JavaScript
79 lines
2.8 KiB
JavaScript
|
// 产品介绍页面
|
|||
|
|
Router.register('/product-intro', async () => {
|
|||
|
|
setTimeout(() => {
|
|||
|
|
if(window.ProductIntroComponent.afterRender) {
|
|||
|
|
window.ProductIntroComponent.afterRender();
|
|||
|
|
}
|
|||
|
|
}, 0);
|
|||
|
|
return window.ProductIntroComponent.render();
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
window.ProductIntroComponent = {
|
|||
|
|
render: () => {
|
|||
|
|
return `
|
|||
|
|
<div class="product-intro-page">
|
|||
|
|
<div class="product-intro-header">
|
|||
|
|
<h1>产品介绍</h1>
|
|||
|
|
<p class="subtitle">兔喜驿站智能找灯系统</p>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="product-cards">
|
|||
|
|
<div class="product-card main-product">
|
|||
|
|
<div class="product-image-wrapper">
|
|||
|
|
<img src="./assets/tuxi-station.png" alt="兔喜基站" class="product-image rotated" />
|
|||
|
|
</div>
|
|||
|
|
<div class="product-info">
|
|||
|
|
<h2>智能基站</h2>
|
|||
|
|
<p class="product-desc">兔喜驿站找灯条对应快递的基站设备，用于控制货架上的LED灯条，帮助快速定位快递包裹位置。</p>
|
|||
|
|
<div class="product-features">
|
|||
|
|
<div class="feature-item">
|
|||
|
|
<span class="feature-icon">📡</span>
|
|||
|
|
<span class="feature-text">蓝牙信号覆盖</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="feature-item">
|
|||
|
|
<span class="feature-icon">💡</span>
|
|||
|
|
<span class="feature-text">精准灯条控制</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="feature-item">
|
|||
|
|
<span class="feature-icon">⚡</span>
|
|||
|
|
<span class="feature-text">快速响应</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="feature-item">
|
|||
|
|
<span class="feature-icon">🔧</span>
|
|||
|
|
<span class="feature-text">易于安装</span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="product-specs">
|
|||
|
|
<h3>技术规格</h3>
|
|||
|
|
<div class="specs-grid">
|
|||
|
|
<div class="spec-item">
|
|||
|
|
<span class="spec-label">品牌</span>
|
|||
|
|
<span class="spec-value">兔喜生活</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="spec-item">
|
|||
|
|
<span class="spec-label">类型</span>
|
|||
|
|
<span class="spec-value">智能基站</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="spec-item">
|
|||
|
|
<span class="spec-label">应用场景</span>
|
|||
|
|
<span class="spec-value">快递驿站</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="spec-item">
|
|||
|
|
<span class="spec-label">功能</span>
|
|||
|
|
<span class="spec-value">灯条定位控制</span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
`;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
afterRender: () => {
|
|||
|
|
// 页面渲染后的逻辑
|
|||
|
|
}
|
|||
|
|
};
|