kj
/
vendor-app
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Order list and order status API integrated

master
kj1352 5 years ago
parent
4b5cb88ac3
commit
3cd984b99b
9 changed files with 140 additions and 124 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +1
    -3
      src/app/app.component.ts
  2. +1
    -6
      src/app/dashboard/dashboard.component.ts
  3. +1
    -1
      src/app/data/url.ts
  4. +13
    -12
      src/app/login/login.component.ts
  5. +46
    -88
      src/app/orders/orders.component.html
  6. +22
    -11
      src/app/orders/orders.component.scss
  7. +43
    -1
      src/app/orders/orders.component.ts
  8. +12
    -1
      src/app/services/order.service.ts
  9. +1
    -1
      src/app/widgets-holder/widgets-holder.component.ts

+ 1
- 3
src/app/app.component.ts View File

@@ -10,8 +10,6 @@ export class AppComponent {
constructor(
public router: Router
) {
if (localStorage.vendor_token) {
this.router.navigate(['shop-details']);
}
}
}

+ 1
- 6
src/app/dashboard/dashboard.component.ts View File

@@ -1,6 +1,5 @@
import { Component, OnInit } from '@angular/core';
import { IFilterOption } from '../models/filter-option';
import { OrderService } from '../services/order.service';

@Component({
selector: 'app-dashboard',
@@ -10,9 +9,7 @@ import { OrderService } from '../services/order.service';
export class DashboardComponent implements OnInit {
filterOptions: Array<IFilterOption>;

constructor(
private orderService: OrderService
) { }
constructor() { }

ngOnInit() {
this.filterOptions = [{
@@ -22,8 +19,6 @@ export class DashboardComponent implements OnInit {
name: 'Today',
id: 'today'
}];

this.orderService.getOrders();
}

}

+ 1
- 1
src/app/data/url.ts View File

@@ -1 +1 @@
export const URL = 'http://159.65.153.233:8989/mall-aggregator';
export const URL = 'https://mallapi.maiora.co/mall-aggregator';

+ 13
- 12
src/app/login/login.component.ts View File

@@ -9,8 +9,9 @@ import { AuthService } from '../services/auth.service';
})
export class LoginComponent implements OnInit {
credentials = {
username: '',
password: ''
username: 'ramsesrh',
password: '123456789',
login_type: "vendor"
};

errorMessage: string = '';
@@ -24,16 +25,16 @@ export class LoginComponent implements OnInit {
}

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);
});
}

}

+ 46
- 88
src/app/orders/orders.component.html View File

@@ -15,95 +15,53 @@
</div>

<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 &amp; Crispy </div>
<div> KFC 4 + 4 </div>
</td>
<td>
<div> 1 </div>
<div> 4 </div>
</td>
<td>
<div> &#x20B9; 750 </div>
<div> &#x20B9; 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> &#x20B9; 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> &#x20B9; 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> &#x20B9; 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">
&#x20B9; {{ 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>

<ul class="order-list">


+ 22
- 11
src/app/orders/orders.component.scss View File

@@ -78,9 +78,11 @@


.order-table {
width: 90%;
width: 100%;
margin: 30px auto;
text-align: left;
table-layout: fixed;
overflow: auto;

@media screen and (max-width: 1023px) {
display: none;
@@ -91,7 +93,10 @@
font-size: 14px;
font-weight: 500;
padding: 10px 0;
letter-spacing: 0.5px;
letter-spacing: 1px;
line-height: 2;
vertical-align: top;
text-align: center;
}

td {
@@ -103,13 +108,19 @@
letter-spacing: 1px;
line-height: 2;
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 {
&.cancelled {
td {
@@ -135,13 +146,13 @@
}

.action-buttons {
display: flex;
width: 100%;

button {
display: inline-block;
margin-left: 10px;
margin-top: 10px;

&:first-child {
background-color: var(--brand-blue);
margin-right: 10px;
}
}
}


+ 43
- 1
src/app/orders/orders.component.ts View File

@@ -1,5 +1,7 @@
import { Component, OnInit } from '@angular/core';
import { IFilterOption } from '../models/filter-option';
import { OrderService } from '../services/order.service';
import * as moment from 'moment';

@Component({
selector: 'app-orders',
@@ -11,7 +13,13 @@ export class OrdersComponent implements OnInit {
dateOptions: Array<IFilterOption>;
showRejectionPopup: boolean = false;

constructor() { }
orderList: any;

orderStatus: any = [];

constructor(
private orderService: OrderService
) { }

ngOnInit() {
this.statusOptions = [{
@@ -23,6 +31,40 @@ export class OrdersComponent implements OnInit {
name: '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
});
}

}

+ 12
- 1
src/app/services/order.service.ts View File

@@ -18,6 +18,17 @@ export class OrderService {
'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();
}
}

+ 1
- 1
src/app/widgets-holder/widgets-holder.component.ts View File

@@ -6,7 +6,7 @@ import { Component, OnInit } from '@angular/core';
styleUrls: ['./widgets-holder.component.scss']
})
export class WidgetsHolderComponent implements OnInit {
selected_nav: string = 'dashboard';
selected_nav: string = 'orders';

constructor() { }



Write Preview
Loading…
Cancel
Save