통합검색 - 수정중
This commit is contained in:
khk
parent
d0a1c0f3ee
commit
556c7c5ad3
|
|
@ -19,7 +19,7 @@
|
||||||
(search)="onSearch($event)"
|
(search)="onSearch($event)"
|
||||||
>
|
>
|
||||||
</ucap-integrated-search-form>
|
</ucap-integrated-search-form>
|
||||||
<div class="organization-option">
|
<div class="organization-option selectbox">
|
||||||
<mat-form-field>
|
<mat-form-field>
|
||||||
<mat-label>{{ 'search.fieldCompany' | translate }}</mat-label>
|
<mat-label>{{ 'search.fieldCompany' | translate }}</mat-label>
|
||||||
<mat-select
|
<mat-select
|
||||||
|
|
@ -137,112 +137,113 @@
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="position: relative;">
|
<div class="content-area">
|
||||||
<div
|
<div
|
||||||
*ngIf="searchingProcessing$ | async"
|
*ngIf="searchingProcessing$ | async"
|
||||||
style="position: absolute; width: 100%; z-index: 101;"
|
style="position: absolute; width: 100%; z-index: 101;"
|
||||||
>
|
>
|
||||||
<mat-progress-bar mode="indeterminate"></mat-progress-bar>
|
<mat-progress-bar mode="indeterminate"></mat-progress-bar>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<div class="contents-table">
|
|
||||||
<div fxFlex="0 0 auto" class="table-box">
|
|
||||||
<ucap-organization-detail-table
|
|
||||||
[loginRes]="loginRes"
|
|
||||||
[presence$]="presenceSubject.asObservable()"
|
|
||||||
[departmentUserInfoList]="departmentUserInfoList"
|
|
||||||
[profileImageRoot]="profileImageRoot"
|
|
||||||
[selectedUserList]="selectedUserList"
|
|
||||||
(openProfile)="onClickOpenProfile($event)"
|
|
||||||
(toggleAllUser)="onToggleAllUser($event)"
|
|
||||||
(toggleUser)="onToggleUser($event)"
|
|
||||||
(sendCall)="onClickCall($event)"
|
|
||||||
class="integrate-search-org detail-table"
|
|
||||||
></ucap-organization-detail-table>
|
|
||||||
</div>
|
|
||||||
<div class="footer-fix search-result-footer">
|
|
||||||
<mat-accordion>
|
|
||||||
<mat-expansion-panel>
|
|
||||||
<mat-expansion-panel-header>
|
|
||||||
<mat-panel-title>
|
|
||||||
{{ 'organization.selectedUser' | translate }}
|
|
||||||
<span *ngIf="selectedUserList.length > 0">
|
|
||||||
({{ selectedUserList.length }})
|
|
||||||
{{ 'common.units.persons' | translate }}
|
|
||||||
</span>
|
|
||||||
</mat-panel-title>
|
|
||||||
<mat-panel-description> </mat-panel-description>
|
|
||||||
</mat-expansion-panel-header>
|
|
||||||
|
|
||||||
<div class="list-chip">
|
<div class="contents-table" fxFlex="1 1 100%" fxLayout="column">
|
||||||
<mat-chip-list aria-label="User selection">
|
<div class="table-box">
|
||||||
<mat-chip
|
<ucap-organization-detail-table
|
||||||
*ngFor="let userInfo of selectedUserList"
|
[loginRes]="loginRes"
|
||||||
(removed)="onClickDeleteUser(userInfo)"
|
[presence$]="presenceSubject.asObservable()"
|
||||||
>
|
[departmentUserInfoList]="departmentUserInfoList"
|
||||||
{{ userInfo.name }}
|
[profileImageRoot]="profileImageRoot"
|
||||||
<mat-icon matChipRemove>clear</mat-icon>
|
[selectedUserList]="selectedUserList"
|
||||||
</mat-chip>
|
(openProfile)="onClickOpenProfile($event)"
|
||||||
</mat-chip-list>
|
(toggleAllUser)="onToggleAllUser($event)"
|
||||||
</div>
|
(toggleUser)="onToggleUser($event)"
|
||||||
<div class="btn-box">
|
(sendCall)="onClickCall($event)"
|
||||||
<ul>
|
class="integrate-search-org detail-table"
|
||||||
<li>
|
></ucap-organization-detail-table>
|
||||||
<button
|
</div>
|
||||||
mat-flat-button
|
<div class="footer-fix search-result-footer">
|
||||||
[disabled]="
|
<mat-accordion>
|
||||||
selectedUserList.length > 0 ? 'false' : 'true'
|
<mat-expansion-panel>
|
||||||
"
|
<mat-expansion-panel-header>
|
||||||
(click)="onClickAddGroup()"
|
<mat-panel-title>
|
||||||
class="mat-primary"
|
{{ 'organization.selectedUser' | translate }}
|
||||||
|
<span *ngIf="selectedUserList.length > 0">
|
||||||
|
({{ selectedUserList.length }})
|
||||||
|
{{ 'common.units.persons' | translate }}
|
||||||
|
</span>
|
||||||
|
</mat-panel-title>
|
||||||
|
<mat-panel-description> </mat-panel-description>
|
||||||
|
</mat-expansion-panel-header>
|
||||||
|
|
||||||
|
<div class="list-chip">
|
||||||
|
<mat-chip-list aria-label="User selection">
|
||||||
|
<mat-chip
|
||||||
|
*ngFor="let userInfo of selectedUserList"
|
||||||
|
(removed)="onClickDeleteUser(userInfo)"
|
||||||
>
|
>
|
||||||
{{ 'organization.addToGroup' | translate }}
|
{{ userInfo.name }}
|
||||||
</button>
|
<mat-icon matChipRemove>clear</mat-icon>
|
||||||
</li>
|
</mat-chip>
|
||||||
<li>
|
</mat-chip-list>
|
||||||
<button
|
</div>
|
||||||
mat-flat-button
|
<div class="btn-box">
|
||||||
[disabled]="
|
<ul>
|
||||||
selectedUserList.length > 0 ? 'false' : 'true'
|
<li>
|
||||||
"
|
<button
|
||||||
(click)="onClickChatOpen()"
|
mat-flat-button
|
||||||
class="mat-primary"
|
[disabled]="
|
||||||
>
|
selectedUserList.length > 0 ? 'false' : 'true'
|
||||||
{{ 'organization.startChat' | translate }}
|
"
|
||||||
</button>
|
(click)="onClickAddGroup()"
|
||||||
</li>
|
class="mat-primary"
|
||||||
<li *ngIf="!!authInfo && authInfo.canVideoConference">
|
>
|
||||||
<button
|
{{ 'organization.addToGroup' | translate }}
|
||||||
mat-flat-button
|
</button>
|
||||||
[disabled]="
|
</li>
|
||||||
selectedUserList.length > 0 ? 'false' : 'true'
|
<li>
|
||||||
"
|
<button
|
||||||
(click)="onClickConference()"
|
mat-flat-button
|
||||||
class="mat-primary"
|
[disabled]="
|
||||||
>
|
selectedUserList.length > 0 ? 'false' : 'true'
|
||||||
{{ 'organization.startVideoConference' | translate }}
|
"
|
||||||
</button>
|
(click)="onClickChatOpen()"
|
||||||
</li>
|
class="mat-primary"
|
||||||
<li>
|
>
|
||||||
<button
|
{{ 'organization.startChat' | translate }}
|
||||||
mat-flat-button
|
</button>
|
||||||
[disabled]="
|
</li>
|
||||||
selectedUserList.length > 0 ? 'false' : 'true'
|
<li *ngIf="!!authInfo && authInfo.canVideoConference">
|
||||||
"
|
<button
|
||||||
(click)="onClickMessage()"
|
mat-flat-button
|
||||||
class="mat-primary"
|
[disabled]="
|
||||||
>
|
selectedUserList.length > 0 ? 'false' : 'true'
|
||||||
{{ 'organization.startMessage' | translate }}
|
"
|
||||||
</button>
|
(click)="onClickConference()"
|
||||||
</li>
|
class="mat-primary"
|
||||||
</ul>
|
>
|
||||||
</div>
|
{{ 'organization.startVideoConference' | translate }}
|
||||||
</mat-expansion-panel>
|
</button>
|
||||||
</mat-accordion>
|
</li>
|
||||||
|
<li>
|
||||||
|
<button
|
||||||
|
mat-flat-button
|
||||||
|
[disabled]="
|
||||||
|
selectedUserList.length > 0 ? 'false' : 'true'
|
||||||
|
"
|
||||||
|
(click)="onClickMessage()"
|
||||||
|
class="mat-primary"
|
||||||
|
>
|
||||||
|
{{ 'organization.startMessage' | translate }}
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</mat-expansion-panel>
|
||||||
|
</mat-accordion>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="footer-fix search-result-footer">
|
<div class="btn-box">
|
||||||
<ul>
|
<ul class="">
|
||||||
<li>
|
<li>
|
||||||
<button mat-flat-button (click)="onCancel()" class="mat-primary">
|
<button mat-flat-button (click)="onCancel()" class="mat-primary">
|
||||||
{{ 'search.clearAndColse' | translate }}
|
{{ 'search.clearAndColse' | translate }}
|
||||||
|
|
|
||||||
|
|
@ -10,3 +10,59 @@
|
||||||
color: #444444;
|
color: #444444;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
ucap-integrated-search-form {
|
||||||
|
position: relative;
|
||||||
|
display: inline-flex;
|
||||||
|
.search-container {
|
||||||
|
width: 20%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.organization-option {
|
||||||
|
position: relative;
|
||||||
|
display: inline-flex;
|
||||||
|
width: 70%;
|
||||||
|
}
|
||||||
|
.content-area {
|
||||||
|
display: flex;
|
||||||
|
height: calc(100% - 140px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.contents-table {
|
||||||
|
position: relative;
|
||||||
|
flex-direction: column;
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
|
flex: 1 1 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
.table-box {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: calc(100% - 60px);
|
||||||
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.footer-fix {
|
||||||
|
display: flex;
|
||||||
|
flex: 1 1 auto;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
flex-direction: column;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.btn-box {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
bottom: 0;
|
||||||
|
ul {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: row;
|
||||||
|
li {
|
||||||
|
display: inline-flex;
|
||||||
|
margin-left: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -118,3 +118,16 @@ $search-font-size: 14px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.search-area {
|
||||||
|
.selectbox {
|
||||||
|
display: inline-flex;
|
||||||
|
width: 70%;
|
||||||
|
padding-left: 20px;
|
||||||
|
line-height: 1.4em;
|
||||||
|
.mat-form-field {
|
||||||
|
font-size: 0.88rem;
|
||||||
|
color: #333333;
|
||||||
|
flex: 1 1 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user