hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

ทะเบียนประวัติ => ตำแหน่งเงืนเดืน

Browse source
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-03-27 13:51:34 +07:00
parent e5aad00fea
commit f89b3b97a9
4 changed files with 261 additions and 247 deletions
Download patch file Download diff file Expand all files Collapse all files

323
src/modules/04_registryNew/components/detail/Salary/01_PositionSalary.vue
View file

@ -6,7 +6,10 @@ import http from "@/plugins/http";
import config from "@/app.config";
import type { QTableProps } from "quasar";
import type { DataOption2 } from "@/modules/04_registryNew/interface/index/Main";
import type {
DataOption2,
DataOption,
} from "@/modules/04_registryNew/interface/index/Main";
import type { ObjectSalaryRef } from "@/modules/04_registryNew/interface/index/salary";
import type { FormSalaryNew } from "@/modules/04_registryNew/interface/request/Salary";
@ -40,8 +43,7 @@ const columns = ref<QTableProps["columns"]>([
field: "date",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
format: (v) => date2Thai(v),
},
{
name: "amount",
@ -51,8 +53,7 @@ const columns = ref<QTableProps["columns"]>([
field: "amount",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
format: (v) => Number(v).toLocaleString(),
},
{
name: "positionSalaryAmount",
@ -62,8 +63,7 @@ const columns = ref<QTableProps["columns"]>([
field: "positionSalaryAmount",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
format: (v) => Number(v).toLocaleString(),
},
{
name: "mouthSalaryAmount",
@ -73,8 +73,7 @@ const columns = ref<QTableProps["columns"]>([
field: "mouthSalaryAmount",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
format: (v) => Number(v).toLocaleString(),
},
{
@ -85,8 +84,6 @@ const columns = ref<QTableProps["columns"]>([
field: "posNo",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
@ -97,8 +94,6 @@ const columns = ref<QTableProps["columns"]>([
field: "postionTypeName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "positionLevelName",
@ -108,20 +103,16 @@ const columns = ref<QTableProps["columns"]>([
field: "positionLevelName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "salaryRef",
name: "templateDoc",
align: "left",
label: "เอกสารอ้างอิง",
sortable: true,
field: "salaryRef",
field: "templateDoc",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "refCommandNo",
@ -131,8 +122,6 @@ const columns = ref<QTableProps["columns"]>([
field: "refCommandNo",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
const visibleColumns = ref<string[]>([
@ -143,7 +132,7 @@ const visibleColumns = ref<string[]>([
"posNo",
"postionTypeName",
"positionLevelName",
"salaryRef",
"templateDoc",
"refCommandNo",
]);
const formFilter = reactive({
@ -159,39 +148,39 @@ const pagination = ref({
});
const rows = ref<any>([
{
date: new Date(),
amount: 20000,
positionSalaryAmount: 20000,
mouthSalaryAmount: 20000,
posNo: "1",
postionTypeName: "คำแหน่งประเภท",
positionLevelName: "ระดับ",
salaryRef: "เอกสารอ้างอิง",
refCommandNo: "เลขที่คำสั่ง",
},
{
date: new Date(),
amount: 20000,
positionSalaryAmount: 20000,
mouthSalaryAmount: 20000,
posNo: "1",
postionTypeName: "คำแหน่งประเภท",
positionLevelName: "ระดับ",
salaryRef: "เอกสารอ้างอิง",
refCommandNo: "เลขที่คำสั่ง",
},
{
date: new Date(),
amount: 20000,
positionSalaryAmount: 20000,
mouthSalaryAmount: 20000,
posNo: "1",
postionTypeName: "คำแหน่งประเภท",
positionLevelName: "ระดับ",
salaryRef: "เอกสารอ้างอิง",
refCommandNo: "เลขที่คำสั่ง",
},
// {
// date: new Date(),
// amount: 20000,
// positionSalaryAmount: 20000,
// mouthSalaryAmount: 20000,
// posNo: "1",
// postionTypeName: "คำแหน่งประเภท",
// positionLevelName: "ระดับ",
// salaryRef: "เอกสารอ้างอิง",
// refCommandNo: "เลขที่คำสั่ง",
// },
// {
// date: new Date(),
// amount: 20000,
// positionSalaryAmount: 20000,
// mouthSalaryAmount: 20000,
// posNo: "1",
// postionTypeName: "คำแหน่งประเภท",
// positionLevelName: "ระดับ",
// salaryRef: "เอกสารอ้างอิง",
// refCommandNo: "เลขที่คำสั่ง",
// },
// {
// date: new Date(),
// amount: 20000,
// positionSalaryAmount: 20000,
// mouthSalaryAmount: 20000,
// posNo: "1",
// postionTypeName: "คำแหน่งประเภท",
// positionLevelName: "ระดับ",
// salaryRef: "เอกสารอ้างอิง",
// refCommandNo: "เลขที่คำสั่ง",
// },
]);
const formDataSalary = reactive<FormSalaryNew>({
@ -199,11 +188,11 @@ const formDataSalary = reactive<FormSalaryNew>({
posNo: "",
templatePos: "",
position: "",
positionLineName: "",
typePosition: "",
levelPosition: "",
positionPathSideName: "",
positionExecutiveName: "",
positionLine: "",
positionPathSide: "",
positionType: "",
positionLevel: "",
positionExecutive: "",
salaryCompensation: null,
salary: null,
salaryPos: null,
@ -212,42 +201,25 @@ const formDataSalary = reactive<FormSalaryNew>({
doc: "",
});
/** ตัวแปร ref สำหรับแสดง validate */
const dateRef = ref<Object | null>(null);
const posNoRef = ref<Object | null>(null);
const positionRef = ref<Object | null>(null);
const typePositionRef = ref<Object | null>(null);
const levelPositionRef = ref<Object | null>(null);
const salaryRef = ref<Object | null>(null);
const docRef = ref<Object | null>(null);
const ObjectRef: ObjectSalaryRef = {
date: dateRef,
posNo: posNoRef,
position: positionRef,
typePosition: typePositionRef,
levelPosition: levelPositionRef,
salary: salaryRef,
doc: docRef,
};
const modalDialogSalary = ref<boolean>(false);
const isStatusEdit = ref<boolean>(false);
const salaryId = ref<string>("");
const dataLevel = ref<any[]>([]);
const posNoOptions = ref<DataOption2[]>(store.optionTemplatePos);
const positionLineOptions = ref<DataOption2[]>(store.optionTemplatePos);
const posTypeOptions = ref<DataOption2[]>(store.optionTemplatePos);
const posLevelOption = ref<DataOption2[]>(store.optionTemplatePos);
const posTypeOptions = ref<DataOption[]>([]);
const posTypeOptionsMain = ref<DataOption[]>([]);
const posLevelOption = ref<DataOption[]>([]);
const posLevelOptionMain = ref<DataOption[]>([]);
const docOption = ref<DataOption2[]>(store.optionTemplateDoc);
function fetchListSalary() {
showLoader();
http
.get(
config.API.profileSalaryNewById("59134ef9-9e62-41d0-aac5-339be727f2b1")
)
.get(config.API.profileListSalaryNew(profileId.value))
.then((res) => {
// console.log(res);
rows.value = res.data.result;
})
.catch((err) => {
@ -258,29 +230,58 @@ function fetchListSalary() {
});
}
function onClickOpenDialog(statusEdit: boolean = false, data: any = []) {
isStatusEdit.value = statusEdit;
modalDialogSalary.value = true;
function fetchType() {
http
.get(config.API.orgPosType)
.then((res) => {
dataLevel.value = res.data.result;
posTypeOptionsMain.value = res.data.result.map((e: any) => ({
id: e.id,
name: e.posTypeName,
}));
posTypeOptions.value = posTypeOptionsMain.value;
})
.catch((err) => {
messageError($q, err);
});
}
async function updateSelectType(val: string, status: boolean = false) {
const listLevel = await dataLevel.value.find((e: any) => e.id === val);
if (listLevel) {
posLevelOptionMain.value = listLevel.posLevels.map((e: any) => ({
id: e.id,
name: e.posLevelName,
}));
posLevelOption.value = posLevelOptionMain.value;
formDataSalary.positionLevel = !status ? "" : formDataSalary.positionLevel;
}
}
async function onClickOpenDialog(statusEdit: boolean = false, data: any = []) {
dataLevel.value.length === 0 && (await fetchType());
setTimeout(async () => {
statusEdit && (await updateSelectType(data.positionType, true));
isStatusEdit.value = statusEdit;
}, 500);
posLevelOptionMain.value = !statusEdit ? [] : posLevelOptionMain.value;
modalDialogSalary.value = true;
salaryId.value = data.id;
formDataSalary.date = statusEdit ? data.date : null;
formDataSalary.posNo = statusEdit ? data.posNo : "";
// formDataSalary.templatePos = statusEdit ? data.templatePos : "";
// formDataSalary.position = statusEdit ? data.position : "";
// formDataSalary.positionLineName = statusEdit ? data.positionLineName : "";
// formDataSalary.typePosition = statusEdit ? data.postionTypeName : "";
// formDataSalary.levelPosition = statusEdit ? data.levelPosition : "";
// formDataSalary.positionPathSideName = statusEdit
// ? data.positionPathSideName
// : "";
// formDataSalary.positionExecutiveName = statusEdit
// ? data.positionExecutiveName
// : "";
formDataSalary.templatePos = "";
formDataSalary.position = statusEdit ? data.position : "";
formDataSalary.positionLine = statusEdit ? data.positionLine : "";
formDataSalary.positionType = statusEdit ? data.positionType : "";
formDataSalary.positionLevel = statusEdit ? data.positionLevel : "";
formDataSalary.positionPathSide = statusEdit ? data.positionPathSide : "";
formDataSalary.positionExecutive = statusEdit ? data.positionExecutive : "";
formDataSalary.salaryCompensation = statusEdit ? data.mouthSalaryAmount : "";
formDataSalary.salary = statusEdit ? data.amount : "";
formDataSalary.salaryPos = statusEdit ? data.positionSalaryAmount : "";
// formDataSalary.refCommandNo = statusEdit ? data.refCommandNo : "";
// formDataSalary.templateDoc = statusEdit ? data.templateDoc : "";
formDataSalary.doc = statusEdit ? data.salaryRef : "";
formDataSalary.refCommandNo = statusEdit ? data.refCommandNo : "";
formDataSalary.templateDoc = "";
formDataSalary.doc = statusEdit ? data.templateDoc : "";
}
function onClickCloseDialog() {
@ -296,7 +297,7 @@ function filterSelector(val: any, update: Function, filtername: string) {
);
});
break;
case "positionLineName":
case "positionLine":
update(() => {
positionLineOptions.value = store.optionTemplatePos.filter(
(v: DataOption2) => v.name.indexOf(val) > -1
@ -305,15 +306,15 @@ function filterSelector(val: any, update: Function, filtername: string) {
break;
case "posType":
update(() => {
posTypeOptions.value = store.optionTemplatePos.filter(
(v: DataOption2) => v.name.indexOf(val) > -1
posTypeOptions.value = posTypeOptionsMain.value.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "posLevel":
update(() => {
posLevelOption.value = store.optionTemplatePos.filter(
(v: DataOption2) => v.name.indexOf(val) > -1
posLevelOption.value = posLevelOptionMain.value.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
@ -339,30 +340,46 @@ function updateDoc(val: string) {
}
function onSubmit() {
const hasError = [];
for (const key in ObjectRef) {
if (Object.prototype.hasOwnProperty.call(ObjectRef, key)) {
const property = ObjectRef[key];
if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate();
hasError.push(isValid);
}
}
}
if (hasError.every((result) => result === true)) {
dialogConfirm($q, () => {
submit();
});
}
dialogConfirm($q, () => {
submit();
});
}
async function submit() {
console.log(formDataSalary);
const formData = {
profileId: isStatusEdit.value ? undefined : profileId.value,
date: formDataSalary.date, // วันที่
posNo: formDataSalary.posNo, //เลขที่ตำแหน่ง
position: formDataSalary.position, //ตำแหน่ง
positionLine: formDataSalary.positionLine, //สายงาน
positionPathSide: formDataSalary.positionPathSide, // ด้าน/สาขา
positionExecutive: formDataSalary.positionExecutive, //ตำแหน่งทางการบริหาร
positionType: formDataSalary.positionType, // ประเภทตำแหน่ง
positionLevel: formDataSalary.positionLevel, // ระดับตำแหน่ง
amount:
typeof formDataSalary.salary === "number"
? formDataSalary.salary
: Number(formDataSalary?.salary?.replace(/,/g, "")), //เงินเดือนฐาน
positionSalaryAmount:
typeof formDataSalary.salaryPos === "number"
? formDataSalary.salaryPos
: Number(formDataSalary?.salaryPos?.replace(/,/g, "")), // เงินประจำตำแหน่ง
mouthSalaryAmount:
typeof formDataSalary.salaryCompensation === "number"
? formDataSalary.salaryCompensation
: Number(formDataSalary?.salaryCompensation?.replace(/,/g, "")), //เงินค่าตอบแทนรายเดือน
refCommandNo: formDataSalary.refCommandNo, // เลขที่คำสั่ง
templateDoc: formDataSalary.doc, // เอกสารอ้างอิง
};
console.log(formData);
try {
const url = isStatusEdit.value
? config.API.profileSalaryNewById("12312")
? config.API.profileListSalaryNew(salaryId.value)
: config.API.profileSalaryNew;
const method = isStatusEdit.value ? "put" : "post";
await http[method](url, formDataSalary);
const method = isStatusEdit.value ? "patch" : "post";
await http[method](url, formData);
fetchListSalary();
onClickCloseDialog();
success($q, "บันทึกข้อมูลสำเร็จ");
@ -374,7 +391,8 @@ async function submit() {
}
const modalHistory = ref<boolean>(false);
function ocClikcHistory() {
function onClikcHistory(id: string) {
salaryId.value = id;
modalHistory.value = true;
}
@ -396,7 +414,13 @@ onMounted(() => {
class="q-mr-sm"
>
<template v-slot:append>
<q-icon name="search" />
<q-icon v-if="formFilter.keyword == ''" name="search" />
<q-icon
v-else
name="clear"
class="cursor-pointer"
@click="formFilter.keyword = ''"
/>
</template>
</q-input>
@ -421,6 +445,7 @@ onMounted(() => {
flat
bordered
dense
:filter="formFilter.keyword"
:columns="columns"
:rows="rows"
:paging="true"
@ -471,20 +496,9 @@ onMounted(() => {
:key="col.id"
@click="onClickOpenDialog(true, props.row)"
>
<div v-if="col.name === 'date'">
{{ col.value ? date2Thai(col.value) : "-" }}
<div class="table_ellipsis">
{{ col.value ? col.value : "-" }}
</div>
<div v-else-if="col.name === 'amount'">
{{ col.value ? col.value.toLocaleString() : "-" }}
</div>
<div v-else-if="col.name === 'positionSalaryAmount'">
{{ col.value ? col.value.toLocaleString() : "-" }}
</div>
<div v-else-if="col.name === 'mouthSalaryAmount'">
{{ col.value ? col.value.toLocaleString() : "-" }}
</div>
<div v-else>{{ col.value ? col.value : "-" }}</div>
</q-td>
<q-td auto-width>
<q-btn
@ -494,7 +508,7 @@ onMounted(() => {
round
size="14px"
icon="mdi-history"
@click="ocClikcHistory"
@click="onClikcHistory(props.row.id)"
>
<q-tooltip>ประวัติแก้ไขตำแหน่ง/เงินเดือน</q-tooltip>
</q-btn>
@ -517,7 +531,7 @@ onMounted(() => {
<q-dialog v-model="modalDialogSalary" persistent full-width>
<q-card>
<form @submit.prevent.stop="onSubmit">
<q-form greedy @submit.prevent @validation-success="onSubmit">
<DialogHeader
:tittle="
isStatusEdit ? 'แก้ไขตำแหน่งเงินเดือน' : 'เพิ่มตำแหน่งเงินเดือน'
@ -542,7 +556,6 @@ onMounted(() => {
}}</template>
<template #trigger>
<q-input
ref="dateRef"
outlined
dense
borderless
@ -622,7 +635,7 @@ onMounted(() => {
dense
lazy-rules
borderless
v-model="formDataSalary.positionLineName"
v-model="formDataSalary.positionLine"
:label="`${'สายงาน'}`"
emit-value
map-options
@ -633,7 +646,7 @@ onMounted(() => {
use-input
input-debounce="0"
@filter="(inputValue: any,
doneFn: Function) => filterSelector(inputValue, doneFn, 'positionLineName'
doneFn: Function) => filterSelector(inputValue, doneFn, 'positionLine'
)"
/>
</div>
@ -643,7 +656,7 @@ onMounted(() => {
outlined
dense
lazy-rules
v-model="formDataSalary.positionPathSideName"
v-model="formDataSalary.positionPathSide"
hide-bottom-space
:label="`${'ด้าน/สาขา'}`"
/>
@ -654,7 +667,7 @@ onMounted(() => {
dense
lazy-rules
borderless
v-model="formDataSalary.positionExecutiveName"
v-model="formDataSalary.positionExecutive"
hide-bottom-space
:label="`${'ตำแหน่งทางการบริหาร'}`"
>
@ -663,12 +676,12 @@ onMounted(() => {
<div class="col-xs-6 col-sm-6 col-md-4">
<q-select
ref="typePositionRef"
ref="positionType Ref"
outlined
dense
lazy-rules
borderless
v-model="formDataSalary.typePosition"
v-model="formDataSalary.positionType"
:label="`${'ตำแหน่งประเภท'}`"
emit-value
map-options
@ -678,6 +691,7 @@ onMounted(() => {
hide-bottom-space
use-input
input-debounce="0"
@update:model-value="updateSelectType"
:rules="[(val: string) => !!val || `${'กรุณาเลือกตำแหน่งประเภท'}`]"
@filter="(inputValue: any,
doneFn: Function) => filterSelector(inputValue, doneFn, 'posType'
@ -687,19 +701,19 @@ onMounted(() => {
<div class="col-xs-6 col-sm-6 col-md-4">
<q-select
ref="levelPositionRef"
ref="positionLevel Ref"
outlined
dense
lazy-rules
borderless
v-model="formDataSalary.levelPosition"
v-model="formDataSalary.positionLevel"
:rules="[(val: string) => !!val || `${'กรุณาเลือกระดับตำแหน่ง'}`]"
:label="`${'ระดับตำแหน่ง'}`"
emit-value
map-options
option-label="name"
:options="posLevelOption"
option-value="name"
option-value="id"
hide-bottom-space
use-input
input-debounce="0"
@ -730,6 +744,7 @@ onMounted(() => {
dense
outlined
v-model="formDataSalary.salaryPos"
:rules="[(val) => !!val || `${'กรุณากรอกเงินประจำตำแหน่ง'}`]"
label="เงินประจำตำแหน่ง"
mask="###,###,###,###"
reverse-fill-mask
@ -812,11 +827,11 @@ onMounted(() => {
<q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
>
</q-card-section>
</form>
</q-form>
</q-card>
</q-dialog>
<DialogHistory v-model:modal="modalHistory" />
<DialogHistory v-model:modal="modalHistory" v-model:salaryId="salaryId" />
</template>
<style scoped></style>