一句话
我的地址页 = 收件地址管理(列表/新增/编辑/删除/设默认),供赏袋发货申请、神秘礼物领取、积分商城兑换提交发货订单时选择收货地址。
页面说明
用户在此维护收件地址(收件人/手机号/省市区/详细地址/默认标记),地址数据存入 localStorage(wms_addresses)与三个下单入口共享;下单时优先使用默认地址,无默认时用户手动选择,也可随时跳转本页新增。入口:「我的」页服务中心 → 我的地址。
| 模块 | 内容 | 数据来源 |
|---|---|---|
| 顶部导航 | 粉色头部:状态栏 + 返回按钮 + 标题「我的地址」(绝对居中)+ 微信胶囊 | 固定 |
| 地址列表 | 地址卡片(收件人/手机号/省市区/详细地址/底部「设为默认」按钮(选中态=默认)+ 删除按钮;点击卡片主体进编辑) | localStorage wms_addresses |
| 空态 | 定位图标 + 「暂无收货地址」+ 引导 + 新增按钮 | 列表为空时 |
| 底部新增栏 | 「+ 新增地址」全宽粉按钮(满 10 个置灰) | 固定 |
| 底部操作栏(列表页) | 吸底双按钮:微信获取地址(次要,白底粉描边)+ 新增地址(主按钮) | 固定 + 微信地址 mock |
| 新增/编辑表单 | 收货人 / 手机号 / 所在地区(省市区三级选择器)/ 详细地址 / 设为默认开关;底部吸底:编辑态「删除地址」(次要红描边)+「保存」(主按钮) | 表单输入 |
| 省市区选择器 | 底部抽屉三列滚动(省/市/区) | 内置区域数据(mock,演示用) |
| 删除确认弹窗 | 「删除地址」二次确认 | 固定 |
① 地址管理:新增(「设为默认地址」开关默认关闭,首个地址也不自动默认,完全由用户决定)、编辑(点卡片主体)、删除(二次确认)、手动设默认(底部「设为默认」按钮,选中态=默认,有且仅有一个默认);② 微信获取地址:列表页底部吸底次要按钮(模拟 wx.chooseAddress),选择微信地址直接添加为新地址(不自动设默认,可在列表设为默认;满 10 条提示上限;重复地址提示已存在);③ 默认规则:删除默认地址后不自动指定,允许无默认状态;下单时无默认需手动选择或新增;④ 上限:最多 10 个地址,满额后新增入口置灰 + 提示;⑤ 校验:收件人非空、手机号(大陆 11 位 1[3-9] 开头,收货手机号不支持港澳台)、省市区必选、详细地址非空;⑥ 数据共享:wms_addresses 与赏袋/积分商城下单页共用,改完地址后下单页读取最新数据;⑦ 联动:从下单页跳转新增(URL ?add=1)自动打开新增表单,保存后返回下单页并自动选中新地址;⑧ 订单快照:订单生成后地址固定,之后修改/删除地址不影响已生成订单。
| 操作 | 页面行为 |
|---|---|
| 点地址卡片 | 进入编辑表单,回填当前地址 |
| 点「设为默认」按钮 | 设为默认:自动取消其他地址默认,toast「已设为默认地址」;已是默认再点 toast「该地址已是默认地址」 |
| 点删除 | 弹二次确认;确认后删除该地址;删除默认地址后不自动指定,保持无默认 |
| 点「+ 新增地址」 | 满 10 个 → 按钮置灰 + toast「最多可添加 10 个地址」;否则打开新增表单 |
| 点所在地区 | 弹出省市区选择器抽屉(省→市→区逐级联动),确定后回填 |
| 点「设为默认地址」开关 | 开 = 保存后该地址设为默认(自动取消原默认);关 = 普通地址 |
| 点「微信获取地址」 | 列表页底部次要按钮 → 弹出微信地址列表(模拟 wx.chooseAddress)→ 点选直接添加为新地址,toast「已添加微信地址,可在列表设为默认」;满 10 条提示上限;重复地址提示「该微信地址已存在」 |
| 编辑页点「删除地址」 | 编辑态底部红描边按钮 → 二次确认弹窗 → 确认后删除该地址并返回列表,toast「地址已删除」 |
| 点保存 | 校验通过 → 按钮禁用 + 「保存中…」(防连点)→ 写入 localStorage → toast「保存成功」;从下单页跳转新增(?add=1)时自动返回下单页 |
地址字段:收件人(姓名)/ 手机号(大陆 11 位 1[3-9] 开头)/ 省市区(province/city/district 三级)/ 详细地址(街道门牌等)/ isDefault(是否默认,有且仅有一个为 true 或全为 false)/ id(自增)/ createdAt(创建时间)。列表排序:默认地址置顶,其余按创建时间倒序(最新在前)。存储:localStorage key = wms_addresses(JSON 数组),与赏袋/积分商城下单页共享;旧版 defaultAddr 数据首次读取时自动迁移合并。上限 10 条。
| 页面 | 按钮/操作 | 场景 | 提示 |
|---|---|---|---|
| 我的地址 | 新增按钮 | 已达 10 个上限 | 按钮置灰 + toast「最多可添加 10 个地址」 |
| 我的地址 | 保存 | 收货人为空 | toast「请输入收货人姓名」 |
| 我的地址 | 保存 | 手机号为空/不足 11 位/非 1[3-9] 开头 | toast「请输入正确的手机号」 |
| 我的地址 | 保存 | 未选择省市区 | toast「请选择所在地区」 |
| 我的地址 | 保存 | 详细地址为空 | toast「请输入详细地址」 |
| 我的地址 | 保存 | 已达上限时从表单保存 | toast「最多可添加 10 个地址」 |
| 我的地址 | 删除 | 点击删除 | 二次确认弹窗「确定删除该收货地址吗?」 |
| 状态 | 说明 | 完成情况 |
|---|---|---|
| 默认 | 有地址且有默认:列表展示卡片,默认地址按钮为粉色「默认」选中态 | ✅ 已实现(预置 5 条演示数据,含 1 条默认) |
| 无默认 | 有地址但无默认(删除默认后):所有卡片按钮均为「设为默认」,下单时手动选择 | ✅ 已实现 |
| 空态 | 无任何地址:显示空态 + 新增引导 | ✅ 已实现(可在地址页删光全部地址演示) |
| 上限 | 10 个地址:新增入口置灰 + toast | ✅ 已实现 |
| 保存中 | 提交防连点:按钮禁用 + 「保存中…」 | ✅ 已实现 |