From 5d2be25885e5a4b8f050b99d9698d0d3dca07013 Mon Sep 17 00:00:00 2001
From: Richard Park <richard.park@loafle.com>
Date: Fri, 18 Oct 2019 12:49:23 +0900
Subject: [PATCH] bug fixed

---
 .../components/left-side.component.html       | 12 +++-
 .../left-sidenav/group.component.ts           |  8 ++-
 .../chat/create-chat.dialog.component.html    | 60 +++++++++++++-----
 .../components/expansion-panel.component.html | 62 ++++++++++---------
 .../components/user-list-item.component.html  |  4 +-
 .../components/user-list-item.component.ts    |  7 +--
 .../src/lib/components/image.component.ts     |  2 +-
 7 files changed, 99 insertions(+), 56 deletions(-)

diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.html
index 2e8de758..79460a4a 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.html
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-side.component.html
@@ -5,7 +5,7 @@
       <mat-icon>chat</mat-icon>
     </button>
   </div>
-  <mat-tab-group mat-stretch-tabs>
+  <mat-tab-group mat-stretch-tabs animationDuration="0ms">
     <mat-tab>
       <ng-template mat-tab-label>
         <mat-icon>group</mat-icon>
@@ -14,8 +14,14 @@
     </mat-tab>
     <mat-tab>
       <ng-template mat-tab-label>
-        <mat-icon [matBadgeHidden]="((badgeChatUnReadCount$ | async) <= 0)" [matBadge]="badgeChatUnReadCount$ | async"
-          matBadgeDescription="확인하지 않은 메시지가 있습니다." matBadgeColor="accent" matBadgePosition="above after">chat</mat-icon>
+        <mat-icon
+          [matBadgeHidden]="(badgeChatUnReadCount$ | async) <= 0"
+          [matBadge]="badgeChatUnReadCount$ | async"
+          matBadgeDescription="확인하지 않은 메시지가 있습니다."
+          matBadgeColor="accent"
+          matBadgePosition="above after"
+          >chat</mat-icon
+        >
       </ng-template>
       <app-layout-chat-left-sidenav-chat></app-layout-chat-left-sidenav-chat>
     </mat-tab>
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts
index a8dcb424..7b28ea9f 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/group.component.ts
@@ -76,9 +76,7 @@ export class GroupComponent implements OnInit, OnDestroy {
   loginRes: LoginResponse;
   loginResSubscription: Subscription;
 
-  sessionVerinfo = this.sessionStorageService.get<VersionInfo2Response>(
-    KEY_VER_INFO
-  );
+  sessionVerinfo: VersionInfo2Response;
 
   constructor(
     private store: Store<any>,
@@ -88,6 +86,9 @@ export class GroupComponent implements OnInit, OnDestroy {
   ) {}
 
   ngOnInit() {
+    this.sessionVerinfo = this.sessionStorageService.get<VersionInfo2Response>(
+      KEY_VER_INFO
+    );
     const loginInfo = this.sessionStorageService.get<LoginInfo>(KEY_LOGIN_INFO);
     this.companyCode = loginInfo.companyCode;
 
@@ -142,6 +143,7 @@ export class GroupComponent implements OnInit, OnDestroy {
   }
 
   ngOnDestroy(): void {
+    this.logger.debug('ngOnDestroy');
     if (!!this.loginResSubscription) {
       this.loginResSubscription.unsubscribe();
     }
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/create-chat.dialog.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/create-chat.dialog.component.html
index 660361bc..fb520f1b 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/create-chat.dialog.component.html
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/create-chat.dialog.component.html
@@ -2,7 +2,13 @@
   <mat-card-header cdkDrag cdkDragRootElement=".cdk-overlay-pane" cdkDragHandle>
     <mat-card-title>{{ data.title }}</mat-card-title>
   </mat-card-header>
-  <mat-card-content fxLayout fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="10px" fxLayoutGap.xs="0">
+  <mat-card-content
+    fxLayout
+    fxLayout.xs="column"
+    fxLayoutAlign="center"
+    fxLayoutGap="10px"
+    fxLayoutGap.xs="0"
+  >
     <div fxFlex class="container">
       <mat-tab-group mat-stretch-tabs>
         <mat-tab>
@@ -10,14 +16,28 @@
             <mat-icon>group</mat-icon>
           </ng-template>
 
-          <ucap-organization-tenant-search [companyList]="companyList$ | async" [companyCode]="companyCode"
-            (keyDownEnter)="onKeyDownEnterOrganizationTenantSearch($event)"></ucap-organization-tenant-search>
-          <ucap-group-expansion-panel #groupExpansionPanel [groupBuddyList]="groupBuddyList$ | async"
-            [favoritBuddyList]="favoritBuddyList$ | async" [selectedUserList]="selectedUserList" [checkable]="true"
-            (checkGroup)="onCheckGroup($event)">
-            <ucap-profile-user-list-item *ucapGroupExpansionPanelItem="let userInfo" [userInfo]="userInfo"
-              [sessionVerinfo]="sessionVerinfo" [selectedUserList]="selectedUserList"
-              [isChecked]="getCheckedUser(userInfo)" [checkable]="true" (checkUser)="onCheckUser($event)">
+          <ucap-organization-tenant-search
+            [companyList]="companyList$ | async"
+            [companyCode]="companyCode"
+            (keyDownEnter)="onKeyDownEnterOrganizationTenantSearch($event)"
+          ></ucap-organization-tenant-search>
+          <ucap-group-expansion-panel
+            #groupExpansionPanel
+            [groupBuddyList]="groupBuddyList$ | async"
+            [favoritBuddyList]="favoritBuddyList$ | async"
+            [selectedUserList]="selectedUserList"
+            [checkable]="true"
+            (checkGroup)="onCheckGroup($event)"
+          >
+            <ucap-profile-user-list-item
+              *ucapGroupExpansionPanelItem="let userInfo"
+              [userInfo]="userInfo"
+              [sessionVerinfo]="sessionVerinfo"
+              [selectedUserList]="selectedUserList"
+              [isChecked]="getCheckedUser(userInfo)"
+              [checkable]="true"
+              (checkUser)="onCheckUser($event)"
+            >
             </ucap-profile-user-list-item>
           </ucap-group-expansion-panel>
         </mat-tab>
@@ -25,16 +45,24 @@
           <ng-template mat-tab-label>
             <mat-icon>device_hub</mat-icon>
           </ng-template>
-          <app-layout-chat-left-sidenav-organization [selectedUserList]="selectedUserList" [isUserSelect]="true"
-            (checkUser)="onCheckUser($event)">
+          <app-layout-chat-left-sidenav-organization
+            [selectedUserList]="selectedUserList"
+            [isUserSelect]="true"
+            (checkUser)="onCheckUser($event)"
+          >
           </app-layout-chat-left-sidenav-organization>
         </mat-tab>
         <mat-tab>
           <ng-template mat-tab-label>
             <mat-icon>chat</mat-icon>
           </ng-template>
-          <ucap-room-list-item *ngFor="let room of roomList" [loginRes]="loginRes" [roomInfo]="room"
-            [roomUserInfo]="getRoomUserList(room)" [sessionVerinfo]="sessionVerinfo">
+          <ucap-room-list-item
+            *ngFor="let room of roomList"
+            [loginRes]="loginRes"
+            [roomInfo]="room"
+            [roomUserInfo]="getRoomUserList(room)"
+            [sessionVerinfo]="sessionVerinfo"
+          >
           </ucap-room-list-item>
         </mat-tab>
       </mat-tab-group>
@@ -48,7 +76,11 @@
     </div>
   </mat-card-content>
   <mat-card-actions class="button-farm flex-row">
-    <button mat-stroked-button (click)="onClickChoice(false)" class="mat-primary">
+    <button
+      mat-stroked-button
+      (click)="onClickChoice(false)"
+      class="mat-primary"
+    >
       No
     </button>
     <button mat-flat-button (click)="onClickChoice(true)" class="mat-primary">
diff --git a/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.html b/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.html
index 76af2331..a38131ec 100644
--- a/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.html
+++ b/projects/ucap-webmessenger-ui-group/src/lib/components/expansion-panel.component.html
@@ -1,51 +1,57 @@
-<mat-accordion #groupAccordion="matAccordion" [multi]="true">
-  <mat-expansion-panel *ngIf="favoritBuddyList.length > 0 && !checkable" [togglePosition]="'before'">
+<mat-accordion
+  #groupAccordion="matAccordion"
+  [multi]="true"
+  [displayMode]="'flat'"
+>
+  <mat-expansion-panel
+    *ngIf="favoritBuddyList.length > 0 && !checkable"
+    [togglePosition]="'before'"
+  >
     <mat-expansion-panel-header>
       <mat-panel-title> 즐겨찾기 </mat-panel-title>
       <mat-panel-description> </mat-panel-description>
     </mat-expansion-panel-header>
 
     <ng-container *ngFor="let favUserList of favoritBuddyList">
-      <ng-template [ngTemplateOutlet]="expansionPanelItemTemplateRef"
-        [ngTemplateOutletContext]="{ $implicit: favUserList }">
+      <ng-template
+        [ngTemplateOutlet]="expansionPanelItemTemplateRef"
+        [ngTemplateOutletContext]="{ $implicit: favUserList }"
+      >
       </ng-template>
     </ng-container>
-
-    <!-- <ucap-profile-user-list-item
-      *ngFor="let favUserList of favoritBuddyList"
-      [userInfo]="favUserList"
-      (click)="onClickBuddy(favUserList)"
-    >
-    </ucap-profile-user-list-item> -->
   </mat-expansion-panel>
 
-  <mat-expansion-panel *ngFor="let groupBuddy of groupBuddyList" [togglePosition]="'before'">
+  <mat-expansion-panel
+    *ngFor="let groupBuddy of groupBuddyList"
+    [togglePosition]="'before'"
+  >
     <mat-expansion-panel-header>
       <mat-panel-title> {{ groupBuddy.group.name }} </mat-panel-title>
       <mat-panel-description>
         <span class="more-spacer"></span>
-        <button mat-icon-button aria-label="group menu" *ngIf="!checkable"
-          (click)="onClickMore($event, groupBuddy.group)">
+        <button
+          mat-icon-button
+          aria-label="group menu"
+          *ngIf="!checkable"
+          (click)="onClickMore($event, groupBuddy.group)"
+        >
           <mat-icon>more_vert</mat-icon>
         </button>
-        <mat-checkbox *ngIf="checkable" #checkbox [checked]="getCheckedGroup(groupBuddy)"
-          (change)="onChangeCheck(checkbox.checked, groupBuddy)" (click)="$event.stopPropagation()"></mat-checkbox>
+        <mat-checkbox
+          *ngIf="checkable"
+          #checkbox
+          [checked]="getCheckedGroup(groupBuddy)"
+          (change)="onChangeCheck(checkbox.checked, groupBuddy)"
+          (click)="$event.stopPropagation()"
+        ></mat-checkbox>
       </mat-panel-description>
     </mat-expansion-panel-header>
 
     <ng-container *ngFor="let userInfo of groupBuddy.buddyList">
-      <ng-template [ngTemplateOutlet]="expansionPanelItemTemplateRef"
-        [ngTemplateOutletContext]="{ $implicit: userInfo }"></ng-template>
+      <ng-template
+        [ngTemplateOutlet]="expansionPanelItemTemplateRef"
+        [ngTemplateOutletContext]="{ $implicit: userInfo }"
+      ></ng-template>
     </ng-container>
-
-    <!-- <ucap-profile-user-list-item
-      *ngFor="let userInfo of groupBuddy.buddyList"
-      [userInfo]="userInfo"
-      (click)="onClickBuddy(userInfo)"
-    >
-    </ucap-profile-user-list-item> -->
-    <!-- <ucap-profile-user-list-item *ngFor="let userInfo of groupBuddy.buddyList" [userInfo]="userInfo"
-      [presence]="presence">
-    </ucap-profile-user-list-item> -->
   </mat-expansion-panel>
 </mat-accordion>
diff --git a/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.html b/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.html
index 37ed56cd..4cb90c4b 100644
--- a/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.html
+++ b/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.html
@@ -4,8 +4,8 @@
   <span
     class="presence"
     [ngClass]="getPresence(PresenceType.PC)"
-    *ngIf="userPresence && userPresence.pcStatus"
-    >{{ userPresence.pcStatus }}
+    *ngIf="presence && presence.pcStatus"
+    >{{ presence.pcStatus }}
   </span>
   <dl class="item-default">
     <dt>
diff --git a/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.ts b/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.ts
index 1ae14b37..ebad794d 100644
--- a/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.ts
+++ b/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.ts
@@ -37,9 +37,7 @@ export class UserListItemComponent implements OnInit, OnDestroy {
   @Input()
   profileImageRoot?: string;
   @Input()
-  set presence(value: StatusBulkInfo | StatusInfo) {
-    this.userPresence = value;
-  }
+  presence: StatusBulkInfo | StatusInfo;
   @Input()
   checkable = false;
   @Input()
@@ -58,7 +56,6 @@ export class UserListItemComponent implements OnInit, OnDestroy {
     userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN;
   }>();
 
-  userPresence: StatusBulkInfo | StatusInfo;
   PresenceType = PresenceType;
 
   // private profileImageRootSubscription: Subscription;
@@ -94,7 +91,7 @@ export class UserListItemComponent implements OnInit, OnDestroy {
     let rtnClass = '';
     switch (type) {
       case 'pc':
-        status = this.userPresence.pcStatus;
+        status = this.presence.pcStatus;
         break;
     }
 
diff --git a/projects/ucap-webmessenger-ui/src/lib/components/image.component.ts b/projects/ucap-webmessenger-ui/src/lib/components/image.component.ts
index 7990aea8..8164653c 100644
--- a/projects/ucap-webmessenger-ui/src/lib/components/image.component.ts
+++ b/projects/ucap-webmessenger-ui/src/lib/components/image.component.ts
@@ -8,10 +8,10 @@ import { ucapAnimations } from '../animations';
   selector: 'ucap-ui-imaage',
   template: `
     <img
+      #imageElement
       [src]="imageSrc"
       [style]="baseStyle"
       [ngClass]="classList"
-      [@fadeInOut]
     />
   `,
   styles: [],