feat: Basic orders list

admin-ui/src/app/app.routes.ts

@@ -27,6 +27,10 @@ export const routes: Route[] = [
                 path: 'admin',
                 loadChildren: './administrator/administrator.module#AdministratorModule',
             },
+            {
+                path: 'orders',
+                loadChildren: './order/order.module#OrderModule',
+            },
         ],
     },
 ];

admin-ui/src/app/core/components/main-nav/main-nav.component.html

@@ -36,7 +36,9 @@
             <label for="tabexample2">{{ 'nav.sales' | translate }}</label>
             <ul class="nav-list">
                 <li>
-                    <a class="nav-link">
+                    <a class="nav-link"
+                       [routerLink]="['/orders']"
+                       routerLinkActive="active">
                         <clr-icon shape="shopping-cart" size="20"></clr-icon>{{ 'nav.orders' | translate }}
                     </a>
                 </li>

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

@@ -0,0 +1,26 @@
+import gql from 'graphql-tag';
+
+export const ORDER_FRAGMENT = gql`
+    fragment Order on Order {
+        id
+        createdAt
+        updatedAt
+        code
+        customer {
+            firstName
+            lastName
+        }
+    }
+`;
+
+export const GET_ORDERS_LIST = gql`
+    query GetOrderList($options: OrderListOptions) {
+        orders(options: $options) {
+            items {
+                ...Order
+            }
+            totalItems
+        }
+    }
+    ${ORDER_FRAGMENT}
+`;

admin-ui/src/app/data/providers/data.service.mock.ts

@@ -50,6 +50,9 @@ export class MockDataService implements DataServiceMock {
         uiState: spyQueryResult('uiState'),
         setUiLanguage: spyObservable('setUiLanguage'),
     };
+    order = {
+        getOrders: spyQueryResult('getOrders'),
+    };
     product = {
         getProducts: spyQueryResult('getProducts'),
         getProduct: spyQueryResult('getProduct'),

admin-ui/src/app/data/providers/data.service.ts

@@ -5,6 +5,7 @@ import { AuthDataService } from './auth-data.service';
 import { BaseDataService } from './base-data.service';
 import { ClientDataService } from './client-data.service';
 import { FacetDataService } from './facet-data.service';
+import { OrderDataService } from './order-data.service';
 import { ProductDataService } from './product-data.service';
 
 @Injectable()
@@ -14,6 +15,7 @@ export class DataService {
     product: ProductDataService;
     client: ClientDataService;
     facet: FacetDataService;
+    order: OrderDataService;
 
     constructor(baseDataService: BaseDataService) {
         this.administrator = new AdministratorDataService(baseDataService);
@@ -21,5 +23,6 @@ export class DataService {
         this.product = new ProductDataService(baseDataService);
         this.client = new ClientDataService(baseDataService);
         this.facet = new FacetDataService(baseDataService);
+        this.order = new OrderDataService(baseDataService);
     }
 }

admin-ui/src/app/data/providers/order-data.service.ts

@@ -0,0 +1,19 @@
+import { GetOrderList } from 'shared/generated-types';
+
+import { getDefaultLanguage } from '../../common/utilities/get-default-language';
+import { GET_ORDERS_LIST } from '../definitions/order-definitions';
+
+import { BaseDataService } from './base-data.service';
+
+export class OrderDataService {
+    constructor(private baseDataService: BaseDataService) {}
+
+    getOrders(take: number = 10, skip: number = 0) {
+        return this.baseDataService.query<GetOrderList.Query, GetOrderList.Variables>(GET_ORDERS_LIST, {
+            options: {
+                take,
+                skip,
+            },
+        });
+    }
+}

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

@@ -0,0 +1,33 @@
+<vdr-action-bar>
+    <vdr-ab-right>
+        <!--<a class="btn btn-primary" [routerLink]="['./create']">
+            <clr-icon shape="plus"></clr-icon>
+            {{ 'order.create-new-order' | translate }}
+        </a>-->
+    </vdr-ab-right>
+</vdr-action-bar>
+
+<vdr-data-table [items]="items$ | async"
+                [itemsPerPage]="itemsPerPage$ | async"
+                [totalItems]="totalItems$ | async"
+                [currentPage]="currentPage$ | async"
+                (pageChange)="setPageNumber($event)"
+                (itemsPerPageChange)="setItemsPerPage($event)">
+    <vdr-dt-column>{{ 'common.ID' | translate }}</vdr-dt-column>
+    <vdr-dt-column>{{ 'common.code' | translate }}</vdr-dt-column>
+    <vdr-dt-column>{{ 'common.created-at' | translate }}</vdr-dt-column>
+    <vdr-dt-column>{{ 'common.updated-at' | translate }}</vdr-dt-column>
+    <vdr-dt-column></vdr-dt-column>
+    <ng-template let-order="item">
+        <td class="left">{{ order.id }}</td>
+        <td class="left">{{ order.code }}</td>
+        <td class="left">{{ order.createdAt }}</td>
+        <td class="left">{{ order.updatedAt }}</td>
+        <td class="right">
+            <vdr-table-row-action iconShape="edit"
+                                  [label]="'common.edit' | translate"
+                                  [linkTo]="['./', order.id]">
+            </vdr-table-row-action>
+        </td>
+    </ng-template>
+</vdr-data-table>

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

@@ -0,0 +1,19 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { GetOrderList } from 'shared/generated-types';
+
+import { BaseListComponent } from '../../../common/base-list.component';
+import { DataService } from '../../../data/providers/data.service';
+
+@Component({
+    selector: 'vdr-order-list',
+    templateUrl: './order-list.component.html',
+    styleUrls: ['./order-list.component.scss'],
+    changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class OrderListComponent extends BaseListComponent<GetOrderList.Query, GetOrderList.Items> {
+    constructor(private dataService: DataService, router: Router, route: ActivatedRoute) {
+        super(router, route);
+        super.setQueryFn((...args: any[]) => this.dataService.order.getOrders(...args), data => data.orders);
+    }
+}

admin-ui/src/app/order/order.module.ts

@@ -0,0 +1,14 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+
+import { SharedModule } from '../shared/shared.module';
+
+import { OrderListComponent } from './components/order-list/order-list.component';
+import { orderRoutes } from './order.routes';
+
+@NgModule({
+    imports: [SharedModule, RouterModule.forChild(orderRoutes)],
+    declarations: [OrderListComponent],
+    providers: [],
+})
+export class OrderModule {}

admin-ui/src/app/order/order.routes.ts

@@ -0,0 +1,15 @@
+import { Route } from '@angular/router';
+
+import { _ } from '../core/providers/i18n/mark-for-extraction';
+
+import { OrderListComponent } from './components/order-list/order-list.component';
+
+export const orderRoutes: Route[] = [
+    {
+        path: '',
+        component: OrderListComponent,
+        data: {
+            breadcrumb: _('breadcrumb.orders'),
+        },
+    },
+];

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

@@ -25,6 +25,7 @@
     "assets": "Assets",
     "dashboard": "Dashboard",
     "facets": "Facets",
+    "orders": "Orders",
     "products": "Products",
     "roles": "Roles"
   },
@@ -83,6 +84,7 @@
     "code": "Code",
     "confirm": "Confirm",
     "create": "Create",
+    "created-at": "Created at",
     "edit": "Edit",
     "edit-field": "Edit field",
     "finish": "Finish",
@@ -98,6 +100,7 @@
     "password": "Password",
     "remember-me": "Remember me",
     "update": "Update",
+    "updated-at": "Updated at",
     "username": "Username"
   },
   "error": {
@@ -118,5 +121,8 @@
     "products": "Products",
     "roles": "Roles",
     "sales": "Sales"
+  },
+  "order": {
+    "create-new-order": "Create new order"
   }
 }

server/src/api/resolvers/order.resolver.ts

@@ -24,8 +24,8 @@ export class OrderResolver {
 
     @Query()
     @Allow(Permission.ReadOrder)
-    orders(@Args() args: OrdersQueryArgs): Promise<PaginatedList<Order>> {
-        return {} as any;
+    orders(@Ctx() ctx: RequestContext, @Args() args: OrdersQueryArgs): Promise<PaginatedList<Order>> {
+        return this.orderService.findAll(ctx, args.options || undefined);
     }
 
     @Query()

server/src/api/types/order.api.graphql

@@ -1,6 +1,6 @@
 type Query {
     order(id: ID!): Order
-    orders(options: OrderListOptions): OrderList
+    orders(options: OrderListOptions): OrderList!
 }
 
 type Mutation {

server/src/entity/order/order.graphql

@@ -3,7 +3,7 @@ type Order implements Node {
     createdAt: DateTime!
     updatedAt: DateTime!
     code: String!
-    customer: Customer!
+    customer: Customer
     items: [OrderItem!]!
     adjustments: [Adjustment!]!
 }

server/src/service/providers/order.service.ts

@@ -21,7 +21,7 @@ export class OrderService {
     ) {}
 
     findAll(ctx: RequestContext, options?: ListQueryOptions<Order>): Promise<PaginatedList<Order>> {
-        return buildListQuery(this.connection, Order, options, [])
+        return buildListQuery(this.connection, Order, options, ['items', 'items.productVariant', 'customer'])
             .getManyAndCount()
             .then(([items, totalItems]) => {
                 return {

shared/generated-types.ts

@@ -50,7 +50,7 @@ export interface Query {
     facets: FacetList;
     facet?: Facet | null;
     order?: Order | null;
-    orders?: OrderList | null;
+    orders: OrderList;
     productOptionGroups: ProductOptionGroup[];
     productOptionGroup?: ProductOptionGroup | null;
     products: ProductList;
@@ -1231,7 +1231,7 @@ export namespace QueryResolvers {
         facets?: FacetsResolver<FacetList, any, Context>;
         facet?: FacetResolver<Facet | null, any, Context>;
         order?: OrderResolver<Order | null, any, Context>;
-        orders?: OrdersResolver<OrderList | null, any, Context>;
+        orders?: OrdersResolver<OrderList, any, Context>;
         productOptionGroups?: ProductOptionGroupsResolver<ProductOptionGroup[], any, Context>;
         productOptionGroup?: ProductOptionGroupResolver<ProductOptionGroup | null, any, Context>;
         products?: ProductsResolver<ProductList, any, Context>;
@@ -1341,7 +1341,7 @@ export namespace QueryResolvers {
         id: string;
     }
 
-    export type OrdersResolver<R = OrderList | null, Parent = any, Context = any> = Resolver<
+    export type OrdersResolver<R = OrderList, Parent = any, Context = any> = Resolver<
         R,
         Parent,
         Context,
@@ -3059,6 +3059,25 @@ export namespace GetUiState {
     };
 }
 
+export namespace GetOrderList {
+    export type Variables = {
+        options?: OrderListOptions | null;
+    };
+
+    export type Query = {
+        __typename?: 'Query';
+        orders: Orders;
+    };
+
+    export type Orders = {
+        __typename?: 'OrderList';
+        items: Items[];
+        totalItems: number;
+    };
+
+    export type Items = Order.Fragment;
+}
+
 export namespace UpdateProduct {
     export type Variables = {
         input: UpdateProductInput;
@@ -3397,6 +3416,23 @@ export namespace FacetWithValues {
     export type Values = FacetValue.Fragment;
 }
 
+export namespace Order {
+    export type Fragment = {
+        __typename?: 'Order';
+        id: string;
+        createdAt: DateTime;
+        updatedAt: DateTime;
+        code: string;
+        customer: Customer;
+    };
+
+    export type Customer = {
+        __typename?: 'Customer';
+        firstName: string;
+        lastName: string;
+    };
+}
+
 export namespace Asset {
     export type Fragment = {
         __typename?: 'Asset';