需求发布

pages/my/login/login.vue

@@ -1,7 +1,11 @@
 <template>
-	<view style="width: 100%;position: absolute;bottom: 0; padding-top: 30rpx; background-color: #fff;">
-		<view style="padding-left: 30rpx;padding-right: 30rpx;">
-			<u-button open-type="getPhoneNumber" size="medium" class="custom-style" @getphonenumber="getphonenumber"
+	<view class="login-content">
+		<view style="text-align: center;margin-bottom:30rpx;">
+			<text>请登录后查看</text>
+		</view>
+		<view style="padding-left: 30rpx;padding-right: 30rpx;display: flex;">
+			<u-button type="info" :plain="true" size="nomal" @click="$emit('fail')">取消</u-button>
+			<u-button open-type="getPhoneNumber" size="nomal" @getphonenumber="getphonenumber"
 				color='#12CA64'>登录</u-button>
 		</view>
 	</view>
@@ -9,6 +13,7 @@
 
 <script>
 	import {
+		apiService,
 		loginSys
 	} from '@/service/request.js'
 	export default {
@@ -36,6 +41,14 @@
 								uni.setStorageSync('token', data.token);
 								that.$toast.success('登录成功')
 								that.$emit('success')
+								//登录完成后使用手机code换取手机号,调用/user/getMobileByMnp接口
+								//接口详细链接    https://docs.apipost.cn/preview/468be606f65cae75/3f2f988ddf82dd8e
+								const codeData = {
+									code: e.detail.code
+								}
+								apiService.postMobileByMnp(codeData).then(res => {
+									console.log(res)
+								})
 							})
 						},
 						fail: function(err) {
@@ -85,9 +98,16 @@
 </script>
 
 <style lang="less" scoped>
-	.custom-style {
-		width: 200rpx;
-		padding-left: 30rpx;
-		padding-right: 30rpx;
+	/deep/.u-button {
+		width: 40% !important;
+	}
+	.login-content {
+		width: 100%;
+		position:absolute;
+    top:50%;
+		left: 50%;
+		padding: 50rpx 30rpx; 
+		background-color: #fff;
+    transform:translate(-50%,-50%);
 	}
 </style>