bugfix

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.html

@@ -6,26 +6,23 @@
       </div>
       <div class="organization-info">
         <h3 class="organization-name">
-          <ng-container *ngIf="!isSearch">
           <ng-container
-              *ngIf="
+            *ngIf="!!(selectedDepartmentProcessing$ | async); else searchEnd"
-                !!(selectedDepartmentProcessing$ | async);
-                else useSelectedDepartmentName
-              "
           >
             {{ 'common.messages.searching' | translate }} ...
           </ng-container>
-            <ng-template #useSelectedDepartmentName>
+          <ng-template #searchEnd>
+            <ng-container *ngIf="!isSearch">
               {{ selectedDepartment$ | async | ucapTranslate: 'name' }}
-            </ng-template>
             </ng-container>
             <ng-container *ngIf="!!isSearch">
               {{ 'common.searchResult' | translate
-            }}<span class="text-accent-color"
+              }}<span class="text-accent-color person-count"
                 >({{ departmentUserInfoList.length }}
                 {{ 'common.units.persons' | translate }})</span
               >
             </ng-container>
+          </ng-template>
         </h3>
       </div>
       <div class="organization-option selectbox input-lineless ">

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.scss

@@ -53,8 +53,14 @@
       justify-content: center;
       align-items: center;
       flex: 0 0 30px;
+      cursor: unset;
+
       i {
       }
+
+      &:hover {
+        opacity: 1 !important;
+      }
     }
     .organization-info {
       display: flex;
@@ -62,6 +68,10 @@
       flex-flow: row;
       overflow: hidden;
       align-items: center;
+
+      .person-count {
+        margin-left: 5px;
+      }
     }
     .organization-name {
       font-size: 0.94rem;
@@ -161,6 +171,10 @@
 .select-user-title {
   font-size: 0.9em;
   font-weight: 600;
+
+  span {
+    margin-left: 5px;
+  }
 }
 
 ::ng-deep .organization-accordion {

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.ts

@@ -125,6 +125,7 @@ export class OrganizationComponent implements OnInit, OnDestroy {
   departmentUserInfoListSubscription: Subscription;
   searchDepartmentUserInfoListSubscription: Subscription;
 
+  tmpUserList: UserInfoSS[] = []; // Backup data to use when canceling the search.
   departmentUserInfoList: UserInfoSS[] = [];
   originDepartmentUserInfoList: UserInfoSS[] = [];
 
@@ -182,6 +183,11 @@ export class OrganizationComponent implements OnInit, OnDestroy {
       .pipe(select(AppStore.MessengerSelector.QuerySelector.isSearch))
       .subscribe(isSearch => {
         this.isSearch = isSearch;
+
+        if (!isSearch && this.tmpUserList.length > 0) {
+          this.departmentUserInfoList = this.tmpUserList.slice();
+          this.tmpUserList = [];
+        }
       });
 
     this.selectedDepartmentProcessing$ = this.store.pipe(
@@ -218,6 +224,12 @@ export class OrganizationComponent implements OnInit, OnDestroy {
       )
       .subscribe(list => {
         if (!!this.isSearch) {
+          if (
+            this.departmentUserInfoList.length > 0 &&
+            this.tmpUserList.length === 0
+          ) {
+            this.tmpUserList = this.departmentUserInfoList.slice();
+          }
           this.departmentUserInfoList = list;
           this.originDepartmentUserInfoList = list;
 

projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.html

@@ -1,4 +1,7 @@
-<perfect-scrollbar class="scrollbar">
+<perfect-scrollbar
+  class="scrollbar"
+  *ngIf="!!sortedData && 0 < sortedData.length"
+>
   <table
     mat-table
     matSort

projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.scss

@@ -207,3 +207,7 @@ td.mat-cell {
     }
   }
 }
+
+::ng-deep .ps__rail-y {
+  z-index: 101;
+}