0225268 4 months ago
parent
commit
c24cab9bc5
3 changed files with 78 additions and 9 deletions
  1. 66 8
      src/app/tab3/tab3.page.html
  2. 11 0
      src/app/tab3/tab3.page.scss
  3. 1 1
      src/app/tab3/tab3.page.ts

+ 66 - 8
src/app/tab3/tab3.page.html

@@ -1,17 +1,75 @@
 <ion-header [translucent]="true">
   <ion-toolbar>
     <ion-title>
-      Tab 3
+      消息
     </ion-title>
   </ion-toolbar>
 </ion-header>
 
-<ion-content [fullscreen]="true">
-  <ion-header collapse="condense">
-    <ion-toolbar>
-      <ion-title size="large">Tab 3</ion-title>
-    </ion-toolbar>
-  </ion-header>
+<ion-content>
+  <ion-list>
+    <ion-item>
+      <ion-icon slot="start" name="chatbubble-ellipses"></ion-icon>
+      <ion-label>评论和回复</ion-label>
+    </ion-item>
+    
+    <ion-item>
+      <ion-icon slot="start" name="thumbs-up"></ion-icon>
+      <ion-label>赞与收藏</ion-label>
+    </ion-item>
+    
+    <ion-item>
+      <ion-icon slot="start" name="person-add"></ion-icon>
+      <ion-label>新增关注</ion-label>
+    </ion-item>
+    
+    <ion-item>
+      <ion-icon slot="start" name="notifications"></ion-icon>
+      <ion-label>系统消息</ion-label>
+    </ion-item>
+  </ion-list>
 
-  <app-explore-container name="Tab 3 page"></app-explore-container>
+  <ion-card>
+    <ion-card-header>
+      <ion-card-title>最新推荐</ion-card-title>
+    </ion-card-header>
+    <ion-card-content>
+      <ion-avatar slot="start">
+        <ion-img src="assets/avatar.jpg"></ion-img>
+      </ion-avatar>
+      <ion-label>用户名</ion-label>
+      <ion-label>标签</ion-label>
+      <ion-label>聊天内容</ion-label>
+      <ion-button expand="block">免费提问</ion-button>
+    </ion-card-content>
+  </ion-card>
 </ion-content>
+
+<ion-footer>
+  <ion-toolbar>
+    <ion-buttons slot="start">
+      <ion-button routerLink="/tabs/tab1">
+        <ion-icon name="home"></ion-icon>
+        首页
+      </ion-button>
+    </ion-buttons>
+    <ion-buttons slot="start">
+      <ion-button routerLink="/tabs/tab2">
+        <ion-icon name="construct"></ion-icon>
+        装修
+      </ion-button>
+    </ion-buttons>
+    <ion-buttons slot="start">
+      <ion-button routerLink="/tabs/tab3" color="primary">
+        <ion-icon name="chatbubbles"></ion-icon>
+        消息
+      </ion-button>
+    </ion-buttons>
+    <ion-buttons slot="start">
+      <ion-button routerLink="/tabs/tab4">
+        <ion-icon name="person"></ion-icon>
+        我的
+      </ion-button>
+    </ion-buttons>
+  </ion-toolbar>
+</ion-footer>

+ 11 - 0
src/app/tab3/tab3.page.scss

@@ -0,0 +1,11 @@
+ion-card {
+  margin: 10px;
+}
+
+ion-card-title {
+  font-weight: bold;
+}
+
+ion-avatar {
+  margin-right: 10px;
+}

+ 1 - 1
src/app/tab3/tab3.page.ts

@@ -9,4 +9,4 @@ export class Tab3Page {
 
   constructor() {}
 
-}
+}