Browse Source

fix(admin-ui): Use select control for string custom field with options

Fixes #546
Michael Bromley 5 years ago
parent
commit
5c59b67879

+ 7 - 2
packages/admin-ui/src/lib/core/src/shared/dynamic-form-inputs/dynamic-form-input/dynamic-form-input.component.ts

@@ -20,6 +20,7 @@ import {
     ViewContainerRef,
 } from '@angular/core';
 import { ControlValueAccessor, FormArray, FormControl, NG_VALUE_ACCESSOR } from '@angular/forms';
+import { StringCustomFieldConfig } from '@vendure/common/lib/generated-types';
 import { ConfigArgType, CustomFieldType, DefaultFormComponentId } from '@vendure/common/lib/shared-types';
 import { assertNever } from '@vendure/common/lib/shared-utils';
 import { simpleDeepClone } from '@vendure/common/lib/simple-deep-clone';
@@ -289,12 +290,16 @@ export class DynamicFormInputComponent
         const type = argDef?.type as ConfigArgType | CustomFieldType;
         switch (type) {
             case 'string':
-            case 'localeString':
-                if (this.isConfigArgDef(argDef) && argDef.ui?.options) {
+            case 'localeString': {
+                const hasOptions =
+                    !!(this.isConfigArgDef(argDef) && argDef.ui?.options) ||
+                    !!(argDef as StringCustomFieldConfig).options;
+                if (hasOptions) {
                     return { component: 'select-form-input' };
                 } else {
                     return { component: 'text-form-input' };
                 }
+            }
             case 'int':
             case 'float':
                 return { component: 'number-form-input' };

+ 1 - 1
packages/admin-ui/src/lib/core/src/shared/dynamic-form-inputs/select-form-input/select-form-input.component.html

@@ -1,5 +1,5 @@
 <select clrSelect [formControl]="formControl" [vdrDisabled]="readonly">
     <option *ngFor="let option of config.options" [value]="option.value">
-        {{ option.label || option.value }}
+        {{ (option | customFieldLabel) || option.label || option.value }}
     </option>
 </select>

+ 3 - 0
packages/admin-ui/src/lib/core/src/shared/dynamic-form-inputs/select-form-input/select-form-input.component.scss

@@ -0,0 +1,3 @@
+select {
+    width: 100%;
+}