From fab3b9e5f3cdb124bb37e55155a553c90e4f3f77 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Mon, 18 Mar 2024 11:04:42 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B8=A3=E0=B8=B2=E0=B8=A2=E0=B8=81=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=A3=E0=B9=80=E0=B8=A5=E0=B8=B7=E0=B9=88=E0=B8=AD=E0=B8=99?=
 =?UTF-8?q?=E0=B9=80=E0=B8=87=E0=B8=B4=E0=B8=99=E0=B9=80=E0=B8=94=E0=B8=B7?=
 =?UTF-8?q?=E0=B8=AD=E0=B8=99=E0=B8=82=E0=B9=89=E0=B8=B2=E0=B8=A3=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=8A=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B8=AF=20=3D>=20?=
 =?UTF-8?q?=E0=B9=80=E0=B8=9E=E0=B8=B4=E0=B9=88=E0=B8=A1=20tooltip=20tab?=
 =?UTF-8?q?=20=E0=B8=81=E0=B8=A5=E0=B8=B8=E0=B9=88=E0=B8=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/SalaryLists/TabMain.vue        | 84 +++++++++++++++++--
 1 file changed, 78 insertions(+), 6 deletions(-)

diff --git a/src/modules/13_salary/components/SalaryLists/TabMain.vue b/src/modules/13_salary/components/SalaryLists/TabMain.vue
index 0f75e475e..83cf99173 100644
--- a/src/modules/13_salary/components/SalaryLists/TabMain.vue
+++ b/src/modules/13_salary/components/SalaryLists/TabMain.vue
@@ -6,7 +6,6 @@ import config from "@/app.config";
 import genReportXLSX from "@/plugins/genreportxlsx";
 import DialogInfoCriteria from "@/modules/13_salary/components/SalaryLists/DialogInfoCriteria.vue";
 
-
 /** importType*/
 import type { DataOption } from "@/modules/13_salary/interface/index/Main";
 import type { DataFilter } from "@/modules/13_salary/interface/index/SalaryList";
@@ -209,7 +208,7 @@ function fetchDataQuota(id: string) {
       itemsCard.value[0].total = data.total;
       itemsCard.value[1].total = data.fifteenPercent;
       itemsCard.value[2].total = data.chosen;
-      itemsCard.value[3].total = data.remaining;      
+      itemsCard.value[3].total = data.remaining;
       itemsCard.value[4].total = data.totalBackup;
 
       itemsCard.value[5].total = data.currentAmount;
@@ -218,7 +217,7 @@ function fetchDataQuota(id: string) {
       itemsCard.value[8].total = data.sixPercentSpentAmount;
       itemsCard.value[9].total = data.useAmount;
       itemsCard.value[10].total = data.remainingAmount;
-      
+
       itemsCard.value[11].total = data.totalBackup;
     })
     .catch((err) => {
@@ -323,7 +322,72 @@ onMounted(async () => {
       :key="index"
       @click="changeTabGroup"
     >
-      <q-tab :name="item.name" :label="item.lable" />
+      <q-tab :name="item.name" :label="item.lable">
+        <q-tooltip>
+          <q-list dense v-if="item.name === 'group1'">
+            <q-item>
+              <q-item-section>
+                <q-item-label lines="1">
+                  <span class="text-bold">ทั่วไป: </span>
+                  <span> ปฏิบัติงาน,ชำนาญงาน,อาวุโส</span></q-item-label
+                >
+              </q-item-section>
+            </q-item>
+            <q-item>
+              <q-item-section>
+                <q-item-label lines="1">
+                  <span class="text-bold">วิชาการ: </span>
+                  <span> ปฏิบัติการ,ชำนาญการ,ชำนาญการพิเศษ</span></q-item-label
+                >
+              </q-item-section>
+            </q-item>
+
+            <q-item>
+              <q-item-section>
+                <q-item-label lines="1">
+                  <span class="text-bold">อำนวยการ: </span>
+                  <span> ต้น</span></q-item-label
+                >
+              </q-item-section>
+            </q-item>
+          </q-list>
+          <q-list dense v-if="item.name === 'group2'">
+            <q-item>
+              <q-item-section>
+                <q-item-label lines="1">
+                  <span class="text-bold">ทั่วไป: </span>
+                  <span> ทักษะพิเศษ</span></q-item-label
+                >
+              </q-item-section>
+            </q-item>
+            <q-item>
+              <q-item-section>
+                <q-item-label lines="1">
+                  <span class="text-bold">วิชาการ: </span>
+                  <span> เชี่ยวชาญ,ทรงคุณวุฒิ</span></q-item-label
+                >
+              </q-item-section>
+            </q-item>
+
+            <q-item>
+              <q-item-section>
+                <q-item-label lines="1">
+                  <span class="text-bold">อำนวยการ: </span>
+                  <span> สูง</span></q-item-label
+                >
+              </q-item-section>
+            </q-item>
+            <q-item>
+              <q-item-section>
+                <q-item-label lines="1">
+                  <span class="text-bold">บริหาร: </span>
+                  <span> ต้น,สูง</span></q-item-label
+                >
+              </q-item-section>
+            </q-item>
+          </q-list>
+        </q-tooltip>
+      </q-tab>
     </div>
 
     <q-space />
@@ -346,7 +410,11 @@ onMounted(async () => {
     >
       <!-- Card โควต้า -->
       <div class="row col-12 q-pa-md">
-        <div :class="`row col-12 ${store.roundMainCode === 'APR' ? `q-col-gutter-md`:`q-gutter-md`} items-start`">
+        <div
+          :class="`row col-12 ${
+            store.roundMainCode === 'APR' ? `q-col-gutter-md` : `q-gutter-md`
+          } items-start`"
+        >
           <div
             v-for="(item, index) in store.roundMainCode === 'APR'
               ? itemsCard.slice(0, 5)
@@ -354,7 +422,11 @@ onMounted(async () => {
               ? itemsCard.slice(5, 12)
               : itemsCard"
             :key="index"
-            :class="store.roundMainCode === 'APR' ? 'col-6 col-sm-4 col-md-3 col-lg-2' : 'col-3'"
+            :class="
+              store.roundMainCode === 'APR'
+                ? 'col-6 col-sm-4 col-md-3 col-lg-2'
+                : 'col-3'
+            "
           >
             <q-card>
               <q-card-section>