forked from EVOgeek/Vmeda.Online
80 lines
4.2 KiB
HTML
80 lines
4.2 KiB
HTML
<ion-header>
|
|
<ion-toolbar>
|
|
<ion-buttons slot="start">
|
|
<ion-back-button [text]="'core.back' | translate" />
|
|
</ion-buttons>
|
|
<ion-title>
|
|
<h1>{{ 'addon.messages.searchcombined' | translate }}</h1>
|
|
</ion-title>
|
|
<ion-buttons slot="end">
|
|
<!-- Add an empty context menu so split view pages can add items, otherwise the menu disappears in some cases. -->
|
|
<core-context-menu />
|
|
</ion-buttons>
|
|
</ion-toolbar>
|
|
</ion-header>
|
|
<ion-content>
|
|
<core-split-view>
|
|
<core-search-box (onSubmit)="search($event)" (onClear)="clearSearch()" [disabled]="disableSearch" autocorrect="off"
|
|
[spellcheck]="false" [autoFocus]="true" [lengthCheck]="1" searchArea="AddonMessagesSearch" />
|
|
|
|
<core-loading [hideUntil]="!displaySearching" [message]="'core.searching' | translate">
|
|
<ion-list *ngIf="displayResults">
|
|
<ng-container *ngTemplateOutlet="resultsTemplate; context: {item: contacts}" />
|
|
<ng-container *ngTemplateOutlet="resultsTemplate; context: {item: nonContacts}" />
|
|
<ng-container *ngTemplateOutlet="resultsTemplate; context: {item: messages}" />
|
|
<!-- The infinite loading cannot be inside the ng-template, it fails because it doesn't find ion-content. -->
|
|
<core-infinite-loading [enabled]="messages.canLoadMore" (action)="search(query, 'messages', $event)"
|
|
[error]="messages.loadMoreError" />
|
|
</ion-list>
|
|
|
|
<core-empty-box *ngIf="displayResults && !contacts.results.length && !nonContacts.results.length && !messages.results.length"
|
|
icon="fas-magnifying-glass" [message]="'core.noresults' | translate" />
|
|
</core-loading>
|
|
</core-split-view>
|
|
</ion-content>
|
|
|
|
<!-- Template to render a list of results -->
|
|
<ng-template #resultsTemplate let-item="item">
|
|
<ng-container *ngIf="item.results.length > 0">
|
|
<ion-item-divider class="ion-text-wrap">
|
|
<ion-label>
|
|
<h2>{{ item.titleString | translate }}</h2>
|
|
</ion-label>
|
|
</ion-item-divider>
|
|
|
|
<!-- List of results -->
|
|
<ion-item class="addon-message-discussion ion-text-wrap" *ngFor="let result of item.results" [attr.aria-label]="result.fullname"
|
|
(click)="openConversation(result)" [attr.aria-current]="result === selectedResult ? 'page' : 'false'" [detail]="true" button>
|
|
<core-user-avatar slot="start" [user]="result" [checkOnline]="true" [linkProfile]="false" />
|
|
<ion-label>
|
|
<p class="item-heading">
|
|
<core-format-text [text]="result.fullname" [highlight]="result.highlightName" [filter]="false" />
|
|
<ion-icon name="fas-ban" *ngIf="result.isblocked" [attr.aria-label]="'addon.messages.contactblocked' | translate" />
|
|
</p>
|
|
<ion-note *ngIf="result.lastmessagedate > 0">
|
|
{{result.lastmessagedate | coreDateDayOrTime}}
|
|
</ion-note>
|
|
<p class="addon-message-last-message">
|
|
<span *ngIf="result.sentfromcurrentuser" class="addon-message-last-message-user">
|
|
{{ 'addon.messages.you' | translate }}
|
|
</span>
|
|
<core-format-text clean="true" singleLine="true" [text]="result.lastmessage" [highlight]="result.highlightMessage"
|
|
contextLevel="system" [contextInstanceId]="0" class="addon-message-last-message-text" />
|
|
</p>
|
|
</ion-label>
|
|
</ion-item>
|
|
|
|
<!-- Load more button for contacts and non-contacts -->
|
|
<ng-container *ngIf="item.type !== 'messages'">
|
|
<div class="ion-padding-horizontal" *ngIf="item.canLoadMore && !item.loadingMore">
|
|
<ion-button expand="block" fill="outline" (click)="search(query, item.type)">
|
|
{{ 'core.loadmore' | translate }}
|
|
</ion-button>
|
|
</div>
|
|
<div *ngIf="item.loadingMore" class="ion-padding ion-text-center">
|
|
<ion-spinner [attr.aria-label]="'core.loading' | translate" />
|
|
</div>
|
|
</ng-container>
|
|
</ng-container>
|
|
</ng-template>
|