#4 - add contact

hadesdday · Aug 22, 2022 · de8b0f8 · de8b0f8
1 parent 5369bbc
commit de8b0f8
Show file tree

Hide file tree

Showing 5 changed files with 71 additions and 35 deletions.
diff --git a/db.json b/db.json
@@ -203,5 +203,14 @@
       ],
       "id": 2
     }
+  ],
+  "contact": [
+    {
+      "email": "[email protected]",
+      "name": "hoang",
+      "title": "hoang",
+      "text": "abcaaaaa",
+      "id": 1
+    }
   ]
 }
diff --git a/src/app/_api/apiURL.ts b/src/app/_api/apiURL.ts
@@ -29,5 +29,6 @@ export const API_URL = {
   GET_LIST: "https://api-news-vietnamnet.herokuapp.com/api/get/",
   SEARCH: "https://api-news-vietnamnet.herokuapp.com/api/search/",
   ARTICLE_DETAILS: "https://api-news-vietnamnet.herokuapp.com/article/",
-  ARTICLE_SAVED: "http://localhost:3000/saved-post"
+  ARTICLE_SAVED: "http://localhost:3000/saved-post",
+  CONTACT:"http://localhost:3000/contact"
 }
diff --git a/src/app/auth/register/register-form/register-form.component.ts b/src/app/auth/register/register-form/register-form.component.ts
@@ -6,6 +6,7 @@ import {
 } from "@angular/forms";
 import {Router} from "@angular/router";
 import {AuthService} from "../../../_service/auth.service";
+import {CommonService} from "../../../_service/common.service";
 
 export function comparePassword(c: AbstractControl) {
   const v = c.value;
@@ -24,7 +25,7 @@ export class RegisterFormComponent implements OnInit {
   public registerForm !: FormGroup;
   submitted = false;
 
-  constructor(private formBuilder: FormBuilder, private http: HttpClient, private router: Router, private authService: AuthService) {
+  constructor(private formBuilder: FormBuilder, private http: HttpClient,private commonService: CommonService, private router: Router, private authService: AuthService) {
   }
 
   ngOnInit(): void {
@@ -53,11 +54,11 @@ export class RegisterFormComponent implements OnInit {
         alert("email đã đăng kí tài khoản. xin sử dụng email khác !")
       } else if (!this.registerForm.hasError('passwordnotmatch', ['pw']) && this.registerForm.value['termCheck'] == true) {
         this.authService.register(this.registerForm.value['email'], this.registerForm.controls['pw'].value.password).subscribe(res => {
-          alert("register success");
+          this.commonService.toastSuccess("Đăng kí thành công thành công!")
 
           this.router.navigate(['signin']);
         }, error => {
-          alert("register false ")
+          this.commonService.toastError("Đăng kí thất bại!! Xin vui lòng thử lại")
         })
       }
     })

diff --git a/src/app/pages/contact/contact.component.html b/src/app/pages/contact/contact.component.html
@@ -4,36 +4,35 @@
     <div class="contact-title">
       <h1>Liên hệ tòa soạn</h1>
     </div>
-    <div class="input-group flex-nowrap">
-      <span class="input-group-text border-0" id="input-name"><strong>Họ và Tên</strong></span>
-      <input type="text" class="form-control" placeholder="Họ và Tên" aria-label="name"
-             aria-describedby="addon-wrapping"/>
-    </div>
-    <div class="input-group flex-nowrap">
-      <span class="input-group-text border-0" id="input-email"><strong>Email</strong></span>
-      <input type="text" class="form-control" placeholder="Email" aria-label="email"
-             aria-describedby="addon-wrapping"/>
-    </div>
-    <div class="input-group flex-nowrap">
-      <span class="input-group-text border-0" id="input-title"><strong>Tiêu đề</strong></span>
-      <input type="text" class="form-control" placeholder="Nhập tiêu đề" aria-label="title"
-             aria-describedby="addon-wrapping"/>
-    </div>
-    <div class="input-group flex-nowrap">
-      <span class="input-group-text border-0" id="input-address"><strong>Chọn file</strong></span>
-      <input type="file" class="form-control" placeholder="file" aria-label="file" aria-describedby="addon-wrapping"/>
-    </div>
+    <form [formGroup]="contactForm" (ngSubmit)="contact()">
+      <div class="input-group flex-nowrap">
+        <span class="input-group-text border-0" id="input-name"><strong>Họ và Tên</strong></span>
+        <input type="text" class="form-control" placeholder="Họ và Tên" aria-label="name"
+               aria-describedby="addon-wrapping" formControlName="name"/>
+      </div>
+      <div class="input-group flex-nowrap">
+        <span class="input-group-text border-0" id="input-email"><strong>Email</strong></span>
+        <input type="text" class="form-control" placeholder="Email" aria-label="email"
+               aria-describedby="addon-wrapping" formControlName="email"/>
+      </div>
+      <div class="input-group flex-nowrap">
+        <span class="input-group-text border-0" id="input-title"><strong>Tiêu đề</strong></span>
+        <input type="text" class="form-control" placeholder="Nhập tiêu đề" aria-label="title"
+               aria-describedby="addon-wrapping" formControlName="title"/>
+      </div>
 
-    <div class="input-group flex-nowrap">
-      <span class="input-group-text border-0" id="input-text-field"><strong>Nội dung</strong></span>
-      <textarea class="form-control context rounded" aria-label="With textarea"></textarea>
-    </div>
-    <div class="submit-panel">
-      <button class="btn btn-primary btn-rounded" type="submit" id="button-accept-signin" mdbRipple
-              rippleColor="danger">
-        Gửi
-      </button>
-    </div>
+
+      <div class="input-group flex-nowrap">
+        <span class="input-group-text border-0" id="input-text-field"><strong>Nội dung</strong></span>
+        <textarea class="form-control context rounded" aria-label="With textarea" formControlName="text"></textarea>
+      </div>
+      <div class="submit-panel">
+        <button class="btn btn-primary btn-rounded" type="submit" id="button-accept-signin" mdbRipple
+                rippleColor="danger">
+          Gửi
+        </button>
+      </div>
+    </form>
   </div>
 </div>
 <app-footer></app-footer>
diff --git a/src/app/pages/contact/contact.component.ts b/src/app/pages/contact/contact.component.ts
@@ -1,15 +1,41 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, OnInit} from '@angular/core';
+import {FormBuilder, FormControl, Validators} from "@angular/forms";
+import {HttpClient} from "@angular/common/http";
+import {Router} from "@angular/router";
+import {API_AUTH, API_URL} from "../../_api/apiURL";
+import {CommonService} from "../../_service/common.service";
 
 @Component({
   selector: 'app-contact',
   templateUrl: './contact.component.html',
   styleUrls: ['./contact.component.scss']
 })
 export class ContactComponent implements OnInit {
+  contactForm: any;
 
-  constructor() { }
+  constructor(private formBuilder: FormBuilder, private http: HttpClient,private commonService: CommonService, private router: Router) {
+  }
 
   ngOnInit(): void {
+    this.contactForm = this.formBuilder.group({
+      email: new FormControl("", [Validators.required, Validators.email]),
+      name: new FormControl("", [Validators.required]),
+      title: new FormControl("", [Validators.required]),
+      text: new FormControl("", [Validators.required])
+    })
   }
 
+  contact() {
+    this.http.post<any>(API_URL.CONTACT, {
+      "email": this.contactForm.value.email,
+      "name": this.contactForm.value.name,
+      "title": this.contactForm.value.title,
+      "text": this.contactForm.value.text
+    }).subscribe(res => {
+      this.commonService.toastSuccess("Gửi tin thành công thành công!")
+      window.location.reload();
+    },error => {
+      this.commonService.toastError("Gửi tin thất bại!!")
+    });
+  }
 }