feat(admin-ui): Add entity info to detail views

Closes #179
vendure-ecommerce · Oct 4, 2019 · cf604aa · cf604aa
1 parent 818be24
commit cf604aa
Show file tree

Hide file tree

Showing 47 changed files with 266 additions and 70 deletions.
diff --git a/...es/admin-ui/src/app/catalog/components/collection-detail/collection-detail.component.html b/...es/admin-ui/src/app/catalog/components/collection-detail/collection-detail.component.html
@@ -1,5 +1,6 @@
 <vdr-action-bar>
     <vdr-ab-left>
+        <vdr-entity-info [entity]="entity$ | async"></vdr-entity-info>
         <vdr-language-selector
             [disabled]="isNew$ | async"
             [availableLanguageCodes]="availableLanguages$ | async"

diff --git a/packages/admin-ui/src/app/catalog/components/facet-detail/facet-detail.component.html b/packages/admin-ui/src/app/catalog/components/facet-detail/facet-detail.component.html
@@ -1,5 +1,6 @@
 <vdr-action-bar>
     <vdr-ab-left>
+        <vdr-entity-info [entity]="entity$ | async"></vdr-entity-info>
         <vdr-language-selector
             [disabled]="isNew$ | async"
             [availableLanguageCodes]="availableLanguages$ | async"
@@ -92,6 +93,7 @@
         <table class="facet-values-list table" formArrayName="values" *ngIf="0 < getValuesFormArray().length">
             <thead>
                 <tr>
+                    <th></th>
                     <th>{{ 'common.name' | translate }}</th>
                     <th>{{ 'common.code' | translate }}</th>
                     <ng-container *ngFor="let customField of customValueFields">
@@ -103,20 +105,23 @@
             <tbody>
                 <tr
                     class="facet-value"
-                    *ngFor="let value of getValuesFormArray().controls; let i = index"
+                    *ngFor="let value of values$ | async; let i = index"
                     [formGroupName]="i"
                 >
-                    <td>
+                    <td class="align-middle">
+                        <vdr-entity-info [entity]="value"></vdr-entity-info>
+                    </td>
+                    <td class="align-middle">
                         <input
                             type="text"
                             formControlName="name"
                             [readonly]="!('UpdateCatalog' | hasPermission)"
                             (input)="updateValueCode(facet.values[i]?.code, $event.target.value, i)"
                         />
                     </td>
-                    <td><input type="text" formControlName="code" readonly /></td>
+                    <td class="align-middle"><input type="text" formControlName="code" readonly /></td>
                     <ng-container *ngFor="let customField of customValueFields">
-                        <td>
+                        <td class="align-middle">
                             <vdr-custom-field-control
                                 *ngIf="customValueFieldIsSet(i, customField.name)"
                                 entityName="FacetValue"
@@ -126,7 +131,7 @@
                             ></vdr-custom-field-control>
                         </td>
                     </ng-container>
-                    <td>
+                    <td class="align-middle">
                         <vdr-dropdown>
                             <button type="button" class="btn btn-link btn-sm" vdrDropdownTrigger>
                                 {{ 'common.actions' | translate }}

diff --git a/packages/admin-ui/src/app/catalog/components/product-detail/product-detail.component.html b/packages/admin-ui/src/app/catalog/components/product-detail/product-detail.component.html
@@ -1,14 +1,17 @@
 <vdr-action-bar>
     <vdr-ab-left>
-        <clr-toggle-wrapper *vdrIfPermissions="'UpdateCatalog'">
-            <input
-                type="checkbox"
-                clrToggle
-                name="enabled"
-                [formControl]="detailForm.get(['product', 'enabled'])"
-            />
-            <label>{{ 'common.enabled' | translate }}</label>
-        </clr-toggle-wrapper>
+        <div class="flex clr-flex-row">
+            <vdr-entity-info [entity]="entity$ | async"></vdr-entity-info>
+            <clr-toggle-wrapper *vdrIfPermissions="'UpdateCatalog'">
+                <input
+                    type="checkbox"
+                    clrToggle
+                    name="enabled"
+                    [formControl]="detailForm.get(['product', 'enabled'])"
+                />
+                <label>{{ 'common.enabled' | translate }}</label>
+            </clr-toggle-wrapper>
+        </div>
         <vdr-language-selector
             [disabled]="isNew$ | async"
             [availableLanguageCodes]="availableLanguages$ | async"

diff --git a/packages/admin-ui/src/app/catalog/components/product-detail/product-detail.component.scss b/packages/admin-ui/src/app/catalog/components/product-detail/product-detail.component.scss
@@ -9,7 +9,7 @@
 }
 
 vdr-action-bar clr-toggle-wrapper {
-    margin-top: 10px;
+    margin-top: 12px;
 }
 
 .group-name {

diff --git a/...-ui/src/app/catalog/components/product-variants-list/product-variants-list.component.html b/...-ui/src/app/catalog/components/product-variants-list/product-variants-list.component.html
@@ -134,6 +134,7 @@
             </div>
             <div class="card-block">
                 <div class="options-facets">
+                    <vdr-entity-info [entity]="variant"></vdr-entity-info>
                     <div *ngIf="variant.options.length">
                         <div class="options">
                             <vdr-chip

diff --git a/packages/admin-ui/src/app/catalog/providers/routing/collection-resolver.ts b/packages/admin-ui/src/app/catalog/providers/routing/collection-resolver.ts
@@ -12,6 +12,8 @@ export class CollectionResolver extends BaseEntityResolver<Collection.Fragment>
             {
                 __typename: 'Collection' as 'Collection',
                 id: '',
+                createdAt: '',
+                updatedAt: '',
                 languageCode: getDefaultLanguage(),
                 name: '',
                 isPrivate: false,

diff --git a/packages/admin-ui/src/app/catalog/providers/routing/facet-resolver.ts b/packages/admin-ui/src/app/catalog/providers/routing/facet-resolver.ts
@@ -12,11 +12,12 @@ export class FacetResolver extends BaseEntityResolver<FacetWithValues.Fragment>
             {
                 __typename: 'Facet' as 'Facet',
                 id: '',
+                createdAt: '',
+                updatedAt: '',
                 isPrivate: false,
                 languageCode: getDefaultLanguage(),
                 name: '',
                 code: '',
-                updatedAt: '',
                 translations: [],
                 values: [],
             },

diff --git a/packages/admin-ui/src/app/catalog/providers/routing/product-resolver.ts b/packages/admin-ui/src/app/catalog/providers/routing/product-resolver.ts
@@ -12,6 +12,8 @@ export class ProductResolver extends BaseEntityResolver<ProductWithVariants.Frag
             {
                 __typename: 'Product' as 'Product',
                 id: '',
+                createdAt: '',
+                updatedAt: '',
                 enabled: true,
                 languageCode: getDefaultLanguage(),
                 name: '',

diff --git a/packages/admin-ui/src/app/catalog/providers/routing/product-variants-resolver.ts b/packages/admin-ui/src/app/catalog/providers/routing/product-variants-resolver.ts
@@ -11,6 +11,8 @@ export class ProductVariantsResolver extends BaseEntityResolver<GetProductVarian
             {
                 __typename: 'Product' as 'Product',
                 id: '',
+                createdAt: '',
+                updatedAt: '',
                 name: '',
                 optionGroups: [],
                 variants: [],