123

doc/消费者APP/会员注册登录/会员注册登录前端技术方案.md

@@ -1,9 +1,9 @@
 # 会员注册登录 — 前端技术方案（C 端 · shop-app）
 
-> **依据：** 《会员注册登录技术方案.md》v1.2  
+> **依据：** 《会员注册登录技术方案.md》v1.3  
 > **关联：** 《商品详情内页前端技术方案》（加购登录引导）、《搜索页前端技术方案》  
 > **范围：** 消费者 APP **会员注册、登录、服务协议勾选**；**不** 改后端、**不** 实现短信验证码、忘记密码、资料/地址编辑（另册）。  
-> **实现状态：** 页面与 API 已落地，待与 `/api/member/**` 联调。
+> **实现状态：** 页面与 API 已落地；登录 Token 解析已对齐 v1.3 根级响应，待联调。
 
 ---
 
@@ -12,9 +12,10 @@
 | 项 | 说明 |
 |----|------|
 | 框架 | uni-app **Vue 3** + **uview-plus** |
-| 请求 | `@/utils/request`；成功 `code=200`，业务数据在 `data` |
+| 请求 | `@/utils/request`；成功 `code=200`；业务体在 `data`，**登录例外**见 §4.2 |
 | Token | `config` → `TOKEN_KEY = shop-Admin-Token`；请求头 `Authorization: Bearer {token}` |
-| 登录账号 | **手机号** 或 **会员名称**（`memberCode`，产品所称「会员 ID」） |
+| 鉴权机制 | 与平台一致：`TokenService` 签发 JWT，Redis 会话；不足 20 分钟自动续期（后端） |
+| 登录账号 | **手机号** 或 **会员名称**（`memberCode`；产品 **「会员 ID」= 会员名称**，**非** 数字 `memberId`） |
 | 注册 | **无短信验证码**；`mobile + password + confirmPassword` |
 | 样式 | 登录/注册共用 `styles/auth.scss` |
 
@@ -44,10 +45,10 @@
 |------|------|------|
 | 登录页 | `shop-app/pages/login/index.vue` | 账号+密码+协议+记住账号 |
 | 注册页 | `shop-app/subpackage/account/register.vue` | 手机号注册表单 |
-| 协议块 | `shop-app/components/account/AgreementBlock.vue` | 勾选 + 弹窗 **`rich-text`** 渲染（同商品详情） |
+| 协议块 | `shop-app/components/account/AgreementBlock.vue` | 勾选 + 弹窗 **`rich-text`** 渲染 |
 | HTML 预处理 | `shop-app/utils/htmlContent.js` | 实体解码、图片 URL、空 `<p>` 清理 |
 | API | `shop-app/api/member.js` | register / login / serviceAgreement / profile |
-| 状态 | `shop-app/store/user.js` | 登录态、资料缓存 |
+| 状态 | `shop-app/store/user.js` | 登录态、**根级 token** 解析、资料缓存 |
 | 协议加载 | `shop-app/utils/memberAgreement.js` | 初始化协议配置 |
 | 校验 | `shop-app/utils/memberValidate.js` | 手机号、密码 |
 | 登录引导 | `shop-app/utils/apiAuth.js` | `ensureApiToken` → 登录页 |
@@ -69,6 +70,8 @@
 | `getMemberServiceAgreement()` | GET | `/api/member/serviceAgreement` | 匿名 |
 | `getMemberProfile()` | GET | `/api/member/profile` | Token |
 
+可选（本期未单独封装）：`GET /api/member/serviceAgreement/status` — 仅开关；注册/登录页用完整 `serviceAgreement` 即可。
+
 ### 4.1 注册 Body
 
 | 字段 | 必填 | 前端 |
@@ -79,15 +82,40 @@
 | memberCode | 否 | 会员名称，空则后端自动生成 |
 | agreementAccepted | 条件 | 协议 `enabled` 时须勾选 |
 
-### 4.2 登录 Body
+**成功 `data`：** 系统主键 `memberId`（long）；**不能** 作为登录账号，注册成功后跳转登录页用 **手机号** 登录。
+
+### 4.2 登录 Body 与响应（v1.3）
 
 | 字段 | 必填 | 前端 |
 |------|:----:|------|
-| account | 是 | 手机号或会员名称 |
+| account | 是 | 手机号或会员名称（产品所称会员 ID） |
 | password | 是 | — |
 | agreementAccepted | 条件 | `requireAgreementOnLogin` 为 true 时须勾选 |
 
-**成功 `data`：** `{ token, memberId }`（`memberId` 为系统主键，**不能**当登录账号）。
+**成功响应（与平台 `POST /login` 一致，字段在 JSON 根级）：**
+
+```json
+{
+  "code": 200,
+  "msg": "操作成功",
+  "token": "eyJhbGciOiJIUzUxMiJ9...",
+  "memberId": 1001
+}
+```
+
+| 字段 | 说明 |
+|------|------|
+| `token` | 存本地 + 请求头 `Authorization: Bearer {token}` |
+| `memberId` | **系统主键**，仅资料展示；**不可** 填入登录框 |
+
+**`store/user.js` 解析：**
+
+```javascript
+const token = res.token || (res.data && res.data.token)
+const memberId = res.memberId != null ? res.memberId : (res.data && res.data.memberId)
+```
+
+> **兼容：** 后端若仍传 `mobile` 且 `account` 为空，由服务端等同 `account=mobile`；前端统一传 `account`。
 
 ### 4.3 服务协议 `data` 要点
 
@@ -107,19 +135,20 @@
 ```text
 顶栏品牌区
 └── 卡片
-    ├── 账号（手机号或会员名称）
+    ├── 账号（手机号或会员名称 / 会员 ID）
     ├── 密码
     ├── 记住账号（localStorage: shop_login_account）
     ├── AgreementBlock（协议启用且 requireAgreementOnLogin 时显示）
-    ├── 登录按钮 → memberLogin → fetchUserInfo → switchTab 首页
+    ├── 登录按钮 → memberLogin → 读根级 token → fetchUserInfo → switchTab 首页
     └── 立即注册 → subpackage/account/register
 ```
 
 | 规则 | 实现 |
 |------|------|
-| RL3 | 单输入框 `account` |
+| RL3 | 单输入框 `account`；文案标明「会员 ID = 会员名称」 |
 | RL4 | 错误文案由后端统一返回，前端 Toast `msg` |
 | RL6 | `needAgreement` 计算属性控制勾选 |
+| RL8 | 不把 `memberId` 当登录账号 |
 | 已登录进页 | 有 Token 直接 `switchTab` 首页 |
 
 ### 5.2 注册 `subpackage/account/register`
@@ -155,6 +184,7 @@
 
 ```text
 memberLogin 成功
+    → 解析 res.token（根级）
     → setToken(token)
     → getMemberProfile() 写入 store
     → 业务请求带 Authorization
@@ -167,7 +197,7 @@ request 401（需登录接口）
     → fedLogOut + reLaunch 登录页
 ```
 
-**退出：** 仅本地 `fedLogOut`（后端无 C 端 logout 接口）。
+**退出：** 仅本地 `fedLogOut`（C 端无专用 logout 接口；与 v1.3 Token 机制不冲突）。
 
 ---
 
@@ -177,10 +207,10 @@ request 401（需登录接口）
 |------|----------|
 | RL1 | 注册页无验证码 |
 | RL2 | 确认密码前端校验 |
-| RL3 | 登录 `account` 字段 |
+| RL3 | 登录 `account` 字段；UI 提示会员 ID = 会员名称 |
 | RL4 | 不区分「用户不存在/密码错误」展示 |
 | RL6 | `AgreementBlock` + 提交前校验 |
-| RL8 | UI 提示「会员名称」；`memberId` 仅展示在资料区（若有） |
+| RL8 | `memberId` 仅 store/资料；登录框不用数字主键 |
 
 ---
 
@@ -188,7 +218,8 @@ request 401（需登录接口）
 
 - [ ] `GET /api/member/serviceAgreement` 返回开关与正文
 - [ ] `POST /api/member/register` 成功 → 登录页预填手机号
-- [ ] `POST /api/member/login` 手机号 / 会员名称均可登录
+- [ ] `POST /api/member/login` 返回 **根级** `token`、`memberId`；前端能登录并进首页
+- [ ] 手机号 / 会员名称（会员 ID）均可登录
 - [ ] 协议未勾选时注册/登录被后端拒绝且 Toast 文案正确
 - [ ] 登录后 `GET /api/member/profile` 我的页展示昵称/手机号
 - [ ] 商品详情加购无 Token 跳转登录页
@@ -202,6 +233,7 @@ request 401（需登录接口）
 |----|------|
 | 短信验证码 | 不做 |
 | 忘记密码 / 换绑手机 | 不做 |
+| 以数字 `member_id` 登录 | 不做 |
 | 资料编辑 / 地址管理 | 另册；接口已存在 `/profile`、`/address/**` |
 | 微信 OAuth | 不做 |
 
@@ -212,7 +244,8 @@ request 401（需登录接口）
 | 版本 | 说明 |
 |------|------|
 | **v1.0** | 首版：会员登录改造、注册分包页、协议组件、我的页入口 |
+| **v1.1** | 对齐后端 v1.3：登录 **根级** `token`/`memberId` 解析；登录文案「会员 ID」；联调清单补充 |
 
 ---
 
-*文档版本：v1.0 · 关联《会员注册登录技术方案.md》v1.2*
+*文档版本：v1.1 · 关联《会员注册登录技术方案.md》v1.3*

doc/消费者APP/会员注册登录/会员注册登录技术方案.md

@@ -303,7 +303,7 @@ MemberAppServiceImpl.login
 | `POST /login`（account：手机号/会员名称） | **已实现** |
 | `BizMemberMapper.selectByMemberCode` | **已实现** |
 | `POST /sms/send` | **保留代码、非本期** |
-| C 端注册/登录 **前端** | **已实现**（见《会员注册登录前端技术方案.md》） |
+| C 端注册/登录 **前端** | **已实现**（见《会员注册登录前端技术方案.md》v1.1，含根级 token 解析） |
 
 ---
 

shop-app/api/member.js

@@ -10,7 +10,10 @@ export function memberRegister(data) {
   })
 }
 
-/** 会员登录（匿名） */
+/**
+ * 会员登录（匿名）
+ * 成功响应与平台 /login 一致：根级 token、memberId（非 data.token）
+ */
 export function memberLogin(data) {
   return request({
     url: '/api/member/login',

shop-app/components/account/AgreementBlock.vue

@@ -78,8 +78,8 @@ function openPopup() {
 .agreement-card {
 	margin-top: 24rpx;
 	// padding: 20rpx 24rpx;
-	background: #f5faf6;
-	border: 1rpx solid #e8f5e9;
+	// background: #f5faf6;
+	// border: 1rpx solid #e8f5e9;
 	border-radius: 12rpx;
 	box-sizing: border-box;
 }
@@ -90,16 +90,14 @@ function openPopup() {
 }
 
 .agreement-card__box {
-	width: 36rpx;
-	height: 36rpx;
-	margin-top: 2rpx;
-	margin-right: 16rpx;
-	border: 2rpx solid #a5d6a7;
-	border-radius: 8rpx;
+	width: 32rpx;
+	height: 32rpx;
+	margin-right: 12rpx;
+	border: 2rpx solid #c8e6c9;
+	border-radius: 6rpx;
 	display: flex;
 	align-items: center;
 	justify-content: center;
-	flex-shrink: 0;
 	background: #fff;
 }
 

shop-app/pages/login/index.vue

@@ -10,7 +10,7 @@
 		<view class="auth-body">
 			<view class="auth-card">
 				<text class="auth-card__title">会员登录</text>
-				<text class="auth-card__sub">可使用手机号或会员名称登录</text>
+				<text class="auth-card__sub">可使用手机号或会员名称（会员 ID）登录</text>
 
 				<view class="auth-field">
 					<view class="auth-field__box">
@@ -19,7 +19,7 @@
 							v-model="form.account"
 							class="auth-field__input"
 							type="text"
-							placeholder="手机号或会员名称"
+							placeholder="手机号或会员名称（会员 ID）"
 							placeholder-class="auth-field__placeholder"
 							confirm-type="next"
 						/>

shop-app/store/user.js

@@ -30,14 +30,17 @@ export function useUserStore() {
     const password = payload.password
     const agreementAccepted = !!payload.agreementAccepted
     return memberLogin({ account, password, agreementAccepted }).then((res) => {
-      const data = res.data || {}
-      const token = data.token
+      // v1.3：与平台 /login 一致，token、memberId 在响应根级；兼容旧版 data 包裹
+      const token = res.token || (res.data && res.data.token)
+      const memberId = res.memberId != null && res.memberId !== ''
+        ? res.memberId
+        : (res.data && res.data.memberId)
       if (!token) {
         return Promise.reject(new Error('登录失败，未返回令牌'))
       }
       setToken(token)
       state.token = token
-      state.memberId = data.memberId || ''
+      state.memberId = memberId != null ? memberId : ''
       return res
     })
   }

shop-app/styles/auth.scss

@@ -1,7 +1,7 @@
 @import '@/styles/morandi.scss';
 
 .auth-page {
-	min-height: 100%;
+	height: 100vh;
 	display: flex;
 	flex-direction: column;
 	background: $morandi-bg-page;

shop-app/subpackage/account/register.vue

@@ -64,7 +64,7 @@
 								v-model="form.memberCode"
 								class="auth-field__input"
 								type="text"
-								placeholder="会员名称（选填，不填则自动生成）"
+								placeholder="会员名称/会员 ID（选填，不填自动生成）"
 								placeholder-class="auth-field__placeholder"
 							/>
 						</view>