feat(admin-ui): Implement order modification flow

Relates to #314
vendure-ecommerce · Dec 21, 2020 · d3e3a88 · d3e3a88
1 parent 894f95b
commit d3e3a88
Show file tree

Hide file tree

Showing 52 changed files with 1,991 additions and 388 deletions.
diff --git a/packages/admin-ui/i18n-coverage.json b/packages/admin-ui/i18n-coverage.json
@@ -1,46 +1,51 @@
 {
-  "generatedOn": "2020-12-04T16:28:55.124Z",
-  "lastCommit": "8e5b1dd3b6d362fd9431d242e5e829419e6f3179",
+  "generatedOn": "2020-12-21T15:26:51.662Z",
+  "lastCommit": "3fda1021d033a38b878a6c6d8b5543bf0d554155",
   "translationStatus": {
     "cs": {
-      "tokenCount": 713,
-      "translatedCount": 685,
-      "percentage": 96
+      "tokenCount": 743,
+      "translatedCount": 687,
+      "percentage": 92
     },
     "de": {
-      "tokenCount": 713,
-      "translatedCount": 594,
-      "percentage": 83
+      "tokenCount": 743,
+      "translatedCount": 596,
+      "percentage": 80
     },
     "en": {
-      "tokenCount": 713,
-      "translatedCount": 713,
-      "percentage": 100
+      "tokenCount": 743,
+      "translatedCount": 739,
+      "percentage": 99
     },
     "es": {
-      "tokenCount": 713,
+      "tokenCount": 743,
       "translatedCount": 455,
-      "percentage": 64
+      "percentage": 61
+    },
+    "fr": {
+      "tokenCount": 743,
+      "translatedCount": 692,
+      "percentage": 93
     },
     "pl": {
-      "tokenCount": 713,
-      "translatedCount": 549,
-      "percentage": 77
+      "tokenCount": 743,
+      "translatedCount": 551,
+      "percentage": 74
     },
     "pt_BR": {
-      "tokenCount": 713,
-      "translatedCount": 640,
-      "percentage": 90
+      "tokenCount": 743,
+      "translatedCount": 642,
+      "percentage": 86
     },
     "zh_Hans": {
-      "tokenCount": 713,
+      "tokenCount": 743,
       "translatedCount": 533,
-      "percentage": 75
+      "percentage": 72
     },
     "zh_Hant": {
-      "tokenCount": 713,
+      "tokenCount": 743,
       "translatedCount": 533,
-      "percentage": 75
+      "percentage": 72
     }
   }
 }
diff --git a/packages/admin-ui/src/lib/core/src/common/detail-breadcrumb.ts b/packages/admin-ui/src/lib/core/src/common/detail-breadcrumb.ts
@@ -29,7 +29,7 @@ export function detailBreadcrumb<T>(options: {
                 },
                 {
                     label,
-                    link: [options.id],
+                    link: [options.route, options.id],
                 },
             ];
         }),

diff --git a/packages/admin-ui/src/lib/core/src/common/generated-types.ts b/packages/admin-ui/src/lib/core/src/common/generated-types.ts
@@ -3345,7 +3345,8 @@ export enum HistoryEntryType {
   ORDER_FULFILLMENT_TRANSITION = 'ORDER_FULFILLMENT_TRANSITION',
   ORDER_NOTE = 'ORDER_NOTE',
   ORDER_COUPON_APPLIED = 'ORDER_COUPON_APPLIED',
-  ORDER_COUPON_REMOVED = 'ORDER_COUPON_REMOVED'
+  ORDER_COUPON_REMOVED = 'ORDER_COUPON_REMOVED',
+  ORDER_MODIFIED = 'ORDER_MODIFIED'
 }
 
 export type HistoryEntryList = PaginatedList & {
@@ -5451,7 +5452,7 @@ export type RefundFragment = (
 
 export type OrderAddressFragment = (
   { __typename?: 'OrderAddress' }
-  & Pick<OrderAddress, 'fullName' | 'company' | 'streetLine1' | 'streetLine2' | 'city' | 'province' | 'postalCode' | 'country' | 'phoneNumber'>
+  & Pick<OrderAddress, 'fullName' | 'company' | 'streetLine1' | 'streetLine2' | 'city' | 'province' | 'postalCode' | 'country' | 'countryCode' | 'phoneNumber'>
 );
 
 export type OrderFragment = (
@@ -5541,7 +5542,23 @@ export type OrderDetailFragment = (
   )>>, fulfillments?: Maybe<Array<(
     { __typename?: 'Fulfillment' }
     & FulfillmentFragment
-  )>> }
+  )>>, modifications: Array<(
+    { __typename?: 'OrderModification' }
+    & Pick<OrderModification, 'id' | 'createdAt' | 'isSettled' | 'priceChange' | 'note'>
+    & { payment?: Maybe<(
+      { __typename?: 'Payment' }
+      & Pick<Payment, 'id' | 'amount'>
+    )>, orderItems?: Maybe<Array<(
+      { __typename?: 'OrderItem' }
+      & Pick<OrderItem, 'id'>
+    )>>, refund?: Maybe<(
+      { __typename?: 'Refund' }
+      & Pick<Refund, 'id' | 'paymentId' | 'total'>
+    )>, surcharges?: Maybe<Array<(
+      { __typename?: 'Surcharge' }
+      & Pick<Surcharge, 'id'>
+    )>> }
+  )> }
 );
 
 export type GetOrderListQueryVariables = Exact<{
@@ -5798,6 +5815,50 @@ export type GetOrderSummaryQuery = { orders: (
     )> }
   ) };
 
+export type ModifyOrderMutationVariables = Exact<{
+  input: ModifyOrderInput;
+}>;
+
+
+export type ModifyOrderMutation = { modifyOrder: (
+    { __typename?: 'Order' }
+    & OrderDetailFragment
+  ) | (
+    { __typename?: 'NoChangesSpecifiedError' }
+    & ErrorResult_NoChangesSpecifiedError_Fragment
+  ) | (
+    { __typename?: 'OrderModificationStateError' }
+    & ErrorResult_OrderModificationStateError_Fragment
+  ) | (
+    { __typename?: 'PaymentMethodMissingError' }
+    & ErrorResult_PaymentMethodMissingError_Fragment
+  ) | (
+    { __typename?: 'RefundPaymentIdMissingError' }
+    & ErrorResult_RefundPaymentIdMissingError_Fragment
+  ) | (
+    { __typename?: 'OrderLimitError' }
+    & ErrorResult_OrderLimitError_Fragment
+  ) | (
+    { __typename?: 'NegativeQuantityError' }
+    & ErrorResult_NegativeQuantityError_Fragment
+  ) | (
+    { __typename?: 'InsufficientStockError' }
+    & ErrorResult_InsufficientStockError_Fragment
+  ) };
+
+export type AddManualPaymentMutationVariables = Exact<{
+  input: ManualPaymentInput;
+}>;
+
+
+export type AddManualPaymentMutation = { addManualPaymentToOrder: (
+    { __typename?: 'Order' }
+    & OrderDetailFragment
+  ) | (
+    { __typename?: 'ManualPaymentStateError' }
+    & ErrorResult_ManualPaymentStateError_Fragment
+  ) };
+
 export type AssetFragment = (
   { __typename?: 'Asset' }
   & Pick<Asset, 'id' | 'createdAt' | 'updatedAt' | 'name' | 'fileSize' | 'mimeType' | 'type' | 'preview' | 'source' | 'width' | 'height'>
@@ -8108,6 +8169,11 @@ export namespace OrderDetail {
   export type Refunds = NonNullable<(NonNullable<NonNullable<(NonNullable<OrderDetailFragment['payments']>)[number]>['refunds']>)[number]>;
   export type OrderItems = NonNullable<(NonNullable<NonNullable<(NonNullable<NonNullable<(NonNullable<OrderDetailFragment['payments']>)[number]>['refunds']>)[number]>['orderItems']>)[number]>;
   export type Fulfillments = NonNullable<(NonNullable<OrderDetailFragment['fulfillments']>)[number]>;
+  export type Modifications = NonNullable<(NonNullable<OrderDetailFragment['modifications']>)[number]>;
+  export type Payment = (NonNullable<NonNullable<(NonNullable<OrderDetailFragment['modifications']>)[number]>['payment']>);
+  export type _OrderItems = NonNullable<(NonNullable<NonNullable<(NonNullable<OrderDetailFragment['modifications']>)[number]>['orderItems']>)[number]>;
+  export type Refund = (NonNullable<NonNullable<(NonNullable<OrderDetailFragment['modifications']>)[number]>['refund']>);
+  export type _Surcharges = NonNullable<(NonNullable<NonNullable<(NonNullable<OrderDetailFragment['modifications']>)[number]>['surcharges']>)[number]>;
 }
 
 export namespace GetOrderList {
@@ -8211,6 +8277,18 @@ export namespace GetOrderSummary {
   export type Items = NonNullable<(NonNullable<(NonNullable<GetOrderSummaryQuery['orders']>)['items']>)[number]>;
 }
 
+export namespace ModifyOrder {
+  export type Variables = ModifyOrderMutationVariables;
+  export type Mutation = ModifyOrderMutation;
+  export type ModifyOrder = (NonNullable<ModifyOrderMutation['modifyOrder']>);
+}
+
+export namespace AddManualPayment {
+  export type Variables = AddManualPaymentMutationVariables;
+  export type Mutation = AddManualPaymentMutation;
+  export type AddManualPaymentToOrder = (NonNullable<AddManualPaymentMutation['addManualPaymentToOrder']>);
+}
+
 export namespace Asset {
   export type Fragment = AssetFragment;
   export type FocalPoint = (NonNullable<AssetFragment['focalPoint']>);

diff --git a/packages/admin-ui/src/lib/core/src/data/definitions/order-definitions.ts b/packages/admin-ui/src/lib/core/src/data/definitions/order-definitions.ts
@@ -33,6 +33,7 @@ export const ORDER_ADDRESS_FRAGMENT = gql`
         province
         postalCode
         country
+        countryCode
         phoneNumber
     }
 `;
@@ -199,6 +200,28 @@ export const ORDER_DETAIL_FRAGMENT = gql`
         fulfillments {
             ...Fulfillment
         }
+        modifications {
+            id
+            createdAt
+            isSettled
+            priceChange
+            note
+            payment {
+                id
+                amount
+            }
+            orderItems {
+                id
+            }
+            refund {
+                id
+                paymentId
+                total
+            }
+            surcharges {
+                id
+            }
+        }
     }
     ${ADJUSTMENT_FRAGMENT}
     ${ORDER_ADDRESS_FRAGMENT}
@@ -396,3 +419,25 @@ export const GET_ORDER_SUMMARY = gql`
         }
     }
 `;
+
+export const MODIFY_ORDER = gql`
+    mutation ModifyOrder($input: ModifyOrderInput!) {
+        modifyOrder(input: $input) {
+            ...OrderDetail
+            ...ErrorResult
+        }
+    }
+    ${ORDER_DETAIL_FRAGMENT}
+    ${ERROR_RESULT_FRAGMENT}
+`;
+
+export const ADD_MANUAL_PAYMENT_TO_ORDER = gql`
+    mutation AddManualPayment($input: ManualPaymentInput!) {
+        addManualPaymentToOrder(input: $input) {
+            ...OrderDetail
+            ...ErrorResult
+        }
+    }
+    ${ORDER_DETAIL_FRAGMENT}
+    ${ERROR_RESULT_FRAGMENT}
+`;
diff --git a/packages/admin-ui/src/lib/core/src/data/providers/order-data.service.ts b/packages/admin-ui/src/lib/core/src/data/providers/order-data.service.ts
@@ -1,4 +1,5 @@
 import {
+    AddManualPayment,
     AddNoteToOrder,
     AddNoteToOrderInput,
     CancelOrder,
@@ -11,6 +12,9 @@ import {
     GetOrderList,
     GetOrderSummary,
     HistoryEntryListOptions,
+    ManualPaymentInput,
+    ModifyOrder,
+    ModifyOrderInput,
     OrderListOptions,
     RefundOrder,
     RefundOrderInput,
@@ -25,6 +29,7 @@ import {
     UpdateOrderNoteInput,
 } from '../../common/generated-types';
 import {
+    ADD_MANUAL_PAYMENT_TO_ORDER,
     ADD_NOTE_TO_ORDER,
     CANCEL_ORDER,
     CREATE_FULFILLMENT,
@@ -33,6 +38,7 @@ import {
     GET_ORDERS_LIST,
     GET_ORDER_HISTORY,
     GET_ORDER_SUMMARY,
+    MODIFY_ORDER,
     REFUND_ORDER,
     SETTLE_PAYMENT,
     SETTLE_REFUND,
@@ -165,4 +171,17 @@ export class OrderDataService {
             },
         );
     }
+
+    modifyOrder(input: ModifyOrderInput) {
+        return this.baseDataService.mutate<ModifyOrder.Mutation, ModifyOrder.Variables>(MODIFY_ORDER, {
+            input,
+        });
+    }
+
+    addManualPaymentToOrder(input: ManualPaymentInput) {
+        return this.baseDataService.mutate<AddManualPayment.Mutation, AddManualPayment.Variables>(
+            ADD_MANUAL_PAYMENT_TO_ORDER,
+            { input },
+        );
+    }
 }
diff --git a/...ages/admin-ui/src/lib/core/src/shared/components/address-form/address-form.component.html b/...ages/admin-ui/src/lib/core/src/shared/components/address-form/address-form.component.html
@@ -0,0 +1,67 @@
+<form [formGroup]="formGroup">
+    <clr-input-container>
+        <label>{{ 'customer.full-name' | translate }}</label>
+        <input formControlName="fullName" type="text" clrInput />
+    </clr-input-container>
+
+    <div class="clr-row">
+        <div class="clr-col-md-4">
+            <clr-input-container>
+                <label>{{ 'customer.street-line-1' | translate }}</label>
+                <input formControlName="streetLine1" type="text" clrInput />
+            </clr-input-container>
+        </div>
+        <div class="clr-col-md-4">
+            <clr-input-container>
+                <label>{{ 'customer.street-line-2' | translate }}</label>
+                <input formControlName="streetLine2" type="text" clrInput />
+            </clr-input-container>
+        </div>
+    </div>
+    <div class="clr-row">
+        <div class="clr-col-md-4">
+            <clr-input-container>
+                <label>{{ 'customer.city' | translate }}</label>
+                <input formControlName="city" type="text" clrInput />
+            </clr-input-container>
+        </div>
+        <div class="clr-col-md-4">
+            <clr-input-container>
+                <label>{{ 'customer.province' | translate }}</label>
+                <input formControlName="province" type="text" clrInput />
+            </clr-input-container>
+        </div>
+    </div>
+    <div class="clr-row">
+        <div class="clr-col-md-4">
+            <clr-input-container>
+                <label>{{ 'customer.postal-code' | translate }}</label>
+                <input formControlName="postalCode" type="text" clrInput />
+            </clr-input-container>
+        </div>
+        <div class="clr-col-md-4">
+            <clr-input-container>
+                <label>{{ 'customer.country' | translate }}</label>
+                <select name="countryCode" formControlName="countryCode" clrInput clrSelect>
+                    <option *ngFor="let country of availableCountries" [value]="country.code">
+                        {{ country.name }}
+                    </option>
+                </select>
+            </clr-input-container>
+        </div>
+    </div>
+    <clr-input-container>
+        <label>{{ 'customer.phone-number' | translate }}</label>
+        <input formControlName="phoneNumber" type="text" clrInput />
+    </clr-input-container>
+    <section formGroupName="customFields" *ngIf="formGroup.get('customFields') as customFieldsGroup">
+        <label>{{ 'common.custom-fields' | translate }}</label>
+        <ng-container *ngFor="let customField of customFields">
+            <vdr-custom-field-control
+                entityName="Facet"
+                [customFieldsFormGroup]="customFieldsGroup"
+                [customField]="customField"
+            ></vdr-custom-field-control>
+        </ng-container>
+    </section>
+</form>
diff --git a/...ages/admin-ui/src/lib/core/src/shared/components/address-form/address-form.component.scss b/...ages/admin-ui/src/lib/core/src/shared/components/address-form/address-form.component.scss
-Original file line number
+Diff line change
@@ Expand Up / @@ -29,7 +29,7 @@ export function detailBreadcrumb<T>(options: { @@
                     },
                     {
                         label,
-                        link: [options.id],
+                        link: [options.route, options.id],
                     },
                 ];
             }),
@@ Expand Down @@