micro-frontend/ng-ttc-frontend/src/app/component/main-project-add/main-project-add.ts

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { FormGroup, FormControl, Validators } from '@angular/forms';
import { GeneralService } from '../../services/generalservice';
import { ToastrService } from 'ngx-toastr';

@Component({
  selector: 'app-main-project-add',
  standalone: false,
  templateUrl: './main-project-add.html',
  styleUrl: './main-project-add.css',
})
export class MainProjectAdd implements OnInit {
  currentStep: number = 1;
  isLoading: boolean = false;

  projectForm!: FormGroup;
  attachedFiles: any[] = [];

  constructor(
    private generalService: GeneralService,
    private router: Router,
    private toastr: ToastrService
  ) {}

  ngOnInit(): void {
    this.setupFormControl();
  }

  setupFormControl(): void {
    this.projectForm = new FormGroup({
      projectName: new FormControl('', [Validators.required, Validators.maxLength(200)]),
      budgetAmount: new FormControl('', [Validators.required, Validators.min(1)])
    });
  }

  // ฟังก์ชันเปลี่ยน Step (เรียกใช้จากปุ่มเท่านั้น)
  goToStep(step: number): void {
    // กรณีจะไป Step 2 ต้องผ่าน Validation Step 1 ก่อน
    if (step === 2 && this.currentStep === 1) {
      if (this.projectForm.invalid) {
        this.projectForm.markAllAsTouched();
        this.toastr.warning('กรุณากรอกข้อมูลให้ครบถ้วน', 'แจ้งเตือน');
        return;
      }
    }
    this.currentStep = step;
  }

  onFileSelected(event: any): void {
    const files = event.target.files;
    if (files && files.length > 0) {
      for (let i = 0; i < files.length; i++) {
        const file = files[i];
        const reader = new FileReader();
        reader.onload = (e: any) => {
          this.attachedFiles.push({
            name: file.name,
            size: file.size,
            type: file.type,
            content: e.target.result
          });
        };
        reader.readAsDataURL(file);
      }
    }
  }

  removeFile(index: number): void {
    this.attachedFiles.splice(index, 1);
  }

  get f() {
    return this.projectForm.controls;
  }

  formatCurrency(amount: any): string {
    if (!amount) return '0.00 บาท';
    return new Intl.NumberFormat('th-TH', { style: 'currency', currency: 'THB' }).format(Number(amount));
  }

  onSubmit(): void {
    if (this.projectForm.invalid) return;

    this.isLoading = true;
    const uri = '/api/project/create';

    const request = {
      ...this.projectForm.value,
      files: this.attachedFiles
    };

    this.generalService.postRequest(uri, request).subscribe({
      next: (result: any) => {
        this.isLoading = false;
        this.generalService.trowApi(result);

        if (result.code === '200') {
          this.router.navigate(['/main']);
        }
      },
      error: (error: any) => {
        this.isLoading = false;
        this.generalService.trowApi(error);
      }
    });
  }
}