首页登录改为组件方式，方便其他页面引用
This commit is contained in:
donqi
parent
36e75d8768
commit
022bb0b8e4
|
|
@ -0,0 +1,49 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<!-- 模态框 -->
|
||||||
|
<view class="cu-modal" :class="isShow?'show':''">
|
||||||
|
<view class="cu-dialog">
|
||||||
|
<view class="padding-xl text-left">
|
||||||
|
<view>需先授权微信登录才可正常使用功能，小程序将获取并使用以下信息：</view>
|
||||||
|
<view>1.微信昵称</view>
|
||||||
|
<view>2.微信头像</view>
|
||||||
|
</view>
|
||||||
|
<view class="cu-bar bg-white">
|
||||||
|
<navigator class="modal-bottom-oper margin-0 flex-sub text-black" open-type="exit" target="miniProgram">拒绝授权
|
||||||
|
</navigator>
|
||||||
|
<view class="modal-bottom-oper margin-0 flex-sub text-main-color solid-left" @tap="confirm">确认授权</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'vertify-login',
|
||||||
|
emits: ['reload'],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isShow: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
showModal(e) {
|
||||||
|
this.isShow = true
|
||||||
|
},
|
||||||
|
hideModal(e) {
|
||||||
|
this.isShow = false;
|
||||||
|
},
|
||||||
|
confirm(e) {
|
||||||
|
this.$request.login().then(res => {
|
||||||
|
if (res) {
|
||||||
|
this.$emit('reload');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,50 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<!-- 模态框 -->
|
||||||
|
<view class="cu-modal" :class="isShow?'show':''">
|
||||||
|
<view class="cu-dialog">
|
||||||
|
<view class="padding-xl">
|
||||||
|
<view>授予小程序绑定微信手机号码的权限</view>
|
||||||
|
</view>
|
||||||
|
<view class="cu-bar bg-white">
|
||||||
|
<navigator class="modal-bottom-oper margin-0 flex-sub text-black solid-right" open-type="exit" target="miniProgram">拒绝授权
|
||||||
|
</navigator>
|
||||||
|
<view class="margin-0 flex-sub">
|
||||||
|
<button class="margin-0 flex-sub cu-btn bg-white text-main-color"
|
||||||
|
open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">确认授权</button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'vertify-phone',
|
||||||
|
emits: ['reload'],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isShow: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
showModal(e) {
|
||||||
|
this.isShow = true
|
||||||
|
},
|
||||||
|
hideModal(e) {
|
||||||
|
this.isShow = false;
|
||||||
|
},
|
||||||
|
getPhoneNumber(e) {
|
||||||
|
this.$request.storagePhoneIntoUserInfo(e.detail.code).then(res => {
|
||||||
|
if (res) {
|
||||||
|
this.$emit('reload');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
6
main.js
6
main.js
|
|
@ -7,10 +7,14 @@ import Data from './common/js/data.js';
|
||||||
import globalFun from './common/js/glogalFun.js';
|
import globalFun from './common/js/glogalFun.js';
|
||||||
import validate from './common/js/validate.js';
|
import validate from './common/js/validate.js';
|
||||||
import request from './common/js/request.js';
|
import request from './common/js/request.js';
|
||||||
import globalData from './common/js/globalData.js';
|
import globalData from './common/js/globalData.js';
|
||||||
|
import vertifyLogin from '@/components/vertify/vertify-login.vue';
|
||||||
|
import vertifyPhone from '@/components/vertify/vertify-phone.vue';
|
||||||
|
|
||||||
Vue.component('cu-custom', CuCustom)
|
Vue.component('cu-custom', CuCustom)
|
||||||
Vue.component('confirm-modal', ConfirmModal);
|
Vue.component('confirm-modal', ConfirmModal);
|
||||||
|
Vue.component('vertify-login', vertifyLogin);
|
||||||
|
Vue.component('vertify-phone', vertifyPhone);
|
||||||
|
|
||||||
const data = type => {
|
const data = type => {
|
||||||
//模拟异步请求数据
|
//模拟异步请求数据
|
||||||
|
|
|
||||||
|
|
@ -79,38 +79,10 @@
|
||||||
<!-- 热门服务 -->
|
<!-- 热门服务 -->
|
||||||
<vertical-goods-card :goodsInfos="hotGoods" :multiPicMode="true" title="大家都在买">
|
<vertical-goods-card :goodsInfos="hotGoods" :multiPicMode="true" title="大家都在买">
|
||||||
</vertical-goods-card>
|
</vertical-goods-card>
|
||||||
</view>
|
</view>
|
||||||
<!-- 强制要求用户授权登录的弹窗 -->
|
|
||||||
<view class="cu-modal" :class="isAuthWxLoginModal?'show':''">
|
<vertify-login ref="vertifyLogin" @reload="loadData"></vertify-login>
|
||||||
<view class="cu-dialog">
|
<vertify-phone ref="vertifyPhone" @reload="loadData"></vertify-phone>
|
||||||
<view class="padding-xl text-left">
|
|
||||||
<view>需先授权微信登录才可正常使用功能，小程序将获取并使用以下信息：</view>
|
|
||||||
<view>1.微信昵称</view>
|
|
||||||
<view>2.微信头像</view>
|
|
||||||
</view>
|
|
||||||
<view class="cu-bar bg-white">
|
|
||||||
<navigator class="modal-bottom-oper margin-0 flex-sub text-black" open-type="exit" target="miniProgram">拒绝授权
|
|
||||||
</navigator>
|
|
||||||
<view class="modal-bottom-oper margin-0 flex-sub text-main-color solid-left" @tap="authWxLogin">确认授权</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<!-- 手机号授予 -->
|
|
||||||
<view class="cu-modal" :class="isAuthWxPhoneModal?'show':''">
|
|
||||||
<view class="cu-dialog">
|
|
||||||
<view class="padding-xl">
|
|
||||||
<view>授予小程序绑定微信手机号码的权限</view>
|
|
||||||
</view>
|
|
||||||
<view class="cu-bar bg-white">
|
|
||||||
<navigator class="modal-bottom-oper margin-0 flex-sub text-black solid-right" open-type="exit" target="miniProgram">拒绝授权
|
|
||||||
</navigator>
|
|
||||||
<view class="margin-0 flex-sub">
|
|
||||||
<button class="margin-0 flex-sub cu-btn bg-white text-main-color"
|
|
||||||
open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">确认授权</button>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -133,8 +105,6 @@
|
||||||
hotGoods: [],
|
hotGoods: [],
|
||||||
discountGoods: {},
|
discountGoods: {},
|
||||||
InputBottom: 0,
|
InputBottom: 0,
|
||||||
isAuthWxLoginModal: false,
|
|
||||||
isAuthWxPhoneModal: false,
|
|
||||||
searchInfo: {},
|
searchInfo: {},
|
||||||
areaList: [],
|
areaList: [],
|
||||||
areaMultiIndex: [0, 0, 0],
|
areaMultiIndex: [0, 0, 0],
|
||||||
|
|
@ -155,17 +125,9 @@
|
||||||
mask: true,
|
mask: true,
|
||||||
title: '加载中'
|
title: '加载中'
|
||||||
})
|
})
|
||||||
// 更新缓存中的userInfo
|
let loginRes = this.authLogin();
|
||||||
let res = await this.$request.storageExistUser();
|
if (!loginRes) {
|
||||||
// 获取缓存中的userInfo
|
return;
|
||||||
let curUserInfo = this.$request.getCurUserInfo();
|
|
||||||
this.isAuthWxLoginModal = curUserInfo && curUserInfo.openId ? false : true;
|
|
||||||
if (this.isAuthWxLoginModal) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.isAuthWxPhoneModal = !curUserInfo.phone ? true : false;
|
|
||||||
if (this.isAuthWxPhoneModal) {
|
|
||||||
return;
|
|
||||||
}
|
}
|
||||||
uni.hideLoading();
|
uni.hideLoading();
|
||||||
|
|
||||||
|
|
@ -187,6 +149,27 @@
|
||||||
this.moduleBarInfos = await this.$api.data('moduleBarInfos');
|
this.moduleBarInfos = await this.$api.data('moduleBarInfos');
|
||||||
// this.hotGoods = await this.$api.data('hotGoods');
|
// this.hotGoods = await this.$api.data('hotGoods');
|
||||||
// this.discountGoods = await this.$api.data('discountGoods');
|
// this.discountGoods = await this.$api.data('discountGoods');
|
||||||
|
},
|
||||||
|
async authLogin() {
|
||||||
|
// 更新缓存中的userInfo
|
||||||
|
let res = await this.$request.storageExistUser();
|
||||||
|
// 获取缓存中的userInfo
|
||||||
|
let curUserInfo = this.$request.getCurUserInfo();
|
||||||
|
// 校验提示登录
|
||||||
|
if (!curUserInfo || !curUserInfo.openId) {
|
||||||
|
this.$refs.vertifyLogin.showModal();
|
||||||
|
return false;
|
||||||
|
} else {
|
||||||
|
this.$refs.vertifyLogin.hideModal();
|
||||||
|
}
|
||||||
|
// 校验提示获取手机号码
|
||||||
|
if (!curUserInfo.phone) {
|
||||||
|
this.$refs.vertifyPhone.showModal();
|
||||||
|
return false;
|
||||||
|
} else {
|
||||||
|
this.$refs.vertifyPhone.hideModal();
|
||||||
|
}
|
||||||
|
return true;
|
||||||
},
|
},
|
||||||
bindEvent() {
|
bindEvent() {
|
||||||
uni.$on('index_showProductDetail', this.showDetails);
|
uni.$on('index_showProductDetail', this.showDetails);
|
||||||
|
|
@ -306,20 +289,6 @@
|
||||||
uni.navigateTo({
|
uni.navigateTo({
|
||||||
url: '/pages/product/product-category'
|
url: '/pages/product/product-category'
|
||||||
})
|
})
|
||||||
},
|
|
||||||
authWxLogin() {
|
|
||||||
this.$request.login().then(res => {
|
|
||||||
if (res) {
|
|
||||||
this.loadData();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
getPhoneNumber(e) {
|
|
||||||
this.$request.storagePhoneIntoUserInfo(e.detail.code).then(res => {
|
|
||||||
if (res) {
|
|
||||||
this.loadData();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue