Ver Fonte

new function

未来全栈 há 5 meses atrás
pai
commit
200c240701
1 ficheiros alterados com 65 adições e 40 exclusões
  1. 65 40
      src/app/tab1/tab1.page.html

+ 65 - 40
src/app/tab1/tab1.page.html

@@ -1,44 +1,69 @@
-<ion-header [translucent]="true">
-  <ion-toolbar>
-    <ion-title>
-      社区评论
-    </ion-title>
-  </ion-toolbar>
-</ion-header>
+<ion-menu contentId="main-content">
+  <ion-header>
+    <ion-toolbar>
+      <ion-title>设置中心</ion-title>
+    </ion-toolbar>
+  </ion-header>
+  <ion-content class="ion-padding">
+    <ion-list>
+      <ion-item>
+        <ion-toggle>Receive Push Notifications</ion-toggle>
+      </ion-item>
+      <ion-item>
+        <ion-toggle>Receive Emails</ion-toggle>
+      </ion-item>
+      <ion-item>
+        <ion-toggle>Receive Text Messages</ion-toggle>
+      </ion-item>
+      <ion-select label="Default label" placeholder="Favorite Fruit">
+        <ion-select-option value="apple">Apple</ion-select-option>
+        <ion-select-option value="banana">Banana</ion-select-option>
+        <ion-select-option value="orange">Orange</ion-select-option>
+      </ion-select>
+    </ion-list>
+  </ion-content>
+</ion-menu>
 
-<ion-content [fullscreen]="true">
-  <ion-list>
-    <ion-item>
-      <ion-avatar slot="start">
-        <img src="https://tse3-mm.cn.bing.net/th/id/OIP-C.QGUz1-tWsQhwsa3F6i9nGAHaHa?w=268&h=201&c=7&r=0&o=5&dpr=1.3&pid=1.7">
-      </ion-avatar>
-      <ion-label>
-        <h2>用户名</h2>
-        <p>评论内容</p>
-      </ion-label>
-      <ion-buttons slot="end">
-        <!-- 点赞 -->
-        <ion-button (click)="likeComment()" [color]="isLiked ? 'danger' : 'primary'">
-          <ion-icon slot="icon-only" [name]="isLiked ? 'heart' : 'heart-outline'">
-          </ion-icon>
-        </ion-button>
-        <!-- 评论 -->
-        <ion-button (click)="viewComments()">
-          <ion-icon slot="icon-only" name="chatbubble-ellipses-outline"></ion-icon>
-        </ion-button>
-        <!-- 分享 -->
-        <ion-button (click)="openShareSheet()">
-          <ion-icon slot="icon-only" name="open-outline"></ion-icon>
-        </ion-button>
+<div class="ion-page" id="main-content">
+  <ion-header>
+    <ion-toolbar>
+      <ion-buttons slot="start">
+        <ion-menu-button></ion-menu-button>
       </ion-buttons>
-    </ion-item>
-    <!-- 可以添加更多评论项 -->
+      <ion-title>社区评论</ion-title>
+    </ion-toolbar>
+  </ion-header>
 
-  </ion-list>
+  <ion-content [fullscreen]="true">
+    <ion-list>
+      <ion-item>
+        <ion-avatar slot="start">
+          <img
+            src="https://tse3-mm.cn.bing.net/th/id/OIP-C.QGUz1-tWsQhwsa3F6i9nGAHaHa?w=268&h=201&c=7&r=0&o=5&dpr=1.3&pid=1.7">
+        </ion-avatar>
+        <ion-label>
+          <h2>用户名</h2>
+          <p>评论内容</p>
+        </ion-label>
+        <ion-buttons slot="end">
+          <ion-button (click)="likeComment()" [color]="isLiked ? 'danger' : 'primary'">
+            <ion-icon slot="icon-only" [name]="isLiked ? 'heart' : 'heart-outline'"></ion-icon>
+          </ion-button>
+          <ion-button (click)="viewComments()">
+            <ion-icon slot="icon-only" name="chatbubble-ellipses-outline"></ion-icon>
+          </ion-button>
+          <ion-button (click)="openShareSheet()">
+            <ion-icon slot="icon-only" name="open-outline"></ion-icon>
+          </ion-button>
+        </ion-buttons>
+      </ion-item>
+      <!-- 可以添加更多评论项 -->
+    </ion-list>
 
-  <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-    <ion-fab-button (click)="goToBeginPage()">
-      <ion-icon name="create-outline"></ion-icon>
-    </ion-fab-button>
-  </ion-fab>
-</ion-content>
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button (click)="goToBeginPage()">
+        <ion-icon name="create-outline"></ion-icon>
+      </ion-fab-button>
+    </ion-fab>
+  </ion-content>
+</div>