tab1.page.html 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <ion-menu contentId="main-content">
  2. <ion-header>
  3. <ion-toolbar>
  4. <ion-title>设置中心</ion-title>
  5. </ion-toolbar>
  6. </ion-header>
  7. <ion-content class="ion-padding">
  8. <ion-list>
  9. <ion-item>
  10. <ion-toggle>Receive Push Notifications</ion-toggle>
  11. </ion-item>
  12. <ion-item>
  13. <ion-toggle>Receive Emails</ion-toggle>
  14. </ion-item>
  15. <ion-item>
  16. <ion-toggle>Receive Text Messages</ion-toggle>
  17. </ion-item>
  18. <ion-select label="Default label" placeholder="Favorite Fruit">
  19. <ion-select-option value="apple">Apple</ion-select-option>
  20. <ion-select-option value="banana">Banana</ion-select-option>
  21. <ion-select-option value="orange">Orange</ion-select-option>
  22. </ion-select>
  23. </ion-list>
  24. </ion-content>
  25. </ion-menu>
  26. <div class="ion-page" id="main-content">
  27. <ion-header>
  28. <ion-toolbar>
  29. <ion-buttons slot="start">
  30. <ion-menu-button></ion-menu-button>
  31. </ion-buttons>
  32. <ion-title>社区评论</ion-title>
  33. </ion-toolbar>
  34. </ion-header>
  35. <ion-content [fullscreen]="true">
  36. <ion-list>
  37. <ion-item>
  38. <ion-avatar slot="start">
  39. <img
  40. 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">
  41. </ion-avatar>
  42. <ion-label>
  43. <h2>用户名</h2>
  44. <p>评论内容</p>
  45. </ion-label>
  46. <ion-buttons slot="end">
  47. <ion-button (click)="likeComment()" [color]="isLiked ? 'danger' : 'primary'">
  48. <ion-icon slot="icon-only" [name]="isLiked ? 'heart' : 'heart-outline'"></ion-icon>
  49. </ion-button>
  50. <ion-button (click)="viewComments()">
  51. <ion-icon slot="icon-only" name="chatbubble-ellipses-outline"></ion-icon>
  52. </ion-button>
  53. <ion-button (click)="openShareSheet()">
  54. <ion-icon slot="icon-only" name="open-outline"></ion-icon>
  55. </ion-button>
  56. </ion-buttons>
  57. </ion-item>
  58. <!-- 可以添加更多评论项 -->
  59. </ion-list>
  60. <ion-fab vertical="bottom" horizontal="end" slot="fixed">
  61. <ion-fab-button (click)="goToBeginPage()">
  62. <ion-icon name="create-outline"></ion-icon>
  63. </ion-fab-button>
  64. </ion-fab>
  65. </ion-content>
  66. </div>