Authored by 肖亚东

个人中心以及登录功能

... ... @@ -3,7 +3,7 @@ import { GET, POST } from '../../libs/request';
import { API_HOST } from '../../libs/config';
Component({
externalClasses: ['login-class'],
// externalClasses: ['login-class'],
/**
* 组件的属性列表
*/
... ...
... ... @@ -5,4 +5,9 @@
display: flex;
align-items: center;
justify-content: center;
}
.login-class{
width: 100%;
height: 100%;
}
\ No newline at end of file
... ...
Page({
data: {
url: 'https://m.yohobuy.com',
},
onLoad: function(options) {
//Do some initialize when page load.
... ...
<view class="container">
<!-- <view class="container">
<image src="../../static/images/empty_view@3x.png" mode="widthFix" class="empty"></image>
</view>
\ No newline at end of file
</view> -->
<web-view src="{{url}}"></web-view>
\ No newline at end of file
... ...
... ... @@ -47,26 +47,26 @@ Page({
hasUnionID: app.globalData.WXUnion_ID !== null && app.globalData.WXUnion_ID !== '' && app.globalData.WXUnion_ID !== undefined ? true:false,
cur_undoneTicket
})
if (app.isLogin()) {
this.data.isLogin = true;
}else{
this.setData({
isLogin:false,
})
}
//订阅登录完成通知
listen(function (succeed) {
if (succeed) {
this.showUserInfo();
this.getInfoNum();
this.fetchInviteInfo();
}
}.bind(this))
},
onReady: function() {
//Do some when page ready.
if (app.isLogin()) {
this.setData({
isLogin: true,
})
this.showUserInfo();
}else{
this.setData({
isLogin: false,
})
}
},
onShow: function() {
//Do some when page show.
... ...
{
"navigationBarTitleText": "我的",
"enablePullDownRefresh": true,
"usingComponents": {
"section-header" : "/components/user-center/section-header/index",
"undone-view": "/components/user-center/undone-view/index",
... ...
<view class="container">
<!-- 头部用户信息 -->
<view class="user-info">
<login-button
wx:if="{{!isLogin}}"
class="login-bg"
login-class="login-btn"
open-type="{{hasUnionID?'getPhoneNumber':'getUserInfo'}}"
bindgetphonenumber="getPhoneNumber"
bindgetuserinfo='getUserInfo'
bindupdateuserinfo="updateUserInfo">登录/注册
</login-button>
<block wx:else>
<image class="header-bg" src="https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2700915385,2771074487&fm=26&gp=0.jpg" mode="aspectFill">
<view class="user-info">
<image class="portrait" src="{{userInfo.avatarUrl}}" mode="aspectFill"></image>
<view class="nick-name">{{userInfo.nickName}}</view>
<view class="qrcode-view" bindtap="tapMyQRCode">
<image class="qrcode-icon" src="../../static/images/myQRcode@3x.png"></image>
<view class="qrcode-tips">我的二维码</view>
</view>
</view>
</image>
</block>
<!-- 未登录 -->
<view wx:if="{{!isLogin}}" class="not-login-view">
<image class="login-icon" src="../../static/images/userCenter_login@3x.png">
<login-button
class="login-btn"
open-type="{{hasUnionID?'getPhoneNumber':'getUserInfo'}}"
bindgetphonenumber="getPhoneNumber"
bindgetuserinfo='getUserInfo'
bindupdateuserinfo="updateUserInfo">
</login-button>
</image>
</view>
<!-- 我的门票 -->
<section-header title="我的门票" more-title="全部订单" has-more="true" bind:tapMore="jumpAllOrders"></section-header>
<block wx:if="{{noTicket}}">
<undone-view undone-data="{{cur_undoneTicket}}" bind:jumpAllOrders="jumpAllOrders" bind:tapButton="tapButton"></undone-view>
</block>
<block wx:else>
<ticket-slide></ticket-slide>
</block>
<view class="space-view"></view>
<!-- 我的活动 -->
<section-header title="我的活动" more-title="更多活动" has-more="{{!noActivity}}" bind:tapMore="jumpMoreActivity"></section-header>
<block wx:if="{{noActivity}}">
<undone-view undone-data="{{notJionActivity}}" bind:tapButton="tapButton"></undone-view>
</block>
<!-- 已登录 -->
<block wx:else>
<scroll-view scroll-y>
<block wx:for="{{array}}" wx:key="index">
<schedule-item data="{{item}}"></schedule-item>
<view wx:if="{{index!=array.length-1}}" class="space-view40"></view>
</block>
<view class="end-space-view">
<view class="left-line"></view>
<view class="end">已结束</view>
<view class="right-line"></view>
<!-- 头部用户信息 -->
<view class="header-bg">
<image class="user-info" src="{{isLogin ? userInfo.avatarUrl : ''}}" mode="aspectFill">
<view class="black-cover">
<view class="user-info">
<image class="portrait" src="{{userInfo.avatarUrl}}" mode="aspectFill"></image>
<view class="nick-name">{{userInfo.nickName}}</view>
<view class="qrcode-view" bindtap="tapMyQRCode" wx:if="{{isLogin}}">
<image class="qrcode-icon" src="../../static/images/myQRcode@3x.png"></image>
<view class="qrcode-tips">我的二维码</view>
</view>
</view>
</view>
</image>
</view>
<!-- 我的门票 -->
<section-header title="我的门票" more-title="全部订单" has-more="true" bind:tapMore="jumpAllOrders"></section-header>
<block wx:if="{{noTicket}}">
<undone-view undone-data="{{cur_undoneTicket}}" bind:jumpAllOrders="jumpAllOrders" bind:tapButton="tapButton"></undone-view>
</block>
<block wx:else>
<ticket-slide></ticket-slide>
</block>
<block wx:for="{{array}}" wx:key="index">
<schedule-item data="{{item}}"></schedule-item>
<view wx:if="{{index!=array.length-1}}" class="space-view40"></view>
</block>
</scroll-view>
<view class="space-view"></view>
<!-- 我的活动 -->
<section-header title="我的活动" more-title="更多活动" has-more="{{!noActivity}}" bind:tapMore="jumpMoreActivity"></section-header>
<block wx:if="{{noActivity}}">
<undone-view undone-data="{{notJionActivity}}" bind:tapButton="tapButton"></undone-view>
</block>
<block wx:else>
<scroll-view scroll-y>
<block wx:for="{{array}}" wx:key="index">
<schedule-item data="{{item}}"></schedule-item>
<view wx:if="{{index!=array.length-1}}" class="space-view40"></view>
</block>
<view class="end-space-view">
<view class="left-line"></view>
<view class="end">已结束</view>
<view class="right-line"></view>
</view>
<block wx:for="{{array}}" wx:key="index">
<schedule-item data="{{item}}"></schedule-item>
<view wx:if="{{index!=array.length-1}}" class="space-view40"></view>
</block>
</scroll-view>
</block>
</block>
</view>
... ...
... ... @@ -2,6 +2,30 @@
position: relative;
}
.not-login-view {
width: 100%;
height: 100%;
background-color: #fff;
display: flex;
justify-content: center;
}
.not-login-view .login-icon {
position: absolute;
width: 369rpx;
height: 277rpx;
margin-top: 45%;
}
.not-login-view .login-icon .login-btn {
position: absolute;
bottom: 0;
left: 0;
width: 369rpx;
height: 80rpx;
opacity: 0.01;
}
.header-bg {
width: 750rpx;
height: 360rpx;
... ... @@ -16,7 +40,16 @@
display: flex;
flex-direction: column;
align-items: center;
z-index: 99;
}
.user-info .black-cover {
opacity: 0.8;
background-color: #000;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 360rpx;
}
.user-info .portrait {
... ...