Merge pull request #47 from hadesdday/hoang

#4 remember password and contact

db.json

@@ -203,5 +203,14 @@
       ],
       "id": 2
     }
+  ],
+  "contact": [
+    {
+      "email": "[email protected]",
+      "name": "hoang",
+      "title": "hoang",
+      "text": "abcaaaaa",
+      "id": 1
+    }
   ]
 }

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"
 }

src/app/_service/auth.service.ts

@@ -30,8 +30,15 @@ export class AuthService {
       if (user) {
         if (user.comfirmToken === "ok") {
           this.tokenStorage.saveUser(user);
-          console.log(user);
           localStorage.setItem("isSignin", "true");
+          if (siginForm.value.rememberCheck == true) {
+            this.tokenStorage.rememberAccount({
+              "email": user.email,
+              "password": user.password,
+            })
+          }else{
+            this.tokenStorage.deleteRememberInfo()
+          }
           siginForm.reset();
           this.router.navigate(['home'])
         } else {

src/app/_service/token-storage.service.ts

@@ -1,7 +1,7 @@
-import { Injectable } from '@angular/core';
-import { Router } from '@angular/router';
+import {Injectable} from '@angular/core';
+import {Router} from '@angular/router';
 
-const TOKEN_KEY = 'auth-token';
+const REMEMBER_KEY = 'remember-token';
 const USER_KEY = 'auth-user'
 
 @Injectable({
@@ -13,7 +13,9 @@ export class TokenStorageService {
   }
 
   signOut(): void {
-    localStorage.clear();
+
+    localStorage.removeItem(USER_KEY);
+    localStorage.removeItem("isSignin");
     this.router.navigate(['/signin']);
   }
 
@@ -31,14 +33,31 @@ export class TokenStorageService {
     localStorage.setItem(USER_KEY, JSON.stringify(user));
   }
 
+  public rememberAccount(account: any): void {
+    localStorage.setItem(REMEMBER_KEY, JSON.stringify(account));
+  }
+
+  public getRememberAccount(): any {
+    const account = localStorage.getItem(REMEMBER_KEY);
+    if (account) {
+      return JSON.parse(account)
+    }
+    return {}
+  }
+
+  public deleteRememberInfo(): void {
+    localStorage.removeItem(REMEMBER_KEY);
+  }
+
   public getUser(): any {
     const user = localStorage.getItem(USER_KEY);
     if (user) {
       return JSON.parse(user)
     }
     return {}
   }
-  public isSignin():any{
-   return localStorage.getItem("isSignin") == "true"
+
+  public isSignin(): any {
+    return localStorage.getItem("isSignin") == "true"
   }
 }

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")
         })
       }
     })

src/app/auth/signin/signin-form/signin-form.component.ts

@@ -13,16 +13,18 @@ import {API_AUTH} from 'src/app/_api/apiURL';
 })
 export class SigninFormComponent implements OnInit {
   public siginForm !: FormGroup;
-
+  rememberAccount: any;
 
   constructor(private formBuilder: FormBuilder, private http: HttpClient, private router: Router, private authService: AuthService, private tokenStorage: TokenStorageService) {
   }
 
   ngOnInit(): void {
+    this.rememberAccount = this.tokenStorage.getRememberAccount()
+
     this.siginForm = this.formBuilder.group({
-      email: new FormControl("", [Validators.required, Validators.email]),
-      password: new FormControl("", [Validators.required]),
-      rememberCheck: new FormControl("")
+      email: new FormControl(this.rememberAccount.email, [Validators.required, Validators.email]),
+      password: new FormControl(this.rememberAccount.password, [Validators.required]),
+      rememberCheck: new FormControl(this.rememberAccount!={})
     })
   }
 

src/app/pages/contact/contact.component.html

@@ -4,30 +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="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>
+<app-footer></app-footer>

src/app/pages/contact/contact.component.scss

@@ -26,5 +26,10 @@
         height: 150px;
       }
     }
+    .submit-panel{
+      display: flex;
+      flex-direction: row-reverse;
+      margin-top: 10px;
+    }
   }
 }

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!!")
+    });
+  }
 }