Merge pull request #578 from dod-ccpo/dod-id-toggle

DOD ID Toggle Fixes

js/components/forms/oversight.js

@@ -2,6 +2,47 @@ import FormMixin from '../../mixins/form'
 import textinput from '../text_input'
 import checkboxinput from '../checkbox_input'
 
+const dodid = {
+  name: 'dodid',
+
+  mixins: [FormMixin],
+
+  components: {
+    textinput,
+  },
+
+  props: {
+    initialInvite: Boolean,
+  },
+
+  data: function() {
+    return {
+      invite: this.initialInvite,
+    }
+  },
+}
+
+const cordata = {
+  name: 'cordata',
+
+  mixins: [FormMixin],
+
+  components: {
+    textinput,
+    checkboxinput,
+  },
+
+  props: {
+    initialCorInvite: Boolean,
+  },
+
+  data: function() {
+    return {
+      cor_invite: this.initialCorInvite,
+    }
+  },
+}
+
 export default {
   name: 'oversight',
 
@@ -10,6 +51,8 @@ export default {
   components: {
     textinput,
     checkboxinput,
+    cordata,
+    dodid,
   },
 
   props: {

templates/task_orders/new/oversight.html

@@ -17,22 +17,29 @@
     <div class='usa-input'>
         {{ UserInfo(form.ko_first_name, form.ko_last_name, form.ko_email, form.ko_phone_number) }}
         {{ CheckboxInput(form.ko_invite) }}
-        <template v-if="ko_invite">
+        <keep-alive>
-            {{ TextInput(form.ko_dod_id, placeholder="1234567890", tooltip="Why", tooltip_title='Why', validation='dodId', classes="task-order__invite-officer")}}
+            <dodid v-bind:initial-invite="invite" inline-template v-if="ko_invite">
-        </template>
+                {{ TextInput(form.ko_dod_id, placeholder="1234567890", tooltip="Why", tooltip_title='Why', validation='dodId', classes="task-order__invite-officer")}}
+            </dodid>
+        </keep-alive>
 
         <hr />
 
         <h3 class="subheading">{{ "task_orders.new.oversight.cor_info_title" | translate }}</h3>
         <p>{{ "task_orders.new.oversight.cor_info_paragraph" | translate }}</p>
         {{ CheckboxInput(form.am_cor, classes="normal") }}
-        <template v-if="!am_cor">
+
-            {{ UserInfo(form.cor_first_name, form.cor_last_name, form.cor_email, form.cor_phone_number) }}
+        <keep-alive>
-            {{ CheckboxInput(form.cor_invite) }}
+            <cordata v-bind:initial-cor-invite="cor_invite" inline-template v-if="!am_cor">
-            <template v-if="cor_invite">
+                <div>
-                {{ TextInput(form.cor_dod_id, placeholder="1234567890", tooltip="Why", tooltip_title='Why', validation='dodId', classes="task-order__invite-officer")}}
+                {{ UserInfo(form.cor_first_name, form.cor_last_name, form.cor_email, form.cor_phone_number) }}
-            </template>
+                {{ CheckboxInput(form.cor_invite) }}
-        </template>
+                <template v-if="cor_invite">
+                    {{ TextInput(form.cor_dod_id, placeholder="1234567890", tooltip="Why", tooltip_title='Why', validation='dodId', classes="task-order__invite-officer")}}
+                </template>
+                </div>
+            </cordata>
+        </keep-alive>
 
         <hr />
 
@@ -40,9 +47,11 @@
         <p>{{ "task_orders.new.oversight.so_info_paragraph" | translate }}</p>
         {{ UserInfo(form.so_first_name, form.so_last_name, form.so_email, form.so_phone_number) }}
         {{ CheckboxInput(form.so_invite) }}
-        <template v-if="so_invite">
+        <keep-alive>
-            {{ TextInput(form.so_dod_id, placeholder="1234567890", tooltip="Why", tooltip_title='Why', validation='dodId', classes="task-order__invite-officer")}}
+            <dodid v-bind:initial-invite="invite" inline-template v-if="so_invite">
-        </template>
+                {{ TextInput(form.so_dod_id, placeholder="1234567890", tooltip="Why", tooltip_title='Why', validation='dodId', classes="task-order__invite-officer")}}
+            </dodid>
+        </keep-alive>
     </div>
 </oversight>