feat(app): 添加多模板关于我们页面及相关路由和404页面
- 新增404页面,优化未找到页面体验,避免被搜索引擎索引 - 增加文件代理接口,隐藏真实文件服务器地址,支持文件请求代理 - 实现/article、/case、/product及/page动态路由兼容列表与详情展示 - 添加动态CMS页面兼容入口处理旧式路径,统一路由与SEO设置 - 新增模板1、模板7、模板2、模板3关于我们页面,实现多模板支持 - 模板增强支持CMS单页内容加载及SEO信息动态设置 - 配置环境变量及Git忽略文件规则辅助开发和构建环境管理
This commit is contained in:
@@ -0,0 +1,45 @@
|
||||
# template-07 首页修复记录(2026-07-30)
|
||||
|
||||
## 修复项
|
||||
|
||||
| # | 截图 | 问题 | 根因 | 修复 |
|
||||
|---|------|------|------|------|
|
||||
| 1 | 4 个优势卡片 | 图标位置空白 | `icon: 'IconBuilding'` 是字符串,Vue 不会自动解析为组件;项目里也没注册这些 icon 组件 | `app/templates/template-07/components/FeatureSection.vue` 用 4 个 `v-if` 内联 SVG 替换字符串 icon(建筑/包裹/公文包/消息气泡) |
|
||||
| 2 | 关于我们右侧 | 显示公司 Logo | `siteInfo.websiteLogo` 优先于本地图 | `Home.vue` 新增 `aboutImage` computed:读 `siteInfo.config.aboutImage`(后台上传)> 本地图兜底 |
|
||||
| 3 | 最新动态首图 | 图片不显示 | 后端图 `file.websoft.top/.../b798...png` 已 **404**(上游失效) | `Home.vue` 新增 `articleImage()` + `onArticleImgError()`:浏览器加载失败时自动 fallback 到 `news-default.jpg` |
|
||||
| 4 | 关注我们二维码 | 总显示一张硬编码图 | `nuxt.config.ts` 第 98 行 `wxQrcode` 默认值写死了 `https://oss.wsdns.cn/20260721/ad1b221c...png` | 改为 `''` 强制读后端 `siteInfo.config.wxQrcode || siteInfo.qrCode` |
|
||||
|
||||
## 文件清单
|
||||
|
||||
### 代码改动
|
||||
- `app/templates/template-07/components/FeatureSection.vue` — 4 个内联 SVG icon
|
||||
- `app/templates/template-07/pages/Home.vue` — aboutImage / articleImage / onArticleImgError
|
||||
- `app/templates/template-01/pages/Home.vue` — 同步改(保持克隆源一致)
|
||||
- `nuxt.config.ts` — 去掉 wxQrcode 硬编码
|
||||
|
||||
### 新增资源
|
||||
- `public/images/template-07/about.jpg` — 关于我们兜底图(团队办公场景)
|
||||
- `public/images/template-07/news-default.jpg` — 最新动态文章封面兜底图
|
||||
- `public/images/template-01/about.jpg` — 同上(template-01 也用)
|
||||
- `public/images/template-01/news-default.jpg` — 同上
|
||||
|
||||
### 辅助产物
|
||||
- `outputs/01-about-company-team.jpg` — 生成原图(用户查看效果)
|
||||
- `outputs/02-news-zoujinhuiicai-juyun.jpg` — 生成原图
|
||||
- `scripts/upload-to-oss.sh` — OSS 上传脚本(需要 admin token)
|
||||
|
||||
## 如何替换为后台上传图
|
||||
|
||||
1. 登录 admin 后台(`https://server.websoft.top`)拿 token(cookie 或 Authorization header)
|
||||
2. 浏览器 DevTools → Network → 任意 XHR → Request Headers → `Authorization: Bearer xxx` 复制
|
||||
3. `ADMIN_TOKEN="eyJ..." bash scripts/upload-to-oss.sh` 上传
|
||||
4. 把返回的 URL:
|
||||
- 填到「网站设置 → 关于我们图片」字段(前端读 `siteInfo.config.aboutImage`)
|
||||
- 或者直接 PUT 到 cms-article 10557 的 `image` 字段
|
||||
|
||||
## 已验证
|
||||
- dev server 3002 启动 ✅
|
||||
- 4 个图标 SSR 渲染 ✅(HTML 中含 4 个 `w-6 h-6 text-blue-600` SVG)
|
||||
- 关于我们图:渲染 `src="/images/template-07/about.jpg"`(200 OK)✅
|
||||
- 最新动态图:SSR 仍输出后端 URL(浏览器侧 onError 自动回退到本地图)
|
||||
- 关注我们二维码:硬编码 URL 已不存在(`grep -c "ad1b221c" = 0`)✅
|
||||
Reference in New Issue
Block a user