Don't display cloud migration questions until an answer is selected

js/components/forms/details_of_use.js

@@ -37,6 +37,9 @@ export default {
       const monthlySpend = this.estimated_monthly_spend || 0
       return monthlySpend * 12
     },
+    jediMigrationOptionSelected: function () {
+      return this.jedi_migration !== ''
+    },
     isJediMigration: function () {
       return this.jedi_migration === 'yes'
     }

templates/requests/screen-1.html

@@ -17,7 +17,7 @@
   ) }}
 {% endif %}
 
-<details-of-use inline-template v-bind:initial-data='{{ f.data }}'>
+<details-of-use inline-template v-bind:initial-data='{{ f.data|tojson }}'>
   <div>
 
     <p>We’d like to know a little about how you plan to use JEDI Cloud services to process your request. Please answer the following questions to the best of your ability. Note that the CCPO does not directly help with migrating systems to JEDI Cloud. These questions are for learning about your cloud readiness and financial usage of the JEDI Cloud; your estimates will not be used for any department level reporting.</p>
@@ -30,6 +30,7 @@
     <h2>Cloud Readiness</h2>
     {{ TextInput(f.num_software_systems, validation='integer') }}
     {{ OptionsInput(f.jedi_migration) }}
+    <template v-if="jediMigrationOptionSelected">
       <template v-if='isJediMigration' v-cloak>
         {{ OptionsInput(f.rationalization_software_systems) }}
         {{ OptionsInput(f.technical_support_team) }}
@@ -37,8 +38,11 @@
         {{ OptionsInput(f.engineering_assessment) }}
         {{ OptionsInput(f.data_transfers) }}
         {{ OptionsInput(f.expected_completion_date) }}
+      </template>
+      <template v-else-if='!isJediMigration' v-cloak>
         {{ OptionsInput(f.cloud_native) }}
       </template>
+    </template>
 
     <h2>Financial Usage</h2>
     {{ TextInput(f.estimated_monthly_spend, validation='dollars') }}