安顿官网产品系统

项目宣传官网手表帮助购买该手表的人更好的提供线上服务，以及线上介绍，以及宣传公司手表功能，和链接商城系统，并且为先要加盟公司的人一个入口以及宣传线下实体店位置初衷进行开发

一、展示类模块（让用户“看”）
产品预览、大图展示
视频介绍、线上APP介绍
公司详细信息展示
公司线上影响新闻（通常指“新闻动态”或“媒体报道”）
二、功能/服务类模块（让用户“用”）
搜索（查找功能）
商城链接（跳转或下单功能）
三、交互/引流类模块（让用户“连”）
加盟地址连接（地图导航或加盟入口）
线上客服热线（咨询沟通功能）

本项目基于 Vue 3 + Vite 构建，采用组件化开发模式，路由层面按业务模块（首页、关于、招商、预警系统、商城等）进行懒加载拆分，保证首屏加载效率。状态管理使用 Pinia 统一维护全局配置与导航菜单数据，网络请求层通过 Axios 封装拦截器实现 Token 自动注入与统一错误处理。
在交互体验上，首页及内页通过路由元信息（meta）控制头部透明/滚动切换效果；产品展示区集成 Swiper 实现多场景轮播；招商模块利用 QRCode 库动态生成带 Logo 的授权二维码；预警系统介绍页采用 Fabric.js 实现 Canvas 图像合成与海报编辑功能。样式层面通过 postcss-px-to-viewport 实现 PC 与 H5 的响应式适配，项目经 Vite 打包后部署至宝塔面板，通过 history 模式配置路由 fallback 支持子路径直接访问。