added loading for upload user bankinslip

resources/assets/js/pages/booking/uploadUserBankSlip.vue

@@ -64,7 +64,7 @@
           </el-form-item>
           <el-form-item>
               <div align="center">
-              <el-button type="primary" @click="submitUserSlip('user_slip_form')">Submit</el-button>
+              <el-button type="primary" :loading="loading" @click="submitUserSlip('user_slip_form')">Submit</el-button>
               <router-link :to="{ name: 'home' }" class="small ml-auto my-auto">
                 Upload Later
               </router-link>
@@ -103,6 +103,7 @@
       return {
         status: 2,
         start: false,
+        loading: false,
         dialogImageUrl: '',
         dialogVisible: false,
         booking_id: this.$route.params.id,
@@ -157,6 +158,7 @@
         this.dialogVisible = true
       },
       submitUserSlip(formName) {
+         this.loading = true
          this.$refs[formName].validate((valid) => {
           if (valid) {
             let newConfirmation = {
@@ -165,6 +167,7 @@
             }
           }
           else{
+            this.loading = false
             return
           }
           });
@@ -173,12 +176,14 @@
         }
         axios.patch('/api/booking/'+ this.booking_id +'/bankslip-amount', newUserSlip)
           .then((response) => {
+          
             this.$message({
               showClose: true,
               message: 'Your bankinslip has been submitted, please wait admin to approve.',
               type: 'success',
               duration: 5000,
             });
+            
             console.log(response)
              this.$router.push({
               name: 'home'
@@ -186,6 +191,7 @@
 
           })
           .catch((error) => {
+            this.loading = false
             this.$message({
               showClose: true,
               message: 'Please upload your bankin slip first.',