From 11e1d5dd1138248e631cf5a63cbdaa001990281f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tormod=20Nyg=C3=A5rd?= <tormodny@stud.ntnu.no>
Date: Sat, 13 Feb 2021 13:14:12 +0100
Subject: [PATCH] Issue: Basic form for post (#3)
Co-authored-by: Hanna Pelsholen Busterud <hannapb@ntnu.no>
---
client/src/app/models/post.model.ts | 60 +++++++++++++------
.../posts/post-form/post-form.component.html | 24 ++++++--
.../posts/post-form/post-form.component.ts | 43 ++++++-------
client/src/app/posts/post.module.ts | 5 +-
client/src/app/posts/post.service.spec.ts | 1 +
client/src/app/posts/post.service.ts | 15 ++++-
.../text-input/text-input.component.html | 1 +
.../shared/text-input/text-input.component.ts | 11 ++--
client/tsconfig.json | 2 +-
server/src/controllers/postController.ts | 8 +--
10 files changed, 112 insertions(+), 58 deletions(-)
diff --git a/client/src/app/models/post.model.ts b/client/src/app/models/post.model.ts
index cf9fd4d..3e4c006 100644
--- a/client/src/app/models/post.model.ts
+++ b/client/src/app/models/post.model.ts
@@ -8,22 +8,28 @@ export class Post implements Deserializable, Serializable {
private timestamp: Date;
private owner: string;
private imageUrl: string;
+ private price: number;
+ private categoryid: number;
constructor(input: any = null) {
if (input) {
this.id = input.id;
this.title = input.title;
this.description = input.description;
- this.timestamp = new Date(input.timestamp);
+ this.timestamp = input.timestamp;
this.owner = input.owner;
this.imageUrl = input.imageUrl;
+ this.price = input.price;
+ this.categoryid = input.categoryid;
} else {
this.id = 0;
- this.title = "";
- this.description = "";
+ this.title = null;
+ this.description = null;
this.timestamp = new Date();
- this.owner = "";
- this.imageUrl = "";
+ this.owner = null;
+ this.imageUrl = null;
+ this.price = null;
+ this.categoryid = null;
}
}
@@ -42,55 +48,73 @@ export class Post implements Deserializable, Serializable {
description: this.description,
timestamp: this.timestamp.valueOf(),
owner: this.owner,
- imageUrl: this.imageUrl
+ imageUrl: this.imageUrl,
+ price: this.price,
+ categoryid: this.categoryid
};
}
- get getId () {
+ get getId() {
return this.id;
}
- set setId (id: number) {
+ set setId(id: number) {
this.id = id;
}
- get getTitle () {
+ get getTitle() {
return this.title;
}
- set setTitle (title: string) {
+ set setTitle(title: string) {
this.title = title;
}
- get getDescription () {
+ get getDescription() {
return this.description;
}
- set setDescription (description: string) {
+ set setDescription(description: string) {
this.description = description;
}
- get getTimestamp () {
+ get getTimestamp() {
return this.timestamp;
}
- set setTimestamp (timestamp: Date) {
+ set setTimestamp(timestamp: Date) {
this.timestamp = timestamp;
}
- get getOwner () {
+ get getOwner() {
return this.owner;
}
- set setOwner (owner: string) {
+ set setOwner(owner: string) {
this.owner = owner;
}
- get getImageUrl () {
+ get getImageUrl() {
return this.imageUrl;
}
- set setImageUrl (imageUrl: string) {
+ set setImageUrl(imageUrl: string) {
this.imageUrl = imageUrl;
}
+
+ get getPrice() {
+ return this.price;
+ }
+
+ set setPrice(price: number) {
+ this.price = price;
+ }
+
+ get getCategory() {
+ return this.categoryid;
+ }
+
+ set setCategory(categoryid: number) {
+ this.categoryid = categoryid;
+ }
}
\ No newline at end of file
diff --git a/client/src/app/posts/post-form/post-form.component.html b/client/src/app/posts/post-form/post-form.component.html
index 51f1e96..1593251 100644
--- a/client/src/app/posts/post-form/post-form.component.html
+++ b/client/src/app/posts/post-form/post-form.component.html
@@ -1,8 +1,20 @@
-<p>Post from DB:</p>
+<h3>Lag annonse</h3>
-<p>Title: {{displayPost.getTitle}}</p>
-<p>Description: {{displayPost.getDescription}}</p>
-<p>Timestamp: {{displayPost.getTimestamp}}</p>
-<p>Owner: {{displayPost.getOwner}}</p>
+<label for="title">Title</label>
+<input id="title" [(ngModel)]="title">
-<app-text-input></app-text-input>
\ No newline at end of file
+<label for="description">Description</label>
+
+<input id="description" [(ngModel)]="description">
+
+<label for="price">Pris</label>
+<input id="price" [(ngModel)]="price">
+
+<label for="category">Kategori</label>
+<select id="category" [(ngModel)]="categoryid">
+ <option value="1">Antikviteter og Kunst</option>
+ <option value="2">Dyr og Utstyr</option>
+ <option value="3">Elektronikk og Hvitevarer</option>
+</select>
+
+<button (click)="publishPost()">Publiser</button>
\ No newline at end of file
diff --git a/client/src/app/posts/post-form/post-form.component.ts b/client/src/app/posts/post-form/post-form.component.ts
index 212b515..ff2ec99 100644
--- a/client/src/app/posts/post-form/post-form.component.ts
+++ b/client/src/app/posts/post-form/post-form.component.ts
@@ -9,30 +9,33 @@ import { PostService } from '../post.service';
})
export class PostFormComponent implements OnInit {
- serializedPost: Object = {};
- deserializedPost: Post = new Post();
- displayPost: Post = new Post();
-
+ title: string = "";
+ description: string = "";
+ price: number = 0;
+ categoryid: number;
+
constructor(private postService: PostService) { }
ngOnInit(): void {
- let post = new Post({
- id: 0,
- title: "TestAnnonse",
- description: "Beskrivelse",
- timestamp: 1612952332000,
- owner: "Admin",
- imageUrl: "url"
- });
- this.serializedPost = post.serialize();
- this.deserializedPost.deserialize(post.serialize());
+ }
- this.postService.getPost(1)
- .then((gettedPost: Post) => {
- this.displayPost = gettedPost;
- }).catch((err: any) => {
- console.log(err);
+ publishPost() {
+ let newPost = new Post({
+ title: this.title,
+ description: this.description,
+ timestamp: new Date(),
+ owner: "admin",
+ imageUrl: "",
+ price: this.price,
+ categoryid: this.categoryid
+ });
+ console.log(newPost);
+ this.postService.addPost(newPost).then(status => {
+ // Flytte til annonsevisning
+ console.log("Post was added: " + status);
+ }).catch(error => {
+ console.log("Error adding post: " + error);
});
}
-}
+}
\ No newline at end of file
diff --git a/client/src/app/posts/post.module.ts b/client/src/app/posts/post.module.ts
index 6abbc81..5599cc3 100644
--- a/client/src/app/posts/post.module.ts
+++ b/client/src/app/posts/post.module.ts
@@ -2,6 +2,7 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { PostFormComponent } from './post-form/post-form.component';
import { SharedModule } from '../shared/shared.module';
+import { FormsModule } from '@angular/forms';
@@ -11,7 +12,9 @@ import { SharedModule } from '../shared/shared.module';
],
imports: [
CommonModule,
- SharedModule
+ SharedModule,
+ FormsModule
]
})
+
export class PostModule { }
diff --git a/client/src/app/posts/post.service.spec.ts b/client/src/app/posts/post.service.spec.ts
index ead1865..56f2313 100644
--- a/client/src/app/posts/post.service.spec.ts
+++ b/client/src/app/posts/post.service.spec.ts
@@ -17,3 +17,4 @@ describe('PostService', () => {
expect(service).toBeTruthy();
});
});
+
diff --git a/client/src/app/posts/post.service.ts b/client/src/app/posts/post.service.ts
index 312369b..f083213 100644
--- a/client/src/app/posts/post.service.ts
+++ b/client/src/app/posts/post.service.ts
@@ -19,12 +19,16 @@ export class PostService {
const post = new Post();
post.deserialize(data.data[0]);
if (post.getId == 0) {
- reject("Could not find with Post with id: " + id);
+ reject("Could not find Post with id: " + id);
}
resolve(post);
} catch (err: any) {
reject(err);
}
+ },
+ (err: any) => {
+ console.log(err.message);
+ reject(err);
});
}
);
@@ -34,15 +38,20 @@ export class PostService {
return this.http.get(this.postUrl + id);
}
- addPost(post: Post): Promise<boolean> {
- return new Promise<boolean>(
+ addPost(post: Post): Promise<string> {
+ return new Promise<string>(
(resolve, reject) => {
this.add_post(post).subscribe((data: any) => {
try {
+ console.log(data);
resolve(data.status);
} catch (err: any) {
reject(err);
}
+ },
+ (err: any) => {
+ console.log(err.message);
+ reject(err);
});
}
);
diff --git a/client/src/app/shared/text-input/text-input.component.html b/client/src/app/shared/text-input/text-input.component.html
index 45be20b..75c9ae0 100644
--- a/client/src/app/shared/text-input/text-input.component.html
+++ b/client/src/app/shared/text-input/text-input.component.html
@@ -1 +1,2 @@
+<label for="textField">{{label}}</label>
<input type="text" id="textField">
\ No newline at end of file
diff --git a/client/src/app/shared/text-input/text-input.component.ts b/client/src/app/shared/text-input/text-input.component.ts
index a739874..57eb5e8 100644
--- a/client/src/app/shared/text-input/text-input.component.ts
+++ b/client/src/app/shared/text-input/text-input.component.ts
@@ -1,15 +1,16 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, Input, OnInit, Output } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
@Component({
selector: 'app-text-input',
templateUrl: './text-input.component.html',
styleUrls: ['./text-input.component.scss']
})
-export class TextInputComponent implements OnInit {
+export class TextInputComponent {
+
+ @Input()
+ label: string = "";
constructor() { }
- ngOnInit(): void {
- }
-
}
diff --git a/client/tsconfig.json b/client/tsconfig.json
index 94a24fe..b8d1a82 100644
--- a/client/tsconfig.json
+++ b/client/tsconfig.json
@@ -5,7 +5,7 @@
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"forceConsistentCasingInFileNames": true,
- "strict": true,
+ "strict": false,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"sourceMap": true,
diff --git a/server/src/controllers/postController.ts b/server/src/controllers/postController.ts
index 99fa90a..5651ca2 100644
--- a/server/src/controllers/postController.ts
+++ b/server/src/controllers/postController.ts
@@ -8,25 +8,25 @@ interface IPost {
description: string;
timestamp: number;
owner: string;
- category: string;
+ categoryid: number;
imageUrl: string;
}
/* ============================= CREATE ============================= */
// Create posts `/api/post/`
//'{"title":"test3","description":"test3","timestamp":123123,"owner":"test3","category":"test3","imageUrl":"test3"}'
router.route('/').post(async (request: Request, response: Response) => {
- const {title, description, timestamp, owner, category, imageUrl} = request.body;
+ const {title, description, timestamp, owner, categoryid, imageUrl} = request.body;
try {
const post: IPost = {
"title": title,
"description": description,
"timestamp": timestamp,
"owner": owner,
- "category": category,
+ "categoryid": categoryid,
"imageUrl": imageUrl
};
if (Object.values(post).filter(p => p == undefined).length > 0) return response.status(500).send("Error");
- const input = (`INSERT INTO post(title, description, timestamp, owner, category, imageUrl) VALUES (?,?,?,?,?,?)`)
+ const input = (`INSERT INTO post(title, description, timestamp, owner, categoryid, imageUrl) VALUES (?,?,?,?,?,?)`)
return response.status(200).json(
await query(input,Object.values(post))
);
--
GitLab