multiple po and invoice fix

resources/assets/js/pages/admin/booking/uploadInvoice.vue

@@ -58,10 +58,13 @@
           </div>
           <el-row :gutter="12" type="flex">
             <el-col :span="12" align="center">
-              <a target="_blank" :href="getURL(booking_details.user_po_path)">
-                <img v-if="isImage(booking_details.user_po_path)" v-bind:src="booking_details.user_po_path" class="image">
+              <div v-for="po in booking_details.user_po_path" :key='po'>
+                <a target="_blank" :href="getURL(po)">
+                  <img v-if="isImage(po)" v-bind:src="po" class="image" style="max-width: 100%">
                   <p v-else>Download</p>
+                  <br/>
                 </a>
+              </div>
             </el-col>
           </el-row>
         </el-card>
@@ -431,7 +434,8 @@
       },
       // TODO : refactor into library since many pages are using this 
       getExtension(path){
-       return path.slice(-3);
+          let index = path.lastIndexOf('.') + 1;
+          return path.slice(index);
       },
       isImage(path){
           var ext = this.getExtension(path);