ประกาศเกษียณอายุราชการ

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2023-09-19 16:45:07 +07:00
parent 1530da36cf
commit f592008bbe
6 changed files with 438 additions and 580 deletions

View file

@ -8,10 +8,9 @@ import { useRoute } from "vue-router";
const $q = useQuasar(); // noti quasar
const mixin = useCounterMixin();
const { messageError, success, showLoader, hideLoader } = mixin;
const { messageError, success, showLoader, hideLoader, dialogConfirm } = mixin;
const route = useRoute();
const type_params = route.params.type;
const retireld_params = route.params.id;
const props = defineProps({
retireld: String,
@ -65,57 +64,16 @@ const columns = ref<any["columns"]>([
align: "left",
},
]);
const rows = ref<any>([
// {
// fullname: " ",
// position: "",
// level: "",
// affiliation: " ",
// },
// {
// fullname: " ",
// position: "",
// level: "",
// affiliation: " ",
// },
// {
// fullname: " ",
// position: "",
// level: "",
// affiliation: " ",
// },
// {
// fullname: " ",
// position: "",
// level: "",
// affiliation: " ",
// },
// {
// fullname: " ",
// position: "",
// level: "",
// affiliation: " ",
// },
// {
// fullname: " ",
// position: "",
// level: "",
// affiliation: " ",
// },
// {
// fullname: " ",
// position: "",
// level: "",
// affiliation: " ",
// },
]);
const rows = ref<any>([]);
watch(modal, () => {
if (modal.value === true) {
retireld.value = props.retireld;
if (props.dataProfile.type === "OFFICER") {
type.value = "officer";
} else type.value = "all";
if (props.dataProfile) {
if (props.dataProfile.type === "OFFICER") {
type.value = "officer";
} else type.value = "all";
}
fecthlistRetire();
}
@ -146,14 +104,11 @@ const findlist = async (id: string) => {
{ criteriaType: "employee_class", criteriaValue: "perm" },
];
}
// console.log(data);
await http
.post(config.API.profileSearchNewOcIdType(id, type.value), {
criterias: data,
})
.then((res) => {
// console.log(res.data.result);
rows.value = res.data.result.map((e: any) => ({
id: e.id,
fullname: e.fullname,
@ -172,25 +127,13 @@ const findlist = async (id: string) => {
// putlist
const clickAdd = (props: any) => {
// console.log("props===>",props.row.id)
if (retireld.value == undefined) {
retireld.value = retireld_params;
}
let data: any = props.row.id;
// console.log("retireld & profileId", retireld.value, data);
$q.dialog({
title: "ยืนยันการเพิ่มข้อมูล",
message: "ต้องการเพิ่มข้อมูลนี้ใช่หรือไม่?",
cancel: {
flat: true,
color: "negative",
},
persistent: true,
})
.onOk(async () => {
// console.log("");
dialogConfirm(
$q,
async () => {
await http
.put(config.API.profileRetire(retireld.value), { profileId: data })
.then(() => {
@ -201,12 +144,12 @@ const clickAdd = (props: any) => {
messageError($q, e);
})
.finally(() => {
// fecthlistRetire();
modal.value = false;
});
})
.onCancel(() => {})
.onDismiss(() => {});
},
"ยืนยันการเพิ่มข้อมูล",
"ต้องการเพิ่มข้อมูลนี้ใช่หรือไม่ ?"
);
};
// update retireld
const updateListData = (retireld: string, pId: string) => {
@ -294,9 +237,6 @@ const paginationLabel = (start: number, end: number, total: number) => {
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td>{{ props.rowIndex + 1 }}</q-td>
<!-- <q-td key="order" :props="props">
{{ props.row.order }}
</q-td> -->
<q-td key="fullname" :props="props">
{{ props.row.fullname }}
</q-td>

View file

@ -14,7 +14,14 @@ const route = useRoute();
const router = useRouter();
const $q = useQuasar();
const mixin = useCounterMixin();
const { showLoader, hideLoader, messageError, success, dialogConfirm } = mixin;
const {
showLoader,
hideLoader,
messageError,
success,
dialogConfirm,
dialogRemove,
} = mixin;
const retireld_params = route.params.retirementId;
const modalNote = ref<boolean>(false);
@ -26,7 +33,6 @@ const filter = ref<string>("");
const statusUpload = ref<boolean>();
const modalEdit = ref<boolean>(false);
const textReport = ref<string>("");
const columns = ref<any["columns"]>([
{
name: "order",
@ -161,7 +167,6 @@ const fecthlistprofile = async (id: string) => {
await http
.get(config.API.listRetire(id))
.then((res) => {
console.log(res);
dataProfile.value = res.data.result;
round.value = res.data.result.round;
statusReport.value = res.data.result.json;
@ -182,7 +187,6 @@ const fecthlistprofile = async (id: string) => {
reason: e.reason,
remove: e.remove,
}));
console.log(statusReport.value);
if (statusReport.value == false) {
fecthCheck(retireld.value);
} else statusUpload.value = true;
@ -194,6 +198,7 @@ const fecthlistprofile = async (id: string) => {
hideLoader();
});
};
//
const fecthCheck = async (id: string) => {
await http
.get(config.API.checkfileupload(id))
@ -201,21 +206,14 @@ const fecthCheck = async (id: string) => {
statusUpload.value = res.data.result;
})
.catch((err) => {
console.log(err);
messageError($q, err);
});
};
// DelProfile
const clickDelete = () => {
$q.dialog({
title: "ยืนยันการลบข้อมูล",
message: "ต้องการลบข้อมูลนี้ใช่หรือไม่?",
cancel: {
flat: true,
color: "negative",
},
persistent: true,
})
.onOk(async () => {
dialogRemove(
$q,
async () => {
await http
.post(config.API.removeProfile(), {
retireProfileId: retireProfileId.value,
@ -232,36 +230,16 @@ const clickDelete = () => {
await fecthlistprofile(retireld.value);
modalNote.value = false;
});
})
.onCancel(() => {})
.onDismiss(() => {});
};
// note
// const fetchReason = async (prop: string) => {
// await http
// .get(config.API.reasonId(prop))
// .then((res: any) => {
// console.log(res.data.result);
// note.value = res.data.result.reason;
// retireProfileId.value = res.data.result.id;
// })
// .catch((e: any) => {
// messageError($q, e);
// });
// };
const saveNote = () => {
console.log(retireProfileId.value, note.value);
$q.dialog({
title: "ยืนยันการบันทึกข้อมูลข้อมูล",
message: "ต้องการบันทึกข้อมูลนี้ใช่หรือไม่?",
cancel: {
flat: true,
color: "negative",
},
persistent: true,
})
.onOk(async () => {
"ยืนยันการลบข้อมูล",
"ต้องการลบข้อมูลนี้ใช่หรือไม่ ?"
);
};
//
const saveNote = () => {
dialogConfirm(
$q,
async () => {
await http
.post(config.API.createnote(), {
retireProfileId: retireProfileId.value,
@ -278,15 +256,15 @@ const saveNote = () => {
fecthlistprofile(retireld.value);
modalNote.value = false;
});
})
.onCancel(() => {})
.onDismiss(() => {});
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการบันทึกข้อมูลนี้ใช่หรือไม่ ?"
);
};
const UpdateListId = (retireld: string, pId: string) => {
profileId.value = pId;
fecthlistprofile(retireld);
console.log("profileId", profileId.value);
};
const backHistory = () => {
window.history.back();
@ -299,13 +277,11 @@ const visibleNote = computed(() => {
const uploadFile = async (event: any) => {
showLoader();
const selectedFile = event;
console.log(selectedFile);
const formdata = new FormData();
formdata.append("file", selectedFile);
await http
.put(config.API.fileRetirement(retireld.value.toString()), formdata)
.then((res) => {
.then(() => {
success($q, "เพิ่มไฟล์สำเร็จ");
})
.catch((err) => {
@ -326,9 +302,6 @@ const downloadAttachment = async (type: string, id: string) => {
responseType: "blob",
})
.then(async (res) => {
const data = res.data.result;
console.log(data);
let list: any[] = [];
downloadFile(res, `${"รายชื่อผู้เกษียณอายุราชการ"}.${type}`);
})
.catch((e) => {
@ -562,6 +535,7 @@ const paginationLabel = (start: number, end: number, total: number) => {
statusUpload !== true
"
/>
<q-th auto-width v-else></q-th>
<q-th
auto-width
v-if="
@ -572,6 +546,7 @@ const paginationLabel = (start: number, end: number, total: number) => {
statusUpload !== true
"
/>
<q-th auto-width v-else></q-th>
</q-tr>
</template>
<template v-slot:body="props">
@ -639,6 +614,7 @@ const paginationLabel = (start: number, end: number, total: number) => {
<q-tooltip>กรอกเหตผล</q-tooltip>
</q-btn>
</q-td>
<q-td auto-width v-else></q-td>
<q-td
auto-width
v-if="
@ -664,6 +640,7 @@ const paginationLabel = (start: number, end: number, total: number) => {
><q-tooltip>ลบขอม</q-tooltip></q-btn
>
</q-td>
<q-td auto-width v-else></q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">

View file

@ -0,0 +1,200 @@
<script setup lang="ts">
import { ref } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useRouter } from "vue-router";
import http from "@/plugins/http";
import config from "@/app.config";
const $q = useQuasar();
const mixin = useCounterMixin();
const { dialogConfirm, messageError } = mixin;
const router = useRouter();
const props = defineProps({
type: {
type: String,
},
year: {
type: Number,
},
rows: {
type: Object,
},
actionOptio: {
type: Object,
},
checkjson: {
type: Boolean,
},
});
const modal = ref<boolean>(false);
const radio = ref<string>("");
const actionOption = ref<any>([]);
const action = ref<string>("");
//
const clickAdd = () => {
if (props.rows) {
//
if (props.rows.length == 0) {
dialogConfirm(
$q,
async () => {
let data = { type: props.type, year: props.year };
await cerateRetirement(data);
},
"ยืนยันการเพิ่มข้อมูลประกาศเกษียณ",
"ต้องการเพิ่มข้อมูลประกาศเกษียณใช่หรือไม่ ?"
);
} else {
modal.value = true;
action.value = "";
radio.value = "";
if (props.actionOptio) {
actionOption.value = props.actionOptio;
}
}
}
};
//
const clickSelect = async (action: string) => {
dialogConfirm(
$q,
async () => {
let data = {
type: props.type,
year: props.year,
retireHistoryId: action,
option: radio.value,
};
await cerateRetirement(data);
},
"ยืนยันการแก้ไขข้อมูลประกาศเกษียณ",
"ต้องการแก้ไขข้อมูลประกาศเกษียณใช่หรือไม่ ?"
);
};
// API
const cerateRetirement = async (data: object) => {
await http
.post(config.API.createProfile(), data)
.then((res) => {
let response = res.data.result;
let retirementId = response.id;
router.push(`/retirement/${retirementId}`);
})
.catch((e) => {
messageError($q, e);
});
};
</script>
<template>
<q-btn
size="12px"
flat
round
color="add"
icon="mdi-plus"
@click="clickAdd"
:disable="checkjson"
>
<q-tooltip>เพ</q-tooltip>
</q-btn>
<q-dialog v-model="modal">
<q-card style="width: 450px; max-width: 80vw">
<q-card-section>
<div class="text-h6">เพมประกาศ</div>
</q-card-section>
<q-card-section class="q-pt-none">
เลอกประกาศทองการเพมขอม
</q-card-section>
<q-separator />
<div class="q-pa-md">
<q-list>
<q-item class="q-item-custom">
<q-item-section avatar class="q-item-custom">
<q-radio
v-model="radio"
val="ADD"
color="teal"
@click="action = ''"
/>
</q-item-section>
<q-item-section>
<q-item-label>ประกาศเพมผเกษยณ</q-item-label>
</q-item-section>
</q-item>
<q-item class="q-item-custom">
<q-item-section avatar class="q-item-custom">
<q-radio
v-model="radio"
val="EDIT"
color="teal"
@click="action = ''"
/>
</q-item-section>
<q-item-section>
<q-item-label>ประกาศแกไขขอมลผเกษยณ</q-item-label>
<q-item-label v-if="radio === 'EDIT'">
<q-select
dense
v-model="action"
:options="actionOption"
label="เลือกรอบ"
option-label="round"
option-value="id"
emit-value
map-options
:rules="[(val) => !!val || 'กรุณาเลือกรอบ']"
/>
</q-item-label>
</q-item-section>
</q-item>
<q-item class="q-item-custom">
<q-item-section avatar class="q-item-custom">
<q-radio
v-model="radio"
val="REMOVE"
color="teal"
@click="action = ''"
/>
</q-item-section>
<q-item-section>
<q-item-label>ประกาศยกเลกผเกษยณ</q-item-label>
<q-item-label v-if="radio === 'REMOVE'">
<q-select
dense
v-model="action"
:options="actionOption"
label="เลือกรอบ"
option-label="round"
option-value="id"
emit-value
map-options
:rules="[(val) => !!val || 'กรุณาเลือกรอบ']"
/></q-item-label>
</q-item-section>
</q-item>
</q-list>
</div>
<q-separator />
<q-card-actions align="right" class="bg-white text-teal">
<q-btn flat label="ยกเลิก" color="red" v-close-popup />
<q-btn
flat
label="ตกลง"
@click="clickSelect(action)"
:disable="radio === '' || (action === '' && radio !== 'ADD')"
/>
</q-card-actions>
</q-card>
</q-dialog>
</template>
<style scoped></style>

View file

@ -1,6 +1,8 @@
import { defineStore } from "pinia";
import { ref } from 'vue'
export const useDataStoreRetirement = defineStore("retirementDatastore", () => {
const taboption = ref<any>([{ name: "officer", id: "officer", label: 'ขรก.กทม.สามัญ' },
{ name: "employee", id: "employee", label: "ลูกจ้างประจำ" }])
const tab = ref<any>("officer");
const type = ref<string>("officer");
const clickTab = (role: string) => {
@ -9,6 +11,7 @@ export const useDataStoreRetirement = defineStore("retirementDatastore", () => {
return {
tab,
type,
clickTab
clickTab,
taboption
};
});

View file

@ -1,291 +1,6 @@
<template>
<div class="toptitle text-dark col-12 row items-center">
ประกาศเกษยณอายราชการ
</div>
<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="officer"
label="ขรก.กทม.สามัญ"
@click="clickTab('officer')"
/>
<q-tab
name="employee"
label="ลูกจ้างประจำ"
@click="clickTab('employee')"
/>
</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
emit-value
map-options
:options="yearOptions"
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"
/>
<div>
<q-btn
@click="clickAdd()"
size="12px"
flat
round
color="add"
icon="mdi-plus"
:disable="checkjson == true"
>
<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 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"
@click="nextPage(props.row)"
>
<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.total }}
</q-td>
<q-td key="typeReport" :props="props">
{{ props.row.typeReport }}
</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>
<q-dialog v-model="modal">
<q-card style="width: 450px; max-width: 80vw">
<q-card-section>
<div class="text-h6">เพมประกาศ</div>
</q-card-section>
<q-card-section class="q-pt-none">
เลอกประกาศทองการเพมขอม
</q-card-section>
<q-separator />
<div class="q-pa-md">
<q-list>
<q-item class="q-item-custom">
<q-item-section avatar class="q-item-custom">
<q-radio
v-model="radio"
val="ADD"
color="teal"
@click="action = ''"
/>
</q-item-section>
<q-item-section>
<q-item-label>ประกาศเพมผเกษยณ</q-item-label>
</q-item-section>
</q-item>
<q-item class="q-item-custom">
<q-item-section avatar class="q-item-custom">
<q-radio
v-model="radio"
val="EDIT"
color="teal"
@click="action = ''"
/>
</q-item-section>
<q-item-section>
<q-item-label>ประกาศแกไขขอมลผเกษยณ</q-item-label>
<q-item-label v-if="radio === 'EDIT'">
<q-select
dense
v-model="action"
:options="actionOption"
label="เลือกรอบ"
option-label="round"
option-value="id"
emit-value
map-options
:rules="[(val) => !!val || 'กรุณาเลือกรอบ']"
/>
</q-item-label>
</q-item-section>
</q-item>
<q-item class="q-item-custom">
<q-item-section avatar class="q-item-custom">
<q-radio
v-model="radio"
val="REMOVE"
color="teal"
@click="action = ''"
/>
</q-item-section>
<q-item-section>
<q-item-label>ประกาศยกเลกผเกษยณ</q-item-label>
<q-item-label v-if="radio === 'REMOVE'">
<q-select
dense
v-model="action"
:options="actionOption"
label="เลือกรอบ"
option-label="round"
option-value="id"
emit-value
map-options
:rules="[(val) => !!val || 'กรุณาเลือกรอบ']"
/></q-item-label>
</q-item-section>
</q-item>
</q-list>
</div>
<q-separator />
<q-card-actions align="right" class="bg-white text-teal">
<q-btn flat label="ยกเลิก" color="red" v-close-popup />
<q-btn
flat
label="ตกลง"
@click="clickSelect(action)"
:disable="radio === '' || (action === '' && radio !== 'ADD')"
/>
</q-card-actions>
</q-card>
</q-dialog>
</template>
<script setup lang="ts">
import { onMounted, ref, useAttrs, reactive, watch, computed } from "vue";
import { onMounted, ref, useAttrs, reactive, watch } from "vue";
import type { QTableProps } from "quasar";
import type {
FormMainProbation,
FormMainProbation2,
} from "@/modules/05_placement/interface/request/Main";
import { useQuasar } from "quasar";
import { useRouter } from "vue-router";
import http from "@/plugins/http";
@ -294,6 +9,8 @@ import { useCounterMixin } from "@/stores/mixin";
import { useDataStoreRetirement } from "@/modules/06_retirement/storeRetirement";
import type { resMain } from "@/modules/06_retirement/interface/response/Main";
import { storeToRefs } from "pinia";
import popupAdd from "../components/ListRetirement/popupAdd.vue";
const useStoreRetire = useDataStoreRetirement();
const { clickTab } = useStoreRetire;
const { tab, type } = storeToRefs(useDataStoreRetirement());
@ -302,17 +19,9 @@ const { messageError, date2Thai, showLoader, hideLoader, dialogConfirm } =
mixin;
const router = useRouter();
const $q = useQuasar(); // noti quasar
const modal = ref<boolean>(false);
const radio = ref<string>("");
const pagination = ref({
sortBy: "desc",
descending: false,
page: 1,
rowsPerPage: 10,
});
const fiscalyear = ref<number>();
const actionOption = ref<resMain[]>([]);
const action = ref<string>("");
const visibleColumns = ref<string[]>([
"no",
@ -360,15 +69,19 @@ const columns = ref<QTableProps["columns"]>([
// ()
const currentYear = new Date().getFullYear();
const rows = ref<resMain[]>([]);
const visibleColumns2 = ref<string[]>(["no", "name", "retireNumber"]);
const yearOptions = reactive<any[]>([]);
onMounted(() => {
filteryear();
});
//
const filteryear = () => {
yearOptions.push({ id: currentYear, name: currentYear + 543 });
fiscalyear.value = yearOptions[0].id;
fetchRetirement(type.value, currentYear);
};
//
const fetchRetirement = async (type: string, year: any) => {
radio.value = "";
showLoader();
await http
.get(config.API.retirement(type, year))
@ -382,12 +95,12 @@ const fetchRetirement = async (type: string, year: any) => {
retireNumber: items.round,
total: items.total,
round: items.round,
typeReport: typeReportChangeName(items.typeReport),
typeReport: typeReportChangeName(items.typeReport), //
json: items.json,
document: items.document,
}));
actionOption.value = rows.value;
rows.value.sort((a, b) => a.round - b.round);
rows.value.sort((a, b) => a.round - b.round); //
checkststus(rows.value);
})
.catch((e) => {
@ -397,156 +110,15 @@ const fetchRetirement = async (type: string, year: any) => {
hideLoader();
});
};
onMounted(() => {
filteryear();
});
// 2
const columns2 = ref<QTableProps["columns"]>([
{
name: "no",
align: "left",
label: "ลำดับ",
sortable: true,
field: "no",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "name",
align: "left",
label: "วันที่สร้าง",
sortable: true,
field: "name",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "retireNumber",
align: "left",
label: "จำนวนผู้เกษียณ",
sortable: true,
field: "total",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
]);
// ()
const rows2 = ref<FormMainProbation2[]>([
{
no: "1",
name: "นายใจดี ยอดใจ ",
position: "นักวิชาการพัสดุ",
level: "ปฏิบัติการ",
institution: "กลุ่มงานโครงสร้างและอัตรากำลัง ๒",
},
{
no: "2",
name: "นายจักกริน บัณฑิต",
position: "นักวิชาการพัสดุ",
level: "ปฏิบัติการ",
institution: "กลุ่มงานโครงสร้างและอัตรากำลัง ๒",
},
{
no: "3",
name: "นางสาวกัณฐิมา กาฬสินธุ์",
position: "นักจัดการงานทั่วไป",
level: "ปฏิบัติการ",
institution: "กลุ่มงานช่วยนักบริหาร",
},
{
no: "4",
name: "นางสาวเมขลา กระจ่างมนตรี",
position: "นักจัดการงานทั่วไป",
level: "ปฏิบัติการ",
institution: "กลุ่มงานช่วยนักบริหาร",
},
{
no: "5",
name: "นางสาวฐิติรัตน์ พงษ์ศิริ",
position: "นักจัดการงานทั่วไป",
level: "ปฏิบัติการ",
institution: "กลุ่มงานช่วยนักบริหาร",
},
]);
// const clickDelete = (id: string) => {
// $q.dialog({
// title: "",
// message: "?",
// cancel: {
// flat: true,
// color: "negative",
// },
// persistent: true,
// })
// .onOk(async () => {})
// .onCancel(() => {})
// .onDismiss(() => {});
// };
const clickAdd = () => {
if (rows.value.length == 0) {
dialogConfirm(
$q,
async () => {
let data = { type: useStoreRetire.type, year: currentYear };
await cerateRetirement(data);
},
"ยืนยันการเพิ่มข้อมูลประกาศเกษียณ",
"ต้องการเพิ่มข้อมูลประกาศเกษียณใช่หรือไม่ ?"
);
} else {
modal.value = true;
action.value = "";
radio.value = "";
}
};
const cerateRetirement = async (data: object) => {
await http
.post(config.API.createProfile(), data)
.then((res) => {
let response = res.data.result;
let retirementId = response.id;
router.push(`/retirement/${retirementId}`);
})
.catch((e) => {
messageError($q, e);
});
};
const clickSelect = async (action: string) => {
dialogConfirm(
$q,
async () => {
let data = {
type: useStoreRetire.type,
year: currentYear,
retireHistoryId: action,
option: radio.value,
};
await cerateRetirement(data);
},
"ยืนยันการแก้ไขข้อมูลประกาศเกษียณ",
"ต้องการแก้ไขข้อมูลประกาศเกษียณใช่หรือไม่ ?"
);
};
const checkjson = ref<boolean>();
// document
const checkststus = (data: any) => {
let jsonfasle = data.find((e: any) => e.document == false);
if (jsonfasle) {
checkjson.value = true;
} else checkjson.value = false;
};
const fiscalyear = ref<number>();
// const fiscalyearOP = ref<any>([
// { id: 1, name: "" },
// { id: 2, name: "2565" },
// { id: 3, name: "2565" },
// ]);
//
const filterKeyword = ref<string>("");
@ -555,17 +127,15 @@ const resetFilter = () => {
filterKeyword.value = "";
filterRef.value.focus();
};
const filterKeyword2 = ref<string>("");
const filterRef2 = ref<any>(null);
const resetFilter2 = () => {
filterKeyword2.value = "";
filterRef2.value.focus();
};
const attrs = ref<any>(useAttrs());
const paging = ref<boolean>(true);
const pagination = ref({
sortBy: "",
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;
@ -577,6 +147,7 @@ const nextPage = (prop: any) => {
watch(type, () => {
fetchRetirement(type.value, currentYear);
});
//
const typeReportChangeName = (val: string) => {
switch (val) {
case "EDIT":
@ -590,6 +161,171 @@ const typeReportChangeName = (val: string) => {
}
};
</script>
<template>
<div class="toptitle text-dark col-12 row items-center">
ประกาศเกษยณอายราชการ
</div>
<q-card flat bordered class="col-12 q-mt-sm">
<div class="row col-12">
<q-tabs
dense
v-model="tab"
align="left"
class="bg-white text-grey"
active-color="primary"
indicator-color="primary"
>
<div v-for="item in useStoreRetire.taboption">
<q-tab
:name="item.name"
:label="item.label"
@click="clickTab(item.name)"
/>
</div>
</q-tabs>
</div>
<q-separator />
<q-tab-panels v-model="tab" animated
><q-tab-panel
v-for="item in useStoreRetire.taboption"
:key="item.name"
:name="item.name"
class="q-pa-none"
>
<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="yearOptions"
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"
/>
<div>
<popupAdd
:type="useStoreRetire.type"
:year="fiscalyear"
:rows="rows"
:actionOptio="actionOption"
:checkjson="checkjson"
/>
</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 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-tr>
</template>
<template v-slot:body="props">
<q-tr
:props="props"
class="cursor-pointer"
@click="nextPage(props.row)"
>
<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.total }}
</q-td>
<q-td key="typeReport" :props="props">
{{ props.row.typeReport }}
</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-tab-panel
></q-tab-panels>
</q-card>
</template>
<style lang="scss" scope>
.filter-card {

View file

@ -235,13 +235,15 @@ const addNote = async (body: any) => {
await http
.put(config.API.noteAdd(props.roundId), body)
.then(() => {
success($q, "เพิ่มราชชื่อสำเร็จ");
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
props.close();
if (props.close) {
props.close();
}
});
}
};