feat(deploy): production deployment setup and fixes
- Debian-based api image (bookworm-slim), docker/debian mirrors, prisma binaryTargets for openssl 3.0 - nginx: admin SPA under /admin, TLS via acme.sh (ZeroSSL) + auto-renewal cron, http->https redirect - prisma: add origin_goods.delisted migration, sync missing schema (good_image/tag_font_color/good_tags), fix users.createdAt Timestamptz - api: CORS wildcard reflection, helmet CORP cross-origin, price backfill in persistProductDetail, categoryIcon ancestor fallback, mediaByColor per-color gallery in public goods detail - admin: /admin base path (vite + router) - import-data.mjs: udt_name casting, serial sequence advance fix
This commit is contained in:
+43
-43
@@ -1,43 +1,43 @@
|
||||
# 官网首页
|
||||
|
||||
## 关键链接与国家货盘
|
||||
|
||||
- 首页“登录”“立即开始”“免费试用”“立即免费使用”等 CTA 统一通过 `window.location.href` 在当前页面跳转到 `https://inkpod.vip/user/login`。
|
||||
- “全球POD货盘”国家列表读取与产品中心相同的后台国家接口,完整展示所有已配置且有关联商品的国家及图标。
|
||||
- 桌面端国家列表按 6 列 × 2 行均匀排列;点击国家只切换下方对应货盘,不发生页面跳转。
|
||||
- 国家下方的品类卡链接到 `/product-center?countryId={后台国家ID}&categoryId={后台品类ID}`,产品中心打开后自动应用国家和品类筛选。
|
||||
|
||||
官网首页位于 `apps/website/app/pages/index.vue`,访问路径为 `/`。页面基于 Figma 节点 `897:2047` 还原,桌面设计基准为 `1440 x 6933px`。
|
||||
|
||||
## 页面结构
|
||||
|
||||
首页依次由导航、首屏、平台数据、四步流程、全球 POD 货盘、渠道能力、平台优势、公司简介、用户案例、行动区和页脚组成。各区块保持独立 Vue 组件,首页仅负责组合。
|
||||
|
||||
桌面端主要区块边界为:`80 / 980 / 1580 / 2515 / 3522 / 4276 / 4706 / 5306 / 6234 / 6572px`。流程区默认展示“选择产品”,渠道能力默认展示“店铺集成”;用户主动操作后仍可切换。
|
||||
|
||||
## 素材
|
||||
|
||||
首页图片统一存放于 `apps/website/public/`。Figma 用户案例图使用 `case-*.png` 命名,不依赖临时远程链接或随机占位图。
|
||||
|
||||
`/主视觉.png` 保持为宽高 `800 × 400` 的普通 `<img>`,渲染宽度不超过原图 800px,不作为背景图,也不会随超宽屏幕继续放大。
|
||||
|
||||
## 自动轮播
|
||||
|
||||
- 四步流程和“用强大功能,开启盈利快车道”功能区均每 2 秒自动切换,用户仍可点击或悬停立即切换。四步流程当前项的 2px 黄线会在 2 秒内从 0% 填满至 100%,填满后切换下一张;步骤标题与功能轮播项保持一致,桌面为 36px 常规字重。
|
||||
- “用强大功能,开启盈利快车道”左侧标题桌面端为 30px,四个功能项在 550px 高度内等分排列,与右侧轮播图上下对齐。
|
||||
- 用户案例在桌面和移动端均无缝横向滚动,完整循环放慢至 30 秒;悬停或聚焦时暂停。
|
||||
- `prefers-reduced-motion: reduce` 环境下关闭持续滚动动画。
|
||||
- 导航中的“选品推荐”和“解决方案”入口暂时隐藏,相关实现代码保留以便后续恢复。
|
||||
- 桌面导航使用 18px 字号,移动导航保持原有触控尺寸。
|
||||
- “全球 POD 货盘”使用固定旗帜列对齐国家名称,“更多产品”操作固定在货盘区底部。
|
||||
- 首屏“链通全球”使用主题橙色渐变,0 库存、0 关税、1 件起订以竖线分隔;平台数据卡的统计数值使用主题橙色。“全球 POD 货盘”的“更多产品”为无按钮容器的主题色文本链接。
|
||||
- 官网全局使用随项目提供的 PingFang SC Thin、Regular、Medium、Semibold 字体,首屏副标题使用 Thin 字重。首屏渐变从“通”字开始,“通”字仅保留少量渐变过渡;主标题与副标题共用左对齐容器。平台数据卡会抵消插图上移造成的底部占位,减少卡片留白。
|
||||
|
||||
## 验证
|
||||
|
||||
```bash
|
||||
pnpm --filter @inkreach/website test --run
|
||||
pnpm --filter @inkreach/website build
|
||||
```
|
||||
|
||||
浏览器以 `1440 x 1024` 视口检查首页总高、区块边界、图片加载和横向溢出。
|
||||
# 官网首页
|
||||
|
||||
## 关键链接与国家货盘
|
||||
|
||||
- 首页“登录”“立即开始”“免费试用”“立即免费使用”等 CTA 统一通过 `window.location.href` 在当前页面跳转到 `https://inkpod.vip/user/login`。
|
||||
- “全球POD货盘”国家列表读取与产品中心相同的后台国家接口,完整展示所有已配置且有关联商品的国家及图标。
|
||||
- 桌面端国家列表按 6 列 × 2 行均匀排列;点击国家只切换下方对应货盘,不发生页面跳转。
|
||||
- 国家下方的品类卡链接到 `/product-center?countryId={后台国家ID}&categoryId={后台品类ID}`,产品中心打开后自动应用国家和品类筛选。
|
||||
|
||||
官网首页位于 `apps/website/app/pages/index.vue`,访问路径为 `/`。页面基于 Figma 节点 `897:2047` 还原,桌面设计基准为 `1440 x 6933px`。
|
||||
|
||||
## 页面结构
|
||||
|
||||
首页依次由导航、首屏、平台数据、四步流程、全球 POD 货盘、渠道能力、平台优势、公司简介、用户案例、行动区和页脚组成。各区块保持独立 Vue 组件,首页仅负责组合。
|
||||
|
||||
桌面端主要区块边界为:`80 / 980 / 1580 / 2515 / 3522 / 4276 / 4706 / 5306 / 6234 / 6572px`。流程区默认展示“选择产品”,渠道能力默认展示“店铺集成”;用户主动操作后仍可切换。
|
||||
|
||||
## 素材
|
||||
|
||||
首页图片统一存放于 `apps/website/public/`。Figma 用户案例图使用 `case-*.png` 命名,不依赖临时远程链接或随机占位图。
|
||||
|
||||
`/主视觉.png` 保持为宽高 `800 × 400` 的普通 `<img>`,渲染宽度不超过原图 800px,不作为背景图,也不会随超宽屏幕继续放大。
|
||||
|
||||
## 自动轮播
|
||||
|
||||
- 四步流程和“用强大功能,开启盈利快车道”功能区均每 2 秒自动切换,用户仍可点击或悬停立即切换。四步流程当前项的 2px 黄线会在 2 秒内从 0% 填满至 100%,填满后切换下一张;步骤标题与功能轮播项保持一致,桌面为 36px 常规字重。
|
||||
- “用强大功能,开启盈利快车道”左侧标题桌面端为 30px,四个功能项在 550px 高度内等分排列,与右侧轮播图上下对齐。
|
||||
- 用户案例在桌面和移动端均无缝横向滚动,完整循环放慢至 30 秒;悬停或聚焦时暂停。
|
||||
- `prefers-reduced-motion: reduce` 环境下关闭持续滚动动画。
|
||||
- 导航中的“选品推荐”和“解决方案”入口暂时隐藏,相关实现代码保留以便后续恢复。
|
||||
- 桌面导航使用 18px 字号,移动导航保持原有触控尺寸。
|
||||
- “全球 POD 货盘”使用固定旗帜列对齐国家名称,“更多产品”操作固定在货盘区底部。
|
||||
- 首屏“链通全球”使用主题橙色渐变,0 库存、0 关税、1 件起订以竖线分隔;平台数据卡的统计数值使用主题橙色。“全球 POD 货盘”的“更多产品”为无按钮容器的主题色文本链接。
|
||||
- 官网全局使用随项目提供的 PingFang SC Thin、Regular、Medium、Semibold 字体,首屏副标题使用 Thin 字重。首屏渐变从“通”字开始,“通”字仅保留少量渐变过渡;主标题与副标题共用左对齐容器。平台数据卡会抵消插图上移造成的底部占位,减少卡片留白。
|
||||
|
||||
## 验证
|
||||
|
||||
```bash
|
||||
pnpm --filter @inkreach/website test --run
|
||||
pnpm --filter @inkreach/website build
|
||||
```
|
||||
|
||||
浏览器以 `1440 x 1024` 视口检查首页总高、区块边界、图片加载和横向溢出。
|
||||
|
||||
Reference in New Issue
Block a user