Skip to content

Commit

Permalink
feat(admin-ui): Implement UI for updating, deleting notes
Browse files Browse the repository at this point in the history
Relates to #310
  • Loading branch information
michaelbromley committed Jun 2, 2020
1 parent 90bacf5 commit ef5eddf
Show file tree
Hide file tree
Showing 18 changed files with 447 additions and 23 deletions.
76 changes: 76 additions & 0 deletions packages/admin-ui/src/lib/core/src/common/generated-types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4553,6 +4553,32 @@ export type AddNoteToCustomerMutation = (
) }
);

export type UpdateCustomerNoteMutationVariables = {
input: UpdateCustomerNoteInput;
};


export type UpdateCustomerNoteMutation = (
{ __typename?: 'Mutation' }
& { updateCustomerNote: (
{ __typename?: 'HistoryEntry' }
& Pick<HistoryEntry, 'id' | 'data' | 'isPublic'>
) }
);

export type DeleteCustomerNoteMutationVariables = {
id: Scalars['ID'];
};


export type DeleteCustomerNoteMutation = (
{ __typename?: 'Mutation' }
& { deleteCustomerNote: (
{ __typename?: 'DeletionResponse' }
& Pick<DeletionResponse, 'result' | 'message'>
) }
);

export type FacetValueFragment = (
{ __typename?: 'FacetValue' }
& Pick<FacetValue, 'id' | 'createdAt' | 'updatedAt' | 'languageCode' | 'code' | 'name'>
Expand Down Expand Up @@ -4910,6 +4936,32 @@ export type AddNoteToOrderMutation = (
) }
);

export type UpdateOrderNoteMutationVariables = {
input: UpdateOrderNoteInput;
};


export type UpdateOrderNoteMutation = (
{ __typename?: 'Mutation' }
& { updateOrderNote: (
{ __typename?: 'HistoryEntry' }
& Pick<HistoryEntry, 'id' | 'data' | 'isPublic'>
) }
);

export type DeleteOrderNoteMutationVariables = {
id: Scalars['ID'];
};


export type DeleteOrderNoteMutation = (
{ __typename?: 'Mutation' }
& { deleteOrderNote: (
{ __typename?: 'DeletionResponse' }
& Pick<DeletionResponse, 'result' | 'message'>
) }
);

export type AssetFragment = (
{ __typename?: 'Asset' }
& Pick<Asset, 'id' | 'createdAt' | 'updatedAt' | 'name' | 'fileSize' | 'mimeType' | 'type' | 'preview' | 'source' | 'width' | 'height'>
Expand Down Expand Up @@ -6985,6 +7037,18 @@ export namespace AddNoteToCustomer {
export type AddNoteToCustomer = AddNoteToCustomerMutation['addNoteToCustomer'];
}

export namespace UpdateCustomerNote {
export type Variables = UpdateCustomerNoteMutationVariables;
export type Mutation = UpdateCustomerNoteMutation;
export type UpdateCustomerNote = UpdateCustomerNoteMutation['updateCustomerNote'];
}

export namespace DeleteCustomerNote {
export type Variables = DeleteCustomerNoteMutationVariables;
export type Mutation = DeleteCustomerNoteMutation;
export type DeleteCustomerNote = DeleteCustomerNoteMutation['deleteCustomerNote'];
}

export namespace FacetValue {
export type Fragment = FacetValueFragment;
export type Translations = (NonNullable<FacetValueFragment['translations'][0]>);
Expand Down Expand Up @@ -7148,6 +7212,18 @@ export namespace AddNoteToOrder {
export type AddNoteToOrder = AddNoteToOrderMutation['addNoteToOrder'];
}

export namespace UpdateOrderNote {
export type Variables = UpdateOrderNoteMutationVariables;
export type Mutation = UpdateOrderNoteMutation;
export type UpdateOrderNote = UpdateOrderNoteMutation['updateOrderNote'];
}

export namespace DeleteOrderNote {
export type Variables = DeleteOrderNoteMutationVariables;
export type Mutation = DeleteOrderNoteMutation;
export type DeleteOrderNote = DeleteOrderNoteMutation['deleteOrderNote'];
}

export namespace Asset {
export type Fragment = AssetFragment;
export type FocalPoint = (NonNullable<AssetFragment['focalPoint']>);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -246,3 +246,22 @@ export const ADD_NOTE_TO_CUSTOMER = gql`
}
}
`;

export const UPDATE_CUSTOMER_NOTE = gql`
mutation UpdateCustomerNote($input: UpdateCustomerNoteInput!) {
updateCustomerNote(input: $input) {
id
data
isPublic
}
}
`;

export const DELETE_CUSTOMER_NOTE = gql`
mutation DeleteCustomerNote($id: ID!) {
deleteCustomerNote(id: $id) {
result
message
}
}
`;
Original file line number Diff line number Diff line change
Expand Up @@ -268,3 +268,22 @@ export const ADD_NOTE_TO_ORDER = gql`
}
}
`;

export const UPDATE_ORDER_NOTE = gql`
mutation UpdateOrderNote($input: UpdateOrderNoteInput!) {
updateOrderNote(input: $input) {
id
data
isPublic
}
}
`;

export const DELETE_ORDER_NOTE = gql`
mutation DeleteOrderNote($id: ID!) {
deleteOrderNote(id: $id) {
result
message
}
}
`;
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {
CustomerGroupListOptions,
CustomerListOptions,
DeleteCustomerGroup,
DeleteCustomerNote,
GetCustomer,
GetCustomerGroups,
GetCustomerGroupWithCustomers,
Expand All @@ -24,6 +25,8 @@ import {
UpdateCustomerGroup,
UpdateCustomerGroupInput,
UpdateCustomerInput,
UpdateCustomerNote,
UpdateCustomerNoteInput,
} from '../../common/generated-types';
import {
ADD_CUSTOMERS_TO_GROUP,
Expand All @@ -32,6 +35,7 @@ import {
CREATE_CUSTOMER_ADDRESS,
CREATE_CUSTOMER_GROUP,
DELETE_CUSTOMER_GROUP,
DELETE_CUSTOMER_NOTE,
GET_CUSTOMER,
GET_CUSTOMER_GROUP_WITH_CUSTOMERS,
GET_CUSTOMER_GROUPS,
Expand All @@ -41,6 +45,7 @@ import {
UPDATE_CUSTOMER,
UPDATE_CUSTOMER_ADDRESS,
UPDATE_CUSTOMER_GROUP,
UPDATE_CUSTOMER_NOTE,
} from '../definitions/customer-definitions';

import { BaseDataService } from './base-data.service';
Expand Down Expand Up @@ -201,4 +206,22 @@ export class CustomerDataService {
},
);
}

updateCustomerNote(input: UpdateCustomerNoteInput) {
return this.baseDataService.mutate<UpdateCustomerNote.Mutation, UpdateCustomerNote.Variables>(
UPDATE_CUSTOMER_NOTE,
{
input,
},
);
}

deleteCustomerNote(id: string) {
return this.baseDataService.mutate<DeleteCustomerNote.Mutation, DeleteCustomerNote.Variables>(
DELETE_CUSTOMER_NOTE,
{
id,
},
);
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import {
CancelOrder,
CancelOrderInput,
CreateFulfillment,
DeleteOrderNote,
FulfillOrderInput,
GetOrder,
GetOrderHistory,
Expand All @@ -14,17 +15,21 @@ import {
SettlePayment,
SettleRefund,
SettleRefundInput,
UpdateOrderNote,
UpdateOrderNoteInput,
} from '../../common/generated-types';
import {
ADD_NOTE_TO_ORDER,
CANCEL_ORDER,
CREATE_FULFILLMENT,
DELETE_ORDER_NOTE,
GET_ORDER,
GET_ORDER_HISTORY,
GET_ORDERS_LIST,
REFUND_ORDER,
SETTLE_PAYMENT,
SETTLE_REFUND,
UPDATE_ORDER_NOTE,
} from '../definitions/order-definitions';

import { BaseDataService } from './base-data.service';
Expand Down Expand Up @@ -96,4 +101,22 @@ export class OrderDataService {
},
);
}

updateOrderNote(input: UpdateOrderNoteInput) {
return this.baseDataService.mutate<UpdateOrderNote.Mutation, UpdateOrderNote.Variables>(
UPDATE_ORDER_NOTE,
{
input,
},
);
}

deleteOrderNote(id: string) {
return this.baseDataService.mutate<DeleteOrderNote.Mutation, DeleteOrderNote.Variables>(
DELETE_ORDER_NOTE,
{
id,
},
);
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
<ng-template vdrDialogTitle>
{{ 'common.edit-note' | translate }}
</ng-template>

<textarea [(ngModel)]="note" name="note" class="note"></textarea>
<div class="visibility-select" *ngIf="displayPrivacyControls">
<clr-checkbox-wrapper>
<input type="checkbox" clrCheckbox [(ngModel)]="noteIsPrivate" />
<label>{{ 'order.note-is-private' | translate }}</label>
</clr-checkbox-wrapper>
<span *ngIf="noteIsPrivate" class="private">
{{ 'order.note-only-visible-to-administrators' | translate }}
</span>
<span *ngIf="!noteIsPrivate" class="public">
{{ 'order.note-visible-to-customer' | translate }}
</span>
</div>
<ng-template vdrDialogButtons>
<button type="button" class="btn" (click)="cancel()">{{ 'common.cancel' | translate }}</button>
<button type="submit" (click)="confirm()" class="btn btn-primary" [disabled]="note.length === 0">
{{ 'common.confirm' | translate }}
</button>
</ng-template>
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
@import "variables";

.visibility-select {
display: flex;
justify-content: space-between;
align-items: baseline;
.public {
color: $color-warning-500;
}
.private {
color: $color-success-500;
}
}
textarea.note {
width: 100%;
height: 72px;
border-radius: 3px;
margin-right: 6px;
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
import { Dialog } from '@vendure/admin-ui/core';

@Component({
selector: 'vdr-edit-note-dialog',
templateUrl: './edit-note-dialog.component.html',
styleUrls: ['./edit-note-dialog.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class EditNoteDialogComponent implements Dialog<{ note: string; isPrivate?: boolean }> {
displayPrivacyControls = true;
noteIsPrivate = true;
note = '';
resolveWith: (result?: { note: string; isPrivate?: boolean }) => void;

confirm() {
this.resolveWith({
note: this.note,
isPrivate: this.noteIsPrivate,
});
}

cancel() {
this.resolveWith();
}
}
2 changes: 2 additions & 0 deletions packages/admin-ui/src/lib/core/src/shared/shared.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ import { DropdownItemDirective } from './components/dropdown/dropdown-item.direc
import { DropdownMenuComponent } from './components/dropdown/dropdown-menu.component';
import { DropdownTriggerDirective } from './components/dropdown/dropdown-trigger.directive';
import { DropdownComponent } from './components/dropdown/dropdown.component';
import { EditNoteDialogComponent } from './components/edit-note-dialog/edit-note-dialog.component';
import { EmptyPlaceholderComponent } from './components/empty-placeholder/empty-placeholder.component';
import { EntityInfoComponent } from './components/entity-info/entity-info.component';
import { ExtensionHostComponent } from './components/extension-host/extension-host.component';
Expand Down Expand Up @@ -170,6 +171,7 @@ const DECLARATIONS = [
EmptyPlaceholderComponent,
TimelineEntryComponent,
HistoryEntryDetailComponent,
EditNoteDialogComponent,
];

@NgModule({
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -143,6 +143,12 @@ <h3>{{ 'customer.orders' | translate }}</h3>
</div>
<div class="clr-row" *ngIf="!(isNew$ | async)">
<div class="clr-col-md-6">
<vdr-customer-history [customer]="entity$ | async" [history]="history$ | async" (addNote)="addNoteToCustomer($event)"></vdr-customer-history>
<vdr-customer-history
[customer]="entity$ | async"
[history]="history$ | async"
(addNote)="addNoteToCustomer($event)"
(updateNote)="updateNote($event)"
(deleteNote)="deleteNote($event)"
></vdr-customer-history>
</div>
</div>
Loading

0 comments on commit ef5eddf

Please sign in to comment.