Commit 010aa8a9 authored by Shayan Khorsandi's avatar Shayan Khorsandi
Browse files

Dashboard with required functionality for the design jam completed.

parent a7191e00
......@@ -12,7 +12,7 @@
"scripts": {
"ng": "ng",
"conventional-changelog": "conventional-changelog",
"start": "ng serve",
"start": "ng serve --host 0.0.0.0",
"build": "ng build",
"build:prod": "npm run build -- --configuration production --aot",
"test": "ng test",
......
<div class="header-container">
<div class="logo-container">
<a (click)="toggleSidebar()" href="#" class="sidebar-toggle">
<nb-icon icon="menu-2-outline"></nb-icon>
</a>
<!-- <a (click)="toggleSidebar()" href="#" class="sidebar-toggle">-->
<!-- <nb-icon icon="menu-2-outline"></nb-icon>-->
<!-- </a>-->
<a class="logo" href="#" (click)="navigateHome()">Team See</a>
</div>
<nb-select [selected]="currentTheme" (selectedChange)="changeTheme($event)" status="primary">
......@@ -18,7 +18,7 @@
badgePosition="top left" badgeStatus="info" badgeDot>
</nb-action>
<nb-action class="control-item" icon="shopping-cart-outline" title="Shop"
badgePosition="top right" badgeStatus="danger" badgeDot></nb-action>
badgePosition="top right" badgeStatus="danger" badgeDot link="/pages/shop"></nb-action>
<nb-action class="user-action" *nbIsGranted="['view', 'user']" >
<nb-user [nbContextMenu]="userMenu"
[onlyPicture]="userPictureOnly"
......
......@@ -9,9 +9,9 @@ import { Component } from '@angular/core';
<ngx-header></ngx-header>
</nb-layout-header>
<nb-sidebar class="menu-sidebar" tag="menu-sidebar" responsive>
<ng-content select="nb-menu"></ng-content>
</nb-sidebar>
<!-- <nb-sidebar class="menu-sidebar" tag="menu-sidebar" responsive>-->
<!-- <ng-content select="nb-menu"></ng-content>-->
<!-- </nb-sidebar>-->
<nb-layout-column>
<ng-content select="router-outlet"></ng-content>
......
......@@ -92,6 +92,16 @@
<nb-alert outline="primary" *ngIf="!tripInProgress">
There is no active trip right now!!
</nb-alert>
<div class="row" *ngIf="tripInProgress">
<div class="col-md-12">
<nb-alert outline="primary" >
{{currentTrip}}
</nb-alert>
</div>
<div class="col-md-8 offset-2">
<button nbButton fullWidth outline status="primary" (click)="endTrip()">End Trip</button>
</div>
</div>
</nb-card-body>
</nb-card>
</div>
......@@ -159,17 +169,29 @@
<ngx-search-map #map style="margin-top: 1rem" [usePreDefined]="selectedDestination==='else'? true: false"></ngx-search-map>
</div>
</div>
<div class="row">
<div class="row" *ngIf="firstSelect">
<div class="col-md-12">
<nb-card accent="warning">
<nb-card-header>By Completing this Trip</nb-card-header>
<nb-card-header>By Completing this Trip you will</nb-card-header>
<nb-card-body>
<div class="row">
<div class="col-md-2 offset-md-2">
<nb-card>
<div class="col-md-4 offset-md-2">
<nb-card accent="success" size="tiny">
<nb-card-header>
Walk
</nb-card-header>
<nb-card-body>
<div fullWidth class="h3 value" style="text-align: center">1.25Km</div>
</nb-card-body>
</nb-card>
</div>
<div class="col-md-4 offset-1">
<nb-card accent="success" size="tiny">
<nb-card-header>Approximately Save</nb-card-header>
<nb-card-body>
<div fullWidth class="h4 value" style="text-align: center">1.5KG Carbon
<span><nb-icon nbTooltip="Carbon is bad :(" icon="alert-circle-outline" status="info"></nb-icon></span></div>
</nb-card-body>
</nb-card>
</div>
</div>
......@@ -177,12 +199,12 @@
</nb-card>
</div>
</div>
<div class="row">
<div class="row" *ngIf="firstSelect">
<div class="col-md-3 offset-md-3">
<button nbButton fullWidth outline status="warning" nbStepperNext>Cancel Trip</button>
<button nbButton fullWidth outline status="warning" >Cancel Trip</button>
</div>
<div class="col-md-3">
<button nbButton fullWidth outline status="primary" nbStepperNext>Start Trip</button>
<button nbButton fullWidth outline status="primary" (click)="confirmTrip()">Start Trip</button>
</div>
</div>
</nb-step>
......
......@@ -19,6 +19,8 @@ export class HomeComponent implements OnInit {
selectedMethod = false;
car: String;
tripInProgress = false;
showConfirm = false;
currentTrip = null;
friends: {name: string, level: string, badge: string, amount: string}[] = [
{name: 'Shayan', level: '12', badge: 'LOOOL', amount: '100 KG'},
......@@ -76,4 +78,15 @@ export class HomeComponent implements OnInit {
this.selectedDestination = null;
}
confirmTrip() {
this.currentTrip = 'On the way to the ' + this.selectedDestination.toString().toUpperCase() + '!';
this.tripInProgress = true;
this.resetTrip();
}
endTrip() {
this.tripInProgress = false;
this.currentTrip = null;
}
}
......@@ -20,6 +20,11 @@ const routes: Routes = [{
loadChildren: () => import('./profile/profile.module')
.then(m => m.ProfileModule),
},
{
path: 'shop',
loadChildren: () => import('./shop/shop.module')
.then(m => m.ShopModule),
},
{
path: 'dashboard',
component: ECommerceComponent,
......
......@@ -9,6 +9,7 @@ import { PagesRoutingModule } from './pages-routing.module';
import { MiscellaneousModule } from './miscellaneous/miscellaneous.module';
import { HomeModule } from './home/home.module';
import { ProfileModule } from './profile/profile.module';
import { ShopModule } from './shop/shop.module';
@NgModule({
imports: [
......@@ -20,6 +21,7 @@ import { ProfileModule } from './profile/profile.module';
MiscellaneousModule,
HomeModule,
ProfileModule,
ShopModule,
],
declarations: [
PagesComponent,
......
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import {ShopComponent} from './shop.component';
const routes: Routes = [
{
path: '',
component: ShopComponent,
}
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule]
})
export class ShopRoutingModule { }
<div class="row">
<div class="col-md-12">
<nb-card>
<nb-card-header style="text-align: center">Welcome to ECOGO Shop!</nb-card-header>
</nb-card>
</div>
</div>
<div class="row">
<div class="col-md-12">
</div>
</div>
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'ngx-shop',
templateUrl: './shop.component.html',
styleUrls: ['./shop.component.scss']
})
export class ShopComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
}
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ShopRoutingModule } from './shop-routing.module';
import { ShopComponent } from './shop.component';
import {NbCardModule} from "@nebular/theme";
@NgModule({
declarations: [
ShopComponent
],
imports: [
CommonModule,
ShopRoutingModule,
NbCardModule
]
})
export class ShopModule { }
Supports Markdown
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