쪽지 검색 기능 추가.

projects/ucap-webmessenger-api-message/src/lib/apis/retrieve.ts

@@ -148,10 +148,34 @@ export const decodeRetrieveReservation: APIDecoder<RetrieveResponse> = (
 export const decodeRetrieveSearch: APIDecoder<RetrieveResponse> = (
   res: any
 ) => {
+  const messageList: MessageList[] = [];
+  if (!!res.msgList && res.msgList.length > 0) {
+    for (const msgList of res.msgList) {
+      messageList.push({
+        ...msgList,
+
+        userCount:
+          !msgList.userCount || msgList.userCount === null
+            ? 0
+            : msgList.userCount,
+        userReadCount:
+          !msgList.userReadCount || msgList.userReadCount === null
+            ? 0
+            : msgList.userReadCount,
+        titleYn: msgList.titleYn === 'Y' ? true : false,
+        attachmentYn: msgList.attachmentYn === 'Y' ? true : false
+      } as MessageList);
+    }
+  }
+
   return {
     responseCode: res.responseCode,
     responseMsg: res.responseMsg,
+
+    pageCount: res.pageCount,
+    pageSize: res.pageSize,
     totalCount: res.totalCount,
-    messageList: []
+
+    messageList
   } as RetrieveResponse;
 };

projects/ucap-webmessenger-api-message/src/lib/types/message.type.ts

@@ -1,5 +1,6 @@
 export enum MessageType {
   Send = 'S',
   Receive = 'R',
-  Reservation = 'B'
+  Reservation = 'B',
+  All = 'A'
 }

projects/ucap-webmessenger-api-message/src/public-api.ts

@@ -17,6 +17,7 @@ export * from './lib/models/message-list';
 
 export * from './lib/types/category.type';
 export * from './lib/types/content.type';
+export * from './lib/types/message.search.type';
 export * from './lib/types/message.type';
 
 export * from './lib/config/urls';

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/message.component.html

@@ -37,7 +37,7 @@
       </form>
     </div>
   </div>
-  <div>
+  <div *ngIf="!isSearch">
     <mat-tab-group
       #tabs
       mat-stretch-tabs
@@ -143,4 +143,56 @@
       </mat-tab>
     </mat-tab-group>
   </div>
+  <div *ngIf="isSearch">
+    <div class="search-sub">
+      <form [formGroup]="fgSearchType" class="w-100-p">
+        <mat-form-field>
+          <mat-select formControlName="searchMessageType" (selectionChange)="onChangeSelection($event)">
+            <mat-option [value]="MessageType.All">전체</mat-option>
+            <mat-option [value]="MessageType.Receive">수신</mat-option>
+            <mat-option [value]="MessageType.Send">발신</mat-option>
+            <mat-option [value]="MessageType.Reservation">예약</mat-option>
+          </mat-select>
+        </mat-form-field>
+        <mat-radio-group
+          formControlName="searchMessageSearchType"
+          aria-label="Select an searchType"
+          (change)="onChangeSearchType($event)"
+        >
+          <mat-radio-button [value]="MessageSearchType.Name" [checked]="true"
+            >이름</mat-radio-button
+          >
+          <mat-radio-button [value]="MessageSearchType.Title"
+            >제목</mat-radio-button
+          >
+          <mat-radio-button [value]="MessageSearchType.Contents"
+            >내용</mat-radio-button
+          >
+        </mat-radio-group>
+      </form>
+    </div>
+    <div *ngFor="let message of messageList">
+      <dl>
+        <dt>
+          <mat-icon
+            *ngIf="!!message.resType && message.resType === ContentType.Image"
+            >image</mat-icon
+          >
+          <mat-icon
+            *ngIf="
+              !!message.resType && message.resType === ContentType.AttachFile
+            "
+            >attach_file</mat-icon
+          >
+          <ul>
+            <li>{{ message.userName }}</li>
+            <li>{{ message.title }}</li>
+          </ul>
+        </dt>
+        <dd>
+          {{ message.regDate | dateToStringFormat: 'MM:DD' }}
+        </dd>
+      </dl>
+    </div>
+  </div>
 </div>

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/message.component.ts

@@ -25,13 +25,19 @@ import {
   MessageApiService,
   MessageType,
   RetrieveRequest,
-  MessageList
+  MessageList,
+  RetrieveSearchRequest,
+  MessageSearchType
 } from '@ucap-webmessenger/api-message';
 import { DeviceType } from '@ucap-webmessenger/core';
 import { MessageStatusCode } from '@ucap-webmessenger/api';
 import { ContentType } from '@ucap-webmessenger/api-message';
 import { FormGroup, FormBuilder } from '@angular/forms';
-import { MatTabGroup } from '@angular/material';
+import {
+  MatTabGroup,
+  MatSelectChange,
+  MatRadioChange
+} from '@angular/material';
 
 @Component({
   selector: 'app-layout-chat-left-sidenav-message',
@@ -47,9 +53,7 @@ export class MessageBoxComponent
   isInitTabs = false;
 
   fgSearch: FormGroup;
-
-  userInfoList: UserInfo[];
-  userInfoListSubscription: Subscription;
+  fgSearchType: FormGroup;
 
   loginRes: LoginResponse;
   sessionVerinfo: VersionInfo2Response;
@@ -72,6 +76,9 @@ export class MessageBoxComponent
 
   ContentType = ContentType;
   MessageType = MessageType;
+  MessageSearchType = MessageSearchType;
+
+  isSearch = false;
 
   constructor(
     private store: Store<any>,
@@ -92,15 +99,10 @@ export class MessageBoxComponent
     this.fgSearch = this.formBuilder.group({
       searchInput: null
     });
-
-    this.userInfoListSubscription = this.store
-      .pipe(
-        select(AppStore.MessengerSelector.RoomSelector.selectUserinfolist),
-        tap(userInfoList => {
-          this.userInfoList = userInfoList;
-        })
-      )
-      .subscribe();
+    this.fgSearchType = this.formBuilder.group({
+      searchMessageType: [MessageType.All],
+      searchMessageSearchType: [MessageSearchType.Name]
+    });
 
     // 초기 검색은 수신함.
     this.getRetrieveMessage(MessageType.Receive, this.recieveCurrentPage);
@@ -118,9 +120,6 @@ export class MessageBoxComponent
   }
 
   ngOnDestroy(): void {
-    if (!!this.userInfoListSubscription) {
-      this.userInfoListSubscription.unsubscribe();
-    }
     if (!!this.messageRecieveListSubscription) {
       this.messageRecieveListSubscription.unsubscribe();
     }
@@ -161,12 +160,74 @@ export class MessageBoxComponent
     }
   }
 
+  onChangeSelection(event: MatSelectChange) {
+    this.searchCurrentPage = 0;
+    this.getSearchMessage(
+      event.value,
+      this.fgSearchType.get('searchMessageSearchType').value,
+      this.fgSearch.get('searchInput').value
+    );
+  }
+  onChangeSearchType(event: MatRadioChange) {
+    this.searchCurrentPage = 0;
+    this.getSearchMessage(
+      this.fgSearchType.get('searchMessageType').value,
+      event.value,
+      this.fgSearch.get('searchInput').value
+    );
+  }
   onKeyDownEnter(event: KeyboardEvent, search: string) {
     event.preventDefault();
     event.stopPropagation();
+
+    this.searchCurrentPage = 0;
+
+    this.getSearchMessage(
+      MessageType.All,
+      MessageSearchType.Name,
+      search.trim()
+    );
+  }
+  getSearchMessage(
+    messageType: MessageType,
+    searchType: MessageSearchType,
+    searchStr: string
+  ) {
+    this.isSearch = true;
+    this.messageSendListSubscription = this.messageApiService
+      .retrieveSearchMessage({
+        userSeq: this.loginRes.userSeq,
+        deviceType: DeviceType.PC,
+        tokenKey: this.loginRes.tokenString,
+        type: messageType,
+        pageSize: this.defaultPageSize,
+        pageCount: this.searchCurrentPage,
+
+        searchTitle: searchType === MessageSearchType.Title ? searchStr : '',
+        searchName: searchType === MessageSearchType.Name ? searchStr : '',
+        searchContent:
+          searchType === MessageSearchType.Contents ? searchStr : ''
+      } as RetrieveSearchRequest)
+      .pipe(
+        map(res => {
+          console.log(res);
+          if (res.responseCode === MessageStatusCode.Success) {
+            this.currentTotalCount = res.totalCount;
+            this.currentPage = res.pageCount;
+            this.searchCurrentPage = res.pageCount;
+            this.messageList = res.messageList;
+          } else {
+          }
+        }),
+        catchError(error => of(console.log(error)))
+      )
+      .subscribe();
   }
 
-  onClickSearchCancel() {}
+  onClickSearchCancel() {
+    this.isSearch = false;
+    this.getRetrieveMessage(MessageType.Receive, this.recieveCurrentPage);
+  }
 
   getRetrieveMessage(type: MessageType, trgtPageIndex: number) {
     switch (type) {

projects/ucap-webmessenger-app/src/app/types/sticker-info.type.ts

@@ -0,0 +1 @@
+export const KEY_STICKER_HISTORY = 'ucap::Sticker_History';