feat: Implement price info card component and product categories with grid view

- Added `price-info-card.component` to display total amount, tax, and payable amount.
- Integrated price masking directive for formatted price display.
- Created `categories.component` to list product categories with loading skeletons.
- Implemented `grid-view.component` for displaying products in a grid layout.
- Enhanced `products.component` to manage category selection and product display.
- Introduced new models for product categories and stock responses.
- Updated `main.service.ts` to fetch product categories and stock data.
- Refactored `POSStore` to manage state for products, categories, and order items.
- Added utility functions for price formatting and number normalization.
- Included placeholder images for product and logo.
This commit is contained in:
2025-12-14 20:34:15 +03:30
parent 35be7e0298
commit 17fa65407c
43 changed files with 894 additions and 132 deletions
+33 -2
View File
@@ -1,9 +1,40 @@
import { Component } from '@angular/core';
import { Maybe } from '@/core';
import { JalaliDateDirective } from '@/shared/directives';
import { Component, signal } from '@angular/core';
import images from 'src/assets/images';
import { PosOrderCardComponent } from '../components/order/order-card.component';
import { PosProductsComponent } from '../components/products/products.component';
import { IPosInfoResponse } from '../models';
import { PosService } from '../services/main.service';
@Component({
selector: 'app-pos',
templateUrl: './pos.component.html',
imports: [JalaliDateDirective, PosProductsComponent, PosOrderCardComponent],
})
export class POSComponent {
constructor() {}
constructor(private service: PosService) {
this.getInfo();
}
placeholderLogo = images.placeholders.logo;
now = new Date();
inventoryId = 2;
info = signal<Maybe<IPosInfoResponse>>(null);
infoLoading = signal(true);
getInfo() {
this.infoLoading.set(true);
this.service.getInfo().subscribe({
next: (res) => {
this.info.set(res);
this.infoLoading.set(false);
},
error: () => {
this.infoLoading.set(false);
},
});
}
}