Merge pull request #4485 from tsiegleauq/user-detail-template-fixes
User detail template fixes
This commit is contained in:
commit
1ecc7f4baa
@ -14,8 +14,18 @@
|
||||
.toolbar-left {
|
||||
display: contents;
|
||||
.toolbar-left-text {
|
||||
display: initial;
|
||||
margin-left: 10px;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
::ng-deep .title-slot {
|
||||
h2 {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.toolbar-centered {
|
||||
|
@ -73,7 +73,11 @@
|
||||
<span translate>List of speakers</span>
|
||||
</button>
|
||||
<!-- Project -->
|
||||
<os-projector-button [object]="motion" [menuItem]="true" *osPerms="'core.can_manage_projector'"></os-projector-button>
|
||||
<os-projector-button
|
||||
[object]="motion"
|
||||
[menuItem]="true"
|
||||
*osPerms="'core.can_manage_projector'"
|
||||
></os-projector-button>
|
||||
<!-- New amendment -->
|
||||
<button mat-menu-item (click)="createAmendment()" *ngIf="perms.isAllowed('can_create_amendments', motion)">
|
||||
<mat-icon>add</mat-icon>
|
||||
@ -360,7 +364,9 @@
|
||||
<!-- Make the whole container a trigger to prevent unexpected menu behavior -->
|
||||
<div [matMenuTriggerFor]="tagMenu">
|
||||
<!-- No selected tags -->
|
||||
<mat-basic-chip *ngIf="!motion.hasTags()" class="grey" disabled disableRipple> {{ '–' }} </mat-basic-chip>
|
||||
<mat-basic-chip *ngIf="!motion.hasTags()" class="grey" disabled disableRipple>
|
||||
{{ '–' }}
|
||||
</mat-basic-chip>
|
||||
|
||||
<!-- Display a chip list of tags -->
|
||||
<mat-chip-list class="mat-chip-list-stacked">
|
||||
@ -374,7 +380,9 @@
|
||||
<!-- For non privileged users -->
|
||||
<div *ngIf="!perms.isAllowed('change_metadata', motion)">
|
||||
<mat-chip-list class="mat-chip-list-stacked">
|
||||
<mat-basic-chip *ngFor="let tag of motion.tags" class="grey" disableRipple> {{ tag }} </mat-basic-chip>
|
||||
<mat-basic-chip *ngFor="let tag of motion.tags" class="grey" disableRipple>
|
||||
{{ tag }}
|
||||
</mat-basic-chip>
|
||||
</mat-chip-list>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -42,12 +42,11 @@
|
||||
</os-head-bar>
|
||||
|
||||
<mat-card [ngClass]="editUser ? 'os-form-card' : 'os-card'" *ngIf="isAllowed('seeName')">
|
||||
<form
|
||||
[ngClass]="{ 'mat-form-field-enabled': editUser }"
|
||||
[formGroup]="personalInfoForm"
|
||||
*ngIf="user"
|
||||
(keydown)="onKeyDown($event)"
|
||||
>
|
||||
<ng-container *ngIf="editUser; then editView; else showView"></ng-container>
|
||||
</mat-card>
|
||||
|
||||
<ng-template #editView>
|
||||
<form [formGroup]="personalInfoForm" *ngIf="user" (keydown)="onKeyDown($event)">
|
||||
<div *ngIf="isAllowed('seeName')">
|
||||
<!-- Title -->
|
||||
<mat-form-field
|
||||
@ -177,7 +176,6 @@
|
||||
<!-- The HTML Editor -->
|
||||
<h4 translate *ngIf="user.about_me || editUser">About me</h4>
|
||||
<editor formControlName="about_me" [init]="tinyMceSettings" *ngIf="editUser"></editor>
|
||||
<div *ngIf="user.about_me && !editUser" [innerHTML]="sanitizedText(user.about_me)"></div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="isAllowed('seePersonal')">
|
||||
@ -239,4 +237,77 @@
|
||||
</mat-checkbox>
|
||||
</div>
|
||||
</form>
|
||||
</mat-card>
|
||||
</ng-template>
|
||||
|
||||
<ng-template #showView>
|
||||
<!-- User name -->
|
||||
<div *ngIf="isAllowed('seeName')">
|
||||
<h4 translate>Name</h4>
|
||||
<span>{{ user.short_name }}</span>
|
||||
</div>
|
||||
|
||||
<div *ngIf="isAllowed('seePersonal')">
|
||||
<!-- Mail -->
|
||||
<div *ngIf="user.email">
|
||||
<h4 translate>Email</h4>
|
||||
<span>{{ user.email }}</span>
|
||||
</div>
|
||||
|
||||
<!-- Gender -->
|
||||
<div *ngIf="user.gender">
|
||||
<h4 translate>Gender</h4>
|
||||
<span>{{ user.gender | translate }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Structure Level -->
|
||||
<div *ngIf="user.structure_level">
|
||||
<h4 translate>Structure level</h4>
|
||||
<span>{{ user.structure_level }}</span>
|
||||
</div>
|
||||
|
||||
<!-- Participant number -->
|
||||
<div *ngIf="user.number">
|
||||
<h4 translate>Participant number</h4>
|
||||
<span>{{ user.number }}</span>
|
||||
</div>
|
||||
|
||||
<!-- Groups -->
|
||||
<div *ngIf="user.groups && user.groups.length > 0">
|
||||
<h4 translate>Groups</h4>
|
||||
<span *ngFor="let group of user.groups; let last = last">
|
||||
{{ group.getTitle() | translate }}
|
||||
<span *ngIf="!last">, </span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div *ngIf="isAllowed('manage')">
|
||||
<!-- Initial Password -->
|
||||
<div *ngIf="user.default_password">
|
||||
<h4 translate>Initial password</h4>
|
||||
<span>{{ user.default_password }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="isAllowed('seePersonal')">
|
||||
<!-- About me -->
|
||||
<div *ngIf="user.about_me">
|
||||
<h4 translate>About me</h4>
|
||||
<div [innerHTML]="sanitizedText(user.about_me)"></div>
|
||||
</div>
|
||||
|
||||
<!-- Username -->
|
||||
<div *ngIf="user.username">
|
||||
<h4 translate>Username</h4>
|
||||
<span>{{ user.username }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="isAllowed('seeExtra')">
|
||||
<!-- Comment -->
|
||||
<div *ngIf="user.comment">
|
||||
<h4 translate>Comment</h4>
|
||||
<span>{{ user.comment }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
@ -1,65 +1,33 @@
|
||||
// hide certain stuff whem editing is disabled
|
||||
.mat-form-field-disabled {
|
||||
.form70 {
|
||||
::ng-deep {
|
||||
.mat-input-element {
|
||||
color: currentColor;
|
||||
}
|
||||
|
||||
.mat-select-value {
|
||||
color: currentColor;
|
||||
}
|
||||
|
||||
.mat-form-field-underline {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mat-hint {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mat-select-value {
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
button {
|
||||
display: none;
|
||||
}
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
// angular material does not have this class. This is virtually set using ngClass
|
||||
.mat-form-field-enabled {
|
||||
.form70 {
|
||||
::ng-deep {
|
||||
width: 70%;
|
||||
}
|
||||
.form37 {
|
||||
::ng-deep {
|
||||
width: 37%;
|
||||
}
|
||||
}
|
||||
|
||||
.form37 {
|
||||
::ng-deep {
|
||||
width: 37%;
|
||||
}
|
||||
.form25 {
|
||||
::ng-deep {
|
||||
width: 25%;
|
||||
}
|
||||
}
|
||||
|
||||
.form25 {
|
||||
::ng-deep {
|
||||
width: 25%;
|
||||
}
|
||||
.form16 {
|
||||
::ng-deep {
|
||||
width: 16%;
|
||||
}
|
||||
}
|
||||
|
||||
.form16 {
|
||||
::ng-deep {
|
||||
width: 16%;
|
||||
}
|
||||
}
|
||||
.force-min-with {
|
||||
min-width: 110px;
|
||||
}
|
||||
|
||||
.force-min-with {
|
||||
min-width: 110px;
|
||||
}
|
||||
|
||||
.distance {
|
||||
padding-right: 5%;
|
||||
}
|
||||
.distance {
|
||||
padding-right: 5%;
|
||||
}
|
||||
|
||||
mat-checkbox {
|
||||
|
Loading…
Reference in New Issue
Block a user