From df5d7c75d641e6013ff40d44d9d330bcc01f7ed5 Mon Sep 17 00:00:00 2001 From: kj1352 Date: Wed, 14 Aug 2019 17:06:53 +0530 Subject: [PATCH] Partial commit for Models, Mocks and services refactoring --- package-lock.json | 3 +- package.json | 3 +- src/app/app-routing.module.ts | 1 + src/app/app.component.html | 4 +- src/app/cart/cart.module.ts | 26 +++ src/app/cart/cart.page.html | 13 ++ src/app/cart/cart.page.scss | 49 ++++ src/app/cart/cart.page.spec.ts | 27 +++ src/app/cart/cart.page.ts | 22 ++ src/app/mall-details/mall-details.page.html | 12 +- src/app/mocks/malls.ts | 76 ++++++ src/app/mocks/menu-items.ts | 71 ++++++ src/app/mocks/outlets.ts | 42 ++++ src/app/models/cart-item.ts | 44 ++++ src/app/models/menu-item.ts | 58 +++++ src/app/models/offer.ts | 9 +- src/app/models/outlet.ts | 74 ++++++ src/app/outlet-details/outlet-details.page.ts | 10 +- src/app/services/mall.service.ts | 220 ++---------------- src/app/shared/common-types.ts | 4 + src/assets/custom/cart.svg | 1 + src/global.scss | 4 +- 22 files changed, 551 insertions(+), 222 deletions(-) create mode 100644 src/app/cart/cart.module.ts create mode 100644 src/app/cart/cart.page.html create mode 100644 src/app/cart/cart.page.scss create mode 100644 src/app/cart/cart.page.spec.ts create mode 100644 src/app/cart/cart.page.ts create mode 100644 src/app/mocks/malls.ts create mode 100644 src/app/mocks/menu-items.ts create mode 100644 src/app/mocks/outlets.ts create mode 100644 src/app/models/cart-item.ts create mode 100644 src/app/models/menu-item.ts create mode 100644 src/app/models/outlet.ts create mode 100644 src/app/shared/common-types.ts create mode 100644 src/assets/custom/cart.svg diff --git a/package-lock.json b/package-lock.json index 7010c3e..6f2698d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10618,8 +10618,7 @@ "uuid": { "version": "3.3.2", "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.3.2.tgz", - "integrity": "sha512-yXJmeNaw3DnnKAOKJE51sL/ZaYfWJRl1pK9dr19YFCu0ObS231AB1/LbqTKRAQ5kw8A90rA6fr4riOUpTZvQZA==", - "dev": true + "integrity": "sha512-yXJmeNaw3DnnKAOKJE51sL/ZaYfWJRl1pK9dr19YFCu0ObS231AB1/LbqTKRAQ5kw8A90rA6fr4riOUpTZvQZA==" }, "validate-npm-package-license": { "version": "3.0.4", diff --git a/package.json b/package.json index 214e046..03adf31 100644 --- a/package.json +++ b/package.json @@ -31,6 +31,7 @@ "core-js": "^2.5.4", "rxjs": "~6.5.1", "tslib": "^1.9.0", + "uuid": "^3.3.2", "zone.js": "~0.9.1" }, "devDependencies": { @@ -81,4 +82,4 @@ "android" ] } -} \ No newline at end of file +} diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 1e88503..96988e0 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -8,6 +8,7 @@ const routes: Routes = [ { path: 'malls', loadChildren: './malls/malls.module#MallsPageModule' }, { path: 'mall-details', loadChildren: './mall-details/mall-details.module#MallDetailsPageModule' }, { path: 'outlet-details', loadChildren: './outlet-details/outlet-details.module#OutletDetailsPageModule' }, + { path: 'cart', loadChildren: './cart/cart.module#CartPageModule' }, ]; @NgModule({ diff --git a/src/app/app.component.html b/src/app/app.component.html index 59466e6..21344f3 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -19,8 +19,8 @@ - +

Cart

+ + + +
+
ITEMS
+
+ + diff --git a/src/app/cart/cart.page.scss b/src/app/cart/cart.page.scss new file mode 100644 index 0000000..40b6ad6 --- /dev/null +++ b/src/app/cart/cart.page.scss @@ -0,0 +1,49 @@ +.header-bar { + background-image: url('../../assets/custom/background-5.svg'); + background-size: cover; + background-repeat: no-repeat; + background-position: left top; + display: flex; + align-items: center; + justify-content: space-between; + padding: 15px; + height: 75px; + z-index: 2; + top: 0; + left: 0; + width: 100%; + position: sticky; + box-shadow: 0px 3px 5px var(--brand-grey); + margin-bottom: 20px; + + .heading-holder { + display: flex; + align-items: center; + } + + button, a { + background-color: white; + color: var(--brand-blue); + font-size: 18px; + padding: 5px; + border-radius: 50%; + height: 30px; + width: 30px; + display: flex; + justify-content: center; + align-items: center; + + &.active { + color: white; + background-color: var(--brand-blue); + } + } + + h3 { + font-size: 16px; + color: white; + letter-spacing: 0.5px; + margin-left: 10px; + font-weight: 600; + } +} diff --git a/src/app/cart/cart.page.spec.ts b/src/app/cart/cart.page.spec.ts new file mode 100644 index 0000000..a3f08a6 --- /dev/null +++ b/src/app/cart/cart.page.spec.ts @@ -0,0 +1,27 @@ +import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CartPage } from './cart.page'; + +describe('CartPage', () => { + let component: CartPage; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ CartPage ], + schemas: [CUSTOM_ELEMENTS_SCHEMA], + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(CartPage); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/cart/cart.page.ts b/src/app/cart/cart.page.ts new file mode 100644 index 0000000..9c4387e --- /dev/null +++ b/src/app/cart/cart.page.ts @@ -0,0 +1,22 @@ +import { Component, OnInit } from '@angular/core'; +import { Location } from '@angular/common'; + +@Component({ + selector: 'app-cart', + templateUrl: './cart.page.html', + styleUrls: ['./cart.page.scss'], +}) +export class CartPage implements OnInit { + + constructor( + private location: Location + ) { } + + ngOnInit() { + } + + back() { + this.location.back(); + } + +} diff --git a/src/app/mall-details/mall-details.page.html b/src/app/mall-details/mall-details.page.html index cdb1421..ece069e 100644 --- a/src/app/mall-details/mall-details.page.html +++ b/src/app/mall-details/mall-details.page.html @@ -62,7 +62,7 @@ - @@ -81,8 +81,8 @@

- Food - Shopping + Food + Shopping Offers: {{ outlet.offers.length }}
@@ -91,7 +91,7 @@ - +

@@ -109,8 +109,8 @@

- Food - Shopping + Food + Shopping Offers: {{ outlet.offers.length }}
diff --git a/src/app/mocks/malls.ts b/src/app/mocks/malls.ts new file mode 100644 index 0000000..5da74a5 --- /dev/null +++ b/src/app/mocks/malls.ts @@ -0,0 +1,76 @@ +import Offer from '../models/offer'; +import { OUTLETS } from './outlets'; + +export const MALLS = [{ + id: '0001', + name: 'Gopalan Arcade Mall', + address: 'Mysore Road, Bangalore', + is_bookmarked: true, + is_archived: false, + image_url: 'https://www.gopalanmall.com/images/mall-arcade-01.jpg', + description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.', + outlets: OUTLETS, + offer_collection: [{ + name: 'Food', + offers: [new Offer({ + name: 'McDonalds Offer', + description: 'Get 25% offer on you first meal', + coupon_code: 'MCD25F', + })] + }, { + name: 'Shopping', + offers: [] + }], + rating: 4.1, + distance: 2, + location: { + latitude: 12.903903292, + longitude: 34.940349039 + } +}, +{ + id: '0002', + name: 'Gopalan Cinemas', + address: 'Kenchana Halli', + is_bookmarked: false, + is_archived: false, + image_url: 'https://www.gopalanmall.com/images/mall-arcade-01.jpg', + description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.', + outlets: [], + offer_collection: [{ + name: 'Food', + offers: [] + }, { + name: 'Shopping', + offers: [] + }], + rating: 4.5, + distance: 2, + location: { + latitude: 12.903903292, + longitude: 34.940349039 + } +}, +{ + id: '0003', + name: 'Gopalan Mall', + address: 'Mysore Road, Bangalore', + is_bookmarked: false, + is_archived: false, + image_url: 'https://www.gopalanmall.com/images/mall-arcade-01.jpg', + description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.', + outlets: [], + offer_collection: [{ + name: 'Food', + offers: [] + }, { + name: 'Shopping', + offers: [] + }], + rating: 4.3, + distance: 2, + location: { + latitude: 12.903903292, + longitude: 34.940349039 + } +}]; diff --git a/src/app/mocks/menu-items.ts b/src/app/mocks/menu-items.ts new file mode 100644 index 0000000..3c8e531 --- /dev/null +++ b/src/app/mocks/menu-items.ts @@ -0,0 +1,71 @@ +import MenuItem from '../models/menu-item'; + +export const MENU_ITEMS_1 = [new MenuItem({ + id: '0001', + name: 'McSpicy Paneer', + image_url: 'https://www.mcdonalds.com.my/images/nasi_lemak/burger/burger.jpg?id=bb965dd67df3afa52033', + description: 'the patties are very unique and is prepared mainly with mashed potatoes and green peas. the flagship mcaloo tikki recipe from McDonalds involves a special sauce which is basically a combination of tomato sauce and mayonnaise. aloo tikki burger recipe.', + is_vegeterian: true, + wait_duration: 10, + price: 90, + discount: 10, + rating: 4, + tags: ['burger', 'breakfast'] +}), new MenuItem({ + id: '0002', + name: 'McAloo Tikki', + image_url: 'https://www.mcdonalds.com.my/images/nasi_lemak/burger/burger.jpg?id=bb965dd67df3afa52033', + description: 'the patties are very unique and is prepared mainly with mashed potatoes and green peas. the flagship mcaloo tikki recipe from McDonalds involves a special sauce which is basically a combination of tomato sauce and mayonnaise. aloo tikki burger recipe.', + is_vegeterian: true, + wait_duration: 13, + price: 120, + discount: 50, + rating: 4.0, + tags: ['spicy', 'dinner'] +}), new MenuItem({ + id: '0003', + name: 'McPork', + image_url: 'https://www.mcdonalds.com.my/images/nasi_lemak/burger/burger.jpg?id=bb965dd67df3afa52033', + description: 'the patties are very unique and is prepared mainly with mashed potatoes and green peas. the flagship mcaloo tikki recipe from McDonalds involves a special sauce which is basically a combination of tomato sauce and mayonnaise. aloo tikki burger recipe.', + is_vegeterian: false, + wait_duration: 20, + price: 300, + discount: 5, + rating: 4.9, + tags: ['spicy', 'dinner', 'pork'] +})]; + +export const MENU_ITEMS_2 = [new MenuItem({ + id: '0001', + name: 'Margherita Pizza', + image_url: 'https://www.cafecoffeeday.com/thelounge/images/ccd-lounge-pizzas-side-1.jpg', + description: 'Cheese pizza topped with tomato sauce, garlic sauce and fresh basil.', + is_vegeterian: true, + wait_duration: 25, + price: 150, + discount: 0, + rating: 3.5, + tags: ['pizza', 'hot'] +}), new MenuItem({ + id: '0002', + name: 'Espresso Shot', + image_url: 'https://www.cafecoffeeday.com/thelounge/images/ccd-lounge-classic-hot-bottom.jpg', + description: 'Coffee at its simplest best. Without milk, served with cold water on the side. We call it a simple big-shot.', + is_vegeterian: true, + wait_duration: 5, + price: 80, + discount: 0, + rating: 4.5, + tags: ['hot', 'beverage'] +}), new MenuItem({ + id: '0003', + name: 'The Coffee Gola', + image_url: 'https://www.cafecoffeeday.com/thelounge/images/ccd-lounge-Coffetini-Easel-side.jpg', + description: 'The perfect blend of coffee, almonds and a rich vanilla gola. Sure to give you an exotic kulfi experience.', + is_vegeterian: true, + wait_duration: 15, + price: 200, + discount: 10, + rating: 4.9, + tags: ['cold', 'beverage'] +})]; diff --git a/src/app/mocks/outlets.ts b/src/app/mocks/outlets.ts new file mode 100644 index 0000000..1e4e546 --- /dev/null +++ b/src/app/mocks/outlets.ts @@ -0,0 +1,42 @@ +import Outlet, { OutletType } from '../models/outlet'; +import Offer from '../models/offer'; +import { MENU_ITEMS_1, MENU_ITEMS_2 } from './menu-items'; + +export const OUTLETS = [new Outlet({ + id: '0001', + image_url: 'https://images.markets.businessinsider.com/image/5a74835585cdd489228b47be-900/shutterstock643079686.jpg', + name: 'McDonalds', + description: 'Veg / Non-Veg Food Restaurant', + tags: ['dinner', 'spicy', 'breakfast', 'pork'], + menu_items: MENU_ITEMS_1, + offers: [new Offer({ + name: 'McDonalds Offer', + description: 'Get 25% offer on you first meal', + coupon_code: 'MCD25F', + })], + outlet_type: OutletType.FOOD, + is_bookmarked: false, + rating: 3.5, +}), new Outlet({ + id: '0002', + image_url: 'https://pbs.twimg.com/profile_images/354890582/symbol.jpg', + name: 'Shopper\'s stop', + description: 'Clothing store', + offers: [], + tags: [], + menu_items: [], + outlet_type: OutletType.SHOP, + is_bookmarked: true, + rating: 4.8, +}), new Outlet({ + id: '0003', + image_url: 'https://www.mbarendezvous.com/images/top-stories-img/bannerimage_1463407053.jpg', + name: 'Cafe Coffee Day', + description: 'Veg / Non-Veg Cafe', + tags: ['hot', 'cold', 'pizza', 'beverage'], + menu_items: MENU_ITEMS_2, + offers: [], + outlet_type: OutletType.FOOD, + is_bookmarked: false, + rating: 4, +})]; diff --git a/src/app/models/cart-item.ts b/src/app/models/cart-item.ts new file mode 100644 index 0000000..c1abc57 --- /dev/null +++ b/src/app/models/cart-item.ts @@ -0,0 +1,44 @@ +class CartItem { + menu_item_id: string; + quantity: number; + pickup_time: Date; + outlet_id: string; + mall_id: string; + is_parcel: boolean; + total_price: number; + + constructor(initializationObject: any) { + if (!initializationObject.hasOwnProperty('menu_item_id')) { + throw new Error('Missing Menu item ID'); + } + + if (!initializationObject.hasOwnProperty('quantity')) { + throw new Error('Missing quantity'); + } + + if (!initializationObject.hasOwnProperty('pickup_time')) { + throw new Error('Missing Pickup time'); + } + + if (!initializationObject.hasOwnProperty('outlet_id')) { + throw new Error('Missing Outlet ID'); + } + + if (!initializationObject.hasOwnProperty('mall_id')) { + throw new Error('Missing Mall ID'); + } + + if (!initializationObject.hasOwnProperty('is_parcel')) { + throw new Error('Missing Parcel Flag'); + } + this.menu_item_id = initializationObject.menu_item_id; + this.quantity = initializationObject.quantity; + this.pickup_time = initializationObject.pickup_time; + this.outlet_id = initializationObject.outlet_id; + this.mall_id = initializationObject.mall_id; + this.is_parcel = initializationObject.is_parcel; + this.total_price = initializationObject.total_price; + } +} + +export default CartItem; diff --git a/src/app/models/menu-item.ts b/src/app/models/menu-item.ts new file mode 100644 index 0000000..c8dc338 --- /dev/null +++ b/src/app/models/menu-item.ts @@ -0,0 +1,58 @@ +export class MenuItem { + id: string; + name: string; + image_url?: string; + description: string; + is_vegeterian: boolean; + wait_duration: number; + price: number; + discount: number; + rating: number; + tags: Array; + + constructor(initializationObject: any) { + if (!initializationObject.hasOwnProperty('id')) { + throw new Error('Missing id') + } + if (!initializationObject.hasOwnProperty('name')) { + throw new Error('Missing name') + } + if (!initializationObject.hasOwnProperty('description')) { + throw new Error('Missing description') + } + if (!initializationObject.hasOwnProperty('is_vegeterian')) { + throw new Error('Missing is_vegeterian') + } + if (!initializationObject.hasOwnProperty('wait_duration')) { + throw new Error('Missing wait_duration') + } + if (!initializationObject.hasOwnProperty('price')) { + throw new Error('Missing price') + } + if (!initializationObject.hasOwnProperty('discount')) { + throw new Error('Missing discount') + } + if (!initializationObject.hasOwnProperty('rating')) { + throw new Error('Missing rating') + } + if (!initializationObject.hasOwnProperty('tags')) { + throw new Error('Missing tags') + } + + this.id = initializationObject.id; + this.name = initializationObject.name; + this.description = initializationObject.description; + this.is_vegeterian = initializationObject.is_vegeterian; + this.wait_duration = initializationObject.wait_duration; + this.price = initializationObject.price; + this.discount = initializationObject.discount; + this.rating = initializationObject.rating; + this.tags = initializationObject.tags; + + if (initializationObject.hasOwnProperty('image_url')) { + this.image_url = initializationObject.image_url; + } + } +}; + +export default MenuItem; diff --git a/src/app/models/offer.ts b/src/app/models/offer.ts index bfb46a9..627fff0 100644 --- a/src/app/models/offer.ts +++ b/src/app/models/offer.ts @@ -1,7 +1,8 @@ -export class Offer { +class Offer { name: string; description: string; coupon_code: string; + image_url?: string; constructor(initializationObject: any) { @@ -21,9 +22,15 @@ export class Offer { this.name = initializationObject.name; this.description = initializationObject.description; this.coupon_code = initializationObject.coupon_code; + + if (initializationObject.hasOwnProperty('image_url')) { + this.image_url = initializationObject.image_url; + } } } +export default Offer; + export type OfferCollection = { name: string, offers: Array, diff --git a/src/app/models/outlet.ts b/src/app/models/outlet.ts new file mode 100644 index 0000000..43675f4 --- /dev/null +++ b/src/app/models/outlet.ts @@ -0,0 +1,74 @@ +import Offer from './offer'; +import MenuItem from './menu-item'; + +export enum OutletType { + FOOD = 'FOOD', + SHOP = 'SHOP', +}; + +class Outlet { + id: string; + image_url?: string; + name: string; + description: string; + offers: Array; + tags: Array; + menu_items: Array; + outlet_type: OutletType; + is_bookmarked: boolean; + rating: number; + + constructor(initializationObject: any) { + if (!initializationObject.hasOwnProperty('id')) { + throw new Error('Missing ID'); + } + + if (!initializationObject.hasOwnProperty('name')) { + throw new Error('Missing name'); + } + + if (!initializationObject.hasOwnProperty('description')) { + throw new Error('Missing description'); + } + + if (!initializationObject.hasOwnProperty('offers')) { + throw new Error('Missing Offers'); + } + + if (!initializationObject.hasOwnProperty('tags')) { + throw new Error('Missing tags'); + } + + if (!initializationObject.hasOwnProperty('menu_items')) { + throw new Error('Missing Menu Items'); + } + + if (!initializationObject.hasOwnProperty('outlet_type')) { + throw new Error('Missing Outlet type'); + } + + if (!initializationObject.hasOwnProperty('is_bookmarked')) { + throw new Error('Missing Bookmarked flag'); + } + + if (!initializationObject.hasOwnProperty('rating')) { + throw new Error('Missing Rating'); + } + + this.id = initializationObject.id; + this.name = initializationObject.name; + this.description = initializationObject.description; + this.offers = initializationObject.offers; + this.tags = initializationObject.tags; + this.menu_items = initializationObject.menu_items; + this.outlet_type = initializationObject.outlet_type; + this.is_bookmarked = initializationObject.is_bookmarked; + this.rating = initializationObject.rating; + + if (initializationObject.hasOwnProperty('image_url')) { + this.image_url = initializationObject.image_url; + } + } +} + +export default Outlet; diff --git a/src/app/outlet-details/outlet-details.page.ts b/src/app/outlet-details/outlet-details.page.ts index e8e80c6..85ce422 100644 --- a/src/app/outlet-details/outlet-details.page.ts +++ b/src/app/outlet-details/outlet-details.page.ts @@ -1,7 +1,10 @@ import { Component, OnInit } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { Location } from '@angular/common'; -import { Mall, Outlet, MenuItem, MallService } from '../services/mall.service'; +import { Mall, MallService } from '../services/mall.service'; +import CartItem from '../models/cart-item'; +import Outlet from '../models/outlet'; +import MenuItem from '../models/menu-item'; @Component({ selector: 'app-outlet-details', @@ -18,6 +21,7 @@ export class OutletDetailsPage implements OnInit { selected_description: string = null; show_sort_popup: boolean = false; selected_sort: string = null; + cart: Array = []; constructor( private route: ActivatedRoute, @@ -34,6 +38,10 @@ export class OutletDetailsPage implements OnInit { this.outlet_details = this.mall_details.outlets.find((outlet) => outlet.id === outlet_id); this.temp_outlet_details = JSON.parse(JSON.stringify(this.outlet_details)); }); + + this.mallService.getCartItems().then((data: Array) => { + this.cart = data; + }); } back() { diff --git a/src/app/services/mall.service.ts b/src/app/services/mall.service.ts index 757a3b7..300f435 100644 --- a/src/app/services/mall.service.ts +++ b/src/app/services/mall.service.ts @@ -1,37 +1,9 @@ import { Injectable } from '@angular/core'; -import { Offer, OfferCollection } from '../models/offer'; - -type CoOrdinates = { - latitude: number, - longitude: number, -}; - - -export type MenuItem = { - id: string, - name: string, - image_url?: string, - description: string, - is_vegeterian: boolean, - wait_duration: number, - price: number, - discount: number, - rating: number, - tags: Array -}; - -export type Outlet = { - id: string, - image_url?: string, - name: string, - description: string, - offers: Array, - tags: Array, - menu_items: Array, - is_food_outlet: boolean, - is_bookmarked: boolean, - rating: number, -}; +import { OfferCollection } from '../models/offer'; +import { CoOrdinates } from '../shared/common-types'; +import Outlet from '../models/outlet'; +import { MALLS } from '../mocks/malls'; +import CartItem from '../models/cart-item'; export type Mall = { id: string, @@ -45,194 +17,28 @@ export type Mall = { rating: number, distance: number, location: CoOrdinates, + address: string }; @Injectable({ providedIn: 'root' }) export class MallService { - private malls: Array; + malls: Array; + cart: Array = []; constructor() { - this.malls = [{ - id: '00001', - name: 'Gopalan Mall', - is_bookmarked: true, - is_archived: false, - image_url: 'https://www.gopalanmall.com/images/mall-arcade-01.jpg', - description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.', - outlets: [{ - id: '0001', - image_url: 'https://images.markets.businessinsider.com/image/5a74835585cdd489228b47be-900/shutterstock643079686.jpg', - name: 'McDonalds', - description: 'Veg / Non-Veg Food Restaurant', - tags: ['dinner', 'spicy', 'breakfast', 'pork'], - menu_items: [{ - id: '0001', - name: 'McSpicy Paneer', - image_url: 'https://www.mcdonalds.com.my/images/nasi_lemak/burger/burger.jpg?id=bb965dd67df3afa52033', - description: 'the patties are very unique and is prepared mainly with mashed potatoes and green peas. the flagship mcaloo tikki recipe from McDonalds involves a special sauce which is basically a combination of tomato sauce and mayonnaise. aloo tikki burger recipe.', - is_vegeterian: true, - wait_duration: 10, - price: 90, - discount: 10, - rating: 4, - tags: ['burger', 'breakfast'] - }, { - id: '0002', - name: 'McAloo Tikki', - image_url: 'https://www.mcdonalds.com.my/images/nasi_lemak/burger/burger.jpg?id=bb965dd67df3afa52033', - description: 'the patties are very unique and is prepared mainly with mashed potatoes and green peas. the flagship mcaloo tikki recipe from McDonalds involves a special sauce which is basically a combination of tomato sauce and mayonnaise. aloo tikki burger recipe.', - is_vegeterian: true, - wait_duration: 13, - price: 120, - discount: 50, - rating: 4.0, - tags: ['spicy', 'dinner'] - }, { - id: '0003', - name: 'McPork', - image_url: 'https://www.mcdonalds.com.my/images/nasi_lemak/burger/burger.jpg?id=bb965dd67df3afa52033', - description: 'the patties are very unique and is prepared mainly with mashed potatoes and green peas. the flagship mcaloo tikki recipe from McDonalds involves a special sauce which is basically a combination of tomato sauce and mayonnaise. aloo tikki burger recipe.', - is_vegeterian: false, - wait_duration: 20, - price: 300, - discount: 5, - rating: 4.9, - tags: ['spicy', 'dinner', 'pork'] - }], - offers: [{ - name: 'McDonalds Offer', - description: 'Get 25% offer on you first meal', - coupon_code: 'MCD25F', - }], - is_food_outlet: true, - is_bookmarked: false, - rating: 3.5, - }, { - id: '0002', - image_url: 'https://pbs.twimg.com/profile_images/354890582/symbol.jpg', - name: 'Shopper\'s stop', - description: 'Clothing store', - offers: [], - tags: [], - menu_items: [], - is_food_outlet: false, - is_bookmarked: true, - rating: 4.8, - }, { - id: '0003', - image_url: 'https://www.mbarendezvous.com/images/top-stories-img/bannerimage_1463407053.jpg', - name: 'Cafe Coffee Day', - description: 'Veg / Non-Veg Cafe', - tags: ['hot', 'cold', 'pizza', 'beverage'], - menu_items: [{ - id: '0001', - name: 'Margherita Pizza', - image_url: 'https://www.cafecoffeeday.com/thelounge/images/ccd-lounge-pizzas-side-1.jpg', - description: 'Cheese pizza topped with tomato sauce, garlic sauce and fresh basil.', - is_vegeterian: true, - wait_duration: 25, - price: 150, - discount: 0, - rating: 3.5, - tags: ['pizza', 'hot'] - }, { - id: '0002', - name: 'Espresso Shot', - image_url: 'https://www.cafecoffeeday.com/thelounge/images/ccd-lounge-classic-hot-bottom.jpg', - description: 'Coffee at its simplest best. Without milk, served with cold water on the side. We call it a simple big-shot.', - is_vegeterian: true, - wait_duration: 5, - price: 80, - discount: 0, - rating: 4.5, - tags: ['hot', 'beverage'] - }, { - id: '0003', - name: 'The Coffee Gola', - image_url: 'https://www.cafecoffeeday.com/thelounge/images/ccd-lounge-Coffetini-Easel-side.jpg', - description: 'The perfect blend of coffee, almonds and a rich vanilla gola. Sure to give you an exotic kulfi experience.', - is_vegeterian: true, - wait_duration: 15, - price: 200, - discount: 10, - rating: 4.9, - tags: ['cold', 'beverage'] - }], - offers: [], - is_food_outlet: true, - is_bookmarked: false, - rating: 4, - }], - offer_collection: [{ - name: 'Food', - offers: [{ - name: 'McDonalds Offer', - description: 'Get 25% offer on you first meal', - coupon_code: 'MCD25F', - }] - }, { - name: 'Shopping', - offers: [] - }], - rating: 4.1, - distance: 2, - location: { - latitude: 12.903903292, - longitude: 34.940349039 - } - }, - { - id: '00002', - name: 'Gopalan Mall 2', - is_bookmarked: false, - is_archived: false, - image_url: 'https://www.gopalanmall.com/images/mall-arcade-01.jpg', - description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.', - outlets: [], - offer_collection: [{ - name: 'Food', - offers: [] - }, { - name: 'Shopping', - offers: [] - }], - rating: 4.5, - distance: 2, - location: { - latitude: 12.903903292, - longitude: 34.940349039 - } - }, - { - id: '00003', - name: 'Gopalan Mall 3', - is_bookmarked: false, - is_archived: false, - image_url: 'https://www.gopalanmall.com/images/mall-arcade-01.jpg', - description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.', - outlets: [], - offer_collection: [{ - name: 'Food', - offers: [] - }, { - name: 'Shopping', - offers: [] - }], - rating: 4.3, - distance: 2, - location: { - latitude: 12.903903292, - longitude: 34.940349039 - } - }]; + this.malls = MALLS; } public async getAllMalls() { return this.malls; } + public async getCartItems() { + return this.cart; + } + public async getMallByID(id: string) { return this.malls.find((mall) => mall.id === id); } diff --git a/src/app/shared/common-types.ts b/src/app/shared/common-types.ts new file mode 100644 index 0000000..19f9e85 --- /dev/null +++ b/src/app/shared/common-types.ts @@ -0,0 +1,4 @@ +export type CoOrdinates = { + latitude: number, + longitude: number, +}; diff --git a/src/assets/custom/cart.svg b/src/assets/custom/cart.svg new file mode 100644 index 0000000..d7c9799 --- /dev/null +++ b/src/assets/custom/cart.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/global.scss b/src/global.scss index 301229f..7860631 100644 --- a/src/global.scss +++ b/src/global.scss @@ -85,7 +85,7 @@ header, h1, h2, h3, h4, h5 { border-radius: 50%; color: var(--brand-blue); text-align: center; - z-index: 2; + z-index: 5; bottom: -60px; padding-top: 10px; transition: transform 0.3s; @@ -109,7 +109,7 @@ header, h1, h2, h3, h4, h5 { position: fixed; left: calc((100% - 150%) / 2); bottom: -150px; - z-index: 1; + z-index: 4; height: 300px; width: 150%; padding: 20px 30%;