Changeset 6a80231 for trip-planner-front/src/app/create-initial-planner

Timestamp:

11/02/21 22:14:57 (3 years ago)

Author:

Ema <ema_spirova@…>

Branches:

master

Children:

6c1585f

Parents:

188ee53

Message:

create initial planner and routing with angular

Location:

trip-planner-front/src/app/create-initial-planner

Files:

• create-initial-planner.component.html (modified) (1 diff)
• create-initial-planner.component.ts (modified) (3 diffs)

trip-planner-front/src/app/create-initial-planner/create-initial-planner.component.html

@@ -1 @@
-<h1 mat-dialog-title>Hi </h1>
-<div mat-dialog-content>
-  <p>Trip name</p>
-  <mat-form-field appearance="fill">
-    <input matInput required >
-  </mat-form-field>
-  <p>Trip description</p>
-  <mat-form-field appearance="fill">
-    <textarea matInput ></textarea>
-  </mat-form-field>
-</div>
-<div mat-dialog-actions>
-  <button mat-button (click)="onCancelClick()">Cancel</button>
-  <button mat-button cdkFocusInitial>Save</button>
-</div>
+<form (ngSubmit)="onFormSubmitPlanner(f)" #f="ngForm">
+  <h1 mat-dialog-title>Hi </h1>
+  <div mat-dialog-content>
+    <p>Planner name</p>
+    <mat-form-field appearance="fill">
+      <input matInput required   type="text" [(ngModel)]="plannerDto.name" name="name" placeholder="Planner name">
+    </mat-form-field>
+    <p>Planner description</p>
+    <mat-form-field appearance="fill">
+      <textarea matInput required name="description" [(ngModel)]="plannerDto.description" type="text" placeholder="Planner description"></textarea>
+    </mat-form-field>
+  </div>
+  <div mat-dialog-actions>
+    
+    <button mat-button type="submit" [disabled]="!f.form.valid" >Save</button>
+  </div>
+</form>
+
+<button mat-button (click)="onCancelClick()">Cancel</button>

trip-planner-front/src/app/create-initial-planner/create-initial-planner.component.ts

@@ +1 @@
+import { ResourceLoader } from '@angular/compiler';
+import { Route } from '@angular/compiler/src/core';
 import { Component, Inject, OnInit } from '@angular/core';
+import { NgForm } from '@angular/forms';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { ActivatedRoute, Params, Router } from '@angular/router';
+import { PlannerDto } from '../_models/dto/plannerDto';
+import { Planner } from '../_models/planner';
+import { PlannerService } from '../_services/planner.service';
 
 @Component({
@@ -9 +16 @@
 export class CreateInitialPlannerComponent implements OnInit {
 
-  constructor(
-    public dialogRef: MatDialogRef<CreateInitialPlannerComponent>) {}
+  planner: Planner;
+  planners: Planner[];
+  locations : Location[];
+  plannerDto: PlannerDto;
+
+  constructor(public dialogRef: MatDialogRef<CreateInitialPlannerComponent>,
+              private plannerService : PlannerService, private router : Router) {
+                this.planner = new Planner;
+                this.planners = [];
+                this.locations = [];
+                this.plannerDto = new PlannerDto();
+              }
 
   ngOnInit(): void {
+    this.planner = new Planner();
+    this.plannerDto = new PlannerDto();
   }
 
@@ -18 +37 @@
     this.dialogRef.close();
   }
+  
+  onFormSubmitPlanner(form: NgForm){
+   console.log(this.planner);
+      this.plannerService.postInitialPlanner(this.plannerDto).subscribe(
+        data=>{
+          console.log(data);
+          this.router.navigate(['planner']);
+        },
+        error => console.log('oops', error)
+     );
+     window.location.reload();
+  }
+
 
 }