diff --git a/src/components/FormTime.vue b/src/components/FormTime.vue
index 33e91a7..aba06fc 100644
--- a/src/components/FormTime.vue
+++ b/src/components/FormTime.vue
@@ -42,6 +42,10 @@ const props = defineProps({
       console.log('fetchData func')
     },
   },
+  action: {
+    type: String,
+    default: '',
+  },
 })
 
 const dataByIdVal = ref<DataCheckIn>() //ข้อมูลประวัติการลงเวลา
@@ -151,7 +155,9 @@ onMounted(() => {
   if (dataByIdVal.value == null) {
     statusAction.value = true
   } else {
-    date.value = convertDatetimeToAPI(new Date(dataByIdVal.value.checkInDateTime))
+    date.value = convertDatetimeToAPI(
+      new Date(dataByIdVal.value.checkInDateTime)
+    )
   }
 })
 </script>
@@ -201,7 +207,11 @@ onMounted(() => {
                 outlined
                 dense
                 :model-value="date !== null ? date2Thai(new Date(date)) : null"
-                :label="`${'วันที่ขอแก้ไข'}`"
+                :label="`${
+                  action === 'edit'
+                    ? 'วันที่ขอแก้ไข'
+                    : 'วันที่ขอลงเวลากรณีพิเศษ'
+                }`"
                 format-header="YYYY-MM-DD"
                 lazy-rules
                 :rules="[(val:string) => !!val || 'กรุณาเลือกวันที่']"
@@ -221,6 +231,7 @@ onMounted(() => {
       </q-card>
 
       <q-card
+        v-if="action === 'edit'"
         flat
         bordered
         class="q-pa-sm col-12 q-mt-sm"
diff --git a/src/components/PopUp.vue b/src/components/PopUp.vue
index 0683093..2667f62 100644
--- a/src/components/PopUp.vue
+++ b/src/components/PopUp.vue
@@ -31,6 +31,10 @@ const props = defineProps({
     type: Function,
     default: () => console.log('not function'),
   },
+  action: {
+    type: String,
+    default: '',
+  },
 })
 
 const data = ref<DataCheckIn>() // ข้อมูลลงเวลา
@@ -64,6 +68,7 @@ watch(
         :data-byId="data"
         :close-popup="clickClosePopup"
         :fetch-data="props.fetchData"
+        :action="props.action"
       />
     </q-card>
   </q-dialog>
diff --git a/src/components/TableHistory.vue b/src/components/TableHistory.vue
index 44bdfc4..c3b21ee 100644
--- a/src/components/TableHistory.vue
+++ b/src/components/TableHistory.vue
@@ -361,7 +361,11 @@ watch(
         </q-td>
         <q-td v-if="tab === 'history'">
           <q-btn
-            v-if="!props.row.isEdit"
+            v-if="
+              !props.row.isEdit &&
+              (props.row.checkInStatus != 'ปกติ' ||
+                props.row.checkOutStatus != 'ปกติ')
+            "
             style="min-width: 110px"
             outline
             icon="edit"
@@ -495,6 +499,7 @@ watch(
     :click-close="closePopup"
     :title="titlePopup"
     :data-ById="dataRow"
+    action="edit"
   />
 </template>
 
diff --git a/src/components/ToolBar.vue b/src/components/ToolBar.vue
index b32a181..587b7a0 100644
--- a/src/components/ToolBar.vue
+++ b/src/components/ToolBar.vue
@@ -30,7 +30,7 @@ const filterYear = ref<number>(stores.year) //ปีงบประมาณ
 const titleName = ref<string>('เพิ่มรายการลงเวลากรณีพิเศษ') //หัว popup
 const dateMonth = ref<DataDateMonthObject>({
   month: new Date().getMonth(),
-  year: stores.year ? stores.year:new Date().getFullYear(),
+  year: stores.year ? stores.year : new Date().getFullYear(),
 })
 const modalPopup = ref<boolean>(false) // modal เพิ่มรายการลงเวลากรณีพิเศษ
 
@@ -154,6 +154,7 @@ watch(
 
     <q-space />
     <q-btn
+      v-if="tab === 'time'"
       unelevated
       icon="add"
       :dense="$q.screen.lt.sm"
@@ -168,6 +169,7 @@ watch(
     :title="titleName"
     :clickClose="onClickClose"
     :fetchData="props.fetchData"
+    action="special"
   />
 </template>
 
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index da900af..ad473a8 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -17,7 +17,7 @@ const { date2Thai, showLoader, hideLoader, messageError } = mixin
 const $q = useQuasar()
 
 const modalTime = ref<boolean>(false) // Dailog ลงเวลาเข้างานของคุณ
-const stetusCheckin = ref<boolean>(true) // สถานะเวลา เข้า,ออก
+const statusCheckin = ref<boolean>(true) // สถานะเวลา เข้า,ออก
 
 const msgCheckTime = ref<string>('') // ข้อความแจ้งเตือน
 const isDisabledCheckTime = ref<boolean>(false) // ข้อความแจ้งเตือน
@@ -30,7 +30,7 @@ async function fetchCheckTime() {
     .get(config.API.checkTime())
     .then(async (res) => {
       const data = await res.data.result
-      stetusCheckin.value = data.checkInId ? false : true
+      statusCheckin.value = data.checkInId ? false : true
       checkInId.value = data.checkInId ? data.checkInId : ''
     })
     .catch((err) => {
@@ -102,7 +102,7 @@ const model = ref<string>('') //  สถานที่ทำงาน
 // ตัวเลือกสถานที่ทำงาน
 const options = ref<string[]>([
   'ปฏิบัติงานที่บ้าน',
-  'ลืมลงเวลาปฏิบัติงาน',
+  // 'ลืมลงเวลาปฏิบัติงาน',
   'ไปประชุม/อบรม/สัมมนา/ปฏิบัติงานที่บ้านนอกสถานที่',
   'ขออนุญาตออกนอกสถานที่',
   'อื่นๆ',
@@ -236,8 +236,8 @@ async function confirm() {
 /** ปิด popup แสดงการลงเวลา*/
 async function onClickConfirm() {
   showLoader()
-  if (!stetusCheckin.value) {
-    stetusCheckin.value = true
+  if (!statusCheckin.value) {
+    statusCheckin.value = true
   }
 
   // await fetchCheckTime()
@@ -257,19 +257,19 @@ function updateWorkplace() {
 
 /**
  *  รี้เทินร์ class สีพื้นหลัง
- * @param val ค่า stetusCheckin
+ * @param val ค่า statusCheckin
  */
 const getClass = (val: boolean) => {
   return {
     'bg-primary text-white col-12 row items-center q-px-md q-py-sm ': val,
-    'bg-red-9 text-white col-12 row items-center q-px-md q-py-sm ': !val,
+    'bg-red-8 text-white col-12 row items-center q-px-md q-py-sm ': !val,
   }
 }
 
 const getClassXS = (val: boolean) => {
   return {
-    'bg-topIn text-white q-pa-lg col-12 row': val,
-    'bg-topOut text-white q-pa-lg col-12 row': !val,
+    'text-white q-pa-lg col-12 row bg-primary': val,
+    'text-white q-pa-lg col-12 row bg-red-8': !val,
   }
 }
 const inQueue = ref<boolean>(false)
@@ -335,22 +335,18 @@ onMounted(async () => {
           "
         >
           <!-- <q-header elevated class="bg-purple"> -->
-          <div :class="getClass(stetusCheckin)" class="gt-xs">
+          <div :class="getClass(statusCheckin)" class="gt-xs">
             <div class="col">
               <div class="row col-12 justify-center q-py-sm text-subtitle1">
-                <!-- <strong v-if="stetusCheckin" style="font-size: 1rem">
-                    ลงเวลาเข้างาน
-                  </strong> -->
-                <!-- <strong v-else style="font-size: 1rem">ลงเวลาออกงาน</strong> -->
-                <strong v-if="!stetusCheckin && inQueue">
+                <strong v-if="!statusCheckin && inQueue">
                   ลงเวลาออกงาน (ระบบกำลังประมวลผล)
                 </strong>
 
-                <strong v-else-if="stetusCheckin && inQueue">
+                <strong v-else-if="statusCheckin && inQueue">
                   ลงเวลาเข้างาน (ระบบกำลังประมวลผล)
                 </strong>
 
-                <strong v-else-if="stetusCheckin && !inQueue">
+                <strong v-else-if="statusCheckin && !inQueue">
                   ลงเวลาเข้างาน
                 </strong>
 
@@ -669,8 +665,10 @@ onMounted(async () => {
                   *หมายเหตุ คลิกลงเวลาเข้างานแล้วระบบจะลงเวลาทันที
                 </p>
                 <q-btn
-                  :label="stetusCheckin ? 'ลงเวลาเข้างาน' : 'ลงเวลาออกงาน'"
-                  :color="img == null ? 'grey-6' : 'primary'"
+                  :label="statusCheckin ? 'ลงเวลาเข้างาน' : 'ลงเวลาออกงาน'"
+                  :color="
+                    img == null ? 'grey-6' : statusCheckin ? 'primary' : 'red-8'
+                  "
                   push
                   size="18px"
                   :class="$q.screen.gt.xs ? 'q-px-md' : 'full-width q-pa-sm'"
@@ -693,23 +691,23 @@ onMounted(async () => {
 
   <!--  top page sticky  หน้ามือถือ-->
   <q-page-sticky expand position="top" v-if="$q.screen.xs">
-    <div :class="getClassXS(stetusCheckin)">
+    <div :class="getClassXS(statusCheckin)">
       <div class="col">
-        <div class="row col-12 justify-right items-center text-body1">
-          <strong v-if="!stetusCheckin && inQueue">
+        <div class="row col-12 justify-right items-center text-subtitle1">
+          <strong v-if="!statusCheckin && inQueue">
             ลงเวลาออกงาน (ระบบกำลังประมวลผล)
           </strong>
 
-          <strong v-else-if="stetusCheckin && inQueue">
+          <strong v-else-if="statusCheckin && inQueue">
             ลงเวลาเข้างาน (ระบบกำลังประมวลผล)
           </strong>
 
-          <strong v-else-if="stetusCheckin && !inQueue"> ลงเวลาเข้างาน </strong>
+          <strong v-else-if="statusCheckin && !inQueue"> ลงเวลาเข้างาน </strong>
 
           <strong v-else> ลงเวลาออกงาน </strong>
         </div>
         <div
-          class="text-white text-body2 row col-12"
+          class="text-white text-subtitle1 row col-12"
           style="line-height: 1.5rem"
         >
           {{ date2Thai(Thai) }}
@@ -749,8 +747,8 @@ onMounted(async () => {
         *หมายเหตุ คลิกลงเวลาเข้างานแล้วระบบจะลงเวลาทันที
       </p>
       <q-btn
-        :label="stetusCheckin ? 'ลงเวลาเข้างาน' : 'ลงเวลาออกงาน'"
-        :color="img == null ? 'grey-6' : 'primary'"
+        :label="statusCheckin ? 'ลงเวลาเข้างาน' : 'ลงเวลาออกงาน'"
+        :color="img == null ? 'grey-6' : statusCheckin ? 'primary' : 'red-8'"
         push
         size="18px"
         :class="$q.screen.gt.xs ? 'q-px-md' : 'full-width q-pa-sm'"
@@ -768,20 +766,27 @@ onMounted(async () => {
   <!-- แสดงการลงเวลา -->
   <q-dialog v-model="modalTime" persistent>
     <q-card class="full-width cardNone">
-      <div :class="getClass(stetusCheckin)">
+      <div class="col-12 row items-center q-px-md q-py-sm bg-grey-2">
         <div class="text-body1 text-center col-12 text-weight-bold">
-          <span v-if="stetusCheckin">ลงเวลาเข้างานของคุณ</span>
+          <span v-if="statusCheckin">ลงเวลาเข้างานของคุณ</span>
           <span v-else>ลงเวลาออกงานของคุณ</span>
         </div>
       </div>
       <q-card-section class="row col-12 justify-center">
-        <div class="bg-grey-2 rounded-borders q-pa-md col-11">
-          <div class="col-12 text-subtitle1 text-center text-weight-medium">
+        <div
+          class="rounded-borders q-pa-md col-11"
+          :class="statusCheckin ? 'bg-primary' : 'bg-red-8'"
+        >
+          <div
+            class="col-12 text-subtitle1 text-center text-white text-weight-medium"
+          >
             {{ date2Thai(Thai) }}
           </div>
           <div class="row col-12 justify-center q-pt-sm">
-            <div class="text-h3 text-weight-bold"></div>
-            <div class="text-h3 text-weight-bold">{{ timeChickin }}</div>
+            <!-- <div class="text-h3 text-white text-weight-bold"></div> -->
+            <div class="text-h3 text-white text-weight-bold">
+              {{ timeChickin }}
+            </div>
           </div>
         </div>
         <div class="col-12 text-center row q-pt-md">
diff --git a/src/views/MapView.vue b/src/views/MapView.vue
index 6b0beaa..c62910f 100644
--- a/src/views/MapView.vue
+++ b/src/views/MapView.vue
@@ -99,7 +99,7 @@ const location = ref<string>('')
 const model = ref<string>('')
 const options = ref<string[]>([
   'ปฏิบัติงานที่บ้าน',
-  'ลืมลงเวลาปฏิบัติงาน',
+  // 'ลืมลงเวลาปฏิบัติงาน',
   'ไปประชุม/อบรม/สัมมนา/ปฏิบัติงานที่บ้านนอกสถานที่',
   'ขออนุญาตออกนอกสถานที่',
   'อื่นๆ',