[vue] Use v-for instead of generation for enums

Use v-for instead of generated code for enums for better maintainance Followup of jhipster#16475
swarajsaaj · Oct 3, 2021 · d310c6f · d310c6f
1 parent 8a2e4ed
commit d310c6f
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 9 deletions.
diff --git a/...s/entity-client/templates/vue/src/main/webapp/app/entities/entity-update.component.ts.ejs b/...s/entity-client/templates/vue/src/main/webapp/app/entities/entity-update.component.ts.ejs
@@ -78,6 +78,10 @@ import { I<%= otherEntityAngularName %> } from '@/shared/model/<%= otherEntityMo
 <%_ importEntitiesSeen.push(otherEntityAngularName); } } _%>
 import { I<%= entityAngularName %>, <%= entityAngularName %> } from '@/shared/model/<%= entityModelFileName %>.model';
 import <%= entityAngularName %>Service from './<%= entityFileName %>.service';
+<%_ const enumImports = generateEntityClientEnumImports(fields); _%>
+<%_ enumImports.forEach( (importedPath, importedType) => { _%>
+import { <%- importedType %> } from '<%- importedPath %>';
+<%_ }); _%>
 
 const validations: any = {
   <%= entityInstance %>: {
@@ -148,6 +152,9 @@ export default class <%= entityAngularName %>Update extends <% if (fieldsContain
   public <%= otherEntityNamePlural %> : <% if (otherEntityAngularName === 'User') { %>Array<any><%_ } else { _%>I<%= otherEntityAngularName %>[]<%_ } _%> = [];
   <%_ } _%>
   <%_ entitiesSeen.push(otherEntityAngularName);entitiesSeen.push(otherEntityNamePlural); } } _%>
+  <%_ enumImports.forEach( (importedPath, importedType) => { _%>
+  public <%- _.lowerFirst(importedType) %>Values : string[] = Object.keys(<%- importedType %>);
+  <%_ }); _%>
   public isSaving = false;
   public currentLanguage = '';
 

diff --git a/generators/entity-client/templates/vue/src/main/webapp/app/entities/entity-update.vue.ejs b/generators/entity-client/templates/vue/src/main/webapp/app/entities/entity-update.vue.ejs
@@ -34,12 +34,9 @@ _%>
                         <label class="form-control-label" v-text="$t('<%= translationKey %>')" for="<%= entityFileName %>-<%= fieldName %>"><%= fieldNameHumanized %></label>
   <%_ if (field.fieldIsEnum) { _%>
                         <select class="form-control" name="<%= fieldName %>" :class="{'valid': !$v.<%= entityInstance %>.<%= fieldName %>.$invalid, 'invalid': $v.<%= entityInstance %>.<%= fieldName %>.$invalid }" v-model="$v.<%= entityInstance %>.<%= fieldName %>.$model" id="<%= entityFileName %>-<%= fieldName %>" data-cy="<%= fieldName %>" <% if (field.fieldValidate === true && field.fieldValidateRules.includes('required')) { %> required<% } %>>
-    <%_ const enumPrefix = frontendAppName + '.'+ fieldType;
-      const values = field.enumValues;
-      for (key in values) {
-        const enumValue = values[key]; _%>
-                            <option value="<%= enumValue.name %>" v-bind:label="$t('<%=enumPrefix%>.<%= enumValue.name %>')"><%= enumValue.value %></option>
-    <%_ } _%>
+    <%_ const enumPrefix = frontendAppName + '.'+ fieldType; _%>
+                            <option v-for="<%= _.lowerFirst(fieldName) %> in <%= _.lowerFirst(fieldName)%>Values" v-bind:key="<%= _.lowerFirst(fieldName) %>" v-bind:value="<%= _.lowerFirst(fieldName) %>" v-bind:label="$t('<%= enumPrefix %>.'+<%= _.lowerFirst(fieldName) %>)">{{ <%= fieldName %> }}</option>
+
                         </select>
   <%_ } else { _%>
     <%_ if (field.fieldTypeBinary && !field.blobContentTypeText) { _%>

diff --git a/generators/entity-client/templates/vue/src/main/webapp/app/entities/entity.model.ts.ejs b/generators/entity-client/templates/vue/src/main/webapp/app/entities/entity.model.ts.ejs
@@ -32,7 +32,7 @@ import { <%- importedType %> } from '<%- importedPath %>';
 <%_ }); _%>
 
 <%_ enumImports.forEach( (importedPath, importedType) => { _%>
-import { <%- importedType %> } from '<%- importedPath.replace('app/', '@/'); %>';
+import { <%- importedType %> } from '<%- importedPath %>';
 <%_ }); _%>
 export interface I<%= entityAngularName %> {
     <%_ variablesWithTypes.forEach(variablesWithType => { _%>

diff --git a/...ity-client/templates/vue/src/test/javascript/spec/app/entities/entity.service.spec.ts.ejs b/...ity-client/templates/vue/src/test/javascript/spec/app/entities/entity.service.spec.ts.ejs
@@ -33,7 +33,7 @@ import { <%_ if (fieldsContainLocalDate) { _%>DATE_FORMAT,<%_ } if (fieldsContai
 import <%= entityAngularName %>Service from '@/entities/<%= entityFolderName %>/<%= entityFileName %>.service';
 import { <%= entityAngularName %> } from '@/shared/model/<%= entityModelFileName %>.model';
 <%_ enumImports.forEach( (importedPath, importedType) => { _%>
-import { <%- importedType %> } from '<%- importedPath.replace('app/', '@/') %>';
+import { <%- importedType %> } from '<%- importedPath %>';
 <%_ }); _%>
 
 const error = {

diff --git a/generators/generator-base-private.js b/generators/generator-base-private.js
@@ -995,8 +995,9 @@ module.exports = class JHipsterBasePrivateGenerator extends Generator {
       const fileName = _.kebabCase(field.fieldType);
       if (field.fieldIsEnum && (!uniqueEnums[field.fieldType] || (uniqueEnums[field.fieldType] && field.fieldValues.length !== 0))) {
         const importType = `${field.fieldType}`;
+        const basePath = clientFramework === VUE ? '@' : 'app';
         const modelPath = clientFramework === ANGULAR ? 'entities' : 'shared/model';
-        const importPath = `app/${modelPath}/enumerations/${fileName}.model`;
+        const importPath = `${basePath}/${modelPath}/enumerations/${fileName}.model`;
         uniqueEnums[field.fieldType] = field.fieldType;
         typeImports.set(importType, importPath);
       }