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.
 
 
 
 
 

141 lines
7.1 KiB

<sqx-title [message]="schema.displayName"></sqx-title>
<sqx-panel desiredWidth="*" minWidth="50rem" showSidebar="true" grid="true">
<ng-container title>
Contents
</ng-container>
<ng-container menu>
<div class="row no-gutters pl-1">
<div class="col-auto ml-8">
<sqx-shortcut keys="ctrl+shift+r" (trigger)="reload()"></sqx-shortcut>
<button type="button" class="btn btn-text-secondary" (click)="reload()" title="Refresh Contents (CTRL + SHIFT + R)">
<i class="icon-reset"></i> Refresh
</button>
</div>
<div class="col pl-1">
<sqx-search-form formClass="form" placeholder="Fulltext search"
(queryChange)="search($event)"
[query]="contentsState.contentsQuery | async"
[queries]="queries"
[queryModel]="queryModel"
[language]="languageMaster"
enableShortcut="true">
</sqx-search-form>
</div>
<div class="col-auto pl-1" *ngIf="languages.length > 1">
<sqx-language-selector class="languages-buttons" (selectedLanguageChange)="selectLanguage($event)" [languages]="languages"></sqx-language-selector>
</div>
<div class="col-auto pl-1">
<button type="button" class="btn btn-success" #newButton routerLink="new" title="New Content (CTRL + SHIFT + G)" [disabled]="(contentsState.canCreateAny | async) === false">
<i class="icon-plus"></i> New
</button>
<sqx-shortcut keys="ctrl+shift+g" (trigger)="newButton.click()"></sqx-shortcut>
</div>
</div>
</ng-container>
<ng-container content>
<ng-container *ngIf="tableView.listFields | async; let listFields">
<sqx-list-view [isLoading]="contentsState.isLoading | async" syncedHeader="true" table="true">
<ng-container topHeader>
<div class="selection" *ngIf="selectionCount > 0">
{{selectionCount}} items selected&nbsp;&nbsp;
<button type="button" class="btn btn-outline-secondary btn-status mr-1" *ngFor="let status of nextStatuses | sqxKeys" (click)="changeSelectedStatus(status)">
<sqx-content-status
[status]="status"
[statusColor]="nextStatuses[status]"
showLabel="true"
small="true">
</sqx-content-status>
</button>
<button type="button" class="btn btn-danger" *ngIf="selectionCanDelete"
(sqxConfirmClick)="deleteSelected()"
confirmTitle="Delete content"
confirmText="Do you really want to delete the selected content items?">
Delete
</button>
</div>
<div class="settings-container">
<button type="button" class="btn btn-sm settings-button" (click)="tableViewModal.toggle()" #buttonSettings>
<i class="icon-settings"></i>
</button>
<ng-container *sqxModal="tableViewModal">
<div class="dropdown-menu" [sqxAnchoredTo]="buttonSettings" @fade position="bottom-right">
<sqx-custom-view-editor
[allFields]="tableView.allFields"
(fieldNamesChange)="tableView.updateFields($event)"
[fieldNames]="tableView.listFieldNames | async">
</sqx-custom-view-editor>
</div>
</ng-container>
</div>
</ng-container>
<ng-container syncedHeader>
<table class="table table-items table-fixed" [style.minWidth]="listFields | sqxContentListWidth" #header>
<thead>
<tr>
<th class="cell-select">
<input type="checkbox" class="form-check" [ngModel]="selectedAll" (ngModelChange)="selectAll($event)" />
</th>
<th class="cell-actions cell-actions-left">
Actions
</th>
<th *ngFor="let field of listFields" [sqxContentListCell]="field">
<sqx-content-list-header
[field]="field"
(queryChange)="search($event)"
[query]="contentsState.contentsQuery | async"
[language]="language">
</sqx-content-list-header>
</th>
</tr>
</thead>
</table>
</ng-container>
<ng-container syncedContent>
<div class="table-container">
<table class="table table-items table-fixed" [style.minWidth]="listFields | sqxContentListWidth" [sqxSyncWidth]="header">
<tbody *ngFor="let content of contentsState.contents | async; trackBy: trackByContent"
[sqxContent]="content"
(delete)="delete(content)"
[selected]="isItemSelected(content)"
(selectedChange)="selectItem(content, $event)"
(statusChange)="changeStatus(content, $event)"
(clone)="clone(content)"
[canClone]="contentsState.snapshot.canCreate"
[language]="language"
[link]="[content.id]"
[listFields]="listFields">
</tbody>
</table>
</div>
</ng-container>
<ng-container footer>
<sqx-pager [pager]="contentsState.contentsPager | async" (pagerChange)="contentsState.setPager($event)"></sqx-pager>
</ng-container>
</sqx-list-view>
</ng-container>
</ng-container>
<ng-container sidebar>
<div class="panel-nav">
<a class="panel-link" routerLink="filters" routerLinkActive="active" title="Filters" titlePosition="left">
<i class="icon-filter"></i>
</a>
</div>
</ng-container>
</sqx-panel>
<router-outlet></router-outlet>
<sqx-due-time-selector #dueTimeSelector></sqx-due-time-selector>