import { Component, OnInit } from '@angular/core'; import { IconField } from 'primeng/iconfield'; import { InputIcon } from 'primeng/inputicon'; import { InputText } from 'primeng/inputtext'; import { SelectButton } from 'primeng/selectbutton'; import { FormsModule } from '@angular/forms'; import { MessageService, PrimeTemplate } from 'primeng/api'; import { MatIcon } from '@angular/material/icon'; import { Select } from 'primeng/select'; import { Panel } from 'primeng/panel'; import { Button } from 'primeng/button'; import { Chip } from 'primeng/chip'; import { Router } from '@angular/router'; import { Dialog } from 'primeng/dialog'; import { DatePicker } from 'primeng/datepicker'; import { InputGroup } from 'primeng/inputgroup'; import { InputGroupAddon } from 'primeng/inputgroupaddon'; import { Editor } from 'primeng/editor'; import { InputNumber } from 'primeng/inputnumber'; import { PropertyService } from '@/pages/service/property.service'; import { Project, ProjectService} from '@/pages/service/project.service'; import { CurrencyPipe, DatePipe } from '@angular/common'; import { SafeHtmlPipe } from '@/pipes/safe-html-pipe'; import { ProjectType, ProjectTypeService } from '@/pages/service/project-type.service'; import { ProjectStatus, ProjectStatusService } from '@/pages/service/project-status.service'; @Component({ selector: 'app-projects', imports: [ IconField, InputIcon, InputText, SelectButton, FormsModule, PrimeTemplate, MatIcon, Select, Panel, Button, Chip, Dialog, DatePicker, InputGroup, InputGroupAddon, Editor, InputNumber, DatePipe, SafeHtmlPipe, CurrencyPipe ], templateUrl: './projects.html', styleUrl: './projects.scss', providers: [MessageService] }) export class Projects implements OnInit { protected viewMode = 'grid'; stateOptions: any[] = [ { label: 'Kachel', value: 'grid', icon: 'view_comfy_alt' }, { label: 'Kanban', value: 'kanban', icon: 'view_kanban' } ]; projects: Project[] = []; projectTypes: ProjectType[]= []; projectStatuses: ProjectStatus[]= []; statuses: any; measures: any; selectedStatus: any; selectedMeasures: any; addNewProjectDialogVisible: boolean = false; // for stats projectsStatsCountTotal: number = 0; projectsStatsCountActive: number = 0; projectsStatsCountCompleted: number = 0; projectsStatsAmountRequestedInTotal: number = 0; // for new project dialog projectTypeOptionsForNewProject: any = []; projectStatusOptionsForNewProject: any = []; propertyOptionsForNewProject: any = []; newProjectName: string | undefined; newProjectEventNumber: string | undefined; newProjectDescription: string | undefined; newProjectProjectType: string | undefined; newProjectStatus: string | undefined; newProjectPropertyId: string | undefined; newProjectStartDate: Date | undefined; newProjectEndDate: Date | undefined; newProjectAmountRequested: number | undefined; constructor( private router: Router, private propertyService: PropertyService, private projectService: ProjectService, private projectTypeService: ProjectTypeService, private projectStatusService: ProjectStatusService, private messageService: MessageService ) {} ngOnInit(): void { this.statuses = [{ label: 'Alle', value: 'all' }, ...this.projectStatuses]; this.measures = [{ label: 'Alle', value: 'all' }, ...this.projectTypes]; this.projectService.getProjects().subscribe((projects) => { console.debug('Projects', projects); this.projects = projects; }); this.projectTypeService.getProjectTypes().subscribe((projectTypes) => { console.debug('ProjectTypes', projectTypes); this.projectTypes = projectTypes; }); this.projectStatusService.getProjectStatuses().subscribe((projectStatuses) => { console.debug('ProjectStatuses', projectStatuses); this.projectStatuses = projectStatuses; }); this.projectService.getStats().subscribe((stats) => { this.projectsStatsCountTotal = stats.projectsCountTotal ?? 0; this.projectsStatsCountActive = stats.projectsCountActive ?? 0; this.projectsStatsCountCompleted = stats.projectsCountCompleted ?? 0; this.projectsStatsAmountRequestedInTotal = stats.amountRequestedInTotal ?? 0; }); } navigateToDetails(id: string | undefined) { this.router.navigate(['/projects', id]); } deleteMe_getStatusOptionsForNewProject() { return [ { label: 'Vorbereitung', value: 'preparation' }, { label: 'Aktiv', value: 'active' }, { label: 'Abgeschlossen', value: 'completed' }, { label: 'Problem', value: 'problem' } ]; } deleteMe_getProjectTypeOptionsForNewProject() { return [ { label: 'Energieberatung WG (iSFP)', value: 'energy_consulting_wg' }, { label: 'Energieberatung NWG (Modul2)', value: 'energy_consulting_nwg' }, { label: 'Einzelmaßnahmen', value: 'individual_measures' }, { label: 'Effizienzhaus Sanierung', value: 'efficiency_house_renovation' }, { label: 'Effizienzhaus Neubau', value: 'efficiency_house_new_construction' }, { label: 'Energieausweis', value: 'energy_performance_certificate' }, { label: 'Fachplanung Bauphysik', value: 'specialist_planning_for_building_physics' }, { label: 'Fachplanung Heizung', value: 'specialist_planning_for_heating' }, { label: 'Zertifizierung', value: 'certification' } ]; } showDialog() { this.propertyService.getProperties().subscribe((properties) => { this.propertyOptionsForNewProject = []; properties.forEach((property) => { this.propertyOptionsForNewProject.push({ value: property.id, label: property.name }); }); this.projectTypeOptionsForNewProject = []; this.projectTypes.forEach((projectType) => { this.projectTypeOptionsForNewProject.push({ value: projectType.id, label: projectType.name }); }); this.projectStatusOptionsForNewProject = []; this.projectStatuses.forEach((projectStatus) => { this.projectStatusOptionsForNewProject.push({ value: projectStatus.id, label: projectStatus.name }); }); }); this.projectStatusOptionsForNewProject = this.projectStatuses; this.projectTypeOptionsForNewProject = this.projectTypes; this.addNewProjectDialogVisible = true; } createNewProject() { let newProject = this.projectService.getProjectInstance( this.newProjectName, this.newProjectEventNumber, this.newProjectDescription, this.newProjectProjectType, this.newProjectStatus, this.newProjectPropertyId, this.newProjectStartDate, this.newProjectEndDate, this.newProjectAmountRequested ); this.projectService.create(newProject).subscribe({ next: (arg) => { this.messageService.add({ severity: 'success', summary: 'Erfolgreich', detail: 'Projekt erfolgreich angelegt', life: 3000 }); this.projects.push(newProject); this.projectsStatsCountTotal++; this.projectsStatsCountCompleted += this.newProjectStatus == 'completed' ? 1 : 0; this.projectsStatsAmountRequestedInTotal += this.newProjectAmountRequested ?? 0; this.projectsStatsCountActive += this.newProjectStatus == 'active' ? 1 : 0; this.addNewProjectDialogVisible = false; }, error: (err) => { this.messageService.add({ severity: 'danger', summary: 'Fehler', detail: 'Beim Anlegen des Projekts ist ein Fehler aufgetreten.', life: 3000 }); console.log('Error while creating project -- Error: ' + err + ' -- Project: ', newProject); } }); } }