188 lines
7.0 KiB
HTML
188 lines
7.0 KiB
HTML
<mat-card class="confirm-card mat-elevation-z">
|
|
<mat-card-header cdkDrag cdkDragRootElement=".cdk-overlay-pane" cdkDragHandle>
|
|
<mat-card-title>{{ data.title }}</mat-card-title>
|
|
</mat-card-header>
|
|
<mat-card-content>
|
|
<div *ngIf="data.type === UserSelectDialogType.NewGroup">
|
|
<form name="inputForm" [formGroup]="inputForm" novalidate>
|
|
<mat-form-field
|
|
hintLabel="특수문자는 '-,_'만 사용할 수 있습니다."
|
|
style="display:block;margin-bottom:10px;"
|
|
>
|
|
<input
|
|
matInput
|
|
#input
|
|
maxlength="20"
|
|
placeholder="그룹이름"
|
|
formControlName="groupName"
|
|
/>
|
|
<mat-hint align="end">{{ input.value?.length || 0 }}/20</mat-hint>
|
|
</mat-form-field>
|
|
</form>
|
|
</div>
|
|
<div
|
|
fxLayout="column"
|
|
fxLayout.xs="column"
|
|
fxLayoutAlign="center"
|
|
fxLayoutGap="10px"
|
|
fxLayoutGap.xs="0"
|
|
>
|
|
<div fxFlex class="container">
|
|
<mat-tab-group
|
|
mat-stretch-tabs
|
|
(selectedTabChange)="onSelectedTabChange($event)"
|
|
>
|
|
<mat-tab>
|
|
<ng-template mat-tab-label>
|
|
<!--<mat-icon>group</mat-icon>-->
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
|
stroke-width="1.5" stroke-linecap="butt" stroke-linejoin="round">
|
|
<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
|
|
<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>
|
|
</ng-template>
|
|
<div>
|
|
<div>
|
|
<ucap-organization-tenant-search
|
|
[companyList]="companyList$ | async"
|
|
[companyCode]="companyCode"
|
|
(keyDownEnter)="
|
|
onKeyDownEnterOrganizationTenantSearch($event)
|
|
"
|
|
(cancel)="onClickCancel()"
|
|
></ucap-organization-tenant-search>
|
|
</div>
|
|
<div *ngIf="!isShowSearch" class="list-panel">
|
|
<ucap-group-expansion-panel
|
|
#groupExpansionPanel
|
|
[groupBuddyList]="groupBuddyList$ | async"
|
|
[favoritBuddyList]="favoritBuddyList$ | async"
|
|
[selectedUserList]="selectedUserList"
|
|
[checkable]="true"
|
|
(checkGroup)="onCheckGroup($event)"
|
|
class="group-expansion"
|
|
>
|
|
<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>
|
|
</div>
|
|
<div *ngIf="isShowSearch" class="search-result">
|
|
<div *ngIf="searchProcessing">
|
|
<mat-progress-bar mode="indeterminate"></mat-progress-bar>
|
|
</div>
|
|
<div class="result-num">
|
|
검색결과
|
|
<span class="text-accent-color"
|
|
>({{ searchUserInfos.length }}명)</span
|
|
>
|
|
</div>
|
|
<ucap-profile-user-list-item
|
|
*ngFor="let userInfo of searchUserInfos"
|
|
[userInfo]="userInfo"
|
|
[sessionVerinfo]="sessionVerinfo"
|
|
[selectedUserList]="selectedUserList"
|
|
[isChecked]="getCheckedUser(userInfo)"
|
|
[checkable]="true"
|
|
(checkUser)="onCheckUser($event)"
|
|
>
|
|
</ucap-profile-user-list-item>
|
|
</div>
|
|
</div>
|
|
</mat-tab>
|
|
<mat-tab>
|
|
<ng-template mat-tab-label>
|
|
<mat-icon>device_hub</mat-icon>
|
|
</ng-template>
|
|
<div>
|
|
<app-layout-chat-left-sidenav-organization
|
|
[showTitle]="false"
|
|
[selectedUserList]="selectedUserList"
|
|
[isUserSelect]="true"
|
|
(checkAllUser)="onCheckAllUser($event)"
|
|
(checkUser)="onCheckUser($event)"
|
|
class="dialog-org"
|
|
>
|
|
</app-layout-chat-left-sidenav-organization>
|
|
</div>
|
|
</mat-tab>
|
|
<mat-tab *ngIf="data.type === UserSelectDialogType.MessageForward">
|
|
<ng-template mat-tab-label>
|
|
<mat-icon>chat</mat-icon>
|
|
</ng-template>
|
|
<div>
|
|
<!-- <cdk-virtual-scroll-viewport itemSize="20" style="height: 100%">
|
|
<ucap-room-list-item
|
|
*cdkVirtualFor="let room of roomList"
|
|
[loginRes]="loginRes"
|
|
[roomInfo]="room"
|
|
[roomUserInfo]="getRoomUserList(room)"
|
|
[sessionVerinfo]="sessionVerinfo"
|
|
[checkable]="getCheckableRoom(room)"
|
|
[isChecked]="getCheckedRoom(room)"
|
|
[multiCheckable]="false"
|
|
(checkRoom)="onCheckRoom($event)"
|
|
>
|
|
</ucap-room-list-item>
|
|
</cdk-virtual-scroll-viewport> -->
|
|
<ucap-room-list-item
|
|
*ngFor="let room of roomList"
|
|
[loginRes]="loginRes"
|
|
[roomInfo]="room"
|
|
[roomUserInfo]="getRoomUserList(room)"
|
|
[sessionVerinfo]="sessionVerinfo"
|
|
[checkable]="getCheckableRoom(room)"
|
|
[isChecked]="getCheckedRoom(room)"
|
|
[multiCheckable]="false"
|
|
(checkRoom)="onCheckRoom($event)"
|
|
>
|
|
</ucap-room-list-item>
|
|
</div>
|
|
</mat-tab>
|
|
</mat-tab-group>
|
|
</div>
|
|
<div *ngIf="isShowSelectedUserList" class="list-chip">
|
|
<mat-chip-list aria-label="User selection">
|
|
<mat-chip
|
|
*ngFor="let userInfo of selectedUserList"
|
|
[selected]="getChipsRemoveYn(userInfo)"
|
|
(removed)="onClickDeleteUser(userInfo)"
|
|
>
|
|
{{ userInfo.name }}
|
|
<mat-icon matChipRemove *ngIf="getChipsRemoveYn(userInfo)"
|
|
>clear</mat-icon
|
|
>
|
|
</mat-chip>
|
|
</mat-chip-list>
|
|
</div>
|
|
<span>{{ selectedUserList.length }}명</span>
|
|
</div>
|
|
</mat-card-content>
|
|
<mat-card-actions class="button-farm flex-row">
|
|
<button
|
|
mat-stroked-button
|
|
(click)="onClickChoice(false)"
|
|
class="mat-primary"
|
|
>
|
|
No
|
|
</button>
|
|
<button
|
|
mat-flat-button
|
|
[disabled]="getBtnValid()"
|
|
(click)="onClickChoice(true)"
|
|
class="mat-primary"
|
|
>
|
|
Yes
|
|
</button>
|
|
</mat-card-actions>
|
|
</mat-card>
|