Commit beeb65fc by muhsin

pulled from arjunlatest

parents 08f9968e 29c6bd46
...@@ -78,7 +78,7 @@ ...@@ -78,7 +78,7 @@
input { input {
border: 1px solid rgba(215, 213, 228, 1); border: 1px solid rgba(215, 213, 228, 1);
background: transparent; background: transparent;
color: rgba(215, 213, 228, 1); color: #000;
width: 100%; width: 100%;
height: 45px; height: 45px;
text-align: left; text-align: left;
...@@ -86,6 +86,15 @@ ...@@ -86,6 +86,15 @@
font-size: 16px; font-size: 16px;
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
} }
.login_btn { .login_btn {
width: 100%; width: 100%;
......
...@@ -78,7 +78,7 @@ ...@@ -78,7 +78,7 @@
input { input {
border: 1px solid rgba(215, 213, 228, 1); border: 1px solid rgba(215, 213, 228, 1);
background: transparent; background: transparent;
color: rgba(215, 213, 228, 1); color: #000;
width: 100%; width: 100%;
height: 45px; height: 45px;
text-align: left; text-align: left;
...@@ -87,6 +87,15 @@ ...@@ -87,6 +87,15 @@
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
text-align: center; text-align: center;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
} }
.login_btn { .login_btn {
width: 100%; width: 100%;
......
...@@ -95,13 +95,15 @@ const routes: Routes = [ ...@@ -95,13 +95,15 @@ const routes: Routes = [
{ {
path: 'searchmodal', path: 'searchmodal',
loadChildren: './searchmodal/searchmodal.module#SearchmodalPageModule' loadChildren: './searchmodal/searchmodal.module#SearchmodalPageModule'
}, { path: 'noresult', loadChildren: './noresult/noresult.module#NoresultPageModule' }, },
{ path: 'noresult', loadChildren: './noresult/noresult.module#NoresultPageModule' },
{ path: 'feedback', loadChildren: './feedback/feedback.module#FeedbackPageModule' }, { path: 'feedback', loadChildren: './feedback/feedback.module#FeedbackPageModule' },
{ path: 'address', loadChildren: './address/address.module#AddressPageModule' }, { path: 'address', loadChildren: './address/address.module#AddressPageModule' },
{ path: 'success', loadChildren: './success/success.module#SuccessPageModule' }, { path: 'success', loadChildren: './success/success.module#SuccessPageModule' },
{ path: 'failed', loadChildren: './failed/failed.module#FailedPageModule' }, { path: 'failed', loadChildren: './failed/failed.module#FailedPageModule' },
{ path: 'preference', loadChildren: './preference/preference.module#PreferencePageModule' }, { path: 'preference', loadChildren: './preference/preference.module#PreferencePageModule' },
{ path: 'contact', loadChildren: './contact/contact.module#ContactPageModule' } { path: 'contact', loadChildren: './contact/contact.module#ContactPageModule' }
{ path: 'changeaddress', loadChildren: './changeaddress/changeaddress.module#ChangeaddressPageModule' }
]; ];
@NgModule({ @NgModule({
......
...@@ -113,6 +113,7 @@ export class AppComponent { ...@@ -113,6 +113,7 @@ export class AppComponent {
'feedback', 'feedback',
'wishlist', 'wishlist',
'preference', 'preference',
'changeaddress',
'changedetails' 'changedetails'
]; ];
const currentUrl = this.router.url.split('/'); const currentUrl = this.router.url.split('/');
......
...@@ -206,27 +206,30 @@ ...@@ -206,27 +206,30 @@
.coupon_code { .coupon_code {
padding-top: 20px; padding-top: 20px;
padding-bottom: 50px; padding-bottom: 50px;
border-bottom: 1px solid rgba(176, 174, 199, 1); border-bottom: 1px solid #b0aec7;
display: flex;
justify-content: space-between;
input { input {
width: calc(100% - 50px); width: 75%;
border: 1px solid rgba(176, 174, 199, 1); border: 1px solid #b0aec7;
border-radius: 20px; border-radius: 20px;
height: 35px; height: 35px;
padding-left: 20px; padding-left: 20px;
font-weight: 900; font-weight: 900;
color: rgba(215, 213, 228, 1); color: #29285b;
outline: none;
transition: all .4s ease-in-out;
&::placeholder { &::placeholder {
color: rgba(215, 213, 228, 1); color: rgba(215, 213, 228, 1);
outline: none;
} }
&:focus { &:focus {
color: rgba(215, 213, 228, 1); border: 1px solid #f3d09f;
outline: none; box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
} }
} }
.add_btn { .add_btn {
color: #29285b; color: #29285b;
width: 50px; width: 25%;
height: 35px; height: 35px;
background: transparent; background: transparent;
font-size: 17px; font-size: 17px;
......
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';
import { IonicModule } from '@ionic/angular';
import { ChangeaddressPage } from './changeaddress.page';
import { AgmCoreModule } from '@agm/core';
import { AgmDirectionModule } from 'agm-direction';
const routes: Routes = [
{
path: '',
component: ChangeaddressPage
}
];
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
AgmDirectionModule,
AgmCoreModule.forRoot({
apiKey: 'AIzaSyBn6hOlr6YHcZAmbptlsmbhvH5iQllWflE'
}),
RouterModule.forChild(routes)
],
declarations: [ChangeaddressPage]
})
export class ChangeaddressPageModule {}
<div class="nav_header">
<button class="nav_btn nav_back floatLeft" (click)="goBack()">
<img src="../assets/Group17_2.png" />
</button>
<div class="nav_title floatLeft">
<h4>Change Address</h4>
</div>
<div class="clear"></div>
</div>
<ion-content>
<div class="nearby_map">
<agm-map [latitude]="latitude" [longitude]="longitude" [zoom]="8" [backgroundColor]="'rgba(29, 27, 130,0.2)'">
<agm-marker [latitude]="latitude" [longitude]="longitude" [markerDraggable]="true" (dragEnd)="markerDragEnd($event)"></agm-marker>
</agm-map>
<form (ngSubmit)="onSubmit(addressForm.value); addressForm.reset()" #addressForm="ngForm" method="post" class="form-horizontal">
<div class="add_address_wrapper">
<h5>DELIVERY</h5>
<p>{{address}}</p>
<input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building" required placeholder="House No./ Building No" />
<div class="md-errors-spacer" [hidden]="building.valid || landmark.pristine" class="ion-padding-start">
Building Name is required
</div>
<input [(ngModel)]="addressForm.landmark" name="landmark" #landmark="ngModel" name="landmark" required placeholder="Landmark" />
<div class="md-errors-spacer" [hidden]="landmark.valid || landmark.pristine" class="ion-padding-start">
Landmark is required
</div>
<ion-grid>
<ion-row>
<ion-col>
<h6>
<input class="styled-checkbox" id="styled-check-1" type="radio" value="Home" [(ngModel)]="addressForm.addressType" name="addressType" #addressType="ngModel" required />
<label for="styled-check-1"><span>Home</span></label>
</h6>
</ion-col>
<ion-col>
<h6>
<input class="styled-checkbox" id="styled-check-2" type="radio" value="Work" [(ngModel)]="addressForm.addressType" name="addressType" #addressType="ngModel" required />
<label for="styled-check-2"><span>Office</span></label>
</h6>
</ion-col>
<ion-col>
<h6>
<input class="styled-checkbox" id="styled-check-3" type="radio" value="Other" [(ngModel)]="addressForm.addressType" name="addressType" #addressType="ngModel" required />
<label for="styled-check-3"><span>Others</span></label>
</h6>
</ion-col>
</ion-row>
<div class="md-errors-spacer" [hidden]="addressType.valid || addressType.pristine" class="ion-padding-start">
Address Type is required
</div>
</ion-grid>
<button class="add_btn" type="submit" [disabled]="!addressForm.form.valid">
ADD
</button>
</div>
</form>
</div>
<div class="loader" *ngIf="loader">
<div class="lds-ripple">
<div></div>
<div></div>
</div>
</div>
</ion-content>
\ No newline at end of file
.nearby_map {
width: 100%;
height: 100vh;
.overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background: rgba(29, 27, 130, 0.2);
}
agm-map {
width: 100%;
height: 100%;
position: relative;
}
.click_marker {
min-width: 200px;
padding: 10px;
h5 {
margin: 0px;
padding: 0px;
}
p {
margin: 0px;
padding: 0px;
}
}
}
.add_address_wrapper {
position: fixed;
bottom: 0px;
left: 0px;
right: 0px;
padding: 20px;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
background: #fff;
-webkit-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
h5 {
color: rgba(41, 40, 91, 1);
margin: 0px;
padding: 0px;
font-weight: 800;
}
input {
width: 100%;
height: 45px;
border: 1px solid #e1e0eb;
border-radius: 4px;
padding-left: 10px;
padding-right: 10px;
margin-bottom: 20px;
}
.add_btn {
width: 100%;
height: 45px;
background-color: #29285b;
color: #fff;
border-radius: 4px;
}
}
.styled-checkbox {
position: absolute; // take it out of document flow
opacity: 0; // hide it
&+label {
position: relative;
cursor: pointer;
padding: 0;
}
// Box.
&+label:before {
content: '';
margin-right: 10px;
display: inline-block;
vertical-align: text-top;
width: 20px;
height: 20px;
border-radius: 10px;
background: white;
border: 1px solid rgba(215, 213, 228, 1);
}
// Box hover
// Box checked
&:checked+label:before {
background: #29285b;
}
// Disabled state label.
&:disabled+label {
color: #b8b8b8;
cursor: auto;
}
// Disabled box.
&:disabled+label:before {
box-shadow: none;
background: #ddd;
}
// Checkmark. Could be replaced with an image
&:checked+label:after {
content: '';
position: absolute;
left: 6px;
top: 11px;
background: white;
width: 2px;
height: 2px;
box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
transform: rotate(45deg);
}
}
\ No newline at end of file
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ChangeaddressPage } from './changeaddress.page';
describe('ChangeaddressPage', () => {
let component: ChangeaddressPage;
let fixture: ComponentFixture<ChangeaddressPage>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ChangeaddressPage ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ChangeaddressPage);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import {
Component,
OnInit,
ViewChild,
ElementRef,
NgZone
} from '@angular/core';
import { Location } from '@angular/common';
import { Router, ActivatedRoute } from '@angular/router';
import { MapsAPILoader, MouseEvent } from '@agm/core';
import { Address } from './../../config/services/address';
import { AddressService } from './../../config/address.service';
import { ServiceService } from './../../config/service.service';
import { NgForm } from '@angular/forms';
import * as firebase from 'firebase';
@Component({
selector: 'app-changeaddress',
templateUrl: './changeaddress.page.html',
styleUrls: ['./changeaddress.page.scss']
})
export class ChangeaddressPage implements OnInit {
latitude: number;
longitude: number;
zoom: number;
address: string;
private geoCoder;
addressForm: NgForm;
addressData = new Address('', '', '', '', true, '', 0, '');
successState: boolean;
uid: string;
type: any;
loader: boolean;
public searchElementRef: ElementRef;
constructor(
private router: Router,
private route: ActivatedRoute,
private location: Location,
private mapsAPILoader: MapsAPILoader,
private ngZone: NgZone,
public addressService: AddressService,
public service: ServiceService
) {
this.successState = false;
this.type = 0;
const users = this.service.get('user').then(data => {
if (data) {
data = JSON.parse(data);
this.uid = data.uid;
}
});
this.service.get('type').then(data => {
this.type = data;
});
}
ngOnInit() {
// load Places Autocomplete
this.mapsAPILoader.load().then(() => {
this.setCurrentLocation();
this.geoCoder = new google.maps.Geocoder();
});
}
// google maps zoom level
private setCurrentLocation() {
if ('geolocation' in navigator) {
navigator.geolocation.getCurrentPosition(position => {
this.latitude = position.coords.latitude;
this.longitude = position.coords.longitude;
this.zoom = 8;
this.getAddress(this.latitude, this.longitude);
});
}
}
markerDragEnd($event: MouseEvent) {
console.log($event);
this.latitude = $event.coords.lat;
this.longitude = $event.coords.lng;
this.getAddress(this.latitude, this.longitude);
}
getAddress(latitude, longitude) {
this.geoCoder.geocode(
{ location: { lat: latitude, lng: longitude } },
(results, status) => {
console.log(results);
console.log(status);
if (status === 'OK') {
if (results[0]) {
this.zoom = 12;
this.address = results[0].formatted_address;
console.log(this.address);
} else {
window.alert('No results found');
}
} else {
window.alert('Geocoder failed due to: ' + status);
}
}
);
}
goToPage(path, data = null) {
this.router.navigateByUrl(path, { queryParams: data });
document.body.scrollTop = document.documentElement.scrollTop = 0;
}
goBack() {
window.history.back();
}
onSubmit(data: any) {
this.loader = true;
console.log(data);
const postData: Address = {
address: this.address,
addressType: data.addressType,
building: data.building,
landmark: data.landmark,
defaultVal: 0,
uid: this.uid,
latLng: new firebase.firestore.GeoPoint(this.latitude, this.longitude),
status: true
};
this.addressService.addressCreate(postData);
this.successState = true;
setTimeout(() => {
this.loader = false;
this.successState = false;
if (this.type === 1) {
this.service.set('type', 0);
this.router.navigateByUrl('home', { queryParams: null });
} else {
this.goBack();
}
}, 3000);
}
}
interface Marker {
lat: number;
lng: number;
label?: string;
draggable: boolean;
}
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
input { input {
border: 1px solid rgba(215, 213, 228, 1); border: 1px solid rgba(215, 213, 228, 1);
background: transparent; background: transparent;
color: rgba(215, 213, 228, 1); color: #000;
width: 100%; width: 100%;
height: 45px; height: 45px;
text-align: center; text-align: center;
...@@ -30,6 +30,15 @@ ...@@ -30,6 +30,15 @@
font-size: 16px; font-size: 16px;
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
} }
.login_btn { .login_btn {
width: 100%; width: 100%;
......
...@@ -8,12 +8,21 @@ ...@@ -8,12 +8,21 @@
input { input {
border: 1px solid rgba(215, 213, 228, 1); border: 1px solid rgba(215, 213, 228, 1);
background: transparent; background: transparent;
color: rgba(215, 213, 228, 1); color: #000;
width: 100%; width: 100%;
height: 45px; height: 45px;
text-align: center; text-align: center;
border-radius: 8px; border-radius: 8px;
font-size: 16px; font-size: 16px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
} }
.login_btn { .login_btn {
width: 100%; width: 100%;
......
...@@ -8,15 +8,21 @@ ...@@ -8,15 +8,21 @@
.form-control { .form-control {
border: 1px solid rgba(215, 213, 228, 1); border: 1px solid rgba(215, 213, 228, 1);
background: transparent; background: transparent;
color: #333; color: #000;
width: 100%; width: 100%;
border-radius: 8px; border-radius: 8px;
font-size: 16px; font-size: 16px;
padding: 11px 15px; padding: 11px 15px;
resize: none; resize: none;
outline: none;
transition: all .4s ease-in-out;
&::placeholder { &::placeholder {
color: rgba(215, 213, 228, 1); color: rgba(215, 213, 228, 1);
} }
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
} }
.login_btn { .login_btn {
width: 100%; width: 100%;
......
...@@ -8,12 +8,21 @@ ...@@ -8,12 +8,21 @@
input { input {
border: 1px solid rgba(215, 213, 228, 1); border: 1px solid rgba(215, 213, 228, 1);
background: transparent; background: transparent;
color: rgba(215, 213, 228, 1); color: #000;
width: 100%; width: 100%;
height: 45px; height: 45px;
text-align: center; text-align: center;
border-radius: 8px; border-radius: 8px;
font-size: 16px; font-size: 16px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
} }
.login_btn { .login_btn {
width: 100%; width: 100%;
......
<ion-content> <ion-content>
<div class="start_wizard_wrapper"> <div class="start_wizard_wrapper">
<ion-slides <ion-slides pager="true" [options]="landingOptions" (ionSlideDidChange)="slideChanged()">
pager="true"
[options]="landingOptions"
(ionSlideDidChange)="slideChanged()"
>
<ion-slide> <ion-slide>
<div class="wizard_inner_wrapper"> <div class="wizard_inner_wrapper">
<img src="../assets/Group 229_2.png" /> <img src="../assets/Group 229_2.png" />
<div class="wizard_textarea"> <div class="wizard_textarea">
<h3>EASY PURCHASE</h3> <h3>EASY PURCHASE</h3>
<p> <p>
Purchase your products from your<br /> Purchase your products from your<br /> favourite shops
favourite shops
</p> </p>
</div> </div>
</div> </div>
......
...@@ -46,7 +46,7 @@ export class LandingPage implements OnInit { ...@@ -46,7 +46,7 @@ export class LandingPage implements OnInit {
landingOptions = { landingOptions = {
initialSlide: 1, initialSlide: 1,
speed: 1000, speed: 1000,
allowTouchMove: false allowTouchMove: true
}; };
ngOnInit() {} ngOnInit() {}
......
...@@ -16,12 +16,21 @@ ...@@ -16,12 +16,21 @@
input { input {
border: 1px solid rgba(215, 213, 228, 1); border: 1px solid rgba(215, 213, 228, 1);
background: transparent; background: transparent;
color: rgba(215, 213, 228, 1); color: #000;
width: 100%; width: 100%;
height: 45px; height: 45px;
text-align: center; text-align: center;
border-radius: 8px; border-radius: 8px;
font-size: 16px; font-size: 16px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
} }
.login_btn { .login_btn {
width: 100%; width: 100%;
......
.nearby_map { .nearby_map {
width: 100%; width: 100%;
height: 100%; height: 100vh;
.overlay { .overlay {
position: absolute; position: absolute;
top: 0px; top: 0px;
...@@ -46,7 +46,6 @@ ...@@ -46,7 +46,6 @@
padding: 0px; padding: 0px;
font-weight: 800; font-weight: 800;
} }
input { input {
width: 100%; width: 100%;
height: 45px; height: 45px;
...@@ -55,6 +54,15 @@ ...@@ -55,6 +54,15 @@
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
margin-bottom: 20px; margin-bottom: 20px;
outline: none;
transition: all 0.4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
} }
.add_btn { .add_btn {
width: 100%; width: 100%;
...@@ -75,7 +83,7 @@ ...@@ -75,7 +83,7 @@
} }
// Box. // Box.
& + label:before { & + label:before {
content: ""; content: '';
margin-right: 10px; margin-right: 10px;
display: inline-block; display: inline-block;
vertical-align: text-top; vertical-align: text-top;
...@@ -102,7 +110,7 @@ ...@@ -102,7 +110,7 @@
} }
// Checkmark. Could be replaced with an image // Checkmark. Could be replaced with an image
&:checked + label:after { &:checked + label:after {
content: ""; content: '';
position: absolute; position: absolute;
left: 6px; left: 6px;
top: 11px; top: 11px;
......
...@@ -93,7 +93,17 @@ ...@@ -93,7 +93,17 @@
Delivery time : <span>{{deliveryTime}}</span> Delivery time : <span>{{deliveryTime}}</span>
</h5> </h5>
<h5>Order Status : <span>{{getStatus(data.orderStatus)}}</span></h5> <h5>Order Status : <span>{{getStatus(data.orderStatus)}}</span></h5>
<h4>DELIVERY</h4> <div class="delivery-wrap">
<h4 class="floatLeft">DELIVERY</h4>
<span class="floatRight"
><img
class="ng-tns-c3-0"
src="../../assets/edit.png"
(click)="goToPage('changeaddress')"
/></span>
<div class="clear"></div>
</div>
<h5 *ngIf="data.deliveryAddress"> <h5 *ngIf="data.deliveryAddress">
{{data.deliveryAddress.addressType}},<br />{{data.deliveryAddress.address}}, {{data.deliveryAddress.addressType}},<br />{{data.deliveryAddress.address}},
<br /> <br />
......
...@@ -172,6 +172,12 @@ ...@@ -172,6 +172,12 @@
margin-bottom: 20px; margin-bottom: 20px;
margin-top: 20px; margin-top: 20px;
} }
.delivery-wrap {
img {
width: 20px;
margin-top: 20px;
}
}
} }
.related_product_slider { .related_product_slider {
h5 { h5 {
......
...@@ -192,14 +192,14 @@ ...@@ -192,14 +192,14 @@
.styled-checkbox { .styled-checkbox {
position: absolute; // take it out of document flow position: absolute; // take it out of document flow
opacity: 0; // hide it opacity: 0; // hide it
& + label { &+label {
position: relative; position: relative;
cursor: pointer; cursor: pointer;
padding: 0; padding: 0;
width: 100%; width: 100%;
} }
// Box. // Box.
& + label:before { &+label:before {
content: ''; content: '';
margin-right: 10px; margin-right: 10px;
display: inline-block; display: inline-block;
...@@ -210,21 +210,21 @@ ...@@ -210,21 +210,21 @@
background: white; background: white;
border: 1px solid rgba(215, 213, 228, 1); border: 1px solid rgba(215, 213, 228, 1);
} }
&:checked + label:before { &:checked+label:before {
background: #29285b; background: #29285b;
} }
// Disabled state label. // Disabled state label.
&:disabled + label { &:disabled+label {
color: #b8b8b8; color: #b8b8b8;
cursor: auto; cursor: auto;
} }
// Disabled box. // Disabled box.
&:disabled + label:before { &:disabled+label:before {
box-shadow: none; box-shadow: none;
background: #ddd; background: #ddd;
} }
// Checkmark. Could be replaced with an image // Checkmark. Could be replaced with an image
&:checked + label:after { &:checked+label:after {
content: ''; content: '';
position: absolute; position: absolute;
left: 6px; left: 6px;
...@@ -232,8 +232,7 @@ ...@@ -232,8 +232,7 @@
background: white; background: white;
width: 2px; width: 2px;
height: 2px; height: 2px;
box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
transform: rotate(45deg); transform: rotate(45deg);
} }
} }
......
...@@ -15,39 +15,14 @@ ...@@ -15,39 +15,14 @@
<div class="form_div"> <div class="form_div">
<form #signupForm="ngForm" novalidate> <form #signupForm="ngForm" novalidate>
<div class="row"> <div class="row">
<input <input class="" type="text" placeholder="Your name" [(ngModel)]="signup.name" name="name" #name="ngModel" required />
class="" <div class="md-errors-spacer" [hidden]="name.valid || submitted == false">
type="text"
placeholder="Your name"
[(ngModel)]="signup.name"
name="name"
#name="ngModel"
required
/>
<div
class="md-errors-spacer"
[hidden]="name.valid || submitted == false"
class="ion-padding-start"
>
Name is required Name is required
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<input <input class="" type="email" placeholder="Email Address" [(ngModel)]="signup.emailId" name="emailId" #emailId="ngModel" email pattern="[a-zA-Z0-9.-_]{1,}@[a-zA-Z.-]{2,}[.]{1}[a-zA-Z]{2,}" required />
class="" <div class="md-errors-spacer" [hidden]="emailId.valid || submitted == false">
type="email"
placeholder="Email Address"
[(ngModel)]="signup.emailId"
name="emailId"
#emailId="ngModel"
email
pattern="[a-zA-Z0-9.-_]{1,}@[a-zA-Z.-]{2,}[.]{1}[a-zA-Z]{2,}"
required
/>
<div
class="md-errors-spacer"
[hidden]="emailId.valid || submitted == false"
>
<div *ngIf="emailId.errors && emailId.errors.required"> <div *ngIf="emailId.errors && emailId.errors.required">
Email is required Email is required
</div> </div>
...@@ -57,21 +32,8 @@ ...@@ -57,21 +32,8 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<input <input class="" type="text" placeholder="Phone number" [(ngModel)]="signup.phone" name="phone" #phone="ngModel" pattern="(\(+61\)|\+61|\(0[1-9]\)|0[1-9])?( ?-?[0-9]){6,9}" maxlength="10" required />
class="" <div class="md-errors-spacer" [hidden]="phone.valid || submitted == false">
type="text"
placeholder="Phone number"
[(ngModel)]="signup.phone"
name="phone"
#phone="ngModel"
pattern="(\(+61\)|\+61|\(0[1-9]\)|0[1-9])?( ?-?[0-9]){6,9}"
maxlength="10"
required
/>
<div
class="md-errors-spacer"
[hidden]="phone.valid || submitted == false"
>
<div *ngIf="phone.errors && phone.errors.required"> <div *ngIf="phone.errors && phone.errors.required">
Phone number is required Phone number is required
</div> </div>
...@@ -81,20 +43,8 @@ ...@@ -81,20 +43,8 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<input <input class="" type="password" placeholder="Create A Password" [(ngModel)]="signup.password" name="password" #password="ngModel" minlength="6" required />
class="" <div class="md-errors-spacer" [hidden]="password.valid || submitted == false">
type="password"
placeholder="Create A Password"
[(ngModel)]="signup.password"
name="password"
#password="ngModel"
minlength="6"
required
/>
<div
class="md-errors-spacer"
[hidden]="password.valid || submitted == false"
>
<div *ngIf="password.errors && password.errors.required"> <div *ngIf="password.errors && password.errors.required">
Password is required Password is required
</div> </div>
...@@ -104,45 +54,18 @@ ...@@ -104,45 +54,18 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<ion-datetime <ion-datetime displayFormat="DD-MM-YYYY" [(ngModel)]="signup.dob" name="dob" #dob="ngModel" placeholder="Date of Birth" max="{{minDate}}" required></ion-datetime>
displayFormat="DD-MM-YYYY" <div class="md-errors-spacer" [hidden]="dob.valid || submitted == false">
[(ngModel)]="signup.dob"
name="dob"
#dob="ngModel"
placeholder="Date of Birth"
max="{{minDate}}"
required
></ion-datetime>
<div
class="md-errors-spacer"
[hidden]="dob.valid || submitted == false"
>
<div *ngIf="dob.errors && dob.errors.required">DOB is required</div> <div *ngIf="dob.errors && dob.errors.required">DOB is required</div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<h6> <h6>
<input <input class="styled-checkbox" id="styled-checkbox-1" type="checkbox" value="true" [(ngModel)]="signup.terms" required name="terms" #terms="ngModel" />
class="styled-checkbox" <label for="styled-checkbox-1"><span>I agree with
id="styled-checkbox-1" <a (click)="menuToggle()">Terms and Conditions</a></span></label>
type="checkbox"
value="true"
[(ngModel)]="signup.terms"
required
name="terms"
#terms="ngModel"
/>
<label for="styled-checkbox-1"
><span
>I agree with
<a (click)="menuToggle()">Terms and Conditions</a></span
></label
>
</h6> </h6>
<div <div class="md-errors-spacer" [hidden]="terms.valid || submitted == false">
class="md-errors-spacer"
[hidden]="terms.valid || submitted == false"
>
<div *ngIf="terms.errors && terms.errors.required"> <div *ngIf="terms.errors && terms.errors.required">
Please accept Terms and Conditions Please accept Terms and Conditions
</div> </div>
...@@ -160,11 +83,7 @@ ...@@ -160,11 +83,7 @@
</div> </div>
<div class="row"> <div class="row">
<div class="social_div"> <div class="social_div">
<div <div class="social_btn" style="border-right:1px solid rgba(215, 213, 228, 1);" (click)="register.facebook()">
class="social_btn"
style="border-right:1px solid rgba(215, 213, 228, 1);"
(click)="register.facebook()"
>
Facebook Facebook
</div> </div>
<div class="social_btn" (click)="register.google(2)"> <div class="social_btn" (click)="register.google(2)">
...@@ -185,15 +104,9 @@ ...@@ -185,15 +104,9 @@
<div class="terms_inner"> <div class="terms_inner">
<h5>Terms & Conditions</h5> <h5>Terms & Conditions</h5>
<p> <p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has
Lorem Ipsum has been the industry's standard dummy text ever since the survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop
1500s, when an unknown printer took a galley of type and scrambled it to publishing software like Aldus PageMaker including versions of Lorem Ipsum.
make a type specimen book. It has survived not only five centuries, but
also the leap into electronic typesetting, remaining essentially
unchanged. It was popularised in the 1960s with the release of Letraset
sheets containing Lorem Ipsum passages, and more recently with desktop
publishing software like Aldus PageMaker including versions of Lorem
Ipsum.
</p> </p>
<button class="accept" (click)="menuToggle()">I Accept</button> <button class="accept" (click)="menuToggle()">I Accept</button>
</div> </div>
......
...@@ -16,23 +16,43 @@ ...@@ -16,23 +16,43 @@
input { input {
border: 1px solid rgba(215, 213, 228, 1); border: 1px solid rgba(215, 213, 228, 1);
background: transparent; background: transparent;
color: rgba(215, 213, 228, 1); color: #000;
width: 100%; width: 100%;
height: 45px; height: 45px;
text-align: center; text-align: center;
border-radius: 8px; border-radius: 8px;
font-size: 16px; font-size: 16px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.md-errors-spacer {
color: #c76969;
font-size: 14px;
} }
ion-datetime { ion-datetime {
border: 1px solid rgba(215, 213, 228, 1); border: 1px solid rgba(215, 213, 228, 1);
background: transparent; background: transparent;
color: rgba(215, 213, 228, 1); color: #000;
width: 100%; width: 100%;
height: 45px; height: 45px;
text-align: center; text-align: center;
border-radius: 8px; border-radius: 8px;
font-size: 16px; font-size: 16px;
padding-left: 0px; padding-left: 0px;
&::placeholder {
color: rgba(215, 213, 228, 1) !important;
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
} }
.login_btn { .login_btn {
width: 100%; width: 100%;
......
...@@ -8,12 +8,21 @@ ...@@ -8,12 +8,21 @@
input { input {
border: 1px solid rgba(215, 213, 228, 1); border: 1px solid rgba(215, 213, 228, 1);
background: transparent; background: transparent;
color: rgba(215, 213, 228, 1); color: #000;
width: 100%; width: 100%;
height: 45px; height: 45px;
text-align: center; text-align: center;
border-radius: 8px; border-radius: 8px;
font-size: 16px; font-size: 16px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
} }
.login_btn { .login_btn {
width: 100%; width: 100%;
......
import { Injectable } from "@angular/core"; import { Injectable } from '@angular/core';
import { User, Signup, Address } from "./services/user"; import { User, Signup, Address } from './services/user';
import { auth } from "firebase/app"; import { auth } from 'firebase/app';
import { Router, ActivatedRoute } from "@angular/router"; import { Router, ActivatedRoute } from '@angular/router';
import { AngularFireAuth } from "@angular/fire/auth"; import { AngularFireAuth } from '@angular/fire/auth';
import { import {
AngularFirestore, AngularFirestore,
AngularFirestoreDocument, AngularFirestoreDocument,
AngularFirestoreCollection AngularFirestoreCollection
} from "@angular/fire/firestore"; } from '@angular/fire/firestore';
import { ServiceService } from "./../config/service.service"; import { ServiceService } from './../config/service.service';
import { SubjectService } from "./../config/subject.service"; import { SubjectService } from './../config/subject.service';
import { GooglePlus } from "@ionic-native/google-plus/ngx"; import { GooglePlus } from '@ionic-native/google-plus/ngx';
import { take } from "rxjs/operators"; import { take } from 'rxjs/operators';
import { from } from "rxjs"; import { from } from 'rxjs';
@Injectable({ @Injectable({
providedIn: "root" providedIn: 'root'
}) })
export class AuthService { export class AuthService {
loader: boolean; loader: boolean;
...@@ -30,33 +30,33 @@ export class AuthService { ...@@ -30,33 +30,33 @@ export class AuthService {
this.loader = true; this.loader = true;
this.type = 1; this.type = 1;
this.afAuth.authState.subscribe(user => { this.afAuth.authState.subscribe(user => {
console.log("here"); console.log('here');
console.log(user); console.log(user);
if (user) { if (user) {
this.subjectService.sendLoginData(false); this.subjectService.sendLoginData(false);
this.userData = user; this.userData = user;
console.log(this.userData); console.log(this.userData);
this.service.set("user", JSON.stringify(this.userData)); this.service.set('user', JSON.stringify(this.userData));
this.SetUserData(user); this.SetUserData(user);
this.loader = false; this.loader = false;
if (this.type === 1) { if (this.type === 1) {
this.router.navigateByUrl("home"); this.router.navigateByUrl('home');
} else { } else {
this.router.navigateByUrl("verification"); this.router.navigateByUrl('verification');
} }
} else { } else {
console.log("here too"); console.log('here too');
this.loader = false; this.loader = false;
this.subjectService.sendLoginData(true); this.subjectService.sendLoginData(true);
this.service.set("user", null); this.service.set('user', null);
JSON.parse(localStorage.getItem("user")); JSON.parse(localStorage.getItem('user'));
this.router.navigateByUrl("login"); this.router.navigateByUrl('login');
} }
}); });
} }
get isLoggedIn(): boolean { get isLoggedIn(): boolean {
const user = JSON.parse(localStorage.getItem("user")); const user = JSON.parse(localStorage.getItem('user'));
return user !== null && user.emailVerified !== false ? true : false; return user !== null && user.emailVerified !== false ? true : false;
} }
userData: any; userData: any;
...@@ -70,21 +70,21 @@ export class AuthService { ...@@ -70,21 +70,21 @@ export class AuthService {
return this.afAuth.auth return this.afAuth.auth
.signInWithEmailAndPassword(email, password) .signInWithEmailAndPassword(email, password)
.then(result => { .then(result => {
console.log("success"); console.log('success');
document.body.scrollTop = document.documentElement.scrollTop = 0; document.body.scrollTop = document.documentElement.scrollTop = 0;
this.SetUserData(result.user); this.SetUserData(result.user);
}) })
.catch(error => { .catch(error => {
this.loader = false; this.loader = false;
this.service.showToast(error.message, "bottom", "my-error", 1000); this.service.showToast(error.message, 'bottom', 'my-error', 1000);
}); });
} }
public async verify(otp: string) { public async verify(otp: string) {
this.loader = true; this.loader = true;
const custRef: AngularFirestoreCollection<any> = this.afs.collection( const custRef: AngularFirestoreCollection<any> = this.afs.collection(
"customers", 'customers',
ref => ref.where("otp", "==", otp).where("uid", "==", this.userData.uid) ref => ref.where('otp', '==', otp).where('uid', '==', this.userData.uid)
); );
custRef custRef
.valueChanges() .valueChanges()
...@@ -92,18 +92,18 @@ export class AuthService { ...@@ -92,18 +92,18 @@ export class AuthService {
.subscribe((value: User[]) => { .subscribe((value: User[]) => {
if (value.length > 0) { if (value.length > 0) {
this.afs this.afs
.collection("customers") .collection('customers')
.doc(this.userData.uid) .doc(this.userData.uid)
.update({ otp: "", phoneVerified: true }); .update({ otp: '', phoneVerified: true });
this.service.set("type", 1); this.service.set('type', 1);
this.loader = false; this.loader = false;
this.router.navigateByUrl("nearby"); this.router.navigateByUrl('nearby');
} else { } else {
this.loader = false; this.loader = false;
this.service.showToast( this.service.showToast(
"Please input valid OTP", 'Please input valid OTP',
"bottom", 'bottom',
"my-error", 'my-error',
1000 1000
); );
} }
...@@ -112,7 +112,7 @@ export class AuthService { ...@@ -112,7 +112,7 @@ export class AuthService {
profilePic(pic) { profilePic(pic) {
this.afs this.afs
.collection("customers") .collection('customers')
.doc(this.userData.uid) .doc(this.userData.uid)
.update({ profilePhoto: pic }); .update({ profilePhoto: pic });
} }
...@@ -123,7 +123,7 @@ export class AuthService { ...@@ -123,7 +123,7 @@ export class AuthService {
this.afAuth.auth this.afAuth.auth
.signInWithPopup(new auth.GoogleAuthProvider()) .signInWithPopup(new auth.GoogleAuthProvider())
.then(result => { .then(result => {
console.log("success"); console.log('success');
console.log(result.additionalUserInfo.isNewUser); console.log(result.additionalUserInfo.isNewUser);
if ( if (
result.additionalUserInfo && result.additionalUserInfo &&
...@@ -150,11 +150,11 @@ export class AuthService { ...@@ -150,11 +150,11 @@ export class AuthService {
.signInWithPopup(new auth.FacebookAuthProvider()) .signInWithPopup(new auth.FacebookAuthProvider())
.then(result => { .then(result => {
this.loader = false; this.loader = false;
console.log("success"); console.log('success');
console.log(result); console.log(result);
}) })
.catch(err => { .catch(err => {
this.service.showToast(err.message, "bottom", "my-error", 1000); this.service.showToast(err.message, 'bottom', 'my-error', 1000);
}); });
} catch (error) { } catch (error) {
This.loader = false; This.loader = false;
...@@ -181,7 +181,7 @@ export class AuthService { ...@@ -181,7 +181,7 @@ export class AuthService {
loginType: value.loginType loginType: value.loginType
}; };
this.loggedUser = userData; this.loggedUser = userData;
this.service.set("userData", JSON.stringify(this.loggedUser)); this.service.set('userData', JSON.stringify(this.loggedUser));
this.subjectService.sendUserData(JSON.stringify(this.loggedUser)); this.subjectService.sendUserData(JSON.stringify(this.loggedUser));
console.log(this.loggedUser); console.log(this.loggedUser);
}); });
...@@ -191,9 +191,9 @@ export class AuthService { ...@@ -191,9 +191,9 @@ export class AuthService {
this.loader = true; this.loader = true;
return this.afAuth.auth.signOut().then(() => { return this.afAuth.auth.signOut().then(() => {
this.subjectService.sendLoginData(true); this.subjectService.sendLoginData(true);
this.service.remove("user"); this.service.remove('user');
this.loader = false; this.loader = false;
console.log("logout"); console.log('logout');
}); });
} }
...@@ -201,9 +201,9 @@ export class AuthService { ...@@ -201,9 +201,9 @@ export class AuthService {
this.type = 2; this.type = 2;
console.log(userData.user); console.log(userData.user);
const currencyData = { const currencyData = {
currId: "123", currId: '123',
currName: "Australian dollar", currName: 'Australian dollar',
symbol: "A$" symbol: 'A$'
}; };
const otp = Math.floor(1000 + Math.random() * 9000); const otp = Math.floor(1000 + Math.random() * 9000);
userData = userData.user; userData = userData.user;
...@@ -223,11 +223,11 @@ export class AuthService { ...@@ -223,11 +223,11 @@ export class AuthService {
this.userPostData = postData; this.userPostData = postData;
console.log(postData); console.log(postData);
this.afs this.afs
.collection("customers") .collection('customers')
.doc(userData.uid) .doc(userData.uid)
.set(postData) .set(postData)
.then(() => { .then(() => {
console.log("successs"); console.log('successs');
}); });
} }
...@@ -242,15 +242,15 @@ export class AuthService { ...@@ -242,15 +242,15 @@ export class AuthService {
console.log(result.user); console.log(result.user);
this.afAuth.auth.currentUser.sendEmailVerification(); this.afAuth.auth.currentUser.sendEmailVerification();
const currencyData = { const currencyData = {
currId: "123", currId: '123',
currName: "Australian dollar", currName: 'Australian dollar',
symbol: "A$" symbol: 'A$'
}; };
const custData = result.user; const custData = result.user;
const postData: User = { const postData: User = {
uid: custData.uid, uid: custData.uid,
status: true, status: true,
profilePhoto: "", profilePhoto: '',
phoneVerified: false, phoneVerified: false,
phone: userData.phone, phone: userData.phone,
name: userData.name, name: userData.name,
...@@ -263,11 +263,11 @@ export class AuthService { ...@@ -263,11 +263,11 @@ export class AuthService {
this.userPostData = postData; this.userPostData = postData;
console.log(postData); console.log(postData);
this.afs this.afs
.collection("customers") .collection('customers')
.doc(custData.uid) .doc(custData.uid)
.set(postData) .set(postData)
.then(() => { .then(() => {
console.log("successs"); console.log('successs');
}); });
this.loader = false; this.loader = false;
}) })
...@@ -282,7 +282,7 @@ export class AuthService { ...@@ -282,7 +282,7 @@ export class AuthService {
console.log(this.userData.uid); console.log(this.userData.uid);
this.loader = true; this.loader = true;
this.afs this.afs
.collection("address") .collection('address')
.add({ .add({
uid: this.userData.uid uid: this.userData.uid
}) })
...@@ -306,13 +306,13 @@ export class AuthService { ...@@ -306,13 +306,13 @@ export class AuthService {
const neworderId = docRef.id; const neworderId = docRef.id;
console.log(addrData); console.log(addrData);
this.afs this.afs
.collection("address") .collection('address')
.doc(neworderId) .doc(neworderId)
.set(addrData) .set(addrData)
.then(() => { .then(() => {
console.log("Address add Successfully"); console.log('Address add Successfully');
this.service.set("user", JSON.stringify(this.userData)); this.service.set('user', JSON.stringify(this.userData));
this.router.navigateByUrl("home"); this.router.navigateByUrl('home');
document.body.scrollTop = document.documentElement.scrollTop = 0; document.body.scrollTop = document.documentElement.scrollTop = 0;
}) })
.catch(err => { .catch(err => {
......
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