Use json endpoint for showing address with Vuejs Components (WIP)

src/Bundle/ChillPersonBundle/Resources/views/Address/list.html.twig

@@ -23,9 +23,9 @@
 {% block title %}{{ 'Addresses\'history for %name%'|trans({ '%name%': person.firstName ~ ' ' ~ person.lastName } ) }}{% endblock %}
 
 {% block personcontent %}
-    
+
     <h1>{{ 'Addresses\'history for %name%'|trans({ '%name%': person.firstName ~ ' ' ~ person.lastName } ) }}</h1>
-    
+
     <table class="records_list">
         <thead>
             <tr>
@@ -48,11 +48,11 @@
             {% for address in person.addresses %}
             <tr>
                 <td><strong>{{ 'Since %date%'|trans( { '%date%' : address.validFrom|format_date('long') } ) }}</strong></td>
-                
+
                 <td>
                 {{ address_macros._render(address, { 'with_valid_from' : false, 'has_no_address': true } ) }}
                 </td>
-                
+
                 <td>
                     <ul class="record_actions">
                         <li>
@@ -61,11 +61,26 @@
                     </ul>
                 </td>
             </tr>
+
+
+            <div id="address"></div>
+
+            {{ encore_entry_script_tags('address') }}
+
+            <script type="text/javascript">
+                window.addressId = {{ address.id|e('js') }};
+            </script>
+
             {% endfor %}
             {% endif %}
         </tbody>
     </table>
-        
+
+
+
+
+
+
         <ul class="record_actions">
             <li class="cancel">
                 <a href="{{ path('chill_person_view', { 'person_id' : person.id } ) }}" class="sc-button bt-cancel">
@@ -73,10 +88,11 @@
                     </a>
             </li>
             <li>
+
                 <a href="{{ path('chill_person_address_new', { 'person_id' : person.id } ) }}" class="sc-button bt-create">
                         {{ 'Add an address'|trans }}
                     </a>
             </li>
         </ul>
-    
-{% endblock personcontent %}
+
+{% endblock personcontent %}