fix: Move dialogs inside q-layout in MainLayout.vue

src/views/MainLayout.vue

@@ -172,13 +172,13 @@ const doLogout = () => {
   );
 };
 
-const clickDelete = async (id: string, index: number) => {
+const clickDelete = async (id: string, index: number | string) => {
   dialogRemove($q, async () => {
     // showLoader();
     await http
       .delete(config.API.msgId(id))
       .then(() => {
-        notiList.value.splice(index, 1);
+        notiList.value.splice(Number(index), 1);
         totalInbox.value--;
         totalNoti.value--;
         success($q, "ลบข้อมูลสำเร็จ");
@@ -772,10 +772,10 @@ watch(
     <q-footer class="bg-grey-1 text-dark q-pa-md">
       <FooterContact />
     </q-footer>
-  </q-layout>
 
-  <DialogResetPass v-model="modalResetPass" />
-  <DialogDebug v-model:modal="modalDebug" />
+    <DialogResetPass v-model="modalResetPass" />
+    <DialogDebug v-model:modal="modalDebug" />
+  </q-layout>
 </template>
 
 <style>