添加登录代码
parent
8e3beb44d9
commit
9cb8aa0bac
Binary file not shown.
|
After Width: | Height: | Size: 7.0 KiB |
@ -0,0 +1,4 @@
|
||||
{
|
||||
"usingComponents": {},
|
||||
"navigationBarTitleText": "登录"
|
||||
}
|
||||
@ -0,0 +1,42 @@
|
||||
/* pages/login/login.wxss */
|
||||
page{
|
||||
height: 100%;
|
||||
}
|
||||
.container{
|
||||
align-items: center;
|
||||
}
|
||||
.title{
|
||||
font-weight: bolder;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
.more-info{
|
||||
color: gray;
|
||||
font-size: 24rpx;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
.buy-btn{
|
||||
margin-top:1rem;
|
||||
background-color: #000;
|
||||
color: white;
|
||||
border-radius: 50rpx;
|
||||
font-weight: 200;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.title-part{
|
||||
text-align: center;
|
||||
}
|
||||
.avatar-wrapper{
|
||||
width: 80rpx !important;
|
||||
height: 80rpx;
|
||||
padding: 0px;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
.avatar{
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
.weui-input{
|
||||
|
||||
}
|
||||
@ -0,0 +1,154 @@
|
||||
// pages/login/login.ts
|
||||
const defaultAvatarUrl = '../../assets/avatar.png'
|
||||
const api = require("../../api/index")
|
||||
const app = getApp<IAppOption>()
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
avatarUrl:defaultAvatarUrl ,
|
||||
nickName:''
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage() {
|
||||
|
||||
},
|
||||
onChooseAvatar(e:any) {
|
||||
console.log(e);
|
||||
const { avatarUrl } = e.detail
|
||||
this.setData({
|
||||
avatarUrl,
|
||||
})
|
||||
},
|
||||
async toWXLogin() {
|
||||
console.log(app.globalData.code)
|
||||
wx.showLoading({
|
||||
title: '加载中',
|
||||
})
|
||||
if(!this.data.nickName) {
|
||||
wx.showToast({
|
||||
title:'请填写昵称',
|
||||
icon: 'error',
|
||||
duration: 2000
|
||||
})
|
||||
return
|
||||
}
|
||||
const token_res = await api.getAccess_token({code:app.globalData.code,nickName:this.data.nickName,avatarUrl:this.data.avatarUrl});
|
||||
if(token_res.code == 200){
|
||||
// 设置缓存
|
||||
wx.setStorageSync('token', token_res.data.access_token);//token
|
||||
wx.setStorageSync('userId', token_res.data.userId);//userId
|
||||
wx.setStorageSync('nickName', this.data.nickName);//nickName
|
||||
wx.setStorageSync('avatarUrl', this.data.avatarUrl);//avatarUrl
|
||||
//绑定微信
|
||||
const login_res =await api.bindingWX({code:app.globalData.code});
|
||||
if(login_res.code == 200){
|
||||
wx.hideLoading()
|
||||
wx.navigateBack({
|
||||
delta: -1
|
||||
})
|
||||
}
|
||||
}
|
||||
else{
|
||||
wx.hideLoading()
|
||||
wx.showToast({
|
||||
title:token_res.message,
|
||||
icon: 'error',
|
||||
duration: 2000
|
||||
})
|
||||
}
|
||||
},
|
||||
async getPhoneNumber (e:any) {//获取手机号
|
||||
// var _this=this;
|
||||
console.log(e)
|
||||
wx.showLoading({
|
||||
title: '加载中',
|
||||
})
|
||||
if(!this.data.nickName) {
|
||||
wx.showToast({
|
||||
title:'请填写昵称',
|
||||
icon: 'error',
|
||||
duration: 2000
|
||||
})
|
||||
return
|
||||
}
|
||||
const token_res = await api.getAccess_token({code:e.detail.code,nickName:this.data.nickName,avatarUrl:this.data.avatarUrl});
|
||||
if(token_res.code == 200){
|
||||
// 设置缓存
|
||||
wx.setStorageSync('token', token_res.data.access_token);//token
|
||||
wx.setStorageSync('userId', token_res.data.userId);//userId
|
||||
wx.setStorageSync('nickName', this.data.nickName);//nickName
|
||||
wx.setStorageSync('avatarUrl', this.data.avatarUrl);//avatarUrl
|
||||
//绑定微信
|
||||
const login_res =await api.toLogin();
|
||||
if(login_res.code == 200){
|
||||
wx.hideLoading()
|
||||
wx.navigateBack({
|
||||
delta: -1
|
||||
})
|
||||
}
|
||||
}
|
||||
else{
|
||||
wx.hideLoading()
|
||||
wx.showToast({
|
||||
title:token_res.message,
|
||||
icon: 'error',
|
||||
duration: 2000
|
||||
})
|
||||
}
|
||||
},
|
||||
})
|
||||
@ -0,0 +1,24 @@
|
||||
<!--pages/login/login.wxml-->
|
||||
<view class="page-box" style="margin-top: 50%;">
|
||||
<!-- <view class="img-part card-part" style="text-align:center">
|
||||
<image mode="aspectFit" style="width: 250rpx;height: 250rpx;" src="../../assets/ico.jpg"></image>
|
||||
</view>
|
||||
<view class="title-part card-part">
|
||||
<view class="title">东方蝴蝶</view>
|
||||
<view class="more-info">使用当前微信登录</view>
|
||||
</view> -->
|
||||
<view class="img-part card-part" style="text-align:center">
|
||||
<!-- <image mode="aspectFit" style="width: 250rpx;height: 250rpx;" src="../../assets/ico.jpg"></image> -->
|
||||
<view class="tip">
|
||||
点击下方头像位置获取微信头像
|
||||
</view>
|
||||
<button class="avatar-wrapper" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar" style="border-radius: 50%;">
|
||||
<image class="avatar" mode="aspectFill" src="{{avatarUrl}}"></image>
|
||||
</button>
|
||||
<input type="nickname" class="weui-input" placeholder="点击获取微信昵称" model:value="{{nickName}}" />
|
||||
</view>
|
||||
<view class="btn-part">
|
||||
<!-- <button class="buy-btn" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">立即登录</button> -->
|
||||
<button class="buy-btn" bindtap="toWXLogin">立即登录</button>
|
||||
</view>
|
||||
</view>
|
||||
@ -0,0 +1,47 @@
|
||||
const custom = {
|
||||
encode (input:any) {
|
||||
let _keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
|
||||
let output = "";
|
||||
let chr1, chr2, chr3, enc1, enc2, enc3, enc4;
|
||||
let i = 0;
|
||||
input = this.utf8_encode(input);
|
||||
while (i < input.length) {
|
||||
chr1 = input.charCodeAt(i++);
|
||||
chr2 = input.charCodeAt(i++);
|
||||
chr3 = input.charCodeAt(i++);
|
||||
enc1 = chr1 >> 2;
|
||||
enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
|
||||
enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
|
||||
enc4 = chr3 & 63;
|
||||
if (isNaN(chr2)) {
|
||||
enc3 = enc4 = 64;
|
||||
} else if (isNaN(chr3)) {
|
||||
enc4 = 64;
|
||||
}
|
||||
output = output +
|
||||
_keyStr.charAt(enc1) + _keyStr.charAt(enc2) +
|
||||
_keyStr.charAt(enc3) + _keyStr.charAt(enc4);
|
||||
}
|
||||
return output;
|
||||
},
|
||||
utf8_encode(input) {
|
||||
input = input.replace(/\r\n/g,"\n");
|
||||
let utftext = "";
|
||||
for (let n = 0; n < input.length; n++) {
|
||||
let c = input.charCodeAt(n);
|
||||
if (c < 128) {
|
||||
utftext += String.fromCharCode(c);
|
||||
} else if((c > 127) && (c < 2048)) {
|
||||
utftext += String.fromCharCode((c >> 6) | 192);
|
||||
utftext += String.fromCharCode((c & 63) | 128);
|
||||
} else {
|
||||
utftext += String.fromCharCode((c >> 12) | 224);
|
||||
utftext += String.fromCharCode(((c >> 6) & 63) | 128);
|
||||
utftext += String.fromCharCode((c & 63) | 128);
|
||||
}
|
||||
|
||||
}
|
||||
return utftext;
|
||||
}
|
||||
}
|
||||
module.exports = custom
|
||||
Loading…
Reference in New Issue