Merge branch 'develop' of github.com:Frappet/bma-ehr-frontend into develop
* 'develop' of github.com:Frappet/bma-ehr-frontend: รายการแต่งตั้ง-เลื่อน-ย้าย no message fix bug cardprofile พ้นจากราชการ => ถึงแก่กรรม
This commit is contained in:
commit
b86df2c467
15 changed files with 765 additions and 759 deletions
|
|
@ -40,7 +40,8 @@ function fetchDataProfile(data: DataProfile) {
|
|||
|
||||
profile.id = data.profileId;
|
||||
profile.fullName = `${data.prefix}${data.firstName} ${data.lastName}`;
|
||||
profile.position = data.position !== "" ? data.position : "-";
|
||||
profile.position =
|
||||
data.position == "" || data.position === null ? "-" : data.position;
|
||||
if (data.posTypeName && data.posLevelName) {
|
||||
profile.positionLevel = `${data.posTypeName} (${data.posLevelName})`;
|
||||
} else if (data.posTypeName) {
|
||||
|
|
|
|||
|
|
@ -244,6 +244,7 @@ function close() {
|
|||
|
||||
async function getDataTable(id: string, level: number = 0) {
|
||||
showLoader();
|
||||
|
||||
const body = {
|
||||
node: level,
|
||||
nodeId: id,
|
||||
|
|
@ -308,10 +309,16 @@ async function getDataTable(id: string, level: number = 0) {
|
|||
* @param data ข่อมูล Tree
|
||||
*/
|
||||
function updateSelected(data: DataTree) {
|
||||
positionId.value = "";
|
||||
seletcId.value = "";
|
||||
selectedPos.value = [];
|
||||
datePos.value = new Date();
|
||||
if (props?.dataRows?.nodeId === data.orgTreeId) {
|
||||
positionId.value = props?.dataRows?.posmasterId;
|
||||
seletcId.value = props?.dataRows?.positionId;
|
||||
datePos.value = props?.dataRows?.reportingDateFullDate;
|
||||
} else {
|
||||
positionId.value = "";
|
||||
seletcId.value = "";
|
||||
selectedPos.value = [];
|
||||
datePos.value = new Date();
|
||||
}
|
||||
|
||||
nodeId.value = data.orgTreeId ? data.orgTreeId : "";
|
||||
nodeLevel.value = data.orgLevel;
|
||||
|
|
@ -396,11 +403,50 @@ async function onClickSelectPos(id: string) {
|
|||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* function fetch ข้อมูล expanded tree
|
||||
* @param level levelTree
|
||||
* @param id treeId
|
||||
*/
|
||||
async function fetchPosFind(level: number, id: string) {
|
||||
showLoader();
|
||||
const body = {
|
||||
node: level,
|
||||
nodeId: id,
|
||||
};
|
||||
await http
|
||||
.post(config.API.orgPosFind, body)
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
expanded.value = data;
|
||||
nodeId.value = id;
|
||||
positionId.value = props?.dataRows?.posmasterId;
|
||||
seletcId.value = props?.dataRows?.positionId;
|
||||
datePos.value = props?.dataRows?.reportingDateFullDate;
|
||||
|
||||
getDataTable(nodeId.value, level);
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
watch(
|
||||
() => modal.value,
|
||||
(n) => {
|
||||
async (n) => {
|
||||
if (n == true) {
|
||||
getActive();
|
||||
if (props?.dataRows?.node !== null && props?.dataRows?.nodeId !== null) {
|
||||
await fetchPosFind(props?.dataRows?.node, props?.dataRows?.nodeId);
|
||||
if (positionId.value) {
|
||||
setTimeout(async () => {
|
||||
await onClickSelectPos(positionId.value);
|
||||
}, 200);
|
||||
}
|
||||
} else {
|
||||
expanded.value = [];
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
|
|
@ -436,7 +482,7 @@ function onSubmit() {
|
|||
(e: any) => e.id === positionId.value
|
||||
);
|
||||
|
||||
console.log(dataPosMaster)
|
||||
console.log(dataPosMaster);
|
||||
if (selectedPos.value.length === 0) {
|
||||
dialogMessageNotify($q, "กรุณาเลือกตำแหน่ง");
|
||||
} else {
|
||||
|
|
@ -461,7 +507,6 @@ function onSubmit() {
|
|||
props.onSubmit?.(body);
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
|
|
@ -496,7 +541,6 @@ function onSubmit() {
|
|||
<q-tree
|
||||
class="q-pa-sm q-gutter-sm"
|
||||
dense
|
||||
default-expand-all
|
||||
:nodes="lazy"
|
||||
node-key="orgTreeId"
|
||||
label-key="orgTreeName"
|
||||
|
|
|
|||
|
|
@ -47,11 +47,7 @@ let dataForm = reactive({
|
|||
positionTypeId: "",
|
||||
});
|
||||
|
||||
onMounted(async () => {
|
||||
await fetchPublishFile();
|
||||
await loadTreeData();
|
||||
await fetchplacementPosition();
|
||||
});
|
||||
|
||||
const fetchPublishFile = async () => {
|
||||
await http
|
||||
.get(config.API.getPublishFileHistory)
|
||||
|
|
@ -220,7 +216,7 @@ const closeAndClear = async () => {
|
|||
dataForm.positionPathSideId = "";
|
||||
dataForm.positionTypeId = "";
|
||||
};
|
||||
// ตำแหน่งเลขที่
|
||||
// เลขที่ตำแหน่ง
|
||||
const posNoOptions = ref<Object[]>([
|
||||
{
|
||||
label: "",
|
||||
|
|
@ -396,6 +392,12 @@ function findByPerson(element: any): any {
|
|||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
await fetchPublishFile();
|
||||
await loadTreeData();
|
||||
// await fetchplacementPosition();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -600,7 +602,7 @@ function findByPerson(element: any): any {
|
|||
lazy-rules
|
||||
:options="posNoOptions"
|
||||
v-model="dataForm.posNoId"
|
||||
:label="`${'ตำแหน่งเลขที่'}`"
|
||||
:label="`${'เลขที่ตำแหน่ง'}`"
|
||||
map-options
|
||||
/>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
divdivdiv
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from "vue";
|
||||
import { onMounted, ref, reactive } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useRoute, useRouter } from "vue-router";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
|
@ -9,11 +9,13 @@ import type { ResponseTitle } from "@/modules/05_placement/interface/response/Re
|
|||
import type {
|
||||
appointmentData,
|
||||
ResponseData,
|
||||
DataProfile,
|
||||
} from "@/modules/05_placement/interface/response/AppointMent";
|
||||
import type { QForm } from "quasar";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
|
||||
import CardProfile from "@/components/CardProfile.vue";
|
||||
|
||||
const modalPersonal = ref<boolean>(false);
|
||||
const personId = ref<string>("");
|
||||
|
|
@ -22,12 +24,8 @@ const route = useRoute();
|
|||
const router = useRouter();
|
||||
const mixin = useCounterMixin();
|
||||
|
||||
const appointment = ref<appointmentData>({
|
||||
citizenId: "",
|
||||
prefixId: "",
|
||||
firstname: "",
|
||||
lastname: "",
|
||||
});
|
||||
const dataProfile = ref<DataProfile>();
|
||||
|
||||
const myForm = ref<QForm | null>(null);
|
||||
const edit = ref<boolean>(false);
|
||||
const profileId = ref<string>("");
|
||||
|
|
@ -64,9 +62,10 @@ const fecthappointmentByid = async () => {
|
|||
showLoader();
|
||||
await http
|
||||
.get(config.API.appointmentByid(paramsId.toString()))
|
||||
.then((res: ResponseData) => {
|
||||
.then((res) => {
|
||||
dataProfile.value = res.data.result as unknown as DataProfile;
|
||||
const data = res.data.result;
|
||||
appointment.value = data;
|
||||
|
||||
profileId.value = data.profileId;
|
||||
title.value.fullname = `${data.prefix}${data.firstname ?? "-"} ${
|
||||
data.lastname ?? "-"
|
||||
|
|
@ -111,10 +110,6 @@ const clickSave = async () => {
|
|||
// เเก้ไขข้อมูล
|
||||
const putAppointment = async () => {
|
||||
let data = {
|
||||
citizenId: appointment.value.citizenId,
|
||||
prefixId: appointment.value.prefixId,
|
||||
firstname: appointment.value.firstname,
|
||||
lastname: appointment.value.lastname,
|
||||
educationOld: educationOld.value,
|
||||
organizationPositionOld: organizationPositionOld.value,
|
||||
positionTypeOld: positionTypeOld.value,
|
||||
|
|
@ -177,56 +172,7 @@ onMounted(async () => {
|
|||
/>
|
||||
รายละเอียดการแต่งตั้ง-เลื่อน-ย้าย {{ title.fullname }}
|
||||
</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">
|
||||
{{ title.fullname }}
|
||||
</div>
|
||||
<q-space />
|
||||
<q-btn
|
||||
outline
|
||||
color="blue"
|
||||
dense
|
||||
icon-right="mdi-open-in-new"
|
||||
class="q-px-sm"
|
||||
label="ดูข้อมูลทะเบียนประวัติ"
|
||||
@click="onclickViewinfo(profileId)"
|
||||
/>
|
||||
</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="avatar" v-if="avatar !== ''" />
|
||||
<q-img src="@/assets/avatar_user.jpg" v-else />
|
||||
</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">
|
||||
{{ title.positionTypeOld }}
|
||||
</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">
|
||||
{{ title.positionLevelOld }}
|
||||
</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">
|
||||
{{ title.organizationPositionOld }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
<CardProfile :data="dataProfile as DataProfile" />
|
||||
|
||||
<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">
|
||||
|
|
@ -341,9 +287,9 @@ onMounted(async () => {
|
|||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="positionLevelOld"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกระดับ'}`]"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกประเภทตำแหน่ง'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'ระดับ'}`"
|
||||
:label="`${'ประเภทตำแหน่ง'}`"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,16 +1,28 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, computed,watchEffect } from "vue";
|
||||
import { ref, computed, watchEffect } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import type { QTableProps } from "quasar";
|
||||
import type { UserData } from "@/modules/05_placement/interface/response/AppointMent";
|
||||
|
||||
import DialogHeader from "@/modules/05_placement/components/AppointMent/DialogHeader.vue";
|
||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
||||
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
const storeFn = useTransferDataStore();
|
||||
const { statusText } = storeFn;
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const { showLoader, success, messageError, dialogConfirm,hideLoader } = mixin;
|
||||
const {
|
||||
showLoader,
|
||||
success,
|
||||
messageError,
|
||||
dialogConfirm,
|
||||
hideLoader,
|
||||
date2Thai,
|
||||
} = mixin;
|
||||
|
||||
const $q = useQuasar();
|
||||
const selected = ref<[]>([]);
|
||||
|
|
@ -27,8 +39,8 @@ const props = defineProps({
|
|||
nextPage: Function,
|
||||
optionsType: Array,
|
||||
rows2: Array,
|
||||
filterKeyword2:String,
|
||||
type:String,
|
||||
filterKeyword2: String,
|
||||
type: String,
|
||||
});
|
||||
const visibleColumns2 = ref<string[]>([
|
||||
"no",
|
||||
|
|
@ -86,14 +98,13 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
const pageNext = (item:object) => {
|
||||
props.nextPage?.(item)
|
||||
}
|
||||
const pageNext = (item: object) => {
|
||||
props.nextPage?.(item);
|
||||
};
|
||||
const emit = defineEmits([
|
||||
"update:filterKeyword2",
|
||||
"update:type",
|
||||
"update:selected",
|
||||
|
||||
]);
|
||||
const updateInput = (value: any) => {
|
||||
emit("update:filterKeyword2", value);
|
||||
|
|
@ -104,18 +115,17 @@ const updateInputType = (value: string) => {
|
|||
};
|
||||
//รีเซ็ตค่าในช่องค้นหา
|
||||
const Reset = () => {
|
||||
emit("update:filterKeyword2", "");
|
||||
emit("update:filterKeyword2", "");
|
||||
};
|
||||
//เปิด modal ยืนยัน
|
||||
const clickAddlist = () => {
|
||||
dialogConfirm($q, () => createdAppoint());
|
||||
};
|
||||
|
||||
|
||||
//อัพเดต ส่งไปออกคำสั่ง
|
||||
const createdAppoint = async () => {
|
||||
let pId: string[] = [];
|
||||
let Type = props.type as string
|
||||
let Type = props.type as string;
|
||||
selected.value.forEach((e: UserData) => {
|
||||
pId.push(e.personalId);
|
||||
});
|
||||
|
|
@ -135,7 +145,7 @@ const createdAppoint = async () => {
|
|||
hideLoader();
|
||||
props.fecthlistappointment?.();
|
||||
selected.value = [];
|
||||
props.clickClose?.()
|
||||
props.clickClose?.();
|
||||
});
|
||||
};
|
||||
|
||||
|
|
@ -146,7 +156,7 @@ watchEffect(() => {
|
|||
});
|
||||
</script>
|
||||
<template>
|
||||
<q-dialog v-model="props.Modal">
|
||||
<q-dialog v-model="props.Modal">
|
||||
<q-card style="width: 1200px; max-width: 80vw">
|
||||
<DialogHeader title="ส่งไปออกคำสั่ง" :close="clickClose" />
|
||||
<q-separator />
|
||||
|
|
@ -154,70 +164,149 @@ watchEffect(() => {
|
|||
<div class="row justify-between">
|
||||
<div class="col-5">
|
||||
<q-toolbar style="padding: 0">
|
||||
<q-select outlined dense :model-value="type" @update:model-value="updateInputType" :options="optionsType"
|
||||
label="คำสั่งแต่งตั่ง-เลื่อน-ย้าย" style="width: 400px; max-width: auto" emit-value map-options option-label="name"
|
||||
option-value="id" />
|
||||
<q-select
|
||||
outlined
|
||||
dense
|
||||
:model-value="type"
|
||||
@update:model-value="updateInputType"
|
||||
:options="optionsType"
|
||||
label="คำสั่งแต่งตั่ง-เลื่อน-ย้าย"
|
||||
style="width: 400px; max-width: auto"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
/>
|
||||
</q-toolbar>
|
||||
</div>
|
||||
<div class="col-5">
|
||||
<q-toolbar style="padding: 0">
|
||||
<q-input borderless outlined dense debounce="300" :model-value="filterKeyword2"
|
||||
@update:model-value="updateInput" placeholder="ค้นหา"
|
||||
style="width: 850px; max-width: auto">
|
||||
<q-input
|
||||
borderless
|
||||
outlined
|
||||
dense
|
||||
debounce="300"
|
||||
:model-value="filterKeyword2"
|
||||
@update:model-value="updateInput"
|
||||
placeholder="ค้นหา"
|
||||
style="width: 850px; max-width: auto"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon v-if="filterKeyword2 == ''" name="search" />
|
||||
<q-icon v-if="filterKeyword2 !== ''" name="clear" class="cursor-pointer" @click="Reset" />
|
||||
<q-icon
|
||||
v-if="filterKeyword2 !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="Reset"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
<q-select v-model="visibleColumns2" multiple outlined dense options-dense
|
||||
:display-value="$q.lang.table.columns" emit-value map-options :options="columns2" option-value="name"
|
||||
options-cover style="min-width: 150px" class="gt-xs q-ml-sm" />
|
||||
<q-select
|
||||
v-model="visibleColumns2"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
options-dense
|
||||
:display-value="$q.lang.table.columns"
|
||||
emit-value
|
||||
map-options
|
||||
:options="columns2"
|
||||
option-value="name"
|
||||
options-cover
|
||||
style="min-width: 150px"
|
||||
class="gt-xs q-ml-sm"
|
||||
/>
|
||||
</q-toolbar>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<d-table :columns="columns2" :rows="rows2" :filter="filterKeyword2" row-key="personalId" flat
|
||||
:visible-columns="visibleColumns2" selection="multiple" v-model:selected="selected">
|
||||
<d-table
|
||||
:columns="columns2"
|
||||
:rows="rows2"
|
||||
:filter="filterKeyword2"
|
||||
row-key="personalId"
|
||||
flat
|
||||
:visible-columns="visibleColumns2"
|
||||
selection="multiple"
|
||||
v-model:selected="selected"
|
||||
>
|
||||
<template v-slot:header-selection="scope">
|
||||
<q-checkbox keep-color color="primary" dense v-model="scope.selected" />
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
v-model="scope.selected"
|
||||
/>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td>
|
||||
<q-checkbox keep-color color="primary" dense v-model="props.selected" />
|
||||
<q-td auto-width>
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
dense
|
||||
v-model="props.selected"
|
||||
/>
|
||||
</q-td>
|
||||
<q-td key="no" :props="props">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</q-td>
|
||||
<q-td key="citizenId" :props="props" @click="pageNext(props.row)">
|
||||
{{ props.row.citizenId }}
|
||||
</q-td>
|
||||
<q-td key="fullname" :props="props" @click="pageNext(props.row)">
|
||||
{{ props.row.fullname }}
|
||||
</q-td>
|
||||
<q-td key="organizationName" :props="props" @click="pageNext(props.row)">
|
||||
<div v-if="props.row.orgName !== null ||
|
||||
props.row.positionPath !== null
|
||||
">
|
||||
<q-td
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
@click="pageNext(props.row)"
|
||||
>
|
||||
<div v-if="col.name == 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'fullname'">
|
||||
{{
|
||||
props.row.firstName
|
||||
? `${props.row.prefix ?? ""}${
|
||||
props.row.firstName ?? ""
|
||||
} ${props.row.lastName ?? ""}`
|
||||
: "-"
|
||||
}}
|
||||
</div>
|
||||
|
||||
<div v-else-if="col.name == 'status'">
|
||||
{{ props.row.status ? statusText(props.row.status) : "-" }}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'dateOfBirth'">
|
||||
{{
|
||||
props.row.dateOfBirth
|
||||
? date2Thai(props.row.dateOfBirth)
|
||||
: "-"
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'organizationName'">
|
||||
<div class="col-4">
|
||||
<div class="text-weight-medium">
|
||||
{{ props.row.orgName !== null ? props.row.orgName : "-" }}
|
||||
{{ props.row.organizationShortName !== null ? `(${props.row.organizationShortName})` : "" }}
|
||||
{{ props.row.root !== null ? props.row.root : "-" }}
|
||||
{{
|
||||
props.row.rootShortName !== null
|
||||
? `(${props.row.rootShortName})`
|
||||
: ""
|
||||
}}
|
||||
</div>
|
||||
<div class="text-weight-light">
|
||||
{{ props.row.positionPath !== null ? props.row.positionPath : "-" }}
|
||||
{{ props.row.positionNumber !== null ? `(${props.row.positionNumber})` : "" }}
|
||||
{{
|
||||
props.row.nodeName !== null ? props.row.nodeName : ""
|
||||
}}
|
||||
{{
|
||||
props.row.nodeShortName !== null
|
||||
? `(${props.row.nodeShortName}${props.row.posMasterNo})`
|
||||
: ""
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="col-4">
|
||||
<div class="text-weight-medium">-</div>
|
||||
</div>
|
||||
<div v-else-if="col.name == 'createdAt'">
|
||||
{{
|
||||
props.row.createdAt ? date2Thai(props.row.createdAt) : "-"
|
||||
}}
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td key="birthday" :props="props" @click="pageNext(props.row)">
|
||||
{{ props.row.birthday }}
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
|
|
@ -225,8 +314,13 @@ watchEffect(() => {
|
|||
</q-card-section>
|
||||
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn label="ส่งไปออกคำสั่ง" @click="clickAddlist" color="public" :disable="checkSelected" />
|
||||
<q-btn
|
||||
label="ส่งไปออกคำสั่ง"
|
||||
@click="clickAddlist"
|
||||
color="public"
|
||||
:disable="checkSelected"
|
||||
/>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -16,6 +16,15 @@ import type { OpType } from "@/modules/05_placement/interface/response/Main";
|
|||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
import DialogOrgSelect from "@/components/Dialogs/DialogOrgSelect.vue";
|
||||
|
||||
const title = ref<string>("");
|
||||
const posType = ref<string>("");
|
||||
const posLevel = ref<string>("");
|
||||
const position = ref<string>("");
|
||||
const typeModal = ref<string | null>(null);
|
||||
const dataRows = ref<any[]>([]);
|
||||
|
||||
const $q = useQuasar();
|
||||
const modal = ref<boolean>(false);
|
||||
const storeFn = useTransferDataStore();
|
||||
|
|
@ -48,7 +57,7 @@ const visibleColumns = ref<string[]>([
|
|||
"citizenId",
|
||||
"fullname",
|
||||
"organizationName",
|
||||
"birthday",
|
||||
"dateOfBirth",
|
||||
"createdAt",
|
||||
"status",
|
||||
]);
|
||||
|
|
@ -96,11 +105,11 @@ const columns = ref<QTableProps["columns"]>([
|
|||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "birthday",
|
||||
name: "dateOfBirth",
|
||||
align: "left",
|
||||
label: "วัน/เดือน/ปี เกิด",
|
||||
sortable: true,
|
||||
field: "birthday",
|
||||
field: "dateOfBirth",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
|
|
@ -152,36 +161,38 @@ const fecthlistappointment = async () => {
|
|||
.then((res) => {
|
||||
let response = res.data.result;
|
||||
listRecevice.value = response;
|
||||
rows.value = response.map((e: resData) => ({
|
||||
personalId: e.id,
|
||||
citizenId: e.citizenId,
|
||||
fullname: e.prefix + e.firstname + " " + e.lastname,
|
||||
organizationName:
|
||||
e.organizationName +
|
||||
" " +
|
||||
e.organizationShortName +
|
||||
" " +
|
||||
e.positionNumber +
|
||||
" " +
|
||||
e.positionPath,
|
||||
orgName: e.organizationName,
|
||||
organizationShortName: e.organizationShortName,
|
||||
positionNumber: e.positionNumber,
|
||||
positionPath: e.positionPath,
|
||||
status: statusText(e.status),
|
||||
createdAt: date2Thai(e.createdAt),
|
||||
birthday: e.dateOfBirth == null ? "-" : date2Thai(e.dateOfBirth),
|
||||
educationOld: e.educationOld,
|
||||
organizationPositionOld: e.organizationPositionOld,
|
||||
positionTypeOld: e.positionTypeOld,
|
||||
positionLevelOld: e.positionLevelOld,
|
||||
positionNumberOld: e.positionNumberOld,
|
||||
salary: e.salary,
|
||||
positionDate: e.positionDate,
|
||||
}));
|
||||
rows.value = response;
|
||||
// rows.value = response.map((e: resData) => ({
|
||||
// personalId: e.id,
|
||||
// citizenId: e.citizenId,
|
||||
// fullname: e.prefix + e.firstname + " " + e.lastname,
|
||||
// organizationName:
|
||||
// e.organizationName +
|
||||
// " " +
|
||||
// e.organizationShortName +
|
||||
// " " +
|
||||
// e.positionNumber +
|
||||
// " " +
|
||||
// e.positionPath,
|
||||
// orgName: e.organizationName,
|
||||
// organizationShortName: e.organizationShortName,
|
||||
// positionNumber: e.positionNumber,
|
||||
// positionPath: e.positionPath,
|
||||
// status: statusText(e.status),
|
||||
// createdAt: date2Thai(e.createdAt),
|
||||
// birthday: e.dateOfBirth == null ? "-" : date2Thai(e.dateOfBirth),
|
||||
// educationOld: e.educationOld,
|
||||
// organizationPositionOld: e.organizationPositionOld,
|
||||
// positionTypeOld: e.positionTypeOld,
|
||||
// positionLevelOld: e.positionLevelOld,
|
||||
// positionNumberOld: e.positionNumberOld,
|
||||
// salary: e.salary,
|
||||
// positionDate: e.positionDate,
|
||||
// }));
|
||||
|
||||
rows2.value = rows.value.filter(
|
||||
(e: orgFilter) =>
|
||||
e.orgName !== null &&
|
||||
(e: any) =>
|
||||
e.root !== null &&
|
||||
e.status !== "REPORT" &&
|
||||
e.status !== "DONE" &&
|
||||
e.educationOld &&
|
||||
|
|
@ -220,10 +231,14 @@ const fecthTypeOption = async () => {
|
|||
};
|
||||
|
||||
// เปิดโครงสร้าง
|
||||
const openModalTree = (id: string) => {
|
||||
personalId.value = id;
|
||||
personal.value = listRecevice.value.filter((e) => e.id === id);
|
||||
const openModalTree = (data: any, type: string) => {
|
||||
personalId.value = data.id;
|
||||
modalTree.value = true;
|
||||
typeModal.value = type;
|
||||
dataRows.value = data;
|
||||
posType.value = data.posTypeId;
|
||||
posLevel.value = data.posLevelId;
|
||||
position.value = data.positionName;
|
||||
};
|
||||
//เเจ้งเตือนลบข้อมูล
|
||||
const clickDelete = (id: string) => {
|
||||
|
|
@ -260,6 +275,41 @@ const nextPage = (id: string) => {
|
|||
});
|
||||
};
|
||||
|
||||
function onSave(data: any) {
|
||||
console.log("not save", data);
|
||||
const dataAppoint = {
|
||||
// personalId: data.personalId,
|
||||
node: data.node,
|
||||
nodeId: data.nodeId,
|
||||
orgRevisionId: data.orgRevisionId,
|
||||
positionId: data.positionId,
|
||||
posMasterNo: data.posMasterNo,
|
||||
positionName: data.positionName,
|
||||
posTypeId: data.posTypeId,
|
||||
posTypeName: data.posTypeName,
|
||||
posLevelId: data.posLevelId,
|
||||
posLevelName: data.posLevelName,
|
||||
reportingDate: data.reportingDate,
|
||||
posmasterId: data.posmasterId,
|
||||
typeCommand: data.typeCommand,
|
||||
};
|
||||
|
||||
showLoader();
|
||||
http
|
||||
.put(config.API.appointmentPosition(personalId.value), dataAppoint)
|
||||
.then((res) => {
|
||||
modalTree.value = false;
|
||||
success($q, "บันทึกสำเร็จ");
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
fecthlistappointment();
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fecthlistappointment();
|
||||
});
|
||||
|
|
@ -343,88 +393,64 @@ onMounted(() => {
|
|||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td
|
||||
key="no"
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
@click="nextPage(props.row.id)"
|
||||
>
|
||||
{{ props.rowIndex + 1 }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="citizenId"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
>
|
||||
{{ props.row.citizenId }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="fullname"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
>
|
||||
{{ props.row.fullname }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="organizationName"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
>
|
||||
<div
|
||||
v-if="
|
||||
props.row.orgName !== null ||
|
||||
props.row.positionPath !== null
|
||||
"
|
||||
>
|
||||
<div v-if="col.name == 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'fullname'">
|
||||
{{
|
||||
props.row.firstName
|
||||
? `${props.row.prefix ?? ""}${
|
||||
props.row.firstName ?? ""
|
||||
} ${props.row.lastName ?? ""}`
|
||||
: "-"
|
||||
}}
|
||||
</div>
|
||||
|
||||
<div v-else-if="col.name == 'status'">
|
||||
{{ props.row.status ? statusText(props.row.status) : "-" }}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'dateOfBirth'">
|
||||
{{
|
||||
props.row.dateOfBirth
|
||||
? date2Thai(props.row.dateOfBirth)
|
||||
: "-"
|
||||
}}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'organizationName'">
|
||||
<div class="col-4">
|
||||
<div class="text-weight-medium">
|
||||
{{ props.row.root !== null ? props.row.root : "-" }}
|
||||
{{
|
||||
props.row.orgName !== null ? props.row.orgName : "-"
|
||||
}}
|
||||
{{
|
||||
props.row.organizationShortName !== null
|
||||
? `(${props.row.organizationShortName})`
|
||||
props.row.rootShortName !== null
|
||||
? `(${props.row.rootShortName})`
|
||||
: ""
|
||||
}}
|
||||
</div>
|
||||
<div class="text-weight-light">
|
||||
{{
|
||||
props.row.positionPath !== null
|
||||
? props.row.positionPath
|
||||
: "-"
|
||||
props.row.nodeName !== null ? props.row.nodeName : ""
|
||||
}}
|
||||
{{
|
||||
props.row.positionNumber !== null
|
||||
? `(${props.row.positionNumber})`
|
||||
props.row.nodeShortName !== null
|
||||
? `(${props.row.nodeShortName}${props.row.posMasterNo})`
|
||||
: ""
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="col-4">
|
||||
<div class="text-weight-medium">-</div>
|
||||
</div>
|
||||
<div v-else-if="col.name == 'createdAt'">
|
||||
{{
|
||||
props.row.createdAt ? date2Thai(props.row.createdAt) : "-"
|
||||
}}
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td
|
||||
key="birthday"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
>
|
||||
{{ props.row.birthday }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="createdAt"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
>
|
||||
{{ props.row.createdAt }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="status"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
>
|
||||
{{ props.row.status }}
|
||||
</q-td>
|
||||
<q-td auto-width>
|
||||
<q-btn
|
||||
|
|
@ -447,7 +473,7 @@ onMounted(() => {
|
|||
<q-item
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="openModalTree(props.row.personalId)"
|
||||
@click="openModalTree(props.row, 'APPOINT')"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
|
|
@ -460,12 +486,14 @@ onMounted(() => {
|
|||
name="mdi-bookmark-outline"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>เลือกหน่วยงานที่รับแต่งตั้ง</q-item-section>
|
||||
<q-item-section
|
||||
>เลือกหน่วยงานที่รับแต่งตั้ง</q-item-section
|
||||
>
|
||||
</q-item>
|
||||
<q-item
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="openModalTree(props.row.personalId)"
|
||||
@click="openModalTree(props.row, 'SLIP')"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
|
|
@ -478,12 +506,14 @@ onMounted(() => {
|
|||
name="mdi-bookmark-outline"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>เลือกหน่วยงานที่รับเลื่อน</q-item-section>
|
||||
<q-item-section
|
||||
>เลือกหน่วยงานที่รับเลื่อน</q-item-section
|
||||
>
|
||||
</q-item>
|
||||
<q-item
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="openModalTree(props.row.personalId)"
|
||||
@click="openModalTree(props.row, 'MOVE')"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
|
|
@ -496,7 +526,9 @@ onMounted(() => {
|
|||
name="mdi-bookmark-outline"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>เลือกหน่วยงานที่รับย้าย</q-item-section>
|
||||
<q-item-section
|
||||
>เลือกหน่วยงานที่รับย้าย</q-item-section
|
||||
>
|
||||
</q-item>
|
||||
<q-item
|
||||
clickable
|
||||
|
|
@ -535,11 +567,23 @@ onMounted(() => {
|
|||
:nextPage="nextPage"
|
||||
:fecthlistappointment="fecthlistappointment"
|
||||
/>
|
||||
<DialogOrgTree
|
||||
|
||||
<!-- <DialogOrgTree
|
||||
v-model:modal="modalTree"
|
||||
:close="closeModalTree"
|
||||
:personal="personal"
|
||||
:personalId="personalId"
|
||||
/> -->
|
||||
|
||||
<DialogOrgSelect
|
||||
:title="`เลือกหน่วยงานที่แต่งตั้ง - เลื่อน - ย้าย`"
|
||||
v-model:modal="modalTree"
|
||||
v-model:type="typeModal"
|
||||
:posType="posType"
|
||||
:posLevel="posLevel"
|
||||
:position="position"
|
||||
:dataRows="dataRows"
|
||||
:onSubmit="onSave"
|
||||
/>
|
||||
</template>
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@
|
|||
import { onMounted, ref } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useRoute, useRouter } from "vue-router";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import keycloak from "@/plugins/keycloak";
|
||||
|
|
@ -16,9 +15,14 @@ import type { QForm } from "quasar";
|
|||
import type { DataProfile } from "@/modules/05_placement/interface/index/Main";
|
||||
|
||||
/** importComponents*/
|
||||
|
||||
|
||||
import CardProfile from "@/components/CardProfile.vue";
|
||||
import CurruncyInput from "@/components/CurruncyInput.vue";
|
||||
|
||||
/** importStore*/
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
/** use*/
|
||||
const $q = useQuasar();
|
||||
const route = useRoute();
|
||||
|
|
|
|||
|
|
@ -94,12 +94,42 @@ interface ResponseData {
|
|||
};
|
||||
};
|
||||
}
|
||||
interface DataProfile {
|
||||
child1: string | null;
|
||||
child1ShortName: string | null;
|
||||
child2: string | null;
|
||||
child2ShortName: string | null;
|
||||
child3: string | null;
|
||||
child3ShortName: string | null;
|
||||
child4: string | null;
|
||||
child4ShortName: string | null;
|
||||
createdAt: string | Date;
|
||||
dateEnd: string | Date;
|
||||
dateStart: string | Date;
|
||||
firstName: string;
|
||||
id: string;
|
||||
isActive: boolean;
|
||||
lastName: string;
|
||||
organization: string;
|
||||
organizationPositionOld: string;
|
||||
posLevelName: string;
|
||||
posMasterNo: number | null;
|
||||
posTypeName: string;
|
||||
position: string;
|
||||
prefix: string;
|
||||
profileId: string;
|
||||
reason: string;
|
||||
root: string;
|
||||
rootShortName: string | null;
|
||||
status: string;
|
||||
}
|
||||
export type {
|
||||
listAppointType,
|
||||
resData,
|
||||
orgFilter,
|
||||
appointmentData,
|
||||
UserData,
|
||||
ResponseData
|
||||
ResponseData,
|
||||
DataProfile
|
||||
|
||||
}
|
||||
|
|
@ -7,12 +7,21 @@ import type { ResponseItems } from "@/modules/06_retirement/interface/response/M
|
|||
import DialogHeader from "@/modules/06_retirement/components/DialogHeader.vue";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
||||
|
||||
/** use */
|
||||
const $q = useQuasar();
|
||||
const { statusText } = useTransferDataStore();
|
||||
const selected = ref<ResponseItems[]>([]);
|
||||
const mixin = useCounterMixin();
|
||||
const { showLoader, success, messageError, dialogConfirm, hideLoader } = mixin;
|
||||
const {
|
||||
showLoader,
|
||||
success,
|
||||
messageError,
|
||||
dialogConfirm,
|
||||
hideLoader,
|
||||
findOrgName,
|
||||
} = mixin;
|
||||
|
||||
/** คอลัมน์ */
|
||||
const columns2 = ref<QTableProps["columns"]>([
|
||||
|
|
@ -33,6 +42,9 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
field: "fullname",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
return `${row.prefix}${row.firstName} ${row.lastName}`;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "position",
|
||||
|
|
@ -46,29 +58,44 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
{
|
||||
name: "positionLevel",
|
||||
align: "left",
|
||||
label: "ระดับ",
|
||||
label: "ประเภทตำแหน่ง",
|
||||
sortable: true,
|
||||
field: "positionLevel",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
let name = "";
|
||||
if (row.posTypeName && row.posLevelName) {
|
||||
name = `${row.posTypeName} (${row.posLevelName})`;
|
||||
} else if (row.posTypeName) {
|
||||
name = `${row.posTypeName}`;
|
||||
} else if (row.posLevelName) {
|
||||
name = `(${row.posLevelName})`;
|
||||
} else name = "-";
|
||||
return name;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "organizationPositionOld",
|
||||
name: "org",
|
||||
align: "left",
|
||||
label: "สังกัด",
|
||||
sortable: true,
|
||||
field: "organizationPositionOld",
|
||||
field: "org",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
return findOrgName(row);
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "statustext",
|
||||
name: "status",
|
||||
align: "left",
|
||||
label: "สถานะ",
|
||||
sortable: true,
|
||||
field: "statustext",
|
||||
field: "status",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (val) => statusText(val),
|
||||
},
|
||||
]);
|
||||
|
||||
|
|
@ -78,16 +105,15 @@ const visibleColumns2 = ref<string[]>([
|
|||
"fullname",
|
||||
"position",
|
||||
"positionLevel",
|
||||
"positionNumberOld",
|
||||
"organizationPositionOld",
|
||||
"statustext",
|
||||
"org",
|
||||
"status",
|
||||
]);
|
||||
|
||||
/** props*/
|
||||
const props = defineProps({
|
||||
modal: Boolean,
|
||||
closeModal: Function,
|
||||
getData: Function,
|
||||
fecthlistRecevice: Function,
|
||||
rows2: Array,
|
||||
filterKeyword2: String,
|
||||
});
|
||||
|
|
@ -128,7 +154,7 @@ const Ordersave = async () => {
|
|||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
props.getData?.();
|
||||
props.fecthlistRecevice?.();
|
||||
hideLoader();
|
||||
});
|
||||
};
|
||||
|
|
@ -224,31 +250,15 @@ watchEffect(() => {
|
|||
v-model="props.selected"
|
||||
/>
|
||||
</q-td>
|
||||
<q-td key="no" :props="props">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</q-td>
|
||||
<q-td key="fullname" :props="props">
|
||||
{{ props.row.fullname }}
|
||||
</q-td>
|
||||
<q-td key="position" :props="props">
|
||||
{{ props.row.position }}
|
||||
</q-td>
|
||||
<q-td key="positionLevel" :props="props">
|
||||
{{ props.row.positionLevel }}
|
||||
</q-td>
|
||||
<q-td key="organizationPositionOld" :props="props">
|
||||
<div class="table_ellipsis">
|
||||
{{ props.row.organizationPositionOld }}
|
||||
<q-td v-for="col in props.cols" :key="col.id">
|
||||
<div v-if="col.name === 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td key="organization" :props="props">
|
||||
<div class="table_ellipsis">
|
||||
{{ props.row.organization }}
|
||||
|
||||
<div v-else :class="col.name === 'org' ? 'table_ellipsis' : ''">
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td key="statustext" :props="props">
|
||||
{{ props.row.statustext }}
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</d-table>
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ const {
|
|||
hideLoader,
|
||||
success,
|
||||
dialogMessage,
|
||||
findOrgName,
|
||||
} = mixin;
|
||||
const { statusText } = transferStore;
|
||||
const modal = ref<boolean>(false);
|
||||
|
|
@ -32,9 +33,9 @@ const visibleColumns = ref<string[]>([
|
|||
"fullname",
|
||||
"position",
|
||||
"positionLevel",
|
||||
"organizationPositionOld",
|
||||
"org",
|
||||
"createdAt",
|
||||
"statustext",
|
||||
"status",
|
||||
]);
|
||||
|
||||
//ค้นหา คอลัมน์ คอลัมน์ที่แสดง
|
||||
|
|
@ -64,6 +65,9 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "fullname",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
return `${row.prefix}${row.firstName} ${row.lastName}`;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "position",
|
||||
|
|
@ -77,20 +81,34 @@ const columns = ref<QTableProps["columns"]>([
|
|||
{
|
||||
name: "positionLevel",
|
||||
align: "left",
|
||||
label: "ระดับ",
|
||||
label: "ประเภทตำแหน่ง",
|
||||
sortable: true,
|
||||
field: "positionLevel",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
let name = "";
|
||||
if (row.posTypeName && row.posLevelName) {
|
||||
name = `${row.posTypeName} (${row.posLevelName})`;
|
||||
} else if (row.posTypeName) {
|
||||
name = `${row.posTypeName}`;
|
||||
} else if (row.posLevelName) {
|
||||
name = `(${row.posLevelName})`;
|
||||
} else name = "-";
|
||||
return name;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "organizationPositionOld",
|
||||
name: "org",
|
||||
align: "left",
|
||||
label: "สังกัด",
|
||||
sortable: true,
|
||||
field: "organizationPositionOld",
|
||||
field: "org",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
return findOrgName(row);
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "createdAt",
|
||||
|
|
@ -100,15 +118,17 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "createdAt",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (val) => date2Thai(val),
|
||||
},
|
||||
{
|
||||
name: "statustext",
|
||||
name: "status",
|
||||
align: "left",
|
||||
label: "สถานะ",
|
||||
sortable: true,
|
||||
field: "statustext",
|
||||
field: "status",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (val) => statusText(val),
|
||||
},
|
||||
]);
|
||||
onMounted(async () => {
|
||||
|
|
@ -140,33 +160,8 @@ const getData = async () => {
|
|||
.get(config.API.retirementOut)
|
||||
.then((res: any) => {
|
||||
const data = res.data.result;
|
||||
let list: ResponseData[] = [];
|
||||
data.map((r: ResponseData) => {
|
||||
list.push({
|
||||
createdAt: date2Thai(r.createdAt),
|
||||
date: r.date,
|
||||
firstName: r.firstName ?? "",
|
||||
id: r.id ?? "",
|
||||
isActive: r.isActive ? r.isActive : false,
|
||||
lastName: r.lastName ?? "",
|
||||
organization: r.organization ?? "",
|
||||
organizationPositionOld: r.organizationPositionOld ?? "",
|
||||
posNo: r.posNo ?? "",
|
||||
position: r.position ?? "",
|
||||
positionLevel: r.positionLevel ?? "",
|
||||
positionLevelOld: r.positionLevelOld ?? "",
|
||||
positionNumberOld: r.positionNumberOld ?? "",
|
||||
positionTypeOld: r.positionTypeOld ?? "",
|
||||
prefix: r.prefix ?? "",
|
||||
reason: r.reason ?? "",
|
||||
salary: r.salary ? r.salary : 0,
|
||||
status: r.status ?? "",
|
||||
statustext: statusText(r.status ?? ""),
|
||||
fullname: `${r.prefix ?? ""}${r.firstName ?? ""} ${r.lastName ?? ""}`,
|
||||
});
|
||||
});
|
||||
rows.value = list;
|
||||
filters.value = list;
|
||||
rows.value = data;
|
||||
filters.value = data;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
|
|
@ -192,7 +187,7 @@ const clickDelete = async (id: string) => {
|
|||
const deleteData = async (id: string) => {
|
||||
await http
|
||||
.delete(config.API.outByid(id))
|
||||
.then((res) => {
|
||||
.then(() => {
|
||||
success($q, "ลบข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((e) => {
|
||||
|
|
@ -295,70 +290,38 @@ const pagination = ref({
|
|||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td
|
||||
key="no"
|
||||
:props="props"
|
||||
v-for="col in props.cols"
|
||||
:key="col.id"
|
||||
@click="router.push(`/retirement/out/${props.row.id}`)"
|
||||
>
|
||||
{{ props.rowIndex + 1 }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="fullname"
|
||||
:props="props"
|
||||
@click="router.push(`/retirement/out/${props.row.id}`)"
|
||||
>
|
||||
{{ props.row.fullname }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="position"
|
||||
:props="props"
|
||||
@click="router.push(`/retirement/out/${props.row.id}`)"
|
||||
>
|
||||
{{ props.row.position }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="positionLevel"
|
||||
:props="props"
|
||||
@click="router.push(`/retirement/out/${props.row.id}`)"
|
||||
>
|
||||
{{ props.row.positionLevel }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="organizationPositionOld"
|
||||
:props="props"
|
||||
@click="router.push(`/retirement/out/${props.row.id}`)"
|
||||
>
|
||||
<div class="table_ellipsis">
|
||||
{{ props.row.organizationPositionOld }}
|
||||
<div v-if="col.name === 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-else
|
||||
:class="col.name === 'org' ? 'table_ellipsis' : ''"
|
||||
>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td
|
||||
key="organization"
|
||||
:props="props"
|
||||
@click="router.push(`/retirement/out/${props.row.id}`)"
|
||||
>
|
||||
<div class="table_ellipsis">
|
||||
{{ props.row.organization }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td key="createdAt" :props="props">
|
||||
{{ props.row.createdAt }}
|
||||
</q-td>
|
||||
<q-td key="statustext" :props="props">
|
||||
{{ props.row.statustext }}
|
||||
</q-td>
|
||||
|
||||
<q-td auto-width>
|
||||
<q-btn
|
||||
v-if="
|
||||
props.row.status !== 'DONE' &&
|
||||
props.row.status !== 'REPORT'
|
||||
"
|
||||
dense
|
||||
size="12px"
|
||||
flat
|
||||
round
|
||||
color="red"
|
||||
:color="
|
||||
props.row.status == 'REPORT' || props.row.status == 'DONE'
|
||||
? 'grey'
|
||||
: 'red-7'
|
||||
"
|
||||
@click="clickDelete(props.row.id)"
|
||||
icon="mdi-delete"
|
||||
:disable="
|
||||
props.row.status == 'REPORT' || props.row.status == 'DONE'
|
||||
"
|
||||
>
|
||||
<q-tooltip>ลบข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
|
|
|
|||
|
|
@ -10,11 +10,11 @@ import keycloak from "@/plugins/keycloak";
|
|||
|
||||
/**Import type */
|
||||
import type { QForm } from "quasar";
|
||||
import type { ResponseDataDetail } from "@/modules/06_retirement/interface/response/expulsion";
|
||||
import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
|
||||
import type { DataProfile } from "@/modules/05_placement/interface/index/Main";
|
||||
|
||||
/** importComponents*/
|
||||
import CardProfile from "@/components/CardProfile.vue";
|
||||
|
||||
const modalPersonal = ref<boolean>(false);
|
||||
const personId = ref<string>("");
|
||||
/** use */
|
||||
const $q = useQuasar();
|
||||
const route = useRoute();
|
||||
|
|
@ -28,6 +28,7 @@ const {
|
|||
showLoader,
|
||||
hideLoader,
|
||||
success,
|
||||
findOrgName,
|
||||
} = mixin;
|
||||
|
||||
/**
|
||||
|
|
@ -44,30 +45,10 @@ const salary = ref<number>(0);
|
|||
const organization = ref<string>("");
|
||||
const date = ref<Date | null>(null);
|
||||
const reason = ref<string>("");
|
||||
const responseData = ref<ResponseDataDetail>({
|
||||
personId: "",
|
||||
avataPath: "",
|
||||
createdAt: new Date(),
|
||||
date: new Date(),
|
||||
id: "",
|
||||
organization: "",
|
||||
organizationPositionOld: "",
|
||||
positionLevelOld: "",
|
||||
positionNumberOld: "",
|
||||
positionTypeOld: "",
|
||||
reason: "",
|
||||
salary: 0,
|
||||
status: "",
|
||||
fullname: "",
|
||||
});
|
||||
const dataProfile = ref<DataProfile>();
|
||||
|
||||
/** Hook */
|
||||
onMounted(async () => {
|
||||
if (keycloak.tokenParsed != null) {
|
||||
roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
|
||||
}
|
||||
await getData();
|
||||
});
|
||||
const fullName = ref<string>("");
|
||||
const status = ref<string>("");
|
||||
|
||||
//นำข้อมูลจาก API มาแสดง
|
||||
const getData = async () => {
|
||||
|
|
@ -76,26 +57,16 @@ const getData = async () => {
|
|||
.get(config.API.outByid(dataId))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
responseData.value.personId = data.profileId;
|
||||
responseData.value.createdAt = data.createdAt;
|
||||
responseData.value.date =
|
||||
data.date !== null ? new Date(data.date) : new Date();
|
||||
responseData.value.id = data.id ?? "";
|
||||
responseData.value.organization = data.organization ?? "";
|
||||
responseData.value.organizationPositionOld =
|
||||
data.organizationPositionOld ?? "";
|
||||
responseData.value.positionLevelOld = data.positionLevelOld ?? "";
|
||||
responseData.value.positionNumberOld = data.positionNumberOld ?? "";
|
||||
responseData.value.positionTypeOld = data.positionTypeOld ?? "";
|
||||
responseData.value.reason = data.reason ?? "";
|
||||
responseData.value.salary = data.salary !== null ? data.salary : 0;
|
||||
responseData.value.status = data.status ?? "";
|
||||
responseData.value.avataPath = data.avatar ?? "";
|
||||
responseData.value.fullname = `${data.firstName ?? "-"} ${
|
||||
dataProfile.value = data as DataProfile;
|
||||
fullName.value = `${data.prefix}${data.firstName ?? "-"} ${
|
||||
data.lastName ?? "-"
|
||||
}`;
|
||||
status.value = data.status;
|
||||
|
||||
organizationPositionOld.value = data.organizationPositionOld
|
||||
? data.organizationPositionOld
|
||||
: findOrgName(data);
|
||||
|
||||
organizationPositionOld.value = data.organizationPositionOld ?? "";
|
||||
positionTypeOld.value = data.positionTypeOld ?? "";
|
||||
positionLevelOld.value = data.positionLevelOld ?? "";
|
||||
posNo.value = data.positionNumberOld ?? "";
|
||||
|
|
@ -118,58 +89,48 @@ const getData = async () => {
|
|||
const clickCancel = async () => {
|
||||
await getData();
|
||||
edit.value = false;
|
||||
};
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่น Save
|
||||
*/
|
||||
const conditionSave = async () => {
|
||||
if (myForm.value !== null) {
|
||||
myForm.value.validate().then((success) => {
|
||||
if (success) {
|
||||
dialogMessage(
|
||||
$q,
|
||||
"ต้องการแก้ไขข้อมูลหรือไม่?",
|
||||
"แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย",
|
||||
"mdi-help-circle-outline",
|
||||
"ตกลง",
|
||||
"public",
|
||||
async () => await saveData(),
|
||||
undefined
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
myForm.value?.resetValidation();
|
||||
};
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่น Saveจาก API
|
||||
*/
|
||||
const saveData = async () => {
|
||||
const body = {
|
||||
organization: organization.value,
|
||||
reason: reason.value,
|
||||
organizationPositionOld: organizationPositionOld.value,
|
||||
date: date.value,
|
||||
positionTypeOld: positionTypeOld.value,
|
||||
positionLevelOld: positionLevelOld.value,
|
||||
positionNumberOld: posNo.value,
|
||||
amountOld: salary.value,
|
||||
};
|
||||
showLoader();
|
||||
await http
|
||||
.put(config.API.outByid(dataId), body)
|
||||
.then((res: any) => {
|
||||
success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
|
||||
edit.value = false;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
await getData();
|
||||
hideLoader();
|
||||
});
|
||||
const onSubmit = async () => {
|
||||
dialogMessage(
|
||||
$q,
|
||||
"ต้องการแก้ไขข้อมูลหรือไม่?",
|
||||
"แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย",
|
||||
"mdi-help-circle-outline",
|
||||
"ตกลง",
|
||||
"public",
|
||||
async () => {
|
||||
const body = {
|
||||
organizationPositionOld: organizationPositionOld.value,
|
||||
positionTypeOld: positionTypeOld.value,
|
||||
positionLevelOld: positionLevelOld.value,
|
||||
positionNumberOld: posNo.value,
|
||||
amountOld: salary.value,
|
||||
organization: organization.value,
|
||||
reason: reason.value,
|
||||
date: date.value,
|
||||
};
|
||||
showLoader();
|
||||
await http
|
||||
.put(config.API.outByid(dataId), body)
|
||||
.then(() => {
|
||||
success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
|
||||
edit.value = false;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
await getData();
|
||||
hideLoader();
|
||||
});
|
||||
},
|
||||
undefined
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -183,14 +144,13 @@ const getClass = (val: boolean) => {
|
|||
};
|
||||
};
|
||||
|
||||
function onclickViewinfo(id: string) {
|
||||
modalPersonal.value = true;
|
||||
personId.value = id;
|
||||
}
|
||||
|
||||
function updatemodalPersonal(modal: boolean) {
|
||||
modalPersonal.value = modal;
|
||||
}
|
||||
/** Hook */
|
||||
onMounted(async () => {
|
||||
if (keycloak.tokenParsed != null) {
|
||||
roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
|
||||
}
|
||||
await getData();
|
||||
});
|
||||
</script>
|
||||
<template>
|
||||
<div class="toptitle text-dark col-12 row items-center">
|
||||
|
|
@ -204,109 +164,61 @@ function updatemodalPersonal(modal: boolean) {
|
|||
class="q-mr-sm"
|
||||
@click="router.go(-1)"
|
||||
/>
|
||||
รายละเอียดการให้ออกของ {{ responseData.fullname }}
|
||||
รายละเอียดการให้ออกของ {{ fullName }}
|
||||
</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">
|
||||
{{ responseData.fullname }}
|
||||
</div>
|
||||
<q-space />
|
||||
<q-btn
|
||||
outline
|
||||
color="blue"
|
||||
dense
|
||||
icon-right="mdi-open-in-new"
|
||||
class="q-px-sm"
|
||||
label="ดูข้อมูลทะเบียนประวัติ"
|
||||
@click="onclickViewinfo(responseData.personId)"
|
||||
/>
|
||||
</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="responseData.avataPath"
|
||||
v-if="responseData.avataPath !== ''"
|
||||
/>
|
||||
<q-img src="@/assets/avatar_user.jpg" v-else />
|
||||
</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">
|
||||
{{ responseData.positionTypeOld }}
|
||||
</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">
|
||||
{{ responseData.positionLevelOld }}
|
||||
</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">
|
||||
{{ responseData.organizationPositionOld }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
|
||||
<CardProfile :data="dataProfile as DataProfile" />
|
||||
|
||||
<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
|
||||
v-if="
|
||||
responseData.status !== 'DONE' && responseData.status !== 'REPORT'
|
||||
"
|
||||
>
|
||||
<div class="q-gutter-sm" v-if="!edit">
|
||||
<q-btn
|
||||
outline
|
||||
color="primary"
|
||||
dense
|
||||
icon-right="mdi-file-edit-outline"
|
||||
class="q-px-sm"
|
||||
label="แก้ไข"
|
||||
style="width: 80px"
|
||||
@click="edit = !edit"
|
||||
/>
|
||||
<q-form
|
||||
ref="myForm"
|
||||
greedy
|
||||
@submit.prevent
|
||||
@validation-success="onSubmit"
|
||||
class="col-12"
|
||||
>
|
||||
<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>
|
||||
<div class="q-gutter-sm" v-else>
|
||||
<q-btn
|
||||
outline
|
||||
color="public"
|
||||
dense
|
||||
class="q-px-sm"
|
||||
label="บันทึก"
|
||||
style="width: 80px"
|
||||
@click="conditionSave"
|
||||
/>
|
||||
<q-btn
|
||||
outline
|
||||
color="red"
|
||||
dense
|
||||
class="q-px-sm"
|
||||
label="ยกเลิก"
|
||||
style="width: 80px"
|
||||
@click="clickCancel"
|
||||
/>
|
||||
<q-space />
|
||||
<div v-if="status !== 'DONE' && status !== 'REPORT'">
|
||||
<div class="q-gutter-sm" v-if="!edit">
|
||||
<q-btn
|
||||
outline
|
||||
color="primary"
|
||||
dense
|
||||
icon-right="mdi-file-edit-outline"
|
||||
class="q-px-sm"
|
||||
label="แก้ไข"
|
||||
style="width: 80px"
|
||||
@click="edit = !edit"
|
||||
/>
|
||||
</div>
|
||||
<div class="q-gutter-sm" v-else>
|
||||
<q-btn
|
||||
outline
|
||||
color="public"
|
||||
dense
|
||||
class="q-px-sm"
|
||||
label="บันทึก"
|
||||
style="width: 80px"
|
||||
type="submit"
|
||||
/>
|
||||
<q-btn
|
||||
outline
|
||||
color="red"
|
||||
dense
|
||||
class="q-px-sm"
|
||||
label="ยกเลิก"
|
||||
style="width: 80px"
|
||||
@click="clickCancel"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<q-form ref="myForm">
|
||||
<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-12 row items-center">
|
||||
|
|
@ -468,12 +380,6 @@ function updatemodalPersonal(modal: boolean) {
|
|||
</div>
|
||||
</q-form>
|
||||
</q-card>
|
||||
|
||||
<PopupPersonal
|
||||
:modal="modalPersonal"
|
||||
:id="personId"
|
||||
@update:modal="updatemodalPersonal"
|
||||
/>
|
||||
</template>
|
||||
<style lang="scss" scope>
|
||||
.q-img {
|
||||
|
|
|
|||
|
|
@ -11,7 +11,14 @@ import config from "@/app.config";
|
|||
const router = useRouter();
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin();
|
||||
const { showLoader, hideLoader, messageError, success, date2Thai } = mixin;
|
||||
const {
|
||||
showLoader,
|
||||
hideLoader,
|
||||
messageError,
|
||||
success,
|
||||
date2Thai,
|
||||
findOrgName,
|
||||
} = mixin;
|
||||
|
||||
/** คอลัมน์ */
|
||||
const rows = ref<any>([]);
|
||||
|
|
@ -24,8 +31,6 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "no",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "fullname",
|
||||
|
|
@ -35,15 +40,9 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "fullname",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "positionType",
|
||||
align: "left",
|
||||
label: "ตำแหน่งประเภท",
|
||||
sortable: true,
|
||||
field: "positionType",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
return `${row.prefix}${row.firstName} ${row.lastName}`;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "position",
|
||||
|
|
@ -55,31 +54,46 @@ const columns = ref<QTableProps["columns"]>([
|
|||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "positionLevel",
|
||||
name: "positionType",
|
||||
align: "left",
|
||||
label: "ระดับ",
|
||||
label: "ประเภทตำแหน่ง",
|
||||
sortable: true,
|
||||
field: "positionLevel",
|
||||
field: "positionType",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
let name = "";
|
||||
if (row.posTypeName && row.posLevelName) {
|
||||
name = `${row.posTypeName} (${row.posLevelName})`;
|
||||
} else if (row.posTypeName) {
|
||||
name = `${row.posTypeName}`;
|
||||
} else if (row.posLevelName) {
|
||||
name = `(${row.posLevelName})`;
|
||||
} else name = "-";
|
||||
return name;
|
||||
},
|
||||
},
|
||||
|
||||
// {
|
||||
// name: "positionExecutive",
|
||||
// align: "left",
|
||||
// label: "ตำแหน่งทางการบริหาร",
|
||||
// sortable: true,
|
||||
// field: "positionExecutive",
|
||||
// headerStyle: "font-size: 14px",
|
||||
// style: "font-size: 14px",
|
||||
// },
|
||||
{
|
||||
name: "positionExecutive",
|
||||
align: "left",
|
||||
label: "ตำแหน่งทางการบริหาร",
|
||||
sortable: true,
|
||||
field: "positionExecutive",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "oc",
|
||||
name: "org",
|
||||
align: "left",
|
||||
label: "สังกัด",
|
||||
sortable: true,
|
||||
field: "oc",
|
||||
field: "org",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format(val, row) {
|
||||
return findOrgName(row);
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "createdAt",
|
||||
|
|
@ -89,19 +103,19 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "createdAt",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (val) => date2Thai(val),
|
||||
},
|
||||
]);
|
||||
|
||||
/** คอลัมน์ที่แสดง */
|
||||
const visibleColumns = ref<string[]>([
|
||||
"no",
|
||||
"prefix",
|
||||
"fullname",
|
||||
"positionType",
|
||||
"position",
|
||||
"positionLevel",
|
||||
"positionExecutive",
|
||||
"oc",
|
||||
"org",
|
||||
"createdAt",
|
||||
]);
|
||||
|
||||
|
|
@ -116,17 +130,8 @@ const fectListDecased = async () => {
|
|||
await http
|
||||
.get(config.API.listDeceased())
|
||||
.then((res) => {
|
||||
rows.value = res.data.result.map((e: any) => ({
|
||||
personalId: e.id,
|
||||
fullname: `${e.prefix ?? ""}${e.firstName ?? ""} ${e.lastName ?? ""}`,
|
||||
positionType: e.positionType == null ? "-" : e.positionType,
|
||||
position: e.positionLine == null ? "-" : e.positionLine,
|
||||
positionLevel: e.positionLevel === null ? "-" : e.positionLevel,
|
||||
positionExecutive:
|
||||
e.positionExecutive == null ? "-" : e.positionExecutive,
|
||||
oc: e.organization == null ? "-" : e.organization,
|
||||
createdAt: date2Thai(e.createdAt),
|
||||
}));
|
||||
const data = res.data.result;
|
||||
rows.value = data;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
|
|
@ -228,35 +233,23 @@ const pagination = ref({
|
|||
<q-tr
|
||||
:props="props"
|
||||
class="cursor-pointer"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
@click="nextPage(props.row.id)"
|
||||
>
|
||||
<q-td key="no" :props="props">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</q-td>
|
||||
<q-td key="fullname" :props="props">
|
||||
{{ props.row.fullname }}
|
||||
</q-td>
|
||||
<q-td key="positionType" :props="props">
|
||||
{{ props.row.positionType }}
|
||||
</q-td>
|
||||
<q-td key="position" :props="props">
|
||||
{{ props.row.position }}
|
||||
</q-td>
|
||||
<q-td key="positionLevel" :props="props">
|
||||
{{ props.row.positionLevel }}
|
||||
</q-td>
|
||||
<q-td key="positionExecutive" :props="props">
|
||||
{{ props.row.positionExecutive }}
|
||||
</q-td>
|
||||
<q-td key="oc" :props="props">
|
||||
{{ props.row.oc }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="createdAt"
|
||||
:props="props"
|
||||
@click="nextPage(props.row)"
|
||||
v-for="col in props.cols"
|
||||
:key="col.id"
|
||||
@click.stop.prevent="nextPage(props.row.id)"
|
||||
>
|
||||
{{ props.row.createdAt }}
|
||||
<div v-if="col.name === 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-else
|
||||
:class="col.name === 'org' ? 'table_ellipsis' : ''"
|
||||
>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -2,13 +2,19 @@
|
|||
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";
|
||||
import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
|
||||
|
||||
const modalPersonal = ref<boolean>(false);
|
||||
const personId = ref<string>("");
|
||||
|
||||
/** importType*/
|
||||
import type { DataProfile } from "@/modules/05_placement/interface/index/Main";
|
||||
import type { ResDetailDeceased } from "@/modules/06_retirement/interface/response/Deceased";
|
||||
|
||||
/** importComponents*/
|
||||
import CardProfile from "@/components/CardProfile.vue";
|
||||
|
||||
/** importStore*/
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
/**use*/
|
||||
const $q = useQuasar();
|
||||
const router = useRouter();
|
||||
|
|
@ -17,21 +23,26 @@ const mixin = useCounterMixin();
|
|||
const { showLoader, hideLoader, messageError, date2Thai } = mixin;
|
||||
const fullName = ref<string>("");
|
||||
const profileId = ref<string>(route.params.id.toString());
|
||||
const detail = ref<any>([]);
|
||||
const detail = ref<ResDetailDeceased>();
|
||||
|
||||
const dataProfile = ref<DataProfile>();
|
||||
|
||||
/** Hook */
|
||||
onMounted(() => {
|
||||
fectdata();
|
||||
fetchData();
|
||||
});
|
||||
|
||||
//นำข้อมูลจาก API มาแสดง
|
||||
const fectdata = async () => {
|
||||
const fetchData = async () => {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.detailDeceased(profileId.value))
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
dataProfile.value = data as DataProfile;
|
||||
detail.value = data;
|
||||
console.log(detail.value?.firstName);
|
||||
|
||||
fullName.value = `${data.prefix}${data.firstName} ${data.lastName}`;
|
||||
})
|
||||
.catch((e) => {
|
||||
|
|
@ -42,7 +53,6 @@ const fectdata = async () => {
|
|||
});
|
||||
};
|
||||
|
||||
|
||||
//เปิดdetail ของ deceased
|
||||
const openDeceased = (id: string) => {
|
||||
router.push(`/deceased/detail/${id}`);
|
||||
|
|
@ -87,15 +97,6 @@ const fileDownload = async (type: string) => {
|
|||
hideLoader();
|
||||
});
|
||||
};
|
||||
|
||||
function onclickViewinfo(id: string) {
|
||||
modalPersonal.value = true;
|
||||
personId.value = id;
|
||||
}
|
||||
|
||||
function updatemodalPersonal(modal: boolean) {
|
||||
modalPersonal.value = modal;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -112,50 +113,8 @@ function updatemodalPersonal(modal: boolean) {
|
|||
/>
|
||||
รายละเอียดบันทึกเวียนแจ้งการถึงแก่กรรม {{ fullName }}
|
||||
</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">
|
||||
{{ fullName }}
|
||||
</div>
|
||||
<q-space />
|
||||
<q-btn
|
||||
outline
|
||||
color="blue"
|
||||
dense
|
||||
icon-right="mdi-open-in-new"
|
||||
class="q-px-sm"
|
||||
label="ดูข้อมูลทะเบียนประวัติ"
|
||||
@click="onclickViewinfo(detail.profileId)"
|
||||
/>
|
||||
</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="detail.avatar" v-if="detail.avatar !== null" />
|
||||
<q-img src="@/assets/avatar_user.jpg" v-else />
|
||||
</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.positionLine }}</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>
|
||||
|
||||
<CardProfile :data="dataProfile as DataProfile" />
|
||||
|
||||
<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">
|
||||
|
|
@ -189,27 +148,28 @@ function updatemodalPersonal(modal: boolean) {
|
|||
<div class="col-12">
|
||||
<div class="col-12 text-top">เลขที่ใบมรณบัตร</div>
|
||||
<div class="col-12 text-detail">
|
||||
{{ detail.number }}
|
||||
{{ 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 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 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 class="col-12 text-detail">
|
||||
{{ detail?.date ? date2Thai(detail?.date) : "-" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-3 row items-center">
|
||||
|
|
@ -221,35 +181,27 @@ function updatemodalPersonal(modal: boolean) {
|
|||
round
|
||||
color="red"
|
||||
icon="mdi-file-pdf"
|
||||
@click="nextPage(detail.pathName)"
|
||||
@click="detail?.pathName ? nextPage(detail?.pathName) : null"
|
||||
>
|
||||
<q-tooltip>ใบมรณบัตร</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<div class="row">
|
||||
<q-space />
|
||||
<q-btn
|
||||
color="public"
|
||||
dense
|
||||
class="q-px-sm"
|
||||
label="ส่งหนังสือเวียน"
|
||||
@click="openDeceased(profileId)"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="row">
|
||||
<q-space />
|
||||
<q-btn
|
||||
color="public"
|
||||
label="ส่งหนังสือเวียน"
|
||||
@click="openDeceased(profileId)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
|
||||
<PopupPersonal
|
||||
:modal="modalPersonal"
|
||||
:id="personId"
|
||||
@update:modal="updatemodalPersonal"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scope>
|
||||
|
|
|
|||
|
|
@ -1,27 +1,61 @@
|
|||
interface requestSendNoti {
|
||||
profileId: string;
|
||||
isSendMail: boolean;
|
||||
isSendInbox: boolean;
|
||||
isSendNotification: boolean;
|
||||
}
|
||||
interface DataCopyOrder {
|
||||
id:string;
|
||||
personalId: string;
|
||||
name: string;
|
||||
idCard: string;
|
||||
position: string;
|
||||
unit: string;
|
||||
send: string;
|
||||
mutiselect: number[];
|
||||
}
|
||||
interface ResponseOrganiz {
|
||||
firstName: string;
|
||||
idCard: string;
|
||||
lastName: string;
|
||||
name: string;
|
||||
position: string;
|
||||
prefixId: string;
|
||||
profileId: string;
|
||||
unit: string;
|
||||
}
|
||||
export type { requestSendNoti,DataCopyOrder,ResponseOrganiz };
|
||||
profileId: string;
|
||||
isSendMail: boolean;
|
||||
isSendInbox: boolean;
|
||||
isSendNotification: boolean;
|
||||
}
|
||||
interface DataCopyOrder {
|
||||
id: string;
|
||||
personalId: string;
|
||||
name: string;
|
||||
idCard: string;
|
||||
position: string;
|
||||
unit: string;
|
||||
send: string;
|
||||
mutiselect: number[];
|
||||
}
|
||||
interface ResponseOrganiz {
|
||||
firstName: string;
|
||||
idCard: string;
|
||||
lastName: string;
|
||||
name: string;
|
||||
position: string;
|
||||
prefixId: string;
|
||||
profileId: string;
|
||||
unit: string;
|
||||
}
|
||||
|
||||
interface ResDetailDeceased {
|
||||
id: string;
|
||||
profileId: string;
|
||||
prefix: string;
|
||||
firstName: string;
|
||||
lastName: string;
|
||||
root: string;
|
||||
rootShortName: string;
|
||||
child1: string | null;
|
||||
child1ShortName: string | null;
|
||||
child2: string | null;
|
||||
child2ShortName: string | null;
|
||||
child3: string | null;
|
||||
child3ShortName: null;
|
||||
child4: string | null;
|
||||
child4ShortName: string | null;
|
||||
posMasterNo: number | null;
|
||||
position: string;
|
||||
posLevelName: string;
|
||||
posTypeName: string;
|
||||
number: string;
|
||||
date: Date | null | undefined;
|
||||
location: string;
|
||||
reason: string;
|
||||
pathName: string | null;
|
||||
isActive: boolean;
|
||||
createdAt: string;
|
||||
}
|
||||
export type {
|
||||
requestSendNoti,
|
||||
DataCopyOrder,
|
||||
ResponseOrganiz,
|
||||
ResDetailDeceased,
|
||||
};
|
||||
|
|
|
|||
|
|
@ -26,21 +26,4 @@ interface TypeFile {
|
|||
pathName: string;
|
||||
}
|
||||
|
||||
interface ResponseDataDetail {
|
||||
personId: string;
|
||||
avataPath: string;
|
||||
createdAt: Date;
|
||||
date: Date;
|
||||
id: string;
|
||||
organization: string;
|
||||
organizationPositionOld: string;
|
||||
positionLevelOld: string;
|
||||
positionNumberOld: string;
|
||||
positionTypeOld: string;
|
||||
reason: string;
|
||||
salary: number;
|
||||
status: string;
|
||||
fullname: string;
|
||||
}
|
||||
|
||||
export type { ResponseData, ResponseDataDetail, TypeFile };
|
||||
export type { ResponseData, TypeFile };
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue