From f72cc8a8023e7555cfaa59233187ecf3871219d1 Mon Sep 17 00:00:00 2001
From: Huffle <knaepen.selina@gmail.com>
Date: Sun, 18 May 2025 10:48:52 +0200
Subject: [PATCH] test
---
README.md | 9 +++-
.../src/app/app-routing.module.ts | 1 +
.../src/app/app.module.ts | 4 +-
.../edit-task/edit-task-routing.module.ts | 17 +++++++
.../app/pages/edit-task/edit-task.module.ts | 21 +++++++++
.../app/pages/edit-task/edit-task.page.html | 21 +++++++++
.../app/pages/edit-task/edit-task.page.scss | 0
.../pages/edit-task/edit-task.page.spec.ts | 17 +++++++
.../src/app/pages/edit-task/edit-task.page.ts | 46 +++++++++++++++++++
.../src/app/pages/tabs/tabs-routing.module.ts | 2 +-
.../app/pages/tasks/tasks-routing.module.ts | 4 ++
.../src/app/pages/tasks/tasks.page.ts | 11 ++++-
.../src/app/services/task.service.ts | 11 ++---
13 files changed, 153 insertions(+), 11 deletions(-)
create mode 100644 frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task-routing.module.ts
create mode 100644 frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.module.ts
create mode 100644 frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.html
create mode 100644 frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.scss
create mode 100644 frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.spec.ts
create mode 100644 frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.ts
diff --git a/README.md b/README.md
index 4638ab0..9760ed8 100644
--- a/README.md
+++ b/README.md
@@ -2,8 +2,15 @@
An improved Allowance Planner app.
## Running backend
-In order to run the backend, go to the `backend directory and run:
+In order to run the backend, go to the `backend` directory and run:
```bash
$ go run .
```
+
+## Running frontend
+In order to run the frontend, go to the `allowance-planner-v2` directory in the `frontend` directory and run:
+
+```bash
+$ ionic serve
+```
diff --git a/frontend/allowance-planner-v2/src/app/app-routing.module.ts b/frontend/allowance-planner-v2/src/app/app-routing.module.ts
index ffe16e8..2750f02 100644
--- a/frontend/allowance-planner-v2/src/app/app-routing.module.ts
+++ b/frontend/allowance-planner-v2/src/app/app-routing.module.ts
@@ -11,6 +11,7 @@ const routes: Routes = [
path: '',
loadChildren: () => import('./pages/tabs/tabs.module').then(m => m.TabsPageModule)
},
+
];
@NgModule({
imports: [
diff --git a/frontend/allowance-planner-v2/src/app/app.module.ts b/frontend/allowance-planner-v2/src/app/app.module.ts
index a6c06b7..64e58db 100644
--- a/frontend/allowance-planner-v2/src/app/app.module.ts
+++ b/frontend/allowance-planner-v2/src/app/app.module.ts
@@ -3,11 +3,12 @@ import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';
import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
-import { Drivers, Storage } from '@ionic/storage';
+import { Drivers } from '@ionic/storage';
import { IonicStorageModule } from '@ionic/storage-angular';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
+import { ReactiveFormsModule } from '@angular/forms';
@NgModule({
declarations: [AppComponent],
@@ -15,6 +16,7 @@ import { AppComponent } from './app.component';
BrowserModule,
IonicModule.forRoot(),
AppRoutingModule,
+ ReactiveFormsModule,
IonicStorageModule.forRoot({
name: '__mydb',
driverOrder: [Drivers.IndexedDB, Drivers.LocalStorage]
diff --git a/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task-routing.module.ts b/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task-routing.module.ts
new file mode 100644
index 0000000..cd1cb56
--- /dev/null
+++ b/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task-routing.module.ts
@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { EditTaskPage } from './edit-task.page';
+
+const routes: Routes = [
+ {
+ path: '',
+ component: EditTaskPage,
+ }
+];
+
+@NgModule({
+ imports: [RouterModule.forChild(routes)],
+ exports: [RouterModule],
+})
+export class EditTaskPageRoutingModule {}
diff --git a/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.module.ts b/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.module.ts
new file mode 100644
index 0000000..6e427b8
--- /dev/null
+++ b/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.module.ts
@@ -0,0 +1,21 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { EditTaskPageRoutingModule } from './edit-task-routing.module';
+
+import { EditTaskPage } from './edit-task.page';
+
+@NgModule({
+ imports: [
+ CommonModule,
+ FormsModule,
+ IonicModule,
+ EditTaskPageRoutingModule,
+ ReactiveFormsModule
+ ],
+ declarations: [EditTaskPage]
+})
+export class EditTaskPageModule {}
diff --git a/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.html b/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.html
new file mode 100644
index 0000000..012da72
--- /dev/null
+++ b/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.html
@@ -0,0 +1,21 @@
+<ion-header [translucent]="true">
+ <ion-toolbar>
+ <ion-title *ngIf="isAddMode">Create Task</ion-title>
+ <ion-title **ngIf="!isAddMode">Edit Task</ion-title>
+ </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+ <form [formGroup]="form">
+ <label>Task Name</label>
+ <input id="name" type="text" formControlName="name"/>
+
+ <label>Reward</label>
+ <input id="name" type="number" formControlName="reward"/>
+
+ <button type="button" [disabled]="!form.valid">
+ <span *ngIf="isAddMode">Add Task</span>
+ <span *ngIf="!isAddMode">Update Task</span>
+ </button>
+ </form>
+</ion-content>
diff --git a/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.scss b/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.scss
new file mode 100644
index 0000000..e69de29
diff --git a/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.spec.ts b/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.spec.ts
new file mode 100644
index 0000000..5887782
--- /dev/null
+++ b/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.spec.ts
@@ -0,0 +1,17 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { EditTaskPage } from './edit-task.page';
+
+describe('EditTaskPage', () => {
+ let component: EditTaskPage;
+ let fixture: ComponentFixture<EditTaskPage>;
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(EditTaskPage);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.ts b/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.ts
new file mode 100644
index 0000000..3f464a6
--- /dev/null
+++ b/frontend/allowance-planner-v2/src/app/pages/edit-task/edit-task.page.ts
@@ -0,0 +1,46 @@
+import { Component, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { ActivatedRoute } from '@angular/router';
+import { TaskService } from 'src/app/services/task.service';
+
+@Component({
+ selector: 'app-edit-task',
+ templateUrl: './edit-task.page.html',
+ styleUrls: ['./edit-task.page.scss'],
+ standalone: false,
+})
+export class EditTaskPage implements OnInit {
+ form: FormGroup;
+ id: number;
+ isAddMode: boolean;
+
+ constructor(
+ private route: ActivatedRoute,
+ private formBuilder: FormBuilder,
+ private taskService: TaskService,
+ ) {
+ console.log('Test?')
+ this.id = this.route.snapshot.params['id'];
+ this.isAddMode = !this.id;
+
+ this.form = this.formBuilder.group({
+ name: ['', Validators.required],
+ reward: ['', Validators.required],
+ assigned: ['', Validators.required]
+ });
+ }
+
+ ngOnInit() {
+ console.log('Test?')
+ if (!this.isAddMode) {
+ this.taskService.getTaskById(this.id).subscribe(task => {
+ this.form.setValue({
+ name: task.name,
+ reward: task.reward,
+ assigned: task.assigned
+ })
+ });
+ }
+ }
+
+}
diff --git a/frontend/allowance-planner-v2/src/app/pages/tabs/tabs-routing.module.ts b/frontend/allowance-planner-v2/src/app/pages/tabs/tabs-routing.module.ts
index 52d6683..60ba0ae 100644
--- a/frontend/allowance-planner-v2/src/app/pages/tabs/tabs-routing.module.ts
+++ b/frontend/allowance-planner-v2/src/app/pages/tabs/tabs-routing.module.ts
@@ -17,7 +17,7 @@ const routes: Routes = [
},
{
path: 'tasks',
- loadChildren: () => import('../tasks/tasks.module').then(m => m.TasksPageModule)
+ loadChildren: () => import('../tasks/tasks.module').then(m => m.TasksPageModule),
},
{
path: '',
diff --git a/frontend/allowance-planner-v2/src/app/pages/tasks/tasks-routing.module.ts b/frontend/allowance-planner-v2/src/app/pages/tasks/tasks-routing.module.ts
index a3945ac..df12f3a 100644
--- a/frontend/allowance-planner-v2/src/app/pages/tasks/tasks-routing.module.ts
+++ b/frontend/allowance-planner-v2/src/app/pages/tasks/tasks-routing.module.ts
@@ -6,6 +6,10 @@ const routes: Routes = [
{
path: '',
component: TasksPage,
+ children: [
+ { path: 'add', loadChildren: () => import('../edit-task/edit-task.module').then(m => m.EditTaskPageModule) },
+ { path: 'edit/:id', loadChildren: () => import('../edit-task/edit-task.module').then(m => m.EditTaskPageModule) }
+ ]
}
];
diff --git a/frontend/allowance-planner-v2/src/app/pages/tasks/tasks.page.ts b/frontend/allowance-planner-v2/src/app/pages/tasks/tasks.page.ts
index 37ed163..488e280 100644
--- a/frontend/allowance-planner-v2/src/app/pages/tasks/tasks.page.ts
+++ b/frontend/allowance-planner-v2/src/app/pages/tasks/tasks.page.ts
@@ -1,6 +1,7 @@
import { Component, OnInit } from '@angular/core';
import { TaskService } from 'src/app/services/task.service';
import { Task } from 'src/app/models/task';
+import { ActivatedRoute, Router } from '@angular/router';
@Component({
selector: 'app-tasks',
@@ -12,16 +13,22 @@ export class TasksPage implements OnInit {
public tasks: Array<Task> = [];
constructor(
- private taskService: TaskService
+ private taskService: TaskService,
+ private router: Router,
+ private route: ActivatedRoute
) {}
ngOnInit(): void {
+ this.getTasks();
+ }
+
+ getTasks() {
this.taskService.getTaskList().subscribe(tasks => {
this.tasks = tasks;
});
}
createTask() {
- this.taskService.createTask({ name: 'Created task', reward: 10, assigned: 1 });
+ this.router.navigate(['edit', 1], { relativeTo: this.route });
}
}
diff --git a/frontend/allowance-planner-v2/src/app/services/task.service.ts b/frontend/allowance-planner-v2/src/app/services/task.service.ts
index 959d0b5..ed1179b 100644
--- a/frontend/allowance-planner-v2/src/app/services/task.service.ts
+++ b/frontend/allowance-planner-v2/src/app/services/task.service.ts
@@ -8,11 +8,6 @@ import { Task } from '../models/task';
})
export class TaskService {
private url = 'http://localhost:8080/api';
- private headers = {
- "access-control-allow-origin": "*",
- 'Access-Control-Allow-Headers': 'Content-Type, Authorization',
- 'Access-Control-Allow-Methods': '*',
- };
constructor(private http: HttpClient) {}
@@ -20,7 +15,11 @@ export class TaskService {
return this.http.get<Task[]>(`${this.url}/tasks`);
}
+ getTaskById(taskId: number): Observable<Task> {
+ return this.http.get<Task>(`${this.url}/task/${taskId}`);
+ }
+
createTask(task: Partial<Task>) {
- this.http.post(`${this.url}/tasks`, task, { headers: this.headers }).subscribe(t => console.log('TEST: ', t));
+ this.http.post(`${this.url}/tasks`, task).subscribe();
}
}
\ No newline at end of file