From 63496981885daa2cefc401c5074f73fe45124a2f Mon Sep 17 00:00:00 2001
From: Thanit Konmek <thanit@frappet.com>
Date: Fri, 14 Jul 2023 15:34:59 +0700
Subject: [PATCH 1/2] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=E0=B8=9F?=
 =?UTF-8?q?=E0=B8=B1=E0=B8=87=E0=B8=81=E0=B9=8C=E0=B8=8A=E0=B8=B1=E0=B9=88?=
 =?UTF-8?q?=E0=B8=99=20guid?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/modules/05_placement/components/PersonalDetail/Detail.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/modules/05_placement/components/PersonalDetail/Detail.vue b/src/modules/05_placement/components/PersonalDetail/Detail.vue
index 940f34337..fe0949eef 100644
--- a/src/modules/05_placement/components/PersonalDetail/Detail.vue
+++ b/src/modules/05_placement/components/PersonalDetail/Detail.vue
@@ -102,7 +102,7 @@ onMounted(async () => {
 });
 
 const guidCheck = (id: string) => {
-  if (id == "0000-0000-0000-0000") {
+  if (id == "00000000-0000-0000-0000-000000000000") {
     return null;
   }
   return id;

From 332e61599b4f43497cb6d58d8a85e94bf225ae57 Mon Sep 17 00:00:00 2001
From: Tanyalak <tanyalak@frappet.com>
Date: Fri, 14 Jul 2023 15:38:09 +0700
Subject: [PATCH 2/2] =?UTF-8?q?=E0=B8=9B=E0=B8=A3=E0=B8=B1=E0=B8=9A=20css?=
 =?UTF-8?q?=20=E0=B8=A3=E0=B8=B0=E0=B8=9A=E0=B8=9A=E0=B8=97=E0=B8=B0?=
 =?UTF-8?q?=E0=B9=80=E0=B8=9A=E0=B8=B5=E0=B8=A2=E0=B8=99=E0=B8=9B=E0=B8=A3?=
 =?UTF-8?q?=E0=B8=B0=E0=B8=A7=E0=B8=B1=E0=B8=95=E0=B8=B4=E0=B8=A5=E0=B8=B9?=
 =?UTF-8?q?=E0=B8=81=E0=B8=88=E0=B9=89=E0=B8=B2=E0=B8=87,=E0=B8=9E?=
 =?UTF-8?q?=E0=B9=89=E0=B8=99=E0=B8=88=E0=B8=B2=E0=B8=81=E0=B8=A3=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=8A=E0=B8=81=E0=B8=B2=E0=B8=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/modules/05_placement/components/Main.vue  |   5 +-
 .../components/OrderPlacement/step/step02.vue |   3 +-
 .../components/OrderPlacement/step/step03.vue |   6 +-
 .../components/PersonalList/TableView.vue     |   2 +-
 src/modules/06_retirement/views/Main.vue      | 323 +++++++++---------
 src/modules/08_registryEmployee/router.ts     |   2 +-
 .../08_registryEmployee/views/Detail.vue      |   8 +-
 .../08_registryEmployee/views/Main.vue        | 216 ++++++------
 src/style/quasar-variables.sass               |   3 +
 src/views/MainLayout.vue                      |   4 +-
 10 files changed, 286 insertions(+), 286 deletions(-)

diff --git a/src/modules/05_placement/components/Main.vue b/src/modules/05_placement/components/Main.vue
index 940adfbc4..14eb38d5a 100644
--- a/src/modules/05_placement/components/Main.vue
+++ b/src/modules/05_placement/components/Main.vue
@@ -299,7 +299,7 @@ const paginationLabel = (start: number, end: number, total: number) => {
     รายการสอบแข่งขัน / คัดเลือก
   </div>
   <q-card flat bordered class="col-12 q-mt-sm q-pa-md">
-    <div class="row q-col-gutter-md">
+    <div class="row q-col-gutter-sm">
       <div class="row col-12 q-col-gutter-sm">
         <q-select
           class="col-xs-12 col-sm-3 col-md-2"
@@ -422,7 +422,8 @@ const paginationLabel = (start: number, end: number, total: number) => {
           <template v-slot:pagination="scope">
             <q-pagination
               v-model="pagination.page"
-              color="primary"
+              active-color="primary"
+							color="dark"
               :max="scope.pagesNumber"
               :max-pages="5"
               size="sm"
diff --git a/src/modules/05_placement/components/OrderPlacement/step/step02.vue b/src/modules/05_placement/components/OrderPlacement/step/step02.vue
index 99ebb26cc..c3199cf47 100644
--- a/src/modules/05_placement/components/OrderPlacement/step/step02.vue
+++ b/src/modules/05_placement/components/OrderPlacement/step/step02.vue
@@ -138,7 +138,8 @@
         <template v-slot:pagination="scope">
           <q-pagination
             v-model="pagination.page"
-            color="primary"
+            active-color="primary"
+						color="dark"
             :max="scope.pagesNumber"
             :max-pages="5"
             size="sm"
diff --git a/src/modules/05_placement/components/OrderPlacement/step/step03.vue b/src/modules/05_placement/components/OrderPlacement/step/step03.vue
index f826a28e6..3e4e299a4 100644
--- a/src/modules/05_placement/components/OrderPlacement/step/step03.vue
+++ b/src/modules/05_placement/components/OrderPlacement/step/step03.vue
@@ -130,7 +130,8 @@
         <template v-slot:pagination="scope">
           <q-pagination
             v-model="pagination.page"
-            color="primary"
+            active-color="primary"
+						color="dark"
             :max="scope.pagesNumber"
             :max-pages="5"
             size="sm"
@@ -306,7 +307,8 @@
                 <template v-slot:pagination="scope">
                   <q-pagination
                     v-model="paginationModal.page"
-                    color="primary"
+                    active-color="primary"
+								    color="dark"
                     :max="scope.pagesNumber"
                     :max-pages="5"
                     size="sm"
diff --git a/src/modules/05_placement/components/PersonalList/TableView.vue b/src/modules/05_placement/components/PersonalList/TableView.vue
index aaba97e94..3ebfec1b4 100644
--- a/src/modules/05_placement/components/PersonalList/TableView.vue
+++ b/src/modules/05_placement/components/PersonalList/TableView.vue
@@ -23,7 +23,7 @@
               <q-table ref="table" flat bordered class="custom-header-table" v-bind="attrs" virtual-scroll
                 :virtual-scroll-sticky-size-start="48" dense :pagination-label="paginationLabel" v-model:pagination="pagination">
                 <template v-slot:pagination="scope">
-                  <q-pagination v-model="pagination.page" color="primary" :max="scope.pagesNumber" :max-pages="5" size="sm"
+                  <q-pagination v-model="pagination.page" active-color="primary" color="dark" :max="scope.pagesNumber" :max-pages="5" size="sm"
                     boundary-links direction-links></q-pagination>
                 </template>
                 <template v-slot:header="props">
diff --git a/src/modules/06_retirement/views/Main.vue b/src/modules/06_retirement/views/Main.vue
index 5b6cd79c2..37712b229 100644
--- a/src/modules/06_retirement/views/Main.vue
+++ b/src/modules/06_retirement/views/Main.vue
@@ -2,168 +2,169 @@
   <div class="toptitle text-dark col-12 row items-center">
     ประกาศเกษียณอายุราชการ
   </div>
-  <q-card flat bordered class="col-12 q-mt-sm q-pa-md">
-    <div class="row q-col-gutter-sm">
-      <div class="row col-12 q-col-gutter-sm">
-        <q-select
-          class="col-xs-12 col-sm-3 col-md-1"
-          v-model="fiscalyear"
-          label="ปีงบประมาณ"
-          dense
-          emit-value
-          map-options
-          :options="fiscalyearOP"
-          option-value="id"
-          option-label="name"
-          lazy-rules
-          hide-bottom-space
-          :readonly="false"
-          :borderless="false"
-          :outlined="true"
-          :hide-dropdown-icon="false"
-          @update:model-value="searchFilterTable"
-        />
-        <div>
-          <q-btn
-            @click="clickAdd()"
-            size="12px"
-            flat
-            round
-            color="add"
-            icon="mdi-plus"
-          >
-            <q-tooltip>เพิ่มผู้ทดลองปฏิบัติหน้าที่ราชการ</q-tooltip>
-          </q-btn>
-          <q-menu>
-            <q-list style="min-width: 100px">
-              <q-item clickable @click="clickAdd">
-                <q-item-section>ขรก.กทม.สามัญ</q-item-section>
-              </q-item>
-              <q-item clickable @click="clickAdd">
-                <q-item-section>ลูกจ้างประจำ</q-item-section>
-              </q-item>
-            </q-list>
-          </q-menu>
-        </div>
-        <q-space />
-
-        <q-input
-          class="col-xs-12 col-sm-3 col-md-2"
-          standout
-          dense
-          v-model="filterKeyword"
-          ref="filterRef"
-          outlined
-          debounce="300"
-          placeholder="ค้นหา"
-        >
-          <template v-slot:append>
-            <q-icon v-if="filterKeyword == ''" name="search" />
-            <q-icon
-              v-if="filterKeyword !== ''"
-              name="clear"
-              class="cursor-pointer"
-              @click="resetFilter"
-            />
-          </template>
-        </q-input>
-
-        <q-select
-          v-model="visibleColumns"
-          multiple
-          outlined
-          dense
-          options-dense
-          :display-value="$q.lang.table.columns"
-          emit-value
-          map-options
-          :options="columns"
-          option-value="name"
-          options-cover
-          style="min-width: 150px"
-          class="col-xs-12 col-sm-3 col-md-2"
-        />
-      </div>
-      <div class="col-12">
-        <div class="q-pa-sm">
-          <q-tabs
-            v-model="tab"
+  <q-card flat bordered class="col-12 q-mt-sm">
+    <div class="row col-12">
+      <q-tabs
+        v-model="tab"
+        dense
+        class="text-grey"
+        active-color="primary"
+        active-class="bg-teal-1"
+        indicator-color="primary"
+        align="left"
+      >
+        <q-tab name="samun" label="ขรก.กทม.สามัญ" />
+        <q-tab name="employee" label="ลูกจ้างประจำ" />
+      </q-tabs>
+    </div>
+    <q-separator/>
+    <div class="col-12 row q-pa-md">
+      <div class="row col-12">
+        <div class="row col-12 q-col-gutter-sm">
+          <q-select
+            v-model="fiscalyear"
+            label="ปีงบประมาณ"
             dense
-            class="text-grey"
-            active-color="primary"
-            indicator-color="primary"
-            align="left"
-            narrow-indicator
-          >
-            <q-tab name="samun" label="ขรก.กทม.สามัญ" />
-            <q-tab name="employee" label="ลูกจ้างประจำ" />
-          </q-tabs>
-        </div>
+            emit-value
+            map-options
+            :options="fiscalyearOP"
+            option-value="id"
+            option-label="name"
+            lazy-rules
+            hide-bottom-space
+            :readonly="false"
+            :borderless="false"
+            :outlined="true"
+            :hide-dropdown-icon="false"
+            style="min-width: 150px;"
+            @update:model-value="searchFilterTable"
+          />
+          <div>
+            <q-btn
+              @click="clickAdd()"
+              size="12px"
+              flat
+              round
+              color="add"
+              icon="mdi-plus"
+            >
+              <q-tooltip>เพิ่มผู้ทดลองปฏิบัติหน้าที่ราชการ</q-tooltip>
+            </q-btn>
+            <!-- <q-menu>
+              <q-list style="min-width: 100px">
+                <q-item clickable @click="clickAdd">
+                  <q-item-section>ขรก.กทม.สามัญ</q-item-section>
+                </q-item>
+                <q-item clickable @click="clickAdd">
+                  <q-item-section>ลูกจ้างประจำ</q-item-section>
+                </q-item>
+              </q-list>
+            </q-menu> -->
+          </div>
+          <q-space />
 
-        <q-space />
-        <q-table
-          ref="table"
-          :columns="columns"
-          :rows="rows"
-          :filter="filterKeyword"
-          row-key="name"
-          flat
-          bordered
-          :paging="true"
-          dense
-          class="custom-header-table"
-          v-bind="attrs"
-          :visible-columns="visibleColumns"
-          :pagination-label="paginationLabel"
-          v-model:pagination="pagination"
-        >
-          <template v-slot:header="props">
-            <q-tr :props="props">
-              <q-th v-for="col in props.cols" :key="col.name" :props="props">
-                <span class="text-weight-medium">{{ col.label }}</span>
-              </q-th>
-              <q-th auto-width />
-            </q-tr>
-          </template>
-          <template v-slot:body="props">
-            <q-tr :props="props" class="cursor-pointer">
-              <q-td key="no" :props="props">
-                {{ props.rowIndex + 1 }}
-              </q-td>
-              <q-td key="Date" :props="props">
-                {{ props.row.Date }}
-              </q-td>
-              <q-td key="retireNumber" :props="props">
-                {{ props.row.retireNumber }}
-              </q-td>
-              <q-td auto-width>
-                <q-btn
-                  dense
-                  size="12px"
-                  flat
-                  round
-                  color="red"
-                  @click="clickDelete(props.row.id)"
-                  icon="mdi-delete"
-                >
-                  <q-tooltip>ลบข้อมูล</q-tooltip>
-                </q-btn>
-              </q-td>
-            </q-tr>
-          </template>
-          <template v-slot:pagination="scope">
-            <q-pagination
-              v-model="pagination.page"
-              active-color="primary"
-              color="primary"
-              :max="scope.pagesNumber"
-              :max-pages="5"
-              size="sm"
-              boundary-links
-              direction-links
-            ></q-pagination>
-          </template>
-        </q-table>
+          <q-input
+            class="col-xs-12 col-sm-3 col-md-2"
+            standout
+            dense
+            v-model="filterKeyword"
+            ref="filterRef"
+            outlined
+            debounce="300"
+            placeholder="ค้นหา"
+          >
+            <template v-slot:append>
+              <q-icon v-if="filterKeyword == ''" name="search" />
+              <q-icon
+                v-if="filterKeyword !== ''"
+                name="clear"
+                class="cursor-pointer"
+                @click="resetFilter"
+              />
+            </template>
+          </q-input>
+
+          <q-select
+            v-model="visibleColumns"
+            multiple
+            outlined
+            dense
+            options-dense
+            :display-value="$q.lang.table.columns"
+            emit-value
+            map-options
+            :options="columns"
+            option-value="name"
+            options-cover
+            style="min-width: 150px"
+            class="col-xs-12 col-sm-3 col-md-2"
+          />
+        </div>
+        <div class="col-12 q-pt-sm">
+          <q-table
+            ref="table"
+            :columns="columns"
+            :rows="rows"
+            :filter="filterKeyword"
+            row-key="name"
+            flat
+            bordered
+            :paging="true"
+            dense
+            class="custom-header-table"
+            v-bind="attrs"
+            :visible-columns="visibleColumns"
+            :pagination-label="paginationLabel"
+            v-model:pagination="pagination"
+          >
+            <template v-slot:header="props">
+              <q-tr :props="props">
+                <q-th v-for="col in props.cols" :key="col.name" :props="props">
+                  <span class="text-weight-medium">{{ col.label }}</span>
+                </q-th>
+                <q-th auto-width />
+              </q-tr>
+            </template>
+            <template v-slot:body="props">
+              <q-tr :props="props" class="cursor-pointer">
+                <q-td key="no" :props="props">
+                  {{ props.rowIndex + 1 }}
+                </q-td>
+                <q-td key="Date" :props="props">
+                  {{ props.row.Date }}
+                </q-td>
+                <q-td key="retireNumber" :props="props">
+                  {{ props.row.retireNumber }}
+                </q-td>
+                <q-td auto-width>
+                  <q-btn
+                    dense
+                    size="12px"
+                    flat
+                    round
+                    color="red"
+                    @click="clickDelete(props.row.id)"
+                    icon="mdi-delete"
+                  >
+                    <q-tooltip>ลบข้อมูล</q-tooltip>
+                  </q-btn>
+                </q-td>
+              </q-tr>
+            </template>
+            <template v-slot:pagination="scope">
+              <q-pagination
+                v-model="pagination.page"
+                active-color="primary"
+                color="primary"
+                :max="scope.pagesNumber"
+                :max-pages="5"
+                size="sm"
+                boundary-links
+                direction-links
+              ></q-pagination>
+            </template>
+          </q-table>
+        </div>
       </div>
     </div>
   </q-card>
@@ -176,8 +177,6 @@ import type {
   FormMainProbation,
   FormMainProbation2,
 } from "@/modules/05_placement/interface/request/Main";
-import DialogHeader from "@/modules/04_registry/components/DialogHeader.vue";
-import router from "@/router";
 import { useQuasar } from "quasar";
 
 const $q = useQuasar(); //ใช้ noti quasar
diff --git a/src/modules/08_registryEmployee/router.ts b/src/modules/08_registryEmployee/router.ts
index 198e2e745..2dd0550c8 100644
--- a/src/modules/08_registryEmployee/router.ts
+++ b/src/modules/08_registryEmployee/router.ts
@@ -14,7 +14,7 @@ const Detail = defineAsyncComponent(
 
 export default [
   {
-    path: "/registry-employee",
+    path: "/registryEmployee",
     name: "registryEmployee",
     component: Main,
     meta: {
diff --git a/src/modules/08_registryEmployee/views/Detail.vue b/src/modules/08_registryEmployee/views/Detail.vue
index 38dc15279..766423fb2 100644
--- a/src/modules/08_registryEmployee/views/Detail.vue
+++ b/src/modules/08_registryEmployee/views/Detail.vue
@@ -150,10 +150,10 @@
         <div class="row items-center text-dark q-ml-md">
           <div class="column">
             <div class="text-bold q-pb-xs text-name">
-              {{ "เพิ่มข้อมูลทะเบียนประวัติ" }}
+              เพิ่มข้อมูลทะเบียนประวัติ
             </div>
             <div class="text-bold q-pb-xs text-sub">
-              {{ "ลูกจ้างชั่วคราว" }}
+              ลูกจ้างชั่วคราว
             </div>
           </div>
         </div>
@@ -1000,12 +1000,12 @@ const Retire = async () => {
 }
 
 .text-name {
-  font-size: 1.5em;
+  font-size: 1.3em;
   overflow: hidden;
 }
 
 .text-sub {
-  font-size: 1.5em;
+  font-size: 1.2em;
   overflow: hidden;
   color: var(--q-primary);
 }
diff --git a/src/modules/08_registryEmployee/views/Main.vue b/src/modules/08_registryEmployee/views/Main.vue
index bd6806212..24c94dede 100644
--- a/src/modules/08_registryEmployee/views/Main.vue
+++ b/src/modules/08_registryEmployee/views/Main.vue
@@ -2,9 +2,8 @@
   <div class="toptitle text-dark col-12 row items-center">
     รายชื่อลูกจ้างชั่วคราว
   </div>
-  <div>
-    <div class="q-pa-md" style="min-height: 70vh; overflow-y: scroll">
-      <div class="col-12 row q-py-sm items-center">
+    <q-card flat bordered class="q-pa-md">
+      <div class="col-12 row items-center">
         <q-btn flat round color="primary" @click="clickAdd" icon="mdi-plus">
           <q-tooltip>เพิ่มข้อมูล</q-tooltip>
         </q-btn>
@@ -49,116 +48,111 @@
           />
         </div>
       </div>
-      <q-table
-        flat
-        bordered
-        dense
-        :rows="rows"
-        :columns="columns"
-        :visible-columns="visibleColumns"
-        :filter="filter"
-        row-key="name"
-        class="custom-header-table"
-        :pagination-label="paginationLabel"
-        v-model:pagination="pagination"
-      >
-        <template v-slot:header="props">
-          <q-tr :props="props">
-            <q-th v-for="col in props.cols" :key="col.name" :props="props">
-              <span class="text-weight-medium">{{ col.label }}</span>
-            </q-th>
-            <q-th auto-width />
-          </q-tr>
-        </template>
-        <template v-slot:body="props">
-          <q-tr :props="props" class="cursor-pointer">
-            <q-td key="no" :props="props">
-              {{ props.rowIndex + 1 }}
-            </q-td>
-            <q-td key="positionNum" :props="props">
-              {{ props.row.positionNum }}
-            </q-td>
-            <q-td key="name" :props="props">
-              {{ props.row.name }}
-            </q-td>
-            <q-td key="position" :props="props">
-              {{ props.row.position }}
-            </q-td>
-            <q-td key="path" :props="props">
-              {{ props.row.path }}
-            </q-td>
-            <q-td key="type" :props="props">
-              {{ props.row.type }}
-            </q-td>
-            <q-td key="level" :props="props">
-              {{ props.row.level }}
-            </q-td>
-            <q-td key="affiliation" :props="props">
-              {{ props.row.affiliation }}
-            </q-td>
-            <q-td key="yearly" :props="props">
-              {{ props.row.yearly }}
-            </q-td>
-            <q-td key="pay" :props="props">
-              {{ props.row.pay }}
-            </q-td>
-            <q-td auto-width>
-              <q-btn
-                icon="mdi-dots-vertical"
-                size="12px"
-                color="grey-7"
-                flat
-                round
-                dense
-              >
-                <q-menu transition-show="jump-down" transition-hide="jump-up">
-                  <q-list dense style="min-width: 150px">
-                    <q-item
-                      clickable
-                      v-close-popup
-                      @click="editDetail(props.row)"
-                    >
-                      <q-item-section
-                        style="min-width: 0px"
-                        avatar
-                        class="q-py-sm"
+      <div class="col-12 q-pt-sm">
+        <q-table
+          flat
+          bordered
+          dense
+          :rows="rows"
+          :columns="columns"
+          :visible-columns="visibleColumns"
+          :filter="filter"
+          row-key="name"
+          class="custom-header-table"
+          :pagination-label="paginationLabel"
+          v-model:pagination="pagination"
+        >
+          <template v-slot:header="props">
+            <q-tr :props="props">
+              <q-th v-for="col in props.cols" :key="col.name" :props="props">
+                <span class="text-weight-medium">{{ col.label }}</span>
+              </q-th>
+              <q-th auto-width />
+            </q-tr>
+          </template>
+          <template v-slot:body="props">
+            <q-tr :props="props" class="cursor-pointer">
+              <q-td key="no" :props="props">
+                {{ props.rowIndex + 1 }}
+              </q-td>
+              <q-td key="positionNum" :props="props">
+                {{ props.row.positionNum }}
+              </q-td>
+              <q-td key="name" :props="props">
+                {{ props.row.name }}
+              </q-td>
+              <q-td key="position" :props="props">
+                {{ props.row.position }}
+              </q-td>
+              <q-td key="path" :props="props">
+                {{ props.row.path }}
+              </q-td>
+              <q-td key="type" :props="props">
+                {{ props.row.type }}
+              </q-td>
+              <q-td key="level" :props="props">
+                {{ props.row.level }}
+              </q-td>
+              <q-td key="affiliation" :props="props">
+                {{ props.row.affiliation }}
+              </q-td>
+              <q-td key="yearly" :props="props">
+                {{ props.row.yearly }}
+              </q-td>
+              <q-td key="pay" :props="props">
+                {{ props.row.pay }}
+              </q-td>
+              <q-td auto-width>
+                <q-btn
+                  icon="mdi-dots-vertical"
+                  size="12px"
+                  color="grey-7"
+                  flat
+                  round
+                  dense
+                >
+                  <q-menu transition-show="jump-down" transition-hide="jump-up">
+                    <q-list dense style="min-width: 160px">
+                      <q-item
+                        clickable
+                        v-close-popup
+                        @click="editDetail(props.row)"
                       >
-                      </q-item-section>
-                      <q-item-section>กำหนดตำแหน่ง</q-item-section>
-                    </q-item>
-                    <q-separator />
-                        <q-item clickable v-close-popup @click="clickDelete('test')">
-                      <q-item-section
-                        style="min-width: 0px"
-                        avatar
-                        class="q-py-sm"
-                      >
-                      </q-item-section>
-                      <q-item-section>ลบ</q-item-section>
-                    </q-item>
+                        <q-item-section style="min-width: 0px" avatar class="q-py-sm">
+                          <q-icon color="blue" size="xs" name="mdi-account-settings" />
+                        </q-item-section>
+                        <q-item-section>กำหนดตำแหน่ง</q-item-section>
+                      </q-item>
+                      <q-separator />
+                      <q-item clickable v-close-popup @click="clickDelete('test')">
+                        <q-item-section style="min-width: 0px" avatar class="q-py-sm">
+                          <q-icon color="red" size="xs" name="mdi-delete" />
+                        </q-item-section>
+                        <q-item-section>ลบ</q-item-section>
+                      </q-item>
 
-                    <q-separator />
-                  </q-list>
-                </q-menu>
-              </q-btn>
-            </q-td>
-          </q-tr>
-        </template>
-        <template v-slot:pagination="scope">
-          <q-pagination
-            v-model="pagination.page"
-            color="primary"
-            :max="scope.pagesNumber"
-            :max-pages="5"
-            size="sm"
-            boundary-links
-            direction-links
-          ></q-pagination>
-        </template>
-      </q-table>
-    </div>
-    <q-separator />
-  </div>
+                      <q-separator />
+                    </q-list>
+                  </q-menu>
+                </q-btn>
+              </q-td>
+            </q-tr>
+          </template>
+          <template v-slot:pagination="scope">
+            <q-pagination
+              v-model="pagination.page"
+              active-color="primary"
+							color="dark"
+              :max="scope.pagesNumber"
+              :max-pages="5"
+              size="sm"
+              boundary-links
+              direction-links
+            ></q-pagination>
+          </template>
+        </q-table>
+      </div>
+    </q-card>
 </template>
 <script setup lang="ts">
 import { ref, onMounted } from "vue";
diff --git a/src/style/quasar-variables.sass b/src/style/quasar-variables.sass
index 5e559d0cc..f2c3dc454 100644
--- a/src/style/quasar-variables.sass
+++ b/src/style/quasar-variables.sass
@@ -68,6 +68,9 @@ div
 
 $separator-color: #EDEDED !default
 
+.bg-teal-1
+  background: #e0f2f1a6 !important
+  
 .table_ellipsis
   max-width: 200px
   white-space: nowrap
diff --git a/src/views/MainLayout.vue b/src/views/MainLayout.vue
index 76c07c0ea..d8d241366 100644
--- a/src/views/MainLayout.vue
+++ b/src/views/MainLayout.vue
@@ -559,7 +559,7 @@ if (keycloak.tokenParsed != null) {
                   v-ripple
                   :active="link === menuItem.label"
                   @click="link = menuItem.label"
-                  active-class="text-primary menuActiveMini"
+                  active-class="text-primary menuActiveMini text-weight-medium"
                   v-if="menuItem.key == 3 || menuItem.key == 5"
                 >
                   <div class="row items-center no-wrap">
@@ -939,7 +939,7 @@ if (keycloak.tokenParsed != null) {
   background: #1e2529d9;
 } */
 .font-400{
-  font-weight: 400 !important;
+  font-weight: 400 ;
 }
 .expan2 .menuSubHover {
   padding-left: 30%;