ปรับการแก้ไขการลงเวลาปฏิบัติงาน

src/modules/09_leave/components/1_Work/DialogEdit.vue

@@ -34,7 +34,7 @@ const props = defineProps({
 });
 
 const morningStatus = ref<string>("");
-const afternoonStatus = ref<string>("");
+const afternoonStatus = ref<string | null>("");
 const reason = ref<string>("");
 
 const morningStatusRef = ref<any>();
@@ -50,7 +50,11 @@ const options = ref<DataOption[]>(optionsMain.value);
 async function onClickSave() {
   morningStatusRef.value?.validate();
   afternoonStatusRef.value?.validate();
-  if (!morningStatusRef.value.hasError && !afternoonStatusRef.value.hasError) {
+  if (
+    !morningStatusRef.value.hasError && props.detail?.checkOutStatus !== "-"
+      ? !afternoonStatusRef.value.hasError
+      : true
+  ) {
     const body = {
       checkInStatus: morningStatus.value,
       checkOutStatus: afternoonStatus.value,
@@ -84,13 +88,33 @@ function filterFnOptions(val: any, update: Function) {
   });
 }
 
+function convertStatu(val: string) {
+  switch (val) {
+    case "ปกติ":
+      return "NORMAL";
+    case "สาย":
+      return "LATE";
+    case "ขาดราชการ":
+      return "ABSENT";
+  }
+}
+
 watch(
   () => props.modal,
   () => {
-    props.modal &&
-      ((morningStatus.value = ""),
-      (afternoonStatus.value = ""),
-      (reason.value = ""));
+    if (props.modal) {
+      const checkInStatus: string | undefined = props.detail?.checkInStatus
+        ? convertStatu(props.detail?.checkInStatus)
+        : "";
+
+      const checkOutStatus: string | undefined = props.detail?.checkOutStatus
+        ? convertStatu(props.detail?.checkOutStatus)
+        : "";
+
+      morningStatus.value = checkInStatus ? checkInStatus : "";
+      afternoonStatus.value = checkOutStatus ? checkOutStatus : "-";
+      reason.value = "";
+    }
   }
 );
 </script>
@@ -130,9 +154,15 @@ watch(
             >
           </div>
         </q-card>
-        <q-card flat bordered class="col-12 q-mt-sm">
+        <q-card
+          flat
+          bordered
+          class="col-12 q-mt-sm"
+          v-if="props.detail?.checkOutStatus !== '-'"
+        >
           <div class="q-pa-sm text-green-8">
             สถานะช่วงบ่าย
+
             <q-select
               ref="afternoonStatusRef"
               class="q-pa-sm"