66 lines
1.9 KiB
TypeScript
66 lines
1.9 KiB
TypeScript
import { Component, OnInit, signal } from '@angular/core';
|
|
import { Router } from '@angular/router';
|
|
import { CommonModule } from '@angular/common';
|
|
import { MatCardModule } from '@angular/material/card';
|
|
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
|
import { ApiService } from '../../services';
|
|
import { Project } from '../../models';
|
|
|
|
@Component({
|
|
selector: 'app-projects-dashboard',
|
|
standalone: true,
|
|
imports: [CommonModule, MatCardModule, MatProgressSpinnerModule],
|
|
templateUrl: './projects-dashboard.component.html',
|
|
styleUrls: ['./projects-dashboard.component.scss']
|
|
})
|
|
export class ProjectsDashboardComponent implements OnInit {
|
|
projects = signal<Project[]>([]);
|
|
loading = signal(true);
|
|
error = signal<string | null>(null);
|
|
currentProjectId = signal<string | null>(null);
|
|
|
|
constructor(
|
|
private apiService: ApiService,
|
|
private router: Router
|
|
) {}
|
|
|
|
ngOnInit() {
|
|
this.loadProjects();
|
|
|
|
// Check if we're currently viewing a project
|
|
const urlSegments = this.router.url.split('/');
|
|
if (urlSegments[1] === 'project' && urlSegments[2]) {
|
|
this.currentProjectId.set(urlSegments[2]);
|
|
}
|
|
|
|
// Listen to route changes
|
|
this.router.events.subscribe(() => {
|
|
const segments = this.router.url.split('/');
|
|
if (segments[1] === 'project' && segments[2]) {
|
|
this.currentProjectId.set(segments[2]);
|
|
} else {
|
|
this.currentProjectId.set(null);
|
|
}
|
|
});
|
|
}
|
|
|
|
loadProjects() {
|
|
this.loading.set(true);
|
|
this.apiService.getProjects().subscribe({
|
|
next: (projects) => {
|
|
this.projects.set(projects);
|
|
this.loading.set(false);
|
|
},
|
|
error: (err) => {
|
|
this.error.set('Failed to load projects');
|
|
this.loading.set(false);
|
|
console.error(err);
|
|
}
|
|
});
|
|
}
|
|
|
|
openProject(projectId: string) {
|
|
this.router.navigate(['/project', projectId]);
|
|
}
|
|
}
|