@@ -10,8 +10,6 @@ export class AppComponent { | |||||
constructor( | constructor( | ||||
public router: Router | public router: Router | ||||
) { | ) { | ||||
if (localStorage.vendor_token) { | |||||
this.router.navigate(['shop-details']); | |||||
} | |||||
} | } | ||||
} | } |
@@ -1,6 +1,5 @@ | |||||
import { Component, OnInit } from '@angular/core'; | import { Component, OnInit } from '@angular/core'; | ||||
import { IFilterOption } from '../models/filter-option'; | import { IFilterOption } from '../models/filter-option'; | ||||
import { OrderService } from '../services/order.service'; | |||||
@Component({ | @Component({ | ||||
selector: 'app-dashboard', | selector: 'app-dashboard', | ||||
@@ -10,9 +9,7 @@ import { OrderService } from '../services/order.service'; | |||||
export class DashboardComponent implements OnInit { | export class DashboardComponent implements OnInit { | ||||
filterOptions: Array<IFilterOption>; | filterOptions: Array<IFilterOption>; | ||||
constructor( | |||||
private orderService: OrderService | |||||
) { } | |||||
constructor() { } | |||||
ngOnInit() { | ngOnInit() { | ||||
this.filterOptions = [{ | this.filterOptions = [{ | ||||
@@ -22,8 +19,6 @@ export class DashboardComponent implements OnInit { | |||||
name: 'Today', | name: 'Today', | ||||
id: 'today' | id: 'today' | ||||
}]; | }]; | ||||
this.orderService.getOrders(); | |||||
} | } | ||||
} | } |
@@ -1 +1 @@ | |||||
export const URL = 'http://159.65.153.233:8989/mall-aggregator'; | |||||
export const URL = 'https://mallapi.maiora.co/mall-aggregator'; |
@@ -9,8 +9,9 @@ import { AuthService } from '../services/auth.service'; | |||||
}) | }) | ||||
export class LoginComponent implements OnInit { | export class LoginComponent implements OnInit { | ||||
credentials = { | credentials = { | ||||
username: '', | |||||
password: '' | |||||
username: 'ramsesrh', | |||||
password: '123456789', | |||||
login_type: "vendor" | |||||
}; | }; | ||||
errorMessage: string = ''; | errorMessage: string = ''; | ||||
@@ -24,16 +25,16 @@ export class LoginComponent implements OnInit { | |||||
} | } | ||||
requestAuthentication() { | requestAuthentication() { | ||||
// this.authService.authenticateUser(this.credentials).then((data: any) => { | |||||
// localStorage.vendor_token = data.accessToken; | |||||
// this.router.navigate(['shop-details']); | |||||
// }, (err: any) => { | |||||
// this.errorMessage = err.error.message; | |||||
// setTimeout(() => { | |||||
// this.errorMessage = ''; | |||||
// }, 3000); | |||||
// }); | |||||
this.router.navigate(['shop-details']); | |||||
this.authService.authenticateUser(this.credentials).then((data: any) => { | |||||
localStorage.vendor_token = data.access_Token; | |||||
localStorage.vendor_info = JSON.stringify(data); | |||||
this.router.navigate(['shop-details']); | |||||
}, (err: any) => { | |||||
this.errorMessage = 'Please check your credentials'; | |||||
setTimeout(() => { | |||||
this.errorMessage = ''; | |||||
}, 3000); | |||||
}); | |||||
} | } | ||||
} | } |
@@ -15,95 +15,53 @@ | |||||
</div> | </div> | ||||
<table class="order-table"> | <table class="order-table"> | ||||
<tr class="heading-row"> | |||||
<th> Order ID </th> | |||||
<th> Order Time </th> | |||||
<th> Items </th> | |||||
<th> Quantity </th> | |||||
<th> Amount </th> | |||||
<th> Payment Status </th> | |||||
</tr> | |||||
<tbody> | |||||
<tr class="heading-row"> | |||||
<th> Order ID </th> | |||||
<th> Items </th> | |||||
<th> Pickup Time </th> | |||||
<th> Quantity </th> | |||||
<th> Amount </th> | |||||
<th> Action </th> | |||||
</tr> | |||||
<tr> | |||||
<td> 545455 </td> | |||||
<td> 2 Min Ago </td> | |||||
<td> | |||||
<div> 8PC Hot & Crispy </div> | |||||
<div> KFC 4 + 4 </div> | |||||
</td> | |||||
<td> | |||||
<div> 1 </div> | |||||
<div> 4 </div> | |||||
</td> | |||||
<td> | |||||
<div> ₹ 750 </div> | |||||
<div> ₹ 250 </div> | |||||
</td> | |||||
<td> Paid Online </td> | |||||
<td> | |||||
<div class="action-buttons"> | |||||
<button class="round-button"> Confirm </button> | |||||
<button class="round-button" (click)="showRejectionPopup = true"> Reject </button> | |||||
</div> | |||||
</td> | |||||
</tr> | |||||
<tr> | |||||
<td> 545455 </td> | |||||
<td> 10 Min Ago </td> | |||||
<td> | |||||
<div> KFC 4 + 4 </div> | |||||
</td> | |||||
<td> | |||||
<div> 1 </div> | |||||
</td> | |||||
<td> | |||||
<div> ₹ 750 </div> | |||||
</td> | |||||
<td> Paid Online </td> | |||||
<td> | |||||
<div class="status success"> Completed </div> | |||||
</td> | |||||
</tr> | |||||
<tr class="cancelled"> | |||||
<td> 545455 </td> | |||||
<td> 0 Min Ago </td> | |||||
<td> | |||||
<div> KFC 4 + 4 </div> | |||||
</td> | |||||
<td> | |||||
<div> 1 </div> | |||||
</td> | |||||
<td> | |||||
<div> ₹ 750 </div> | |||||
</td> | |||||
<td> Paid Online </td> | |||||
<td> | |||||
<div class="status failed"> Cancelled </div> | |||||
</td> | |||||
</tr> | |||||
<tr> | |||||
<td> 545455 </td> | |||||
<td> 1 Min Ago </td> | |||||
<td> | |||||
<div> KFC Bucket </div> | |||||
</td> | |||||
<td> | |||||
<div> 1 </div> | |||||
</td> | |||||
<td> | |||||
<div> ₹ 250 </div> | |||||
</td> | |||||
<td> COD </td> | |||||
<td> | |||||
<div class="action-buttons"> | |||||
<button class="round-button"> Confirm </button> | |||||
<button class="round-button" (click)="showRejectionPopup = true"> Reject </button> | |||||
</div> | |||||
</td> | |||||
</tr> | |||||
<tr *ngFor="let order of orderList"> | |||||
<td> {{ order.orders_id }} </td> | |||||
<td> | |||||
<div> | |||||
<span *ngFor="let item of order.orderedlist" class="item"> | |||||
{{ item.menu_item_name }} | |||||
</span> | |||||
</div> | |||||
</td> | |||||
<td> | |||||
<div *ngFor="let item of order.orderedlist"> | |||||
{{ getFormattedDate(item.pickup_time, 'DD MMM @ hh:mm a') }} | |||||
</div> | |||||
</td> | |||||
<td> | |||||
<div *ngFor="let item of order.orderedlist"> | |||||
{{ item.quantity }} | |||||
</div> | |||||
</td> | |||||
<td> | |||||
<div *ngFor="let item of order.orderedlist"> | |||||
₹ {{ getFixedDecimalPoints(item.total_price) }} | |||||
</div> | |||||
</td> | |||||
<td> | |||||
<div class="action-buttons" *ngIf="order.orderstatus.orderstatus_id === 6"> | |||||
<button class="round-button"> Confirm </button> | |||||
<button class="round-button" (click)="showRejectionPopup = true"> Reject </button> | |||||
</div> | |||||
<div class="status" [ngClass]="{'success': order.orderstatus.orderstatus_id === 1, | |||||
'failed' : order.orderstatus.orderstatus_id === 2 || order.orderstatus.orderstatus_id === 4 || order.orderstatus.orderstatus_id === 5 }" | |||||
*ngIf="order.orderstatus.orderstatus_id !== 6"> | |||||
{{ getOrderStatus(order.orderstatus.orderstatus_id).orderStatus }} | |||||
</div> | |||||
</td> | |||||
</tr> | |||||
</tbody> | |||||
</table> | </table> | ||||
<ul class="order-list"> | <ul class="order-list"> | ||||
@@ -78,9 +78,11 @@ | |||||
.order-table { | .order-table { | ||||
width: 90%; | |||||
width: 100%; | |||||
margin: 30px auto; | margin: 30px auto; | ||||
text-align: left; | text-align: left; | ||||
table-layout: fixed; | |||||
overflow: auto; | |||||
@media screen and (max-width: 1023px) { | @media screen and (max-width: 1023px) { | ||||
display: none; | display: none; | ||||
@@ -91,7 +93,10 @@ | |||||
font-size: 14px; | font-size: 14px; | ||||
font-weight: 500; | font-weight: 500; | ||||
padding: 10px 0; | padding: 10px 0; | ||||
letter-spacing: 0.5px; | |||||
letter-spacing: 1px; | |||||
line-height: 2; | |||||
vertical-align: top; | |||||
text-align: center; | |||||
} | } | ||||
td { | td { | ||||
@@ -103,13 +108,19 @@ | |||||
letter-spacing: 1px; | letter-spacing: 1px; | ||||
line-height: 2; | line-height: 2; | ||||
vertical-align: top; | vertical-align: top; | ||||
width: calc(100% / 6); | |||||
&:nth-child(4) { | |||||
padding-left: 20px; | |||||
} | |||||
text-align: center; | |||||
} | } | ||||
.item { | |||||
background-color: rgba(#cecece, 0.5); | |||||
border-radius: 5px; | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: flex-start; | |||||
margin-bottom: 10px; | |||||
padding: 0 10px; | |||||
} | |||||
tr { | tr { | ||||
&.cancelled { | &.cancelled { | ||||
td { | td { | ||||
@@ -135,13 +146,13 @@ | |||||
} | } | ||||
.action-buttons { | .action-buttons { | ||||
display: flex; | |||||
width: 100%; | |||||
button { | button { | ||||
display: inline-block; | |||||
margin-left: 10px; | |||||
margin-top: 10px; | |||||
&:first-child { | &:first-child { | ||||
background-color: var(--brand-blue); | background-color: var(--brand-blue); | ||||
margin-right: 10px; | |||||
} | } | ||||
} | } | ||||
} | } | ||||
@@ -1,5 +1,7 @@ | |||||
import { Component, OnInit } from '@angular/core'; | import { Component, OnInit } from '@angular/core'; | ||||
import { IFilterOption } from '../models/filter-option'; | import { IFilterOption } from '../models/filter-option'; | ||||
import { OrderService } from '../services/order.service'; | |||||
import * as moment from 'moment'; | |||||
@Component({ | @Component({ | ||||
selector: 'app-orders', | selector: 'app-orders', | ||||
@@ -11,7 +13,13 @@ export class OrdersComponent implements OnInit { | |||||
dateOptions: Array<IFilterOption>; | dateOptions: Array<IFilterOption>; | ||||
showRejectionPopup: boolean = false; | showRejectionPopup: boolean = false; | ||||
constructor() { } | |||||
orderList: any; | |||||
orderStatus: any = []; | |||||
constructor( | |||||
private orderService: OrderService | |||||
) { } | |||||
ngOnInit() { | ngOnInit() { | ||||
this.statusOptions = [{ | this.statusOptions = [{ | ||||
@@ -23,6 +31,40 @@ export class OrdersComponent implements OnInit { | |||||
name: 'Today', | name: 'Today', | ||||
id: 'today' | id: 'today' | ||||
}]; | }]; | ||||
console.log(JSON.parse(localStorage.vendor_info)) | |||||
this.orderService.getOrders().then((data) => { | |||||
console.log(data); | |||||
this.orderList = data; | |||||
this.orderList = this.orderList.filter((order) => { | |||||
return order.orderstatus; | |||||
}); | |||||
}, () => { | |||||
alert("Error getting the orders"); | |||||
}); | |||||
this.orderService.getallOrderStatus().then((data) => { | |||||
console.log(data); | |||||
this.orderStatus = data; | |||||
}, () => { | |||||
alert("Error getting the order statuses"); | |||||
}) | |||||
} | } | ||||
getFormattedDate(date: any, format: string) { | |||||
return moment(date).format(format); | |||||
} | |||||
getFixedDecimalPoints(price: string | number) { | |||||
return Number(price).toFixed(2); | |||||
} | |||||
getOrderStatus(id: string | number) { | |||||
return this.orderStatus.find((status: any) => { | |||||
return id === status.orderstatus_id | |||||
}); | |||||
} | |||||
} | } |
@@ -18,6 +18,17 @@ export class OrderService { | |||||
'Authorization': 'Bearer ' + localStorage.vendor_token | 'Authorization': 'Bearer ' + localStorage.vendor_token | ||||
}) | }) | ||||
}; | }; | ||||
this.http.get(URL + '/api/maioraservice/orders/getallOrders/', httpOptions).toPromise(); | |||||
return this.http.get(URL + '/api/maioraservice/orders/getallOrders/', httpOptions).toPromise(); | |||||
} | |||||
getallOrderStatus() { | |||||
const httpOptions = { | |||||
headers: new HttpHeaders({ | |||||
'Access-Control-Allow-Origin': '*', | |||||
'Content-Type': 'application/json', | |||||
'Authorization': 'Bearer ' + localStorage.vendor_token | |||||
}) | |||||
}; | |||||
return this.http.get(URL + '/api/maioraservice/orders/getallOrderStatus', httpOptions).toPromise(); | |||||
} | } | ||||
} | } |
@@ -6,7 +6,7 @@ import { Component, OnInit } from '@angular/core'; | |||||
styleUrls: ['./widgets-holder.component.scss'] | styleUrls: ['./widgets-holder.component.scss'] | ||||
}) | }) | ||||
export class WidgetsHolderComponent implements OnInit { | export class WidgetsHolderComponent implements OnInit { | ||||
selected_nav: string = 'dashboard'; | |||||
selected_nav: string = 'orders'; | |||||
constructor() { } | constructor() { } | ||||