一、项目概述
本项目是为某新能源企业量身打造的企业级品牌官网，旨在构建一个兼具品牌展示与产品营销功能的国际化数字门户。

二、技术架构
项目采用前后端分离的现代 Web 架构：
- 后端：基于 Strapi v4 无头 CMS 构建，使用 TypeScript 开发，PostgreSQL 作为持久化数据库。Strapi 提供 RESTful API，管理文章、产品、分类、团队信息、主页内容等六大数据模型，支持字段级填充与国际化。
- 前端：采用 Vue 3（Composition API）+ Vite 7 + Tailwind CSS 4 + Element Plus 技术栈，搭配 Pinia 状态管理与 Vue Router 路由控制。页面涵盖首页、产品目录、产品详情、品牌故事/新闻、关于我们、使用指南、FAQ、搜索结果、联系我们及隐私政策等十大视图模块。
- 部署运维：通过 Docker Compose 编排三组容器（前端 Caddy 反代、后端 Strapi、PostgreSQL 15），部署于某云服务商的 Linux 主机，使用 1Panel 面板进行服务器管理。项目支持 Git Push 自动部署，推送至远端即触发生产环境更新。

三、核心功能亮点
1. 产品展示体系：产品按分类层级组织，详情页集成轮播图组件（ImageGallery），支持自动播放、手动切换、全屏预览；产品介绍基于 Strapi Blocks 富文本编辑器渲染，结构灵活。
2. 文档在线预览：集成 @vue-office 生态，支持 .docx（Word）、.xlsx（Excel）、.pdf 三种办公文档格式的浏览器内直接预览，满足技术白皮书、规格书等复杂排版内容的在线查阅需求。
3. 品牌叙事模块：首页设置品牌故事专区，以图文轮播形式展示企业历程与核心优势；新闻/案例板块支持按时间线呈现商业项目，增强品牌信任感。
4. 国际化支持：全站实现中英双语切换，从导航菜单、产品名称到富文本内容均支持按语言环境动态渲染，满足海外客户访问需求。
5. 联系与交互：内置联系表单（ContactForm），支持在线留言；头部导航固定联系方式与邮箱跳转，降低客户触达门槛。