api ถึงแก่กรรม

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2023-08-08 16:50:50 +07:00
parent 04f79de4c1
commit c51f66c808
6 changed files with 416 additions and 92 deletions

View file

@ -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>