diff --git a/app/Http/Controllers/BookingSupplierController.php b/app/Http/Controllers/BookingSupplierController.php
index 101359b8..f84c2502 100644
--- a/app/Http/Controllers/BookingSupplierController.php
+++ b/app/Http/Controllers/BookingSupplierController.php
@@ -42,11 +42,17 @@ class BookingSupplierController extends Controller
     // TODO : Multiple booking
     public function store(Request $request)
     {
+
         $transfer_amount = $request->input("transfer_amount");
         $supplier_id = $request->input("supplier_id");
         $booking_id = $request->input("booking_id");
         $rate = $request->input('rate');
         $rebate = $request->input('rebate');
+
+        if ($supplierbooking = SupplierBooking::where('book_id', $booking_id)->first()){
+            return response()->json(['success'=>false, 'message'=>'Bad request, please contact support'], 400);
+        }
+
         
         // Calculation
         $amountInRMB = $transfer_amount * $rate;
@@ -72,8 +78,8 @@ class BookingSupplierController extends Controller
         $bookingsupplier->save();
 
         // update booking status 
-		$booking->status = 4;
-		$booking->admin_status = 3; 
+		$booking->status = 5;
+		$booking->admin_status = 4; 
 		$booking->save();
 
         //// one bookingsupplier has many booking
diff --git a/resources/assets/js/pages/admin/booking/supplierBooking.vue b/resources/assets/js/pages/admin/booking/supplierBooking.vue
index a47c37b6..14ccd189 100644
--- a/resources/assets/js/pages/admin/booking/supplierBooking.vue
+++ b/resources/assets/js/pages/admin/booking/supplierBooking.vue
@@ -342,21 +342,20 @@
             axios.post('/api/supplier-booking', newReport)
             .then((response) => {
               this.loading_btn = false
-              console.log(response)
-              // this.bookingConfirmTable.date = response.data.date
-              // this.bookingConfirmTable.marking = response.data.marking
-              // this.bookingConfirmTable.payment_method = response.data.payment_method
-              // this.bookingConfirmTable.amount = response.data.amount
-              // this.bookingConfirmTable.service_charge = response.data.service_charge
-              // this.bookingConfirmTable.rate = response.data.rate
-              // this.bookingConfirmTable.bankin_amount = response.data.bankin_amount
-              // this.bookingConfirmTable.account_name = this.bookingForm.account_name
-              // this.dialogFormVisible = false
-              // this.dialogFormVisible1 = true
+              
+              this.$router.push({
+                name: 'booking.admin.supplier.report',
+                params: {id: this.$route.params.id }
+              })
+              // redirect to supplier report 
+
             })
             .catch((error) => {
               this.loading_btn = false
               console.log(error)
+
+              // TODO : Show error message 
+
             })
 
           } else {
diff --git a/resources/assets/js/pages/admin/booking/supplierReport.vue b/resources/assets/js/pages/admin/booking/supplierReport.vue
index 37196cb3..07e7cfc4 100644
--- a/resources/assets/js/pages/admin/booking/supplierReport.vue
+++ b/resources/assets/js/pages/admin/booking/supplierReport.vue
@@ -1,13 +1,13 @@
 <template>
   <el-main>
-    <progress-track v-model="status"/>
+    <progress-track v-model="status" />
 
     <div align="center">
-      <h4 style="margin-top:5%;">Transfer In Progress</h4>
+      <h4 style="margin-top:5%;"></h4>
       <br>
-      <h5> ETA :  3 days 14 Hours </h5>
+      <h5> Supplier Report</h5>
       <br>
-      <el-button type="primary" @click="$router.go(-1)">Go Back</el-button>
+      <!-- <el-button type="primary" @click="$router.go(-1)">Go Back</el-button> -->
     </div>
     <br>
     <el-row justify="center" align="center">
@@ -16,7 +16,165 @@
           <span>Order Details</span>
           <!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
         </div>
-        <el-row :gutter="12">
+        <div class="el-row" style="margin-left: -6px; margin-right: -6px;">
+          <div class="el-col el-col-12" style="padding-left: 6px; padding-right: 6px;">
+            <div class="el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition" align="center">
+
+              <div class="el-table__body-wrapper is-scrolling-none">
+                <table class="el-table__body" style="width: 400px;" cellspacing="0" cellpadding="0" border="0">
+                  <colgroup>
+                    <col name="el-table_2_column_9" width="200">
+                    <col name="el-table_2_column_10" width="200">
+                  </colgroup>
+                  <tbody>
+                    <tr class="el-table__row">
+                      <td class="el-table_2_column_9 is-right ">
+                        <div class="cell">Order Number :</div>
+                      </td>
+                      <td class="el-table_2_column_10 is-left ">
+                        <div class="cell">{{ booking_details.id }}</div>
+                      </td>
+                    </tr>
+                    <tr class="el-table__row">
+                      <td class="el-table_2_column_9 is-right ">
+                        <div class="cell">Date :</div>
+                      </td>
+                      <td class="el-table_2_column_10 is-left ">
+                        <div class="cell">{{ booking_details.created_at }}</div>
+                      </td>
+                    </tr>
+                    <tr class="el-table__row">
+                      <td class="el-table_2_column_9 is-right ">
+                        <div class="cell">Customer Marking :</div>
+                      </td>
+                      <td class="el-table_2_column_10 is-left ">
+                        <div class="cell">CIEF/150ECE</div>
+                      </td>
+                    </tr>
+                    <tr class="el-table__row">
+                      <td class="el-table_2_column_9 is-right ">
+                        <div class="cell"></div>
+                      </td>
+                      <td class="el-table_2_column_10 is-left ">
+                        <div class="cell"></div>
+                      </td>
+                    </tr>
+                    <tr class="el-table__row">
+                      <td class="el-table_2_column_9 is-right ">
+                        <div class="cell">Term :</div>
+                      </td>
+                      <td class="el-table_2_column_10 is-left ">
+                        <div class="cell">{{ booking_details.term }}</div>
+                      </td>
+                    </tr>
+                    <tr class="el-table__row">
+                      <td class="el-table_2_column_9 is-right ">
+                        <div class="cell"></div>
+                      </td>
+                      <td class="el-table_2_column_10 is-left ">
+                        <div class="cell"></div>
+                      </td>
+                    </tr>
+                    <!---->
+                  </tbody>
+                </table>
+                <!---->
+                <!---->
+              </div>
+              <!---->
+              <!---->
+              <!---->
+              <!---->
+              <div class="el-table__column-resize-proxy" style="display: none;"></div>
+            </div>
+          </div>
+          <div class="el-col el-col-12" style="padding-left: 6px; padding-right: 6px;">
+            <div class="el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition" align="center">
+              <div class="hidden-columns">
+                <div></div>
+                <div></div>
+              </div>
+              <!---->
+              <div class="el-table__body-wrapper is-scrolling-none">
+                <table class="el-table__body" style="width: 400px;" cellspacing="0" cellpadding="0" border="0">
+                  <colgroup>
+                    <col name="el-table_3_column_11" width="200">
+                    <col name="el-table_3_column_12" width="200">
+                  </colgroup>
+                  <tbody>
+                    <tr class="el-table__row">
+                      <td class="el-table_3_column_11 is-right ">
+                        <div class="cell">CNY/RMB :</div>
+                      </td>
+                      <td class="el-table_3_column_12 is-left ">
+                        <div class="cell">CNY {{ booking_details.amount }}</div>
+                      </td>
+                    </tr>
+                    <tr class="el-table__row">
+                      <td class="el-table_3_column_11 is-right ">
+                        <div class="cell">+ Service Charge :</div>
+                      </td>
+                      <td class="el-table_3_column_12 is-left ">
+                        <div class="cell">CNY {{ booking_details.service_charge }}</div>
+                      </td>
+                    </tr>
+                    <tr class="el-table__row">
+                      <td class="el-table_3_column_11 is-right ">
+                        <div class="cell">/ RATE :</div>
+                      </td>
+                      <td class="el-table_3_column_12 is-left ">
+                        <div class="cell">{{ booking_details.rate }}</div>
+                      </td>
+                    </tr>
+                    <tr class="el-table__row">
+                      <td class="el-table_3_column_11 is-right ">
+                        <div class="cell"></div>
+                      </td>
+                      <td class="el-table_3_column_12 is-left ">
+                        <div class="cell">MYR {{ booking_details.bia }}</div>
+                      </td>
+                    </tr>
+                    <!-- <tr class="el-table__row">
+                      <td class="el-table_3_column_11 is-right ">
+                        <div class="cell">+ GST 6% :</div>
+                      </td>
+                      <td class="el-table_3_column_12 is-left ">
+                        <div class="cell">MYR 4,430.88</div>
+                      </td>
+                    </tr> -->
+                    <tr class="el-table__row">
+                      <td class="el-table_3_column_11 is-right ">
+                        <div class="cell"></div>
+                      </td>
+                      <td class="el-table_3_column_12 is-left ">
+                        <div class="cell">
+                          <b>MYR {{ booking_details.bia }}</b>
+                        </div>
+                      </td>
+                    </tr>
+                    <tr class="el-table__row">
+                      <td class="el-table_3_column_11 is-right ">
+                        <div class="cell"></div>
+                      </td>
+                      <td class="el-table_3_column_12 is-left ">
+                        <div class="cell"></div>
+                      </td>
+                    </tr>
+                    <!---->
+                  </tbody>
+                </table>
+                <!---->
+                <!---->
+              </div>
+              <!---->
+              <!---->
+              <!---->
+              <!---->
+              <div class="el-table__column-resize-proxy" style="display: none;"></div>
+            </div>
+          </div>
+        </div>
+        <!-- <el-row :gutter="12">
           <el-col :span="12">
             <el-table :data="bookingConfirmTable" :show-header="false" align="center">
               <el-table-column prop="data1" align="right" width="200" />
@@ -29,7 +187,7 @@
               <el-table-column prop="data2" align="left" width="200" />
             </el-table>
           </el-col>
-        </el-row>
+        </el-row> -->
       </el-card>
     </el-row>
     <br>
@@ -37,12 +195,13 @@
     <el-row justify="center" align="center">
       <el-card class="box-card">
         <div slot="header" class="clearfix">
-          <span>BankinSlip</span>
+          <span>Supplier Report</span>
           <!-- <el-button style="float: right; padding: 3px 0" type="text">Operation button</el-button> -->
         </div>
-        <el-row :gutter="12">
-          <el-col :span="22" style="text-align:center">
-            <img src="http://via.placeholder.com/600x400" class="image">
+        <el-row :gutter="12" style="text-align:center">
+          <el-col :span="20" style="text-align:center">
+
+          
           </el-col>
         </el-row>
       </el-card>
@@ -55,20 +214,55 @@
   }
 </style>
 <script>
-import VueCountdown from '@dmaksimovic/vue-countdown'
-import ProgressTrack from '~/components/AdminProgressTrack'
+  import ProgressTrack from '~/components/AdminProgressTrack'
+  import axios from 'axios'
+
+  export default {
+    components: {
+      'progress-track': ProgressTrack
+    },
+    data() {
+      return {
+        status: 3,
+        loading_btn: false,
+        booking_details: {
+          id: null,
+          amount: null,
+          bia: null,
+          user_bankslip_path: null,
+        },
+        supplier: null,
+        supplier_options: null,
+      
+
+      }
+    },
+    beforeCreate() {
+      const loading = this.$loading({
+        lock: true,
+        text: 'Please wait..',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
+
+      axios
+        .get('/api/admin/booking/' + this.$route.params.id)
+        .then((response) => {
+          loading.close()
+          this.booking_details = response.data
+        }).catch((error) => {
+          console.log(error)
+          loading.close()
+          this.$router.push({
+            name: 'notfound'
+          })
+        })
+
+    
+
+    },
+    methods: {
 
-export default {
-  components: {
-    'progress-track': ProgressTrack
-  },
-  data () {
-    return {
-      status: 4
     }
-  },
-  methods: {
-
   }
-}
-</script>
+</script>
\ No newline at end of file