61 lines
3.4 KiB
Markdown
61 lines
3.4 KiB
Markdown
# 社区帖子双语短语配对设计
|
||
|
||
## 背景
|
||
|
||
社区帖子详情当前将原文完整显示后，再用独立灰色卡片集中显示译文。对于特朗普等英文来源帖子，读者需要在两块长文本之间来回查找，无法像文章详情页一样快速对照。
|
||
|
||
## 目标
|
||
|
||
- 有译文的帖子采用“一段原文短语紧跟一段译文短语”的纵向双语阅读方式。
|
||
- 参考 `uniapp/src/pages/news_detail/news_detail.vue` 的顺序配对逻辑，并把分割粒度细化到逗号、分号、句号、感叹号和问号。
|
||
- 双语帖子不再把正文前 42 个字符自动截成标题，避免产生并不存在的标题。
|
||
- 原文或译文短语数量不一致时，自动合并相邻短片段并且不丢失任何内容。
|
||
- 付费特朗普帖子解锁后若尚无译文，异步触发现有翻译接口，无需刷新页面。
|
||
- 无译文帖子、付费锁定、图片、标签、互动和评论逻辑保持不变。
|
||
|
||
## 方案比较
|
||
|
||
### 方案 A：标点短语上下交错（采用）
|
||
|
||
中英文分别按逗号、分号、句号、感叹号和问号切成短语，每组先显示原文，再显示对应译文。移动端单列阅读自然，长句也能快速对照。
|
||
|
||
### 方案 B：严格索引配对并允许空侧
|
||
|
||
直接使用较大短语数量创建配对，数量不一致时会出现只有原文或只有译文的行，无法满足一对一阅读。
|
||
|
||
### 方案 C：后端返回结构化配对译文
|
||
|
||
翻译阶段直接返回原文/译文数组，语义对齐最准确，但需要修改翻译接口、缓存格式并重新生成历史译文，超出本次前端优化范围。
|
||
|
||
## 数据与配对规则
|
||
|
||
1. 将原文和译文统一换行符并清理空行。
|
||
2. 先保留人工换行的顺序，再按 `， , ； ; 。 . ！ ! ？ ?` 拆成带原标点的短语。
|
||
3. 英文缩写、姓名首字母和小数中的句点不分割；数字内部的千分位逗号不分割。
|
||
4. 两侧短语数量相同时直接按索引配对。
|
||
5. 数量不一致时，在片段较多的一侧反复选择正文长度最短的片段，与相邻片段合并，直到两侧数量一致。
|
||
6. 逗号或分号结尾的短片段优先和下一段合并；其它短片段优先并入上一段，首段只能向后合并。
|
||
7. 合并英文片段时自动补回单个空格；中文片段直接相连，所有原始标点保留。
|
||
8. 译文为空时继续使用原来的标题、摘要展示，不进入双语模式。
|
||
|
||
## 视觉结构
|
||
|
||
- 双语正文替代原来的标题、摘要和独立译文卡。
|
||
- 每个配对组之间保留明显但克制的垂直间距。
|
||
- 原文使用正文主色和较高字重；译文使用较弱的蓝灰色，字号略小。
|
||
- 不重复显示“原文/译文”标签，依靠固定顺序和颜色层级降低视觉噪音。
|
||
- 展开/收起控制整个双语正文，避免原文和译文显示范围不一致。
|
||
|
||
## 边界情况
|
||
|
||
- 翻译接口返回空文本：按普通帖子展示。
|
||
- 原文或译文只有一段：仍形成一个配对组。
|
||
- 短语数量不一致：相邻短片段合并到数量一致后再配对，不产生空侧内容。
|
||
- 付费内容锁定：沿用后端返回的可见内容范围，不在前端拼接隐藏内容。
|
||
- 付费内容解锁：先展示完整原文，再异步获取译文并切换为短语配对，不阻塞解锁成功提示。
|
||
|
||
## 改动范围
|
||
|
||
- 修改 `uniapp/src/packages_community/pages/post_detail.vue`。
|
||
- 不修改 API、后端翻译接口、数据库和页面路由。
|