Explorar el Código

优化手机号登录授权

DaMowang hace 2 años
padre
commit
7779208438
Se han modificado 5 ficheros con 162 adiciones y 174 borrados
  1. 30 24
      src/App.vue
  2. 108 108
      src/components/authorize-module/index.vue
  3. 16 34
      src/pages/my/index.vue
  4. 6 6
      src/pages/product/p_details.vue
  5. 2 2
      src/request/config.js

+ 30 - 24
src/App.vue

@@ -1,32 +1,38 @@
 <script>
 export default {
-  globalData: {
-    userInfo: {},
-    shopInfo: {
-      shop_name: "茶付宝",
-      desc: "茶付宝",
+    globalData: {
+        userInfo: {},
+        shopInfo: {
+            shop_name: "茶付宝",
+            shop_image: "",
+            desc: "茶付宝",
+        },
     },
-  },
-  errTips(msg, duration, open) {
-    uni.showToast({
-      title: msg,
-      icon: "none",
-      duration: duration ? duration : 1200,
-      mask: true,
-    });
-  },
-  onLaunch() {
-    var logs = uni.getStorageSync("logs") || [];
-    logs.unshift(Date.now());
-    uni.setStorageSync("logs", logs);
-    uni.setStorageSync("mallName", "茶付宝");
-  },
-  onShow() {},
-  onHide() {},
+    errTips(msg, duration, open) {
+        uni.showToast({
+            title: msg,
+            icon: "none",
+            duration: duration ? duration : 1200,
+            mask: true,
+        });
+    },
+    onLaunch() {
+        var logs = uni.getStorageSync("logs") || [];
+        logs.unshift(Date.now());
+        uni.setStorageSync("logs", logs);
+        uni.setStorageSync("mallName", "茶付宝");
+
+        let accountInfo = __wxConfig.accountInfo
+        this.globalData.shopInfo = {
+            shop_name: accountInfo.nickname,
+            shop_image: accountInfo.icon
+        }
+    },
+    onShow() {},
+    onHide() {},
 };
 </script>
-
 <style>
 /*每个页面公共css */
 @import "./app.scss";
-</style>
+</style>

+ 108 - 108
src/components/authorize-module/index.vue

@@ -1,96 +1,79 @@
 <template>
-	<view>
-		<view class="transparentDom" v-if="clickDom" @tap="onSoHAuth"></view>
-		<view class='authContainer' v-else>
-			<view class='no-authorize'>
-				<view class='closeIconBtn' @tap='onSoHAuth'>×</view>
-				<view class='shopInfoBox'>
-					<view class='imgPic'><image class='img' mode='widthFix' :src='shopInfo.shop_image || "/static/logo.jpg"'></image></view>
-					<view class='stitle'>{{isGetTel ? '欢迎来到 - '+shopInfo.shop_name:'您还未登录'}}</view>
-				</view>
-				<view class='no-authorize_title'>为提更供优质的服务,需要获取以下信息</view>
-				<view class='no-authorize_text'>
-				   <text>·</text> {{isGetTel ? '获得你微信绑定的手机号码':'获得你的公开信息 (昵称、头像、地区及性别)'}}
-				</view>
-		
-				<div class="checkbox-box flex_r flex_ac" v-if='!isGetTel'>
-					<checkbox-group @change="checkboxChange" class="flex_r flex_ac">
-						<label class="checkbox flex_r flex_ac">
-							<checkbox class='checkboxCom' value="agree" checked />
-							<view>我同意</view>
-						</label>
-						<span @click="goto('/pages/agreement/index',{tit:'隐私协议',type:26})" class="hover_a">《用户服务协议》</span>
-                        <text>和</text>
-						<span @click="goto('/pages/agreement/index',{tit:'隐私协议',type:27})" class="hover_a">《隐私协议》</span>
-					</checkbox-group>
-				</div>
-				
-				<view class="btnBar flex_r flex_ac flex_jb">
-					<button class='no-authorize_btn unSetBtn' @tap="onSoHAuth">{{isGetTel ? "暂不授权" : "暂不登录"}}</button>
-					<button open-type="getPhoneNumber" class='no-authorize_btn' @getphonenumber="onGotPhoneNumber" lang="zh_CN">立即登录</button>
-					<!-- <button open-type="getUserInfo" class='no-authorize_btn' @getuserinfo="onGotUserInfo" lang="zh_CN" v-else>获取用户信息</button> -->
-					<!-- <button open-type="getUserInfo" class='no-authorize_btn' @tap="onGotUserInfo" lang="zh_CN">立即登录</button> -->
-                    <!-- <button  @tap="getUserProfile" v-else> 获取头像昵称 </button> -->
-				</view>
-			</view>
-		</view>
-	</view>
+    <view class='authContainer' v-if="clickDom">
+        <view class='no-authorize'>
+            <view class='closeIconBtn' @tap='onSoHAuth'>×</view>
+            <view class='shopInfoBox'>
+                <view class='imgPic'>
+                    <image class='img' mode='widthFix' :src='shopInfo.shop_image'></image>
+                </view>
+                <view class='stitle'>{{isGetTel ? '欢迎来到 - '+shopInfo.shop_name:'您还未登录'}}</view>
+            </view>
+            <view class='no-authorize_title'>为提更供优质的服务,需要获取以下信息</view>
+            <view class='no-authorize_text'>
+                <text>·</text> {{isGetTel ? '获得你微信绑定的手机号码':'获得你的公开信息 (昵称、头像、地区及性别)'}}
+            </view>
+            <div class="checkbox-box flex_r flex_ac" v-if='!isGetTel'>
+                <checkbox-group @change="checkboxChange" class="flex_r flex_ac">
+                    <label class="checkbox flex_r flex_ac">
+                        <checkbox class='checkboxCom' value="agree" />
+                        <view>我同意</view>
+                    </label>
+                    <span @click="goto('/pages/agreement/index',{tit:'隐私协议',type:26})" class="hover_a">《用户服务协议》</span>
+                    <text>和</text>
+                    <span @click="goto('/pages/agreement/index',{tit:'隐私协议',type:27})" class="hover_a">《隐私协议》</span>
+                </checkbox-group>
+            </div>
+            <view class="btnBar flex_r flex_ac flex_jb">
+                <button class='no-authorize_btn unSetBtn' @tap="onSoHAuth">{{isGetTel ? "暂不授权" : "暂不登录"}}</button>
+                <button open-type="getPhoneNumber" class='no-authorize_btn' @getphonenumber="onGotPhoneNumber" lang="zh_CN">立即登录</button>
+                <!-- <button open-type="getUserInfo" class='no-authorize_btn' @getuserinfo="onGotUserInfo" lang="zh_CN" v-else>获取用户信息</button> -->
+                <!-- <button open-type="getUserInfo" class='no-authorize_btn' @tap="onGotUserInfo" lang="zh_CN">立即登录</button> -->
+                <!-- <button  @tap="getUserProfile" v-else> 获取头像昵称 </button> -->
+            </view>
+        </view>
+    </view>
 </template>
-
 <script>
-	var app = getApp();
-	
-	//#ifdef MP
-	var appEv = app.$vm.$options;
-	//#endif
-	
-	//#ifdef H5
-	var appEv = app.$options;
-	//#endif
-	export default {
-		props:{
-			shopInfo:{
-			    type: Object
-			},
-			isGetTel: {
-			    type: Boolean,
-			    observer: function (res) {
-			        if(res){
-			            // this.clickDom = false
-			        }
-			    }
-			},
-		},
-		data() {
-			return{
-				isDisabled: false,
-				clickDom: true
-			}
-		},
-		methods:{
-			onSoHAuth(){
-			    this.clickDom = !this.clickDom
-			},
-			closeAuthCom(){
-			    this.$emit('closeAuthCom');
-			},
-			onGotUserInfo (e) {
-			    this.$emit('authSuccess');
-			},
-			onGotPhoneNumber(e){
-                this.$emit('authGetTelSuccess', e);
-			},
-			checkboxChange(e) {
-			    var value = e.detail.value;
-			    this.isDisabled = value.length == 0
-			},
-		}
-	}
+let app = getApp();
+let appEv = app.$vm.$options;
+export default {
+    props: {
+        shopInfo: {
+            type: Object
+        },
+        isGetTel: {
+            type: Boolean,
+            default: true
+        },
+    },
+    data() {
+        return {
+            clickDom: false,
+            agree: false,
+        }
+    },
+    methods: {
+        onSoHAuth() {
+            this.clickDom = !this.clickDom
+        },
+        closeAuthCom() {
+            this.$emit('closeAuthCom');
+        },
+        onGotUserInfo(e) {
+            this.$emit('authSuccess');
+        },
+        onGotPhoneNumber(e) {
+            this.$emit('authGetTelSuccess', e);
+        },
+        checkboxChange(e) {
+            this.agree = e.detail.value.includes("agree")
+        },
+    }
+}
 </script>
-
 <style lang="scss">
 .transparentDom,
-.authContainer{
+.authContainer {
     position: fixed;
     top: 0;
     left: 0;
@@ -102,14 +85,16 @@
     padding: 0;
     z-index: 1999999999999999999;
 }
-.authContainer{
-    background-color: rgba(0,0,0,0.4);
+
+.authContainer {
+    background-color: rgba(0, 0, 0, 0.4);
     display: flex;
     display: -webkit-flex;
     align-items: center;
 }
-.no-authorize{
-    background-color: #fff; 
+
+.no-authorize {
+    background-color: #fff;
     padding: 0 32rpx 60rpx;
     width: 84%;
     position: absolute;
@@ -118,7 +103,8 @@
     box-sizing: border-box;
     border-radius: 20rpx;
 }
-.closeIconBtn{
+
+.closeIconBtn {
     position: absolute;
     top: 24rpx;
     right: 24rpx;
@@ -132,7 +118,8 @@
     line-height: 40rpx;
     font-weight: 600;
 }
-.shopInfoBox{
+
+.shopInfoBox {
     width: 100%;
     padding: 96rpx 20rpx 60rpx;
     display: flex;
@@ -140,11 +127,12 @@
     align-items: center;
     box-sizing: border-box;
 }
-.shopInfoBox .imgPic{
+
+.shopInfoBox .imgPic {
     width: 144rpx;
     height: 144rpx;
     /* margin-right: 30rpx; */
-    box-shadow: 0rpx 4rpx 16rpx rgba(68,169,47,0.2);
+    box-shadow: 0rpx 4rpx 16rpx rgba(68, 169, 47, 0.2);
     border-radius: 50%;
     overflow: hidden;
     flex-grow: 1;
@@ -157,12 +145,14 @@
     margin-left: -72rpx;
     background-color: #fff;
 }
-.shopInfoBox .imgPic .img{
+
+.shopInfoBox .imgPic .img {
     display: block;
     width: 144rpx;
     height: 144rpx;
 }
-.shopInfoBox .stitle{
+
+.shopInfoBox .stitle {
     font-size: 40rpx;
     font-weight: 500;
     color: #121212;
@@ -171,7 +161,8 @@
     width: 100%;
     text-align: center;
 }
-.no-authorize_title{
+
+.no-authorize_title {
     font-size: 30rpx;
     font-weight: 500;
     color: #121212;
@@ -179,17 +170,20 @@
     padding-bottom: 12rpx;
     text-align: center;
 }
-.no-authorize_text{
+
+.no-authorize_text {
     font-size: 24rpx;
     color: #999;
     line-height: 1.6;
     text-align: center;
 }
-.btnBar{
+
+.btnBar {
     margin-top: 70rpx;
     overflow: hidden;
 }
-.no-authorize_btn{
+
+.no-authorize_btn {
     background: #44a92f;
     color: #fff;
     font-size: 30rpx;
@@ -199,31 +193,37 @@
     border-radius: 60rpx;
     border: 2rpx solid #44a92f;
 }
-.isDisabledBtn{
+
+.isDisabledBtn {
     border-color: #ccc;
     color: #aaa;
     background: #eee;
 }
-.unSetBtn{
+
+.unSetBtn {
     background: #fff;
     color: #44a92f;
 }
-.no-authorize_btn::after{
+
+.no-authorize_btn::after {
     border: none;
 }
-.checkbox-box{
+
+.checkbox-box {
     margin-top: 60rpx;
     margin-bottom: -20px;
     font-size: 28rpx;
 
 }
-.checkbox-box text{
+
+.checkbox-box text {
     /* color: #07d; */
     /* color: #44A92F; */
     color: #44a92f;
 }
-.checkbox-box .checkbox .checkboxCom{
+
+.checkbox-box .checkbox .checkboxCom {
     transform: scale(0.84);
     -webkit-transform: scale(0.84);
 }
-</style>
+</style>

+ 16 - 34
src/pages/my/index.vue

@@ -186,7 +186,7 @@
         </view>
         <view class="fz_w_text">让数字经济赋能美好生活!</view>
         <!-- 授权 -->
-        <authorize-module v-if="showAuth" :shopInfo="shopInfo" @authGetTelSuccess="onauthGetTelSuccess" />
+        <authorize-module ref="autho" :shopInfo="shopInfo" @authGetTelSuccess="onauthGetTelSuccess" />
         <!-- 激活升级 -->
         <activation ref="activation" tit="激活" />
     </view>
@@ -205,22 +205,13 @@ export default {
     },
     data() {
         return {
-            showAuth: false,
-            shopInfo: {}, // 商铺信息
-            userInfoAccount: {}, // 账户数据
-            customerServiceWeiXin: "", // 客服微信
-            isShiMing: true, //未实名提示弹窗
-            agentName: "", // 缘起
-            user_id: undefined,
-            userinfo: {}, // 获取用户信息
-
+            token: uni.getStorageSync("token"),
+            shopInfo: {},   // 商铺信息
+            isShiMing: true,    //未实名提示弹窗
+            userinfo: {},   // 获取用户信息
             unid: "",
-
-            // isGetUserInfo:false,
             invited: "",
-
             allChaYou: "",
-
             isAuthentication: uni.getStorageSync("isAuthentication"), //是否开启实名模块
             local_uinfo: {}, //数智生活信息
         };
@@ -232,15 +223,14 @@ export default {
             this.invited = options.invite;
         }
         this.closeAuto(); //关闭实名功能
-        this.getchayou(); //获取茶友
-        this.getLU(); //数智生活信息
     },
     onShow() {
-        let token = uni.getStorageSync("token");
-        this.userinfo = uni.getStorageSync("userinfo");
-
-        if (!token) this.login()
-        else this.getuserInfo()
+        if (!this.token) this.login()
+        else {
+            this.getuserInfo();
+            this.getchayou(); //获取茶友
+            this.getLU(); //数智生活信息
+        }
     },
     methods: {
         login() {
@@ -260,7 +250,7 @@ export default {
                                 } else {
                                     that.unid = res.data.unid;
                                     that.shopInfo = app.globalData.shopInfo;
-                                    that.showAuth = true; //调取授权弹窗
+                                    that.SoHAuth(); //调取授权弹窗
                                 }
                             }
                         });
@@ -275,7 +265,7 @@ export default {
         },
         // 获取手机号
         onauthGetTelSuccess(da) {
-            this.showAuth = false;
+            this.SoHAuth();
             post("v1/getMobile", {
                 unid: this.unid,
                 ...da.detail,
@@ -286,6 +276,9 @@ export default {
                 }
             });
         },
+        SoHAuth(){
+            this.$refs.autho.onSoHAuth();
+        },
         // 获取userinfo
         async getuserInfo() {
             let res = await uni.userfun();
@@ -295,17 +288,6 @@ export default {
                 this.userinfo = res;
             } else this.login();
         },
-        //授权并登录
-        onAuthSuccess() {
-            var that = this;
-            uni.showLoading({
-                mask: true,
-            });
-            appEv.setData((res) => {
-                uni.hideLoading();
-                that.showAuth = false;
-            });
-        },
         // 跳转到实名页面
         goToAutonym() {
             this.goto("/pages/autonym-submit/index")

+ 6 - 6
src/pages/product/p_details.vue

@@ -177,7 +177,7 @@ export default {
             pfway: "1", // 批发
             qhway: "0", //提货方式
             shopInfo: {}, // 商铺信息
-            showAuth: false,
+            // showAuth: false,
 
             userinfo: {},
             goodsDa: {},
@@ -282,7 +282,9 @@ export default {
                 url: "/pages/pay-agreement/index?type=" + this.goodsDa.type,
             });
         },
-
+        SoHAuth(){
+            this.$refs.autho.onSoHAuth();
+        },
         login(invite) {
             let that = this;
             // #ifdef  MP-WEIXIN
@@ -299,10 +301,8 @@ export default {
                                     that.getuserInfo();
                                 } else {
                                     that.unid = res.data.unid;
-                                    // setTimeout(() => {
                                     that.shopInfo = app.globalData.shopInfo;
-                                    that.showAuth = true;
-                                    // }, 1000);
+                                    that.SoHAuth(); //调取授权弹窗
                                 }
                             }
                         });
@@ -312,7 +312,7 @@ export default {
             // #endif
         },
         onauthGetTelSuccess(da) {
-            this.showAuth = false;
+            this.SoHAuth();
             post("v1/getMobile", {
                 unid: this.unid,
                 ...da.detail,

+ 2 - 2
src/request/config.js

@@ -15,6 +15,6 @@ if (process.env.UNI_PLATFORM === "h5") {
 export default apis == 1 ? {
 	Hhost: "https://shop-api.haocha13.cn/",
 } : {
-	// Hhost: "https://shop-api.haocha13.cn/",  //正式接口
-	Hhost: "https://test-api.haocha13.cn/",
+	Hhost: "https://shop-api.haocha13.cn/",  //正式接口
+	// Hhost: "https://test-api.haocha13.cn/",
 }