Compare commits
11 changed files with 39 additions and 97 deletions
|
|
@ -1,13 +1,11 @@
|
||||||
import { NgModule } from '@angular/core';
|
import { NgModule } from '@angular/core';
|
||||||
import { RouterModule, Routes } from '@angular/router';
|
import { RouterModule, Routes } from '@angular/router';
|
||||||
import { HomeComponent } from './home.component';
|
import { HomeComponent } from './home.component';
|
||||||
import { ReportComponent } from './report.component';
|
|
||||||
import { ThanksComponent } from './thanks.component';
|
import { ThanksComponent } from './thanks.component';
|
||||||
|
|
||||||
const routes: Routes = [
|
const routes: Routes = [
|
||||||
{ path: '', component: HomeComponent },
|
{ path: '', component: HomeComponent },
|
||||||
{ path: 'thanks', component: ThanksComponent },
|
{ path: 'thanks', component: ThanksComponent }
|
||||||
{ path: 'report', component: ReportComponent }
|
|
||||||
];
|
];
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,6 @@ import { SignComponent } from './sign.component';
|
||||||
import { ThanksComponent } from './thanks.component';
|
import { ThanksComponent } from './thanks.component';
|
||||||
import { AppRoutingModule } from './app-routing.module';
|
import { AppRoutingModule } from './app-routing.module';
|
||||||
import { HomeComponent } from './home.component';
|
import { HomeComponent } from './home.component';
|
||||||
import { ReportComponent } from './report.component';
|
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
declarations: [
|
declarations: [
|
||||||
|
|
@ -25,7 +24,6 @@ import { ReportComponent } from './report.component';
|
||||||
SignComponent,
|
SignComponent,
|
||||||
ThanksComponent,
|
ThanksComponent,
|
||||||
HomeComponent,
|
HomeComponent,
|
||||||
ReportComponent,
|
|
||||||
],
|
],
|
||||||
imports: [
|
imports: [
|
||||||
BrowserModule,
|
BrowserModule,
|
||||||
|
|
|
||||||
|
|
@ -21,7 +21,7 @@ export class CameraComponent implements OnInit {
|
||||||
|
|
||||||
video: HTMLVideoElement;
|
video: HTMLVideoElement;
|
||||||
|
|
||||||
ngOnInit() { console.log("Camera", this.field.id); }
|
ngOnInit() { console.log("Smile!"); }
|
||||||
|
|
||||||
ngAfterViewInit() {
|
ngAfterViewInit() {
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -36,20 +36,15 @@ import { Router } from '@angular/router';
|
||||||
})
|
})
|
||||||
export class FormComponent implements OnInit {
|
export class FormComponent implements OnInit {
|
||||||
|
|
||||||
constructor(private router: Router) { }
|
constructor(private route: Router) { }
|
||||||
|
|
||||||
@Input() template: Form;
|
@Input() template: Form;
|
||||||
|
|
||||||
form: Form;
|
form: Form;
|
||||||
|
|
||||||
ngOnInit() { this.set(); }
|
ngOnInit() { this.set() }
|
||||||
|
|
||||||
set() {
|
set() { this.form = Object.assign({}, this.template); }
|
||||||
|
|
||||||
/* Make a deep copy of the template */
|
|
||||||
this.form = JSON.parse(JSON.stringify(this.template));
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
next() {
|
next() {
|
||||||
|
|
||||||
|
|
@ -63,33 +58,36 @@ export class FormComponent implements OnInit {
|
||||||
|
|
||||||
async submit() {
|
async submit() {
|
||||||
|
|
||||||
const res = await fetch(this.form.submit, parseForm(this.form.steps));
|
const results = {};
|
||||||
|
|
||||||
res.ok ?
|
this.form.steps.forEach((s: Step) => {
|
||||||
this.router.navigate(["/thanks"]) :
|
|
||||||
alert("Failed to connect to the backend.");
|
s.fields.forEach((f: Field) => {
|
||||||
|
|
||||||
|
results[f.id] = f.value;
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
try {
|
||||||
|
|
||||||
|
const res = await fetch(this.form.submit, results);
|
||||||
|
|
||||||
|
if (res.ok) {
|
||||||
|
|
||||||
|
this.set();
|
||||||
|
|
||||||
|
this.route.navigate(["/thanks"]);
|
||||||
|
|
||||||
|
} else {
|
||||||
|
|
||||||
|
alert("Backend does't like you.");
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
} catch (e) { alert("Something went wrong."); }
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* Util to extract key, values from Form */
|
|
||||||
const parseForm = (steps: Step[]) => {
|
|
||||||
|
|
||||||
const results = {};
|
|
||||||
|
|
||||||
steps.forEach((s: Step) => {
|
|
||||||
|
|
||||||
s.fields.forEach((f: Field) => {
|
|
||||||
|
|
||||||
results[f.id] = f.value;
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
return results;
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
|
||||||
|
|
@ -16,8 +16,6 @@ import { checkin, checkout } from "src/assets/forms";
|
||||||
|
|
||||||
<app-form *ngIf="action=='checkout'" [template]="checkout"></app-form>
|
<app-form *ngIf="action=='checkout'" [template]="checkout"></app-form>
|
||||||
|
|
||||||
<a routerLink="/report">Go To Report Page</a>
|
|
||||||
|
|
||||||
<footer>Accenture | 2022</footer>
|
<footer>Accenture | 2022</footer>
|
||||||
`
|
`
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -25,7 +25,7 @@ export class RadioComponent implements OnInit {
|
||||||
@Input() field: Field;
|
@Input() field: Field;
|
||||||
@Output() update: EventEmitter<null> = new EventEmitter();
|
@Output() update: EventEmitter<null> = new EventEmitter();
|
||||||
|
|
||||||
ngOnInit() { console.log("Radio", this.field.id); }
|
ngOnInit() { console.log("Text", this.field.id); }
|
||||||
|
|
||||||
check() {
|
check() {
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,53 +0,0 @@
|
||||||
import { Component, OnInit } from '@angular/core';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-report',
|
|
||||||
template: `
|
|
||||||
<div class="report">
|
|
||||||
|
|
||||||
<span *ngFor="let entry of data">
|
|
||||||
|
|
||||||
<img [src]="entry.photo"/>
|
|
||||||
|
|
||||||
<div class="info">
|
|
||||||
|
|
||||||
{{ entry.name }}
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</span>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
`,
|
|
||||||
styles: [
|
|
||||||
]
|
|
||||||
})
|
|
||||||
export class ReportComponent implements OnInit {
|
|
||||||
|
|
||||||
data: Entry[];
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
|
|
||||||
this.data = data;
|
|
||||||
|
|
||||||
// try {
|
|
||||||
|
|
||||||
// const res = await fetch("url");
|
|
||||||
|
|
||||||
// } catch(e) { alert("Something went wrong."); }
|
|
||||||
|
|
||||||
// this.data = res.json();
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* Placeholder data */
|
|
||||||
const data: Entry[] = [{
|
|
||||||
name: "John Doe",
|
|
||||||
eid: "john.doe",
|
|
||||||
asset: "monitor",
|
|
||||||
complete: false,
|
|
||||||
photo: "./assets/monitor.jfif"
|
|
||||||
}]
|
|
||||||
|
|
@ -19,7 +19,7 @@ export class SignComponent implements OnInit {
|
||||||
|
|
||||||
pad: HTMLCanvasElement;
|
pad: HTMLCanvasElement;
|
||||||
|
|
||||||
ngOnInit() { console.log("Sign", this.field.id); }
|
ngOnInit() { console.log("Sign your name!"); }
|
||||||
|
|
||||||
ngAfterViewInit() {
|
ngAfterViewInit() {
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -46,10 +46,13 @@ export class StepComponent implements OnInit {
|
||||||
|
|
||||||
@Input() step: Step;
|
@Input() step: Step;
|
||||||
|
|
||||||
ngOnInit() { console.log("Step", this.step.prompt); }
|
ngOnInit() { console.log("Step", this.step); }
|
||||||
|
|
||||||
update() {
|
update() {
|
||||||
|
|
||||||
|
console.log(this.step.fields);
|
||||||
|
|
||||||
|
/* Check for completeness */
|
||||||
for (let field of this.step.fields) {
|
for (let field of this.step.fields) {
|
||||||
if (!field.ok) {
|
if (!field.ok) {
|
||||||
this.step.ok = false;
|
this.step.ok = false;
|
||||||
|
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.4 KiB |
16
src/types.d.ts
vendored
16
src/types.d.ts
vendored
|
|
@ -1,3 +1,11 @@
|
||||||
|
declare interface TextOptions {
|
||||||
|
modifier: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
declare interface RadioOptions {
|
||||||
|
choices: string[];
|
||||||
|
}
|
||||||
|
|
||||||
declare interface Field {
|
declare interface Field {
|
||||||
type: string;
|
type: string;
|
||||||
id: string;
|
id: string;
|
||||||
|
|
@ -19,11 +27,3 @@ declare interface Form {
|
||||||
step: number;
|
step: number;
|
||||||
steps: Step[];
|
steps: Step[];
|
||||||
}
|
}
|
||||||
|
|
||||||
declare interface Entry {
|
|
||||||
name: string;
|
|
||||||
eid: string;
|
|
||||||
asset: string;
|
|
||||||
complete: boolean;
|
|
||||||
photo: string;
|
|
||||||
}
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue