feat(admin-ui): Create OrderDetailComponent

admin-ui/src/app/data/definitions/order-definitions.ts

@@ -15,6 +15,7 @@ export const ORDER_FRAGMENT = gql`
         createdAt
         updatedAt
         code
+        state
         total
         customer {
             firstName
@@ -29,6 +30,7 @@ export const ORDER_WITH_LINES_FRAGMENT = gql`
         createdAt
         updatedAt
         code
+        state
         customer {
             firstName
             lastName

admin-ui/src/app/order/components/order-detail/order-detail.component.html

@@ -8,12 +8,32 @@
 
 <div *ngIf="entity$ | async as order">
 
-    <div class="order-info">
-        <div class="order-code">{{ 'order.order-code' | translate }}: {{ order.code }}</div>
-        <div class="created">{{ 'common.created' | translate }}: {{ order.createdAt | date:'medium' }}</div>
-        <div class="updated">{{ 'common.updated' | translate }}: {{ order.updatedAt | date:'medium' }}</div>
+    <div class="clr-row">
+        <div class="clr-col-md-4">
+            <table class="table table-vertical">
+                <tbody>
+                <tr>
+                    <th>{{ 'order.order-code' | translate }}</th>
+                    <td>{{ order.code }}</td>
+                </tr>
+                <tr>
+                    <th>{{ 'order.state' | translate }}</th>
+                    <td>{{ order.state }}</td>
+                </tr>
+                <tr>
+                    <th>{{ 'common.created' | translate }}</th>
+                    <td>{{ order.createdAt | date:'medium' }}</td>
+                </tr>
+                <tr>
+                    <th>{{ 'common.updated' | translate }}</th>
+                    <td>{{ order.updatedAt | date:'medium' }}</td>
+                </tr>
+                </tbody>
+            </table>
+        </div>
     </div>
 
+
     <table class="order-lines table">
         <thead>
         <tr>

admin-ui/src/app/order/components/order-list/order-list.component.html

@@ -15,6 +15,7 @@
                 (itemsPerPageChange)="setItemsPerPage($event)">
     <vdr-dt-column>{{ 'common.ID' | translate }}</vdr-dt-column>
     <vdr-dt-column>{{ 'common.code' | translate }}</vdr-dt-column>
+    <vdr-dt-column>{{ 'order.state' | translate }}</vdr-dt-column>
     <vdr-dt-column>{{ 'order.total' | translate }}</vdr-dt-column>
     <vdr-dt-column>{{ 'common.created-at' | translate }}</vdr-dt-column>
     <vdr-dt-column>{{ 'common.updated-at' | translate }}</vdr-dt-column>
@@ -22,6 +23,7 @@
     <ng-template let-order="item">
         <td class="left">{{ order.id }}</td>
         <td class="left">{{ order.code }}</td>
+        <td class="left">{{ order.state }}</td>
         <td class="left">{{ order.total / 100 | currency }}</td>
         <td class="left">{{ order.createdAt | date:'medium' }}</td>
         <td class="left">{{ order.updatedAt | date:'medium' }}</td>

admin-ui/src/i18n-messages/en.json

@@ -138,6 +138,7 @@
     "product-name": "Product name",
     "product-sku": "SKU",
     "quantity": "Quantity",
+    "state": "State",
     "sub-total": "Sub total",
     "total": "Total",
     "unit-price": "Unit price"

shared/generated-types.ts

@@ -4875,6 +4875,7 @@ export namespace Order {
         createdAt: DateTime;
         updatedAt: DateTime;
         code: string;
+        state: string;
         total: number;
         customer?: Customer | null;
     };
@@ -4893,6 +4894,7 @@ export namespace OrderWithLines {
         createdAt: DateTime;
         updatedAt: DateTime;
         code: string;
+        state: string;
         customer?: Customer | null;
         lines: Lines[];
         adjustments: Adjustments[];