tab ที่ผ่านมาแล้วเปลี่ยนเป็นสีเขียว

src/components/NotifyConfirm.vue

@@ -0,0 +1,86 @@
+<template>
+  <q-dialog :model-value="modal" persistent>
+    <q-card class="q-pa-sm">
+      <q-card-section class="row items-center">
+        <div class="q-pr-md">
+          <q-avatar
+            icon="mdi-alert-circle-outline"
+            font-size="25px"
+            size="lg"
+            color="primary-1"
+            text-color="primary"
+          />
+        </div>
+        <div class="col text-dark">
+          <span class="text-bold">{{ modalTittle }}</span>
+          <br />
+          <span>{{ modalDetail }}</span>
+        </div>
+      </q-card-section>
+
+      <q-card-actions align="right" class="bg-white text-teal">
+        <q-btn label="ยกเลิก" color="primary" @click="cancel" />
+        <q-btn label="ตกลง" color="primary" @click="ok" />
+      </q-card-actions>
+    </q-card>
+  </q-dialog>
+</template>
+<script setup lang="ts">
+import { ref, useAttrs } from 'vue'
+
+const props = defineProps({
+  modal: Boolean,
+  modalTittle: String,
+  modalDetail: String,
+  ok: {
+    type: Function,
+    default: () => console.log('not function')
+  },
+  cancel: {
+    type: Function,
+    default: () => console.log('not function')
+  }
+})
+
+const emit = defineEmits(['update:modal'])
+
+const cancel = () => {
+  emit('update:modal', false)
+  props.cancel()
+}
+const ok = () => {
+  emit('update:modal', false)
+  props.ok()
+}
+</script>
+<style lang="scss">
+.icon-color {
+  color: #4154b3;
+}
+.custom-header-table {
+  max-height: 64vh;
+  .q-table tr:nth-child(odd) td {
+    background: white;
+  }
+  .q-table tr:nth-child(even) td {
+    background: #f6f6f6ae;
+  }
+
+  .q-table thead tr {
+    background: #ecebeb;
+  }
+
+  .q-table thead tr th {
+    position: sticky;
+    z-index: 1;
+  }
+  /* this will be the loading indicator */
+  .q-table thead tr:last-child th {
+    /* height of all previous header rows */
+    top: 48px;
+  }
+  .q-table thead tr:first-child th {
+    top: 0;
+  }
+}
+</style>