edu-textbook/projects/textbook/src/app/comp-nav/comp-nav.component.html

<div class="bar">
  <nz-avatar
    nzSize="large"
    nzIcon="user"
    nzSrc="/img/avatar.png"
  ></nz-avatar>
  @if(!viewCollapsed){
  <div class="user">
    <div class="name">{{ tbookSer.profile?.user?.name || "未认证用户" }}<nz-tag [nzColor]="'red'">{{tbookSer.profile?.identity}}</nz-tag></div>
    <div class="email">
      {{ tbookSer.profile?.user?.email || "test@edu.com" }}
    </div>
  </div>
  <div class="more">
    <button
      mat-icon-button
      nzType="primary"
      nz-popover
      nzPopoverTitle="操作"
      [(nzPopoverVisible)]="visible"
      (nzPopoverVisibleChange)="change($event)"
      nzPopoverTrigger="click"
      [nzPopoverContent]="contentTemplate"
    >
      <mat-icon fontIcon="more"></mat-icon>
    </button>
    <ng-template #contentTemplate>
      <div style="display: flex; flex-direction: column">
        <!-- <a
          nz-button
          nzType="link"
          (click)="clickMe()"
          style="margin-bottom: 6px;color:#3e49b3;"
          >我的</a
        > -->
        <a
          nz-button
          nzType="link"
          style="color: #3e49b3"
          (click)="authServr.logout()"
          >退出登录</a
        >
      </div>
    </ng-template>
  </div>
  }
</div>