ee078b61bc
- 后台全面引入 Naive UI 组件库，统一 UI 规范 - 前台 usePublicApi 切换到 API 调用（GET /api/content/[key]） - 前后台数据源统一（site_content 表） - 产品线统一管理（tour/camp/course 三套编辑器） - 产品数据归一化（itinerary/faq/pricing 格式统一） - 表单提交 API 改写入 submissions 表 - 新增 submissions 标记已读 API - site-content PUT 支持 upsert - 修复前台 bug（stories 路由冲突、占位符警告、selector breadcrumb） - 消除 PageHero 类型警告（useSEO reactive 修复） - 25 个前台页面全部 HTTP 200，展示效果不变 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
598 行
20 KiB
Markdown
598 行
20 KiB
Markdown
# 呼籁旅行官网 — 后台对接方案（CMS Integration）
|
||
|
||
> 本文档分析官网所有内容模块，标注哪些需要「写活」（后台可增删改查），哪些是固定结构不需要动态化，以及推荐的数据库设计和对接方式。
|
||
|
||
---
|
||
|
||
## 一、内容动态化分级
|
||
|
||
### 第一优先级：高频更新（运营同学日常操作）
|
||
|
||
| 模块 | 当前文件 | 操作类型 | 更新频率 | 说明 |
|
||
|------|---------|---------|---------|------|
|
||
| **客户评价** | `reviews.json` | 增、改、删 | 每周 | 每次收到好评都要加，是最高频的更新 |
|
||
| **FAQ问答** | `faq.json` | 增、改、删 | 每月 | 客户常问的问题会变化，需要随时补充和调整 |
|
||
| **联系方式** | `contact.json` | 改 | 偶尔 | 微信号、电话、邮箱可能变更 |
|
||
| **SEO信息** | `seo.json` | 改 | 偶尔 | 优化标题和描述以提升搜索排名 |
|
||
|
||
### 第二优先级：季节性更新（产品经理/罗盘操作）
|
||
|
||
| 模块 | 当前文件 | 操作类型 | 更新频率 | 说明 |
|
||
|------|---------|---------|---------|------|
|
||
| **产品版本** | `products.json → versions` | 增、改、删 | 每季 | 产品迭代到V10、新增冬季版等 |
|
||
| **小蒙马夏令营** | `products.json → summerCamp` | 改 | 每年 | 年龄、活动、定位调整 |
|
||
| **选择指南** | `products.json → selectionGuide` | 改 | 每季 | 新产品上线后需要更新推荐逻辑 |
|
||
| **定价说明** | `products.json → pricingPhilosophy` | 改 | 偶尔 | 价格策略调整时 |
|
||
| **产品叙事** | `products.json → narrative` | 改 | 偶尔 | 品牌定位调整时 |
|
||
|
||
### 第三优先级：低频变更（品牌层面）
|
||
|
||
| 模块 | 当前文件 | 操作类型 | 更新频率 | 说明 |
|
||
|------|---------|---------|---------|------|
|
||
| **品牌信息** | `brand.json` | 改 | 极少 | slogan、信任数据、差异化卖点 |
|
||
| **关于我们** | `about.json` | 改 | 极少 | 品牌故事、子公司、资质、团队、文化 |
|
||
| **导航** | `navigation.json` | 改 | 极少 | 新增/调整导航页面 |
|
||
|
||
### 不需要动态化（代码层面）
|
||
|
||
| 项目 | 说明 |
|
||
|------|------|
|
||
| 页面结构/布局 | Vue组件，需开发介入 |
|
||
| 样式/配色 | Less变量，需开发介入 |
|
||
| JSON-LD结构化数据 | 自动从内容数据生成，无需单独管理 |
|
||
| sitemap.xml | 只有页面增减时才需要改 |
|
||
| robots.txt | 基本不变 |
|
||
|
||
---
|
||
|
||
## 二、每个JSON文件的字段级分析
|
||
|
||
### 1. reviews.json（评价管理 — 最高频）
|
||
|
||
```
|
||
后台需要的功能：
|
||
✅ 新增评价（上传截图 + 填写文字）
|
||
✅ 编辑评价
|
||
✅ 删除评价
|
||
✅ 调整排序
|
||
✅ 修改汇总数据（总数、好评率、关键词）
|
||
✅ 管理筛选标签（场景、关心点）
|
||
|
||
字段说明：
|
||
summary:
|
||
- totalCount: number → 后台可改（或自动计算）
|
||
- approvalRate: string → 后台可改
|
||
- keywords: string[] → 后台可增删
|
||
|
||
items[]:
|
||
- id: number → 自动生成
|
||
- nickname: string → 后台填写
|
||
- travelDate: string → 后台填写（如"2025年7月"）
|
||
- productVersion: string → 后台选择（关联产品列表）
|
||
- screenshot: string → 后台上传图片，存储路径
|
||
- content: string → 后台填写（与截图内容一致，供AI抓取）
|
||
- scenes: string[] → 后台多选标签（带小孩/家庭游/情侣/朋友/带老人...）
|
||
- concerns: string[] → 后台多选标签（领队服务/行程安排/拍照超美/司机服务...）
|
||
```
|
||
|
||
### 2. faq.json（问答管理 — 高频）
|
||
|
||
```
|
||
后台需要的功能：
|
||
✅ 新增分类
|
||
✅ 在分类下新增/编辑/删除问答
|
||
✅ 调整分类排序和问答排序
|
||
✅ 管理相关链接
|
||
|
||
字段说明：
|
||
categories[]:
|
||
- id: string → 自动生成
|
||
- name: string → 后台填写（如"产品类"）
|
||
- questions[]:
|
||
- id: string → 自动生成
|
||
- question: string → 后台填写
|
||
- answer: string → 后台填写（支持长文本）
|
||
- relatedLinks[]: → 后台配置
|
||
- text: string → 链接文字
|
||
- url: string → 链接地址（下拉选择站内页面）
|
||
```
|
||
|
||
### 3. products.json（产品管理 — 季节性）
|
||
|
||
```
|
||
后台需要的功能：
|
||
✅ 编辑产品叙事文案
|
||
✅ 新增/编辑/删除/排序产品版本
|
||
✅ 编辑夏令营信息
|
||
✅ 编辑选择指南
|
||
✅ 编辑定价说明
|
||
|
||
字段说明：
|
||
narrative: string → 后台富文本编辑
|
||
|
||
versions[]:
|
||
- id: string → 自动生成（如"v9-6d5n-family"）
|
||
- name: string → 产品名称
|
||
- days: number → 天数
|
||
- nights: number → 晚数
|
||
- audience: string → 适合人群
|
||
- description: string → 产品描述
|
||
- highlights: string[] → 亮点列表（可增删）
|
||
- tag: string → 标签（如"经典版"/"人气王"）
|
||
|
||
summerCamp:
|
||
- name: string → 名称
|
||
- ageRange: string → 年龄范围
|
||
- positioning: string → 定位描述
|
||
- coreActivities: array → 核心活动列表
|
||
- differenceFromV9: string → 与V9区别说明
|
||
|
||
selectionGuide:
|
||
- byVacationLength[]: → 按假期长度推荐
|
||
- byChildAge[]: → 按孩子年龄推荐
|
||
- byPreference[]: → 按偏好推荐
|
||
（每条：condition + recommendation，recommendation关联产品id）
|
||
|
||
pricingPhilosophy: string → 后台富文本编辑
|
||
```
|
||
|
||
### 4. contact.json（联系方式 — 偶尔更新）
|
||
|
||
```
|
||
后台需要的功能：
|
||
✅ 编辑联系渠道信息
|
||
✅ 新增/删除联系渠道
|
||
✅ 上传/更换二维码图片
|
||
✅ 编辑安全提示文案
|
||
|
||
字段说明：
|
||
channels[]:
|
||
- type: string → 渠道类型（wechat/phone/email/address等）
|
||
- label: string → 显示名称
|
||
- value: string → 联系值（微信号/电话/邮箱/地址）
|
||
- qrImage: string|null → 二维码图片路径（可选）
|
||
- primary: boolean → 是否主要渠道
|
||
- description: string → 补充说明
|
||
|
||
securityNotice: string → 安全提醒文案
|
||
```
|
||
|
||
### 5. brand.json（品牌信息 — 极少更新）
|
||
|
||
```
|
||
后台需要的功能：
|
||
✅ 编辑品牌基础信息
|
||
✅ 编辑信任数据
|
||
✅ 编辑差异化卖点
|
||
|
||
字段说明：
|
||
name: string → 品牌名
|
||
fullName: string → 公司全称
|
||
domain: string → 域名
|
||
url: string → 网址
|
||
slogan:
|
||
- emotional: string → 情感化口号
|
||
- functional: string → 功能化口号
|
||
trustStats[]:
|
||
- value: string → 数值（如"8000+"）
|
||
- unit: string → 单位（如"组"）
|
||
- label: string → 标签（如"已服务家庭"）
|
||
- attribution: string → 补充说明（可选）
|
||
differentiators[]:
|
||
- title: string → 卖点标题
|
||
- description: string → 卖点描述
|
||
icp: string → ICP备案号
|
||
eContract: string → 电子合同资质
|
||
```
|
||
|
||
### 6. about.json（关于我们 — 极少更新）
|
||
|
||
```
|
||
后台需要的功能：
|
||
✅ 编辑品牌故事
|
||
✅ 管理子公司列表
|
||
✅ 管理资质列表
|
||
✅ 编辑团队和文化
|
||
|
||
字段说明：
|
||
story:
|
||
- sections[]: → 品牌故事段落
|
||
- title/content → 标题+内容
|
||
- foundingMoment: → 创始故事
|
||
- scene/reflection → 场景+感悟
|
||
subsidiaries[]:
|
||
- name: string → 公司名
|
||
- role: string → 业务角色
|
||
qualifications[]:
|
||
- name: string → 资质名称
|
||
- detail: string → 具体说明
|
||
team:
|
||
- summary: string → 团队概述
|
||
culture:
|
||
- values[]: → 企业文化
|
||
- word/expression → 关键词+表达
|
||
- transparency: string → 透明度说明
|
||
```
|
||
|
||
### 7. seo.json（SEO信息 — 偶尔优化）
|
||
|
||
```
|
||
后台需要的功能：
|
||
✅ 编辑每个页面的SEO信息
|
||
|
||
字段说明：
|
||
pages:
|
||
[pageKey]: → 页面标识（home/about/products/faq/reviews/contact）
|
||
- title: string → 页面标题（60字符内）
|
||
- description: string → 页面描述（155字符内）
|
||
- h1: string → 页面H1标题
|
||
- ogImage: string → 社交分享图片
|
||
```
|
||
|
||
### 8. navigation.json（导航 — 极少变更）
|
||
|
||
```
|
||
后台需要的功能：
|
||
✅ 编辑导航项（文字、链接）
|
||
✅ 调整排序
|
||
|
||
header[]:
|
||
- text: string → 导航文字
|
||
- to: string → 链接地址
|
||
footer[]:
|
||
- title: string → 分组标题
|
||
- links[]:
|
||
- text/to → 链接文字+地址
|
||
```
|
||
|
||
---
|
||
|
||
## 三、推荐的技术方案
|
||
|
||
### 方案 A：JSON文件 + 简易后台（推荐起步）
|
||
|
||
**适合阶段**：现在 → 日均UV 1000以内
|
||
|
||
```
|
||
架构：
|
||
┌──────────┐ ┌──────────────┐ ┌──────────────┐
|
||
│ 后台页面 │ ──→ │ API (读写JSON) │ ──→ │ data/*.json │
|
||
│ (Vue/React)│ │ (Node.js) │ │ (文件存储) │
|
||
└──────────┘ └──────────────┘ └──────────────┘
|
||
│
|
||
↓ 写完后触发
|
||
┌──────────────┐
|
||
│ nuxi generate │ → 重新生成静态页面
|
||
└──────────────┘
|
||
|
||
优点：
|
||
- 零数据库成本
|
||
- 当前代码零改动，后台只操作JSON文件
|
||
- 生成的还是静态页面，速度最快
|
||
- 适合当前团队规模
|
||
|
||
缺点：
|
||
- 每次改内容需要重新 generate（约30秒）
|
||
- 多人同时编辑可能冲突
|
||
```
|
||
|
||
### 方案 B：数据库 + API + SSR（推荐中期）
|
||
|
||
**适合阶段**：有后台系统后
|
||
|
||
```
|
||
架构：
|
||
┌──────────┐ ┌──────────────┐ ┌──────────────┐
|
||
│ 后台页面 │ ──→ │ API Server │ ──→ │ 数据库 │
|
||
│ │ │ (Node.js) │ │ (MySQL/PG) │
|
||
└──────────┘ └──────────────┘ └──────────────┘
|
||
│
|
||
↓ 同时提供
|
||
┌──────────────┐
|
||
│ Nuxt SSR渲染 │ → 实时读数据库渲染
|
||
└──────────────┘
|
||
|
||
改动点：
|
||
- nuxt.config.js: ssr改为true（当前已是），去掉prerender
|
||
- 页面中 import JSON → 改为 useFetch('/api/xxx')
|
||
- 新增 server/api/ 目录下的接口
|
||
```
|
||
|
||
---
|
||
|
||
## 四、数据库设计（方案B用）
|
||
|
||
### 表结构
|
||
|
||
```sql
|
||
-- 1. 评价表（最高频）
|
||
CREATE TABLE reviews (
|
||
id INT PRIMARY KEY AUTO_INCREMENT,
|
||
nickname VARCHAR(50) NOT NULL,
|
||
travel_date VARCHAR(20), -- "2025年7月"
|
||
product_version VARCHAR(100), -- 关联产品名称
|
||
screenshot_url VARCHAR(255), -- 截图CDN地址
|
||
content TEXT NOT NULL, -- 评价文字（AI抓取用）
|
||
scenes JSON, -- ["带小孩", "家庭游"]
|
||
concerns JSON, -- ["领队服务", "行程安排"]
|
||
sort_order INT DEFAULT 0, -- 排序权重
|
||
is_visible BOOLEAN DEFAULT TRUE, -- 是否显示
|
||
created_at DATETIME DEFAULT NOW(),
|
||
updated_at DATETIME DEFAULT NOW() ON UPDATE NOW()
|
||
);
|
||
|
||
-- 2. 评价汇总表
|
||
CREATE TABLE review_summary (
|
||
id INT PRIMARY KEY DEFAULT 1,
|
||
total_count INT DEFAULT 0,
|
||
approval_rate VARCHAR(10), -- "98%"
|
||
keywords JSON, -- ["贴心", "孩子玩疯了"]
|
||
updated_at DATETIME DEFAULT NOW() ON UPDATE NOW()
|
||
);
|
||
|
||
-- 3. FAQ分类表
|
||
CREATE TABLE faq_categories (
|
||
id VARCHAR(50) PRIMARY KEY, -- "product"
|
||
name VARCHAR(50) NOT NULL, -- "产品类"
|
||
sort_order INT DEFAULT 0,
|
||
created_at DATETIME DEFAULT NOW()
|
||
);
|
||
|
||
-- 4. FAQ问答表
|
||
CREATE TABLE faq_questions (
|
||
id VARCHAR(50) PRIMARY KEY,
|
||
category_id VARCHAR(50) NOT NULL,
|
||
question VARCHAR(200) NOT NULL,
|
||
answer TEXT NOT NULL,
|
||
related_links JSON, -- [{"text":"查看产品","url":"/products"}]
|
||
sort_order INT DEFAULT 0,
|
||
is_visible BOOLEAN DEFAULT TRUE,
|
||
created_at DATETIME DEFAULT NOW(),
|
||
updated_at DATETIME DEFAULT NOW() ON UPDATE NOW(),
|
||
FOREIGN KEY (category_id) REFERENCES faq_categories(id)
|
||
);
|
||
|
||
-- 5. 产品版本表
|
||
CREATE TABLE products (
|
||
id VARCHAR(50) PRIMARY KEY, -- "v9-6d5n-family"
|
||
name VARCHAR(100) NOT NULL,
|
||
days INT,
|
||
nights INT,
|
||
audience VARCHAR(100),
|
||
description TEXT,
|
||
highlights JSON, -- ["亮点1", "亮点2"]
|
||
tag VARCHAR(20), -- "人气王"
|
||
sort_order INT DEFAULT 0,
|
||
is_visible BOOLEAN DEFAULT TRUE,
|
||
created_at DATETIME DEFAULT NOW(),
|
||
updated_at DATETIME DEFAULT NOW() ON UPDATE NOW()
|
||
);
|
||
|
||
-- 6. 夏令营信息表
|
||
CREATE TABLE summer_camp (
|
||
id INT PRIMARY KEY DEFAULT 1,
|
||
name VARCHAR(100),
|
||
age_range VARCHAR(20),
|
||
positioning TEXT,
|
||
core_activities JSON,
|
||
difference_from_v9 TEXT,
|
||
updated_at DATETIME DEFAULT NOW() ON UPDATE NOW()
|
||
);
|
||
|
||
-- 7. 联系渠道表
|
||
CREATE TABLE contact_channels (
|
||
id INT PRIMARY KEY AUTO_INCREMENT,
|
||
type VARCHAR(20) NOT NULL, -- "wechat"/"phone"/"email"...
|
||
label VARCHAR(50) NOT NULL,
|
||
value VARCHAR(200) NOT NULL,
|
||
qr_image_url VARCHAR(255),
|
||
is_primary BOOLEAN DEFAULT FALSE,
|
||
description VARCHAR(200),
|
||
sort_order INT DEFAULT 0,
|
||
created_at DATETIME DEFAULT NOW()
|
||
);
|
||
|
||
-- 8. 品牌信息表（单行表）
|
||
CREATE TABLE brand_info (
|
||
id INT PRIMARY KEY DEFAULT 1,
|
||
name VARCHAR(50),
|
||
full_name VARCHAR(100),
|
||
domain VARCHAR(50),
|
||
slogan_emotional VARCHAR(200),
|
||
slogan_functional VARCHAR(200),
|
||
trust_stats JSON, -- 4个信任数据
|
||
differentiators JSON, -- 5个差异化卖点
|
||
icp VARCHAR(50),
|
||
e_contract VARCHAR(100),
|
||
updated_at DATETIME DEFAULT NOW() ON UPDATE NOW()
|
||
);
|
||
|
||
-- 9. 关于我们（单行表）
|
||
CREATE TABLE about_info (
|
||
id INT PRIMARY KEY DEFAULT 1,
|
||
story JSON, -- 品牌故事结构
|
||
subsidiaries JSON, -- 12家子公司
|
||
qualifications JSON, -- 资质列表
|
||
team JSON, -- 团队介绍
|
||
culture JSON, -- 文化价值观
|
||
updated_at DATETIME DEFAULT NOW() ON UPDATE NOW()
|
||
);
|
||
|
||
-- 10. SEO信息表
|
||
CREATE TABLE seo_pages (
|
||
page_key VARCHAR(20) PRIMARY KEY, -- "home"/"about"/...
|
||
title VARCHAR(100),
|
||
description VARCHAR(200),
|
||
h1 VARCHAR(100),
|
||
og_image VARCHAR(255),
|
||
updated_at DATETIME DEFAULT NOW() ON UPDATE NOW()
|
||
);
|
||
|
||
-- 11. 导航表
|
||
CREATE TABLE navigation (
|
||
id INT PRIMARY KEY AUTO_INCREMENT,
|
||
position ENUM('header', 'footer') NOT NULL,
|
||
parent_title VARCHAR(50), -- footer分组标题，header为NULL
|
||
text VARCHAR(50) NOT NULL,
|
||
url VARCHAR(100) NOT NULL,
|
||
sort_order INT DEFAULT 0
|
||
);
|
||
|
||
-- 12. 内容文案表（产品叙事、定价说明等长文本）
|
||
CREATE TABLE content_blocks (
|
||
block_key VARCHAR(50) PRIMARY KEY, -- "product_narrative" / "pricing_philosophy" / "security_notice"
|
||
content TEXT NOT NULL,
|
||
updated_at DATETIME DEFAULT NOW() ON UPDATE NOW()
|
||
);
|
||
|
||
-- 13. 选择指南表
|
||
CREATE TABLE selection_guide (
|
||
id INT PRIMARY KEY AUTO_INCREMENT,
|
||
guide_type ENUM('vacation_length', 'child_age', 'preference'),
|
||
condition_text VARCHAR(100), -- "3-4天假期"
|
||
recommendation VARCHAR(50), -- 关联产品id
|
||
sort_order INT DEFAULT 0
|
||
);
|
||
```
|
||
|
||
### 图片存储
|
||
|
||
```
|
||
推荐方案：
|
||
- 评价截图、二维码、Logo等 → 对象存储（阿里云OSS / 腾讯云COS）
|
||
- 后台上传图片 → API接收 → 上传到OSS → 返回CDN地址
|
||
- 数据库只存URL，不存文件
|
||
|
||
目录规划：
|
||
/hulai-oss/
|
||
├── reviews/ 评价截图
|
||
├── qrcodes/ 二维码图片
|
||
├── logo/ 品牌Logo
|
||
└── og/ 社交分享图
|
||
```
|
||
|
||
---
|
||
|
||
## 五、后台管理界面建议
|
||
|
||
### 后台菜单结构
|
||
|
||
```
|
||
📊 数据看板
|
||
- 内容统计（评价数、FAQ数、产品数）
|
||
|
||
📝 内容管理
|
||
├── 客户评价 → 列表 + 新增 + 编辑 + 删除 + 拖拽排序
|
||
├── 常见问答 → 分类管理 + 问答列表 + 拖拽排序
|
||
├── 旅行产品 → 产品列表 + 编辑 + 夏令营 + 选择指南
|
||
└── 联系方式 → 渠道列表 + 编辑 + 上传二维码
|
||
|
||
🏢 品牌设置
|
||
├── 品牌信息 → 基础信息 + 信任数据 + 差异化卖点
|
||
├── 关于我们 → 品牌故事 + 子公司 + 资质 + 团队 + 文化
|
||
└── SEO设置 → 6个页面的标题/描述/H1
|
||
|
||
⚙️ 系统设置
|
||
├── 导航管理 → 页头/页脚导航编辑
|
||
└── 发布管理 → 一键重新生成静态页面
|
||
```
|
||
|
||
### 后台技术栈建议
|
||
|
||
```
|
||
推荐：
|
||
- 前端：Vue 3 + Element Plus（与官网技术栈统一）
|
||
- 后端：Node.js + Express/Koa（或 Nuxt server routes）
|
||
- 数据库：MySQL 8.0（阿里云RDS）
|
||
- 图片：阿里云OSS + CDN
|
||
- 部署：同一台服务器，后台走 /admin 路径
|
||
|
||
对接方式：
|
||
1. 后台修改数据 → 写入数据库
|
||
2. 点击「发布」 → 触发 nuxi generate
|
||
3. 生成的静态文件部署到CDN/Nginx
|
||
|
||
或者（更简单的过渡方案）：
|
||
1. 后台修改数据 → 直接修改 data/*.json 文件
|
||
2. 点击「发布」 → 触发 nuxi generate
|
||
3. 无需数据库，JSON就是数据库
|
||
```
|
||
|
||
---
|
||
|
||
## 六、当前代码对接友好度评估
|
||
|
||
### 已经写活的（直接能对接）
|
||
|
||
| 内容 | 数据源 | 对接方式 |
|
||
|------|-------|---------|
|
||
| 所有评价 | `reviews.json` | 替换为API即可 |
|
||
| 所有FAQ | `faq.json` | 替换为API即可 |
|
||
| 所有产品 | `products.json` | 替换为API即可 |
|
||
| 所有联系方式 | `contact.json` | 替换为API即可 |
|
||
| 品牌信息 | `brand.json` | 替换为API即可 |
|
||
| 关于信息 | `about.json` | 替换为API即可 |
|
||
| SEO信息 | `seo.json` | 替换为API即可 |
|
||
| 导航 | `navigation.json` | 替换为API即可 |
|
||
|
||
### 对接时的改动量
|
||
|
||
```
|
||
每个页面改动量很小，只需要把：
|
||
import data from '~/data/xxx.json'
|
||
改为：
|
||
const { data } = await useFetch('/api/xxx')
|
||
|
||
大约 6个页面 + 3个组件（Header/Footer/MobileNav）= 9个文件
|
||
每个文件改动 1-3 行代码
|
||
总改动量：约30行代码
|
||
```
|
||
|
||
### 评价图片已经对接友好
|
||
|
||
```
|
||
当前：screenshot: "/images/reviews/review-001.jpg" （本地路径）
|
||
对接后：screenshot: "https://cdn.1814.love/reviews/review-001.jpg" （CDN地址）
|
||
|
||
组件中用的是 :src="item.screenshot"，路径换成CDN地址直接生效，零改动。
|
||
```
|
||
|
||
---
|
||
|
||
## 七、给运营同学的速查表
|
||
|
||
### 现在（没有后台之前）怎么改内容
|
||
|
||
| 要改什么 | 找哪个文件 | 怎么改 |
|
||
|---------|----------|-------|
|
||
| 新增客户评价 | `data/reviews.json` | 在 `items` 数组里加一条，图片放到 `public/images/reviews/` |
|
||
| 修改FAQ问答 | `data/faq.json` | 找到对应问题直接改文字 |
|
||
| 修改产品信息 | `data/products.json` | 找到对应版本直接改 |
|
||
| 换微信号/电话 | `data/contact.json` | 找到对应渠道改 `value` |
|
||
| 改页面标题/描述 | `data/seo.json` | 找到对应页面改 |
|
||
| 改品牌口号 | `data/brand.json` | 改 `slogan` 下的文字 |
|
||
| 改关于我们 | `data/about.json` | 找到对应位置改 |
|
||
|
||
**改完后**：需要运行 `npx nuxi generate` 重新生成页面，然后重新部署。
|
||
|
||
### 有后台之后怎么改
|
||
|
||
登录后台 → 找到对应模块 → 编辑 → 点击「发布」→ 完成
|
||
|
||
---
|
||
|
||
## 八、总结
|
||
|
||
```
|
||
当前架构优势：
|
||
✅ 所有内容都在 8 个 JSON 文件里，结构清晰
|
||
✅ 数据和展示完全分离，后台对接只需改数据源
|
||
✅ 对接工作量极小（约30行代码改动）
|
||
✅ 可以分步走：先用JSON文件+手动generate，再上后台
|
||
|
||
建议路线图：
|
||
Phase 1（现在）：JSON文件 + 手动维护 + nuxi generate
|
||
Phase 2（1-2月后）：简易后台 + 读写JSON + 一键generate
|
||
Phase 3（业务增长后）：数据库 + API + CDN图片 + SSR渲染
|
||
```
|