New TotalsBox vue component

- update to_form data when CLIN amounts change

templates/task_orders/edit.html

@@ -384,6 +384,25 @@
             </div>
             {{ TotalsBox(task_order=task_order) }}
           </div>
+
+          <totals-box
+            inline-template
+            v-bind:additional-obligated='additionalObligatedAmount'
+            v-bind:additional-contract-amount='totalClinAmount'
+            >
+            <div class="col totals-box">
+                <div class="h4">Total obligated funds</div>
+                <div class="h3">!{ obligated }</div>
+                <div>This is the funding allocated to cloud services. It may be 100% or a portion of the total task order budget.</div>
+
+                <hr>
+
+                <div class="h4">Total contract amount</div>
+                <div class="h3">!{ contractAmount }</div>
+              <div>This is the value of all funds obligated for this contract, including -- but not limited to -- funds obligated for the cloud.</div>
+            </div>
+          </totals-box>
+
         </div>
       </div>
     </to-form>