เพิ่ม Popup ข้อมูลการพ้นจากราชการ
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490
parent
671b878872
commit
4ef5be2e61
2 changed files with 130 additions and 63 deletions
81
src/modules/04_registryPerson/components/DialogRetired.vue
Normal file
81
src/modules/04_registryPerson/components/DialogRetired.vue
Normal file
|
|
@ -0,0 +1,81 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, watch } from "vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useQuasar, type QTableProps } from "quasar";
|
||||
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
import { useRoute } from "vue-router";
|
||||
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
const modal = defineModel<boolean>("modal", { required: true });
|
||||
|
||||
const route = useRoute();
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin();
|
||||
const {
|
||||
showLoader,
|
||||
hideLoader,
|
||||
messageError,
|
||||
date2Thai,
|
||||
pathRegistryEmp,
|
||||
onSearchDataTable,
|
||||
} = mixin;
|
||||
|
||||
const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
|
||||
const profileId = ref<string>(route.params.id.toString()); //id profile
|
||||
|
||||
const data = ref<{ date: Date; type: string; reson: string; document: string }>(
|
||||
{
|
||||
date: new Date(),
|
||||
type: "ออกจากราชการ",
|
||||
reson: "พ้นจากราชการด้วยสาเหตุ : ออกจากราชการ",
|
||||
document: "test",
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-dialog v-model="modal" persistent>
|
||||
<q-card style="min-width: 30%">
|
||||
<DialogHeader
|
||||
tittle="ข้อมูลการพ้นจากราชการ"
|
||||
:close="() => (modal = false)"
|
||||
/>
|
||||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row">
|
||||
<div class="col-12 column justify-center no-wrap">
|
||||
<div class="row text-grey-6">
|
||||
<div class="col-6">วันเดือนปีที่พ้นจากราชการ</div>
|
||||
<div class="col-6">ประเภทการพ้นจากราชการ</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
{{ data.date ? date2Thai(data.date) : "-" }}
|
||||
</div>
|
||||
<div class="col-6">{{ data.type ? data.type : "-" }}</div>
|
||||
</div>
|
||||
|
||||
<div class="row q-mt-md text-grey-6">
|
||||
<div class="col-12">สาเหตุ /เหตุผล</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12">{{ data.reson ? data.reson : "-" }}</div>
|
||||
</div>
|
||||
|
||||
<div class="row q-mt-md text-grey-6">
|
||||
<div class="col-12">คำสั่ง /เอกสารอ้างอิง</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
{{ data.document ? data.document : "-" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
|
@ -16,25 +16,20 @@ import axios from "axios";
|
|||
import genReport from "@/plugins/genreport";
|
||||
import avatar from "@/assets/avatar_user.jpg";
|
||||
|
||||
/**
|
||||
* importType
|
||||
*/
|
||||
/** importType*/
|
||||
import type {
|
||||
DataOption,
|
||||
DataOptionSys,
|
||||
} from "@/modules/04_registryPerson/interface/index/Main";
|
||||
import type { ResponseObject } from "@/modules/04_registryPerson/interface/response/Profile";
|
||||
|
||||
/**
|
||||
* importComponents
|
||||
*/
|
||||
/** importComponents*/
|
||||
import CardNotPermission from "@/components/CardNotPermission.vue";
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
import TabMain from "@/modules/04_registryPerson/components/detail/TabMain.vue";
|
||||
import DialogRetired from "@/modules/04_registryPerson/components/DialogRetired.vue";
|
||||
|
||||
/**
|
||||
* use
|
||||
*/
|
||||
/** use*/
|
||||
const $q = useQuasar();
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
|
@ -67,6 +62,8 @@ const reasonDeath = ref(""); //เหตุผลการเสียชีว
|
|||
|
||||
const dialogImage = ref<boolean>(false); //แสดงเลือกรูปภาพ
|
||||
const formDetail = ref<ResponseObject>(); //ข้อมูลส่วนตัว
|
||||
|
||||
const modalDialogRetired = ref<boolean>(false);
|
||||
//รายการเมนูออกคำสั่งข้าราชการ
|
||||
const baseItemsMenu = ref<DataOptionSys[]>([
|
||||
{
|
||||
|
|
@ -118,6 +115,7 @@ const itemsMenu = computed(() => {
|
|||
return baseItemsMenu.value || [];
|
||||
}
|
||||
});
|
||||
|
||||
//รายการเมนูออกคำสั่งลูกจ้าง
|
||||
const itemsMenuEmployee = ref<DataOptionSys[]>([
|
||||
{
|
||||
|
|
@ -162,7 +160,10 @@ function imageActive(n: any) {
|
|||
activeImage.value = n;
|
||||
}
|
||||
|
||||
// ฟังก์ชันสำหรับปรับขนาดภาพ
|
||||
/**
|
||||
* ฟังก์ชันสำหรับปรับขนาดภาพ
|
||||
* @param file ไฟล์รูป
|
||||
*/
|
||||
function resizeImage(file: File): Promise<File> {
|
||||
return new Promise((resolve, reject) => {
|
||||
const img = new Image();
|
||||
|
|
@ -224,9 +225,7 @@ function resizeImage(file: File): Promise<File> {
|
|||
|
||||
const newProfileFile = ref<any>(null);
|
||||
|
||||
/**
|
||||
* ฟังก์ชันอัปโหลด
|
||||
*/
|
||||
/** ฟังก์ชันอัปโหลด*/
|
||||
async function uploadImg() {
|
||||
showLoader();
|
||||
newProfileFile.value = await resizeImage(profileFile.value);
|
||||
|
|
@ -266,6 +265,8 @@ async function uploadProfile(path: string) {
|
|||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
|
@ -347,9 +348,7 @@ const reasonOptions = ref<DataOption[]>([
|
|||
},
|
||||
]);
|
||||
|
||||
/**
|
||||
* ฟังก์ชันดึงข้อมูลส่วนต้ว
|
||||
*/
|
||||
/** ฟังก์ชันดึงข้อมูลส่วนต้ว*/
|
||||
async function fetchDataPersonal() {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -400,7 +399,8 @@ async function fetchDataPersonal() {
|
|||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันดาว์นโหลดไฟล์ "ก.พ.7/ก.ก.1 หรื่อ ประวัติแบบย่อ
|
||||
* ฟังก์ชันดาว์นโหลดไฟล์ "ก.พ.7/ก.ก.1 และประวัติแบบย่อ
|
||||
* @param type full === 'ก.พ.7/ก.ก.1', SHORT === 'ประวัติแบบย่อ'
|
||||
*/
|
||||
async function onClickDownloadKp7(type: string) {
|
||||
showLoader();
|
||||
|
|
@ -428,9 +428,7 @@ async function onClickDownloadKp7(type: string) {
|
|||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันออกคำสั่งช่วยราชการ
|
||||
*/
|
||||
/** ฟังก์ชันออกคำสั่งช่วยราชการ*/
|
||||
function helpPost() {
|
||||
const formData = new FormData();
|
||||
formData.append("id", profileId.value);
|
||||
|
|
@ -451,9 +449,7 @@ function helpPost() {
|
|||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันออกคำสั่งส่งตัวกลับ
|
||||
*/
|
||||
/** ฟังก์ชันออกคำสั่งส่งตัวกลับ*/
|
||||
function repatriationPost() {
|
||||
const formData = new FormData();
|
||||
formData.append("id", profileId.value);
|
||||
|
|
@ -474,9 +470,7 @@ function repatriationPost() {
|
|||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันออกคำสั่งแต่งตังเลื่อน
|
||||
*/
|
||||
/** ฟังก์ชันออกคำสั่งแต่งตังเลื่อน*/
|
||||
function appointPost() {
|
||||
const formData = new FormData();
|
||||
formData.append("id", profileId.value);
|
||||
|
|
@ -497,9 +491,7 @@ function appointPost() {
|
|||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันออกคำสั่งถึงเเก่กรรม
|
||||
*/
|
||||
/** ฟังก์ชันออกคำสั่งถึงเเก่กรรม*/
|
||||
function clickPassaway() {
|
||||
dialogPassaway.value = true;
|
||||
filePassaway.value = null;
|
||||
|
|
@ -509,9 +501,7 @@ function clickPassaway() {
|
|||
reasonDeath.value = "";
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันออกคำสั่งให้ออกจากราชการ
|
||||
*/
|
||||
/** ฟังก์ชันออกคำสั่งให้ออกจากราชการ*/
|
||||
function outPost() {
|
||||
const formData = new FormData();
|
||||
formData.append("id", profileId.value);
|
||||
|
|
@ -536,9 +526,7 @@ function outPost() {
|
|||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันออกคำสั่งอื่นๆ
|
||||
*/
|
||||
/** ฟังก์ชันออกคำสั่งอื่นๆ*/
|
||||
function otherPost() {
|
||||
const formData = new FormData();
|
||||
formData.append("id", profileId.value);
|
||||
|
|
@ -563,9 +551,7 @@ function otherPost() {
|
|||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันออกคำสั่งปรับระดับชั้นงาน - ย้าย
|
||||
*/
|
||||
/** ฟังก์ชันออกคำสั่งปรับระดับชั้นงาน - ย้าย*/
|
||||
function appointEmployeePost() {
|
||||
const formData = new FormData();
|
||||
formData.append("id", profileId.value);
|
||||
|
|
@ -586,9 +572,7 @@ function appointEmployeePost() {
|
|||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันยืนยันบันทึกข้อมูลถึงแก่กรรม
|
||||
*/
|
||||
/** ฟังก์ชันยืนยันบันทึกข้อมูลถึงแก่กรรม*/
|
||||
function clickSaveDeceased() {
|
||||
dialogConfirm($q, async () => {
|
||||
showLoader();
|
||||
|
|
@ -617,25 +601,19 @@ function clickSaveDeceased() {
|
|||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันปืด popup ถึงแก่กรรม
|
||||
*/
|
||||
/** ฟังก์ชันปืด popup ถึงแก่กรรม*/
|
||||
function closePassaway() {
|
||||
dialogPassaway.value = false;
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันเปืด popup เลือกรูปภาพ
|
||||
*/
|
||||
/** ฟังก์ชันเปืด popup เลือกรูปภาพ*/
|
||||
function openDialogImg() {
|
||||
dialogImage.value = true;
|
||||
getImage();
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันเรียกข้อมูลรูป
|
||||
*/
|
||||
function getImage() {
|
||||
/** ฟังก์ชันเรียกข้อมูลรูป*/
|
||||
async function getImage() {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.orgProfileAvatar + `/${profileId.value}`)
|
||||
|
|
@ -656,8 +634,8 @@ function getImage() {
|
|||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันเรียกข้อมูลรูป
|
||||
* @param dataList
|
||||
* ฟังก์ชันเรียกข้อมูลรายการรูป
|
||||
* @param dataList ข้อมูล
|
||||
*/
|
||||
async function getImg(dataList: any) {
|
||||
await http
|
||||
|
|
@ -676,9 +654,7 @@ async function getImg(dataList: any) {
|
|||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันปิด Popup เลือกรูปภาพ
|
||||
*/
|
||||
/** ฟังก์ชันปิด Popup เลือกรูปภาพ*/
|
||||
function closeImage() {
|
||||
dialogImage.value = false;
|
||||
images.value = [];
|
||||
|
|
@ -696,10 +672,10 @@ function deletePhoto(id: string) {
|
|||
showLoader();
|
||||
http
|
||||
.delete(config.API.orgProfileAvatar + `/${id}`)
|
||||
.then((res) => {
|
||||
.then(async () => {
|
||||
await getImage();
|
||||
images.value = [];
|
||||
imagesAlldata.value = [];
|
||||
getImage();
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
|
|
@ -712,9 +688,7 @@ function deletePhoto(id: string) {
|
|||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันยืนยันการเลือกรูป
|
||||
*/
|
||||
/** ฟังก์ชันยืนยันการเลือกรูป*/
|
||||
function selectAvatarHistory() {
|
||||
if (activeImage.value == null) {
|
||||
dialogMessageNotify($q, "กรุณาเลือกรูปที่ต้องการเปลี่ยน");
|
||||
|
|
@ -781,7 +755,7 @@ onMounted(async () => {
|
|||
/>
|
||||
{{
|
||||
route.name === "registry-employeeId"
|
||||
? " ทะเบียนประวัติลูกจ้างชั่วคราว"
|
||||
? "ทะเบียนประวัติลูกจ้างชั่วคราว"
|
||||
: "ทะเบียนประวัติ"
|
||||
}}
|
||||
</div>
|
||||
|
|
@ -789,7 +763,6 @@ onMounted(async () => {
|
|||
|
||||
<div v-if="isPermission">
|
||||
<!-- list menu ของข้าราชการฯ -->
|
||||
|
||||
<q-btn-dropdown
|
||||
v-if="
|
||||
(!storeRegistry.isLeave &&
|
||||
|
|
@ -934,6 +907,16 @@ onMounted(async () => {
|
|||
}${formDetail.firstName} ${formDetail.lastName}`
|
||||
}}
|
||||
<span class="text-red"> {{ leaveReason }}</span>
|
||||
<q-btn
|
||||
v-if="leaveReason"
|
||||
flat
|
||||
round
|
||||
color="info"
|
||||
icon="info"
|
||||
@click.stop.prevent="modalDialogRetired = true"
|
||||
>
|
||||
<q-tooltip>ข้อมูลการพ้นจากราชการ</q-tooltip>
|
||||
</q-btn>
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1201,6 +1184,9 @@ onMounted(async () => {
|
|||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
|
||||
<!-- Dialog ข้อมูลการพ้นจากราชการ -->
|
||||
<DialogRetired v-model:modal="modalDialogRetired" />
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue