From d623359d1e340429b4ce0829c453538ff26e4cf8 Mon Sep 17 00:00:00 2001 From: leejinho Date: Thu, 30 Jan 2020 17:16:20 +0900 Subject: [PATCH] modify integrated search. --- .../integrated-search.dialog.component.html | 1 + .../integrated-search.dialog.component.ts | 42 ++++++- .../integrated-search.component.html | 109 ++++++------------ .../integrated-search.component.scss | 11 ++ .../components/integrated-search.component.ts | 95 ++++++++++----- 5 files changed, 154 insertions(+), 104 deletions(-) diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/search/integrated-search.dialog.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/search/integrated-search.dialog.component.html index 7f58a9ce..d73db39d 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/search/integrated-search.dialog.component.html +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/search/integrated-search.dialog.component.html @@ -22,6 +22,7 @@ [pageListCount]="pageListCount" (search)="onSearch($event)" (changePage)="onChangePage($event)" + (openProfile)="onClickOpenProfile($event)" > diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/search/integrated-search.dialog.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/search/integrated-search.dialog.component.ts index 78fa47a4..7bb52df9 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/search/integrated-search.dialog.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/search/integrated-search.dialog.component.ts @@ -16,7 +16,7 @@ import { DeptUserResponse } from '@ucap-webmessenger/protocol-query'; import { LoginResponse } from '@ucap-webmessenger/protocol-authentication'; -import { map, catchError } from 'rxjs/operators'; +import { map, catchError, take } from 'rxjs/operators'; import { Subscription, of, Observable } from 'rxjs'; import { EnvironmentsInfo, KEY_ENVIRONMENTS_INFO } from '@app/types'; import { NGXLogger } from 'ngx-logger'; @@ -25,6 +25,13 @@ import { environment } from '../../../../../environments/environment'; import { TranslateService } from '@ngx-translate/core'; import { StatusBulkInfo } from '@ucap-webmessenger/protocol-status'; import { VersionInfo2Response } from '@ucap-webmessenger/api-public'; +import { DaesangProtocolService } from '@ucap-webmessenger/daesang'; +import { DialogService } from '@ucap-webmessenger/ui'; +import { + ProfileDialogComponent, + ProfileDialogData, + ProfileDialogResult +} from '../profile/profile.dialog.component'; export interface IntegratedSearchDialogData { keyword: string; @@ -61,6 +68,8 @@ export class IntegratedSearchDialogComponent implements OnInit, OnDestroy { @Inject(MAT_DIALOG_DATA) public data: IntegratedSearchDialogData, private queryProtocolService: QueryProtocolService, private sessionStorageService: SessionStorageService, + private daesangProtocolService: DaesangProtocolService, + private dialogService: DialogService, private store: Store, private logger: NGXLogger ) { @@ -164,4 +173,35 @@ export class IntegratedSearchDialogComponent implements OnInit, OnDestroy { this.onSearch(this.currentSearchWord); } + + onClickOpenProfile(userSeq: number) { + if (!userSeq || userSeq < 0) { + return; + } + + this.daesangProtocolService + .dataUserDaesang({ + divCd: 'OPENPROF', + seq: userSeq, + senderCompanyCode: this.loginRes.userInfo.companyCode, + senderEmployeeType: this.loginRes.userInfo.employeeType + }) + .pipe( + take(1), + map(res => { + if (!!res && !!res.userInfo) { + this.dialogService.open< + ProfileDialogComponent, + ProfileDialogData, + ProfileDialogResult + >(ProfileDialogComponent, { + data: { + userInfo: res.userInfo + } + }); + } + }) + ) + .subscribe(); + } } diff --git a/projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.html b/projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.html index a6d28777..a569156a 100644 --- a/projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.html +++ b/projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.html @@ -18,25 +18,14 @@ - - - - - - - - @@ -97,14 +74,12 @@ - - - - - - -
+ {{ 'search.fieldProfile' | translate }} - +
- - + phone_android
- 		- {{ 'search.fieldName' | translate }} -
- - - {{ getWorkstatus(element) }} + {{ getWorkstatusInfo(element, 'text') }} + {{ element.name }}
{{ 'search.fieldGrade' | translate }} {{ 'search.fieldDeptartment' | translate }} +
{{ element.deptName }}
@@ -113,14 +88,12 @@ 		{{ 'search.fieldCompany' | translate }} +
{{ element.companyName }}
@@ -130,14 +103,12 @@ 		{{ 'search.fieldOfficePhoneNumber' | translate }} +
{{ element.lineNumber }}
@@ -146,14 +117,12 @@ 		{{ 'search.fieldHandphone' | translate }} +
{{ element.hpNumber }}
@@ -162,14 +131,12 @@ 		{{ 'search.fieldResponsibilities' | translate }} +
{{ element.responsibilities }}
@@ -194,14 +159,12 @@ 		{{ 'search.fieldWorkPlace' | translate }} +
{{ element.workplace }}
diff --git a/projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.scss b/projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.scss index 585f6993..78610703 100644 --- a/projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.scss +++ b/projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.scss @@ -13,6 +13,15 @@ } } +@mixin disable-selection { + -webkit-touch-callout: none; /* iOS Safari */ + -webkit-user-select: none; /* Safari */ + -khtml-user-select: none; /* Konqueror HTML */ + -moz-user-select: none; /* Firefox */ + -ms-user-select: none; /* Internet Explorer/Edge */ + user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */ +} + .search-scrollbar { height: 550px; } @@ -54,6 +63,7 @@ table-layout: fixed; width: 100%; th { + @include disable-selection; text-align: center; } td.mat-cell { @@ -77,6 +87,7 @@ transform: translateY(-30px); } .thumbnail { + cursor: pointer; &-mask { display: inline-block; width: 40px; diff --git a/projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.ts b/projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.ts index b692dee0..f0171726 100644 --- a/projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.ts +++ b/projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.ts @@ -54,7 +54,6 @@ export class IntegratedSearchComponent implements OnInit { @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator; displayedColumns: string[] = [ 'profile', - 'name', 'deptName', 'companyName', 'grade', @@ -69,6 +68,7 @@ export class IntegratedSearchComponent implements OnInit { pressed = false; startX: any; startWidth: any; + relationWidth: any; resizableFnMousemove: () => void; resizableFnMouseup: () => void; @@ -130,29 +130,49 @@ export class IntegratedSearchComponent implements OnInit { return rtnClass; } - getWorkstatus(userInfo: UserInfoSS): string { - let workstatus = ''; - if (!!userInfo && !!userInfo.workstatus) { - switch (userInfo.workstatus) { - case WorkStatusType.VacationAM: - workstatus = '오전'; - break; - case WorkStatusType.VacationPM: - workstatus = '오후'; - break; - case WorkStatusType.VacationAll: - workstatus = '휴가'; - break; - case WorkStatusType.LeaveOfAbsence: - workstatus = '휴직'; - break; - case WorkStatusType.LongtermRefresh: - workstatus = '장기'; - break; + getWorkstatusInfo(userInfo: UserInfoSS, type: string): string { + let workstatus = userInfo.workstatus; + + const presences = this.presence.filter(p => p.userSeq === userInfo.seq); + + if (!!presences && presences.length > 0) { + const presence = presences[0]; + if ( + !!presence && + !!presence.workstatus && + presence.workstatus.trim().length > 0 + ) { + workstatus = presence.workstatus; } } - return workstatus; + let text = ''; + // morning-off: 오전 afternoon-off: 오후 day-off: 휴가 long-time: 장기 leave-of-absence: 휴직 + let style = ''; + switch (workstatus) { + case WorkStatusType.VacationAM: + style = 'morning-off'; + text = '오전'; + break; + case WorkStatusType.VacationPM: + style = 'afternoon-off'; + text = '오후'; + break; + case WorkStatusType.VacationAll: + style = 'day-off'; + text = '휴가'; + break; + case WorkStatusType.LeaveOfAbsence: + style = 'leave-of-absence'; + text = '휴직'; + break; + case WorkStatusType.LongtermRefresh: + style = 'long-time'; + text = '장기'; + break; + } + + return type === 'text' ? text : style; } onClickOpenProfile(event: MouseEvent, userSeq: number) { @@ -162,23 +182,34 @@ export class IntegratedSearchComponent implements OnInit { this.openProfile.emit(userSeq); } - resizeTable(event: any, column: any) { + resizeTable(event: any) { this.start = event.target; - this.pressed = true; - this.startX = event.pageX; - this.startWidth = this.start.clientWidth; - this.mouseMove(column); + if (this.start.cellIndex !== this.displayedColumns.length - 1) { + this.pressed = true; + this.startX = event.pageX; + this.startWidth = this.start.clientWidth; + this.relationWidth = this.start.nextElementSibling.clientWidth; + this.mouseMove(); + } } - mouseMove(column: any) { + mouseMove() { + const column = this.start; + const relationColumn = column.nextElementSibling; + this.resizableFnMousemove = this.renderer.listen( 'document', 'mousemove', event => { if (this.pressed) { - let width = this.startWidth + (event.pageX - this.startX); - let index = this.start.cellIndex; - column.width = width; + const gap = event.pageX - this.startX; + const columnWidth = this.startWidth + gap; + const relationWidth = this.relationWidth - gap; + + if (columnWidth > 50 && relationWidth > 50) { + column.width = columnWidth; + relationColumn.width = relationWidth; + } } } ); @@ -188,6 +219,10 @@ export class IntegratedSearchComponent implements OnInit { event => { if (this.pressed) { this.pressed = false; + this.start = undefined; + this.startX = undefined; + this.startWidth = undefined; + this.relationWidth = undefined; this.resizableFnMousemove(); this.resizableFnMouseup(); }