feat: 小程序手机号绑定优化

template/uni-app/api/user.js

@@ -697,3 +697,12 @@ export function getLangJson() {
 		noAuth: true
 	})
 }
+
+/**
+ * 
+ * 小程序绑定手机号
+ * @param object data
+ */
+export function mpBindingPhone(data) {
+	return request.post('v2/routine/binding_phone', data);
+}

template/uni-app/pages/user/index.vue

@@ -77,9 +77,15 @@
 										<image src="/static/images/edit.png" mode=""></image>
 									</view> -->
 								</view>
+								<!-- #ifdef MP -->
+								<button class="phone" v-if="!userInfo.phone && isLogin" open-type="getPhoneNumber"
+									@getphonenumber="getphonenumber">{{$t(`绑定手机号`)}}</button>
+								<!-- #endif -->
+								<!-- #ifndef MP -->
 								<view class="phone" v-if="!userInfo.phone && isLogin" @tap="bindPhone">
 									{{$t('绑定手机号')}}
 								</view>
+								<!-- #endif -->
 							</view>
 							<view class="message">
 								<navigator url="/pages/users/user_info/index" hover-class="none">
@@ -284,7 +290,8 @@
 		getMenuList,
 		getUserInfo,
 		setVisit,
-		updateUserInfo
+		updateUserInfo,
+		mpBindingPhone
 	} from '@/api/user.js';
 	import {
 		wechatAuthV2,
@@ -521,6 +528,32 @@
 					url: '/pages/users/user_phone/index'
 				})
 			},
+			getphonenumber(e) {
+				Routine.getCode()
+					.then(code => {
+						let data = {
+							code,
+							iv: e.detail.iv,
+							encryptedData: e.detail.encryptedData,
+						}
+						mpBindingPhone(data).then(res => {
+							this.getUserInfo()
+							this.$util.Tips({
+								title: res.msg,
+								icon: 'success'
+							});
+						}).catch(err => {
+							return this.$util.Tips({
+								title: err
+							});
+						})
+					})
+					.catch(error => {
+						uni.hideLoading();
+					});
+
+				console.log(e)
+			},
 			/**
 			 * 获取个人用户信息
 			 */
@@ -1260,6 +1293,7 @@
 			background-color: #CCC;
 			border-radius: 15px;
 			width: max-content;
+			font-size: 28rpx;
 			padding: 0 10px;
 		}
 

template/uni-app/pages/users/components/login_mobile/routine_phone.vue

@@ -60,7 +60,6 @@
 				});
 				Routine.getCode()
 					.then(code => {
-
 						this.getUserPhoneNumber(e.detail.encryptedData, e.detail.iv, code);
 					})
 					.catch(error => {

template/uni-app/pages/users/user_info/index.vue

@@ -43,15 +43,25 @@
 					</view>
 					<view class='item acea-row row-between-wrapper'>
 						<view>{{$t(`昵称`)}}</view>
-						<view class='input'><input type='nickname' name='nickname' :maxlength="16" :value='userInfo.nickname'></input>
+						<view class='input'><input type='nickname' name='nickname' :maxlength="16"
+								:value='userInfo.nickname'></input>
 						</view>
 					</view>
 					<view class='item acea-row row-between-wrapper'>
 						<view>{{$t(`手机号码`)}}</view>
+						<!-- #ifdef MP -->
+						<button class="input" open-type="getPhoneNumber" @getphonenumber="getphonenumber"
+							v-if="!userInfo.phone">{{$t(`点击绑定手机号`)}}
+							<text class="iconfont icon-xiangyou"></text>
+						</button>
+						<!-- #endif -->
+						<!-- #ifndef MP -->
 						<navigator url="/pages/users/user_phone/index" hover-class="none" class="input"
 							v-if="!userInfo.phone">
 							{{$t(`点击绑定手机号`)}}<text class="iconfont icon-xiangyou"></text>
 						</navigator>
+						<!-- #endif -->
+
 						<view class='input acea-row row-between-wrapper' v-else>
 							<input type='text' disabled='true' name='phone' :value='userInfo.phone' class='id'></input>
 							<text class='iconfont icon-suozi'></text>
@@ -160,7 +170,8 @@
 		userEdit,
 		getLogout,
 		getLangList,
-		getLangJson
+		getLangJson,
+		mpBindingPhone
 	} from '@/api/user.js';
 	import {
 		switchH5Login,
@@ -174,6 +185,7 @@
 	import dayjs from "@/plugin/dayjs/dayjs.min.js";
 	// #ifdef MP
 	import authorize from '@/components/Authorize';
+	import Routine from '@/libs/routine';
 	// #endif
 	import Cache from '@/utils/cache';
 	import colors from '@/mixins/color.js';
@@ -244,6 +256,31 @@
 					title: this.$t(`当前为最新版本`)
 				});
 			},
+			getphonenumber(e) {
+				Routine.getCode()
+					.then(code => {
+						let data = {
+							code,
+							iv: e.detail.iv,
+							encryptedData: e.detail.encryptedData,
+						}
+						mpBindingPhone(data).then(res => {
+							this.getUserInfo()
+							this.$util.Tips({
+								title: res.msg,
+								icon: 'success'
+							});
+						}).catch(err => {
+							return this.$util.Tips({
+								title: err
+							});
+						})
+					})
+					.catch(error => {
+						uni.hideLoading();
+					});
+
+			},
 			setLang() {
 				this.array.map((item, i) => {
 					if (this.$i18n.locale == item.value) {
@@ -639,9 +676,11 @@
 	.personal-data .list .item .input {
 		max-width: 400rpx;
 		text-align: right;
-		color: #868686;
-		.icon-suozi{
-			margin-left: 10rpx;
+		color: #868686;
+		font-size: 28rpx;
+
+		.icon-suozi {
+			margin-left: 10rpx;
 		}
 	}