mirror of
https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend
synced 2025-12-28 22:42:11 +01:00
108 lines
4.2 KiB
HTML
108 lines
4.2 KiB
HTML
<div class="customer-search-result-container">
|
|
<div class="filter-mode-switcher">
|
|
<lib-small-double-choice-switch
|
|
leftValue="Filtern nach"
|
|
rightValue="Treffer ohne"
|
|
(switch)="changeSelectedFilterMode($event)"
|
|
[selectedSide]="selectedFilterMode"
|
|
></lib-small-double-choice-switch>
|
|
</div>
|
|
<div class="filters" *ngIf="ds">
|
|
<app-checkbox
|
|
[option]="{ value: 'Gastkunde', disabled: false, selected: filters.guestaccount !== undefined }"
|
|
[negative]="selectedFilterMode === 1"
|
|
(valueChanges)="updateFilter($event, 'guestaccount')"
|
|
></app-checkbox>
|
|
<app-checkbox
|
|
[option]="{ value: 'Kundenkarte', disabled: false, selected: filters.bonuscard !== undefined }"
|
|
[negative]="selectedFilterMode === 1"
|
|
(valueChanges)="updateFilter($event, 'bonuscard')"
|
|
></app-checkbox>
|
|
<app-checkbox
|
|
[option]="{ value: 'Onlinekonto', disabled: false, selected: filters.onlineshop !== undefined }"
|
|
[negative]="selectedFilterMode === 1"
|
|
(valueChanges)="updateFilter($event, 'onlineshop')"
|
|
></app-checkbox>
|
|
</div>
|
|
<app-loading
|
|
*ngIf="!ds || ds.firstLoad"
|
|
[style.marginTop.px]="60"
|
|
[style.marginBottom.px]="60"
|
|
loading="true"
|
|
text="Inhalte werden geladen"
|
|
></app-loading>
|
|
<div *ngIf="ds && !ds.loading && ds.cachedData.length === 0" class="note">
|
|
<div class="new-customer-container">
|
|
<span>
|
|
Kunde nicht gefunden?
|
|
</span>
|
|
<app-button (action)="redirectToCustomerCreate()">Neue Kundendaten erfassen</app-button>
|
|
</div>
|
|
</div>
|
|
<cdk-virtual-scroll-viewport itemSize="144" #viewport
|
|
[perfectScrollbar]="{minScrollbarLength: 20}">
|
|
<div *cdkVirtualFor="let customer of ds; let i = index; let last = last" class="virtual-item">
|
|
<div class="user">
|
|
<div class="user-info-container" *ngIf="customer != null; else loadingComponent" (click)="details(customer, i)">
|
|
<div class="info">
|
|
<div class="user-info">
|
|
<div class="name-created-date">
|
|
<h1 class="user-title">{{ customer.first_name }} {{ customer.last_name }}</h1>
|
|
<span>{{ customer.created | date: 'dd.MM.yy' }}</span>
|
|
</div>
|
|
<div class="user-location">
|
|
<span class="user-label">PLZ und Wohnort</span>
|
|
<span class="user-data">{{ getCustomerDeliveryAddress(customer) }}</span>
|
|
</div>
|
|
<div class="user-email">
|
|
<span class="user-label">E-Mail</span>
|
|
<span class="user-data">{{ customer.email }}</span>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="user-actions"
|
|
[ngClass]="{ 'additional-visible': customer.customer_card || customer.shop || customer.newsletter || customer.tolino }"
|
|
></div>
|
|
</div>
|
|
<div class="additional">
|
|
<ng-container>
|
|
<div class="data" *ngFor="let features of customer.features">
|
|
<lib-icon name="Check_2" alt="check" height="11px" width="15px" pr="5px"></lib-icon>
|
|
<span>{{ features.description }}</span>
|
|
</div>
|
|
</ng-container>
|
|
</div>
|
|
</div>
|
|
<ng-template matTabContent #loadingComponent>
|
|
<div class="user-info-empty">
|
|
<div class="info">
|
|
<div class="user-info">
|
|
<h1 class="user-title">title</h1>
|
|
<div class="user-location">
|
|
<span>PLZ und Wohnort</span>
|
|
<span></span>
|
|
</div>
|
|
<div class="user-email">
|
|
<span>E-Mail</span>
|
|
<span></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</ng-template>
|
|
</div>
|
|
<div class="note" *ngIf="last">
|
|
<span class="note-text">
|
|
Hinweis: Aus Datenschutzgründen werden nur Teilinformationen dargestellt. Tab auf einen Kunden um mehr zu erfahren.
|
|
</span>
|
|
<div class="new-customer-container">
|
|
<span>
|
|
Kunde nicht gefunden?
|
|
</span>
|
|
<app-button (action)="redirectToCustomerCreate()">Neue Kundendaten erfassen</app-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</cdk-virtual-scroll-viewport>
|
|
</div>
|