api ถึงแก่กรรม

src/api/06_retirement/api.retirement.ts

@@ -11,4 +11,9 @@ export default {
     reasonId: (retireId: string) => `${retirement}/reason/${retireId}`,
     retirement: (type: string, year: string) => `${retirement}/${type}/${year}`,
     createProfile: () => `${retirement}/profile`,
+
+    //RetirementDeceased ถึงแก่กรรม
+    listDeceased: () => `${retirement}/deceased`,
+    detailDeceased: (id: string) => `${retirement}/deceased/${id}`
+
 };

src/api/registry/api.profile.ts

@@ -182,4 +182,8 @@ export default {
 
   profileCitizenId: (citizenId: string) => `${profile}citizenId/${citizenId}`,
   profileEmployeeIn: `${profile}information/employee`,
+
+
+
+
 };

src/modules/04_registry/components/Profile.vue

@@ -472,12 +472,28 @@
             <q-space />
           </q-card-section>
           <q-separator />
-          <DialogFooter
+          <div class="flex justify-end q-pa-sm q-gutter-sm">
+            <q-btn
+              unelevated
+              label="บันทึก"
+              color="public"
+              @click="clickSaveDeceased"
+              :disable="
+                filePassaway === null ||
+                deathCertificateNo === '' ||
+                placeDeathCertificate === '' ||
+                reasonDeath === ''
+              "
+            >
+              <q-tooltip>บันทึก</q-tooltip>
+            </q-btn>
+          </div>
+          <!-- <DialogFooter
             :save="clickSave"
             :validate="validateData"
             v-model:editvisible="edit"
             v-model:modalEdit="modalEdit"
-          />
+          /> -->
         </q-form>
       </q-card>
     </div>
@@ -704,7 +720,7 @@ const dialogPassaway = ref<boolean>(false);
 const loader = ref<boolean>(false); //รอโหลด
 const statusEdit = ref<boolean>(false);
 const activeImage = ref<any | null>(null);
-const filePassaway = ref(null);
+const filePassaway = ref<any>(null);
 const images = ref<any>([]);
 const checkValidate = ref<boolean>(false); //validate data ผ่านหรือไม่
 const myForm = ref<QForm | null>(null); //form data input
@@ -1188,6 +1204,50 @@ const Retire = async () => {
       });
   }
 };
+const clickSaveDeceased = async () => {
+  // console.log(
+  //   filePassaway.value,
+  //   deathCertificateNo.value,
+  //   placeDeathCertificate.value,
+  //   reasonDeath.value
+  // );
+  const formData = new FormData();
+  formData.append("File", filePassaway.value);
+  formData.append("Number", deathCertificateNo.value);
+  formData.append("Date", dateToISO(dateDeath.value));
+  formData.append("Location", placeDeathCertificate.value);
+  formData.append("Reason", reasonDeath.value);
+  formData.append("ProfileId", profileId.value);
+
+  $q.dialog({
+    title: "ยืนยันการบันทึกข้อมูล",
+    message: "ต้องการบันทึกข้อมูลนี้ใช่หรือไม่?",
+    cancel: {
+      flat: true,
+      color: "negative",
+    },
+    persistent: true,
+  })
+    .onOk(async () => {
+      showLoader();
+      await http
+        .post(config.API.listDeceased(), formData)
+        .then(() => {
+          success($q, "บันทึกข้อมูลสำเร็จ");
+          router.push("/deceased");
+
+        })
+        .catch((e) => {
+          console.log(e);
+          messageError($q, e);
+        })
+        .finally(()=>{
+          hideLoader();
+        })
+    })
+    .onCancel(() => {})
+    .onDismiss(() => {});
+};
 </script>
 <style>
 .image-size-default {

src/modules/06_retirement/components/resign/Deceased.vue

@@ -1,34 +1,17 @@
 <script setup lang="ts">
-import { ref } from "vue";
+import { ref, onMounted } from "vue";
 import type { QTableProps } from "quasar";
+import { useQuasar } from "quasar";
+import { useCounterMixin } from "@/stores/mixin";
 import { useRouter } from "vue-router";
-// const router = useRouter();
-const pagination = ref({
-    sortBy: "desc",
-    descending: false,
-    page: 1,
-    rowsPerPage: 10,
-  });
-  const paging = ref<boolean>(true);
-  const paginationLabel = (start: string, end: string, total: string) => {
-    if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
-    else return start + "-" + end + " ใน " + total;
-  };
-const visibleColumns = ref<string[]>([ "prefix", "fullname", "positionType", "position", "positionLevel", "positionExecutive", "oc"]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
-const filterKeyword = ref<string>("");
-const filterRef = ref<any>(null);
-const resetFilter = () => {
-  filterKeyword.value = "";
-  filterRef.value.focus();
-};
+import http from "@/plugins/http";
+import config from "@/app.config";
+const router = useRouter();
+const $q = useQuasar();
+const mixin = useCounterMixin();
+const { showLoader, hideLoader, messageError, success } = mixin;
 
-// const nextPage = (id:string) => {
-//   router.push("/retirement/resign/"+id);
-// };
-const rows = ref<any>([
-  { personalId:"0a846508-4932-40de-9a9e-5b519492217c",prefix: "นางสาว", fullname: "นางสาวอย พชช", positionType: "บริหาร", position: "นักบริหาร", positionLevel: "ต้น", positionExecutive: "ผู้ช่วยหัวหน้าสำนักงาน", oc: "สำนักงานคณะกรรมการข้าราชการกรุงเทพมหานคร"},
-  { personalId:"0a846508-4932-40de-9a9e-5b519492227c",prefix: "นางสาว", fullname: "นางสาววญ สพ", positionType: "วิชาการ", position: "นักจัดการงานทั่วไป", positionLevel: "ปฏิบัติการ", positionExecutive: "-", oc: "กลุ่มงานช่วยนักบริหาร"},
-]);
+const rows = ref<any>([]);
 const columns = ref<QTableProps["columns"]>([
   {
     name: "prefix",
@@ -93,37 +76,77 @@ const columns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-
 ]);
+const visibleColumns = ref<string[]>([
+  "prefix",
+  "fullname",
+  "positionType",
+  // "position",
+  "positionLevel",
+  "positionExecutive",
+  "oc",
+]);
+onMounted(() => {
+  fectListDecased();
+});
+const fectListDecased = async () => {
+  showLoader();
+  await http
+    .get(config.API.listDeceased())
+    .then((res) => {
+      console.log(res);
+      rows.value = res.data.result.map((e: any) => ({
+        personalId: e.id,
+        prefix: e.prefix,
+        fullname: e.firstName + "   " + e.lastName,
+        positionType: e.positionType,
+        // position: e.position,
+        positionLevel: e.positionLevel,
+        positionExecutive: e.positionExecutive,
+        oc: e.organization,
+      }));
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+};
+
+const paging = ref<boolean>(true);
+const pagination = ref({
+  sortBy: "desc",
+  descending: false,
+  page: 1,
+  rowsPerPage: 10,
+});
+const paginationLabel = (start: string, end: string, total: string) => {
+  if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
+  else return start + "-" + end + " ใน " + total;
+};
+
+//ค้นหา คอลัมน์ คอลัมน์ที่แสดง
+const filterKeyword = ref<string>("");
+const filterRef = ref<any>(null);
+const resetFilter = () => {
+  filterKeyword.value = "";
+  filterRef.value.focus();
+};
+const nextPage = (id: string) => {
+  router.push("/deceased/" + id);
+};
 </script>
 <template>
-  <div class="toptitle text-dark col-12 row items-center">รายการบันทึกเวียนแจ้งการถึงแก่กรรม</div>
+  <div class="toptitle text-dark col-12 row items-center">
+    รายการบันทึกเวียนแจ้งการถึงแก่กรรม
+  </div>
   <q-card flat bordered class="col-12 q-mt-sm">
     <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
-            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"
-          /> -->
-
           <q-space />
-
           <q-input
             class="col-xs-12 col-sm-3 col-md-2"
             standout
@@ -175,19 +198,21 @@ const columns = ref<QTableProps["columns"]>([
             class="custom-header-table"
             :visible-columns="visibleColumns"
             :pagination-label="paginationLabel"
-              v-model:pagination="pagination"
+            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-tr>
             </template>
             <template v-slot:body="props">
-              <q-tr :props="props" class="cursor-pointer">
+              <q-tr
+                :props="props"
+                class="cursor-pointer"
+                @click="nextPage(props.row.personalId)"
+              >
                 <!-- <q-td key="no" :props="props">
                   {{ props.rowIndex + 1 }}
                 </q-td> -->
@@ -212,8 +237,6 @@ const columns = ref<QTableProps["columns"]>([
                 <q-td key="oc" :props="props">
                   {{ props.row.oc }}
                 </q-td>
-
-
               </q-tr>
             </template>
             <template v-slot:pagination="scope">
@@ -235,34 +258,34 @@ const columns = ref<QTableProps["columns"]>([
   </q-card>
 </template>
 <style scoped lang="scss">
-  .custom-header-table {
-    max-height: 64vh;
-  
-    .q-table tr:nth-child(odd) td {
-      background: white;
-    }
-  
-    .q-table tr:nth-child(even) td {
-      background: #f8f8f8;
-    }
-  
-    .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;
-    }
+.custom-header-table {
+  max-height: 64vh;
+
+  .q-table tr:nth-child(odd) td {
+    background: white;
   }
-</style>
+
+  .q-table tr:nth-child(even) td {
+    background: #f8f8f8;
+  }
+
+  .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>

src/modules/06_retirement/components/resign/DetailDeceased.vue

@@ -0,0 +1,221 @@
+<template>
+  <div class="toptitle text-dark col-12 row items-center">
+    <q-btn
+      icon="mdi-arrow-left"
+      unelevated
+      round
+      dense
+      flat
+      color="primary"
+      class="q-mr-sm"
+      @click="router.go(-1)"
+    />
+    รายละเอียดบันทึกเวียนแจ้งการถึงแก่กรรม {{ detail.firstName }}
+    {{ detail.lastName }}
+  </div>
+  <q-card bordered class="row col-12 text-dark">
+    <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
+      <div class="q-pl-sm text-weight-bold text-subtitle2">
+        {{ detail.firstName + "    " + detail.lastName }}
+      </div>
+      <q-space />
+      <q-btn
+        outline
+        color="blue"
+        dense
+        icon-right="mdi-open-in-new"
+        class="q-px-sm"
+        label="ดูข้อมูลทะเบียนประวัติ"
+        @click="redirectToRegistry(detail.id)"
+      />
+    </div>
+    <div class="col-12"><q-separator /></div>
+    <div class="row col-12 q-pa-md">
+      <div class="col-12 row bg-white q-col-gutter-md">
+        <div class="col-xs-3 col-sm-2 col-md-1 row">
+          <q-img src="@/assets/avatar_user.jpg" />
+        </div>
+        <div class="col-xs-6 col-sm-3 row items-center">
+          <div class="col-12 q-pl-md">
+            <div class="col-12 text-top">ตำแหน่งในสายงาน</div>
+            <div class="col-12 text-detail">{{ detail.positionExecutive }}</div>
+          </div>
+        </div>
+        <div class="col-xs-6 col-sm-2 row items-center">
+          <div class="col-12">
+            <div class="col-12 text-top">ระดับ</div>
+            <div class="col-12 text-detail">{{ detail.positionLevel }}</div>
+          </div>
+        </div>
+        <div class="col-xs-6 col-sm row items-center">
+          <div class="col-12">
+            <div class="col-12 text-top">สังกัด</div>
+            <div class="col-12 text-detail">{{ detail.organization }}</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </q-card>
+
+  <q-card bordered class="row col-12 text-dark q-mt-sm">
+    <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
+      <div class="q-pl-sm text-weight-bold text-dark">ข้อมูลการถึงแก่กรรม</div>
+      <q-space />
+      <div class="q-gutter-x-sm">
+        <q-btn
+          flat
+          outline
+          color="red"
+          dense
+          icon-right="mdi-file-pdf"
+          class="q-px-sm"
+        />
+        <q-btn
+          flat
+          outline
+          color="blue"
+          dense
+          icon-right="mdi-file-word"
+          class="q-px-sm"
+        />
+      </div>
+    </div>
+    <div class="col-12"><q-separator /></div>
+    <div class="row col-12 q-pa-md">
+      <div class="col-12 row bg-white q-col-gutter-md">
+        <div class="col-xs-6 col-sm-3 row items-center">
+          <div class="col-12">
+            <div class="col-12 text-top">เลขที่ใบมรณบัตร</div>
+            <div class="col-12 text-detail">
+              {{ detail.number }}
+            </div>
+          </div>
+        </div>
+        <div class="col-xs-6 col-sm-3 row items-center">
+          <div class="col-12">
+            <div class="col-12 text-top">สถานที่ออกใบมรณบัตร</div>
+            <div class="col-12 text-detail">{{ detail.location }}</div>
+          </div>
+        </div>
+
+        <div class="col-xs-6 col-sm-3 row items-center">
+          <div class="col-12">
+            <div class="col-12 text-top">เหตุผลการเสียชีวิต</div>
+            <div class="col-12 text-detail">{{ detail.reason }}</div>
+          </div>
+        </div>
+        <div class="col-xs-6 col-sm-3 row items-center">
+          <div class="col-12">
+            <div class="col-12 text-top">วันที่เสียชีวิต</div>
+            <div class="col-12 text-detail">{{ date2Thai(detail.date) }}</div>
+          </div>
+        </div>
+        <div class="col-xs-6 col-sm-3 row items-center">
+          <div class="col-12">
+            <div class="col-12 text-top">ใบมรณบัตร</div>
+            <div class="col-12 text-detail">
+              <q-btn
+                flat
+                round
+                color="red"
+                icon="mdi-file-pdf"
+                @click="nextPage(detail.pathName)"
+              >
+                <q-tooltip>ใบมรณบัตร</q-tooltip></q-btn
+              >
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </q-card>
+</template>
+<script setup lang="ts">
+import { useRouter, useRoute } from "vue-router";
+import { useQuasar } from "quasar";
+import { ref, onMounted } from "vue";
+import { useCounterMixin } from "@/stores/mixin";
+import http from "@/plugins/http";
+import config from "@/app.config";
+
+const $q = useQuasar();
+const router = useRouter();
+const route = useRoute();
+const mixin = useCounterMixin();
+const { showLoader, hideLoader, messageError, date2Thai } = mixin;
+
+const profileId = ref<string>(route.params.id.toString());
+const detail = ref<any>([]);
+
+onMounted(() => {
+  console.log(profileId.value);
+  fectdata();
+});
+const fectdata = async () => {
+  showLoader();
+  await http
+    .get(config.API.detailDeceased(profileId.value))
+    .then((res) => {
+      detail.value = res.data.result;
+      console.log(detail.value);
+    })
+    .catch((e) => {
+      console.log(e);
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+};
+const redirectToRegistry = (id: string) => {
+  console.log(id);
+  router.push(`/registry/${id}`);
+};
+const nextPage = (page: string) => {
+  window.open(page, "_blank");
+};
+</script>
+<style lang="scss" scope>
+.q-img {
+  border-radius: 5px;
+  height: 70px;
+}
+.text-top {
+  color: gray;
+  font-weight: 400;
+  padding-bottom: 3px;
+}
+.text-detail {
+  font-weight: 500;
+}
+.custom-header-table {
+  max-height: 64vh;
+
+  .q-table tr:nth-child(odd) td {
+    background: white;
+  }
+
+  .q-table tr:nth-child(even) td {
+    background: #f8f8f8;
+  }
+
+  .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>

src/modules/06_retirement/router.ts

@@ -6,10 +6,11 @@ const Main = () => import("@/modules/06_retirement/views/Main.vue");
 const Listretirement = () => import("@/modules/06_retirement/components/ListRetirement/TableList.vue")
 const resignOrder = () => import("@/modules/06_retirement/components/resign/ResignOrder.vue");
 const resign = () => import("@/modules/06_retirement/components/resign/Resign.vue");
-const resignByid = () => import("@/modules/06_retirement/components/resign/ResignByid.vue")
-const deceased = () => import("@/modules/06_retirement/components/resign/Deceased.vue")
-const dismissOrder = () => import("@/modules/06_retirement/components/DismissOrder/DismissOrder.vue")
-const addOrder = () => import("@/modules/06_retirement/components/DismissOrder/AddOrder.vue")
+const resignByid = () => import("@/modules/06_retirement/components/resign/ResignByid.vue");
+const deceased = () => import("@/modules/06_retirement/components/resign/Deceased.vue");
+const detaildeceased = () => import("@/modules/06_retirement/components/resign/DetailDeceased.vue");
+const dismissOrder = () => import("@/modules/06_retirement/components/DismissOrder/DismissOrder.vue");
+const addOrder = () => import("@/modules/06_retirement/components/DismissOrder/AddOrder.vue");
 export default [
   {
     path: "/retirement",
@@ -81,6 +82,16 @@ export default [
       Role: "retirement",
     },
   },
+  {
+    path: "/deceased/:id",
+    name: "deceased-detail",
+    component: detaildeceased,
+    meta: {
+      Auth: true,
+      Key: [7.8],
+      Role: "retirement",
+    },
+  },
   {
     path: "/dismiss-order",
     name: "dismiss-order",