0225268 4 ヶ月 前
コミット
c837a98b50
2 ファイル変更22 行追加22 行削除
  1. 8 17
      src/app/tab4/tab4.page.html
  2. 14 5
      src/app/tab4/tab4.page.ts

+ 8 - 17
src/app/tab4/tab4.page.html

@@ -15,43 +15,34 @@
   </ion-toolbar>
 </ion-header>
 
-<!-- <ion-card>
-  <img alt="" src="https://ionicframework.com/docs/img/demos/card-media.png" />
-  <ion-card-header>
-    <ion-card-title>{{user?.get("username") || '未登录'}}</ion-card-title>
-    <ion-card-subtitle *ngIf="!user?.id">请您登陆后继续使用</ion-card-subtitle>
-    <ion-card-subtitle *ngIf="user?.id">{{user?.get("name")}}-{{user?.get("gender")}}</ion-card-subtitle>
-  </ion-card-header> -->
-
-  <!-- 新增:根据用户状态,显示登录/登出按钮,执行跳转或登出函数 -->
-  <!-- <ion-button *ngIf="!user?.id" fill="clear" routerLink="../../modules/user/login">登录</ion-button>
-  <ion-button *ngIf="user?.id" fill="clear" routerLink="../../modules/user/edit/info">编辑资料</ion-button>
-  <ion-button *ngIf="user?.id" fill="clear" (click)="logout()">登出</ion-button>
-</ion-card> -->
 
 <ion-content>
+
     <ion-card-content>
       <ion-avatar style="margin-left:15px;margin-top:15px; transform:scale(1.8)">
         <img src="https://ionicframework.com/docs/img/demos/avatar.svg" alt="User Avatar">
       </ion-avatar>
       <ion-card-content>
-        <p (click)="openLoginPage()" style="margin-left:10px;margin-top:15px;font-size:20px">登录/注册</p>
+        <p *ngIf="!user?.id" (click)="openLoginPage()" style="margin-left:10px;margin-top:15px;font-size:20px">登录/注册</p>
+        <p *ngIf="user?.id" (click)="openLoginPage()" style="margin-left:10px;margin-top:15px;font-size:20px">{{user?.get("username")}}</p>
       </ion-card-content>
+    <ion-button *ngIf="user?.id" fill="clear" (click)="logout()">登出</ion-button>
+
     </ion-card-content>
 
   <ion-card>
     <ion-grid>
   <ion-row>
     <ion-col size="4">
-      <p class="count" style="color:black" (click)="openFollowingPage()">{{user.following}}</p>
+      <p class="count" style="color:black" (click)="openFollowingPage()">{{userCount.following}}</p>
       <p class="label" (click)="openFollowerPage()">关注</p>
     </ion-col>
     <ion-col size="4">
-      <p class="count" style="color:black">{{user.followers}}</p>
+      <p class="count" style="color:black">{{userCount.followers}}</p>
       <p class="label">粉丝</p>
     </ion-col>
     <ion-col size="4">
-      <p class="count" style="color:black">{{user.likes}}</p>
+      <p class="count" style="color:black">{{userCount.likes}}</p>
       <p class="label">获赞</p>
     </ion-col>
   </ion-row>

+ 14 - 5
src/app/tab4/tab4.page.ts

@@ -1,7 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { NavController } from '@ionic/angular';
 import { Router } from '@angular/router';
-
+import Parse from "parse";
 
 @Component({
   selector: 'app-tab4',
@@ -74,7 +74,7 @@ export class Tab4Page implements OnInit {
 
   openLoginPage() {
     //打开登录页面
-    this.navCtrl.navigateForward('../../modules/user/login/login.module');
+    this.navCtrl.navigateForward('/user/login');
   }
 
   openFollowingPage(){
@@ -100,15 +100,24 @@ export class Tab4Page implements OnInit {
   //   Parse.User.logOut();
   // }
 
-  user={
+  userCount={
     followers: 3,
     following: 2,
     likes: 0
   }
 
-  ngOnInit() {
+ // 由于Parse.User.current()是随着localStorage变化的属性
+  // 为了避免首次复制后用户状态变化,页面不同步,通过get方法实现实时获取
+  user:Parse.User|undefined
+  async ngOnInit() {
     this.showContent(this.selectedContent);
+    this.user = await Parse.User.current()
+      setInterval(async ()=>{
+      this.user = await Parse.User.current()
+    },1000)
+  }
+  logout(){
+    Parse.User.logOut();
   }
-
 }