carloshra/nexus-spa
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix list demos

Browse Source
This commit is contained in:
Çetin
2025-01-06 15:53:22 +03:00
parent 6d9dff0075
commit af661fce3a
1 changed files with 19 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/views/uikit/listdoc.ts
View File

@@ -21,8 +21,8 @@ import { Product, ProductService } from '@/src/service/product.service';
<ng-template #header>
<div class="flex justify-end">
<p-select-button [(ngModel)]="layout" [options]="options" [allowEmpty]="false">
<ng-template #option let-option>
<i [ngClass]="{'pi pi-bars': option === 'list', 'pi pi-table': option === 'grid'}"></i>
<ng-template #item let-option>
<i class="pi " [ngClass]="{'pi-bars': option === 'list', 'pi-table': option === 'grid'}"></i>
</ng-template>
</p-select-button>
</div>
@@ -64,9 +64,9 @@ import { Product, ProductService } from '@/src/service/product.service';
</div>
</div>
<div class="flex flex-col md:items-end gap-20">
<span class="text-xl font-semibold">{{ item.price }}</span>
<span class="text-xl font-semibold">$ {{ item.price }}</span>
<div class="flex flex-row-reverse md:flex-row gap-2">
<p-button icon="pi pi-heart" [outlined]="true"></p-button>
<p-button icon="pi pi-heart" styleClass="h-full" [outlined]="true"></p-button>
<p-button icon="pi pi-shopping-cart" label="Buy Now"
[disabled]="item.inventoryStatus === 'OUTOFSTOCK'"
styleClass="flex-auto md:flex-initial whitespace-nowrap"></p-button>
@@ -118,12 +118,12 @@ import { Product, ProductService } from '@/src/service/product.service';
</div>
</div>
<div class="flex flex-col gap-6 mt-6">
<span class="text-2xl font-semibold">{{ item.price }}</span>
<span class="text-2xl font-semibold">$ {{ item.price }}</span>
<div class="flex gap-2">
<p-button icon="pi pi-shopping-cart" label="Buy Now"
[disabled]="item.inventoryStatus === 'OUTOFSTOCK'"
class="flex-auto whitespace-nowrap"></p-button>
<p-button icon="pi pi-heart" [outlined]="true"></p-button>
<p-button icon="pi pi-heart" styleClass="h-full" [outlined]="true"></p-button>
</div>
</div>
</div>
@@ -137,7 +137,7 @@ import { Product, ProductService } from '@/src/service/product.service';
<div class="flex flex-col lg:flex-row gap-20">
<div class="lg:w-2/3">
<div class="card">
<div class="font-semibold text-xl mb-6">PickList</div>
<div class="font-semibold text-xl mb-4">PickList</div>
<p-pick-list [source]="sourceCities" [target]="targetCities" breakpoint="1400px">
<ng-template #item let-item>
{{ item.name }}
@@ -148,17 +148,23 @@ import { Product, ProductService } from '@/src/service/product.service';
<div class="lg:w-1/3">
<div class="card">
<div class="font-semibold text-xl mb-6">OrderList</div>
<p-orderList [value]="orderCities" header="Cities" [dragdrop]="true"
[listStyle]="{'height':'250px'}">
<ng-template #item let-city>
<div>{{ city.name }}</div>
<div class="font-semibold text-xl mb-4">OrderList</div>
<p-orderlist [value]="orderCities" dataKey="id" breakpoint="575px">
<ng-template #option let-option>
{{ option.name }}
</ng-template>
</p-orderList>
</p-orderlist>
</div>
</div>
</div>
</div>`,
styles: `
::ng-deep {
.p-orderlist-list-container{
width: 100%;
}
}
`,
providers: [ProductService]
})
export class ListDoc {