File

src/app/user/components/orders/order-list-item/order-list-item.component.ts

Implements

OnInit

Metadata

selector app-order-list-item
styleUrls order-list-item.component.scss
templateUrl ./order-list-item.component.html

Inputs

order

Type: Order

Constructor

constructor()

Methods

ngOnInit
ngOnInit()
Returns: void
getProductImageUrl
getProductImageUrl(url: any)
Returns: void
import { Component, OnInit, Input } from '@angular/core';
import { Order } from '../../../../core/models/order';
import { environment } from '../../../../../environments/environment';

@Component({
  selector: 'app-order-list-item',
  templateUrl: './order-list-item.component.html',
  styleUrls: ['./order-list-item.component.scss']
})
export class OrderListItemComponent implements OnInit {
  @Input() order: Order;

  constructor() { }

  ngOnInit() {
  }

  getProductImageUrl(url) {
    return environment.API_ENDPOINT + url;
  }

}
<div class="panel panel-default">
  <div class="panel-body">
    <h5 class="active">{{order.shipment_state | uppercase}}</h5>
    <small>
      Placed on {{order.created_at | date:'fullDate'}} / 
      <i
        class="fa fa-{{order.currency | lowercase}}"
        aria-hidden="true">
      </i>{{order.total}} / 
      {{order.line_items.length}} items /
      Payment: {{order.payment_state | humanize | uppercase}}
    </small>
    <hr>
    <h5 class="strong">
      Shipment: {{order.line_items.length}} items | 
      {{order.shipment_state | uppercase}} on {{order.updated_at | date:'fullDate'}}
      <div class="pull-right">
        <a [routerLink]="['detail', order.number]" class="view-details-link strong">View Details</a>
      </div>
    </h5>
    <div *ngFor="let line_item of order.line_items">
      <img class="line_item_image" [src]="getProductImageUrl(line_item.image_url)" alt="Line Item">
    </div>
  </div>
</div>
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""