tsai
/
eShopOnAbp
mirror of https://github.com/abpframework/eShopOnAbp.git
1
0
Fork 1
Code Issues Projects Releases Wiki Activity
Browse Source

Format with prettier orders and order detail

pull/92/head^2
Mahmut Gundogdu 5 years ago
parent
b0f06531d8
commit
67ce9abb15
2 changed files with 90 additions and 67 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 96
      apps/angular/projects/ordering/src/pages/orders/order-detail/order-detail.component.html
  2. 61
      apps/angular/projects/ordering/src/pages/orders/orders.component.html

96
apps/angular/projects/ordering/src/pages/orders/order-detail/order-detail.component.html
View File

@ -1,66 +1,78 @@
<abp-modal [visible]='visible' (visibleChange)='visibleChange.emit($event)' [options]='modalOption'> <abp-modal [visible]="visible" (visibleChange)="visibleChange.emit($event)" [options]="modalOption">
<ng-template #abpHeader> <ng-template #abpHeader>
<h3>{{"OrderingService::ModalTitle" }}</h3> <h3>{{ 'OrderingService::ModalTitle' }}</h3>
</ng-template> </ng-template>
<ng-template #abpBody> <ng-template #abpBody>
<div *ngIf="order">
<div class="container">
<lib-order-detail-item label="OrderingService::DisplayName:OrderNo"
>#{{ order.orderNo }}</lib-order-detail-item
>
<lib-order-detail-item label="OrderingService::DisplayName:OrderStatus">{{
order.orderStatus
}}</lib-order-detail-item>
<lib-order-detail-item label="OrderingService::DisplayName:BuyerName">{{
order.buyer.name
}}</lib-order-detail-item>
<lib-order-detail-item label="OrderingService::DisplayName:BuyerEmail">{{
order.buyer.email
}}</lib-order-detail-item>
<div *ngIf='order'> <lib-order-detail-item label="OrderingService::DisplayName:Address">
<div class='container'> <span *ngIf="order.address as address">
<lib-order-detail-item label="OrderingService::DisplayName:OrderNo">#{{order.orderNo}}</lib-order-detail-item> {{ address.description }} <br />
<lib-order-detail-item label="OrderingService::DisplayName:OrderStatus">{{order.orderStatus}}</lib-order-detail-item> {{ address.street }} <br />
<lib-order-detail-item label="OrderingService::DisplayName:BuyerName">{{order.buyer.name}}</lib-order-detail-item> {{ address.zipCode }} <br />
<lib-order-detail-item label="OrderingService::DisplayName:BuyerEmail">{{order.buyer.email}}</lib-order-detail-item> {{ address.city }} / {{ address.country }} <br />
</span>
<lib-order-detail-item label="OrderingService::DisplayName:Address">
<span *ngIf='order.address as address'>
{{address.description}} <br />
{{address.street}} <br />
{{address.zipCode}} <br />
{{address.city}} / {{address.country}} <br />
</span>
</lib-order-detail-item> </lib-order-detail-item>
<lib-order-detail-item label="OrderingService::DisplayName:PaymentMethod">{{order.paymentMethod}}</lib-order-detail-item> <lib-order-detail-item label="OrderingService::DisplayName:PaymentMethod">{{
<lib-order-detail-item label="OrderingService::DisplayName:Total">{{order.orderTotal | currency}}</lib-order-detail-item> order.paymentMethod
}}</lib-order-detail-item>
<lib-order-detail-item label="OrderingService::DisplayName:Total">{{
order.orderTotal | currency
}}</lib-order-detail-item>
</div> </div>
<br><br><br> <br /><br /><br />
<ngx-datatable [rows]='(order.items)' default> <ngx-datatable [rows]="order.items" default>
<!-- TODO: localize column headers --> <!-- TODO: localize column headers -->
<ngx-datatable-column [name]="'OrderingService::DisplayName:ProductId'" prop='productId'></ngx-datatable-column> <ngx-datatable-column
<ngx-datatable-column [name]="'OrderingService::DisplayName:PictureUrl'" prop='pictureUrl'> [name]="'OrderingService::DisplayName:ProductId'"
<ng-template let-value='value' ngx-datatable-cell-template> prop="productId"
<img [src]="mediaServerUrl + '/product-images/' + value" width='80' alt='' /> ></ngx-datatable-column>
<ngx-datatable-column [name]="'OrderingService::DisplayName:PictureUrl'" prop="pictureUrl">
<ng-template let-value="value" ngx-datatable-cell-template>
<img [src]="mediaServerUrl + '/product-images/' + value" width="80" alt="" />
</ng-template> </ng-template>
</ngx-datatable-column> </ngx-datatable-column>
<ngx-datatable-column [name]="'OrderingService::DisplayName:ProductName'" prop='productName'></ngx-datatable-column> <ngx-datatable-column
<ngx-datatable-column [name]="'OrderingService::DisplayName:UnitPrice'" prop='unitPrice'> [name]="'OrderingService::DisplayName:ProductName'"
<ng-template let-value='value' ngx-datatable-cell-template> prop="productName"
{{value | currency }} ></ngx-datatable-column>
<ngx-datatable-column [name]="'OrderingService::DisplayName:UnitPrice'" prop="unitPrice">
<ng-template let-value="value" ngx-datatable-cell-template>
{{ value | currency }}
</ng-template> </ng-template>
</ngx-datatable-column> </ngx-datatable-column>
<ngx-datatable-column [name]="'OrderingService::DisplayName:Units'" prop='units'></ngx-datatable-column> <ngx-datatable-column
<ngx-datatable-column [name]="'OrderingService::DisplayName:Discount'" prop='discount'> [name]="'OrderingService::DisplayName:Units'"
<ng-template let-value='value' ngx-datatable-cell-template> prop="units"
{{value }} % ></ngx-datatable-column>
</ng-template> <ngx-datatable-column [name]="'OrderingService::DisplayName:Discount'" prop="discount">
<ng-template let-value="value" ngx-datatable-cell-template> {{ value }} % </ng-template>
</ngx-datatable-column> </ngx-datatable-column>
<ngx-datatable-column [name]="'OrderingService::DisplayName:TotalPrice'"> <ngx-datatable-column [name]="'OrderingService::DisplayName:TotalPrice'">
<ng-template let-row='row' ngx-datatable-cell-template> <ng-template let-row="row" ngx-datatable-cell-template>
{{(row.units * row.unitPrice) | currency }} {{ row.units * row.unitPrice | currency }}
</ng-template> </ng-template>
</ngx-datatable-column> </ngx-datatable-column>
</ngx-datatable> </ngx-datatable>
</div> </div>
</ng-template> </ng-template>
<ng-template #abpFooter> <ng-template #abpFooter>
<button type='button' class='btn btn-secondary' abpClose>{{ <button type="button" class="btn btn-secondary" abpClose>{{ 'AbpUi::Close' }}</button>
'AbpUi::Close'
}}</button>
</ng-template> </ng-template>
</abp-modal> </abp-modal>

61
apps/angular/projects/ordering/src/pages/orders/orders.component.html
View File

@ -1,18 +1,15 @@
<div class="card"> <div class="card">
<div class="card-header"> <div class="card-header">
<div class="row"> <div class="row">
<div class="col col-md-6"> <div class="col col-md-6">
<h5 class="card-title">{{ 'AbpOrdering::Orders' | abpLocalization }}</h5> <h5 class="card-title">{{ 'AbpOrdering::Orders' | abpLocalization }}</h5>
</div> </div>
</div> </div>
</div> </div>
<div class="card-body"> <div class="card-body">
<ngx-datatable [rows]="items" [count]="count" [list]="list" default> <ngx-datatable [rows]="items" [count]="count" [list]="list" default>
<!-- TODO: localize column headers --> <!-- TODO: localize column headers -->
<ngx-datatable-column name="" [sortable]='false' prop="id" > <ngx-datatable-column name="" [sortable]="false" prop="id">
<ng-template let-row="row" ngx-datatable-cell-template> <ng-template let-row="row" ngx-datatable-cell-template>
<div ngbDropdown container="body" class="d-inline-block"> <div ngbDropdown container="body" class="d-inline-block">
<button <button
@ -26,51 +23,65 @@
<div ngbDropdownMenu> <div ngbDropdownMenu>
<button <button
class="dropdown-item" class="dropdown-item"
(click)='openModal(row)' (click)="openModal(row)"
*abpPermission='permissions.detail' *abpPermission="permissions.detail"
> >
{{ 'AbpUi::Detail' | abpLocalization }} {{ 'AbpUi::Detail' | abpLocalization }}
</button> </button>
<button <button
class="dropdown-item" class="dropdown-item"
(click)='setAsShipped(row)' (click)="setAsShipped(row)"
*abpPermission='permissions.setAsShipped' *abpPermission="permissions.setAsShipped"
> >
{{ 'OrderingService::Permission:Orders.SetAsShipped' | abpLocalization }} {{ 'OrderingService::Permission:Orders.SetAsShipped' | abpLocalization }}
</button> </button>
<!-- Todo: Add permissions --> <!-- Todo: Add permissions -->
<button <button
class="dropdown-item" class="dropdown-item"
*abpPermission='permissions.setAsCancelled' *abpPermission="permissions.setAsCancelled"
(click)='setAsCancelled(row)' (click)="setAsCancelled(row)"
> >
{{ 'OrderingService::Permission:Orders.SetAsCancelled' | abpLocalization }} {{ 'OrderingService::Permission:Orders.SetAsCancelled' | abpLocalization }}
</button> </button>
</div> </div>
</div> </div>
</ng-template> </ng-template>
</ngx-datatable-column> </ngx-datatable-column>
<ngx-datatable-column [name]="'OrderingService::DisplayName:OrderNo' | abpLocalization" prop="orderNo"></ngx-datatable-column> <ngx-datatable-column
<ngx-datatable-column [name]="'OrderingService::DisplayName:OrderDate' | abpLocalization" prop="orderDate" > [name]="'OrderingService::DisplayName:OrderNo' | abpLocalization"
prop="orderNo"
></ngx-datatable-column>
<ngx-datatable-column
[name]="'OrderingService::DisplayName:OrderDate' | abpLocalization"
prop="orderDate"
>
<ng-template let-value="value" ngx-datatable-cell-template> <ng-template let-value="value" ngx-datatable-cell-template>
<span>{{ value | date }}</span > <span>{{ value | date }}</span>
</ng-template> </ng-template>
</ngx-datatable-column> </ngx-datatable-column>
<ngx-datatable-column [name]="'OrderingService::DisplayName:OrderTotal' | abpLocalization" prop="orderTotal" > <ngx-datatable-column
[name]="'OrderingService::DisplayName:OrderTotal' | abpLocalization"
prop="orderTotal"
>
<ng-template let-value="value" ngx-datatable-cell-template> <ng-template let-value="value" ngx-datatable-cell-template>
<span>{{ value | currency }}</span > <span>{{ value | currency }}</span>
</ng-template> </ng-template>
</ngx-datatable-column> </ngx-datatable-column>
<ngx-datatable-column [name]="'OrderingService::DisplayName:OrderStatus' | abpLocalization" prop="orderStatus"> <ngx-datatable-column
[name]="'OrderingService::DisplayName:OrderStatus' | abpLocalization"
prop="orderStatus"
>
<ng-template let-value="value" ngx-datatable-cell-template> <ng-template let-value="value" ngx-datatable-cell-template>
{{ "OrderingService::Enum:OrderStatus:" + value | abpLocalization }} {{ 'OrderingService::Enum:OrderStatus:' + value | abpLocalization }}
</ng-template> </ng-template>
</ngx-datatable-column> </ngx-datatable-column>
</ngx-datatable> </ngx-datatable>
</div> </div>
</div> </div>
<lib-order-detail
<lib-order-detail [visible]='isModalVisible' (visibleChange)='closeModal($event)' [order]='selectedOrder' > [visible]="isModalVisible"
</lib-order-detail> (visibleChange)="closeModal($event)"
[order]="selectedOrder"
>
</lib-order-detail>

Write Preview
Loading…
Cancel
Save