diff --git a/src/views/uikit/listdoc.ts b/src/views/uikit/listdoc.ts new file mode 100644 index 0000000..430a727 --- /dev/null +++ b/src/views/uikit/listdoc.ts @@ -0,0 +1,220 @@ +import { Component } from '@angular/core'; +import { ProductService } from '@/src/app/demo/service/product.service'; +import { Product } from '@/src/app/demo/api/product'; +import { FormsModule } from '@angular/forms'; +import { DataViewModule } from 'primeng/dataview'; +import { CommonModule } from '@angular/common'; +import { SelectButtonModule } from 'primeng/selectbutton'; +import { PickListModule } from 'primeng/picklist'; +import { OrderListModule } from 'primeng/orderlist'; +import { TagModule } from 'primeng/tag'; +import { ButtonModule } from 'primeng/button'; + +@Component({ + standalone:true, + imports: [CommonModule, DataViewModule, FormsModule, SelectButtonModule, PickListModule, OrderListModule, TagModule, ButtonModule], + template: ` +
+
+
DataView
+ + +
+ + + + + +
+ + + +
+
+
+
+ + +
+
+
+
+ {{ item.category }} +
{{ item.name }}
+
+
+
+ {{ item.rating }} + +
+
+
+
+ {{ item.price }} +
+ + +
+
+
+
+
+
+ + + +
+
+ class="col-span-12 sm:col-span-6 lg:col-span-4 p-2"> +
+
+
+ + +
+
+
+
+
+ {{ item.category }} +
{{ item.name }}
+
+
+
+ {{ item.rating }} + +
+
+
+
+ {{ item.price }} +
+ + +
+
+
+
+
+
+ + +
+ +
+
+
+
PickList
+ + + {{ item.name }} + + +
+
+ +
+
+
OrderList
+ + +
{{ city.name }}
+ + +
+
+
+
`, +}) +export class ListDoc { + + layout: 'list' | 'grid' = 'list'; + + options = ['list', 'grid']; + + products: Product[] = []; + + sourceCities: any[] = []; + + targetCities: any[] = []; + + orderCities: any[] = []; + + constructor(private productService: ProductService) { } + + ngOnInit() { + this.productService.getProducts().then(data => this.products = data); + + this.sourceCities = [ + { name: 'San Francisco', code: 'SF' }, + { name: 'London', code: 'LDN' }, + { name: 'Paris', code: 'PRS' }, + { name: 'Istanbul', code: 'IST' }, + { name: 'Berlin', code: 'BRL' }, + { name: 'Barcelona', code: 'BRC' }, + { name: 'Rome', code: 'RM' }]; + + this.targetCities = []; + + this.orderCities = [ + { name: 'San Francisco', code: 'SF' }, + { name: 'London', code: 'LDN' }, + { name: 'Paris', code: 'PRS' }, + { name: 'Istanbul', code: 'IST' }, + { name: 'Berlin', code: 'BRL' }, + { name: 'Barcelona', code: 'BRC' }, + { name: 'Rome', code: 'RM' }]; + + } + + + getSeverity(product) { + switch (product.inventoryStatus) { + case 'INSTOCK': + return 'success'; + + case 'LOWSTOCK': + return 'warn'; + + case 'OUTOFSTOCK': + return 'danger'; + + default: + return null; + } + } +}