Update uikit samples and bumped PrimeNG

This commit is contained in:
Cagatay Civici
2022-10-16 13:29:59 +03:00
parent 088e5aa1a1
commit 6769826e5b
62 changed files with 461 additions and 420 deletions
@@ -14,19 +14,19 @@
</ng-template>
<ng-template pTemplate="header">
<tr>
<th>
<th style="min-width: 12rem">
<div class="flex justify-content-between align-items-center">
Name
<p-columnFilter type="text" field="name" display="menu" placeholder="Search by name"></p-columnFilter>
</div>
</th>
<th>
<th style="min-width: 12rem">
<div class="flex justify-content-between align-items-center">
Country
<p-columnFilter type="text" field="country.name" display="menu" placeholder="Search by country"></p-columnFilter>
</div>
</th>
<th>
<th style="min-width: 14rem">
<div class="flex justify-content-between align-items-center">
Agent
<p-columnFilter field="representative" matchMode="in" display="menu" [showMatchModes]="false" [showOperator]="false" [showAddButton]="false">
@@ -48,19 +48,19 @@
</p-columnFilter>
</div>
</th>
<th>
<th style="min-width: 10rem">
<div class="flex justify-content-between align-items-center">
Date
<p-columnFilter type="date" field="date" display="menu" placeholder="mm/dd/yyyy"></p-columnFilter>
</div>
</th>
<th>
<th style="min-width: 10rem">
<div class="flex justify-content-between align-items-center">
Balance
<p-columnFilter type="numeric" field="balance" display="menu" currency="USD"></p-columnFilter>
</div>
</th>
<th>
<th style="min-width: 12rem">
<div class="flex justify-content-between align-items-center">
Status
<p-columnFilter field="status" matchMode="equals" display="menu">
@@ -74,7 +74,7 @@
</p-columnFilter>
</div>
</th>
<th>
<th style="min-width: 12rem">
<div class="flex justify-content-between align-items-center">
Activity
<p-columnFilter field="activity" matchMode="between" display="menu" [showMatchModes]="false" [showOperator]="false" [showAddButton]="false">
@@ -88,7 +88,7 @@
</p-columnFilter>
</div>
</th>
<th style="width: 8rem">
<th style="min-width: 8rem">
<div class="flex justify-content-between align-items-center">
Verified
<p-columnFilter type="boolean" field="verified" display="menu"></p-columnFilter>
@@ -98,30 +98,30 @@
</ng-template>
<ng-template pTemplate="body" let-customer>
<tr>
<td style="min-width: 12rem;">
<td>
{{customer.name}}
</td>
<td style="min-width: 12rem;">
<td>
<img src="assets/demo/images/flag/flag_placeholder.png" [class]="'flag flag-' + customer.country.code" width="30">
<span class="image-text ml-2">{{customer.country.name}}</span>
</td>
<td style="min-width: 14rem;">
<td>
<img [alt]="customer.representative.name" src="assets/demo/images/avatar/{{customer.representative.image}}" width="32" style="vertical-align: middle"/>
<span class="image-text ml-2">{{customer.representative.name}}</span>
</td>
<td style="min-width: 10rem;">
<td>
{{customer.date | date: 'MM/dd/yyyy'}}
</td>
<td style="min-width: 10rem;">
<td>
{{customer.balance | currency:'USD':'symbol'}}
</td>
<td style="min-width: 12rem;">
<td>
<span [class]="'customer-badge status-' + customer.status">{{customer.status}}</span>
</td>
<td style="min-width: 12rem; ">
<td>
<p-progressBar [value]="customer.activity" [showValue]="false" [style]="{'height': '0.5rem'}"></p-progressBar>
</td>
<td class="text-center" style="min-width: 8rem;">
<td class="text-center">
<i class="pi" [ngClass]="{'true-icon pi-check-circle text-green-500': customer.verified, 'false-icon pi-times-circle text-pink-500': !customer.verified}"></i>
</td>
</tr>