From 7750c940016d8f62b95fb90a4163d2a508968fb9 Mon Sep 17 00:00:00 2001 From: leejinho Date: Thu, 5 Mar 2020 11:10:33 +0900 Subject: [PATCH] =?UTF-8?q?=EC=A1=B0=ED=9A=8C=20=EB=B6=80=EC=84=9C?= =?UTF-8?q?=EC=9B=90=20=EB=A6=AC=EC=8A=A4=ED=8A=B8=20=EC=BB=B4=ED=8F=AC?= =?UTF-8?q?=EB=84=8C=ED=8A=B8=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/main-contents.component.html | 1 + .../components/main-contents.component.ts | 12 +- .../main-contents/messages.component.ts | 6 +- .../main-contents/organization.component.html | 186 +++----------- .../main-contents/organization.component.scss | 109 +-------- .../main-contents/organization.component.ts | 181 ++++---------- .../components/detail-table.component.html | 158 ++++++++++++ .../components/detail-table.component.scss | 129 ++++++++++ .../components/detail-table.component.spec.ts | 24 ++ .../lib/components/detail-table.component.ts | 229 ++++++++++++++++++ .../src/lib/ucap-ui-organization.module.ts | 11 +- .../src/public-api.ts | 1 + .../src/lib/pipes/string.pipe.ts | 4 +- 13 files changed, 640 insertions(+), 411 deletions(-) create mode 100644 projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.html create mode 100644 projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.scss create mode 100644 projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.spec.ts create mode 100644 projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.ts diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents.component.html index 66c9325c..80842c1a 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents.component.html +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents.component.html @@ -14,6 +14,7 @@ > (); + @Output() closeRightDrawer = new EventEmitter(); @@ -34,10 +35,11 @@ export class MainContentsComponent implements OnInit { ); } - onClickOpenProfile(params: { - userSeq: number; - openProfileOptions?: OpenProfileOptions; - }) {} + onClickOpenProfile(userSeq: number) { + this.openProfile.emit({ userSeq }); + } - onCloseRightDrawer() {} + onCloseRightDrawer() { + this.closeRightDrawer.emit(); + } } diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/messages.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/messages.component.ts index f27580eb..9b22bc49 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/messages.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/messages.component.ts @@ -147,9 +147,7 @@ import { AuthResponse } from '@ucap-webmessenger/protocol-query'; }) export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit { @Output() - openProfile = new EventEmitter<{ - userSeq: number; - }>(); + openProfile = new EventEmitter(); @Output() closeRightDrawer = new EventEmitter(); @@ -1728,7 +1726,7 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit { roomType !== RoomType.Allim_Elephant && roomType !== RoomType.Allim_TMS ) { - this.openProfile.emit({ userSeq }); + this.openProfile.emit(userSeq); } } diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.html index 5c8a1f5f..fd006ba5 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.html +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.html @@ -8,7 +8,7 @@ >

- + + {{ 'common.searchResult' | translate }}({{ (searchDepartmentUserInfoList$ | async).length }} + >({{ selectedDepartmentUserInfoList.length }} {{ 'common.units.persons' | translate }}) @@ -46,156 +46,40 @@

-
+
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- {{ 'search.fieldProfile' | translate }} - -
-
- - - - - - phone_android - -
-
- - {{ getWorkstatusInfo(element, 'text') }} - - - {{ element.name }} - -
-
- 		- {{ 'search.fieldGrade' | translate }} - -
- {{ element.grade }} -
- 		- {{ 'search.fieldDeptartment' | translate }} - -
- {{ element.deptName }} -
- 		- {{ 'search.fieldCompany' | translate }} - -
- {{ element.companyName }} -
- 		- {{ 'search.fieldOfficePhoneNumber' | translate }} - -
- {{ element.lineNumber }} -
- 		- {{ 'search.fieldHandphone' | translate }} - -
- {{ element.hpNumber }} -
- 		- {{ 'search.fieldResponsibilities' | translate }} - -
- {{ element.responsibilities }} -
- 		- {{ 'search.fieldWorkPlace' | translate }} - -
- {{ element.workplace }} -
-
- -
- {{ 'common.noSearchResult' | translate }} -
+
-
+
+ + + + + Personal data + + + Type your name and age + + + + + First name + + + + + Age + + + + +
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.scss index 43a7a652..f3dd3a47 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.scss +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.scss @@ -99,114 +99,7 @@ overflow: hidden; display: flex; - table { - table-layout: fixed; + .detail-table { width: 100%; - th { - @include disable-selection; - text-align: center; - &.profile { - width: 200px; - min-width: 200px; - } - } - td.mat-cell { - padding: 6px; - position: relative; - width: 100px; - div { - @include ellipsis(1); - - &.table-item { - display: flex; - width: 200px; - min-width: 200px; - font-size: 1em; - div { - display: inline-flex; - height: 100%; - align-self: center; - .name { - @include ellipsis(1); - font-size: 1em; - font-weight: 600; - } - .status { - font-size: 0.84em; - } - - &.profile { - width: 70px; - text-overflow: unset; - flex: 0 0 auto; - .presence { - transform: translateY(6px); - } - .thumbnail { - cursor: pointer; - &-mask { - display: inline-block; - width: 40px; - height: 40px; - border-radius: 50%; - overflow: hidden; - margin-right: 0; - position: relative; - img { - width: 40px; - height: auto; - background-color: #efefef; - } - } - } - .marker-mobile-state { - position: absolute; - background-color: #ffffff; - width: 20px; - height: 20px; - border-radius: 50%; - bottom: 4px; - left: 50px; - display: flex; - align-items: center; - align-content: center; - justify-content: center; - .mat-icon { - font-size: 0.9em; - width: 18px; - height: 18px; - line-height: 18px; - min-width: 18px; - min-height: 18px; - } - } - } - } - } - } - } } } - -.work-status { - display: inline-block; - justify-content: center; - justify-items: center; - color: #ffffff; - height: 100%; - min-width: 32px; - margin-right: 4px; - border-radius: 24px; - flex: 0 0 auto; - font-size: 0.8em; - text-align: center; -} - -.no-search-result { - display: flex; - width: 100%; - margin-top: 40px; - justify-content: center; - justify-items: center; - font-size: 1.1em; -} diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.ts index 8d2233c0..0f267b9e 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.ts +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/main-contents/organization.component.ts @@ -18,7 +18,7 @@ import * as QueryStore from '@app/store/messenger/query'; import * as SyncStore from '@app/store/messenger/sync'; import * as ChatStore from '@app/store/messenger/chat'; import * as StatusStore from '@app/store/messenger/status'; -import { Observable, Subscription } from 'rxjs'; +import { Observable, Subscription, combineLatest } from 'rxjs'; import { PresenceType, StatusCode } from '@ucap-webmessenger/core'; import { StatusBulkInfo, @@ -26,6 +26,7 @@ import { } from '@ucap-webmessenger/protocol-status'; import { VersionInfo2Response } from '@ucap-webmessenger/api-public'; import { KEY_VER_INFO } from '@app/types'; +import { Sort } from '@angular/material/sort'; @Component({ selector: 'app-layout-messenger-organization', @@ -38,28 +39,19 @@ export class OrganizationComponent implements OnInit, OnDestroy { sessionVerinfo: VersionInfo2Response; - isSearch$: Observable; + isSearch: boolean; + isSearchSubscription: Subscription; selectedDepartmentProcessing$: Observable; selectedDepartment$: Observable; - departmentUserInfoList$: Observable; - searchDepartmentUserInfoList$: Observable; + departmentUserInfoListSubscription: Subscription; + searchDepartmentUserInfoListSubscription: Subscription; + + selectedDepartmentUserInfoList: UserInfoSS[] = []; profileImageRoot: string; + presence$: Observable; PresenceType = PresenceType; - presenceSubscription: Subscription; - presence: StatusBulkInfo[] = []; - displayedColumns: string[] = [ - 'profile', - 'deptName', - 'companyName', - 'grade', - 'lineNumber', - 'hpNumber', - 'email', - 'responsibilities', - 'workplace' - ]; constructor( private store: Store, @@ -75,9 +67,11 @@ export class OrganizationComponent implements OnInit, OnDestroy { } ngOnInit() { - this.isSearch$ = this.store.pipe( - select(AppStore.MessengerSelector.QuerySelector.isSearch) - ); + this.isSearchSubscription = this.store + .pipe(select(AppStore.MessengerSelector.QuerySelector.isSearch)) + .subscribe(isSearch => { + this.isSearch = isSearch; + }); this.selectedDepartmentProcessing$ = this.store.pipe( select( @@ -89,141 +83,48 @@ export class OrganizationComponent implements OnInit, OnDestroy { select(AppStore.MessengerSelector.QuerySelector.selectedDepartment) ); - this.departmentUserInfoList$ = this.store.pipe( - select(AppStore.MessengerSelector.QuerySelector.departmentUserInfoList) - ); - - this.searchDepartmentUserInfoList$ = this.store.pipe( - select( - AppStore.MessengerSelector.QuerySelector.searchDepartmentUserInfoList + this.departmentUserInfoListSubscription = this.store + .pipe( + select(AppStore.MessengerSelector.QuerySelector.departmentUserInfoList) ) - ); + .subscribe(list => { + if (!this.isSearch) { + this.selectedDepartmentUserInfoList = list; + } + }); - this.presenceSubscription = this.store + this.searchDepartmentUserInfoListSubscription = this.store .pipe( select( - AppStore.MessengerSelector.StatusSelector.selectAllStatusBulkInfo + AppStore.MessengerSelector.QuerySelector.searchDepartmentUserInfoList ) ) - .subscribe(presence => { - this.presence = presence; + .subscribe(list => { + if (!!this.isSearch) { + this.selectedDepartmentUserInfoList = list; + } }); + this.presence$ = this.store.pipe( + select(AppStore.MessengerSelector.StatusSelector.selectAllStatusBulkInfo) + ); + this.profileImageRoot = this.sessionVerinfo.profileRoot; } ngOnDestroy(): void { - if (!!this.presenceSubscription) { - this.presenceSubscription.unsubscribe(); + if (!!this.isSearchSubscription) { + this.isSearchSubscription.unsubscribe(); + } + if (!!this.departmentUserInfoListSubscription) { + this.departmentUserInfoListSubscription.unsubscribe(); + } + if (!!this.searchDepartmentUserInfoListSubscription) { + this.searchDepartmentUserInfoListSubscription.unsubscribe(); } } - /******************************* - * ABOUT TABLE - *******************************/ - - getPresence(userInfo: UserInfoSS, type: PresenceType): string { - const presences = this.presence.filter(p => p.userSeq === userInfo.seq); - - let status: string; - let rtnClass = ''; - if (!!presences && presences.length > 0) { - const presence = presences[0]; - switch (type) { - case PresenceType.PC: - status = !!presence ? presence.pcStatus : undefined; - break; - case PresenceType.MOBILE: - status = !!presence ? presence.mobileStatus : undefined; - break; - } - - if (!!status) { - switch (status) { - case StatusCode.OnLine: - rtnClass = type + 'On'; - break; - case StatusCode.Away: - rtnClass = type + 'Out'; - break; - case StatusCode.Busy: - rtnClass = type + 'Other'; - break; - default: - rtnClass = type + 'Off'; - break; - } - } - } else { - rtnClass = type + 'Off'; - } - - return rtnClass; - } - getPresenceMsg(userInfo: UserInfoSS): string { - const presences = this.presence.filter(p => p.userSeq === userInfo.seq); - - if (!!presences && presences.length > 0) { - const presence = presences[0]; - if ( - !!presence && - !!presence.statusMessage && - presence.statusMessage !== '.' - ) { - return presence.statusMessage; - } - } - return ''; - } - 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; - } - } - - 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) { - event.preventDefault(); - event.stopPropagation(); - + onClickOpenProfile(userSeq: number) { this.openProfile.emit(userSeq); } } diff --git a/projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.html b/projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.html new file mode 100644 index 00000000..3e2d81af --- /dev/null +++ b/projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.html @@ -0,0 +1,158 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ {{ 'search.fieldProfile' | translate }} + +
+ + + + + + phone_android + +
+ 		+
+ + {{ 'search.fieldName' | translate }} + + + {{ 'search.fieldGrade' | translate }} + +
+
+ {{ 'search.fieldDeptartment' | translate }} +
+ 		+
+ + {{ getWorkstatusInfo(element, 'text') }} + + + {{ element.name }} + + + {{ element.grade }} + +
+
+ {{ element.deptName }} +
+ 		+
+ {{ 'search.fieldCompany' | translate }} +
+
+ {{ 'search.fieldHandphone' | translate }} +
+ 		+
+ {{ element.companyName }} +
+
+ {{ element.hpNumber | ucapStringFormatterPhone }} +
+ 		+
+ {{ 'search.fieldWorkPlace' | translate }} +
+
+ {{ 'search.fieldOfficePhoneNumber' | translate }} +
+ 		+
+ {{ element.workplace }} +
+
+ {{ element.lineNumber | ucapStringFormatterPhone }} +
+ 		+
+ {{ 'search.fieldResponsibilities' | translate }} +
+
+ {{ 'search.fieldEmail' | translate }} +
+ 		+
+ {{ element.responsibilities }} +
+ + 		+ + + + + +
+ +
+ {{ 'common.noSearchResult' | translate }} +
diff --git a/projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.scss b/projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.scss new file mode 100644 index 00000000..9fa4e3e1 --- /dev/null +++ b/projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.scss @@ -0,0 +1,129 @@ +@charset 'utf-8'; +@mixin ellipsis($row) { + overflow: hidden; + text-overflow: ellipsis; + @if $row == 1 { + display: block; + white-space: nowrap; + word-wrap: normal; + } @else if $row >= 2 { + display: -webkit-box; + -webkit-line-clamp: $row; + -webkit-box-orient: vertical; + word-wrap: break-word; + } +} +@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 */ +} + +.scrollbar { + height: 550px; +} + +table { + width: 100%; +} + +td.mat-cell { + padding: 6px; + position: relative; + + &.profileImage { + width: 70px; + text-overflow: unset; + flex: 0 0 auto; + + .table-item { + display: flex; + width: 70px; + min-width: 70px; + font-size: 1em; + + .presence { + transform: translateY(6px); + } + .thumbnail { + cursor: pointer; + &-mask { + display: inline-block; + width: 40px; + height: 40px; + border-radius: 50%; + overflow: hidden; + margin-right: 0; + position: relative; + img { + width: 40px; + height: auto; + background-color: #efefef; + } + } + } + .marker-mobile-state { + position: absolute; + background-color: #ffffff; + width: 20px; + height: 20px; + border-radius: 50%; + bottom: 4px; + left: 50px; + display: flex; + align-items: center; + align-content: center; + justify-content: center; + .mat-icon { + font-size: 0.9em; + width: 18px; + height: 18px; + line-height: 18px; + min-width: 18px; + min-height: 18px; + } + } + } + } + + &.profileInfo { + .baseInfo { + display: flex; + width: 200px; + min-width: 200px; + font-size: 1em; + + .name { + @include ellipsis(1); + font-size: 1em; + font-weight: 600; + } + } + } +} + +.work-status { + display: inline-block; + justify-content: center; + justify-items: center; + color: #ffffff; + height: 100%; + min-width: 32px; + margin-right: 4px; + border-radius: 24px; + flex: 0 0 auto; + font-size: 0.8em; + text-align: center; +} + +.no-search-result { + display: flex; + width: 100%; + margin-top: 40px; + justify-content: center; + justify-items: center; + font-size: 1.1em; +} diff --git a/projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.spec.ts b/projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.spec.ts new file mode 100644 index 00000000..17ac9d11 --- /dev/null +++ b/projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.spec.ts @@ -0,0 +1,24 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { DetailTableComponent } from './detail-table.component'; + +describe('Organization::DetailTableComponent', () => { + let component: DetailTableComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [DetailTableComponent] + }).compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(DetailTableComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.ts b/projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.ts new file mode 100644 index 00000000..ed5ff0b3 --- /dev/null +++ b/projects/ucap-webmessenger-ui-organization/src/lib/components/detail-table.component.ts @@ -0,0 +1,229 @@ +import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; +import { NGXLogger } from 'ngx-logger'; +import { UserInfoSS } from '@ucap-webmessenger/protocol-query'; +import { PresenceType, StatusCode } from '@ucap-webmessenger/core'; +import { + WorkStatusType, + StatusBulkInfo +} from '@ucap-webmessenger/protocol-status'; +import { Sort } from '@angular/material/sort'; + +@Component({ + selector: 'ucap-organization-detail-table', + templateUrl: './detail-table.component.html', + styleUrls: ['./detail-table.component.scss'] +}) +export class DetailTableComponent implements OnInit { + @Input() + selectedDepartmentUserInfoList: UserInfoSS[] = []; + @Input() + presence: StatusBulkInfo[]; + @Input() + profileImageRoot: string; + @Input() + selectedUserList: UserInfoSS[]; + + @Output() + openProfile = new EventEmitter(); + + sortedData: UserInfoSS[] = []; + + PresenceType = PresenceType; + displayedColumns: string[] = [ + 'profileImage', + 'profileInfo', + 'company_hpNumber', + 'workplace_lineNumber', + 'responsibilities_email', + 'checkable' + ]; + + constructor(private logger: NGXLogger) {} + + ngOnInit() { + this.sortedData = this.selectedDepartmentUserInfoList; + } + + getPresence(userInfo: UserInfoSS, type: PresenceType): string { + const presences = this.presence.filter(p => p.userSeq === userInfo.seq); + + let status: string; + let rtnClass = ''; + if (!!presences && presences.length > 0) { + const presence = presences[0]; + switch (type) { + case PresenceType.PC: + status = !!presence ? presence.pcStatus : undefined; + break; + case PresenceType.MOBILE: + status = !!presence ? presence.mobileStatus : undefined; + break; + } + + if (!!status) { + switch (status) { + case StatusCode.OnLine: + rtnClass = type + 'On'; + break; + case StatusCode.Away: + rtnClass = type + 'Out'; + break; + case StatusCode.Busy: + rtnClass = type + 'Other'; + break; + default: + rtnClass = type + 'Off'; + break; + } + } + } else { + rtnClass = type + 'Off'; + } + + return rtnClass; + } + getPresenceMsg(userInfo: UserInfoSS): string { + const presences = this.presence.filter(p => p.userSeq === userInfo.seq); + + if (!!presences && presences.length > 0) { + const presence = presences[0]; + if ( + !!presence && + !!presence.statusMessage && + presence.statusMessage !== '.' + ) { + return presence.statusMessage; + } + } + return ''; + } + 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; + } + } + + 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; + } + + sortData(sort: Sort) { + console.log(sort); + const data = this.selectedDepartmentUserInfoList.slice(); + if (!sort.active || sort.direction === '') { + this.sortedData = data; + return; + } + + this.sortedData = data.sort((a, b) => { + const isAsc = sort.direction === 'asc'; + switch (sort.active) { + case 'name': + return this.compare(a.name, b.name, isAsc); + case 'grade': + return this.compare(a.grade, b.grade, isAsc); + case 'dept': + return this.compare(a.deptName, b.deptName, isAsc); + case 'company': + return this.compare(a.companyName, b.companyName, isAsc); + case 'hpNumber': + return this.compare(a.hpNumber, b.hpNumber, isAsc); + case 'workplace': + return this.compare(a.workplace, b.workplace, isAsc); + case 'lineNumber': + return this.compare(a.lineNumber, b.lineNumber, isAsc); + case 'responsibilities': + return this.compare(a.responsibilities, b.responsibilities, isAsc); + case 'email': + return this.compare(a.email, b.email, isAsc); + default: + return 0; + } + }); + } + compare(a: number | string, b: number | string, isAsc: boolean) { + return (a < b ? -1 : 1) * (isAsc ? 1 : -1); + } + + /** 전체 체크여부 */ + getCheckedAllUser() { + // if (!this.loginRes) { + // return false; + // } + // const compareList: UserInfoSS[] = this.isShowSearch + // ? this.searchUserInfos + // : this.selectedDepartmentUserInfoList; + // if ( + // !compareList || + // compareList.length === 0 || + // compareList + // .filter(item => item.seq !== this.loginRes.userSeq) + // .filter( + // item => + // !( + // this.selectedUserList.filter(user => user.seq === item.seq) + // .length > 0 + // ) + // ).length > 0 + // ) { + // return false; + // } else { + // return true; + // } + } + /** 전체선택 이벤트 */ + onCheckAllUser(value: boolean) { + // if (!this.loginRes) { + // return false; + // } + // this.checkAllUser.emit({ + // isChecked: value, + // userInfos: (this.isShowSearch + // ? this.searchUserInfos + // : this.selectedDepartmentUserInfoList + // ).filter(user => user.seq !== this.loginRes.userSeq) + // }); + // this.changeDetectorRef.detectChanges(); + } + + onClickOpenProfile(event: MouseEvent, userSeq: number) { + event.preventDefault(); + event.stopPropagation(); + this.openProfile.emit(userSeq); + } +} diff --git a/projects/ucap-webmessenger-ui-organization/src/lib/ucap-ui-organization.module.ts b/projects/ucap-webmessenger-ui-organization/src/lib/ucap-ui-organization.module.ts index cfb173d2..8d788e20 100644 --- a/projects/ucap-webmessenger-ui-organization/src/lib/ucap-ui-organization.module.ts +++ b/projects/ucap-webmessenger-ui-organization/src/lib/ucap-ui-organization.module.ts @@ -22,9 +22,14 @@ import { UCapUiModule } from '@ucap-webmessenger/ui'; import { TenantSearchComponent } from './components/tenant-search.component'; import { TreeComponent } from './components/tree.component'; +import { DetailTableComponent } from './components/detail-table.component'; import { OrganizationService } from './services/organization.service'; +import { MatTooltipModule } from '@angular/material/tooltip'; +import { MatTableModule } from '@angular/material/table'; +import { MatSortModule } from '@angular/material/sort'; +import { MatCheckboxModule } from '@angular/material/checkbox'; -const COMPONENTS = [TenantSearchComponent, TreeComponent]; +const COMPONENTS = [TenantSearchComponent, TreeComponent, DetailTableComponent]; const SERVICES = [OrganizationService]; const DIRECTIVES = []; @@ -42,6 +47,10 @@ const DIRECTIVES = []; MatInputModule, MatSelectModule, MatTreeModule, + MatTooltipModule, + MatTableModule, + MatSortModule, + MatCheckboxModule, TranslateModule, diff --git a/projects/ucap-webmessenger-ui-organization/src/public-api.ts b/projects/ucap-webmessenger-ui-organization/src/public-api.ts index f16cc2e0..c610673e 100644 --- a/projects/ucap-webmessenger-ui-organization/src/public-api.ts +++ b/projects/ucap-webmessenger-ui-organization/src/public-api.ts @@ -1,6 +1,7 @@ /* * Public API Surface of ucap-webmessenger-ui-organization */ +export * from './lib/components/detail-table.component'; export * from './lib/components/tenant-search.component'; export * from './lib/components/tree.component'; diff --git a/projects/ucap-webmessenger-ui/src/lib/pipes/string.pipe.ts b/projects/ucap-webmessenger-ui/src/lib/pipes/string.pipe.ts index 5891bf55..ece680f1 100644 --- a/projects/ucap-webmessenger-ui/src/lib/pipes/string.pipe.ts +++ b/projects/ucap-webmessenger-ui/src/lib/pipes/string.pipe.ts @@ -3,14 +3,14 @@ import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ name: 'ucapStringEmptycheck' }) export class StringEmptyCheckPipe implements PipeTransform { transform(value: string): string { - return value.trim().length > 0 ? value.trim() : '-'; + return !!value && value.trim().length > 0 ? value.trim() : '-'; } } @Pipe({ name: 'ucapStringFormatterPhone' }) export class StringFormatterPhonePipe implements PipeTransform { transform(value: string, hidden?: boolean): string { - const num = value.trim().replace(/[-, ]/g, ''); + const num = value.replace(/[-, ]/g, ''); let formatNum = ''; if (num.length === 0) { return num;