updated ทะเบียนประวัติ

This commit is contained in:
Warunee Tamkoo 2024-08-13 18:05:23 +07:00
parent d9b8791706
commit 5166d1c16a
6 changed files with 415 additions and 379 deletions

View file

@ -72,126 +72,126 @@ const workDateRef = ref<object | null>(null);
const reasonSameDateRef = ref<object | null>(null);
const visibleColumnsHistory = ref<String[]>([
"oc",
"position",
"positionPathSide",
"posNo",
"positionLine",
"positionType",
"positionLevel",
"positionExecutive",
"positionExecutiveSide",
// "oc",
// "position",
// "positionPathSide",
// "posNo",
// "positionLine",
// "positionType",
// "positionLevel",
// "positionExecutive",
// "positionExecutiveSide",
"dateAppoint",
"dateStart",
"retireDate",
"govAge",
"govAgeAbsent",
"govAgePlus",
// "retireDate",
// "govAge",
// "govAgeAbsent",
// "govAgePlus",
"reasonSameDate",
"lastUpdateFullName",
"lastUpdatedAt",
]);
const columnsHistory = ref<QTableProps["columns"]>([
{
name: "oc",
align: "left",
label: "สังกัด",
sortable: true,
field: "oc",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "positionPathSide",
align: "left",
label: "ตำแหน่ง",
sortable: true,
field: "positionPathSide",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "position",
align: "left",
label: "ด้าน/สาขา",
sortable: true,
field: "position",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "posNo",
align: "left",
label: "ตำแหน่งเลขที่",
sortable: true,
field: "posNo",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "positionLine",
align: "left",
label: "สายงาน",
sortable: true,
field: "positionLine",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "positionType",
align: "left",
label: "ประเภท",
sortable: true,
field: "positionType",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "positionLevel",
align: "left",
label: "ระดับ",
sortable: true,
field: "positionLevel",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "positionExecutive",
align: "left",
label: "ตำแหน่งทางการบริหาร",
sortable: true,
field: "positionExecutive",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "positionExecutiveSide",
align: "left",
label: "ด้านทางการบริหาร",
sortable: true,
field: "positionExecutiveSide",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
// {
// name: "oc",
// align: "left",
// label: "",
// sortable: true,
// field: "oc",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
// {
// name: "positionPathSide",
// align: "left",
// label: "",
// sortable: true,
// field: "positionPathSide",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
// {
// name: "position",
// align: "left",
// label: "/",
// sortable: true,
// field: "position",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
// {
// name: "posNo",
// align: "left",
// label: "",
// sortable: true,
// field: "posNo",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
// {
// name: "positionLine",
// align: "left",
// label: "",
// sortable: true,
// field: "positionLine",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
// {
// name: "positionType",
// align: "left",
// label: "",
// sortable: true,
// field: "positionType",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
// {
// name: "positionLevel",
// align: "left",
// label: "",
// sortable: true,
// field: "positionLevel",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
// {
// name: "positionExecutive",
// align: "left",
// label: "",
// sortable: true,
// field: "positionExecutive",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
// {
// name: "positionExecutiveSide",
// align: "left",
// label: "",
// sortable: true,
// field: "positionExecutiveSide",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
{
name: "dateAppoint",
align: "left",
@ -216,51 +216,51 @@ const columnsHistory = ref<QTableProps["columns"]>([
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "retireDate",
align: "left",
label: "วันเกษียณอายุ",
sortable: true,
field: "retireDate",
format: (v) => date2Thai(v),
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "govAge",
align: "left",
label: "อายุราชการ",
sortable: true,
field: "govAge",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "govAgeAbsent",
align: "left",
label: "ขาดราชการ",
sortable: true,
field: "govAgeAbsent",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "govAgePlus",
align: "left",
label: "อายุราชการเกื้อกูล",
sortable: true,
field: "govAgePlus",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
// {
// name: "retireDate",
// align: "left",
// label: "",
// sortable: true,
// field: "retireDate",
// format: (v) => date2Thai(v),
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
// {
// name: "govAge",
// align: "left",
// label: "",
// sortable: true,
// field: "govAge",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
// {
// name: "govAgeAbsent",
// align: "left",
// label: "",
// sortable: true,
// field: "govAgeAbsent",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
// {
// name: "govAgePlus",
// align: "left",
// label: "",
// sortable: true,
// field: "govAgePlus",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
{
name: "reasonSameDate",
align: "left",
@ -596,6 +596,22 @@ onMounted(() => {
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-md-6">
<div class="row">
<div class="col-12 col-sm-12 col-md-5">
<span class="text-grey-6 text-weight-medium"
>นทเกษยณอายราชการตามกฏหมาย</span
>
</div>
<div class="col-12 col-sm-12 col-md-7">
<span>{{
formMain.dateRetireLaw
? date2Thai(formMain.dateRetireLaw as Date)
: "-"
}}</span>
</div>
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-md-6 q-gutter-y-sm">
@ -635,22 +651,6 @@ onMounted(() => {
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-md-6">
<div class="row">
<div class="col-12 col-sm-12 col-md-5">
<span class="text-grey-6 text-weight-medium"
>นทเกษยณอายราชการตามกฏหมาย</span
>
</div>
<div class="col-12 col-sm-12 col-md-7">
<span>{{
formMain.dateRetireLaw
? date2Thai(formMain.dateRetireLaw as Date)
: "-"
}}</span>
</div>
</div>
</div>
</div>
</div>
</q-card>

View file

@ -70,6 +70,8 @@ const changeNameData = reactive({
status: "",
documentId: "",
});
const selection = ref<string[]>([]);
const prefixChange = ref<string>("");
const firstNameChange = ref<string>("");
const lastNameChange = ref<string>("");
@ -99,7 +101,9 @@ const visibleColumns = ref<string[]>([
"prefix",
"firstName",
"lastName",
"status",
"lastUpdateFullName",
"lastUpdatedAt",
// "status",
]);
const historyVisibleColumns = ref<String[]>([
"prefix",
@ -146,12 +150,35 @@ const columns = ref<QTableProps["columns"]>([
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
// {
// name: "status",
// align: "left",
// label: "",
// sortable: true,
// field: "status",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// sort: (a: string, b: string) =>
// a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
// },
{
name: "status",
name: "lastUpdateFullName",
align: "left",
label: "สถานะการเปลี่ยนชื่อ",
label: "ผู้ดำเนินการ",
sortable: true,
field: "status",
field: "lastUpdateFullName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "lastUpdatedAt",
align: "left",
label: "วันที่แก้ไข",
sortable: true,
field: "lastUpdatedAt",
format: (v) => date2Thai(v),
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
@ -241,22 +268,23 @@ const historyPagination = ref({
rowsPerPage: 10,
});
function editForm(row: any) {
submitDisable.value = true;
dialogStatus.value = "edit";
editId.value = row.id;
subId.value = row.id;
changeNameData.prefix = row.prefix;
changeNameData.firstName = row.firstName;
changeNameData.lastName = row.lastName;
changeNameData.status = row.status;
prefixChange.value = changeNameData.prefix;
firstNameChange.value = changeNameData.firstName;
lastNameChange.value = changeNameData.lastName;
dialog.value = true;
}
// function editForm(row: any) {
// submitDisable.value = true;
// dialogStatus.value = "edit";
// editId.value = row.id;
// subId.value = row.id;
// changeNameData.prefix = row.prefix;
// changeNameData.firstName = row.firstName;
// changeNameData.lastName = row.lastName;
// changeNameData.status = row.status;
// prefixChange.value = changeNameData.prefix;
// firstNameChange.value = changeNameData.firstName;
// lastNameChange.value = changeNameData.lastName;
// dialog.value = true;
// }
function closeDialog() {
selection.value = [];
alertUpload.value = false;
dialog.value = false;
}
@ -550,7 +578,16 @@ watch(
>
<q-tooltip>เพมขอม</q-tooltip></q-btn
>
<!-- <q-btn
flat
dense
round
icon="mdi-history"
color="deep-purple"
@click="() => (fetchHistoryData(props.row.id), (historyDialog = true))"
>
<q-tooltip>ประวการเปลยนช-นามสก</q-tooltip>
</q-btn> -->
<q-space />
<q-input
dense
@ -617,19 +654,7 @@ watch(
>
<q-tooltip>ดาวนโหลด</q-tooltip>
</q-btn>
<q-btn
flat
dense
round
icon="mdi-history"
color="deep-purple"
@click="
() => (fetchHistoryData(props.row.id), (historyDialog = true))
"
>
<q-tooltip>ประวการเปลยนช-นามสก</q-tooltip>
</q-btn>
<q-btn
<!-- <q-btn
v-if="checkPermission($route)?.attrIsUpdate"
flat
dense
@ -644,7 +669,7 @@ watch(
"
>
<q-tooltip>แกไขขอม</q-tooltip>
</q-btn>
</q-btn> -->
</q-td>
<q-td v-for="(col, index) in props.cols" :key="col.name">
<div class="table_ellipsis">
@ -658,16 +683,33 @@ watch(
<q-dialog v-model="dialog" persistent>
<q-card>
<q-form @submit.prevent greedy @validation-success="onSubmit()">
<dialog-header
:tittle="dialogStatus === 'edit' ? 'แก้ไขข้อมูล' : 'เพิ่มข้อมูล'"
:close="closeDialog"
/>
<dialog-header tittle="เปลี่ยนชื่อ-นามสกุล" :close="closeDialog" />
<q-separator />
<q-card-section>
<div class="row q-mb-sm">
<div class="col-5">
<q-select
<div class="col-12">
<div class="row">
<div class="q-gutter-sm">
<q-checkbox
v-model="selection"
val="prefix"
label="เปลี่ยนคำนำหน้าชื่อ"
/>
<q-checkbox
v-model="selection"
val="firstname"
label="เปลี่ยนชื่อ"
/>
<q-checkbox
v-model="selection"
val="lastname"
label="เปลี่ยนนามสกุล"
/>
</div>
</div>
<!-- <q-select
class="inputgreen"
outlined
v-model="changeNameData.status"
@ -683,36 +725,18 @@ watch(
doneFn:Function) => filterSelector(inputValue, doneFn,'statusOptions'
) "
dense
/>
/> -->
</div>
</div>
<div class="row q-gutter-sm q-mb-md">
<div class="col">
<q-select
:readonly="
!changeNameData.status ||
(changeNameData.status !== 'เปลี่ยนคำนำหน้าชื่อ' &&
changeNameData.status !== 'เปลี่ยนคำนำหน้าชื่อ และชื่อ' &&
changeNameData.status !==
'เปลี่ยนคำนำหน้าชื่อ และนามสกุล' &&
changeNameData.status !==
'เปลี่ยนคำนำหน้าชื่อ และชื่อ-นามสกุล')
"
:readonly="!selection.includes('prefix')"
v-model="changeNameData.prefix"
:options="store.Ops.prefixOps"
label="คำนำหน้าชื่อ"
dense
:class="
!changeNameData.status ||
(changeNameData.status !== 'เปลี่ยนคำนำหน้าชื่อ' &&
changeNameData.status !== 'เปลี่ยนคำนำหน้าชื่อ และชื่อ' &&
changeNameData.status !==
'เปลี่ยนคำนำหน้าชื่อ และนามสกุล' &&
changeNameData.status !==
'เปลี่ยนคำนำหน้าชื่อ และชื่อ-นามสกุล')
? ''
: 'inputgreen'
"
:class="!selection.includes('prefix') ? '' : 'inputgreen'"
outlined
use-input
lazy-rules
@ -730,60 +754,26 @@ watch(
</div>
<div class="col">
<q-input
:readonly="
!changeNameData.status ||
(changeNameData.status !== 'เปลี่ยนชื่อ' &&
changeNameData.status !== 'เปลี่ยนคำนำหน้าชื่อ และชื่อ' &&
changeNameData.status !== 'เปลี่ยนชื่อ-นามสกุล' &&
changeNameData.status !==
'เปลี่ยนคำนำหน้าชื่อ และชื่อ-นามสกุล')
"
:readonly="!selection.includes('firstname')"
outlined
v-model="changeNameData.firstName"
label="ชื่อ"
bg-color="white"
dense
:class="
!changeNameData.status ||
(changeNameData.status !== 'เปลี่ยนชื่อ' &&
changeNameData.status !== 'เปลี่ยนคำนำหน้าชื่อ และชื่อ' &&
changeNameData.status !== 'เปลี่ยนชื่อ-นามสกุล' &&
changeNameData.status !==
'เปลี่ยนคำนำหน้าชื่อ และชื่อ-นามสกุล')
? ''
: 'inputgreen'
"
:class="!selection.includes('firstname') ? '' : 'inputgreen'"
:rules="[(val) => !!val || `${'กรุณากรอกชื่อ'}`]"
hide-bottom-space
/>
</div>
<div class="col">
<q-input
:readonly="
!changeNameData.status ||
(changeNameData.status !== 'เปลี่ยนนามสกุล' &&
changeNameData.status !== 'เปลี่ยนชื่อ-นามสกุล' &&
changeNameData.status !==
'เปลี่ยนคำนำหน้าชื่อ และนามสกุล' &&
changeNameData.status !==
'เปลี่ยนคำนำหน้าชื่อ และชื่อ-นามสกุล')
"
:readonly="!selection.includes('lastname')"
outlined
v-model="changeNameData.lastName"
label="นามสกุล"
bg-color="white"
dense
:class="
!changeNameData.status ||
(changeNameData.status !== 'เปลี่ยนนามสกุล' &&
changeNameData.status !== 'เปลี่ยนชื่อ-นามสกุล' &&
changeNameData.status !==
'เปลี่ยนคำนำหน้าชื่อ และนามสกุล' &&
changeNameData.status !==
'เปลี่ยนคำนำหน้าชื่อ และชื่อ-นามสกุล')
? ''
: 'inputgreen'
"
:class="!selection.includes('lastname') ? '' : 'inputgreen'"
:rules="[(val) => !!val || `${'กรุณากรอกนามสกุล'}`]"
hide-bottom-space
/>