fix banner

src/modules/15_probationReport/views/main.vue

@@ -1,5 +1,9 @@
 <script setup lang="ts">
+import { onMounted, ref } from "vue";
+
 import { useRouter } from "vue-router";
+import http from "@/plugins/http";
+import config from "@/app.config";
 
 import { useProbationReport } from "@/modules/15_probationReport/store";
 
@@ -8,6 +12,24 @@ import ResultPage from "@/modules/15_probationReport/components/02_ResultPage.vu
 
 const store = useProbationReport();
 const router = useRouter();
+
+const isData = ref<boolean>(false);
+
+async function getSurveyData() {
+  isData.value = false;
+  await http
+    .get(config.API.summaryDetail())
+    .then(() => {
+      isData.value = true;
+    })
+    .catch((e) => {
+      console.log("error", e);
+    });
+}
+
+onMounted(() => {
+  getSurveyData();
+});
 </script>
 <template>
   <div class="col-12 row justify-center">
@@ -25,8 +47,18 @@ const router = useRouter();
         />
         ผลการทดลองปฏิบัติหน้าที่ราชการและแบบสำรวจความคิดเห็น
       </div>
+
       <div class="col-12">
-        <q-card bordered>
+        <div class="col-12" v-if="!isData">
+          <q-banner
+            inline-actions
+            rounded
+            class="bg-amber-2 text-center text-amber-7"
+          >
+            ไม่พบผลการประเมินการทดลองปฏิบัติหน้าที่ราชการนี้
+          </q-banner>
+        </div>
+        <q-card bordered v-else>
           <q-tabs
             v-model="store.tabMain"
             inline-label
@@ -43,10 +75,11 @@ const router = useRouter();
 
           <q-tab-panels v-model="store.tabMain" animated>
             <q-tab-panel name="SURVEY" class="q-pa-none">
-              <SurveyPage
-            /></q-tab-panel>
-
-            <q-tab-panel name="RESULT"> <ResultPage /> </q-tab-panel>
+              <SurveyPage />
+            </q-tab-panel>
+            <q-tab-panel name="RESULT">
+              <ResultPage />
+            </q-tab-panel>
           </q-tab-panels>
         </q-card>
       </div>