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

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-07-04 15:43:28 +07:00
parent 17b801eede
commit 00b75e0a10
3 changed files with 137 additions and 113 deletions

View file

@ -6,6 +6,8 @@ import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import { useRoute } from "vue-router";
import DialogHeader from "../DialogHeader.vue";
/** Use */
const $q = useQuasar(); // noti quasar
const mixin = useCounterMixin();
@ -79,6 +81,8 @@ const rows = ref<any>([]);
watch(modal, () => {
if (modal.value === true) {
retireld.value = props.retireld;
formPagePersonList.page = 1;
formPagePersonList.keyword = "";
if (props.dataProfile) {
if (props.dataProfile.type === "OFFICER") {
type.value = "officer";
@ -150,9 +154,7 @@ const fecthProfile = async () => {
fullname: e.prefix + e.firstName + " " + e.lastName,
position: e.position,
level:
e.posTypeName && e.posLevelName
? e.posTypeName + " (" + e.posLevelName + ")"
: "-",
e.posTypeName && e.posLevelName ? e.posTypeName + " (" + e.posLevelName + ")" : "-",
organizationOrganization: findOrgChildName(e),
}));
})
@ -185,8 +187,8 @@ const fecthProfile = async () => {
fullname: e.prefix + e.firstName + " " + e.lastName,
position: e.position,
level:
e.posTypeName && e.posLevelName
? e.posTypeName + " (" + e.posLevelName + ")"
e.posType && e.posLevel
? e.posType + " (" + e.posLevel + ")"
: "-",
organizationOrganization: findOrgName(e),
}));
@ -242,6 +244,10 @@ watch(
fecthProfile();
}
);
function closeDialog() {
modal.value = false;
}
</script>
<template>
@ -256,9 +262,102 @@ watch(
<q-tooltip>เพมรายช</q-tooltip></q-btn
>
<q-dialog v-model="modal">
<q-card style="width: 900px; max-width: 80vw" class="q-pb-md">
<q-toolbar class="q-py-md">
<q-dialog v-model="modal" Persistent>
<q-card style="width: 900px; max-width: 80vw">
<DialogHeader :title="'เพิ่มรายชื่อ'" :close="closeDialog" />
<q-separator />
<q-card-section>
<div class="row q-col-gutter-sm">
<div class="col-12">
<q-input
borderless
outlined
dense
clearable
v-model="formPagePersonList.keyword"
placeholder="ค้นหา"
@keyup.enter="(formPagePersonList.page = 1), fecthProfile()"
>
<template v-slot:append>
<q-icon name="search" />
</template>
</q-input>
</div>
<div class="col-12">
<d-table
flat
bordered
dense
:rows="rows"
:columns="columns"
row-key="name"
class="custom-header-table"
:rows-per-page-options="[10, 20, 50, 100]"
@update:pagination="updatePageSize"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props"
><div>
<span class="row text-black">{{ col.label }}</span>
</div>
</q-th>
<q-th auto-width />
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td>{{
(formPagePersonList.page - 1) *
Number(formPagePersonList.pageSize) +
props.rowIndex +
1
}}</q-td>
<q-td key="fullname" :props="props">
{{ props.row.prefix ? props.row.prefix : ""
}}{{ props.row.firstName ? props.row.firstName : "" }}
{{ props.row.lastName ? props.row.lastName : "" }}
</q-td>
<q-td key="position" :props="props">
{{ props.row.position ? props.row.position : "-" }}
</q-td>
<q-td key="level" :props="props">{{ props.row.level }}</q-td>
<q-td
key="organizationOrganization"
:props="props"
class="table_ellipsis"
>
{{ props.row.organizationOrganization }}
</q-td>
<q-td>
<q-btn
outline
:props="props"
label="เพิ่ม"
class="text-teal-5"
@click="clickAdd(props)"
/>
</q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
งหมด {{ totalList }} รายการ
<q-pagination
v-model="formPagePersonList.page"
color="primary"
:max="maxPage"
:max-pages="5"
size="sm"
boundary-links
direction-links
@update:model-value="fecthProfile"
></q-pagination>
</template>
</d-table>
</div>
</div>
</q-card-section>
<!-- <q-toolbar class="q-py-md">
<q-toolbar-title class="text-h6">เพมรายช </q-toolbar-title>
<q-btn
icon="close"
@ -269,96 +368,7 @@ watch(
style="color: #ff8080; background-color: #ffdede"
/>
</q-toolbar>
<q-separator />
<div class="q-pa-md">
<q-toolbar style="padding: 0">
<q-input
borderless
outlined
dense
clearable
v-model="formPagePersonList.keyword"
placeholder="ค้นหา"
style="width: 850px; max-width: auto"
@keyup.enter="(formPagePersonList.page = 1), fecthProfile()"
>
<template v-slot:append>
<q-icon name="search" />
</template>
</q-input>
</q-toolbar>
<d-table
flat
bordered
dense
:rows="rows"
:columns="columns"
row-key="name"
class="custom-header-table"
:rows-per-page-options="[10, 20, 50, 100]"
@update:pagination="updatePageSize"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props"
><div>
<span class="row text-black">{{ col.label }}</span>
</div>
</q-th>
<q-th auto-width />
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td>{{
(formPagePersonList.page - 1) *
Number(formPagePersonList.pageSize) +
props.rowIndex +
1
}}</q-td>
<q-td key="fullname" :props="props">
{{ props.row.prefix ? props.row.prefix : ""
}}{{ props.row.firstName ? props.row.firstName : "" }}
{{ props.row.lastName ? props.row.lastName : "" }}
</q-td>
<q-td key="position" :props="props">
{{ props.row.position ? props.row.position : "-" }}
</q-td>
<q-td key="level" :props="props">{{ props.row.level }}</q-td>
<q-td
key="organizationOrganization"
:props="props"
class="table_ellipsis"
>
{{ props.row.organizationOrganization }}
</q-td>
<q-td>
<q-btn
outline
:props="props"
label="เพิ่ม"
class="text-teal-5"
@click="clickAdd(props)"
/>
</q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
งหมด {{ totalList }} รายการ
<q-pagination
v-model="formPagePersonList.page"
color="primary"
:max="maxPage"
:max-pages="5"
size="sm"
boundary-links
direction-links
@update:model-value="fecthProfile"
></q-pagination>
</template>
</d-table>
</div>
-->
</q-card>
</q-dialog>
</template>

View file

@ -657,19 +657,32 @@ function updatemodalPersonal(modal: boolean) {
<q-td key="positionNumber" :props="props">{{
props.row.positionNumber ? props.row.positionNumber : "-"
}}</q-td>
<!-- <q-td key="organizationAgency" :props="props">{{
props.row.organizationAgency
}}</q-td>
<q-td key="organizationGovernmentAgency" :props="props">{{
props.row.organizationGovernmentAgency
}}</q-td> -->
<q-td class="table_ellipsis" key="organization" :props="props">{{
props.row.organization ? props.row.organization : "-"
}}</q-td>
<!-- <q-td class="table_ellipsis" key="bureau" :props="props">{{
props.row.bureau
}}</q-td> -->
<q-td auto-width></q-td>
<q-td auto-width>
<q-btn
v-if="
(props.row.remove === 'EDIT' ||
props.row.remove === 'REMOVE') &&
statusUpload
"
flat
round
:color="props.row.remove === 'EDIT' ? 'primary' : 'red-14'"
icon="info"
dense
@click.stop="
(modalNote = true),
(action = 'delete'),
(note = props.row.reason),
(retireProfileId = props.row.id)
"
><q-tooltip>อม</q-tooltip></q-btn
>
</q-td>
<q-td
auto-width
v-if="
@ -722,7 +735,7 @@ function updatemodalPersonal(modal: boolean) {
><q-tooltip>ลบขอม</q-tooltip></q-btn
>
</q-td>
<q-td auto-width v-else></q-td>
<q-td auto-width v-else> </q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
@ -742,7 +755,7 @@ function updatemodalPersonal(modal: boolean) {
</div>
<!-- note -->
<q-dialog v-model="modalNote">
<q-dialog v-model="modalNote" persistent>
<q-card style="width: 50vw">
<DialogHeader tittle="กรอกเหตุผล" :close="closeDialog" />
<q-separator />
@ -758,6 +771,7 @@ function updatemodalPersonal(modal: boolean) {
:rules="[(val) => !!val || 'กรุณากรอกเหตุผล']"
:label="`${'กรอกเหตุผล'}`"
type="textarea"
:readonly="statusUpload"
/>
</div>
</div>
@ -765,7 +779,7 @@ function updatemodalPersonal(modal: boolean) {
<q-separator />
<q-card-actions align="right">
<q-card-actions align="right" v-if="!statusUpload">
<q-btn
v-if="action === 'delete'"
unelevated
@ -787,7 +801,7 @@ function updatemodalPersonal(modal: boolean) {
</q-dialog>
<!-- ปโหลดไฟล -->
<q-dialog v-model="modalUpload">
<q-dialog v-model="modalUpload" persistent>
<q-card style="width: 50vw">
<DialogHeader tittle="อัปโหลดเอกสาร" :close="closeDialog" />
<q-separator />

View file

@ -111,7 +111,7 @@ const cerateRetirement = async (data: object) => {
>
<q-tooltip>เพ</q-tooltip>
</q-btn>
<q-dialog v-model="modal">
<q-dialog v-model="modal" persistent>
<q-card style="width: 450px; max-width: 80vw">
<q-card-section>
<h6 class="q-ma-none">เพมประกาศ</h6>