diff --git a/resources/assets/vue/components/orders/forms/TaxRebateQrCodeFormComponent.vue b/resources/assets/vue/components/orders/forms/TaxRebateQrCodeFormComponent.vue
index 5661128e..c1a86c45 100644
--- a/resources/assets/vue/components/orders/forms/TaxRebateQrCodeFormComponent.vue
+++ b/resources/assets/vue/components/orders/forms/TaxRebateQrCodeFormComponent.vue
@@ -2,86 +2,90 @@
     <div class="row">
         <div class="col bg-white padding-40 b-rad-lg">
             <!-- List QR Code -->
-            <div v-if="step === 'list_qr'">
-                <div class="row">
-                    <div class="col">
-                        <div class="justify-content-between d-flex">
-                            <h3>List Of Tax Rebate QR Code</h3>
-                            <i class="fa fa-times pointer fs-16 text-black" @click="resetSteps()"></i>
-                        </div>
-                        <div class="row">
-                            <div v-for="i in data.supplier_tax_rebate" :key="i.id" class="col-12 col-md-4 p-t-10 p-b-10">
-                                <div class="padding-20 bg-master-lightest rounded-lg b-a b-grey d-flex flex-column h-100">
-                                    <a @click="download(i)" target="_blank">
-                                        <div class="peelable-corner overflow-hidden relative text-center">
-                                            <img :src="$qr_code_img_url + i.reference_number" class="w-100" style="width: 150px; height: 150px; max-width: 150px; max-height: 150px;">
-                                        </div>
-                                    </a>
-                                    <div class="m-t-15">
-                                        <template v-for="(label, field) in fields">
-                                            <div class="block m-b-5">
-                                                <small class="fs-10 all-caps muted">{{ label }}</small>
-                                                <h6 class="no-margin small text-break overflow-wrap m-b-15">{{ i[field] }}</h6>
+            <loading-component v-if="isLoading" style="height: 200px; top: 0;" key="1" color="success"></loading-component>
+
+            <div v-else>
+                <div v-if="step === 'list_qr'">
+                    <div class="row">
+                        <div class="col">
+                            <div class="justify-content-between d-flex">
+                                <h3>List Of Tax Rebate QR Code</h3>
+                                <i class="fa fa-times pointer fs-16 text-black" @click="resetSteps()"></i>
+                            </div>
+                            <div class="row">
+                                <div v-for="i in data.supplier_tax_rebate" :key="i.id" class="col-12 col-md-4 p-t-10 p-b-10">
+                                    <div class="padding-20 bg-master-lightest rounded-lg b-a b-grey d-flex flex-column h-100">
+                                        <a @click="download(i)" target="_blank">
+                                            <div class="peelable-corner overflow-hidden relative text-center">
+                                                <img :src="$qr_code_img_url + i.reference_number" class="w-100" style="width: 150px; height: 150px; max-width: 150px; max-height: 150px;">
                                             </div>
-                                        </template>
+                                        </a>
+                                        <div class="m-t-15">
+                                            <template v-for="(label, field) in fields">
+                                                <div class="block m-b-5">
+                                                    <small class="fs-10 all-caps muted">{{ label }}</small>
+                                                    <h6 class="no-margin small text-break overflow-wrap m-b-15">{{ i[field] }}</h6>
+                                                </div>
+                                            </template>
+                                        </div>
                                     </div>
                                 </div>
                             </div>
-                        </div>
-                        <div class="row m-t-30">
-                            <div class="col text-center">
-                                <button class="btn btn-large btn-primary" @click="updateStep('1')">Create New QR Code</button>
+                            <div class="row m-t-30">
+                                <div class="col text-center">
+                                    <button class="btn btn-large btn-primary" @click="updateStep('1')">Create New QR Code</button>
+                                </div>
                             </div>
                         </div>
                     </div>
                 </div>
-            </div>
 
-            <!-- Confirm Creation -->
-            <div v-if="step === '1'">
-                <div class="text-center m-b-30">
-                    <h3>Are you sure you want to create a Tax Rebate QR Code?</h3>
-                    <p>A Tax Rebate QR Code allows suppliers to claim tax rebates. <br>We need some additional information for this
-                        service.
-                    </p>
-                </div>
-                <div class="row m-t-15">
-                    <div class="col p-r-5">
-                        <button class="btn btn-lg btn-default w-100 b-rad-none" @click="resetSteps()">Cancel</button>
+                <!-- Confirm Creation -->
+                <div v-if="step === '1'">
+                    <div class="text-center m-b-30">
+                        <h3>Are you sure you want to create a Tax Rebate QR Code?</h3>
+                        <p>A Tax Rebate QR Code allows suppliers to claim tax rebates. <br>We need some additional information for this
+                            service.
+                        </p>
                     </div>
-                    <div class="col p-l-5">
-                        <button class="btn btn-lg btn-primary w-100" @click="updateStep('create_qr')">Continue</button>
+                    <div class="row m-t-15">
+                        <div class="col p-r-5">
+                            <button class="btn btn-lg btn-default w-100 b-rad-none" @click="resetSteps()">Cancel</button>
+                        </div>
+                        <div class="col p-l-5">
+                            <button class="btn btn-lg btn-primary w-100" @click="updateStep('create_qr')">Continue</button>
+                        </div>
                     </div>
                 </div>
-            </div>
 
-            <!-- Create QR Code Form -->
-            <div v-if="step === 'create_qr'">
-                <div class="text-center m-b-30">
-                    <h3>Create Tax Rebate QR Code?</h3>
-                </div>
-                <div class="row">
-                    <div class="col">
-                        <validation-wrapper-component class="m-b-15" :validator="$v.parameters.supplier_name">
-                            <label class="text-primary">Supplier Name</label>
-                            <input class="form-control" v-model="parameters.supplier_name">
-                        </validation-wrapper-component>
+                <!-- Create QR Code Form -->
+                <div v-if="step === 'create_qr'">
+                    <div class="text-center m-b-30">
+                        <h3>Create Tax Rebate QR Code?</h3>
                     </div>
-                </div>
-                <div class="row">
-                    <div class="col">
-                        <validation-wrapper-component class="m-b-15" :validator="$v.parameters.supplier_contact_number">
-                            <label class="text-primary">Supplier Contact Number</label>
-                            <input class="form-control" v-model="parameters.supplier_contact_number">
-                        </validation-wrapper-component>
+                    <div class="row">
+                        <div class="col">
+                            <validation-wrapper-component class="m-b-15" :validator="$v.parameters.supplier_name">
+                                <label class="text-primary">Supplier Name</label>
+                                <input class="form-control" v-model="parameters.supplier_name">
+                            </validation-wrapper-component>
+                        </div>
                     </div>
-                </div>
-                <div class="row m-t-15">
-                    <div class="col p-r-5">
-                        <button class="btn btn-lg btn-default w-100 b-rad-none" @click="resetSteps()">Cancel</button>
+                    <div class="row">
+                        <div class="col">
+                            <validation-wrapper-component class="m-b-15" :validator="$v.parameters.supplier_contact_number">
+                                <label class="text-primary">Supplier Contact Number</label>
+                                <input class="form-control" v-model="parameters.supplier_contact_number">
+                            </validation-wrapper-component>
+                        </div>
                     </div>
-                    <div class="col p-l-5">
-                        <button class="btn btn-lg btn-primary w-100" @click="create">Create</button>
+                    <div class="row m-t-15">
+                        <div class="col p-r-5">
+                            <button class="btn btn-lg btn-default w-100 b-rad-none" @click="resetSteps()">Cancel</button>
+                        </div>
+                        <div class="col p-l-5">
+                            <button class="btn btn-lg btn-primary w-100" @click="create">Create</button>
+                        </div>
                     </div>
                 </div>
             </div>
@@ -107,7 +111,8 @@ export default {
                 supplier_name: 'Supplier Name',
                 // supplier_contact_number: 'Supplier Contact Number'
                 supplier_contact_number: 'Contact Number'
-            }
+            },
+            isLoading: false,
         };
     },
     validations: {
@@ -128,6 +133,7 @@ export default {
             this.submit(this.route('api.order.tax_rebate.create', this.data.id), 'post', this.section, true, true);
         },
         download(param) {
+            this.isLoading = true;
             let url = route('order.taxt_rebate_qr.download', this.data.id) + '?tax_rebate_refeerence=' + param.reference_number;
             console.log(url);
             if(window.LARAVEL_VAPOR_ENABLED){
@@ -140,6 +146,7 @@ export default {
                             if (response.src) {
                                 // window.location.href = response.src;
                                 window.open(response.src, '_blank');
+                                this.isLoading = false;
                             }
                         });
                     }
@@ -147,6 +154,7 @@ export default {
             }
             else{
                 window.open(url, '_blank');
+                this.isLoading = false;
             }
         },
         resetSteps(order) {