初始化代码
This commit is contained in:
316
uniapp/uni-app/pages/login.vue
Normal file
316
uniapp/uni-app/pages/login.vue
Normal file
@@ -0,0 +1,316 @@
|
||||
<template>
|
||||
<view class="pages-user-login " v-if="isLoad">
|
||||
<uni-nav-bar :fixed="true" :shadow="false" :statusBar="true" :color="`#000`" backgroundColor="#fff" v-if="launchFlag">
|
||||
<view class="flex-center" slot="left">
|
||||
<view @tap="$util.goUrl({url:1,openType:`navigateBack`})"
|
||||
:class="[{'back-user-ios': configInfo.isIos},{'back-user-android': !configInfo.isIos}]">
|
||||
<view class="iconfont icon-home"></view>
|
||||
<view class="back-user_text">返回上页</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-nav-bar>
|
||||
<view class="page-height flex-center flex-column" v-if="launchFlag">
|
||||
<image mode="aspectFill" lazy-load class="logo-img mb-md" :src="base_info.app_logo"></image>
|
||||
<view class="f-caption c-caption">{{base_info.app_text}}</view>
|
||||
<view style="height: 200rpx;"></view>
|
||||
<view @tap="toChooseLogin('weixin')" class="login-btn wechat flex-center f-title c-base radius"><i
|
||||
class="iconfont icon-weixin mr-md"></i>微信登录
|
||||
</view>
|
||||
<view @tap="toChooseLogin('apple')" class="login-btn apple flex-center f-title c-black radius"
|
||||
v-if="is_ios_login && base_info.ios_login"><i class="iconfont icon-apple mr-sm"></i>Sign in with Apple
|
||||
</view>
|
||||
</view>
|
||||
<view class="banner-info" :style="{height:`${windowHeight}px`}" v-else>
|
||||
<image mode="aspectFill" lazy-load class="banner-img fix" :src="base_info.app_banner[0]" />
|
||||
<view @tap="launchApp" class="swiper-to-home flex-center f-caption c-base radius fix" v-if="time>0">
|
||||
跳过 {{time}}s
|
||||
</view>
|
||||
</view>
|
||||
<uni-popup ref="show_rule_item" type="center" :maskClick="false">
|
||||
<view class="common-popup-content fill-base pd-lg radius-34">
|
||||
<view class="title">温馨提示</view>
|
||||
<view class="f-desc c-title mt-lg">
|
||||
登录即表示您已详细阅读并同意<span @tap.stop="goDetail(1)" :style="{color:primaryColor}">
|
||||
《用户隐私协议》
|
||||
</span>与<span @tap.stop="goDetail(2)" :style="{color:primaryColor}">
|
||||
《个人信息保护指引》
|
||||
</span>
|
||||
</view>
|
||||
<view class="button">
|
||||
<view @tap.stop="$refs.show_rule_item.close()" class="item-child">取消</view>
|
||||
<view @tap.stop="wxLogin" class="item-child c-base"
|
||||
:style="{background: primaryColor,color:'#fff'}">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
mapState,
|
||||
mapActions,
|
||||
mapMutations
|
||||
} from 'vuex';
|
||||
import siteInfo from '@/siteinfo.js';
|
||||
export default {
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
isLoad: false,
|
||||
base_info: {},
|
||||
is_ios_login: false,
|
||||
launchFlag: false,
|
||||
windowHeight: uni.getSystemInfoSync().windowHeight,
|
||||
time: 5,
|
||||
timer: null
|
||||
}
|
||||
},
|
||||
async onLoad(options) {
|
||||
let {
|
||||
type = 0
|
||||
} = options
|
||||
type = type * 1
|
||||
console.log(options, "======login options")
|
||||
this.launchFlag = type == 1
|
||||
let [syserr, sysinfo] = await uni.getSystemInfo()
|
||||
let {
|
||||
browserVersion = '',
|
||||
platform
|
||||
} = sysinfo
|
||||
console.log(sysinfo, type)
|
||||
this.is_ios_login = platform === 'ios' && browserVersion.split('.')[0] * 1 > 12
|
||||
this.base_info = await this.$api.base.getConfig()
|
||||
this.isLoad = true
|
||||
if (type == 1) return
|
||||
let time = 5
|
||||
this.timer = setInterval(() => {
|
||||
if (time == 1) {
|
||||
this.launchApp()
|
||||
}
|
||||
if (time === 0) {
|
||||
clearTimeout(this.timer)
|
||||
return
|
||||
}
|
||||
time--
|
||||
this.time = time
|
||||
console.log(time, "==========onload time")
|
||||
}, 1000)
|
||||
},
|
||||
computed: mapState({
|
||||
primaryColor: state => state.config.configInfo.primaryColor,
|
||||
subColor: state => state.config.configInfo.subColor,
|
||||
configInfo: state => state.config.configInfo,
|
||||
autograph: state => state.user.autograph,
|
||||
appLogin: state => state.user.appLogin,
|
||||
loginType: state => state.user.loginType,
|
||||
loginPage: state => state.user.loginPage,
|
||||
push_id: state => state.user.push_id,
|
||||
userInfo: state => state.user.userInfo,
|
||||
}),
|
||||
methods: {
|
||||
...mapActions(['getConfigInfo', 'getUserInfo']),
|
||||
...mapMutations(['updateConfigItem', 'updateUserItem']),
|
||||
launchApp() {
|
||||
this.timer && clearTimeout(this.timer)
|
||||
console.log(this.time, this.timer, "==========launchApp")
|
||||
this.$util.goUrl({
|
||||
url: `/pages/home`,
|
||||
openType: `reLaunch`
|
||||
})
|
||||
|
||||
// let {
|
||||
// autograph = '',
|
||||
// appLogin = ''
|
||||
// } = this
|
||||
// if (autograph && appLogin) {
|
||||
// this.toLogin(appLogin, 2)
|
||||
// return
|
||||
// }
|
||||
// this.launchFlag = true
|
||||
},
|
||||
toChooseLogin(type) {
|
||||
this.updateUserItem({
|
||||
key: 'loginType',
|
||||
val: type
|
||||
})
|
||||
this.$refs.show_rule_item.open()
|
||||
},
|
||||
//微信登录
|
||||
async wxLogin() {
|
||||
this.$refs.show_rule_item.close()
|
||||
let {
|
||||
loginType: provider
|
||||
} = this
|
||||
// if (provider == 'apple') {
|
||||
// this.toLogin({
|
||||
// "openId": "000676.61e8347753f6453f93d32423c23262d0.0350",
|
||||
// "fullName": {
|
||||
// "familyName": "肖",
|
||||
// "giveName": "丽",
|
||||
// "givenName": "丽"
|
||||
// },
|
||||
// "email": "1148960431@qq.com",
|
||||
// "authorizationCode": "cbfab854d7cae49a689b69bf4c628a890.0.swxw.O_BwdO3dG60HUKbn9IG80w",
|
||||
// "identityToken": "eyJraWQiOiJXNldjT0tCIiwiYWxnIjoiUlMyNTYifQ.eyJpc3MiOiJodHRwczovL2FwcGxlaWQuYXBwbGUuY29tIiwiYXVkIjoiY29tLnN1b2hhZmFybS5zYyIsImV4cCI6MTY2MzczMjIzMiwiaWF0IjoxNjYzNjQ1ODMyLCJzdWIiOiIwMDA2NzYuNjFlODM0Nzc1M2Y2NDUzZjkzZDMyNDIzYzIzMjYyZDAuMDM1MCIsImNfaGFzaCI6Ik80MDdrMGdmRUZXeGZSdlhnXzRUa1EiLCJlbWFpbCI6IjExNDg5NjA0MzFAcXEuY29tIiwiZW1haWxfdmVyaWZpZWQiOiJ0cnVlIiwiYXV0aF90aW1lIjoxNjYzNjQ1ODMyLCJub25jZV9zdXBwb3J0ZWQiOnRydWUsInJlYWxfdXNlcl9zdGF0dXMiOjF9.Q9Vjsvnk_cQH1Dt_N7wvunP_nq2KwKt_bqj0onKQMCwaM8SinkGavUG0bs-HdaEqQ368n8iZR_VwiLM2mPyOBhgNOT87WB0tTWxi66r3hGIOUhOG4aapPr1XZ81O4NySjRCwAhbnUsxY7xPBW1y6ghgwIgEGlSICRj4XE7gJOwoZFNI_FVOqCeGao4xHbub9-gJuQYuuwlTY7oPnyU1BBZqk3HBHG6fchrF0bnev-PjjjClKqz1FoNnbiZr6-H_CrvgKo2ZIlzxGIpCuABT4UkMuwjMEac-mNd-akFFovSoeWyXB2oLlZd33GsOhZVTiXWrb5CAJ6SUWSBWdYLkpbQ",
|
||||
// "realUserStatus": 1,
|
||||
// "push_id": ""
|
||||
// }, 1)
|
||||
// return
|
||||
// }
|
||||
try {
|
||||
let [providerErr, providerData] = await uni.getProvider({
|
||||
service: 'oauth',
|
||||
});
|
||||
let [loginErr, loginData] = await uni.login({
|
||||
provider
|
||||
});
|
||||
let [infoErr, infoData] = await uni.getUserInfo({
|
||||
provider
|
||||
})
|
||||
let {
|
||||
userInfo = {}
|
||||
} = infoData
|
||||
let {
|
||||
openId = ''
|
||||
} = userInfo
|
||||
if (!openId) return
|
||||
this.$util.showLoading({
|
||||
title: "登录中..."
|
||||
})
|
||||
userInfo.push_id = this.push_id
|
||||
try {
|
||||
console.log(userInfo, "=======userInfo")
|
||||
this.toLogin(userInfo, 1)
|
||||
} catch (e) {
|
||||
this.$util.hideAll()
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('请先安装微信或升级版本')
|
||||
this.$util.showToast({
|
||||
title: `没有获取到用户信息，请确认已登录`
|
||||
});
|
||||
}
|
||||
},
|
||||
async toLogin(userInfo, init) {
|
||||
let {
|
||||
loginType
|
||||
} = this
|
||||
|
||||
let methodModel = loginType == 'weixin' ? 'logappLoginin' : 'iosLogin'
|
||||
let user_info = await this.$api.base[methodModel]({
|
||||
data: userInfo
|
||||
})
|
||||
console.log(loginType, user_info, "========user_info")
|
||||
if (init == 1) {
|
||||
this.updateUserItem({
|
||||
key: 'appLogin',
|
||||
val: userInfo
|
||||
})
|
||||
}
|
||||
let {
|
||||
autograph,
|
||||
data
|
||||
} = user_info
|
||||
this.$util.hideAll()
|
||||
this.updateUserItem({
|
||||
key: 'userInfo',
|
||||
val: data
|
||||
})
|
||||
this.updateUserItem({
|
||||
key: 'autograph',
|
||||
val: autograph
|
||||
})
|
||||
this.updateUserItem({
|
||||
key: 'isShowLogin',
|
||||
val: false
|
||||
})
|
||||
let {
|
||||
phone = ''
|
||||
} = data
|
||||
let url = loginType == 'weixin' && !phone ? `/mine/pages/phone` : this.loginPage || `/pages/home`
|
||||
let openType = loginType == 'weixin' && !phone ? `reLaunch` : `switchTab`
|
||||
console.log(url, openType, "====url")
|
||||
this.$util.goUrl({
|
||||
url,
|
||||
openType
|
||||
})
|
||||
},
|
||||
goDetail(type) {
|
||||
let {
|
||||
siteroot
|
||||
} = siteInfo
|
||||
let href = siteroot.split('index.php')[0]
|
||||
let page = type == 1 ? 'protocol' : 'information'
|
||||
let url = `${href}${page}.html`
|
||||
this.$util.goUrl({
|
||||
url,
|
||||
openType: 'web'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #fff;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.pages-user-login {
|
||||
|
||||
.page-height {
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.logo-img {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.login-btn {
|
||||
width: 220pt;
|
||||
height: 44pt;
|
||||
font-size: 15pt;
|
||||
border: 1rpx solid #000;
|
||||
transform: rotateZ(360deg);
|
||||
|
||||
.iconfont {
|
||||
font-size: 19pt;
|
||||
}
|
||||
}
|
||||
|
||||
.wechat {
|
||||
border: none;
|
||||
font-size: 13pt;
|
||||
background: linear-gradient(90deg, #177541 0%, #00BF56 99%);
|
||||
box-shadow: 0 18rpx 9rpx 0 rgba(0, 188, 82, 0.07);
|
||||
}
|
||||
|
||||
.apple {
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
|
||||
.banner-info {
|
||||
width: 100%;
|
||||
|
||||
.banner-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.swiper-to-home {
|
||||
width: 122rpx;
|
||||
height: 47rpx;
|
||||
z-index: 999;
|
||||
right: 40rpx;
|
||||
top: 80rpx;
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user