next-ucap-messenger/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.html

<!--체크박스 보여줄때는 <div class="list-item checkbox" matRipple>  클래스에 checkbox만 추가-->
<div class="list-item" matRipple>
  <!--pcOn , pcOut  pcOff , pcOther-->
  <span
    class="presence"
    [ngClass]="getPresence(PresenceType.PC)"
    *ngIf="presence && presence.pcStatus"
    >{{ presence.pcStatus }}
  </span>
  <dl class="item-default">
    <dt>
      <!-- <img
        class="thumbnail"
        [src]="
          profileImageRoot
            | ucapUiImaage
              : {
                  path: userInfo.profileImageFile,
                  default: 'assets/images/img_nophoto_50.png'
                }
            | async
        "
      /> -->

      <ucap-ui-imaage
        [imageClass]="'thumbnail'"
        [base]="profileImageRoot"
        [path]="userInfo.profileImageFile"
        [default]="'assets/images/img_nophoto_50.png'"
      ></ucap-ui-imaage>
    </dt>
    <dd class="info">
      <div class="detail">
        <span class="name">
          <b>{{ userInfo.name }}</b>
          {{ userInfo.grade }}
        </span>
        <span class="dept">
          {{ userInfo.deptName }}
        </span>
      </div>
      <div
        class="msg-status"
        *ngIf="!checkable && userInfo.intro.trim() && !compactable"
      >
        {{ userInfo.intro }}
      </div>
    </dd>
  </dl>
  <mat-checkbox
    *ngIf="checkable"
    #checkbox
    [checked]="isChecked"
    (change)="onChangeCheck(checkbox.checked, userInfo)"
    (click)="$event.stopPropagation()"
  >
  </mat-checkbox>
</div>