nezumi/foodify-frontend
1
0
Fork 0
mirror of https://github.com/Nezumi-2711/foodify-frontend.git synced 2026-09-22 13:38:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

Deployment 26.4.2023

Browse Source
This commit is contained in:
Nguyen Ha Khue
2023-04-26 18:28:36 +07:00
parent 1519a06bec
commit 8fb8041afd
13 changed files with 364 additions and 219 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/components/auth/auth.module.ts
+5 -1
View File
@@ -1,5 +1,7 @@
import { NgModule } from "@angular/core";
import { CommonModule } from "@angular/common";
import { environment } from "../../../environments/environment";
import firebase from 'firebase/compat/app';
import { AuthRoutingModule } from "./auth-routing.module";
import { LoginComponent } from "./login/login.component";
@@ -15,6 +17,8 @@ import { SendEmailComponent } from './send-email/send-email.component';
import { EmailVerifiedComponent } from './email-verified/email-verified.component';
import { EmailNotVerifiedComponent } from './email-not-verified/email-not-verified.component';
firebase.initializeApp(environment.firebaseConfig);
@NgModule({
declarations: [LoginComponent, SignupComponent, ForbiddenComponent, ResetPasswordComponent, SendEmailComponent, EmailVerifiedComponent, EmailNotVerifiedComponent],
imports: [
@@ -24,6 +28,6 @@ import { EmailNotVerifiedComponent } from './email-not-verified/email-not-verifi
CarouselModule,
SharedModule,
NgbModule,
FormsModule],
FormsModule]
})
export class AuthModule { }
src/app/components/auth/login/login.component.html
+7 -4
View File
@@ -147,13 +147,15 @@
<form [formGroup]="loginForm" class="form-horizontal auth-form"
novalidate="">
<div class="form-group">
<input required="" name="login[username]" type="email"
class="form-control" placeholder="Email" formControlName="email"
<input style="font-family: Metrophobic;" required=""
name="login[username]" type="email" class="form-control"
placeholder="Email" formControlName="email"
id="exampleInputEmail1">
</div>
<div class="form-group">
<div class="form-control input-password-holder">
<input formControlName="password" class="input-password"
<input style="font-family: Metrophobic;"
formControlName="password" class="input-password"
type="{{ showPassword ? 'text' : 'password' }}" #pwc
placeholder="Xác nhận mật khẩu" />
<span class="icon-holder-eye"
@@ -167,7 +169,8 @@
formControlName="password"> -->
</div>
<div class="form-button d-flex justify-content-end">
<button class="btn btn-primary w-100 mt-0" type="submit"
<button style="font-family: Metrophobic;"
class="btn btn-primary w-100 mt-0" type="submit"
(click)="onSignIn()">Đăng nhập</button>
</div>
<div class="form-terms mt-1">
src/app/components/auth/signup/signup.component.html
+80 -35
View File
@@ -21,12 +21,12 @@
</div>
<div class="col-xl-8 col-md-7">
<div class="d-flex align-items-center">
<button *ngIf="!userImageChoosen" type="submit" class="btn btn-success"
(click)="chooseImg(chooseUserImage)">
<button style="font-family: Metrophobic;" *ngIf="!userImageChoosen" type="submit"
class="btn btn-success" (click)="chooseImg(chooseUserImage)">
Chọn ảnh
</button>
<button *ngIf="userImageChoosen" type="submit" class="btn btn-secondary"
(click)="chooseImg(chooseUserImage)">
<button style="font-family: Metrophobic;" *ngIf="userImageChoosen" type="submit"
class="btn btn-secondary" (click)="chooseImg(chooseUserImage)">
Thay đổi ảnh
</button>
<img class="rounded-circle border border-dark" [src]="avatar" *ngIf="avatar"
@@ -44,7 +44,8 @@
<label for="validationCustom0"><span>*</span> Họ và tên</label>
</div>
<div class="col-xl-8 col-md-7">
<input formControlName="fullName" class="form-control" type="text" placeholder="Họ và tên" />
<input style="font-family: Metrophobic;" formControlName="fullName" class="form-control"
type="text" placeholder="Họ và tên" />
<div *ngIf="userFullName?.invalid && (userFullName?.dirty || userFullName?.touched)"
class="alert alert-danger mt-1">
<div *ngIf="userFullName?.errors?.['required']">Vui lòng không được bỏ trống
@@ -61,7 +62,8 @@
<label for="validationCustom2"><span>*</span> Email</label>
</div>
<div class="col-xl-8 col-md-7">
<input formControlName="email" class="form-control" type="email" placeholder="Email" />
<input style="font-family: Metrophobic;" formControlName="email" class="form-control"
type="email" placeholder="Email" />
<div *ngIf="userEmail?.invalid && (userEmail?.dirty || userEmail?.touched)"
class="alert alert-danger mt-1">
<div *ngIf="userEmail?.errors?.['required']">Vui lòng không được bỏ trống
@@ -78,7 +80,8 @@
<label for="validationCustom2"><span>*</span> Ngày Sinh</label>
</div>
<div class="col-xl-8 col-md-7">
<input type="date" formControlName="dateOfBirth" class="form-control" placeholder="Ngày sinh" />
<input style="font-family: Metrophobic;" type="date" formControlName="dateOfBirth"
class="form-control" placeholder="Ngày sinh" />
<div *ngIf="userDateOfBirth?.invalid && (userDateOfBirth?.dirty || userDateOfBirth?.touched)"
class="alert alert-danger mt-1">
<div *ngIf="userDateOfBirth?.errors?.['required']">Vui lòng không được bỏ
@@ -92,9 +95,9 @@
<div class="col-xl-3 col-md-4">
<label for="validationCustom2"><span>*</span> Số Điện Thoại</label>
</div>
<div class="col-xl-8 col-md-7">
<input formControlName="phoneNumber" class="form-control" type="tel"
placeholder="Số điện thoại" />
<div class="col-xl-4 col-md-7">
<input style="font-family: Metrophobic;" formControlName="phoneNumber" class="form-control"
type="tel" placeholder="Số điện thoại" />
<div *ngIf="userPhoneNumber?.invalid && (userPhoneNumber?.dirty || userPhoneNumber?.touched)"
class="alert alert-danger mt-1">
<div *ngIf="userPhoneNumber?.errors?.['required']">Vui lòng không được bỏ
@@ -103,6 +106,25 @@
đa 10 số</div>
</div>
</div>
<div class="col-xl-2 col-md-4">
<button style="font-family: Metrophobic;" type="button" class="btn btn-secondary"
(click)="getOTP()">Gửi OTP</button>
</div>
<div class="col-xl-2 col-md-7">
<input style="font-family: Metrophobic;" formControlName="otp" class="form-control" type="tel"
placeholder="Mã OTP" />
</div>
</div>
<!-- phone number -->
<div class="form-group row">
<div class="col-xl-3 col-md-4">
<label for="validationCustom2"><span></span></label>
</div>
<div class="col-xl-8 col-md-7">
<div id="recapcha">
</div>
</div>
</div>
<!-- identified code -->
@@ -111,8 +133,8 @@
<label for="validationCustom2"><span>*</span> CMND/CCCD</label>
</div>
<div class="col-xl-8 col-md-7">
<input formControlName="identifiedCode" class="form-control" type="number"
placeholder="CMND/CCCD" />
<input style="font-family: Metrophobic;" formControlName="identifiedCode" class="form-control"
type="number" placeholder="CMND/CCCD" />
<div
*ngIf="userIdentifiedCode?.invalid && (userIdentifiedCode?.dirty || userIdentifiedCode?.touched)"
class="alert alert-danger mt-1">
@@ -124,15 +146,14 @@
</div>
</div>
<hr>
<!-- Address -->
<div class="form-group row">
<div class="col-xl-3 col-md-4">
<label for="validationCustom2"><span>*</span>Địa chỉ</label>
<label for="validationCustom2"><span>*</span> Địa chỉ</label>
</div>
<div class="col-xl-8 col-md-7">
<input formControlName="address" class="form-control" type="text" placeholder="Địa chỉ" />
<input style="font-family: Metrophobic;" formControlName="address" class="form-control"
type="text" placeholder="Địa chỉ" />
<div *ngIf="userAddress?.invalid && (userAddress?.dirty || userAddress?.touched)"
class="alert alert-danger mt-1">
<div *ngIf="userAddress?.errors?.['required']">Vui lòng không được bỏ
@@ -152,8 +173,10 @@
<label for="validationCustom2"><span>*</span> Quận</label>
</div>
<div class="col-xl-8 col-md-7">
<select [(ngModel)]="district" class="form-control" (change)="onDistrictSelected()">
<option [selected]="true" [ngValue]="'none'">--- Chọn quận ---</option>
<select style="font-family: Metrophobic;" [(ngModel)]="district" class="form-control"
(change)="onDistrictSelected()">
<option [selected]="true" [ngValue]="'none'">--- Chọn quận ---
</option>
<option *ngFor="let district of districts" [ngValue]="district.name">{{
district.name }}
</option>
@@ -166,12 +189,12 @@
</div>
<!-- Wards -->
<div *ngIf="isHaveDistrict" class="form-group row">
<div class="form-group row">
<div class="col-xl-3 col-md-4">
<label for="validationCustom2"><span>*</span> Phường</label>
</div>
<div class="col-xl-8 col-md-7">
<select [(ngModel)]="ward" class="form-control">
<select style="font-family: Metrophobic;" [(ngModel)]="ward" class="form-control">
<option [ngValue]="'none'">--- Chọn phường ---</option>
<option *ngFor="let ward of wards">{{ ward.name }}
</option>
@@ -191,7 +214,7 @@
</div>
<div class="col-xl-8 col-md-7">
<div class="form-control input-password-holder">
<input formControlName="password" class="input-password"
<input style="font-family: Metrophobic;" formControlName="password" class="input-password"
type="{{ showPassword ? 'text' : 'password' }}" placeholder="Mật khẩu" />
<span class="icon-holder-eye" (click)="showPassword = !showPassword">
<i class="{{ showPassword ? 'fa fa-eye-slash' : 'fa fa-eye' }}"></i>
@@ -218,8 +241,9 @@
</div>
<div class="col-xl-8 col-md-7">
<div class="form-control input-password-holder">
<input formControlName="confirmPassword" class="input-password"
type="{{ showPassword ? 'text' : 'password' }}" placeholder="Xác nhận mật khẩu" />
<input style="font-family: Metrophobic;" formControlName="confirmPassword"
class="input-password" type="{{ showPassword ? 'text' : 'password' }}"
placeholder="Xác nhận mật khẩu" />
<span class="icon-holder-eye" (click)="showPassword = !showPassword">
<i class="{{ showPassword ? 'fa fa-eye-slash' : 'fa fa-eye' }}"></i>
</span>
@@ -274,11 +298,11 @@
</div>
<div class="col-xl-8 col-md-7">
<div class="d-flex align-items-center">
<button *ngIf="!shopImageChoosen" type="submit" class="btn btn-success"
(click)="chooseImg(chooseShopImage)">Chọn
<button style="font-family: Metrophobic;" *ngIf="!shopImageChoosen" type="submit"
class="btn btn-success" (click)="chooseImg(chooseShopImage)">Chọn
ảnh</button>
<button *ngIf="shopImageChoosen" type="submit" class="btn btn-secondary"
(click)="chooseImg(chooseShopImage)">Thay đổi ảnh</button>
<button style="font-family: Metrophobic;" *ngIf="shopImageChoosen" type="submit"
class="btn btn-secondary" (click)="chooseImg(chooseShopImage)">Thay đổi ảnh</button>
</div>
<!-- <div *ngIf="!shopImageChoosen && (shopForm.get('banner')?.dirty || shopForm.get('banner')?.touched)" class="alert alert-danger mt-1">
<div *ngIf="shopForm.get('banner').errors?.['required']">Vui lòng chọn ảnh banner của shop.</div>
@@ -297,7 +321,8 @@
<label for="validationCustom2"><span>*</span>Tên shop</label>
</div>
<div class="col-xl-8 col-md-7">
<input formControlName="name" class="form-control" type="text" placeholder="Tên shop" />
<input style="font-family: Metrophobic;" formControlName="name" class="form-control"
type="text" placeholder="Tên shop" />
<div *ngIf="shopName?.invalid && (shopName?.dirty || shopName?.touched)"
class="alert alert-danger mt-1">
<div *ngIf="shopName?.errors?.['required']">Vui lòng không được bỏ trống tên shop</div>
@@ -313,8 +338,8 @@
<label for="validationCustom2"><span>*</span>Mô tả shop</label>
</div>
<div class="col-xl-8 col-md-7">
<textarea formControlName="description" class="form-control" type="text"
placeholder="Mô tả về shop"></textarea>
<textarea style="font-family: Metrophobic;" formControlName="description"
class="form-control" type="text" placeholder="Mô tả về shop"></textarea>
<div
*ngIf="shopDescription?.invalid && (shopDescription?.dirty || shopDescription?.touched)"
class="alert alert-danger mt-1">
@@ -331,10 +356,12 @@
<label for="validationCustom2"><span>*</span> Loại shop</label>
</div>
<div class="col-xl-8 col-md-7">
<button *ngIf="isStudent" type="button" class="btn btn-secondary" (click)="swap()">Shop sinh
<button style="font-family: Metrophobic;" *ngIf="isStudent" type="button"
class="btn btn-secondary" (click)="swap()">Shop sinh
viên
</button>
<button *ngIf="!isStudent" type="button" class="btn btn-primary" (click)="swap()">Shop
<button style="font-family: Metrophobic;" *ngIf="!isStudent" type="button"
class="btn btn-primary" (click)="swap()">Shop
thường
</button>
</div>
@@ -347,8 +374,10 @@
</ul>
<div [ngbNavOutlet]="nav" class="mt-2"></div>
<div class="pull-right">
<button type="button" class="btn btn-danger mr-3" (click)="goBackToLogin()">Quay lại</button>
<button type="submit" class="btn btn-primary" (click)="createUser(createSuccess)">Tạo tài khoản</button>
<button style="font-family: Metrophobic;" type="button" class="btn btn-danger mr-3"
(click)="goBackToLogin()">Quay lại</button>
<button style="font-family: Metrophobic;" type="submit" class="btn btn-primary"
(click)="createUser(createSuccess)">Tạo tài khoản</button>
</div>
</div>
</div>
@@ -374,7 +403,8 @@
<ng-template #createSuccess>
<div class="modal-body text-center">
<h5 class="text-dark font-weight-bold mb-4">Tạo tài khoản thành công. Vui lòng kiểm tra hòm thư để xác thực tài khoản</h5>
<h5 class="text-dark font-weight-bold mb-4">Tạo tài khoản thành công. Vui lòng kiểm tra hòm thư để xác thực tài
khoản</h5>
<button type="button" class="btn btn-primary" (click)="continue()">Tiếp tục
</button>
</div>
@@ -385,4 +415,19 @@
<h5>{{ errorItem }} đã tồn tại. Vui lòng chọn một {{ errorItem.toLowerCase() }} khác.</h5>
<button type="button" class="btn btn-primary" (click)="closeLayer2()">Tiếp tục</button>
</div>
</ng-template>
<ng-template #miss_otp>
<div class="modal-body text-center">
<h5>Mã OTP trống hoặc không đúng. Vui lòng kiểm tra lại</h5>
<button type="button" class="btn btn-primary" (click)="closeLayer2()">Tiếp tục</button>
</div>
</ng-template>
<ng-template #miss_info>
<div class="modal-body text-center">
<h5>Vui lòng điền đầy đủ thông tin trước khi tạo tài khoản.</h5>
<button type="button" class="btn btn-primary" (click)="closeLayer2()">Tiếp tục</button>
</div>
</ng-template>
src/app/components/auth/signup/signup.component.scss
+14 -12
View File
@@ -1,5 +1,5 @@
.backgound-food {
background-image: url('../../../../assets/images/background-login.jpg');
background-image: url('../../../../assets/images/resize-bg.png');
width: 100vw;
height: 100%;
background-position: center;
@@ -23,14 +23,16 @@
}
.input-password-holder {
display: flex;
justify-content: space-between;
align-items: center;
.input-password {
border: none;
width: 100%;
}
.icon-holder-eye {
color: #999a9b;
}
}
display: flex;
justify-content: space-between;
align-items: center;
.input-password {
border: none;
width: 100%;
}
.icon-holder-eye {
color: #999a9b;
}
}
src/app/components/auth/signup/signup.component.ts
+174 -105
View File
@@ -1,5 +1,9 @@
import { Component, TemplateRef, ViewChild } from "@angular/core";
import { AngularFireAuth } from "@angular/fire/compat/auth";
import { AngularFireStorage } from "@angular/fire/compat/storage";
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';
import { FormBuilder, FormControl, FormGroup, Validators } from "@angular/forms";
import { Router } from "@angular/router";
import { BsModalRef, BsModalService } from "ngx-bootstrap/modal";
@@ -10,7 +14,6 @@ import { AuthService } from "src/app/shared/service/auth.service";
import { DistrictService } from "src/app/shared/service/district.service";
import { FirebaseService } from "src/app/shared/service/firebase.service";
import { ShopService } from "src/app/shared/service/shop.service";
import { UserService } from "src/app/shared/service/user.service";
import { Address } from "src/app/shared/tables/address";
import { District } from "src/app/shared/tables/district";
import { Shop } from "src/app/shared/tables/shop";
@@ -64,11 +67,18 @@ export class SignupComponent {
layer1: BsModalRef;
layer2: BsModalRef;
@ViewChild('error_modal') errorModal: TemplateRef<any>;
@ViewChild('miss_info') missInfoModal: TemplateRef<any>;
@ViewChild('miss_otp') missOTPModal: TemplateRef<any>;
//Phonenumber
isVerified: boolean = false;
reCaptchaVerifier;
verify;
constructor(
private formBuilder: FormBuilder,
private authService: AuthService,
private userService: UserService,
private firebaseAuth: AngularFireAuth,
private districtService: DistrictService,
private storage: AngularFireStorage,
private shopService: ShopService,
@@ -87,6 +97,7 @@ export class SignupComponent {
email: new FormControl("", [Validators.required, Validators.email]),
dateOfBirth: new FormControl("", [Validators.required]),
phoneNumber: new FormControl("", [Validators.required, Validators.pattern(Validation.Regex.Phone)]),
otp: new FormControl("", [Validators.required]),
identifiedCode: new FormControl("", [Validators.required, Validators.pattern(Validation.Regex.IdentifiedCode)]),
address: new FormControl("", [Validators.required, Validators.minLength(8)]),
});
@@ -162,6 +173,7 @@ export class SignupComponent {
this.addUserForm.markAllAsTouched();
this.passwordForm.markAllAsTouched();
this.shopForm.markAllAsTouched();
this.layer2 = this.modalService.show(this.missInfoModal, { class: 'modal-sm' });
return Promise.reject();
}
@@ -189,118 +201,170 @@ export class SignupComponent {
return Promise.reject();
}
else {
if (this.userImageChoosen && this.shopImageChoosen) {
this.uploadUserImage(this.userImageFile).then((url) => {
newUser.imageUrl = url
//Check iCode
this.authService.checkIdentifiedCode(this.userIdentifiedCode.value).subscribe((response) => {
if (response.isTrue == false) {
this.authService.SignUpUser(newUser).pipe(
switchMap((user) => {
this.uploadShopImage(this.shopImageFile).then((url) => {
newShop.userId = user.id
newShop.imageUrl = url;
this.authService.SignUpUserAddress(user.id, newAddress).subscribe({
next: () => {
this.firebaseService.signUp(newUser.email, this.userPassword.value);
this.authService.SignUpShop(newShop).subscribe(() => {
this.layer1 = this.modalService.show(template, { class: 'modal-sm' })
//Firebase Send Code here
const credential = firebase.auth.PhoneAuthProvider.credential(this.verify, this.otpCode.value);
firebase.auth().signInWithCredential(credential).then((credential) => {
credential.user.delete();
this.isVerified = true;
if (this.userImageChoosen && this.shopImageChoosen) {
this.uploadUserImage(this.userImageFile).then((url) => {
newUser.imageUrl = url
this.authService.SignUpUser(newUser).pipe(
switchMap((user) => {
this.uploadShopImage(this.shopImageFile).then((url) => {
newShop.userId = user.id
newShop.imageUrl = url;
this.authService.SignUpUserAddress(user.id, newAddress).subscribe({
next: () => {
this.firebaseService.signUp(newUser.email, this.userPassword.value);
this.authService.SignUpShop(newShop).subscribe(() => {
this.layer1 = this.modalService.show(template, { class: 'modal-sm' })
})
}
});
})
return EMPTY; // Return an empty observable to prevent nested subscriptions
})
).subscribe({
next: () => { },
error: () => {
this.errorItem = 'CCCD/CMND';
this.layer2 = this.modalService.show(this.errorModal, { class: 'modal-sm' });
}
});
})
return EMPTY; // Return an empty observable to prevent nested subscriptions
})
).subscribe({
next: () => { },
error: () => {
this.errorItem = 'CCCD/CMND';
this.layer2 = this.modalService.show(this.errorModal, { class: 'modal-sm' });
}
})
})
}
else if (this.userImageChoosen && !this.shopImageChoosen) {
this.uploadUserImage(this.userImageFile).then((url) => {
newUser.imageUrl = url
this.authService.SignUpUser(newUser).pipe(
switchMap((user) => {
newShop.userId = user.id
newShop.imageUrl = this.defaultShopImg;
this.authService.SignUpUserAddress(user.id, newAddress).subscribe({
next: () => {
this.firebaseService.signUp(newUser.email, this.userPassword.value);
this.authService.SignUpShop(newShop).subscribe(() => {
this.layer1 = this.modalService.show(template, { class: 'modal-sm' })
})
}
});
return EMPTY; // Return an empty observable to prevent nested subscriptions
})
).subscribe({
next: () => { },
error: () => {
this.errorItem = 'CCCD/CMND';
this.layer2 = this.modalService.show(this.errorModal, { class: 'modal-sm' });
}
})
})
}
else if (!this.userImageChoosen && this.shopImageChoosen) {
newUser.imageUrl = this.defaultUserImg;
this.authService.SignUpUser(newUser).pipe(
switchMap((user) => {
this.uploadShopImage(this.shopImageFile).then((url) => {
newShop.userId = user.id
newShop.imageUrl = url;
this.authService.SignUpUserAddress(user.id, newAddress).subscribe({
next: () => {
this.firebaseService.signUp(newUser.email, this.userPassword.value);
this.authService.SignUpShop(newShop).subscribe(() => {
this.layer1 = this.modalService.show(template, { class: 'modal-sm' })
})
}
});
})
return EMPTY; // Return an empty observable to prevent nested subscriptions
})
).subscribe({
next: () => { },
error: () => {
this.errorItem = 'CCCD/CMND';
this.layer2 = this.modalService.show(this.errorModal, { class: 'modal-sm' });
}
})
}
else {
newUser.imageUrl = this.defaultUserImg;
this.authService.SignUpUser(newUser).pipe(
switchMap((user) => {
newShop.userId = user.id
newShop.imageUrl = this.defaultShopImg;
this.authService.SignUpUserAddress(user.id, newAddress).subscribe({
next: () => {
this.firebaseService.signUp(newUser.email, this.userPassword.value);
this.authService.SignUpShop(newShop).subscribe(() => {
this.layer1 = this.modalService.show(template, { class: 'modal-sm' })
})
}
});
return EMPTY; // Return an empty observable to prevent nested subscriptions
})
}
else if (this.userImageChoosen && !this.shopImageChoosen) {
this.uploadUserImage(this.userImageFile).then((url) => {
newUser.imageUrl = url
this.authService.SignUpUser(newUser).pipe(
switchMap((user) => {
newShop.userId = user.id
newShop.imageUrl = this.defaultShopImg;
this.authService.SignUpUserAddress(user.id, newAddress).subscribe({
next: () => {
this.firebaseService.signUp(newUser.email, this.userPassword.value);
this.authService.SignUpShop(newShop).subscribe(() => {
this.layer1 = this.modalService.show(template, { class: 'modal-sm' })
})
}
});
return EMPTY; // Return an empty observable to prevent nested subscriptions
})
).subscribe({
next: () => { },
error: () => {
this.errorItem = 'CCCD/CMND';
this.layer2 = this.modalService.show(this.errorModal, { class: 'modal-sm' });
}
})
})
}
else if (!this.userImageChoosen && this.shopImageChoosen) {
newUser.imageUrl = this.defaultUserImg;
this.authService.SignUpUser(newUser).pipe(
switchMap((user) => {
this.uploadShopImage(this.shopImageFile).then((url) => {
newShop.userId = user.id
newShop.imageUrl = url;
this.authService.SignUpUserAddress(user.id, newAddress).subscribe({
next: () => {
this.firebaseService.signUp(newUser.email, this.userPassword.value);
this.authService.SignUpShop(newShop).subscribe(() => {
this.layer1 = this.modalService.show(template, { class: 'modal-sm' })
})
}
});
})
return EMPTY; // Return an empty observable to prevent nested subscriptions
})
).subscribe({
next: () => { },
error: () => {
this.errorItem = 'CCCD/CMND';
this.layer2 = this.modalService.show(this.errorModal, { class: 'modal-sm' });
}
})
}
else {
newUser.imageUrl = this.defaultUserImg;
this.authService.SignUpUser(newUser).pipe(
switchMap((user) => {
newShop.userId = user.id
newShop.imageUrl = this.defaultShopImg;
this.authService.SignUpUserAddress(user.id, newAddress).subscribe({
next: () => {
this.firebaseService.signUp(newUser.email, this.userPassword.value);
this.authService.SignUpShop(newShop).subscribe(() => {
this.layer1 = this.modalService.show(template, { class: 'modal-sm' })
})
}
});
return EMPTY; // Return an empty observable to prevent nested subscriptions
})
).subscribe({
next: () => { },
error: () => {
this.errorItem = 'CCCD/CMND';
this.layer2 = this.modalService.show(this.errorModal, { class: 'modal-sm' });
}
})
}
})
).subscribe({
next: () => { },
error: () => {
this.errorItem = 'CCCD/CMND';
this.layer2 = this.modalService.show(this.errorModal, { class: 'modal-sm' });
}
})
}
.catch((error) => {
this.layer2 = this.modalService.show(this.missOTPModal, { class: 'modal-sm' })
return Promise.reject();
})
}
else {
this.errorItem = 'CCCD/CMND';
this.layer2 = this.modalService.show(this.errorModal, { class: 'modal-sm' });
}
})
}
})
}
getOTP() {
this.reCaptchaVerifier = new firebase.auth.RecaptchaVerifier(
'recapcha',
{
size: 'visible',
}
);
firebase
.auth()
.signInWithPhoneNumber('+84 ' + this.userPhoneNumber.value, this.reCaptchaVerifier)
.then((confirmationResult) => {
this.verify = confirmationResult.verificationId;
console.log("send code!");
})
.catch((error) => {
//Catch error
console.log(error.message);
alert(error.message);
setTimeout(() => {
window.location.reload();
}, 5000);
});
}
//Districts and Wards
getAllDistrict() {
this.districtService.getAllDistricts().subscribe((distrs) => {
@@ -310,6 +374,8 @@ export class SignupComponent {
onDistrictSelected() {
this.isHaveDistrict = false;
this.ward = 'none';
this.wards = [];
this.districts.forEach((element: District) => {
if (this.district == element.name && this.district != "Huyện Hoàng Sa") {
this.isHaveDistrict = true;
@@ -441,6 +507,9 @@ export class SignupComponent {
get userPhoneNumber() {
return this.addUserForm.get("phoneNumber");
}
get otpCode() {
return this.addUserForm.get('otp');
}
get userIdentifiedCode() {
return this.addUserForm.get("identifiedCode");
}
src/app/components/sales/scam-orders/scam-orders.component.html
+7 -6
View File
@@ -8,10 +8,10 @@
</div> -->
<div class="card-body">
<div class="custom-datatable">
<div class="mb-3">
<!-- <div class="mb-3">
<input type="text" [(ngModel)]="searchName" (change)="searchOrder()"
class="filter-ngx form-control" placeholder="Tìm kiếm ..." autocomplete="off" />
</div>
</div> -->
<table class="table table-striped" *ngIf="orders.length > 0">
<thead>
<tr>
@@ -23,14 +23,15 @@
<th scope="col">Phương thức</th>
<th scope="col">Trạng thái</th>
<th scope="col">Số tiền</th>
<th scope="col"></th>
<!-- <th scope="col"></th> -->
</tr>
</thead>
<tbody>
<tr *ngFor="let order of orders">
<th scope="row">{{ order.orderTrackingNumber }}</th>
<td>{{ order.orderTime }}</td>
<td>{{ order.user.fullName }}</td>
<td><a [routerLink]="['/users/detail', order?.user?.id]">{{ order.user.fullName
}}</a></td>
<td *ngIf="order?.shipper?.user?.fullName != null">{{ order?.shipper?.user?.fullName
}}</td>
<td *ngIf="order?.shipper?.user?.fullName == null"><i style="color: #FF8084;"
@@ -80,7 +81,7 @@
</span>
</td>
<td style="font-size: 16px;">{{ order.total | currency : "VND" }}</td>
<td scope="row">
<!-- <td scope="row">
<a [routerLink]="['/sales', 'detail-order', 'user', order.user.id, 'order', order.id]"
style="cursor: pointer;">
<i style="color: lightseagreen;" class="fa fa-eye f-12"></i>
@@ -97,7 +98,7 @@
style="cursor: pointer;">
<i class="fa fa-trash-o"></i>
</a>
</td>
</td> -->
</tr>
</tbody>
</table>
src/app/components/sales/scam-orders/scam-orders.component.scss
+63
View File
@@ -0,0 +1,63 @@
th,
td {
text-align: center;
}
.modal-change-status {
// width: 1000px;
.modal-confirm-text {
text-align: center;
padding: 20px 8px;
font-weight: 600;
}
.modal-select-option {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 20px;
select {
padding: 12px 20px;
}
}
.modal-btn-option {
width: 100%;
display: flex;
justify-content: space-around;
align-items: center;
padding-bottom: 20px;
.width-btn {
width: 110px;
}
}
}
.modal-confirm-delete {
// width: 1000px;
.modal-confirm-text {
text-align: center;
padding: 20px 8px;
font-weight: 600;
}
.modal-btn-option {
width: 100%;
display: flex;
justify-content: space-around;
align-items: center;
padding-bottom: 20px;
.width-btn {
width: 110px;
}
}
}
.modal-confirm-text {
font-weight: 600;
}
src/app/components/sales/scam-orders/scam-orders.component.ts
+3 -53
View File
@@ -57,52 +57,13 @@ export class ScamOrdersComponent {
ngOnInit() {
this.userService.getUserByToken(this.token).subscribe((userInfo) => {
this.loggedRole = userInfo.userRole;
if (this.loggedRole != 'ROLE_ADMIN') {
this.isShop = true;
this.shopId = userInfo.shopId
}
this.listOrder();
})
}
listOrder() {
if (this.isShop) {
this.orderService.getOrdersByShopId(this.shopId, this.thePageNumber - 1, this.thePageSize, this.sortBy, this.sortDir)
.subscribe(this.processResult());
this.shipperService.findFreeShopShipper(this.shopId).subscribe((shippers) => {
this.shippers = shippers;
})
}
else {
this.orderService
.getOrdersPagination(this.thePageNumber - 1, this.thePageSize, this.sortBy, this.sortDir)
.subscribe(this.processResult());
}
this.refreshTimeout = setTimeout(() => {
this.refreshOrder();
}, this.refreshInterval);
}
refreshOrder() {
if (this.isShop) {
this.orderService.getOrdersByShopId(this.shopId, this.thePageNumber - 1, this.thePageSize, this.sortBy, this.sortDir)
.subscribe(this.refreshResult());
this.shipperService.findFreeShopShipper(this.shopId).subscribe((shippers) => {
this.shippers = shippers;
})
}
else {
this.orderService
.getOrdersPagination(this.thePageNumber - 1, this.thePageSize, this.sortBy, this.sortDir)
.subscribe(this.refreshResult());
}
this.refreshTimeout = setTimeout(() => {
this.refreshOrder();
}, this.refreshInterval);
this.orderService.findOrderByStatus('REJECT_DELIVERY', this.thePageNumber - 1, this.thePageSize, this.sortBy, this.sortDir)
.subscribe(this.processResult());
}
searchOrder() {
@@ -117,6 +78,7 @@ export class ScamOrdersComponent {
processResult() {
return (data: any) => {
console.log(data)
this.orders = data.orders;
this.thePageNumber = data.page.pageNo + 1;
this.thePageSize = data.page.pageSize;
@@ -125,18 +87,6 @@ export class ScamOrdersComponent {
};
}
refreshResult() {
return (data: any) => {
this.orders = data.orders;
this.thePageNumber = data.page.pageNo + 1;
this.thePageSize = data.page.pageSize;
this.theTotalElements = data.page.totalElements;
if (this.totalOrders != this.theTotalElements) {
this.totalOrders = this.theTotalElements;
}
};
}
// Change status order modal
openStatusModal(confirmBoxChangeStatus: TemplateRef<any>, userId: number, orderId: number, shipper: Shipper) {
this.isHaveShipper = false;
src/app/shared/service/auth.service.ts
+4
View File
@@ -36,6 +36,10 @@ export class AuthService {
return this.httpClient.post<StringBoolObject>(this.baseUrl + `/check`, userDto);
}
checkIdentifiedCode(code: string) {
return this.httpClient.get<StringBoolObject>(this.baseUrl + `/check?code=${code}`);
}
checkEmailInDB(email: string) {
return this.httpClient.get<StringBoolObject>(this.baseUrl + `/check-email?email=${email}`)
}
src/app/shared/service/firebase.service.ts
+1 -1
View File
@@ -50,7 +50,7 @@ export class FirebaseService {
if (!response.user.emailVerified) {
response.user.sendEmailVerification();
this.router.navigate(['/auth/email-not-verified']);
resolve(false); // trả về false nếu email chưa được xác thực
resolve(true); // trả về false nếu email chưa được xác thực
} else {
response.user.getIdToken().then((token: string) => {
this.token = token;
src/app/shared/service/order.service.ts
+4
View File
@@ -61,6 +61,10 @@ export class OrderService {
findOrdersByTrackingNumber(trackingNumber: string, thePage: number, thePageSize: number, sortBy: string, sortDir: string) {
return this.httpClient.get<GetResponseOrders>(this.orderUrl + `/search?trackingNumber=${trackingNumber}&pageNo=${thePage}&pageSize=${thePageSize}&sortBy=${sortBy}&sortDir=${sortDir}`);
}
findOrderByStatus(status: string, thePage: number, thePageSize: number, sortBy: string, sortDir: string) {
return this.httpClient.get<GetResponseOrders>(this.orderUrl + `/get?status=${status}`);
}
}
interface GetResponseOrders {
src/assets/images/resize-bg.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.4 MiB

src/environments/environment.ts
+2 -2
View File
@@ -4,8 +4,8 @@
export const environment = {
production: false,
// foodOrderingBaseApiUrl: 'http://localhost:8080/api',
foodOrderingBaseApiUrl: 'https://foodify-backend-production.up.railway.app/api',
foodOrderingBaseApiUrl: 'http://localhost:8080/api',
// foodOrderingBaseApiUrl: 'https://foodify-backend-production.up.railway.app/api',
firebaseConfig: {
apiKey: 'AIzaSyAZFFIuXkbgdp2F-Em4CK2z8kVJ2L4p_UU',
authDomain: 'foodify-55954.firebaseapp.com',