projects-management-microservices-frontend/src/app/pages/project-manager/project-management/project-create/project-create.component.ts

import { ProjState } from './../../../../shared/models/project/project.state';
import { Priority } from 'src/app/shared/models/project/project.priority';
import { Router } from '@angular/router';
import { Project } from 'src/app/shared/models/project/project.model';
import { MsgState } from './../../../../ngrx/msg.state';
import { GetAllComapaniesAction } from './../../../../ngrx/company/company.actions';
import { GetAllUsersAction } from './../../../../ngrx/user/user.actions';
import { CompanyState } from './../../../../ngrx/company/company.state';
import { UserState } from './../../../../ngrx/user/user.state';
import { CreateFormAddProjectAction, SaveNewProjectAction } from './../../../../ngrx/project/project.action';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ProjectState } from './../../../../ngrx/project/project.state';
import { Component, OnInit } from '@angular/core';
import { Store } from '@ngrx/store';

@Component({
  selector: 'app-project-create',
  templateUrl: './project-create.component.html',
  styleUrls: ['./project-create.component.css'],
})
export class ProjectCreateComponent implements OnInit {
  constructor(
    private store: Store<{
      projectReducerSelector: ProjectState;
      userReducerSelector: UserState;
      companyReducerSelector: CompanyState;
    }>,
    private formBuilder: FormBuilder,
    private router: Router
  ) {}

  userState!: UserState;
  companyState!: CompanyState;

  projectFormGroup!: FormGroup;
  projectState!: ProjectState;
  projStates = ProjState;
  priorities = Priority;
  msgState = MsgState;

  ngOnInit(): void {
    this.store.dispatch(new GetAllUsersAction({}, {}));
    this.store.dispatch(new GetAllComapaniesAction({}));
    this.store.subscribe(
      (state) => (this.userState = state.userReducerSelector)
    );
    this.store.subscribe(
      (state) => (this.companyState = state.companyReducerSelector)
    );

    this.store.dispatch(new CreateFormAddProjectAction({}, {}, {}));
    this.store.subscribe((state) => {
      this.projectState = state.projectReducerSelector;

      this.projectFormGroup = this.formBuilder.group({
        projectName: [
          '',
          [
            Validators.required,
            Validators.minLength(5),
            Validators.maxLength(20),
          ],
        ],
        priority: ['', Validators.required],
        description: ['', [Validators.required, Validators.minLength(25)]],
        projState: ['', Validators.required],
        userID: ['', Validators.required],
        companyID: ['', Validators.required],
      });
    });
  }

  onProjectSave() {
    if(window.confirm(this.msgState.CONFIRM_ADD)){

      let formModel = this.projectFormGroup.value;
      //project model
      let project: Project = new Project();
      project.projectName= formModel.projectName;
      project.priority = formModel.priority;
      project.createdDate = formModel.createdDate;
      project.description = formModel.description;
      project.projState = formModel.projState;
      project.companyID=formModel.companyID;
      project.userID = formModel.userID;

      // user and company id needed to create project
      let userID: number = formModel.userID;
      let companyID: number = formModel.companyID;

      this.store.dispatch(new SaveNewProjectAction(project));
    }
  }

  onSaveSuccess(){
    this.router.navigateByUrl("/projects-management")
  }
}