vendure/admin-ui/src/app/customer/components/customer-list/customer-list.component.html

<vdr-action-bar>
    <vdr-ab-right>
        <a class="btn btn-primary" [routerLink]="['./create']">
            <clr-icon shape="plus"></clr-icon>
            {{ 'customer.create-new-customer' | translate }}
        </a>
    </vdr-ab-right>
</vdr-action-bar>

<vdr-data-table
    [items]="items$ | async"
    [itemsPerPage]="itemsPerPage$ | async"
    [totalItems]="totalItems$ | async"
    [currentPage]="currentPage$ | async"
    (pageChange)="setPageNumber($event)"
    (itemsPerPageChange)="setItemsPerPage($event)"
>
    <vdr-dt-column>{{ 'common.ID' | translate }}</vdr-dt-column>
    <vdr-dt-column [expand]="true">{{ 'customer.name' | translate }}</vdr-dt-column>
    <vdr-dt-column [expand]="true">{{ 'customer.email-address' | translate }}</vdr-dt-column>
    <vdr-dt-column>{{ 'customer.customer-type' | translate }}</vdr-dt-column>
    <vdr-dt-column></vdr-dt-column>
    <ng-template let-customer="item">
        <td class="left align-middle">{{ customer.id }}</td>
        <td class="left align-middle">
            {{ customer.title }} {{ customer.firstName }} {{ customer.lastName }}
        </td>
        <td class="left align-middle">{{ customer.emailAddress }}</td>
        <td class="left align-middle">
            <vdr-customer-status-label [customer]="customer"></vdr-customer-status-label>
        </td>
        <td class="right align-middle">
            <vdr-table-row-action
                iconShape="edit"
                [label]="'common.edit' | translate"
                [linkTo]="['./', customer.id]"
            ></vdr-table-row-action>
        </td>
    </ng-template>
</vdr-data-table>