Commit 50d00c38 by Adarsh K

file

parent c8241e3e
......@@ -102,4 +102,4 @@
"android"
]
}
}
}
\ No newline at end of file
......@@ -3,12 +3,12 @@
<ion-menu>
<ion-content>
<div class="side_menu_wrapper">
<ion-menu-toggle>
<ion-menu-toggle *ngIf="userData">
<div class="top_banner">
<div class="top_image"></div>
<div class="top_detail">
<h4>John Doe</h4>
<p>[email protected]</p>
<h4>{{userData.name}}</h4>
<p>{{userData.emailId}}</p>
</div>
<div class="clear"></div>
</div>
......@@ -95,7 +95,7 @@
class="icon_sec m6_icon"
[class.m6_icon_act]="sec_active6"
(click)="setActive6()"
></div>
menuClose></div>
</li>
</ul>
</div>
......@@ -3,7 +3,11 @@ import { Router, ActivatedRoute } from '@angular/router';
import { Platform, Events } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { AngularFirestore, AngularFirestoreDocument, AngularFirestoreCollection } from '@angular/fire/firestore';
import {
AngularFirestore,
AngularFirestoreDocument,
AngularFirestoreCollection
} from '@angular/fire/firestore';
import * as firebase from 'firebase';
import { ModalController } from '@ionic/angular';
import { DeliverypopPage } from './deliverypop/deliverypop.page';
......@@ -13,8 +17,6 @@ import { SubjectService } from './../config/subject.service';
import { CategoriesService } from './../config/category.service';
import { SearchmodalPage } from './searchmodal/searchmodal.page';
@Component({
selector: 'app-root',
templateUrl: 'app.component.html',
......@@ -30,6 +32,7 @@ export class AppComponent {
state: boolean;
menuw: number;
userData: any;
constructor(
private platform: Platform,
......@@ -46,10 +49,19 @@ export class AppComponent {
) {
this.state = true;
this.initializeApp();
this.orderState();
this.subjectService.getLoginData().subscribe(loginData => {
this.state = loginData;
});
this.service.get('userData').then(userData => {
if (userData) {
this.userData = JSON.parse(userData);
console.log(userData);
this.orderState();
} else {
console.log(userData);
}
});
}
initializeApp() {
......@@ -70,7 +82,13 @@ export class AppComponent {
}
fetchCase() {
const restrictedUrl = ['productdetail', 'cart', 'nearby', 'verification'];
const restrictedUrl = [
'productdetail',
'cart',
'nearby',
'verification',
'orderplaced'
];
const currentUrl = this.router.url.split('/');
const index = restrictedUrl.findIndex(x => x === currentUrl[1]);
// console.log(currentUrl[1], index, this.state);
......@@ -137,8 +155,7 @@ export class AppComponent {
}
orderState() {
console.log('called');
const custId = 'WwHnLICVY2dvZGUHuKqasiTB91a2';
const custId = this.userData.uid;
firebase
.firestore()
.collection('orders')
......
......@@ -16,6 +16,7 @@ import { AngularFireModule } from '@angular/fire';
import { AngularFirestore } from '@angular/fire/firestore';
import { AngularFirestoreModule } from '@angular/fire/firestore';
import { AngularFireAuthModule } from '@angular/fire/auth';
import { AngularFireStorageModule } from '@angular/fire/storage';
import { Geolocation } from '@ionic-native/geolocation/ngx';
import { NativeGeocoder } from '@ionic-native/native-geocoder/ngx';
......@@ -41,6 +42,7 @@ import { SearchmodalPageModule } from './searchmodal/searchmodal.module';
DeliverypopPageModule,
AngularFireAuthModule,
AngularFirestoreModule,
AngularFireStorageModule,
SearchmodalPageModule,
FormsModule
],
......
<div class="nav_header">
<button class="nav_btn nav_back floatLeft" (click)="goBack()">
</button>
<div class="nav_title floatLeft">
<h4>MY ORDERS</h4>
</div>
<div class="clear"></div>
<button class="nav_btn nav_back floatLeft" (click)="goBack()"></button>
<div class="nav_title floatLeft">
<h4>MY ORDERS</h4>
</div>
<div class="clear"></div>
</div>
<ion-content>
<div class="myorder_wrapper" *ngIf="myorder.orders">
<ul *ngIf="myorder.orders.length > 0">
<li *ngFor="let order of myorder.orders; let i = index">
<div class="order_info">
<h5 class="floatLeft">{{order.orderCode}}</h5>
<button class="order_track floatRight" *ngIf="order.orderStatus >= 3 && order.orderStatus < 7" (click)="orderDetails(i)">Track Order</button>
<div class="clear"></div>
</div>
<div *ngFor="let product of order.product" (click)="viewOrder(order)">
<div class="order_image"><img [src]="product.image" onerror="" /></div>
<div class="order_detail">
<h5 class="floatLeft">{{product.prodName}}</h5>
<div class="clear"></div>
<h5>{{product.color}}, {{product.size}} <span>{{product.qty}}</span></h5>
<p>A$ {{product.price}}</p>
</div>
<div class="order_other">
<h6 class="floatRight">{{ order.bookDate.seconds * 1000 | date:'MMMM dd, y' }}</h6>
<span class="floatRight" *ngIf="order.orderStatus < 3 || order.orderStatus >= 7" (click)="acceptOrder(order)">{{getStatus(order.orderStatus)}}</span>
<div class="clear"></div>
<!-- <button class="track_btn" *ngIf="order.orderStatus >= 3 && order.orderStatus < 7" (click)="orderDetails(i)">TRACK</button> -->
<div class="clear"></div>
</div>
<div class="clear"></div>
<hr>
</div>
<div class="order_info">
<h5 class="floatRight">TOTAL PRICE : {{order.amount}}</h5>
<div class="clear"></div>
</div>
</li>
<!-- <li>
<div class="myorder_wrapper" *ngIf="myorder.orders">
<ul *ngIf="myorder.orders.length > 0">
<li *ngFor="let order of myorder.orders; let i = index">
<div class="order_info">
<h5 class="floatLeft">{{order.orderCode}}</h5>
<button
class="order_track floatRight"
*ngIf="order.orderStatus >= 3 && order.orderStatus < 7"
(click)="orderDetails(i)"
>
Track Order
</button>
<div class="clear"></div>
</div>
<div *ngFor="let product of order.product" (click)="viewOrder(order)">
<div class="order_image">
<img [src]="product.image" onerror="" />
</div>
<div class="order_detail">
<h5 class="floatLeft">{{product.prodName}}</h5>
<div class="clear"></div>
<h5>
<span *ngIf="product.color !== 'No-Color'"
>{{product.color}},
</span>
<span *ngIf="product.size !== 'Any-Size'">{{product.size}}</span
>&nbsp;<span>{{product.qty}}</span>
</h5>
<p>A$ {{product.price}}</p>
</div>
<div class="order_other">
<h6 class="floatRight">
{{ order.bookDate.seconds * 1000 | date:'MMMM dd, y' }}
</h6>
<span
class="floatRight"
*ngIf="order.orderStatus < 3 || order.orderStatus >= 7"
(click)="acceptOrder(order)"
>{{getStatus(order.orderStatus)}}</span
>
<div class="clear"></div>
<!-- <button class="track_btn" *ngIf="order.orderStatus >= 3 && order.orderStatus < 7" (click)="orderDetails(i)">TRACK</button> -->
<div class="clear"></div>
</div>
<div class="clear"></div>
<hr />
</div>
<div class="order_info">
<h5 class="floatRight">TOTAL PRICE : {{order.amount}}</h5>
<div class="clear"></div>
</div>
</li>
<!-- <li>
<div class="order_image"></div>
<div class="order_detail">
<h5 class="floatLeft">European Style V Neck</h5>
......@@ -91,12 +108,12 @@
</div>
<div class="clear"></div>
</li> -->
</ul>
</div>
</ul>
</div>
</ion-content>
<div class="loader" *ngIf="loader">
<div class="lds-ripple">
<div></div>
<div></div>
</div>
</div>
\ No newline at end of file
<div class="lds-ripple">
<div></div>
<div></div>
</div>
</div>
<ion-content>
<div class="cart_wrapper" *ngIf="data">
<div class="cart_head">
<div class="nav_header">
<button class="nav_btn nav_back_white floatLeft" (click)="goBack()">
<img src="../assets/arrow_white.png">
<div class="cart_wrapper" *ngIf="data">
<div class="cart_head">
<div class="nav_header">
<button class="nav_btn nav_back_white floatLeft" (click)="goBack()">
<img src="../assets/arrow_white.png" />
</button>
<div class="nav_title floatLeft">
<h4></h4>
</div>
<button class="nav_btn floatRight">
</button>
<div class="clear"></div>
</div>
<img src="../assets/white_tick.png">
<h4>ORDER IS PLACED</h4>
<p>{{ data.bookDate.seconds * 1000 | date:'MMMM dd, y' }}</p>
<div class="nav_title floatLeft">
<h4></h4>
</div>
<div class="order_status">
<div class="clear"></div>
<div class="status_div go_green">
<h4>Order Placed</h4>
<h6>{{ data.bookDate.seconds * 1000 | date:'MMMM dd, y' }}</h6>
</div>
<!-- <div class="status_gap go_green">
<button class="nav_btn floatRight"></button>
<div class="clear"></div>
</div>
<img src="../assets/white_tick.png" />
<h4>ORDER IS PLACED</h4>
<p>{{ data.bookDate.seconds * 1000 | date:'MMMM dd, y' }}</p>
</div>
<div class="order_status">
<div class="clear"></div>
<div class="status_div go_green">
<h4>Order Placed</h4>
<h6>{{ data.bookDate.seconds * 1000 | date:'MMMM dd, y' }}</h6>
</div>
<!-- <div class="status_gap go_green">
</div>
<div class="status_div go_green">
<h4>Retailer Accepted</h4>
......@@ -56,41 +54,56 @@
<div class="status_div">
<h4>Your product is delivered</h4>
</div> -->
</div>
<div class="nearby_shop_list">
<ul>
<li (click)="goToPage('productlist')">
<div class="nearby_image">
<img src="../assets/[email protected]">
</div>
<div class="nearby_detail">
<h5>
<span class="floatLeft">{{data.shopperName}}</span>
<span class="floatRight">0
<img src="../assets/Path61_2.png">
</span>
<div class="clear"></div>
</h5>
<p>Men's & Women's Fashion</p>
</div>
<div class="clear"></div>
</li>
</ul>
</div>
<div class="product_detail" *ngFor="let product of data.product">
<h6>{{product.color}}, {{product.size}}</h6>
<h5>Quantity : <span>{{product.qty}}</span></h5>
<h5>Amount : <strong>A$ {{product.price}}</strong><span class="afterpay">COD</span></h5>
<h5>Delivery time : <span>Delivery in 1 hour</span></h5>
<h4>DELIVERY</h4>
</div>
<div class="nearby_shop_list">
<ul>
<li (click)="goToPage('productlist')">
<div class="nearby_image">
<img
[src]="data.product[0].image"
onerror="this.src='../assets/[email protected]'"
/>
</div>
<div class="nearby_detail">
<h5>
{{deliveryAddress}}
<span class="floatLeft">{{data.shopperName}}</span>
<span class="floatRight"
>{{data.product[0].qty}}
<img src="../assets/Path61_2.png" />
</span>
<div class="clear"></div>
</h5>
<button class="cancel_btn" (click)="goToPage('ordercancelled')">CANCEL THIS ORDER</button>
<hr>
</div>
<p class="prodName">{{data.product[0].prodName}}</p>
</div>
<div class="clear"></div>
</li>
</ul>
</div>
<div class="product_detail" *ngFor="let product of data.product">
<h6>
<span *ngIf="product.color !== 'No-Color'">{{product.color}}, </span>
<span *ngIf="product.size !== 'Any-Size'">{{product.size}}</span>
</h6>
<h5>Quantity : <span>{{product.qty}}</span></h5>
<h5>
Amount : <strong>A$ {{product.price}}</strong
><span class="afterpay">COD</span>
</h5>
<h5>Delivery time : <span>{{deliveryTime}}</span></h5>
<h4>DELIVERY</h4>
<h5 *ngIf="data.deliveryAddress">
{{data.deliveryAddress.addressType}},<br />{{data.deliveryAddress.address}},
<br />
{{data.deliveryAddress.building}}, <br />
{{data.deliveryAddress.landmark}}
</h5>
<button class="cancel_btn" (click)="goToPage('ordercancelled')">
CANCEL THIS ORDER
</button>
<hr />
</div>
<!-- <div class="related_product_slider">
<!-- <div class="related_product_slider">
<h5>
<span class="floatLeft">Related Products</span><span class="floatRight">MORE</span>
<div class="clear"></div>
......@@ -145,5 +158,5 @@
</ion-slides>
</ul>
</div> -->
</div>
</ion-content>
\ No newline at end of file
</div>
</ion-content>
......@@ -6,29 +6,58 @@ import { ServiceService } from './../../config/service.service';
@Component({
selector: 'app-orderplaced',
templateUrl: './orderplaced.page.html',
styleUrls: ['./orderplaced.page.scss'],
styleUrls: ['./orderplaced.page.scss']
})
export class OrderplacedPage implements OnInit {
data: any;
deliveryTime: any;
timeinterval: any;
constructor(
private router: Router,
private route: ActivatedRoute,
private location: Location,
private service: ServiceService
) {
this.deliveryTime = '';
this.service.get('order').then(val => {
this.data = val;
this.timeinterval = setInterval(() => {
this.getDeliveryTime(this.data.bookDate.seconds);
}, 1000);
});
}
ngOnInit() {
}
data: any;
relatedProd = {
slidesPerView: 2
};
getDeliveryTime(timeStamp) {
console.log(timeStamp);
const endDate = new Date(timeStamp * 1000);
console.log(endDate);
endDate.setHours(endDate.getHours() + 1);
const t = this.getTimeRemaining(endDate, new Date());
const minutes = t.minutes < 10 ? '0' + t.minutes : t.minutes;
const seconds = t.seconds < 10 ? '0' + t.seconds : t.seconds;
this.deliveryTime = minutes + ' : ' + seconds;
if (t.t <= 0) {
clearInterval(this.timeinterval);
}
}
getTimeRemaining(endtime, currDate) {
const t = Date.parse(endtime) - Date.parse(currDate);
const seconds = Math.floor((t / 1000) % 60);
const minutes = Math.floor((t / 1000 / 60) % 60);
return {
t,
minutes,
seconds
};
}
ngOnInit() {}
goToPage(path, data = null) {
this.router.navigateByUrl(path, { queryParams: data });
document.body.scrollTop = document.documentElement.scrollTop = 0;
......@@ -36,6 +65,5 @@ export class OrderplacedPage implements OnInit {
goBack() {
this.location.back();
}
}
}
......@@ -8,13 +8,23 @@
<div class="clear"></div>
</div>
<ion-content>
<div class="profile_wrapper">
<div class="profile_wrapper" *ngIf="loggedUser">
<div class="profile_banner">
<!-- <div class="profile_circle">
<div class="edit"></div>
</div> -->
<div class="profile_circle">
<img
[src]="loggedUser.profilePhoto"
onerror="this.src='./../../assets/profile_banner.png'"
/>
<div class="edit"></div>
<input type="file" accept="image/*" (change)="fileChange($event)" />
</div>
<h5>{{user && user.name}}</h5>
<p>LOGOUT</p>
<h5>{{loggedUser.name}}</h5>
<p (click)="authService.SignOut()">LOGOUT</p>
</div>
<div class="account_wrapper">
<div class="account_header">
......@@ -30,13 +40,15 @@
<ion-row>
<ion-col class="textLeft p0">
<p>
Name<span
>{{user && phoneVerified? "Verified": "Not Verified yet"}}</span
Phone
<span *ngIf="loggedUser.phoneVerified == true">Verified</span>
<span *ngIf="loggedUser.phoneVerified == false"
>Not Verified yet</span
>
</p>
</ion-col>
<ion-col class="textRight p0">
<h6>{{user && user.name}}</h6>
<h6>{{loggedUser.phone}}</h6>
</ion-col>
</ion-row>
</div>
......@@ -44,13 +56,16 @@
<ion-row>
<ion-col class="textLeft p0">
<p>
Email<span
>{{user && emailVerified? "Verified": "Not Verified yet"}}</span
Email<span *ngIf="userData && userData.emailVerified == true"
>Verified</span
>
<span *ngIf="loggedUser.emailVerified == false"
>Not Verified yet</span
>
</p>
</ion-col>
<ion-col class="textRight p0">
<h6>{{user && user.emailId}}</h6>
<h6>{{loggedUser.emailId}}</h6>
</ion-col>
</ion-row>
</div>
......@@ -88,7 +103,7 @@
<ion-col class="textLeft p0">
<p>My Order</p>
</ion-col>
<ion-col class="textRight p0">
<ion-col class="textRight p0" (click)="goToPage('myorder')">
<h6>
<ion-icon name="arrow-forward"></ion-icon>
</h6>
......
.profile_wrapper {
.profile_banner {
.profile_banner {
width: 100%;
background-image: url('../../assets/profile_banner.png');
background-position: center;
background-repeat: no-repeat;
background-size: cover;
text-align: center;
padding-top: 40px;
.profile_circle {
width: 100px;
height: 100px;
background-color: #fff;
border-radius: 50%;
position: relative;
margin: 0 auto;
img {
width: 100%;
background-image: url("../../assets/profile_banner.png");
background-position: center;
background-repeat: no-repeat;
height: 100%;
object-fit: cover;
object-position: center;
border-radius: 50%;
}
input {
width: 80px;
height: 100%;
opacity: 0;
cursor: pointer;
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
}
.edit {
width: 30px;
height: 30px;
border-radius: 50%;
object-fit: cover;
object-position: center;
background-color: #000;
background-image: url('../../assets/edit_icon.png');
background-size: cover;
text-align: center;
padding-top: 40px;
.profile_circle {
width: 100px;
height: 100px;
background-color: #fff;
border-radius: 50%;
position: relative;
margin: 0 auto;
img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
border-radius: 50%;
}
.edit {
width: 30px;
height: 30px;
border-radius: 50%;
object-fit: cover;
object-position: center;
background-color: #000;
background-image: url("../../assets/edit_icon.png");
background-size: cover;
cursor: pointer;
position: absolute;
top: 0px;
right: 0px;
}
}
h5 {
text-align: center;
color: #fff;
margin: 0px;
padding-top: 15px;
font-weight: 600;
padding-bottom: 5px;
}
p {
color: rgba(206, 153, 76, 1);
text-align: center;
margin: 0px;
padding-bottom: 20px;
font-weight: 700;
}
cursor: pointer;
position: absolute;
top: 0px;
right: 0px;
}
}
.account_wrapper {
width: calc(100% - 40px);
margin: 0 auto;
padding-top: 20px;
padding-bottom: 100px;
.account_header {
padding-bottom: 15px;
h5 {
margin: 0px;
padding: 0px;
color: rgba(59, 57, 77, 1);
font-weight: 900;
}
span {
color: rgba(59, 57, 77, 1);
img {
width: 20px;
}
}
}
p {
margin: 0px;
padding: 0px;
color: rgba(176, 174, 199, 1);
font-size: 18px;
span {
color: rgba(206, 153, 76, 1);
margin-left: 10px;
}
}
h6 {
margin: 0px;
padding: 0px;
color: rgba(59, 57, 77, 1);
font-size: 18px;
ion-icon {
color: rgba(176, 174, 199, 1);
}
}
.row {
padding-bottom: 20px;
}
hr {
border-bottom: 1px solid rgba(176, 174, 199, .5);
height: 0px;
border-top: none;
margin-top: 15px;
margin-bottom: 15px;
h5 {
text-align: center;
color: #fff;
margin: 0px;
padding-top: 15px;
font-weight: 600;
padding-bottom: 5px;
}
p {
color: rgba(206, 153, 76, 1);
text-align: center;
margin: 0px;
padding-bottom: 20px;
font-weight: 700;
}
}
.account_wrapper {
width: calc(100% - 40px);
margin: 0 auto;
padding-top: 20px;
padding-bottom: 100px;
.account_header {
padding-bottom: 15px;
h5 {
margin: 0px;
padding: 0px;
color: rgba(59, 57, 77, 1);
font-weight: 900;
}
span {
color: rgba(59, 57, 77, 1);
img {
width: 20px;
}
}
}
p {
margin: 0px;
padding: 0px;
color: rgba(176, 174, 199, 1);
font-size: 18px;
span {
color: rgba(206, 153, 76, 1);
margin-left: 10px;
}
}
h6 {
margin: 0px;
padding: 0px;
color: rgba(59, 57, 77, 1);
font-size: 18px;
ion-icon {
color: rgba(176, 174, 199, 1);
}
}
.row {
padding-bottom: 20px;
}
hr {
border-bottom: 1px solid rgba(176, 174, 199, 0.5);
height: 0px;
border-top: none;
margin-top: 15px;
margin-bottom: 15px;
}
}
\ No newline at end of file
}
}
import { Component, OnInit } from "@angular/core";
import { User } from "../../config/services/user";
import { UserService } from "../../config/user.service";
import { ServiceService } from "../../config/service.service";
import { Router, ActivatedRoute } from "@angular/router";
import { Component, OnInit } from '@angular/core';
import { User } from '../../config/services/user';
import { UserService } from '../../config/user.service';
import { ServiceService } from '../../config/service.service';
import { AuthService } from '../../config/auth.service';
import { Router, ActivatedRoute } from '@angular/router';
import { finalize, tap } from 'rxjs/operators';
import {
AngularFireStorage,
AngularFireStorageReference,
AngularFireUploadTask
} from '@angular/fire/storage';
import {
AngularFirestore,
AngularFirestoreDocument,
AngularFirestoreCollection
} from '@angular/fire/firestore';
@Component({
selector: "app-profile",
templateUrl: "./profile.page.html",
styleUrls: ["./profile.page.scss"]
selector: 'app-profile',
templateUrl: './profile.page.html',
styleUrls: ['./profile.page.scss']
})
export class ProfilePage implements OnInit {
user: User;
userdata: any;
custId: String;
custId: string;
userData: any;
loggedUser: any;
ref: AngularFireStorageReference;
downloadURL;
constructor(
private router: Router,
private storage: AngularFireStorage,
private useService: UserService,
private service: ServiceService
private service: ServiceService,
private authService: AuthService
) {
const params = this.useService.users;
const userdata = this.service.get("user").then(data => {
this.service.get('user').then(data => {
if (data) {
data = JSON.parse(data);
this.service.set("params", data);
this.custId = data.uid;
this.userData = JSON.parse(data);
console.log(this.userData);
}
});
this.useService.getUserData("9cYSZwGvVpgkUHVcz8Dm6oqGX152");
// .then(res => {
// console.log("asdasda", res);
// this.userdata = res;
// });
this.service.get('userData').then(data => {
if (data) {
this.loggedUser = JSON.parse(data);
}
});
}
goToPage(path, data = null) {
......@@ -43,11 +57,48 @@ export class ProfilePage implements OnInit {
}
ngOnInit() {
let This = this;
const This = this;
setTimeout(() => {
this.user = this.useService.users;
console.log("[users]", this.user);
this.service.set("params", this.user);
// console.log('[users]', this.user);
this.service.set('params', this.user);
}, 500);
}
async fileChange(event) {
const fileList: FileList = event.target.files;
if (fileList.length > 0) {
const reader = new FileReader();
let profilePic;
reader.onload = (events: any) => {
profilePic = events.target.result;
this.loggedUser.profilePhoto = events.target.result;
};
profilePic = event.target.result;
reader.readAsDataURL(event.target.files[0]);
const file = fileList[0];
const ext = file.name.split('.').pop();
if (ext === 'jpg' || ext === 'jpeg' || ext === 'png') {
const path = file.name; // + Date.now();
const ref = this.storage.ref(path);
const task = this.storage
.upload(path, file)
.snapshotChanges()
.pipe(
finalize(() => {
ref.getDownloadURL().subscribe(url => {
this.authService.profilePic(url);
});
})
)
.subscribe();
// this.downloadURL = await ref.getDownloadURL().toPromise();
// console.log(this.downloadURL);
}
}
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment