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

import { Component, OnInit, OnDestroy, Inject } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
import { NGXLogger } from 'ngx-logger';
import { Observable, combineLatest, Subscription } from 'rxjs';
import { map, tap } from 'rxjs/operators';

import { Store, select } from '@ngrx/store';
import * as AppStore from '@app/store';
import * as QueryStore from '@app/store/messenger/query';

import { SessionStorageService } from '@ucap-webmessenger/web-storage';
import { Company } from '@ucap-webmessenger/api-external';
import { VersionInfo2Response } from '@ucap-webmessenger/api-public';
import { LoginInfo, KEY_LOGIN_INFO } from '@app/types';
import { KEY_VER_INFO } from '@app/types/ver-info.type';
import { LoginResponse } from '@ucap-webmessenger/protocol-authentication';
import {
  UserInfo,
  GroupDetailData,
  RoomUserDetailData,
  RoomUserData
} from '@ucap-webmessenger/protocol-sync';
import {
  DeptSearchType,
  UserInfoSS,
  UserInfoF,
  UserInfoDN
} from '@ucap-webmessenger/protocol-query';
import {
  RoomInfo,
  UserInfoShort,
  UserInfo as RoomUserInfo
} from '@ucap-webmessenger/protocol-room';

export interface CreateChatDialogData {
  title: string;
}

export interface CreateChatDialogResult {
  choice: boolean;
  selectedUserList?: (UserInfo | UserInfoSS | UserInfoF | UserInfoDN)[];
}

@Component({
  selector: 'app-layout-messenger-create-chat',
  templateUrl: './create-chat.dialog.component.html',
  styleUrls: ['./create-chat.dialog.component.scss']
})
export class CreateChatDialogComponent implements OnInit, OnDestroy {
  constructor(
    public dialogRef: MatDialogRef<
      CreateChatDialogData,
      CreateChatDialogResult
    >,
    @Inject(MAT_DIALOG_DATA) public data: CreateChatDialogData,
    private store: Store<any>,
    private sessionStorageService: SessionStorageService,
    private logger: NGXLogger
  ) {}

  loginRes: LoginResponse;
  loginResSubscription: Subscription;
  sessionVerinfo = this.sessionStorageService.get<VersionInfo2Response>(
    KEY_VER_INFO
  );

  companyList$: Observable<Company[]>;
  companyCode: string;
  groupBuddyList$: Observable<
    { group: GroupDetailData; buddyList: UserInfo[] }[]
  >;
  favoritBuddyList$: Observable<UserInfo[]>;

  roomList: RoomInfo[];
  roomUserList: RoomUserDetailData[];
  roomUserShortList: RoomUserData[];
  roomSubscription: Subscription;

  // 수집 데이터
  selectedUserList: (UserInfo | UserInfoSS | UserInfoF | UserInfoDN)[] = [];

  ngOnInit() {
    const loginInfo = this.sessionStorageService.get<LoginInfo>(KEY_LOGIN_INFO);
    this.companyCode = loginInfo.companyCode;

    this.companyList$ = this.store.pipe(
      select(AppStore.SettingSelector.CompanySelector.companyList)
    );

    this.loginResSubscription = this.store
      .pipe(
        select(AppStore.AccountSelector.AuthenticationSelector.loginRes),
        tap(loginRes => {
          this.loginRes = loginRes;
        })
      )
      .subscribe();

    this.groupBuddyList$ = combineLatest([
      this.store.pipe(
        select(AppStore.MessengerSelector.SyncSelector.selectAllBuddy2)
      ),
      this.store.pipe(
        select(AppStore.MessengerSelector.SyncSelector.selectAllGroup2)
      )
    ]).pipe(
      map(([buddyList, groupList]) => {
        const groupBuddyList: {
          group: GroupDetailData;
          buddyList: UserInfo[];
        }[] = [];
        for (const group of groupList) {
          groupBuddyList.push({
            group,
            buddyList: buddyList.filter(buddy => {
              return group.userSeqs.indexOf(buddy.seq) > -1;
            })
          });
        }

        return groupBuddyList;
      })
    );

    this.favoritBuddyList$ = this.store
      .pipe(select(AppStore.MessengerSelector.SyncSelector.selectAllBuddy2))
      .pipe(
        map(buddyInfoList => {
          return buddyInfoList
            .filter(buddy => buddy.isFavorit)
            .sort((a, b) => (a.name < b.name ? -1 : a.name > b.name ? 1 : 0));
        })
      );

    this.roomSubscription = combineLatest([
      this.store.pipe(
        select(AppStore.MessengerSelector.SyncSelector.selectAllRoom)
      ),
      this.store.pipe(
        select(AppStore.MessengerSelector.SyncSelector.selectAllRoomUser)
      ),
      this.store.pipe(
        select(AppStore.MessengerSelector.SyncSelector.selectAllRoomUserShort)
      )
    ])
      .pipe(
        tap(([room, roomUser, roomUserShort]) => {
          this.roomList = room;
          this.roomUserList = roomUser;
          this.roomUserShortList = roomUserShort;
        })
      )
      .subscribe();
  }

  ngOnDestroy(): void {
    if (!!this.roomSubscription) {
      this.roomSubscription.unsubscribe();
    }
    if (!!this.loginResSubscription) {
      this.loginResSubscription.unsubscribe();
    }
  }

  getRoomUserList(roomInfo: RoomInfo): RoomUserInfo[] | UserInfoShort[] {
    if (!!this.roomUserList && 0 < this.roomUserList.length) {
      const i = this.roomUserList.findIndex(
        value => roomInfo.roomSeq === value.roomSeq
      );
      if (-1 < i) {
        return this.roomUserList[i].userInfos;
      }
    }

    if (!!this.roomUserShortList && 0 < this.roomUserShortList.length) {
      const i = this.roomUserShortList.findIndex(
        value => roomInfo.roomSeq === value.roomSeq
      );
      if (-1 < i) {
        return this.roomUserShortList[i].userInfos;
      }
    }
  }

  onKeyDownEnterOrganizationTenantSearch(params: {
    companyCode: string;
    searchWord: string;
  }) {
    this.store.dispatch(
      QueryStore.deptUser({
        divCd: 'GRP',
        companyCode: params.companyCode,
        searchRange: DeptSearchType.All,
        search: params.searchWord,
        senderCompanyCode: params.companyCode,
        senderEmployeeType: this.loginRes.userInfo.employeeType
      })
    );
  }

  /** 동료그룹 :: 그룹의 checkbox 의 이벤트를 받아 선택된 유저리스트를 수집. */
  onCheckGroup(params: {
    isChecked: boolean;
    groupBuddyList: { group: GroupDetailData; buddyList: UserInfo[] };
  }) {
    if (params.isChecked) {
      params.groupBuddyList.buddyList.forEach(item => {
        if (
          this.selectedUserList.filter(user => user.seq === item.seq).length ===
          0
        ) {
          this.selectedUserList = [...this.selectedUserList, item];
        }
      });
    } else {
      this.selectedUserList = this.selectedUserList.filter(
        item =>
          params.groupBuddyList.buddyList.filter(del => del.seq === item.seq)
            .length === 0
      );
    }
  }

  /** 동료그룹>부서원, 조직도>부서원 :: 리스트의 checkbox 의 이벤트를 받아 선택된 유저리스트를 수집. */
  onCheckUser(params: {
    isChecked: boolean;
    userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN;
  }) {
    if (params.isChecked) {
      if (
        this.selectedUserList.filter(user => user.seq === params.userInfo.seq)
          .length === 0 &&
        params.userInfo
      ) {
        this.selectedUserList = [...this.selectedUserList, params.userInfo];
      }
    } else {
      this.selectedUserList = this.selectedUserList.filter(
        item => item.seq !== params.userInfo.seq
      );
    }
  }

  /** 그룹>부서원 리스트의 ischecked 를 판단. */
  getCheckedUser(userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN) {
    if (!!this.selectedUserList && this.selectedUserList.length > 0) {
      return (
        this.selectedUserList.filter(item => item.seq === userInfo.seq).length >
        0
      );
    }
    return false;
  }

  /** 팝업의 선택 이벤트 전달. */
  onClickChoice(choice: boolean): void {
    this.dialogRef.close({
      choice,
      selectedUserList: this.selectedUserList
    });
  }
}