feat: Implement product categories, stores, suppliers, and users management features
- Added ProductCategoriesService for handling product category API interactions. - Created components for listing and viewing product categories. - Implemented UI for managing product categories with a data list component. - Developed StoresService for managing store-related API calls. - Created components for listing and viewing stores with appropriate UI. - Added SuppliersService for handling supplier API interactions. - Implemented components for managing suppliers with a data list component. - Developed UsersService for managing user-related API calls. - Created components for listing and viewing users with appropriate UI. - Enhanced not found page with improved layout and navigation options.
This commit is contained in:
@@ -0,0 +1,8 @@
|
||||
<p-dialog header="فرم انبار" [(visible)]="visible" [modal]="true" [style]="{ width: '500px' }" [closable]="true">
|
||||
<form [formGroup]="form" (submit)="submit()" class="flex flex-col gap-4">
|
||||
<app-input label="نام" [control]="form.controls.name" name="name" />
|
||||
<app-input label="موقعیت" [control]="form.controls.location" name="location" />
|
||||
<app-input label="فعال" [control]="form.controls.isActive" name="isActive" type="switch" />
|
||||
<app-form-footer-actions [submitLabel]="'ذخیره'" [loading]="form.disabled" (onCancel)="close()" />
|
||||
</form>
|
||||
</p-dialog>
|
||||
@@ -0,0 +1,68 @@
|
||||
import { InputComponent } from '@/shared/components';
|
||||
import { FormFooterActionsComponent } from '@/shared/components/formFooterActions/form-footer-actions.component';
|
||||
import { Component, effect, EventEmitter, inject, Input, Output, signal } from '@angular/core';
|
||||
import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
|
||||
import { Dialog } from 'primeng/dialog';
|
||||
import { IInventoryRequest, IInventoryResponse } from '../models';
|
||||
import { InventoriesService } from '../services/main.service';
|
||||
|
||||
@Component({
|
||||
selector: 'inventory-form',
|
||||
templateUrl: './form.component.html',
|
||||
imports: [ReactiveFormsModule, Dialog, InputComponent, FormFooterActionsComponent],
|
||||
})
|
||||
export class InventoryFormComponent {
|
||||
@Input() initialValues?: IInventoryResponse;
|
||||
|
||||
@Input()
|
||||
set visible(v: boolean) {
|
||||
this.visibleSignal.set(!!v);
|
||||
}
|
||||
get visible() {
|
||||
return this.visibleSignal();
|
||||
}
|
||||
private visibleSignal = signal(false);
|
||||
|
||||
@Output() visibleChange = new EventEmitter<boolean>();
|
||||
@Output() onSubmit = new EventEmitter<IInventoryResponse>();
|
||||
|
||||
private fb = inject(FormBuilder);
|
||||
constructor(private service: InventoriesService) {
|
||||
effect(() => {
|
||||
const v = this.visibleSignal();
|
||||
if (!v) this.form.reset();
|
||||
});
|
||||
}
|
||||
|
||||
form = this.fb.group({
|
||||
name: [this.initialValues?.name || null, [Validators.required]],
|
||||
location: [this.initialValues?.location || null, [Validators.required]],
|
||||
isActive: [this.initialValues?.isActive || false, [Validators.required]],
|
||||
});
|
||||
|
||||
submitLoading = signal(false);
|
||||
|
||||
submit() {
|
||||
this.form.markAllAsTouched();
|
||||
if (this.form.valid) {
|
||||
this.form.disable();
|
||||
this.submitLoading.set(true);
|
||||
this.service.create(this.form.value as IInventoryRequest).subscribe({
|
||||
next: (res) => {
|
||||
this.submitLoading.set(false);
|
||||
this.form.enable();
|
||||
this.form.reset();
|
||||
this.onSubmit.emit(res);
|
||||
},
|
||||
error: () => {
|
||||
this.submitLoading.set(false);
|
||||
this.form.enable();
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
close() {
|
||||
this.visibleChange.emit(false);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
const baseUrl = '/api/v1/inventories';
|
||||
|
||||
export const INVENTORIES_API_ROUTES = {
|
||||
list: () => `${baseUrl}`,
|
||||
single: (inventoryId: string) => `${baseUrl}/${inventoryId}`,
|
||||
};
|
||||
@@ -0,0 +1,2 @@
|
||||
export * from './apiRoutes';
|
||||
export * from './routes';
|
||||
@@ -0,0 +1,25 @@
|
||||
import { NamedRoutes } from '@/core';
|
||||
import { Routes } from '@angular/router';
|
||||
|
||||
export type TInventoriesRouteNames = 'inventories' | 'inventory';
|
||||
|
||||
export const inventoriesNamedRoutes: NamedRoutes<TInventoriesRouteNames> = {
|
||||
inventories: {
|
||||
path: 'inventories',
|
||||
loadComponent: () => import('../../views/list.component').then((m) => m.InventoriesComponent),
|
||||
meta: {
|
||||
title: 'انبارها',
|
||||
pagePath: () => '/inventories',
|
||||
},
|
||||
},
|
||||
inventory: {
|
||||
path: 'inventories/:inventoryId',
|
||||
loadComponent: () => import('../../views/single.component').then((m) => m.InventoryComponent),
|
||||
meta: {
|
||||
title: 'انبار',
|
||||
pagePath: () => '/inventories/:inventoryId',
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export const INVENTORIES_ROUTES: Routes = Object.values(inventoriesNamedRoutes);
|
||||
@@ -0,0 +1 @@
|
||||
export * from './io';
|
||||
+14
@@ -0,0 +1,14 @@
|
||||
export interface IInventoryRawResponse {
|
||||
id: number;
|
||||
name: string;
|
||||
location: string;
|
||||
isActive: boolean;
|
||||
}
|
||||
|
||||
export interface IInventoryResponse extends IInventoryRawResponse {}
|
||||
|
||||
export interface IInventoryRequest {
|
||||
name: string;
|
||||
location: string;
|
||||
isActive: boolean;
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { Injectable } from '@angular/core';
|
||||
import { Observable } from 'rxjs';
|
||||
import { INVENTORIES_API_ROUTES } from '../constants';
|
||||
import { IInventoryRawResponse, IInventoryRequest, IInventoryResponse } from '../models';
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class InventoriesService {
|
||||
constructor(private http: HttpClient) {}
|
||||
|
||||
private apiRoutes = INVENTORIES_API_ROUTES;
|
||||
|
||||
getAll(): Observable<IInventoryResponse[]> {
|
||||
return this.http.get<IInventoryRawResponse[]>(this.apiRoutes.list());
|
||||
}
|
||||
|
||||
getSingle(inventoryId: string): Observable<IInventoryResponse> {
|
||||
return this.http.get<IInventoryRawResponse>(this.apiRoutes.single(inventoryId));
|
||||
}
|
||||
|
||||
create(data: IInventoryRequest): Observable<IInventoryResponse> {
|
||||
return this.http.post<IInventoryRawResponse>(this.apiRoutes.list(), data);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,2 @@
|
||||
export * from './list.component';
|
||||
export * from './single.component';
|
||||
@@ -0,0 +1,12 @@
|
||||
<app-page-data-list
|
||||
[pageTitle]="'مدیریت انبارها'"
|
||||
[addNewCtaLabel]="'افزودن انبار جدید'"
|
||||
[columns]="columns"
|
||||
[showAdd]="true"
|
||||
emptyPlaceholderTitle="انباری یافت نشد"
|
||||
emptyPlaceholderDescription="برای افزودن انبار جدید، روی دکمهٔ بالا کلیک کنید."
|
||||
[items]="items()"
|
||||
[loading]="loading()"
|
||||
[showDetails]="true"
|
||||
>
|
||||
</app-page-data-list>
|
||||
@@ -0,0 +1,37 @@
|
||||
import {
|
||||
IColumn,
|
||||
PageDataListComponent,
|
||||
} from '@/shared/components/pageDataList/page-data-list.component';
|
||||
import { Component, signal } from '@angular/core';
|
||||
import { IInventoryResponse } from '../models';
|
||||
import { InventoriesService } from '../services/main.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-inventories',
|
||||
templateUrl: './list.component.html',
|
||||
imports: [PageDataListComponent],
|
||||
})
|
||||
export class InventoriesComponent {
|
||||
constructor(private inventoryService: InventoriesService) {
|
||||
this.getData();
|
||||
}
|
||||
|
||||
columns = [
|
||||
{ field: 'id', header: 'شناسه' },
|
||||
{ field: 'name', header: 'نام' },
|
||||
{ field: 'location', header: 'موقعیت' },
|
||||
{ field: 'isActive', header: 'فعال' },
|
||||
{ field: 'actions' },
|
||||
] as IColumn[];
|
||||
|
||||
loading = signal(false);
|
||||
items = signal<IInventoryResponse[]>([]);
|
||||
|
||||
getData() {
|
||||
this.loading.set(true);
|
||||
this.inventoryService.getAll().subscribe((res) => {
|
||||
this.loading.set(false);
|
||||
this.items.set(res);
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
<div class=""></div>
|
||||
@@ -0,0 +1,9 @@
|
||||
import { Component } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-inventory',
|
||||
templateUrl: './single.component.html',
|
||||
})
|
||||
export class InventoryComponent {
|
||||
constructor() {}
|
||||
}
|
||||
Reference in New Issue
Block a user