Merge branch 'master' of https://git.loafle.net/ucap-web/next-ucap-messenger

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

@@ -20,7 +20,10 @@ import {
   AlertDialogResult,
   AlertDialogData
 } from '@ucap-webmessenger/ui';
-import { LoginResponse } from '@ucap-webmessenger/protocol-authentication';
+import {
+  LoginResponse,
+  RoleCode
+} from '@ucap-webmessenger/protocol-authentication';
 import { KEY_LOGIN_RES_INFO } from '@app/types/login-res-info.type';
 import {
   MessageApiService,
@@ -51,6 +54,13 @@ import {
 import * as AppStore from '@app/store';
 import * as MessageStore from '@app/store/messenger/message';
 import { TranslateService } from '@ngx-translate/core';
+import {
+  MessageWriteDialogComponent,
+  MessageWriteDialogResult,
+  MessageWriteDialogData
+} from '../../dialogs/message/message-write.dialog.component';
+import { UserInfo } from '@ucap-webmessenger/protocol-sync';
+import { EmployeeType } from '@ucap-webmessenger/protocol-room';
 
 export interface MessageTypeData {
   displayName: string;
@@ -172,6 +182,7 @@ export class MessageBoxComponent
             MessageDetailDialogResult
           >(MessageDetailDialogComponent, {
             width: '600px',
+            hasBackdrop: false,
             data: {
               detail: info,
               loginRes: this.loginRes,
@@ -192,6 +203,10 @@ export class MessageBoxComponent
                 // 단건 발송취소(예약)
                 this.doMessageCancelReservation(result.messageInfo);
                 break;
+              case 'REPLY':
+                // 답장
+                this.doMessageReply(result.messageInfo);
+                break;
               case 'UPDATE':
                 // 예약 수정
                 this.getRetrieveMessage(MessageType.Reservation, 0);
@@ -367,6 +382,24 @@ export class MessageBoxComponent
     );
   }
 
+  doMessageReply(messageInfo: MessageDetailInfo): void {
+    this.dialogService.open<
+      MessageWriteDialogComponent,
+      MessageWriteDialogData,
+      MessageWriteDialogResult
+    >(MessageWriteDialogComponent, {
+      width: '600px',
+      height: '600px',
+      disableClose: true,
+      hasBackdrop: false,
+      data: {
+        loginRes: this.loginRes,
+        environmentsInfo: this.environmentsInfo,
+        receiverList: [this.convertDetailReceivertoUserInfo(messageInfo)]
+      }
+    });
+  }
+
   private setMessageTypeData() {
     const messageTypeData = this.translateService.instant('message.type');
 
@@ -394,4 +427,40 @@ export class MessageBoxComponent
 
     this.messageTypeList = messageTypeList;
   }
+
+  private convertDetailReceivertoUserInfo(base: MessageDetailInfo): UserInfo {
+    return {
+      seq: base.sendUserSeq,
+      name: base.sendUserName,
+      profileImageFile: '',
+      grade: '',
+      intro: '',
+      companyCode: '',
+      hpNumber: '',
+      lineNumber: '',
+      email: '',
+      isMobile: false,
+      deptName: '',
+      isFavorit: false,
+      isBuddy: false,
+      isActive: false,
+      roleCd: RoleCode.Self,
+      employeeNum: '',
+      madn: '',
+      hardSadn: '',
+      fmcSadn: '',
+      nameEn: '',
+      nameCn: '',
+      gradeEn: '',
+      gradeCn: '',
+      deptNameEn: '',
+      deptNameCn: '',
+      isPrivacyAgree: false,
+      isValidLogin: false,
+      employeeType: EmployeeType.Regular,
+      nickName: '',
+
+      order: ''
+    };
+  }
 }

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts

@@ -272,6 +272,7 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit {
         if (
           !this.roomInfoSubject.value ||
           (!!this.roomInfoSubject.value &&
+            !!roomInfo &&
             this.roomInfoSubject.value.roomSeq !== roomInfo.roomSeq)
         ) {
           this.clearView();

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/create-chat.dialog.component.html

@@ -40,7 +40,7 @@
         >
           <mat-tab>
             <ng-template mat-tab-label>
-              <!--<mat-icon>group</mat-icon>-->
+              <!--<mat-icon>group</mat-icon>
               <svg
                 xmlns="http://www.w3.org/2000/svg"
                 width="20"
@@ -58,7 +58,8 @@
                 <circle cx="9" cy="7" r="4"></circle>
                 <path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
                 <path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
-              </svg>
+              </svg>-->
+              <button class="icon-button"><i class="mid mid-24 mdi-account-multiple"></i></button>
             </ng-template>
             <div class="mat-tab-frame">
               <div>
@@ -136,11 +137,11 @@
           </mat-tab>
           <mat-tab>
             <ng-template mat-tab-label>
-              <mat-icon
+              <!--<mat-icon
                 matTooltip="{{ 'organization.chart' | translate }}"
                 matTooltipPosition="after"
-                >device_hub</mat-icon
-              >
+                >device_hub</mat-icon>-->
+                <button class="icon-button"><i class="mid mid-24 mdi-file-tree"></i></button>
             </ng-template>
             <div>
               <app-layout-chat-left-sidenav-organization
@@ -162,7 +163,9 @@
               <mat-icon
                 matTooltip="{{ 'chat.room' | translate }}"
                 matTooltipPosition="before"
-                >chat</mat-icon
+                class="icon-button"
+                ><i class="mid mid-24 mdi-chat"></i>
+                </mat-icon
               >
             </ng-template>
             <div>

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html

@@ -1,5 +1,5 @@
 <mat-card class="confirm-card mat-elevation-z">
-  <mat-card-header>
+  <mat-card-header cdkDrag cdkDragRootElement=".cdk-overlay-pane" cdkDragHandle>
     <mat-card-title>
       <ng-container [ngSwitch]="messageInfo.type">
         <span *ngSwitchCase="MessageType.Receive">{{
@@ -249,11 +249,14 @@
       </mat-drawer>
     </mat-drawer-container>
   </mat-card-content>
-  <!-- <mat-card-actions class="button-farm flex-row">
+  <mat-card-actions class="button-farm flex-row">
     <button mat-stroked-button (click)="onClickConfirm()" class="mat-primary">
-      Confirm
+      {{ 'common.messages.confirm' | translate }}
     </button>
-  </mat-card-actions> -->
+    <button mat-flat-button (click)="onClickReply()" class="mat-primary">
+      {{ 'message.sendReply' | translate }}
+    </button>
+  </mat-card-actions>
 </mat-card>
 
 <mat-menu #messageMenu="matMenu" xPosition="after" yPosition="below">

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.ts

@@ -655,4 +655,11 @@ export class MessageDetailDialogComponent implements OnInit {
       returnType: 'CLOSE'
     });
   }
+
+  onClickReply(): void {
+    this.dialogRef.close({
+      returnType: 'REPLY',
+      messageInfo: this.messageInfo
+    });
+  }
 }

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-write.dialog.component.html

@@ -1,5 +1,5 @@
 <mat-card class="confirm-card mat-elevation-z">
-  <mat-card-header>
+  <mat-card-header cdkDrag cdkDragRootElement=".cdk-overlay-pane" cdkDragHandle>
     <mat-card-title>
       {{ (isModify ? 'message.modify' : 'message.sendTo') | translate }}
     </mat-card-title>

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/organization/selected-user-list.dialog.component.html

@@ -1,10 +1,16 @@
-<mat-card class="confirm-card mat-elevation-z">
+<mat-card class="confirm-card mat-elevation-z  selected-user-dialog">
   <mat-card-header>
     <mat-card-title>
       {{ data.title }}
-      <span class="count">
+      <span class="count text-accent-dark">
         {{ selectedUserList.length }} / {{ data.selectedUserList.length }}
       </span>
+    </mat-card-title>
+    <button class="icon-button btn-dialog-close" (click)="onClickChoice(false)">
+      <i class="mdi mdi-window-close"></i>
+    </button>
+  </mat-card-header>
+  <mat-card-content>
     <mat-checkbox
       #checkbox
       labelPosition="before"
@@ -14,15 +20,10 @@
       "
       (change)="onCheckAllUser(checkbox.checked)"
       (click)="$event.stopPropagation()"
+      class="check-all"
     >
       {{ 'common.messages.selectAll' | translate }}
     </mat-checkbox>
-    </mat-card-title>
-    <button class="icon-button btn-dialog-close" (click)="onClickChoice(false)">
-      <i class="mdi mdi-window-close"></i>
-    </button>
-  </mat-card-header>
-  <mat-card-content>
     <div class="item-list">
       <cdk-virtual-scroll-viewport
         itemSize="60"

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/organization/selected-user-list.dialog.component.scss

@@ -25,3 +25,19 @@
     }
   }
 }
+
+::ng-deep .selected-user-dialog {
+  .check-all {
+    display: flex;
+    border-bottom: 2px solid #444444;
+    .mat-checkbox-layout {
+      margin-left: auto;
+      padding-bottom: 6px;
+    }
+  }
+  .item-list {
+    .list-item {
+      padding: 0;
+    }
+  }
+}

projects/ucap-webmessenger-app/src/app/store/messenger/status/effects.ts

@@ -17,7 +17,14 @@ import {
   messageUpdate,
   messageUpdateFailure
 } from './actions';
-import { tap, switchMap, map, catchError, exhaustMap } from 'rxjs/operators';
+import {
+  tap,
+  switchMap,
+  map,
+  catchError,
+  exhaustMap,
+  delay
+} from 'rxjs/operators';
 import {
   StatusProtocolService,
   SSVC_TYPE_STATUS_BULK_INFO_DATA,
@@ -120,14 +127,20 @@ export class Effects {
     )
   );
 
-  myStatusCheck$ = createEffect(() =>
+  myStatusCheck$ = createEffect(
+    () =>
       this.actions$.pipe(
         ofType(AuthStore.loginSuccess),
         map(action => action.loginRes),
-      map(loginRes => {
-        return bulkInfo({ divCd: 'bulk', userSeqs: [loginRes.userSeq] });
+        delay(5000),
+        tap(loginRes => {
+          this.store.dispatch(
+            bulkInfo({ divCd: 'mybulk', userSeqs: [loginRes.userSeq] })
+          );
+          // return bulkInfo({ divCd: 'bulk', userSeqs: [loginRes.userSeq] });
         })
-    )
+      ),
+    { dispatch: false }
   );
 
   constructor(

projects/ucap-webmessenger-app/src/assets/i18n/en.json

@@ -295,6 +295,7 @@
     "modify": "Modify message",
     "sendTo": "Send message",
     "sendReservation": "Send reservation",
+    "sendReply": "Send reply",
     "placeholderForSearch": "search for name, title, content",
     "searchTypeName": "Name",
     "searchTypeTitle": "Title",

projects/ucap-webmessenger-app/src/assets/i18n/ko.json

@@ -295,6 +295,7 @@
     "modify": "쪽지 수정",
     "sendTo": "쪽지 보내기",
     "sendReservation": "쪽지 예약 보내기",
+    "sendReply": "답장",
     "placeholderForSearch": "이름, 제목, 내용 검색",
     "searchTypeName": "이름",
     "searchTypeTitle": "제목",

projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss

@@ -452,4 +452,9 @@ $daesang-grey: (
   .mat-calendar-body-selected {
     background-color: mat-color($accent);
   }
+  .list-item{
+    &.selected{
+      background-color: mat-color($accent, 100);
+    }
+  }
 }

projects/ucap-webmessenger-app/src/environments/environment.type.ts

@@ -195,101 +195,77 @@ export const protocolUrls: ProtocolUrls = {
 };
 
 export const commonApiacceptableFileExtensions: string[] = [
-  // 문서1
-  'csv',
-  'd01',
+  // 문서
   'doc',
   'docx',
   'dot',
   'dotx',
-  'hwp',
-  'log',
-  'one',
-  'pdf',
+  'ppt',
+  'pptx',
   'pot',
   'potx',
   'pps',
   'ppsx',
-  'ppt',
-  'pptx',
-  'ps',
-  // 문서2
-  'rtf',
-  'txt',
-  'vcf',
   'xls',
   'xlsx',
   'xlt',
   'xltx',
-  'xlsm',
-  'ods',
-  // CAD
-  'asc',
-  'dwg',
-  'dws',
-  'dwt',
-  'dxf',
-  'pgp',
-  'plt',
-  // MAC
-  'pages',
-  'keynote',
+  'rtf',
+  'txt',
+  'csv',
+  'pdf',
+  'hwp',
+
+  // 이미지
+  'tif',
+  'ogg',
+  'psd',
+  'ai',
+  'bmp',
+  'gif',
+  'jpg',
+  'jpeg',
+  'png',
+
   // 압축
-  '7z',
+  'zip',
+  'alz',
+  'a00',
   'a01',
   'a02',
   'a03',
-  'alz',
-  'egg',
-  'gz',
-  'rar',
-  'tar',
-  'zip',
+  'a04',
+  'a05',
+  'a06',
+  'a07',
+  'a08',
+  'a09',
+
   // 오디오
-  'aac',
-  'aiff',
-  'flac',
-  'm4a',
-  'mp2',
-  'mp3',
-  'mpega',
-  'mpga',
-  'ogg',
-  'wma',
   'wav',
+  'mp3',
+  'm4a',
+
   // 플래쉬
-  'fla',
-  'flv',
   'swf',
-  // 이미지
-  'ai',
-  'bmp',
-  'cdr',
-  'emf',
-  'eps',
-  'gif',
-  'jpeg',
-  'jpg',
-  'png',
-  'psd',
-  'tif',
-  'tiff',
-  'wmf',
+  'fla',
+
   // 동영상
-  '3gp',
   'avi',
-  'm4v',
-  'mkv',
-  'mov',
   'mp4',
-  'mpeg',
-  'mpg',
-  'rv',
+  'wmv',
+  'mov',
+  '3gp',
+  'mkv',
   'ts',
   'webm',
-  'wmv',
-  // 폴더전송용
-  'zdr'
+  'm4v',
+  'mpg',
+  'mpeg',
+
+  // 폴더전송
+  'zdr',
+  'dat'
 ];
 
 // export abstract class UrlConfig {

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

@@ -66,7 +66,7 @@
             <mat-icon>notifications_off</mat-icon>
           </div>-->
           <div class="icon-img" *ngIf="!checkable && !roomInfo.receiveAlarm">
-            <i class="mdi mdi-bell-off-outline text-primary-light"></i>
+            <i class="mdi mid-18 mdi-bell-off-outline text-primary-light"></i>
           </div>
         </div>
         <div class="final-message">

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

@@ -105,6 +105,7 @@ $thumbnail-msize: 40px;
           line-height: unset;
         }
         .icon-img {
+          padding-left: 4px;
           i {
             font-size: 1.1em;
             text-align: center;

projects/ucap-webmessenger-ui/src/assets/scss/partials/_icons.scss

@@ -3,8 +3,6 @@ mat-icon {
   font-size: 24px;
   width: 24px;
   height: 24px;
-  min-width: 24px;
-  min-height: 24px;
   line-height: 24px;
 
   @each $breakpoint, $materialBreakpoint in $helper-breakpoints {
@@ -32,17 +30,31 @@ mat-icon {
   justify-items: center;
   background: none;
   border: none;
-  width: 20px;
-  height: 20px;
+  width: auto;
+  height: auto;
   justify-items: center;
   justify-content: center;
   i {
+    &.mid {
       font-family: 'material-outline-icons';
       font-size: 20px;
       width: 20px;
       height: 20px;
       line-height: 20px;
       font-weight: normal;
+      &-18 {
+        font-size: 18px;
+        width: 18px;
+        height: 18px;
+        line-height: 18px;
+      }
+      &-24 {
+        font-size: 24px;
+        width: 24px;
+        height: 24px;
+        line-height: 24px;
+      }
+    }
     &:before {
       display: inline-block;
       font: normal normal normal 20px/1 'Material Design Icons';