From 105de14b158f643652967daeb3736f2357b3f92d Mon Sep 17 00:00:00 2001
From: Amir <amirhassan.hamzan@gmail.com>
Date: Mon, 12 Dec 2022 12:49:48 +0800
Subject: [PATCH] Remove skeleton in list

---
 src/components/layouts/TheHeader.vue |  2 +-
 src/components/list/ListItem.vue     | 68 +++++++++++++++++-----------
 src/components/list/TheList.vue      |  8 ----
 3 files changed, 42 insertions(+), 36 deletions(-)

diff --git a/src/components/layouts/TheHeader.vue b/src/components/layouts/TheHeader.vue
index aa33dd5..46dcc40 100644
--- a/src/components/layouts/TheHeader.vue
+++ b/src/components/layouts/TheHeader.vue
@@ -267,7 +267,7 @@ export default {
             this.$toast.add({
               severity: "info",
               summary: "Informasi",
-              detail: "Lelong akan tamat pada " + this.lelongOnline,
+              detail: "Lelongan akan tamat pada " + this.lelongOnline,
             });
           } else {
           }
diff --git a/src/components/list/ListItem.vue b/src/components/list/ListItem.vue
index 73c1585..7734e57 100644
--- a/src/components/list/ListItem.vue
+++ b/src/components/list/ListItem.vue
@@ -16,17 +16,11 @@
 
   <div v-else class="fadein animation-duration-400">
     <div v-if="this.status">
-      <!-- <div class="text-center">
-        <InlineMessage class="m-1" severity="info">
-          Jumlah Surat: {{ numberSag }}
-        </InlineMessage>
-        <InlineMessage class="m-1" severity="info">
-          Masa Mula Lelong: {{ lelong_details.masamula_lelong }}
-        </InlineMessage>
-        <InlineMessage class="m-1" severity="info">
-          Masa Tamat Lelong: {{ lelong_details.masatamat_lelong }}
-        </InlineMessage>
-      </div> -->
+      <div class="text-center">
+        <Message severity="info" :closable="false"
+          >Jumlah Surat Lelongan: {{ numberSag }}
+        </Message>
+      </div>
       <div class="row justify-content-center">
         <div
           v-for="sag in sags"
@@ -87,23 +81,39 @@
     </div>
     <div v-else>
       <div class="row">
-        <Message severity="info" :closable="false"
-          >Sila isi ruangan pilih cawangan di atas.
-        </Message>
-        <div class="grid justify-content-center">
+        <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-arrow-up text-8xl text-400"></i>
+            </div>
+            <div class="col-12 text-center">
+              <span class="text-400"
+                >Sila isi ruangan pilih cawangan di atas.</span
+              >
+            </div>
+          </div>
+        </div>
+        <div class="grid justify-content-center" style="visibility:hidden">
           <div class="col-12 p-3 lg:col-4">
             <div class="card p-2">
               <div class="field">
                 <div class="custom-skeleton">
                   <div class="flex mb-3"></div>
-                  <Skeleton width="100%" height="150px"></Skeleton>
-                  <div class="flex justify-content-center mt-3">
+                  <Skeleton width="100%" height="1px"></Skeleton>
+                  <div class="flex justify-content-center">
                     <Skeleton width="10rem"></Skeleton>
                   </div>
-                  <div class="flex justify-content-center mt-1">
+                  <div class="flex justify-content-center">
                     <Skeleton width="10rem"></Skeleton>
                   </div>
-                  <div class="flex justify-content-between mt-3">
+                  <div class="flex justify-content-between">
                     <Skeleton width="4rem" height="2rem"></Skeleton>
                     <Skeleton width="4rem" height="2rem"></Skeleton>
                   </div>
@@ -116,14 +126,14 @@
               <div class="field">
                 <div class="custom-skeleton">
                   <div class="flex mb-3"></div>
-                  <Skeleton width="100%" height="150px"></Skeleton>
-                  <div class="flex justify-content-center mt-3">
+                  <Skeleton width="100%" height="1px"></Skeleton>
+                  <div class="flex justify-content-center">
                     <Skeleton width="10rem"></Skeleton>
                   </div>
-                  <div class="flex justify-content-center mt-1">
+                  <div class="flex justify-content-center">
                     <Skeleton width="10rem"></Skeleton>
                   </div>
-                  <div class="flex justify-content-between mt-3">
+                  <div class="flex justify-content-between">
                     <Skeleton width="4rem" height="2rem"></Skeleton>
                     <Skeleton width="4rem" height="2rem"></Skeleton>
                   </div>
@@ -136,14 +146,14 @@
               <div class="field">
                 <div class="custom-skeleton">
                   <div class="flex mb-3"></div>
-                  <Skeleton width="100%" height="150px"></Skeleton>
-                  <div class="flex justify-content-center mt-3">
+                  <Skeleton width="100%" height="1px"></Skeleton>
+                  <div class="flex justify-content-center">
                     <Skeleton width="10rem"></Skeleton>
                   </div>
-                  <div class="flex justify-content-center mt-1">
+                  <div class="flex justify-content-center">
                     <Skeleton width="10rem"></Skeleton>
                   </div>
-                  <div class="flex justify-content-between mt-3">
+                  <div class="flex justify-content-between">
                     <Skeleton width="4rem" height="2rem"></Skeleton>
                     <Skeleton width="4rem" height="2rem"></Skeleton>
                   </div>
@@ -677,4 +687,8 @@ export default {
   min-height: 180px;
   min-width: 255px;
 }
+
+.container-height {
+  min-height: 70vh;
+}
 </style>
\ No newline at end of file
diff --git a/src/components/list/TheList.vue b/src/components/list/TheList.vue
index 5fe6da2..f142984 100644
--- a/src/components/list/TheList.vue
+++ b/src/components/list/TheList.vue
@@ -35,14 +35,6 @@
               <input type="hidden" />
             </select>
           </div>
-          <!-- <h6>
-            <button
-              class="badge m-2 btn-secondary"
-              @click="toggleReloadComponent"
-            >
-              Reload <i class="bi bi-arrow-down"></i>
-            </button>
-          </h6> -->
           <list-item
             v-bind:key="componentKey"
             v-bind:selectedCawangan="selectCawangan"