Skip to content

G
getme
Commit e48283aa by amalk
Options

14-11-2019

parent 4894b145
Showing with 312 additions and 189 deletions
src/app/app-routing.module.ts
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router'; import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
const routes: Routes = [
{
path: '', loadChildren: './landing/landing.module#LandingPageModule'
},
{ path: 'tabs',loadChildren: './tabs/tabs.module#TabsPageModule' },
{ path: 'login', loadChildren: './login/login.module#LoginPageModule' },
{ path: 'signup', loadChildren: './signup/signup.module#SignupPageModule' },
{ path: 'verification', loadChildren: './verification/verification.module#VerificationPageModule' },
{ path: 'forgot', loadChildren: './forgot/forgot.module#ForgotPageModule' },
{ path: 'changepass', loadChildren: './changepass/changepass.module#ChangepassPageModule' },
{ path: 'orderdelivered', loadChildren: './orderdelivered/orderdelivered.module#OrderdeliveredPageModule' },
{ path: 'orderplaced', loadChildren: './orderplaced/orderplaced.module#OrderplacedPageModule' },
{ path: 'ordercancelled', loadChildren: './ordercancelled/ordercancelled.module#OrdercancelledPageModule' },
{ path: 'myorder', loadChildren: './myorder/myorder.module#MyorderPageModule' },
{ path: 'cart', loadChildren: './cart/cart.module#CartPageModule' },
{ path: 'changedetails', loadChildren: './changedetails/changedetails.module#ChangedetailsPageModule' },
{ path: 'wishlist', loadChildren: './wishlist/wishlist.module#WishlistPageModule' },
{ path: 'addaddresss', loadChildren: './addaddresss/addaddresss.module#AddaddresssPageModule' },
{ path: 'profile', loadChildren: './profile/profile.module#ProfilePageModule' },
{ path: 'home', loadChildren: './home/home.module#HomePageModule' },
{ path: 'productlist', loadChildren: './productlist/productlist.module#ProductlistPageModule' },
{ path: 'productdetail', loadChildren: './productdetail/productdetail.module#ProductdetailPageModule' },
{ path: 'reviewlist', loadChildren: './reviewlist/reviewlist.module#ReviewlistPageModule' },
{ path: 'catagory', loadChildren: './catagory/catagory.module#CatagoryPageModule' },
{ path: 'trackorder', loadChildren: './trackorder/trackorder.module#TrackorderPageModule' },
{ path: 'storelist', loadChildren: './storelist/storelist.module#StorelistPageModule' },
{ path: 'catstorelist', loadChildren: './catstorelist/catstorelist.module#CatStorelistPageModule' },
{ path: 'nearby', loadChildren: './nearby/nearby.module#NearbyPageModule' },
{ path: 'review', loadChildren: './review/review.module#ReviewPageModule' },
{ path: 'delivery', loadChildren: './delivery/delivery.module#DeliveryPageModule' },
{ path: 'addcard', loadChildren: './addcard/addcard.module#AddcardPageModule' }, { path: 'searchmodal', loadChildren: './searchmodal/searchmodal.module#SearchmodalPageModule' }
const routes: Routes = [
{
path: '', loadChildren: './landing/landing.module#LandingPageModule' ];
}, @NgModule({
{ path: 'tabs',loadChildren: './tabs/tabs.module#TabsPageModule' }, imports: [
{ path: 'login', loadChildren: './login/login.module#LoginPageModule' }, RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
{ path: 'signup', loadChildren: './signup/signup.module#SignupPageModule' }, ],
{ path: 'verification', loadChildren: './verification/verification.module#VerificationPageModule' }, exports: [RouterModule]
{ path: 'forgot', loadChildren: './forgot/forgot.module#ForgotPageModule' }, })
{ path: 'changepass', loadChildren: './changepass/changepass.module#ChangepassPageModule' }, export class AppRoutingModule {}
{ path: 'orderdelivered', loadChildren: './orderdelivered/orderdelivered.module#OrderdeliveredPageModule' },
{ path: 'orderplaced', loadChildren: './orderplaced/orderplaced.module#OrderplacedPageModule' },
{ path: 'ordercancelled', loadChildren: './ordercancelled/ordercancelled.module#OrdercancelledPageModule' },
{ path: 'myorder', loadChildren: './myorder/myorder.module#MyorderPageModule' },
{ path: 'cart', loadChildren: './cart/cart.module#CartPageModule' },
{ path: 'changedetails', loadChildren: './changedetails/changedetails.module#ChangedetailsPageModule' },
{ path: 'wishlist', loadChildren: './wishlist/wishlist.module#WishlistPageModule' },
{ path: 'addaddresss', loadChildren: './addaddresss/addaddresss.module#AddaddresssPageModule' },
{ path: 'profile', loadChildren: './profile/profile.module#ProfilePageModule' },
{ path: 'home', loadChildren: './home/home.module#HomePageModule' },
{ path: 'productlist', loadChildren: './productlist/productlist.module#ProductlistPageModule' },
{ path: 'productdetail', loadChildren: './productdetail/productdetail.module#ProductdetailPageModule' },
{ path: 'reviewlist', loadChildren: './reviewlist/reviewlist.module#ReviewlistPageModule' },
{ path: 'catagory', loadChildren: './catagory/catagory.module#CatagoryPageModule' },
{ path: 'trackorder', loadChildren: './trackorder/trackorder.module#TrackorderPageModule' },
{ path: 'storelist', loadChildren: './storelist/storelist.module#StorelistPageModule' },
{ path: 'catstorelist', loadChildren: './catstorelist/catstorelist.module#CatStorelistPageModule' },
{ path: 'nearby', loadChildren: './nearby/nearby.module#NearbyPageModule' },
{ path: 'review', loadChildren: './review/review.module#ReviewPageModule' },
{ path: 'delivery', loadChildren: './delivery/delivery.module#DeliveryPageModule' },
{ path: 'addcard', loadChildren: './addcard/addcard.module#AddcardPageModule' }
];
@NgModule({
imports: [
RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
],
exports: [RouterModule]
})
export class AppRoutingModule {}
......
src/app/app.module.ts
...@@ -33,20 +33,21 @@ import { FormsModule } from '@angular/forms'; ...@@ -33,20 +33,21 @@ import { FormsModule } from '@angular/forms';
@NgModule({ @NgModule({
declarations: [AppComponent], declarations: [AppComponent],
entryComponents: [ entryComponents: [],
], imports: [
imports: [BrowserModule, BrowserModule,
IonicModule.forRoot(), IonicModule.forRoot(),
IonicStorageModule.forRoot(), IonicStorageModule.forRoot(),
AppRoutingModule, AppRoutingModule,
BrowserAnimationsModule, BrowserAnimationsModule,
AngularFireModule.initializeApp(environment.firebase), AngularFireModule.initializeApp(environment.firebase),
DeliverypopPageModule, DeliverypopPageModule,
AngularFireAuthModule, AngularFireAuthModule,
AngularFirestoreModule, AngularFirestoreModule,
FormsModule FormsModule
], ],
providers: [ providers: [
StatusBar, StatusBar,
......
src/app/home/home.module.ts
...@@ -9,6 +9,9 @@ import { HomePage } from './home.page'; ...@@ -9,6 +9,9 @@ import { HomePage } from './home.page';
import { AgmCoreModule } from '@agm/core'; import { AgmCoreModule } from '@agm/core';
import { AgmDirectionModule } from 'agm-direction'; import { AgmDirectionModule } from 'agm-direction';
import { from } from 'rxjs';
const routes: Routes = [ const routes: Routes = [
{ {
path: '', path: '',
......
src/app/home/home.page.html
...@@ -6,14 +6,7 @@ ...@@ -6,14 +6,7 @@
<div class="nav_title floatLeft relative"> <div class="nav_title floatLeft relative">
<input class="search_bar" placeholder="Search here.. eg:shirts, retailers etc..." (click)="clickSearch()"> <input class="search_bar" placeholder="Search here.. eg:shirts, retailers etc..." (click)="clickSearch()">
<div class="search_item_list" [hidden]="searchShow">
<ul>
<li>Listing 1</li>
<li>Listing 2</li>
<li>Listing 3</li>
<li>Listing 4</li>
</ul>
</div>
</div> </div>
<button class="nav_btn nav_search floatRight"> <button class="nav_btn nav_search floatRight">
</button> </button>
...@@ -122,7 +115,6 @@ ...@@ -122,7 +115,6 @@
<div class="clear"></div> <div class="clear"></div>
</div> </div>
<ion-content class="sort_wrappper"> <ion-content class="sort_wrappper">
<agm-map [zoom]="20" [latitude]="lat" [longitude]="lng" [disableDefaultUI]="false" [zoomControl]="false" [backgroundColor]="'rgba(29, 27, 130,0.2)'"> <agm-map [zoom]="20" [latitude]="lat" [longitude]="lng" [disableDefaultUI]="false" [zoomControl]="false" [backgroundColor]="'rgba(29, 27, 130,0.2)'">
</agm-map> </agm-map>
<div class="add_address_wrapper"> <div class="add_address_wrapper">
...@@ -175,4 +167,15 @@ ...@@ -175,4 +167,15 @@
</div> </div>
</ion-content> </ion-content>
</div>
<div class="search_item_list" *ngIf="searchShow" [@slideInOut]>
<ul (click)="clickSearch()">
<li>Listing 1</li>
<li>Listing 2</li>
<li>Listing 3</li>
<li>Listing 4</li>
</ul>
</div> </div>
\ No newline at end of file
src/app/home/home.page.scss
.search_item_list {
position: absolute;
background-color: #fff;
left: 0px;
right: 0px;
width: 100%;
margin: 0px;
top: 50px;
ul {
margin: 0px;
padding: 0px;
li {
list-style: none;
color: rgba(59, 57, 77, 1);
text-align: left;
list-style: none;
padding: 10px;
border-bottom: 1px solid #ddd;
&:hover {
background-color: rgba(59, 57, 77, 1);
color: #fff;
}
&:focus {
background-color: rgba(59, 57, 77, 1);
color: #fff;
}
}
}
}
.home_wrapper { .home_wrapper {
width: 100%; width: 100%;
.home_banner { .home_banner {
...@@ -349,4 +319,36 @@ ...@@ -349,4 +319,36 @@
} }
} }
} }
}
.search_item_list {
position: absolute;
background-color: #fff;
left: 0px;
right: 0px;
width: 100%;
margin: 0px;
top: 50px;
bottom: 0px;
z-index: 99;
ul {
margin: 0px;
padding: 0px;
li {
list-style: none;
color: rgba(59, 57, 77, 1);
text-align: left;
list-style: none;
padding: 10px;
border-bottom: 1px solid #ddd;
&:hover {
background-color: rgba(59, 57, 77, 1);
color: #fff;
}
&:focus {
background-color: rgba(59, 57, 77, 1);
color: #fff;
}
}
}
} }
\ No newline at end of file
src/app/home/home.page.ts
...@@ -8,6 +8,7 @@ import { ShoppersService } from './../../config/shopper.service'; ...@@ -8,6 +8,7 @@ import { ShoppersService } from './../../config/shopper.service';
import { CategoriesService } from './../../config/category.service'; import { CategoriesService } from './../../config/category.service';
import { ServiceService } from './../../config/service.service'; import { ServiceService } from './../../config/service.service';
import { from } from 'rxjs'; import { from } from 'rxjs';
import { ModalController } from "@ionic/angular";
@Component({ @Component({
selector: "app-home", selector: "app-home",
...@@ -27,7 +28,7 @@ import { from } from 'rxjs'; ...@@ -27,7 +28,7 @@ import { from } from 'rxjs';
}) })
export class HomePage implements OnInit { export class HomePage implements OnInit {
isShow = false; isShow = false;
searchShow = true; searchShow = false;
public lat = 51.678418; public lat = 51.678418;
public lng = 7.809007; public lng = 7.809007;
...@@ -43,7 +44,8 @@ export class HomePage implements OnInit { ...@@ -43,7 +44,8 @@ export class HomePage implements OnInit {
public centerService: CenterService, public centerService: CenterService,
public shopperService: ShoppersService, public shopperService: ShoppersService,
public categoriesService: CategoriesService, public categoriesService: CategoriesService,
public service: ServiceService public service: ServiceService,
public modalController: ModalController
) {} ) {}
ngOnInit() { ngOnInit() {
......
src/app/nearby/nearby.page.html
...@@ -9,16 +9,16 @@ ...@@ -9,16 +9,16 @@
</div> </div>
<ion-content> <ion-content>
<div class="nearby_map"> <div class="nearby_map">
<agm-map [latitude]="lat" [longitude]="lng" [zoom]="15" [disableDefaultUI]="false" [backgroundColor]="'rgba(29, 27, 130,0.2)'">
<agm-marker [iconUrl]="'/assets/nearby.png'" *ngFor="let m of markers; let i = index" [latitude]="m.lat" [longitude]="m.lng" [label]="m.label" [markerDraggable]="m.draggable"> <agm-map [latitude]="lat" [longitude]="lng" [zoom]="15" [backgroundColor]="'rgba(29, 27, 130,0.2)'">
<agm-info-window> <agm-marker [latitude]="latitude" [longitude]="longitude" [markerDraggable]="true" (dragEnd)="markerDragEnd($event)"></agm-marker>
<div class="click_marker">
<h5>Lulufashion Store</h5>
<p>Women's Fashion</p>
</div>
</agm-info-window>
</agm-marker>
<agm-circle [latitude]="lat + 0.3" [longitude]="lng" [radius]="5000" [fillColor]="'rgba(29, 27, 130,1)'" [circleDraggable]="true" [editable]="true"></agm-circle>
</agm-map> </agm-map>
<div class="add_address_wrapper">
<h5>DELIVERY</h5>
<p>{{address}}</p>
<input class="" placeholder="House No./ Building No">
<input class="" placeholder="Landmark">
<button class="add_btn">ADD</button>
</div>
</div> </div>
</ion-content> </ion-content>
\ No newline at end of file
src/app/nearby/nearby.page.scss
.nearby_map { .nearby_map {
width: 100%; width: 100%;
height: 100vh; height: 100vh;
.overlay{ .overlay {
position:absolute; position: absolute;
top:0px; top: 0px;
left:0px; left: 0px;
right:0px; right: 0px;
bottom:0px; bottom: 0px;
background:rgba(29, 27, 130,0.2); background: rgba(29, 27, 130, 0.2);
} }
agm-map { agm-map {
width: 100%; width: 100%;
height: 100%; height: 100%;
position:relative; position: relative;
} }
.click_marker{ .click_marker {
min-width: 200px; min-width: 200px;
padding:10px; padding: 10px;
h5{ h5 {
margin:0px; margin: 0px;
padding:0px; padding: 0px;
} }
p{ p {
margin:0px; margin: 0px;
padding: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;
}
p {}
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;
}
}
\ No newline at end of file
src/app/nearby/nearby.page.ts
import { Component, OnInit } from '@angular/core'; import {Component,OnInit,ViewChild,ElementRef,NgZone} from "@angular/core";
import { Location } from '@angular/common'; import { Location } from '@angular/common';
import { Router, ActivatedRoute } from '@angular/router'; import { Router, ActivatedRoute } from '@angular/router';
import { MouseEvent } from '@agm/core'; import { MapsAPILoader, MouseEvent } from "@agm/core";
@Component({ @Component({
selector: 'app-nearby', selector: "app-nearby",
templateUrl: './nearby.page.html', templateUrl: "./nearby.page.html",
styleUrls: ['./nearby.page.scss'], styleUrls: ["./nearby.page.scss"]
}) })
export class NearbyPage implements OnInit { export class NearbyPage implements OnInit {
latitude: number;
longitude: number;
zoom: number;
address: string;
private geoCoder;
public searchElementRef: ElementRef;
markers = [
{
lat: 51.67,
lng: 7.815982,
draggable: true
},
{
lat: 51.678,
lng: 7.827,
draggable: false
},
{
lat: 51.65,
lng: 7.82,
draggable: false
},
{
lat: 51.655,
lng: 7.86,
draggable: false
},
{
lat: 51.69,
lng: 7.88,
draggable: true
}
];
constructor( constructor(
private router: Router, private router: Router,
private route: ActivatedRoute, private route: ActivatedRoute,
private location: Location private location: Location,
) { } private mapsAPILoader: MapsAPILoader,
private ngZone: NgZone
) {}
ngOnInit() { ngOnInit() {
//load Places Autocomplete
this.mapsAPILoader.load().then(() => {
this.setCurrentLocation();
this.geoCoder = new google.maps.Geocoder();
});
}
// google maps zoom level
} private setCurrentLocation() {
// google maps zoom level if ("geolocation" in navigator) {
navigator.geolocation.getCurrentPosition(position => {
lat: number = 51.673858; this.latitude = position.coords.latitude;
lng: number = 7.815982; this.longitude = position.coords.longitude;
this.zoom = 8;
clickedMarker(label: string, index: number) { this.getAddress(this.latitude, this.longitude);
console.log(`clicked the marker: ${label || index}`) });
}
} }
mapClicked($event: MouseEvent) { markerDragEnd($event: MouseEvent) {
this.markers.push({ console.log($event);
lat: $event.coords.lat, this.latitude = $event.coords.lat;
lng: $event.coords.lng, this.longitude = $event.coords.lng;
draggable: true this.getAddress(this.latitude, this.longitude);
});
} }
markerDragEnd(m, $event: MouseEvent) { getAddress(latitude, longitude) {
console.log('dragEnd', m, $event); 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;
} else {
window.alert("No results found");
}
} else {
window.alert("Geocoder failed due to: " + status);
}
}
);
} }
goToPage(path, data = null) { goToPage(path, data = null) {
this.router.navigateByUrl(path, { queryParams: data }); this.router.navigateByUrl(path, { queryParams: data });
document.body.scrollTop = document.documentElement.scrollTop = 0; document.body.scrollTop = document.documentElement.scrollTop = 0;
...@@ -80,7 +80,7 @@ export class NearbyPage implements OnInit { ...@@ -80,7 +80,7 @@ export class NearbyPage implements OnInit {
goBack() { goBack() {
window.history.back(); window.history.back();
} }
} }
interface marker { interface marker {
lat: number; lat: number;
......
src/app/searchmodal/searchmodal.module.ts 0 → 100644
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 { SearchmodalPage } from './searchmodal.page';
const routes: Routes = [
{
path: '',
component: SearchmodalPage
}
];
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
RouterModule.forChild(routes)
],
exports: [
SearchmodalPage
],
declarations: [SearchmodalPage]
})
export class SearchmodalPageModule {}
src/app/searchmodal/searchmodal.page.spec.ts 0 → 100644
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { SearchmodalPage } from './searchmodal.page';
describe('SearchmodalPage', () => {
let component: SearchmodalPage;
let fixture: ComponentFixture<SearchmodalPage>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ SearchmodalPage ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(SearchmodalPage);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/searchmodal/searchmodal.page.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-searchmodal',
templateUrl: './searchmodal.page.html',
styleUrls: ['./searchmodal.page.scss'],
})
export class SearchmodalPage implements OnInit {
constructor() { }
ngOnInit() {
}
}
src/global.scss
...@@ -423,16 +423,16 @@ app-deliverypop { ...@@ -423,16 +423,16 @@ app-deliverypop {
} }
.not { .not {
background-color: rgba(59, 57, 77, 1); background-color: #3b394d;
color: #fff; color: #fff;
width: 20px; width: 17px;
height: 20px; height: 17px;
border-radius: 50%; border-radius: 50%;
position: absolute; position: absolute;
top: 0px; top: 2px;
right: 0px; right: 5px;
font-size: 13px; font-size: 10px;
padding: 3px; padding: 4px;
} }
.nav_title { .nav_title {
......
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