Merge pull request #15 from samply/feature/configuration-boxes

Feature/configuration boxes
samply · Dec 20, 2024 · cc76b17 · cc76b17
2 parents d0b091f + 16af9aa
commit cc76b17
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 17 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,7 +4,7 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/)
 and this project adheres to [Semantic Versioning](http://semver.org/).
 
-## [1.1.0 - 2024-12-19]
+## [1.1.0 - 2024-12-20]
 ### Added
 - Dockerfile
 - Single Spa
@@ -81,6 +81,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 - Archive button requires message too
 - Current User in Project View
 - Press create button only if mandatory fields are not empty
+- Missing fields list as todo
 
 ### Changed
 - Rename accept and reject bridgehead state buttons (authorize/revoke)

diff --git a/src/components/ProjectFieldRow.vue b/src/components/ProjectFieldRow.vue
@@ -313,15 +313,17 @@ export default class ProjectFieldRow extends Vue {
                 @click="editedValue[0]=step;saveField()"
                 style="background: none; border:none; color: black; padding:0; height:100%;min-width: fit-content">
           <div style="height:100%; display: flex; flex-direction: column;">
-            <div class="config-box-header">{{ step }}</div>
+            <div class="config-box-header">{{ configurations?.get(step)?.label }}</div>
             <div class="config-box-body">
               <table class="config-box-table" v-if="configurations">
+                <tr><td colspan="2">{{ configurations?.get(step)?.description }}</td></tr>
+                <tr><td colspan="2">&nbsp;</td></tr>
                 <tr v-for="(param, key) in configurations.get(step)" :key="key">
-                  <template v-if="key !== 'customConfig'">
+                  <!--<template v-if="key as string !== 'customConfig'">-->
+                  <template v-if="!['customConfig', 'label', 'description'].includes(key as string)">
                     <td style="font-weight: bold">{{configLabel[key]}}:</td>
-                    <td class="truncate-15" v-b-tooltip.hover :title="param">{{param}}</td>
+                    <td class="truncate-15" v-b-tooltip.hover :title="param as string">{{param}}</td>
                   </template>
-                  <td v-else style="font-weight: bold">CUSTOM</td>
                 </tr>
               </table>
             </div>
@@ -634,8 +636,8 @@ export default class ProjectFieldRow extends Vue {
   margin: 10px;
   border: 1px solid #0000001E;
   border-radius: 10px;
-  min-width: 170px;
-  font-size: 14px;
+  min-width: 270px;
+  font-size: 20px;
 }
 .config-box.active {
   box-shadow: 0px 2px 1px -1px rgba(149, 200, 220, 0.8),0px 1px 1px 0px rgba(149, 200, 220, 0.5),0px 1px 3px 0px rgba(149, 200, 220, 0.3);

diff --git a/src/components/ProjectView.vue b/src/components/ProjectView.vue
@@ -526,11 +526,11 @@ export default defineComponent({
         result = this.addMissingField(result, 'template id', this.project.templateId);
         result = this.addMissingField(result, 'application form', this.existsApplicationForm);
       }
-      return (result.length > 0) ? 'Missing fields: ' + result : result;
+      return (result.length > 0) ? 'missing fields: ' + result : result;
     },
 
     addMissingField(result: string, field: string, value: any): string{
-      return (!value) ? ((result.length > 0) ? ', ' : '') + field : result;
+      return (!value) ? result + ((result.length > 0) ? ', ' : '') + field : result;
     },
 
     convertDate(date: Date) {
@@ -747,6 +747,13 @@ export default defineComponent({
             message: "Please check all of the fields in the summary and click 'Create' if everything seems OK."
           });
           count ++;
+          if (this.tooltipTextForCreateButton?.length > 0){
+            extendedExplanations.set(count.toString(), {
+              number: count,
+              message: 'To proceed with creating the project, kindly fill in the following ' + this.tooltipTextForCreateButton
+            });
+            count ++;
+          }
         }
       }
       if (this.projectRoles?.includes(ProjectRole.BRIDGEHEAD_ADMIN) &&
@@ -804,6 +811,14 @@ export default defineComponent({
           transformForSending: (humanReadable: string) => this.allBridgeheads.find(bridgehead => bridgehead.humanReadable === humanReadable)?.bridgehead || humanReadable,
           visibilityCondition: !this.existsDraftDialog || this.draftDialogCurrentStep == 0 || this.draftDialogCurrentStep == 4
         },
+        {
+          fieldKey: "Type",
+          fieldValue: [this.project?.type],
+          editProjectParam: [EditProjectParam.PROJECT_TYPE],
+          isEditable: this.isNotIncludedInCurrentProjectConfiguration('type'),
+          possibleValues: this.projectTypes,
+          visibilityCondition: !this.existsDraftDialog || this.draftDialogCurrentStep == 1 || this.draftDialogCurrentStep == 4
+        },
         {
           fieldKey: "Configuration",
           fieldValue: [this.currentProjectConfiguration],
@@ -813,14 +828,6 @@ export default defineComponent({
           configurations: this.projectConfigurations,
           visibilityCondition: !this.existsDraftDialog || this.draftDialogCurrentStep == 1 || this.draftDialogCurrentStep == 4
         },
-        {
-          fieldKey: "Type",
-          fieldValue: [this.project?.type],
-          editProjectParam: [EditProjectParam.PROJECT_TYPE],
-          isEditable: this.isNotIncludedInCurrentProjectConfiguration('type'),
-          possibleValues: this.projectTypes,
-          visibilityCondition: !this.existsDraftDialog || this.draftDialogCurrentStep == 1 || this.draftDialogCurrentStep == 4
-        },
         {
           fieldKey: "Query",
           fieldValue: [this.project?.humanReadable, this.project?.query],