9:41
暂无收货地址
添加地址后,提交发货订单时可直接使用
微信获取地址模拟 wx.chooseAddress
删除地址
确定删除该收货地址吗?
地址列表
1
微信获取地址
底部吸底次要按钮(白底粉描边,与「新增地址」主按钮并排)→ 弹出微信地址列表(模拟 wx.chooseAddress)→ 点选直接添加为新地址(不自动设默认);满 10 条提示上限;重复地址提示「该微信地址已存在」
2
地址卡片
每张卡片:收件人/手机号 + 省市区/详细地址 + 底部操作行(「设为默认」按钮 + 删除按钮)。默认地址的按钮显示粉色「默认」选中态(无单独默认标签)。点击卡片主体(地址信息区)进入编辑
3
设为默认
点击卡片底部「设为默认」按钮:该地址设为默认(自动取消其他地址的默认,有且仅有一个默认);已是默认的卡片按钮为粉色「默认」选中态,点击提示「该地址已是默认地址」。无默认状态说明:删除默认地址后不自动指定,保持无默认
4
编辑 / 删除
编辑:点击卡片主体进编辑表单(无独立编辑按钮);删除:右侧垃圾桶,二次确认弹窗后删除。删除默认地址后不自动提升,允许无默认状态(下单时手动选择)
5
空态
无地址时显示定位图标 + 「暂无收货地址」+ 引导文案(v1.1 起不放按钮,新增入口在底部吸底栏,避免重复)
6
底部操作栏
吸底双按钮(白底圆角底栏):次要按钮「微信获取地址」(白底粉描边)+ 主按钮「+ 新增地址」(粉色)。满 10 个地址时新增置灰,点击 toast「最多可添加 10 个地址」
新增 / 编辑表单
7
字段
收货人(必填)/ 手机号(必填,大陆 11 位 1[3-9] 开头——收货手机号,不支持港澳台)/ 所在地区(省市区三级联动选择器,必选)/ 详细地址(必填)
8
设为默认开关
表单底部「设为默认地址」开关,默认关闭;勾选后保存即设为默认(自动取消原默认)。首个地址也不自动默认,完全由用户决定
9
省市区选择器
底部抽屉三列滚动(省/市/区),点选高亮,确定后回填表单
10
保存 / 删除
编辑态底部双按钮:次要按钮「删除地址」(白底红描边,二次确认后删除并返回列表)+ 主按钮「保存」(校验通过写入 localStorage,防连点)。从下单页跳转新增(?add=1)保存后自动返回下单页并选中新地址
📋 说明面板 / 开发交付文档 — 我的地址 v1.3
📌 功能概述

一句话

我的地址页 = 收件地址管理(列表/新增/编辑/删除/设默认),供赏袋发货申请、神秘礼物领取、积分商城兑换提交发货订单时选择收货地址。

页面说明

用户在此维护收件地址(收件人/手机号/省市区/详细地址/默认标记),地址数据存入 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✅ 已实现
保存中提交防连点:按钮禁用 + 「保存中…」✅ 已实现
🔄 版本更新日志