documents

resources/js/Components/PersonInfoGrid.vue

@@ -7,6 +7,7 @@ import { provide, ref, watch } from 'vue';
 import axios from 'axios';
 import PersonUpdateForm from './PersonUpdateForm.vue';
 import AddressCreateForm from './AddressCreateForm.vue';
+import AddressUpdateForm from './AddressUpdateForm.vue';
 import PhoneCreateForm from './PhoneCreateForm.vue';
 import EmailCreateForm from './EmailCreateForm.vue';
 import EmailUpdateForm from './EmailUpdateForm.vue';
@@ -74,8 +75,9 @@ const closeConfirm = () => { confirm.value.show = false; };
 const getMainAddress = (adresses) => {
     const addr = adresses.filter( a => a.type.id === 1 )[0] ?? '';
     if( addr !== '' ){
+        const tail = (addr.post_code && addr.city) ? `, ${addr.post_code} ${addr.city}` : '';
         const country = addr.country !== '' ? ` - ${addr.country}` : '';
-        return addr.address !== '' ? addr.address + country : '';
+        return addr.address !== '' ? (addr.address + tail + country) : '';
     }
     
     return '';
@@ -234,7 +236,9 @@ const getTRRs = (p) => {
                             <button @click="openConfirm('address', address.id, address.address)"><TrashBinIcon size="md" css="text-red-600 hover:text-red-700" /></button>
                         </div>
                     </div>
-                    <p class="text-sm md:text-base leading-7 text-gray-900">{{ address.address }}</p>
+                    <p class="text-sm md:text-base leading-7 text-gray-900">
+                        {{ (address.post_code && address.city) ? `${address.address}, ${address.post_code} ${address.city}` : address.address }}
+                    </p>
                 </div>
             </div>
         </CusTab>
@@ -335,6 +339,13 @@ const getTRRs = (p) => {
         :id="editAddressId"
         :edit="editAddress"
     />
+    <AddressUpdateForm 
+        :show="drawerAddAddress && editAddress"
+        @close="drawerAddAddress = false"
+        :person="person"
+        :types="types.address_types"
+        :id="editAddressId"
+    />
 
     <PhoneCreateForm 
         :show="drawerAddPhone"