create-project.component.ts

import { Component } from '@angular/core';
import { ProjectService } from '../services/project.service';
import {Router} from "@angular/router";

@Component({
  selector: 'app-create-project',
  templateUrl: './create-project.component.html',
  styleUrl: './create-project.component.css'
})
export class CreateProjectComponent {
  constructor(private projectService: ProjectService, private router: Router) { }

  name: string = '';
  description: string = '';
  date: string = '';
  category: string = '';
  url: string = '';
  file: File[] = [];
  goal: number = 0;
  currentAmount: number = 0;
  categories: any = []


  ngOnInit() {
    this.projectService.getCategories().subscribe((data: any) => {
      this.categories = data;
    });

  }

  onFileUploaded(event: Event): void {
    const input = event.target as HTMLInputElement;
    if (input && input.files && input.files.length) {
      for (let i = 0; i < input.files.length; i++){
        this.file.push(input.files[i]);
      }
    }
  }


  createProject() {
    this.projectService.createProject({
      name: this.name,
      description: this.description,
      date: this.date,
      category: this.category,
      url: this.url,
      goal: this.goal,
      currentAmount: this.currentAmount
    }).subscribe({
      next: (data: any) => {
        if(this.file.length > 0){
          const formData = new FormData();
          this.file.forEach((file) => {
            formData.append('file', file, file.name);
          });
          console.log(formData.get('file'));
          this.projectService.uploadImages(data.id, formData).subscribe({
          next: () => {
            console.log('Images uploaded');
            this.router.navigate([`/details/${data.id}`]);
          },
          error: (error: any) => {
            console.error('Images upload failure', error);
            this.router.navigate(['/error']);
          }
        });}
        this.router.navigate([``]);},
      error: (error: any) => {
        console.error('Project creation failure', error);
        this.router.navigate(['/error']);
      }

    });
    }

}