### 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`
Defined in src/app/user/components/orders/order-list-item/order-list-item.component.ts:11

### Constructor

`constructor()`
Defined in src/app/user/components/orders/order-list-item/order-list-item.component.ts:11

### Methods

ngOnInit
`ngOnInit()`
Defined in src/app/user/components/orders/order-list-item/order-list-item.component.ts:15
Returns: `void`

getProductImageUrl
`getProductImageUrl(url: any)`
Defined in src/app/user/components/orders/order-list-item/order-list-item.component.ts:18
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 ""