Headless CMS and Content Managment Hub
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

60 lines
2.8 KiB

<sqx-title message="i18n:users.listPageTitle"></sqx-title>
<sqx-layout layout="main" titleText="i18n:users.listTitle" titleIcon="user-o" [width]="50">
<ng-container menu>
<div class="d-flex justify-content-end">
<button type="button" class="btn btn-text-secondary" (click)="reload()" title="i18n:users.refreshTooltip" shortcut="CTRL + B">
<i class="icon-reset"></i> {{ 'common.refresh' | sqxTranslate }}
</button>
<form class="form-inline ms-2" (ngSubmit)="search()">
<input class="form-control" [formControl]="usersFilter" placeholder="{{ 'users.search' | sqxTranslate }}"
shortcut="CTRL + SHIFT + S"
shortcutAction="focus">
</form>
<ng-container *ngIf="usersState.canCreate | async">
<button type="button" class="btn btn-success ms-2" routerLink="new" title="i18n:users.createTooltip" shortcut="CTRL + U">
<i class="icon-plus"></i> {{ 'users.create' | sqxTranslate }}
</button>
</ng-container>
</div>
</ng-container>
<ng-container>
<sqx-list-view innerWidth="50rem" [isLoading]="usersState.isLoading | async" [table]="true">
<ng-container header>
<table class="table table-items table-fixed" #header>
<thead>
<tr>
<th class="cell-user">
&nbsp;
</th>
<th class="cell-auto">
<span class="truncate">{{ 'common.name' | sqxTranslate }}</span>
</th>
<th class="cell-auto">
<span class="truncate">{{ 'common.email' | sqxTranslate }}</span>
</th>
<th class="cell-actions-lg">
<span class="truncate">{{ 'common.actions' | sqxTranslate }}</span>
</th>
</tr>
</thead>
</table>
</ng-container>
<ng-container>
<table class="table table-items table-fixed" *ngIf="usersState.users | async; let users" [sqxSyncWidth]="header">
<tbody *ngFor="let user of users; trackBy: trackByUser" [sqxUser]="user"></tbody>
</table>
</ng-container>
<ng-container footer>
<sqx-pager [paging]="usersState.paging | async" (pagingChange)="usersState.page($event)"></sqx-pager>
</ng-container>
</sqx-list-view>
</ng-container>
</sqx-layout>
<router-outlet></router-outlet>