fe / yoho-miniapp-yohood · Commits

Go to a project

Authored by 肖亚东
Commit 1449c5ff27f460772f6c78053ea13bdf2916b3f3 1 parent c56a9b14

个人中心以及登录功能

Inline Side-by-side
Showing 9 changed files with 117 additions and 70 deletions
@@ -3,7 +3,7 @@ import { GET, POST } from '../../libs/request'; @@ -3,7 +3,7 @@ import { GET, POST } from '../../libs/request';
3 import { API_HOST } from '../../libs/config'; 3 import { API_HOST } from '../../libs/config';
4 Component({ 4 Component({
5 5
6 - externalClasses: ['login-class'], 6 + // externalClasses: ['login-class'],
7 /** 7 /**
8 * 组件的属性列表 8 * 组件的属性列表
9 */ 9 */
@@ -5,4 +5,9 @@ @@ -5,4 +5,9 @@
5 display: flex; 5 display: flex;
6 align-items: center; 6 align-items: center;
7 justify-content: center; 7 justify-content: center;
  8 +}
  9 +
  10 +.login-class{
  11 + width: 100%;
  12 + height: 100%;
8 } 13 }
1 Page({ 1 Page({
2 data: { 2 data: {
3 - 3 + url: 'https://m.yohobuy.com',
4 }, 4 },
5 onLoad: function(options) { 5 onLoad: function(options) {
6 //Do some initialize when page load. 6 //Do some initialize when page load.
1 -<view class="container"> 1 +<!-- <view class="container">
2 <image src="../../static/images/empty_view@3x.png" mode="widthFix" class="empty"></image> 2 <image src="../../static/images/empty_view@3x.png" mode="widthFix" class="empty"></image>
3 -</view>  
  3 +</view> -->
  4 +
  5 +<web-view src="{{url}}"></web-view>
@@ -47,26 +47,26 @@ Page({ @@ -47,26 +47,26 @@ Page({
47 hasUnionID: app.globalData.WXUnion_ID !== null && app.globalData.WXUnion_ID !== '' && app.globalData.WXUnion_ID !== undefined ? true:false, 47 hasUnionID: app.globalData.WXUnion_ID !== null && app.globalData.WXUnion_ID !== '' && app.globalData.WXUnion_ID !== undefined ? true:false,
48 cur_undoneTicket 48 cur_undoneTicket
49 }) 49 })
50 - if (app.isLogin()) {  
51 - this.data.isLogin = true;  
52 - }else{  
53 - this.setData({  
54 - isLogin:false,  
55 - })  
56 - }  
57 50
58 //订阅登录完成通知 51 //订阅登录完成通知
59 listen(function (succeed) { 52 listen(function (succeed) {
60 if (succeed) { 53 if (succeed) {
61 this.showUserInfo(); 54 this.showUserInfo();
62 - this.getInfoNum();  
63 - this.fetchInviteInfo();  
64 } 55 }
65 }.bind(this)) 56 }.bind(this))
66 }, 57 },
67 onReady: function() { 58 onReady: function() {
68 //Do some when page ready. 59 //Do some when page ready.
69 - 60 + if (app.isLogin()) {
  61 + this.setData({
  62 + isLogin: true,
  63 + })
  64 + this.showUserInfo();
  65 + }else{
  66 + this.setData({
  67 + isLogin: false,
  68 + })
  69 + }
70 }, 70 },
71 onShow: function() { 71 onShow: function() {
72 //Do some when page show. 72 //Do some when page show.
1 { 1 {
2 "navigationBarTitleText": "我的", 2 "navigationBarTitleText": "我的",
  3 + "enablePullDownRefresh": true,
3 "usingComponents": { 4 "usingComponents": {
4 "section-header" : "/components/user-center/section-header/index", 5 "section-header" : "/components/user-center/section-header/index",
5 "undone-view": "/components/user-center/undone-view/index", 6 "undone-view": "/components/user-center/undone-view/index",
1 <view class="container"> 1 <view class="container">
2 - <!-- 头部用户信息 -->  
3 - <view class="user-info">  
4 - <login-button  
5 - wx:if="{{!isLogin}}"  
6 - class="login-bg"  
7 - login-class="login-btn"  
8 - open-type="{{hasUnionID?'getPhoneNumber':'getUserInfo'}}"  
9 - bindgetphonenumber="getPhoneNumber"  
10 - bindgetuserinfo='getUserInfo'  
11 - bindupdateuserinfo="updateUserInfo">登录/注册  
12 - </login-button>  
13 - <block wx:else>  
14 - <image class="header-bg" src="https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2700915385,2771074487&fm=26&gp=0.jpg" mode="aspectFill">  
15 - <view class="user-info">  
16 - <image class="portrait" src="{{userInfo.avatarUrl}}" mode="aspectFill"></image>  
17 - <view class="nick-name">{{userInfo.nickName}}</view>  
18 - <view class="qrcode-view" bindtap="tapMyQRCode">  
19 - <image class="qrcode-icon" src="../../static/images/myQRcode@3x.png"></image>  
20 - <view class="qrcode-tips">我的二维码</view>  
21 - </view>  
22 - </view>  
23 - </image>  
24 - </block> 2 + <!-- 未登录 -->
  3 + <view wx:if="{{!isLogin}}" class="not-login-view">
  4 + <image class="login-icon" src="../../static/images/userCenter_login@3x.png">
  5 + <login-button
  6 + class="login-btn"
  7 + open-type="{{hasUnionID?'getPhoneNumber':'getUserInfo'}}"
  8 + bindgetphonenumber="getPhoneNumber"
  9 + bindgetuserinfo='getUserInfo'
  10 + bindupdateuserinfo="updateUserInfo">
  11 + </login-button>
  12 + </image>
25 </view> 13 </view>
26 -  
27 - <!-- 我的门票 -->  
28 - <section-header title="我的门票" more-title="全部订单" has-more="true" bind:tapMore="jumpAllOrders"></section-header>  
29 - <block wx:if="{{noTicket}}">  
30 - <undone-view undone-data="{{cur_undoneTicket}}" bind:jumpAllOrders="jumpAllOrders" bind:tapButton="tapButton"></undone-view>  
31 - </block>  
32 - <block wx:else>  
33 - <ticket-slide></ticket-slide>  
34 - </block>  
35 -  
36 - <view class="space-view"></view>  
37 -  
38 - <!-- 我的活动 -->  
39 - <section-header title="我的活动" more-title="更多活动" has-more="{{!noActivity}}" bind:tapMore="jumpMoreActivity"></section-header>  
40 - <block wx:if="{{noActivity}}">  
41 - <undone-view undone-data="{{notJionActivity}}" bind:tapButton="tapButton"></undone-view>  
42 - </block> 14 + <!-- 已登录 -->
43 <block wx:else> 15 <block wx:else>
44 - <scroll-view scroll-y>  
45 - <block wx:for="{{array}}" wx:key="index">  
46 - <schedule-item data="{{item}}"></schedule-item>  
47 - <view wx:if="{{index!=array.length-1}}" class="space-view40"></view>  
48 - </block>  
49 -  
50 - <view class="end-space-view">  
51 - <view class="left-line"></view>  
52 - <view class="end">已结束</view>  
53 - <view class="right-line"></view> 16 + <!-- 头部用户信息 -->
  17 + <view class="header-bg">
  18 + <image class="user-info" src="{{isLogin ? userInfo.avatarUrl : ''}}" mode="aspectFill">
  19 + <view class="black-cover">
  20 + <view class="user-info">
  21 + <image class="portrait" src="{{userInfo.avatarUrl}}" mode="aspectFill"></image>
  22 + <view class="nick-name">{{userInfo.nickName}}</view>
  23 + <view class="qrcode-view" bindtap="tapMyQRCode" wx:if="{{isLogin}}">
  24 + <image class="qrcode-icon" src="../../static/images/myQRcode@3x.png"></image>
  25 + <view class="qrcode-tips">我的二维码</view>
  26 + </view>
  27 + </view>
54 </view> 28 </view>
  29 + </image>
  30 + </view>
  31 +
  32 + <!-- 我的门票 -->
  33 + <section-header title="我的门票" more-title="全部订单" has-more="true" bind:tapMore="jumpAllOrders"></section-header>
  34 + <block wx:if="{{noTicket}}">
  35 + <undone-view undone-data="{{cur_undoneTicket}}" bind:jumpAllOrders="jumpAllOrders" bind:tapButton="tapButton"></undone-view>
  36 + </block>
  37 + <block wx:else>
  38 + <ticket-slide></ticket-slide>
  39 + </block>
55 40
56 - <block wx:for="{{array}}" wx:key="index">  
57 - <schedule-item data="{{item}}"></schedule-item>  
58 - <view wx:if="{{index!=array.length-1}}" class="space-view40"></view>  
59 - </block>  
60 - </scroll-view> 41 + <view class="space-view"></view>
  42 +
  43 + <!-- 我的活动 -->
  44 + <section-header title="我的活动" more-title="更多活动" has-more="{{!noActivity}}" bind:tapMore="jumpMoreActivity"></section-header>
  45 + <block wx:if="{{noActivity}}">
  46 + <undone-view undone-data="{{notJionActivity}}" bind:tapButton="tapButton"></undone-view>
  47 + </block>
  48 + <block wx:else>
  49 + <scroll-view scroll-y>
  50 + <block wx:for="{{array}}" wx:key="index">
  51 + <schedule-item data="{{item}}"></schedule-item>
  52 + <view wx:if="{{index!=array.length-1}}" class="space-view40"></view>
  53 + </block>
  54 +
  55 + <view class="end-space-view">
  56 + <view class="left-line"></view>
  57 + <view class="end">已结束</view>
  58 + <view class="right-line"></view>
  59 + </view>
  60 +
  61 + <block wx:for="{{array}}" wx:key="index">
  62 + <schedule-item data="{{item}}"></schedule-item>
  63 + <view wx:if="{{index!=array.length-1}}" class="space-view40"></view>
  64 + </block>
  65 + </scroll-view>
  66 + </block>
61 </block> 67 </block>
62 68
63 </view> 69 </view>
@@ -2,6 +2,30 @@ @@ -2,6 +2,30 @@
2 position: relative; 2 position: relative;
3 } 3 }
4 4
  5 +.not-login-view {
  6 + width: 100%;
  7 + height: 100%;
  8 + background-color: #fff;
  9 + display: flex;
  10 + justify-content: center;
  11 +}
  12 +
  13 +.not-login-view .login-icon {
  14 + position: absolute;
  15 + width: 369rpx;
  16 + height: 277rpx;
  17 + margin-top: 45%;
  18 +}
  19 +
  20 +.not-login-view .login-icon .login-btn {
  21 + position: absolute;
  22 + bottom: 0;
  23 + left: 0;
  24 + width: 369rpx;
  25 + height: 80rpx;
  26 + opacity: 0.01;
  27 +}
  28 +
5 .header-bg { 29 .header-bg {
6 width: 750rpx; 30 width: 750rpx;
7 height: 360rpx; 31 height: 360rpx;
@@ -16,7 +40,16 @@ @@ -16,7 +40,16 @@
16 display: flex; 40 display: flex;
17 flex-direction: column; 41 flex-direction: column;
18 align-items: center; 42 align-items: center;
19 - z-index: 99; 43 +}
  44 +
  45 +.user-info .black-cover {
  46 + opacity: 0.8;
  47 + background-color: #000;
  48 + position: absolute;
  49 + top: 0;
  50 + left: 0;
  51 + width: 100%;
  52 + height: 360rpx;
20 } 53 }
21 54
22 .user-info .portrait { 55 .user-info .portrait {