fix(admin-ui): Improve display of OrderLine custom fields in form

vendure-ecommerce · Feb 12, 2025 · 4e92d85 · 4e92d85
1 parent 4595b40
commit 4e92d85
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 18 deletions.
diff --git a/...r/src/components/draft-order-variant-selector/draft-order-variant-selector.component.html b/...r/src/components/draft-order-variant-selector/draft-order-variant-selector.component.html
@@ -39,14 +39,11 @@ <h4 class="card-title">{{ 'order.add-item-to-order' | translate }}</h4>
             </button>
         </div>
         <ng-container *ngIf="orderLineCustomFields.length">
-            <div class="custom-field" *ngFor="let field of orderLineCustomFields">
-                <vdr-custom-field-control
-                    [compact]="true"
-                    [readonly]="false"
-                    [customField]="field"
-                    [customFieldsFormGroup]="customFieldsFormGroup"
-                ></vdr-custom-field-control>
-            </div>
+            <vdr-tabbed-custom-fields
+                entityName="Order"
+                [customFields]="orderLineCustomFields"
+                [customFieldsFormGroup]="customFieldsFormGroup"
+            ></vdr-tabbed-custom-fields>
         </ng-container>
     </div>
 </div>
diff --git a/packages/admin-ui/src/lib/order/src/components/order-editor/order-editor.component.html b/packages/admin-ui/src/lib/order/src/components/order-editor/order-editor.component.html
@@ -231,16 +231,12 @@
                             </div>
                         </div>
                     </div>
-                    <div class="form-grid" *ngIf="addItemSelectedVariant">
-                        <ng-container *ngFor="let customField of orderLineCustomFields">
-                            <vdr-custom-field-control
-                                [readonly]="!addItemSelectedVariant"
-                                [customField]="customField"
-                                [customFieldsFormGroup]="addItemCustomFieldsForm"
-                                entityName="OrderLine"
-                                [compact]="true"
-                            ></vdr-custom-field-control>
-                        </ng-container>
+                    <div *ngIf="addItemSelectedVariant">
+                        <vdr-tabbed-custom-fields
+                            entityName="Order"
+                            [customFields]="orderLineCustomFields"
+                            [customFieldsFormGroup]="addItemCustomFieldsForm"
+                        ></vdr-tabbed-custom-fields>
                     </div>
                 </div>
                 <div class="flex-spacer"></div>