commit
This commit is contained in:
@@ -0,0 +1,327 @@
|
||||
import { SubsidiaryDTO } from './../../../../models/account.model';
|
||||
import { ChangeDetectorRef, Component, OnInit, ViewChild } from '@angular/core';
|
||||
import { ConfirmationService, MessageService } from 'primeng/api';
|
||||
import { TableModule, Table } from 'primeng/table';
|
||||
import { DialogModule } from 'primeng/dialog';
|
||||
import { RippleModule } from 'primeng/ripple';
|
||||
import { ButtonModule } from 'primeng/button';
|
||||
import { ToastModule } from 'primeng/toast';
|
||||
import { ToolbarModule } from 'primeng/toolbar';
|
||||
import { ConfirmDialogModule } from 'primeng/confirmdialog';
|
||||
import { InputTextModule } from 'primeng/inputtext';
|
||||
import { TextareaModule } from 'primeng/textarea';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { SelectModule } from 'primeng/select';
|
||||
import { TagModule } from 'primeng/tag';
|
||||
import { SkeletonModule } from 'primeng/skeleton';
|
||||
import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
|
||||
import { IconFieldModule } from 'primeng/iconfield';
|
||||
import { InputIconModule } from 'primeng/inputicon';
|
||||
import { CompanyService } from '../../../../services/account/company/company.service';
|
||||
import { ValidationService } from '../../../../services/utilities/validation.service';
|
||||
import { TooltipModule } from 'primeng/tooltip';
|
||||
import { AutoCompleteModule } from 'primeng/autocomplete';
|
||||
import { MasterService } from '../../../../services/masters/master.service';
|
||||
import { CityDTO, SearchDTO } from '../../../../models/masters/masters';
|
||||
import { debounceTime, Subject } from 'rxjs';
|
||||
import { Request } from '../../../../models/request.model';
|
||||
import { FloatLabelModule } from 'primeng/floatlabel';
|
||||
|
||||
interface Column {
|
||||
field: string;
|
||||
header: string;
|
||||
customExportHeader?: string;
|
||||
}
|
||||
|
||||
interface ExportColumn {
|
||||
title: string;
|
||||
dataKey: string;
|
||||
}
|
||||
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
@Component({
|
||||
selector: 'app-subsidiary',
|
||||
templateUrl: './subsidiary.component.html',
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule, FormsModule, ReactiveFormsModule,
|
||||
TableModule, DialogModule, ButtonModule, ToastModule, ToolbarModule, ConfirmDialogModule,
|
||||
InputTextModule, TextareaModule, SelectModule, TagModule,
|
||||
SkeletonModule, IconFieldModule,
|
||||
InputIconModule, TooltipModule, AutoCompleteModule, RippleModule, FloatLabelModule
|
||||
],
|
||||
providers: [MessageService, ConfirmationService],
|
||||
styleUrl: './subsidiary.component.css'
|
||||
})
|
||||
export class SubsidiaryComponent implements OnInit{
|
||||
subsidiaryForm: FormGroup;
|
||||
subsidiaryDialog: boolean = false;
|
||||
subsidiaries!: SubsidiaryDTO[];
|
||||
|
||||
subsidiary!: SubsidiaryDTO;
|
||||
|
||||
selectedSubsidiaries!: SubsidiaryDTO[] | null;
|
||||
|
||||
submitted: boolean = false;
|
||||
|
||||
isLoading: boolean = true;
|
||||
|
||||
skeletonData: any[] = Array(10).fill({});
|
||||
|
||||
suggestions: CityDTO[] = [];
|
||||
|
||||
private searchSubject = new Subject<string>();
|
||||
|
||||
statuses!: any[];
|
||||
|
||||
@ViewChild('dt') dt!: Table;
|
||||
|
||||
cols!: Column[];
|
||||
|
||||
exportColumns!: ExportColumn[];
|
||||
|
||||
constructor(
|
||||
private subsidiaryService: CompanyService,
|
||||
private masterService: MasterService,
|
||||
private messageService: MessageService,
|
||||
private confirmationService: ConfirmationService,
|
||||
private cd: ChangeDetectorRef,
|
||||
private fb: FormBuilder,
|
||||
) {
|
||||
|
||||
this.subsidiaryForm = this.fb.group({
|
||||
id: [{ value: '', disabled: true }],
|
||||
cityId: [{ value: null, disabled: true }],
|
||||
code: [{ value: '', disabled: false }, [Validators.required, ValidationService.codeValidator()]],
|
||||
name: [{ value: '', disabled: false }, [Validators.required, ValidationService.nameValidator()]],
|
||||
officeNo: [{ value: '', disabled: false }],
|
||||
street: [{ value: '', disabled: false }],
|
||||
locality: [{ value: '', disabled: false }],
|
||||
cityName: [{ value: '', disabled: false }],
|
||||
stateName: [{ value: '', disabled: true }],
|
||||
pinCode: [{ value: '', disabled: false }, [ValidationService.pincodeValidator()]],
|
||||
emailId: [{ value: '', disabled: false }, [ValidationService.emailValidator()]],
|
||||
contactNo: [{ value: '', disabled: false }, [ValidationService.mobileValidator()]],
|
||||
contactPerson: [{ value: '', disabled: false }, [ValidationService.contactPersonValidator()]],
|
||||
panNo: [{ value: '', disabled: false }, [ValidationService.panValidator()]],
|
||||
cinNo: [{ value: '', disabled: false }, [ValidationService.cinValidator()]],
|
||||
msmeNo: [{ value: '', disabled: false }, [ValidationService.msmeValidator()]],
|
||||
stateId: [{ value: '', disabled: true }],
|
||||
stateCode: [{ value: '', disabled: true }],
|
||||
gstCode: [{ value: '', disabled: true }]
|
||||
});
|
||||
}
|
||||
|
||||
exportCSV() {
|
||||
this.dt.exportCSV();
|
||||
}
|
||||
|
||||
onSearch(event: Event) {
|
||||
const input = event.target as HTMLInputElement;
|
||||
this.dt.filterGlobal(input.value, 'contains');
|
||||
}
|
||||
|
||||
searchCities(event: any) {
|
||||
const query = event.query;
|
||||
this.searchSubject.next(query);
|
||||
}
|
||||
|
||||
onSelectCity(event: any) {
|
||||
const city = event.value as CityDTO;
|
||||
this.subsidiaryForm.patchValue({
|
||||
cityId: city.id,
|
||||
stateId: city.stateId,
|
||||
cityName: city.cityName,
|
||||
stateName: city.stateName,
|
||||
stateCode: city.stateCode,
|
||||
gstCode: city.gstCode
|
||||
});
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.loadAllSubsidiaries();
|
||||
}
|
||||
|
||||
loadAllSubsidiaries() {
|
||||
this.isLoading = true;
|
||||
this.subsidiaryService.getAllSubsidiaries().subscribe({
|
||||
next: (data) => {
|
||||
this.isLoading = false;
|
||||
this.subsidiaries = data;
|
||||
this.cd.markForCheck();
|
||||
},
|
||||
error: (err) => {
|
||||
this.isLoading = false;
|
||||
console.error(err);
|
||||
}
|
||||
});
|
||||
|
||||
this.statuses = [
|
||||
{ label: 'Active', value: true },
|
||||
{ label: 'Inactive', value: false }
|
||||
];
|
||||
|
||||
this.cols = [
|
||||
{ field: 'code', header: 'Code', customExportHeader: 'Code' },
|
||||
{ field: 'name', header: 'Name' },
|
||||
{ field: 'officeNo', header: 'Office No / Building / Floor' },
|
||||
{ field: 'street', header: 'Street / Road' },
|
||||
{ field: 'locality', header: 'Locality' },
|
||||
{ field: 'cityName', header: 'City' },
|
||||
{ field: 'emailId', header: 'Email' },
|
||||
{ field: 'contactNo', header: 'Contact No' },
|
||||
{ field: 'contactPerson', header: 'Contact Person' },
|
||||
{ field: 'panNo', header: 'PAN No.' },
|
||||
{ field: 'cinNo', header: 'CIN No.' },
|
||||
{ field: 'msmeNo', header: 'MSME No.' },
|
||||
{ field: 'updatedAt', header: 'Last Updated At' },
|
||||
{ field: 'updatedUser', header: 'Last Updated By' }
|
||||
];
|
||||
|
||||
this.exportColumns = this.cols.map((col) => ({ title: col.header, dataKey: col.field }));
|
||||
|
||||
this.searchSubject.pipe(debounceTime(300)).subscribe(query => {
|
||||
if (query && query.length >= 2) {
|
||||
const requestPayload: Request<SearchDTO> = {
|
||||
data: {
|
||||
searchBy: 'CITY',
|
||||
searchValue: query
|
||||
},
|
||||
compressed: true,
|
||||
target: 'models.commons.Search'
|
||||
};
|
||||
this.masterService.searchCityStates(requestPayload).subscribe({
|
||||
next: (cities) => {
|
||||
this.suggestions = cities.map(city => ({
|
||||
...city,
|
||||
display: `${city.cityName}, ${city.stateName}`
|
||||
}));
|
||||
this.cd.markForCheck();
|
||||
},
|
||||
error: (err) => {
|
||||
console.error('Error searching cities', err);
|
||||
this.suggestions = [];
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.suggestions = [];
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
openNew() {
|
||||
this.subsidiary = {};
|
||||
this.subsidiaryForm.reset();
|
||||
this.submitted = false;
|
||||
this.subsidiaryDialog = true;
|
||||
}
|
||||
|
||||
editSubsidiary(subsidiary: SubsidiaryDTO) {
|
||||
this.subsidiaryForm.reset();
|
||||
this.subsidiary = { ...subsidiary };
|
||||
this.subsidiaryForm.patchValue(subsidiary);
|
||||
this.subsidiaryDialog = true;
|
||||
console.log(this.subsidiaryForm.getRawValue());
|
||||
}
|
||||
|
||||
|
||||
hideDialog() {
|
||||
this.subsidiaryDialog = false;
|
||||
this.submitted = false;
|
||||
}
|
||||
|
||||
toggleActive(subsidiary: SubsidiaryDTO) {
|
||||
const isActivating = !subsidiary.active;
|
||||
this.confirmationService.confirm({
|
||||
message: `Are you sure you want to ${isActivating ? 'activate' : 'deactivate'} ` + subsidiary.name + '?',
|
||||
header: 'Confirm',
|
||||
icon: 'pi pi-exclamation-triangle',
|
||||
rejectButtonStyleClass: 'p-button-text p-button-secondary',
|
||||
acceptButtonStyleClass: isActivating ? 'p-button-success' : 'p-button-danger',
|
||||
accept: () => {
|
||||
this.subsidiaryService.activateDeactivateSubsidiary(subsidiary.id?? '', isActivating).subscribe({
|
||||
next: (updatedSubsidiary) => {
|
||||
subsidiary.active = updatedSubsidiary.active;
|
||||
this.subsidiaries = [...this.subsidiaries];
|
||||
this.messageService.add({
|
||||
severity: 'success',
|
||||
summary: 'Successful',
|
||||
detail: `Subsidiary ${isActivating ? 'Activated' : 'Deactivated'}`,
|
||||
life: 3000
|
||||
});
|
||||
},
|
||||
error: (err) => {
|
||||
console.error('Error toggling subsidiary active status', err);
|
||||
this.messageService.add({
|
||||
severity: 'error',
|
||||
summary: 'Error',
|
||||
detail: 'Failed to update subsidiary status',
|
||||
life: 3000
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
getSeverity(status: boolean) {
|
||||
switch (status) {
|
||||
case true:
|
||||
return 'success';
|
||||
case false:
|
||||
return 'warn';
|
||||
}
|
||||
}
|
||||
|
||||
getErrorMessage(fieldName: string): string {
|
||||
const control = this.subsidiaryForm.get(fieldName);
|
||||
return control ? ValidationService.getErrorMessage(control, fieldName) : '';
|
||||
}
|
||||
|
||||
isFieldInvalid(fieldName: string): boolean {
|
||||
const control = this.subsidiaryForm.get(fieldName);
|
||||
return !!(control && control.invalid && (control.dirty || control.touched || this.submitted));
|
||||
}
|
||||
|
||||
saveSubsidiary() {
|
||||
this.submitted = true;
|
||||
|
||||
if (this.subsidiaryForm.valid) {
|
||||
const subsidiaryData = this.subsidiaryForm.getRawValue();
|
||||
const existing = this.subsidiaries.find(sub => sub.id !== subsidiaryData.id && (sub.code === subsidiaryData.code || sub.name === subsidiaryData.name));
|
||||
if (existing) {
|
||||
this.messageService.add({
|
||||
severity: 'error',
|
||||
summary: 'Validation Error',
|
||||
detail: 'Subsidiary code or name already exists',
|
||||
life: 3000
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.subsidiaryService.saveSubsidiary(subsidiaryData).subscribe({
|
||||
next: (newSubsidiary) => {
|
||||
this.subsidiaries.push(newSubsidiary);
|
||||
this.subsidiaries = [...this.subsidiaries];
|
||||
this.messageService.add({
|
||||
severity: 'success',
|
||||
summary: 'Successful',
|
||||
detail: 'Subsidiary Created',
|
||||
life: 3000
|
||||
});
|
||||
this.subsidiaryDialog = false;
|
||||
this.subsidiary = {};
|
||||
},
|
||||
error: (err) => {
|
||||
console.error('Error saving subsidiary', err);
|
||||
this.messageService.add({
|
||||
severity: 'error',
|
||||
summary: 'Error',
|
||||
detail: 'Failed to save subsidiary',
|
||||
life: 3000
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user