12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788 |
- <!-- 我的布局 -->
- <ion-header>
- <ion-toolbar>
-
- <ion-buttons slot="start">
- <ion-button>
- 用户信息
- </ion-button>
- <ion-avatar>
- <ion-img src="assets/img/头像.jpg"></ion-img>
- </ion-avatar>
- </ion-buttons>
- <ion-buttons slot="end">
- <ion-button>
- <ion-icon name="settings"></ion-icon>
- </ion-button>
- <ion-button>
- <ion-icon name="moon"></ion-icon>
- </ion-button>
- </ion-buttons>
- </ion-toolbar>
- </ion-header>
- <ion-content>
- <ion-card class="bianju">
- <img alt="" src="https://gd-hbimg.huaban.com/db3495ffea73e3551181abbfd45adbeee8b532369f3b3-N2AKKf_fw1200webp" />
- <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="/user/login">登录</ion-button>
- <ion-button *ngIf="user?.id" fill="clear" routerLink="/user/edit/info">编辑资料</ion-button>
- <ion-button *ngIf="user?.id" fill="clear" (click)="logout()">登出</ion-button>
- </ion-card>
- <!-- 金刚区 - 一行九列金刚区按钮
- <ion-title>我的会员</ion-title>
- <ion-row>
- <ion-col size="2" *ngFor="let item of myItems">
- <ion-button expand="block">{{ item.title }}</ion-button>
- </ion-col>
- </ion-row> -->
- <!-- 金刚区 - 二行三列 -->
- <ion-label>我的钱包</ion-label>
- <ion-row >
- <ion-col size="4" >
-
- <ion-card>
- <ion-card-content>
-
- <ion-label>金币余额: 100</ion-label>
- </ion-card-content>
- </ion-card>
- </ion-col>
- <ion-col size="4" class="location">
- <ion-card>
- <ion-card-content>
- <ion-label>今日收益:100¥</ion-label>
- </ion-card-content>
-
- </ion-card>
- </ion-col>
- <ion-button expand="block" >去赚钱</ion-button>
- </ion-row>
- <!-- 金刚区 - 十行一列金刚区按钮 -->
- <ion-row>
- <ion-col size="12">
- <ion-button expand="block">作者中心</ion-button>
- <ion-button expand="block">阅读喜好</ion-button>
- <ion-button expand="block">奖品中心</ion-button>
- <ion-button expand="block">我的评论</ion-button>
- <ion-button expand="block">我的收藏</ion-button>
- <ion-button expand="block">已购书籍</ion-button>
- <ion-button expand="block">绑兑换码</ion-button>
- <ion-button expand="block">客服咨询</ion-button>
- <ion-button expand="block">功能建议</ion-button>
- <ion-button expand="block">蚂蚁能量</ion-button>
- </ion-col>
- </ion-row>
- </ion-content>
|