모바일 status 표시 처리

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

@@ -14,6 +14,12 @@
           (click)="onClickOpenProfile($event, userInfo)"
         />
       </div>
+      <span
+        *ngIf="getPresence(PresenceType.MOBILE) === 'mobileOn'"
+        class="text-accent-color badge-mobile-state"
+      >
+        <mat-icon>phone_android</mat-icon>
+      </span>
     </dt>
     <dd class="info">
       <div class="detail">

projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.scss

@@ -26,6 +26,23 @@ $thumbnail-msize: 40px;
   }
 }
 
+.badge-mobile-state {
+  position: absolute;
+  background-color: #ffffff;
+  width: 18px;
+  height: 18px;
+  border-radius: 50%;
+  bottom: 14px;
+  left: 60px;
+  text-align: center;
+  .mat-icon {
+    font-size: 14px;
+    width: 18px;
+    height: 18px;
+    line-height: 18px;
+  }
+}
+
 %list-item {
   position: relative;
   display: flex;

projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.ts

@@ -65,13 +65,16 @@ export class UserListItemComponent implements OnInit {
       this.profileImageRoot || this.sessionVerinfo.profileRoot;
   }
 
-  getPresence(type: string): string {
+  getPresence(type: PresenceType): string {
     let status: string;
     let rtnClass = '';
     switch (type) {
-      case 'pc':
+      case PresenceType.PC:
         status = !!this.presence ? this.presence.pcStatus : undefined;
         break;
+      case PresenceType.MOBILE:
+        status = !!this.presence ? this.presence.mobileStatus : undefined;
+        break;
     }
 
     if (!!status) {