feat:f

src/app/contact-list/contact-list.page.html

@@ -14,7 +14,7 @@
     <ion-header>
       <ion-toolbar>
         <ion-buttons slot="start">
-          <ion-button>取消</ion-button>
+          <ion-button (click)="cancel()">取消</ion-button>
         </ion-buttons>
         <ion-title>添加联系人</ion-title>
         <ion-buttons slot="end">

src/app/contact-list/contact-list.page.ts

@@ -1,4 +1,5 @@
 import { Component, OnInit } from '@angular/core';
+import { NavController } from '@ionic/angular';
 import * as Parse from "parse";
 @Component({
   selector: 'app-contact-list',
@@ -12,6 +13,7 @@ export class ContactListPage implements OnInit {
   ngOnInit() {
     this.loadContact();
   }
+  constructor(private navCtrl: NavController) {}
 
   usernameInput:string = ""
   async checkIfExists(toUser:Parse.Object){
@@ -78,4 +80,9 @@ export class ContactListPage implements OnInit {
       return `The light is ${this.isOn ? 'On' : 'Off'}`;
   }
 
+  cancel() {
+    console.log(333)
+    this.navCtrl.navigateForward('/');
+  }
+
 }

src/app/tab1/tab1.page.scss

@@ -43,12 +43,12 @@ ion-card-content {
   flex: 1;
 }
 
-.card-image {
-  width: 100px;  /* 增大头像宽度 */
-  height: 100px; /* 增大头像高度 */
-  border-radius: 50%;
-  object-fit: cover;
-}
+// .card-image {
+//   width: 100px;  /* 增大头像宽度 */
+//   height: 100px; /* 增大头像高度 */
+//   border-radius: 50%;
+//   object-fit: cover;
+// }
 
 ion-item.recommended-player-card {
   --background: #fff;
@@ -60,31 +60,31 @@ ion-item.recommended-player-card {
   align-items: center;
 }
 
-ion-item.recommended-player-card ion-avatar {
-  margin-right: 20px; /* 增加头像与内容之间的间距 */
-}
+// ion-item.recommended-player-card ion-avatar {
+//   margin-right: 20px; /* 增加头像与内容之间的间距 */
+// }
 
-ion-item.recommended-player-card ion-avatar img {
-  width: 100px; /* 增大头像宽度 */
-  height: 100px; /* 增大头像高度 */
-  border-radius: 50%;
-  object-fit: cover;
-}
+// ion-item.recommended-player-card ion-avatar img {
+//   width: 100px; /* 增大头像宽度 */
+//   height: 100px; /* 增大头像高度 */
+//   border-radius: 50%;
+//   object-fit: cover;
+// }
 
-ion-item.recommended-player-card ion-label {
-  flex: 1;
-  font-size: 1.2em; /* 增大字体尺寸 */
-}
+// ion-item.recommended-player-card ion-label {
+//   flex: 1;
+//   font-size: 1.2em; /* 增大字体尺寸 */
+// }
 
 ion-item.recommended-player-card ion-label h2 {
   margin: 0;
   font-size: 1.5em; /* 增大标题字体尺寸 */
 }
 
-ion-item.recommended-player-card ion-label p {
-  margin: 5px 0 0;
-  font-size: 1.2em; /* 增大内容字体尺寸 */
-}
+// ion-item.recommended-player-card ion-label p {
+//   margin: 5px 0 0;
+//   font-size: 1.2em; /* 增大内容字体尺寸 */
+// }
 
 .more-button {
   margin: 20px 0;

src/app/tab1/tab1.page.ts

@@ -16,10 +16,10 @@ export class Tab1Page {
   ];
 
   recommendedPlayers = [
-    { name: 'Player 1', info: '技术大神111111111111111111111111111111111111111111111111111111111111111111111111111', avatar: 'assets/avatar1.png' },
-    { name: 'Player 2', info: '包赢承诺', avatar: 'assets/avatar2.png' },
-    { name: 'Player 3', info: '优质声优', avatar: 'assets/avatar3.png' },
-    { name: 'Player 4', info: '同城代练11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111', avatar: 'assets/avatar4.png' },
+    { name: 'Player 1', info: '技术大神专业陪玩，技术过硬 —— 我们精心挑选的游戏高手，无论是热门MOBA、FPS、RPG，还是小众独立游戏，都能带你飞！无论是上分冲段，还是探索剧情，我们都能成为你最坚实的后盾。', avatar: 'assets/avatar1.png' },
+    { name: 'Player 2', info: '包赢承诺  每个人的游戏梦想都值得被尊重。告诉我们你的需求，无论是追求极限挑战，还是享受悠闲时光，我们都将为你量身打造独一无二的陪玩体验。', avatar: 'assets/avatar2.png' },
+    { name: 'Player 3', info: '优质声优  趣味相投，欢乐无限 —— 幽默风趣的聊天，轻松愉快的氛围，让你的游戏时间不再单调。分享攻略，吐槽趣事，我们不仅是队友，更是朋友！', avatar: 'assets/avatar3.png' },
+    { name: 'Player 4', info: '同城代练全可靠，隐私保护 —— 我们承诺，所有陪玩均经过严格筛选与培训，确保服务质量与安全。同时，我们尊重每一位用户的隐私，让你的游戏体验更加安心。', avatar: 'assets/avatar4.png' },
   ];
 
   selectedSegment = 'online';

src/app/tab3/tab3.page.html

@@ -7,9 +7,10 @@
     </ion-buttons>
     <ion-title>我的</ion-title>
     <ion-buttons slot="end">
-      <ion-button>
-        <ion-icon name="menu-outline"></ion-icon>
-      </ion-button>
+      <!-- <ion-button> 
+        <ion-icon name="log-out" *ngIf="user?.id" fill="clear"  (click)="logout()"></ion-icon>
+      </ion-button> -->
+      <ion-button *ngIf="user?.id" fill="clear" (click)="logout()">登出</ion-button>
     </ion-buttons>
   </ion-toolbar>
 </ion-header>
@@ -85,7 +86,7 @@
           <p>发布于 07-04</p>
         </ion-label>
         <ion-thumbnail slot="end">
-          <img src="https://example.com/game-icons.jpg" />
+          <img src="../../assets/haha.jpg" />
         </ion-thumbnail>
       </ion-item>
     </ion-list>

src/app/tab3/tab3.page.ts

@@ -60,4 +60,8 @@ export class Tab3Page {
   gotoDynamic(){
     this.navCtrl.navigateForward('/dynamic');
   }
+  logout(){
+    // console.log(111)
+    Parse.User.logOut();
+  }
 }

src/app/tabs/tabs-routing.module.ts

@@ -27,6 +27,10 @@ const routes: Routes = [
         path: 'hot-recommendations',
         loadChildren: () => import('../hot-recommendations/hot-recommendations.module').then( m => m.HotRecommendationsPageModule)
       },
+      {
+        path: 'contact-list',
+        loadChildren: () => import('../contact-list/contact-list.module').then( m => m.ContactListPageModule)
+      },
     
       {
         path: '',

src/app/tabs/tabs.page.html

@@ -8,13 +8,13 @@
 
   <ion-tab-bar slot="bottom">
     <ion-tab-button tab="tab1" href="/tabs/tab1">
-      <ion-icon aria-hidden="true" name="triangle"></ion-icon>
-      <ion-label>Tab 1</ion-label>
+      <ion-icon aria-hidden="true" name="home"></ion-icon>
+      <ion-label>首页</ion-label>
     </ion-tab-button>
 
-    <ion-tab-button tab="dynamic" href="../../app/dynamic/dynamic.page.html">
-      <ion-icon aria-hidden="true" name="ellipse"></ion-icon>
-      <ion-label>dynamic</ion-label>
+    <ion-tab-button tab="contact-list" href="../../app/dynamic/dynamic.page.html">
+      <ion-icon aria-hidden="true" name="people"></ion-icon>
+      <ion-label>联系人</ion-label>
     </ion-tab-button>
 
     <!-- <ion-tab-button tab="hot-recommendations" href="../../app/dynamic/dynamic.page.html">
@@ -23,13 +23,13 @@
     </ion-tab-button> -->
 
     <ion-tab-button tab="tab2" href="/tabs/tab2">
-      <ion-icon aria-hidden="true" name="ellipse"></ion-icon>
-      <ion-label>Tab 2</ion-label>
+      <ion-icon aria-hidden="true" name="chatbubbles"></ion-icon>
+      <ion-label>聊天</ion-label>
     </ion-tab-button>
 
     <ion-tab-button tab="tab3" href="/tabs/tab3">
-      <ion-icon aria-hidden="true" name="square"></ion-icon>
-      <ion-label>Tab 3</ion-label>
+      <ion-icon aria-hidden="true" name="person"></ion-icon>
+      <ion-label>我的</ion-label>
     </ion-tab-button>
   </ion-tab-bar>
 

src/modules/user/mine/mine.page.ts

@@ -1,6 +1,6 @@
 import { Component, OnInit } from '@angular/core';
 // 由于Parse本身是js库，在ts中加载需要通过 * as Parse转换一下
-import Parse from "parse"
+// import Parse from "parse"
 @Component({
   selector: 'app-mine',
   templateUrl: './mine.page.html',