docs: define call mobile popup layout
This commit is contained in:
@@ -0,0 +1,28 @@
|
||||
# 呼叫热线弹窗布局调整设计
|
||||
|
||||
## 目标
|
||||
|
||||
调整呼叫热线弹窗的信息层级,使标题和关闭按钮稳定显示在弹窗顶部,并提高两个电话号码的可读性与可点击性。
|
||||
|
||||
## 设计
|
||||
|
||||
- 将标题和关闭按钮保留在独立头部区域,头部不参与正文内容排版,也不随正文压缩。
|
||||
- 正文继续展示原有提示文案,不改变文案含义。
|
||||
- 两个电话号码从行内文本中拆出,各自使用独立块级容器并各占一行。
|
||||
- 电话号码字号调整为 `20px`,保留现有蓝色样式和点击拨号行为。
|
||||
- 使用 Tailwind CSS 工具类完成布局调整,不新增 SCSS 布局样式。
|
||||
|
||||
## 数据与交互
|
||||
|
||||
电话号码常量、弹窗打开/关闭事件及 `uni.makePhoneCall` 调用保持不变。点击任一电话号码时,仍先关闭弹窗,再呼起对应号码的系统拨号界面。
|
||||
|
||||
## 验证
|
||||
|
||||
- 结构检查确认头部与正文是相邻且独立的区域。
|
||||
- 结构检查确认两个电话号码分别位于独立块级元素中。
|
||||
- 结构检查确认两个号码均使用更大的字号并保留独立点击事件。
|
||||
- 运行 `git diff --check` 检查格式问题。
|
||||
|
||||
## 范围
|
||||
|
||||
仅修改 `src/pages/ChatModule/CallMobile/index.vue` 的弹窗模板布局,不调整业务逻辑、文案内容或其他页面。
|
||||
Reference in New Issue
Block a user