Added some component required as per my proposal

src/app/excel-generator/excel-generator.component.html

@@ -0,0 +1,2 @@
+<button (click)="generateExcelTemplate()">Generate Excel Template</button>
+

src/app/excel-generator/excel-generator.component.spec.ts

@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ExcelGeneratorComponent } from './excel-generator.component';
+
+describe('ExcelGeneratorComponent', () => {
+  let component: ExcelGeneratorComponent;
+  let fixture: ComponentFixture<ExcelGeneratorComponent>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      declarations: [ExcelGeneratorComponent]
+    });
+    fixture = TestBed.createComponent(ExcelGeneratorComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/excel-generator/excel-generator.component.ts

@@ -0,0 +1,49 @@
+import { Component } from '@angular/core';
+import * as XLSX from 'xlsx';
+
+@Component({
+  selector: 'app-excel-generator',
+  templateUrl: './excel-generator.component.html',
+  styleUrls: ['./excel-generator.component.sass']
+})
+export class ExcelGeneratorComponent {
+  generateExcelTemplate() {
+
+    const data = [
+      ['Name of resources in program', 'Type of resources', 'Resource Link', 'Resource Status', 'Target role at the resource level', 'Targeted subrole at resource level', 'Start date of resource', 'End date of resource'],
+      ['Obs Form for All Question type', 'Observation without rubrics', 'https://docs.google.com/spreadsheets/d/1uErekrCkuOXMdIvXsCSOr7YiBk4HcS4iJrh0tdALlsw/edit#gid=2134498639', 'Existing', 'HM,DEO', '', '30-08-2021', '30-08-2022']
+    ];
+
+
+    const workbook = XLSX.utils.book_new();
+
+
+    const worksheet = XLSX.utils.aoa_to_sheet(data);
+
+
+    XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');
+
+
+    const excelBuffer = XLSX.write(workbook, { type: 'buffer', bookType: 'xlsx' });
+
+
+    this.saveExcelFile(excelBuffer, 'template.xlsx');
+  }
+
+  saveExcelFile(buffer: any, fileName: string) {
+    const data: Blob = new Blob([buffer], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
+
+
+    const link = document.createElement('a');
+    link.href = window.URL.createObjectURL(data);
+    link.download = fileName;
+
+
+    link.click();
+
+
+    window.URL.revokeObjectURL(link.href);
+    link.remove();
+  }
+}
+

src/app/program-manager-form/program-manager-form.component.html

@@ -0,0 +1,16 @@
+<form (ngSubmit)="onSubmit()">
+    <label for="ssoUser">If the user is using SSO system to login, select YES else NO</label>
+    <select id="ssoUser" [(ngModel)]="ssoUser" name="ssoUser" required>
+      <option value="YES">YES</option>
+      <option value="NO">NO</option>
+    </select>
+
+    <label for="loginId">Login Id on DIKSHA of the Program Manager</label>
+    <input id="loginId" [(ngModel)]="loginId" name="loginId" [disabled]="ssoUser === 'YES'">
+
+    <label for="dikshaUserId">Enter the Diksha username/user id</label>
+    <input id="dikshaUserId" [(ngModel)]="dikshaUserId" name="dikshaUserId" [required]="ssoUser === 'YES'">
+
+    <button type="submit">Submit</button>
+  </form>
+

src/app/program-manager-form/program-manager-form.component.spec.ts

@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ProgramManagerFormComponent } from './program-manager-form.component';
+
+describe('ProgramManagerFormComponent', () => {
+  let component: ProgramManagerFormComponent;
+  let fixture: ComponentFixture<ProgramManagerFormComponent>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      declarations: [ProgramManagerFormComponent]
+    });
+    fixture = TestBed.createComponent(ProgramManagerFormComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/program-manager-form/program-manager-form.component.ts

@@ -0,0 +1,22 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-program-manager-form',
+  templateUrl: './program-manager-form.component.html',
+  styleUrls: ['./program-manager-form.component.sass']
+})
+export class ProgramManagerFormComponent {
+  ssoUser = 'YES';
+  loginId = '';
+  dikshaUserId = 'dikshauser_5xco';
+  onSubmit() {
+
+    const formData = {
+      ssoUser: this.ssoUser,
+      loginId: this.loginId,
+      dikshaUserId: this.dikshaUserId
+    };
+
+
+  }
+}

src/app/project-upload/project-upload.component.html

@@ -0,0 +1,10 @@
+<form *ngIf="projectUploadForm" [formGroup]="projectUploadForm" (ngSubmit)="onSubmit()">
+    <label for="title">Title:</label>
+    <input type="text" id="title" formControlName="title">
+    <div *ngIf="projectUploadForm.get('title')?.touched && projectUploadForm.get('title')?.errors?.['required']">Title is required</div>
+
+
+
+    <button type="submit">Upload Project</button>
+  </form>
+

src/app/project-upload/project-upload.component.spec.ts

@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ProjectUploadComponent } from './project-upload.component';
+
+describe('ProjectUploadComponent', () => {
+  let component: ProjectUploadComponent;
+  let fixture: ComponentFixture<ProjectUploadComponent>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      declarations: [ProjectUploadComponent]
+    });
+    fixture = TestBed.createComponent(ProjectUploadComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/project-upload/project-upload.component.ts

@@ -0,0 +1,54 @@
+import { Component } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+
+@Component({
+  selector: 'app-project-upload',
+  templateUrl: './project-upload.component.html',
+  styleUrls: ['./project-upload.component.sass']
+})
+export class ProjectUploadComponent {
+  projectUploadForm: FormGroup;
+
+  constructor(private formBuilder: FormBuilder) {
+    this.projectUploadForm = this.formBuilder.group({
+      title: ['', Validators.required],
+      projectId: ['', Validators.required],
+      isSSOUser: ['', Validators.required],
+      dikshaLoginId: ['', Validators.required],
+      categories: ['', Validators.required],
+      objective: ['', Validators.required],
+      duration: ['', Validators.required],
+      recommendedFor: ['', Validators.required],
+      keywords: ['', Validators.required],
+      learningResources1_name: [''],
+      learningResources1_link: [''],
+      learningResources2_name: [''],
+      learningResources2_link: [''],
+      learningResources3_name: [''],
+      learningResources3_link: [''],
+      hasCertificate: ['', Validators.required],
+      projectLevelEvidence: ['', Validators.required],
+      minNoOfEvidence: ['']
+    });
+  }
+
+  onSubmit() {
+    if (this.projectUploadForm.valid) {
+
+      const projectData = this.projectUploadForm.value;
+      console.log(projectData);
+    } else {
+
+      this.markFormGroupTouched(this.projectUploadForm);
+    }
+  }
+
+  markFormGroupTouched(formGroup: FormGroup) {
+    Object.values(formGroup.controls).forEach(control => {
+      control.markAsTouched();
+      if (control instanceof FormGroup) {
+        this.markFormGroupTouched(control);
+      }
+    });
+  }
+}