Merge pull request #497 from dod-ccpo/v-cloak

Prevent Vue from Loading Variables Before Evaluation

templates/audit_log/audit_log.html

@@ -3,7 +3,7 @@
 
 {% block content %}
 
-
+  <div v-cloak>
     <section class="block-list">
       <header class="block-list__header">
         <h1 class="block-list__title">Activity History</h1>
@@ -18,8 +18,8 @@
           </li>
         {% endfor %}
       </ul>
-
     </section>
 
     {{ Pagination(audit_events, 'atst.activity_history') }}
+  </div>
 {% endblock %}

templates/requests/index.html

@@ -75,7 +75,7 @@
     </div>
   {% endif %}
 
-  <div class="col col--grow">
+  <div v-cloak class="col col--grow">
 
     {% if extended_view %}
       <form @submit.prevent class='search-bar'>
@@ -109,7 +109,7 @@
       </form>
     {% endif %}
 
-    <div class='responsive-table-wrapper'>
+    <div v-cloak class='responsive-table-wrapper'>
       <table v-if="filteredRequests.length">
         <thead>
           <tr>

templates/workspaces/index.html

@@ -1,7 +1,7 @@
 {% extends "base.html" %}
 
 {% block content %}
-<div class='col'>
+<div v-cloak class='col'>
   <table>
     <thead>
       <tr>

templates/workspaces/projects/index.html

@@ -21,7 +21,7 @@
 {% else %}
 
   {% for project in workspace.projects %}
-    <div class='block-list project-list-item'>
+    <div v-cloak class='block-list project-list-item'>
       <header class='block-list__header'>
         <h2 class='block-list__title'>{{ project.name }} ({{ project.environments|length }} environments)</h2>
         {% if user_can(permissions.RENAME_APPLICATION_IN_WORKSPACE) %}

templates/workspaces/reports/index.html

@@ -13,7 +13,7 @@
       {"label": "Learn More", "href": url_for('atst.helpdocs'), "icon": "info"}
     ]  ) }}
 
-  <div class='funding-summary-row'>
+  <div v-cloak class='funding-summary-row'>
 
     <div class='funding-summary-row__col'>
       <div class='panel spend-summary'>
@@ -131,6 +131,7 @@
   {% else %}
 
     <budget-chart
+      v-cloak
       budget={{ budget }}
       current-month='{{ current_month_index }}'
       expiration-date='{{ expiration_date }}'