diff --git a/src/components/cart/CartListNew.vue b/src/components/cart/CartListNew.vue
index 3556949..27e0684 100644
--- a/src/components/cart/CartListNew.vue
+++ b/src/components/cart/CartListNew.vue
@@ -191,7 +191,7 @@
         </Card>
       </div>
       <div class="col-12 lg:col-3">
-        <Card class="card-custom">
+        <Card>
           <template #title>
             <div class="font-normal">Ringkasan Troli</div>
           </template>
@@ -1134,8 +1134,4 @@ export default {
 .container-height {
   min-height: 70vh;
 }
-
-.card-customer {
-  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 80%);
-}
 </style>
\ No newline at end of file
diff --git a/src/components/result/ResultDetail.vue b/src/components/result/ResultDetail.vue
index 557d6b5..3f3a706 100644
--- a/src/components/result/ResultDetail.vue
+++ b/src/components/result/ResultDetail.vue
@@ -1,132 +1,233 @@
 <template>
   <the-template>
-    <base-card>
-      <div
-        v-if="loading"
-        style="min-height: 70vh; display: grid; place-items: center"
-      >
-        <div class="spinner-border" role="status">
-          <span class="visually-hidden">Loading...</span>
-        </div>
+    <!-- <base-card> -->
+    <div
+      v-if="loading"
+      style="min-height: 70vh; display: grid; place-items: center"
+    >
+      <div class="spinner-border" role="status">
+        <span class="visually-hidden">Loading...</span>
       </div>
-      <div v-else style="min-height: 70vh" class="container">
-        <div class="row">
-          <div class="col">
-            <div class="d-flex justify-content-between">
-              <router-link
-                v-bind:to="{ name: 'result' }"
-                class="btn btn-secondary m-3 ms-0"
-                >Kembali</router-link
-              >
-              <h5 class="m-3">Keputusan Tarikh Lelong: {{ tarikhLelong }}</h5>
-              <button
-                v-if="!statusPayment"
-                v-on:click="clickPayButton(lelongId)"
-                class="btn btn-primary m-3 me-0"
-              >
-                Bayar
-              </button>
+    </div>
+    <div v-else class="fadein animation-duration-400">
+      <div class="row">
+        <Toolbar class="toolbar-custom">
+          <template #start>
+            <Button
+              class="
+                p-button-sm
+                button-custom
+                p-button-secondary p-button-outlined
+                mr-2
+              "
+              icon="pi pi-arrow-left"
+              v-on:click="clickBackButton()"
+            />
+            <div
+              class="font-normal"
+              style="font-size: 1.5rem; font-weight: 700"
+            >
+              Keputusan Tarikh Lelong: {{ tarikhLelong }}
             </div>
-            <div class="d-flex justify-content-end">
-              <router-link
-                v-bind:to="{ name: 'receipt' }"
-                class="btn btn-outline-primary m-2 me-0"
-                >Resit Bayaran</router-link
-              >
-            </div>
-            <div>
-              <div class="accordion" id="accordionExample">
-                <div
-                  v-for="list in lists"
-                  v-bind:key="list"
-                  class="accordion-item"
-                >
-                  <h2 class="accordion-header" id="headingOne">
-                    <button
-                      class="accordion-button"
-                      type="button"
-                      data-bs-toggle="collapse"
-                      data-bs-target="#collapseOne"
-                      aria-expanded="true"
-                      aria-controls="collapseOne"
-                    >
-                      {{ list.cawangan }}
-                    </button>
-                  </h2>
-                  <div
-                    id="collapseOne"
-                    class="accordion-collapse collapse show"
-                    aria-labelledby="headingOne"
-                    data-bs-parent="#accordionExample"
-                  >
-                    <div class="accordion-body">
-                      <table class="table table-bordered">
-                        <thead>
-                          <tr>
-                            <th scope="col">Bil</th>
-                            <th scope="col">No Rujukan</th>
-                            <th scope="col">Harga Bidaan</th>
-                            <th scope="col">Status Bayaran</th>
-                          </tr>
-                        </thead>
-                        <tbody>
-                          <tr
-                            v-for="(data, index) in list.sag"
-                            v-bind:key="data"
+          </template>
+
+          <template #end>
+            <Button
+              label="Resit Bayaran"
+              icon="pi pi-list"
+              iconPos="right"
+              class="p-button-sm p-button-outlined mr-2"
+            />
+            <Button
+              label="Bayar"
+              icon="pi pi-money-bill"
+              iconPos="right"
+              class="p-button-sm"
+              v-on:click="clickPayButton(lelongId)"
+            />
+          </template>
+        </Toolbar>
+        <Card>
+          <!-- <template #title>
+        </template> -->
+          <template #content>
+            <Accordion :multiple="true">
+              <AccordionTab v-for="list in lists" v-bind:key="list">
+                <template #header>
+                  <span>{{ list.cawangan }}</span>
+                  <!-- <span class="ml-2">Jumlah:RMXXXX</span> -->
+                </template>
+                <div class="overflow-x-auto">
+                  <table class="table text-center table-bordered">
+                    <tbody>
+                      <tr class="table-light">
+                        <td>Bil</td>
+                        <td style="min-width: 180px">No Rujukan</td>
+                        <td style="min-width: 180px">Harga Bidaan</td>
+                        <td style="min-width: 220px">Status Bayaran</td>
+                      </tr>
+                      <tr v-for="(data, index) in list.sag" :key="data">
+                        <td>{{ index + 1 }}</td>
+                        <td>
+                          <a
+                            href="#"
+                            data-bs-toggle="modal"
+                            data-bs-target="#marhunModal"
+                            v-on:click="marhunModal(data)"
                           >
-                            <td>{{ index + 1 }}</td>
-                            <td>
-                              <a
-                                href="#"
-                                data-bs-toggle="modal"
-                                data-bs-target="#marhunModal"
-                                v-on:click="marhunModal(data)"
-                                >{{ data.norujukan }}
-                              </a>
-                            </td>
-                            <td>RM {{ data.total_payment }}</td>
-                            <td
-                              class="m-1 badge rounded-pill bg-danger"
-                              v-if="
-                                data.status_payment === null ||
-                                data.status_payment == 0
-                              "
-                            >
-                              Belum Bayar
-                            </td>
-                            <td
-                              class="m-1 badge rounded-pill bg-warning"
-                              v-if="data.status_payment === 2"
-                            >
-                              Tunggu Pengesahan
-                            </td>
-                            <td
-                              class="m-1 badge rounded-pill bg-success"
-                              v-if="data.status_payment === 1"
-                            >
-                              Selesai
-                            </td>
-                          </tr>
-                          <!-- <tr>
-                            <td colspan="5" style="justify-content: end">
-                              Muat Turun Penyata
-                              <a href="#" class="btn btn-outline-primary">
-                                <i class="bi bi-download"></i
-                              ></a>
-                            </td>
-                          </tr> -->
-                        </tbody>
-                      </table>
-                      <h5 class="mt-4 mb-5">
-                        Jumlah Harga Bida: RM{{ list.total_hargabida }}
-                      </h5>
+                            {{ data.norujukan }}
+                          </a>
+                        </td>
+                        <td>
+                          RM
+                          {{
+                            data.total_payment
+                              ?.toString()
+                              .replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
+                          }}
+                        </td>
+                        <td
+                          class="m-1 badge rounded-pill bg-danger"
+                          v-if="
+                            data.status_payment === null ||
+                            data.status_payment == 0
+                          "
+                        >
+                          Belum Bayar
+                        </td>
+                        <td
+                          class="m-1 badge rounded-pill bg-warning"
+                          v-if="data.status_payment === 2"
+                        >
+                          Tunggu Pengesahan
+                        </td>
+                        <td
+                          class="m-1 badge rounded-pill bg-success"
+                          v-if="data.status_payment === 1"
+                        >
+                          Selesai
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </div>
+              </AccordionTab>
+            </Accordion>
+            <!-- <div class="">
+            <div class="row">
+              <div class="col">
+                <div class="d-flex justify-content-between">
+                  <router-link
+                    v-bind:to="{ name: 'result' }"
+                    class="btn btn-secondary m-3 ms-0"
+                    >Kembali</router-link
+                  >
+                  <h5 class="m-3">
+                    Keputusan Tarikh Lelong: {{ tarikhLelong }}
+                  </h5>
+                  <button
+                    v-if="!statusPayment"
+                    v-on:click="clickPayButton(lelongId)"
+                    class="btn btn-primary m-3 me-0"
+                  >
+                    Bayar
+                  </button>
+                </div>
+                <div class="d-flex justify-content-end">
+                  <router-link
+                    v-bind:to="{ name: 'receipt' }"
+                    class="btn btn-outline-primary m-2 me-0"
+                    >Resit Bayaran</router-link
+                  >
+                </div>
+                <div>
+                  <div class="accordion" id="accordionExample">
+                    <div
+                      v-for="list in lists"
+                      v-bind:key="list"
+                      class="accordion-item"
+                    >
+                      <h2 class="accordion-header" id="headingOne">
+                        <button
+                          class="accordion-button"
+                          type="button"
+                          data-bs-toggle="collapse"
+                          data-bs-target="#collapseOne"
+                          aria-expanded="true"
+                          aria-controls="collapseOne"
+                        >
+                          {{ list.cawangan }}
+                        </button>
+                      </h2>
+                      <div
+                        id="collapseOne"
+                        class="accordion-collapse collapse show"
+                        aria-labelledby="headingOne"
+                        data-bs-parent="#accordionExample"
+                      >
+                        <div class="accordion-body">
+                          <table class="table table-bordered">
+                            <thead>
+                              <tr>
+                                <th scope="col">Bil</th>
+                                <th scope="col">No Rujukan</th>
+                                <th scope="col">Harga Bidaan</th>
+                                <th scope="col">Status Bayaran</th>
+                              </tr>
+                            </thead>
+                            <tbody>
+                              <tr
+                                v-for="(data, index) in list.sag"
+                                v-bind:key="data"
+                              >
+                                <td>{{ index + 1 }}</td>
+                                <td>
+                                  <a
+                                    href="#"
+                                    data-bs-toggle="modal"
+                                    data-bs-target="#marhunModal"
+                                    v-on:click="marhunModal(data)"
+                                    >{{ data.norujukan }}
+                                  </a>
+                                </td>
+                                <td>RM {{ data.total_payment }}</td>
+                                <td
+                                  class="m-1 badge rounded-pill bg-danger"
+                                  v-if="
+                                    data.status_payment === null ||
+                                    data.status_payment == 0
+                                  "
+                                >
+                                  Belum Bayar
+                                </td>
+                                <td
+                                  class="m-1 badge rounded-pill bg-warning"
+                                  v-if="data.status_payment === 2"
+                                >
+                                  Tunggu Pengesahan
+                                </td>
+                                <td
+                                  class="m-1 badge rounded-pill bg-success"
+                                  v-if="data.status_payment === 1"
+                                >
+                                  Selesai
+                                </td>
+                              </tr>
+                            </tbody>
+                          </table>
+                          <h5 class="mt-4 mb-5">
+                            Jumlah Harga Bida: RM{{ list.total_hargabida }}
+                          </h5>
+                        </div>
+                      </div>
                     </div>
                   </div>
                 </div>
               </div>
             </div>
-          </div>
-        </div>
+          </div> -->
+          </template>
+        </Card>
         <div
           class="modal fade"
           id="marhunModal"
@@ -192,7 +293,8 @@
           </div>
         </div>
       </div>
-    </base-card>
+    </div>
+    <!-- </base-card> -->
   </the-template>
 </template>
 
@@ -250,9 +352,23 @@ export default {
     clickPayButton(value) {
       this.$router.push({ name: "pay", params: { lelongId: value } });
     },
+    clickBackButton() {
+      this.$router.push({ name: "result" });
+    },
     marhunModal(value) {
       console.log(value);
     },
   },
 };
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+.toolbar-custom {
+  background: #fff !important;
+}
+
+.button-custom {
+  height: 20px;
+  width: 10px !important;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/result/ResultMain.vue b/src/components/result/ResultMain.vue
index 48270cf..06f5e78 100644
--- a/src/components/result/ResultMain.vue
+++ b/src/components/result/ResultMain.vue
@@ -7,41 +7,78 @@
       <span class="visually-hidden">Loading...</span>
     </div>
   </div>
-  <div v-else class="container">
-    <table class="table table-bordered table-hover">
-      <thead>
-        <tr>
-          <th scope="col">Bil</th>
-          <th scope="col">Tarikh</th>
-          <th scope="col">Jumlah</th>
-          <th scope="col">Status Bayaran</th>
-          <th scope="col">Penyata</th>
-        </tr>
-      </thead>
-      <tbody v-if="isSuccess">
-        <tr v-for="(data, index) in lelong" v-bind:key="data">
-          <td>{{ index + 1 }}</td>
-          <td class="btn text-primary" style="" v-on:click="selectDate(data)">
-            <u>{{ data.tarikh_lelong }}</u>
-          </td>
-          <td>RM{{ data.jumlah }}</td>
-          <td v-if="data.status == 1" class="text-success">Selesai</td>
-          <td v-else-if="data.status == null" class="text-danger">
-            Belum Selesai
-          </td>
-          <td>
-            <a href="#" class="btn btn-outline-primary">
-              Muat Turun <i class="bi bi-download"></i
-            ></a>
-          </td>
-        </tr>
-      </tbody>
-      <tbody v-else>
-        <tr>
-          <td colspan="100">Tiada Data</td>
-        </tr>
-      </tbody>
-    </table>
+  <div
+    v-else
+    style="min-height: 70vh"
+    class="container fadein animation-duration-400"
+  >
+    <div v-if="isSuccess">
+      <Card>
+        <template #title>
+          <div class="font-normal">Keputusan Lelongan</div>
+        </template>
+        <template #content>
+          <div class="overflow-x-auto">
+            <table class="table table-bordered text-center table-hover">
+              <tbody>
+                <tr class="table-light">
+                  <td>Bil</td>
+                  <td style="min-width: 115px">Tarikh</td>
+                  <td style="min-width: 100px">Jumlah</td>
+                  <td style="min-width: 145px">Status Bayaran</td>
+                  <td style="min-width: 150px">Penyata</td>
+                </tr>
+                <tr v-for="(data, index) in lelong" v-bind:key="data">
+                  <td>{{ index + 1 }}</td>
+                  <td v-on:click="selectDate(data)">
+                    <span class="text-primary underline cursor-pointer">{{
+                      data.tarikh_lelong
+                    }}</span>
+                  </td>
+                  <td>
+                    RM{{
+                      data.jumlah
+                        ?.toString()
+                        .replace(/\B(?=(\d{3})+(?!\d))/g, ",") || ""
+                    }}
+                  </td>
+                  <td v-if="data.status == 1" class="text-success">Selesai</td>
+                  <td v-else-if="data.status == null" class="text-danger">
+                    Belum Selesai
+                  </td>
+                  <td>
+                    <span class="text-primary underline cursor-pointer"
+                      >Muat Turun <i class="pi pi-cloud-download"></i>
+                    </span>
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </template>
+      </Card>
+    </div>
+    <div v-else>
+      <div
+        class="flex align-items-center justify-content-center container-height"
+      >
+        <div class="grid justify-content-center">
+          <div class="col-12 mb-4 text-center">
+            <i class="pi pi-slack text-8xl text-400"></i>
+          </div>
+          <div class="col-12 text-center">
+            <span class="text-400">Tiada Data Dalam Keputusan.</span>
+          </div>
+          <div class="col-12 text-center">
+            <span class="text-400"
+              >Sila rujuk halaman
+              <router-link v-bind:to="{ name: 'home' }">Utama</router-link>
+              untuk jadual lelong</span
+            >
+          </div>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 
@@ -98,4 +135,10 @@ export default {
     },
   },
 };
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+.container-height {
+  min-height: 70vh;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/result/TheResult.vue b/src/components/result/TheResult.vue
index ea6a946..7b72a48 100644
--- a/src/components/result/TheResult.vue
+++ b/src/components/result/TheResult.vue
@@ -1,21 +1,6 @@
 <template>
   <the-template>
-    <div class="container">
-      <div class="row justify-content-center">
-        <div class="col-7">
-          <base-card>
-            <button
-              v-on:click="reloadComponent()"
-              class="badge btn-secondary m-2"
-            >
-              Reload <i class="bi bi-arrow-clockwise"></i>
-            </button>
-            <h5>KEPUTUSAN</h5>
-            <result-main v-bind:key="statusComponent"></result-main>
-          </base-card>
-        </div>
-      </div>
-    </div>
+    <result-main v-bind:key="statusComponent"></result-main>
   </the-template>
 </template>
 
diff --git a/src/main.js b/src/main.js
index 004acda..147a71f 100644
--- a/src/main.js
+++ b/src/main.js
@@ -36,6 +36,7 @@ import RadioButton from 'primevue/radiobutton';
 import Accordion from 'primevue/accordion';
 import AccordionTab from 'primevue/accordiontab';
 import Dialog from 'primevue/dialog';
+import Toolbar from 'primevue/toolbar';
 import Avatar from 'primevue/avatar';
 
 import TheTemplate from './components/layouts/TheTemplate.vue'
@@ -69,6 +70,7 @@ app.component('Accordion', Accordion);
 app.component('AccordionTab', AccordionTab);
 app.component('Dialog', Dialog);
 app.component('Avatar', Avatar);
+app.component('Toolbar', Toolbar);
 
 app.use(router).use(store).use(PrimeVue).use(VueSweetalert2).use(ToastService).mount('#app');
 // app.use(router).use(store).use(PrimeVue).use(ToastService).mount('#app');