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

Refactoring code module 13_salary

Browse source
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-09-20 18:09:26 +07:00
parent c9dd0202c6
commit 4af366c03b
43 changed files with 1215 additions and 1167 deletions
Download patch file Download diff file Expand all files Collapse all files

15
src/modules/13_salary/components/SalaryChart/DialogFormMain.vue → src/modules/13_salary/components/01_Salary/DialogFormMain.vue
View file

@ -44,7 +44,7 @@ const props = defineProps({
},
});
const salaryId = ref<string>("");
const salaryId = ref<string>(""); //id รายการผังบัญชีเงินเดือน
const formData = reactive<FormData>({
name: "", //*ชื่อผังบัญชีอัตราเงินเดือน
posTypeId: "", //*ประเภทของตำแหน่ง
@ -57,12 +57,13 @@ const formData = reactive<FormData>({
isSpecial: false,
});
const posType = ref<SalaryPosType[]>([]);
const salaryPosTypeOptionMain = ref<DataOption[]>([]);
const salaryPosTypeOption = ref<DataOption[]>([]);
const salaryPosLevelOptionMain = ref<DataOption[]>([]);
const salaryPosLevelOption = ref<DataOption[]>([]);
const posType = ref<SalaryPosType[]>([]); //ข้อมูลประเภทตำแหน่ง
const salaryPosTypeOptionMain = ref<DataOption[]>([]); //ข้อมูลรายการประเภทตำแหน่ง
const salaryPosTypeOption = ref<DataOption[]>([]); //ตัวเลือกรายการประเภทตำแหน่ง
const salaryPosLevelOptionMain = ref<DataOption[]>([]); //ข้อมูลรายการระดับตำแหน่ง
const salaryPosLevelOption = ref<DataOption[]>([]); //ตัวเลือกรายการระดับตำแหน่ง
//ชื่อ popup
const title = computed(() => {
const name =
props.typeAction === "add"
@ -150,7 +151,7 @@ watch(
() => modal.value,
async () => {
if (modal.value) {
await fetchPosType();
fetchPosType();
if (props.typeAction === "edit" || props.typeAction === "view") {
showLoader();

43
src/modules/13_salary/components/SalaryChart/DialogFormRate.vue → src/modules/13_salary/components/01_Salary/DialogFormRate.vue
View file

@ -39,20 +39,21 @@ const props = defineProps({
},
});
const isReadonly = ref<boolean>(false);
const salaryId = ref<string>(route.params.id.toString());
const salaryId = ref<string>(route.params.id.toString()); //id รายการอัตราเงินเดือน
const isReadonly = ref<boolean>(false); //อ่านอย่างเดียว
const formData = reactive<FormSalaryRate>({
salaryId: "",
salary: null,
salaryHalf: null,
salaryHalfSpecial: null,
salaryFull: null,
salaryFullSpecial: null,
salaryFullHalf: null,
salaryFullHalfSpecial: null,
isNext: false,
salary: null, //เงินเดือนฐาน
salaryHalf: null, //เลื่อน 0.5 ขั้น
salaryHalfSpecial: null, //เงินพิเศษ
salaryFull: null, //เลื่อน 1 ขั้น
salaryFullSpecial: null, //เงินพิเศษ
salaryFullHalf: null, //เลื่อน 1.5 ขั้น
salaryFullHalfSpecial: null, //เงินพิเศษ
isNext: false, //ทะลุขั้น
});
//ชื่อ Popup
const title = computed(() => {
const name =
props.typeAction === "add"
@ -155,6 +156,17 @@ function onSubmit() {
});
}
/**
* class จัดรูปแบบแสดงระหว่างข้อมูลที่แก้ไขหรือแสดงเฉยๆ
* @param val ข้อมูล input สำหรับแก้ไขหรือไม่
*/
const getClass = (val: boolean) => {
return {
"full-width inputgreen cursor-pointer": val,
"full-width cursor-pointer": !val,
};
};
/** callbackFunction ทำการ fetch ข้อมูลไฟล์เมื่อเปิด Dialog*/
watch(
() => modal.value,
@ -175,17 +187,6 @@ watch(
}
}
);
/**
* class จัดรูปแบบแสดงระหว่างข้อมูลที่แก้ไขหรือแสดงเฉยๆ
* @param val ข้อมูล input สำหรับแก้ไขหรือไม่
*/
const getClass = (val: boolean) => {
return {
"full-width inputgreen cursor-pointer": val,
"full-width cursor-pointer": !val,
};
};
</script>
<template>

37
src/modules/13_salary/components/SalaryChart/DialogUpload.vue → src/modules/13_salary/components/01_Salary/DialogUpload.vue
View file

@ -39,17 +39,6 @@ const props = defineProps({
});
const salaryId = ref<string>("");
const formData = reactive({
salaryType: "", //*ประเภทผัง (OFFICER->"ข้าราชการกรุงเทพมหานครสามัญ",EMPLOYEE->"ลูกจ้างประจำกรุงเทพมหานคร")
posTypeId: "", //*ประเภทของตำแหน่ง
posLevelId: "", //*ระดับของตำแหน่ง
isActive: false, //*สถานะการใช้งาน
date: null, //ให้ไว้ ณ วันที่
startDate: null, //วันที่มีผลบังคับใช้
endDate: null, //วันที่สิ้นสุดบังคับใช้
details: "", //คำอธิบาย
isSpecial: false,
});
const documentFile = ref<any>(null);
const itemsDocument = ref<any>([]);
@ -58,12 +47,12 @@ const itemsDocument = ref<any>([]);
* function fetch ข้อมูลรายการ ไฟล์
* @param id ไฟล์
*/
function fetchDocumentFile(id: string) {
async function fetchDocumentFile(id: string) {
showLoader();
http
await http
.get(config.API.salaryChartFile(id))
.then((res) => {
const list = res.data.map((e: any) => ({ name: e.fileName }));
.then(async (res) => {
const list = await res.data.map((e: any) => ({ name: e.fileName }));
itemsDocument.value = list;
})
.catch((err) => {
@ -79,22 +68,6 @@ function fetchDocumentFile(id: string) {
*/
function closeDialog() {
modal.value = !modal.value;
clearFormData();
}
/**
* function เคลียข้อมูล form*
*/
function clearFormData() {
formData.salaryType = "";
formData.posTypeId = "";
formData.posLevelId = "";
formData.isSpecial = false;
formData.isActive = false;
formData.date = null;
formData.startDate = null;
formData.endDate = null;
formData.details = "";
documentFile.value = null;
itemsDocument.value = [];
}
@ -133,7 +106,7 @@ async function uploadDocumentFile() {
* function อัปโหลดไฟล์
* @param url link อัปโหลด
*/
function fileUpLoad(url: string) {
async function fileUpLoad(url: string) {
axios
.put(url, documentFile.value, {
headers: { "Content-Type": documentFile.value?.type },

0
src/modules/13_salary/components/salaryEmployeeChart/DialogEmployeeChart.vue → src/modules/13_salary/components/02_salaryEmployee/DialogEmployeeChart.vue
View file

10
src/modules/13_salary/components/salaryEmployeeChart/DialogEmployeeRate.vue → src/modules/13_salary/components/02_salaryEmployee/DialogEmployeeRate.vue
View file

@ -43,11 +43,13 @@ const props = defineProps({
},
});
const isReadonly = ref<boolean>(false); //อ่านอย่างเดียว
/** form อัตราค่าจ้าง */
const formData = reactive<FormDataRateEpm>({
salaryNo: null,
salaryMonth: null,
salaryDay: null,
salaryNo: null, //ลำดับชั้น
salaryMonth: null, //อัตราค่าจ้าง/ขั้นวิ่ง (รายเดือน)
salaryDay: null, //อัตราค่าจ้าง/ขั้นวิ่ง (รายวัน)
});
/** function ปืด Dialog*/
@ -119,8 +121,6 @@ watch(
}
);
const isReadonly = ref<boolean>(false);
/**
* class จัดรูปแบบแสดงระหว่างข้อมูลที่แก้ไขหรือแสดงเฉยๆ
* @param val ข้อมูล input สำหรับแก้ไขหรือไม่

6
src/modules/13_salary/components/salaryEmployeeChart/DialogEmployeeUpload.vue → src/modules/13_salary/components/02_salaryEmployee/DialogEmployeeUpload.vue
View file

@ -89,8 +89,8 @@ async function uploadDocumentFile() {
* function อัปโหลดไฟล์
* @param url link อัปโหลด
*/
function fileUpLoad(url: string) {
axios
async function fileUpLoad(url: string) {
await axios
.put(url, documentFile.value, {
headers: { "Content-Type": documentFile.value?.type },
onUploadProgress: (e) => console.log(e),
@ -118,7 +118,7 @@ function onClickDeleteFile(fileName: string) {
await http
.delete(config.API.salaryEmployeeChartDelFile(salaryId.value, fileName))
.then(async () => {
await setTimeout(async () => {
setTimeout(async () => {
await fetchDocumentFile(salaryId.value);
await success($q, "ลบไฟล์สำเร็จ");
}, 1500);

74
src/modules/13_salary/components/salaryEmployeeChart/DialogFormCriteria.vue → src/modules/13_salary/components/02_salaryEmployee/DialogFormCriteria.vue
View file

@ -1,4 +1,3 @@
div
<script setup lang="ts">
import { ref, reactive, watch } from "vue";
import { useQuasar } from "quasar";
@ -33,15 +32,15 @@ const props = defineProps({
getDataMain: Function,
});
const posTypeOp = ref<DataOptions[]>([]);
const posTypeOpMain = ref<DataOptions[]>([]);
const posNameOp = ref<DataOptions[]>([]);
const posNameOpMain = ref<DataOptions[]>([]);
const groupOldOp = ref<DataOptions[]>([]);
const groupOldOpMain = ref<DataOptions[]>([]);
const posLevelOp = ref<any[]>([]);
const posNameListOp = ref<DataListOptions[]>([]);
const isReadonly = ref<boolean>(false);
const posTypeOp = ref<DataOptions[]>([]); //ตัวเลือกรายการกลุ่มงาน
const posTypeOpMain = ref<DataOptions[]>([]); //ข้อมูลรายการกลุ่มงาน
const posNameOp = ref<DataOptions[]>([]); //ตัวเลือกตำแหน่ง
const posNameOpMain = ref<DataOptions[]>([]); //ข้อมูลรายการตำแหน่ง
const groupOldOp = ref<DataOptions[]>([]); //ตัวเลือกกลุ่มของผังบัญชีอัตราค่าจ้าง
const groupOldOpMain = ref<DataOptions[]>([]); //ข้อมูลกลุ่มของผังบัญชีอัตราค่าจ้าง
const posLevelOp = ref<any[]>([]); //ระดับชั้นงาน
const posNameListOp = ref<DataListOptions[]>([]); //ข้อมูลระดับชั้นงาน
const isReadonly = ref<boolean>(false); //อ่านอย่างเดียว
const formData = reactive<any>({
id: "",
@ -265,23 +264,6 @@ function getDataEdit() {
}, 1500);
});
}
watch(
() => modal.value,
(check) => {
if (check) {
getPosType();
getSalaryGroup();
if (isEdit.value) {
isReadonly.value = actionsType.value === "view" ? true : false;
formData.id = props.data?.id ? props.data.id : null;
getDataEdit();
} else {
isReadonly.value = false;
}
}
}
);
/**
* function ต้นหาข้อมูลของ Option
@ -289,7 +271,7 @@ watch(
* @param update อัพเดทค่า
* @param refData ดาต้าที่ต้องการฟิลเตอร์
*/
function filterOption(val: any, update: Function, type: string) {
function filterOption(val: string, update: Function, type: string) {
switch (type) {
case "group":
update(() => {
@ -330,6 +312,26 @@ const getClass = (val: boolean) => {
"full-width cursor-pointer": !val,
};
};
/**
* ทำงานเมื่อ modal เป็น true
*/
watch(
() => modal.value,
async (check) => {
if (check) {
await Promise.all([getPosType(), getSalaryGroup()]);
if (isEdit.value) {
isReadonly.value = actionsType.value === "view" ? true : false;
formData.id = props.data?.id ? props.data.id : null;
getDataEdit();
} else {
isReadonly.value = false;
}
}
}
);
</script>
<template>
@ -358,7 +360,7 @@ const getClass = (val: boolean) => {
outlined
v-model="formData.posType"
label="กลุ่มงาน"
:rules="[(val) => !!val || 'กรุณาเลือกกลุ่มงาน']"
:rules="[(val:string) => !!val || 'กรุณาเลือกกลุ่มงาน']"
:options="posTypeOp"
option-label="name"
option-value="id"
@ -387,7 +389,7 @@ const getClass = (val: boolean) => {
outlined
v-model="formData.posName"
label="ตำแหน่ง"
:rules="[(val) => !!val || 'กรุณาเลือกตำแหน่ง']"
:rules="[(val:string) => !!val || 'กรุณาเลือกตำแหน่ง']"
:options="posNameOp"
option-label="name"
option-value="name"
@ -420,7 +422,7 @@ const getClass = (val: boolean) => {
option-value="id"
map-options
label="ระดับชั้นงาน"
:rules="[(val) => !!val || 'กรุณาเลือกระดับชั้นงาน']"
:rules="[(val:string) => !!val || 'กรุณาเลือกระดับชั้นงาน']"
lazy-rules
hide-bottom-space
>
@ -459,7 +461,7 @@ const getClass = (val: boolean) => {
mask="###,###,###,###,###,###,###,###"
reverse-fill-mask
:rules="[
(val) => !!val || `${'กรุณากรอกอัตราค่าจ้าง ขั้นต่ำสุด'}`,
(val:string) => !!val || `${'กรุณากรอกอัตราค่าจ้าง ขั้นต่ำสุด'}`,
]"
lazy-rules
hide-bottom-space
@ -476,7 +478,7 @@ const getClass = (val: boolean) => {
v-model="formData.groupOld"
label="กลุ่มของผังบัญชีอัตราค่าจ้าง"
:rules="[
(val) =>
(val:string) =>
!!val ||
`${'กรุณาเลือกอัตราค่าจ้าง กลุ่มของผังบัญชีอัตราค่าจ้าง'}`,
]"
@ -510,7 +512,7 @@ const getClass = (val: boolean) => {
mask="###,###,###,###,###,###,###,###"
reverse-fill-mask
:rules="[
(val) => !!val || `${'กรุณากรอกอัตราค่าจ้าง ขั้นสูงสุดเดิม'}`,
(val:string) => !!val || `${'กรุณากรอกอัตราค่าจ้าง ขั้นสูงสุดเดิม'}`,
]"
lazy-rules
hide-bottom-space
@ -530,7 +532,7 @@ const getClass = (val: boolean) => {
v-model="formData.groupRateHigh"
label="กลุ่มบัญชีค่าจ้าง"
:rules="[
(val) => !!val || `${'กรุณากรอกเลือกกลุ่มบัญชีค่าจ้าง'}`,
(val:string) => !!val || `${'กรุณากรอกเลือกกลุ่มบัญชีค่าจ้าง'}`,
]"
lazy-rules
:options="groupOldOp"
@ -563,7 +565,7 @@ const getClass = (val: boolean) => {
mask="###,###,###,###,###,###,###,###"
reverse-fill-mask
:rules="[
(val) => !!val || `${'กรุณากรอกอัตราค่าจ้างขั้นสูงใหม่'}`,
(val:string) => !!val || `${'กรุณากรอกอัตราค่าจ้างขั้นสูงใหม่'}`,
]"
lazy-rules
hide-bottom-space

43
src/modules/13_salary/components/salaryEmployeeChart/TabCriteria.vue → src/modules/13_salary/components/02_salaryEmployee/TabCriteria.vue
View file

@ -18,7 +18,7 @@ import type {
import type { PosType } from "@/modules/13_salary/interface/response/salaryEmployeeChart";
/** importCompopnents*/
import DialogFormCriteria from "@/modules/13_salary/components/salaryEmployeeChart/DialogFormCriteria.vue";
import DialogFormCriteria from "@/modules/13_salary/components/02_salaryEmployee/DialogFormCriteria.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
@ -138,19 +138,21 @@ const formFilter = reactive({
pageSize: 10,
keyword: "",
});
const maxPage = ref<number>(1); //จำนวนหน้า
const totalList = ref<number>(0); //จำนวนรายการ
const modalForm = ref<boolean>(false);
const isStatusEdit = ref<boolean>(false);
const modalForm = ref<boolean>(false); //Popup ข้อมูลหลักเกณฑ์
const isStatusEdit = ref<boolean>(false); //สถานะการแก้ไข
const actionsType = ref<string>("");
const dataRow = ref<ListData>();
const dataRow = ref<ListData>(); //ข้อมูลที่ต้องการแก้ไข
const posTypeOpMain = ref<DataOption[]>([]);
const posTypeOp = ref<DataOption[]>([]);
const posType = ref<string | null>("");
const maxPage = ref<number>(1);
const totalList = ref<number>(0);
const posTypeOpMain = ref<DataOption[]>([]); //ข้อมูลกลุ่มงาน
const posTypeOp = ref<DataOption[]>([]); //ตัวเลือกข้อมูลรายการกลุ่มงาน
const posType = ref<string | null>(""); //กลุ่มงาน
/** ดึงข้อมูลกลุ่มงาน */
/**
* ดึงข้อมูลกลุ่มงาน
*/
function getPosType() {
http
.get(config.API.salaryEmployeePosType())
@ -176,7 +178,9 @@ function getPosType() {
});
}
/** ดึงข้อมูลรายการหลักเกณฑ์ */
/**
* ดึงข้อมูลรายการหลักเกณฑ์
*/
function getData() {
showLoader();
http
@ -229,7 +233,9 @@ function updatePage(val: number) {
getData();
}
/** function อัปเดทแถวต่อหน้า*/
/**
* function อัปเดทแถวต่อหน้า
*/
function updatePageSize(newPagination: NewPagination) {
formFilter.page = 1;
formFilter.pageSize = newPagination.rowsPerPage;
@ -271,7 +277,9 @@ function filterSelector(val: string, update: Function) {
});
}
/** callbackFuntioon ทำงานเมื่อมี่การอัปเดทแถว */
/**
* callbackFuntioon ทำงานเมื่อมี่การอัปเดทแถว
*/
watch(
() => formFilter.pageSize,
() => {
@ -279,7 +287,9 @@ watch(
}
);
/** functionn fetch ข้อมูลรายการหน้าแรก*/
/**
* functionn fetch ข้อมูลรายการหน้าแรก
*/
function filterFn() {
formFilter.page = 1;
getData();
@ -290,9 +300,8 @@ const pagination = ref({
rowsPerPage: formFilter.pageSize,
});
onMounted(() => {
getData();
getPosType();
onMounted(async () => {
await Promise.all([getData(), getPosType()]);
});
</script>

55
src/modules/13_salary/components/salaryEmployeeChart/TabStructure.vue → src/modules/13_salary/components/02_salaryEmployee/TabStructure.vue
View file

@ -13,8 +13,8 @@ import type { FormFilter } from "@/modules/13_salary/interface/request/EmployeeC
import type { EmployeeSalary } from "@/modules/13_salary/interface/response/salaryEmployeeChart";
/** importComponents*/
import DialogEmployeeChart from "@/modules/13_salary/components/salaryEmployeeChart/DialogEmployeeChart.vue"; //ผังบัญชีค่าจ้างลูกจ้างประจำ
import DialogEmployeeUpload from "@/modules/13_salary/components/salaryEmployeeChart/DialogEmployeeUpload.vue"; //อัปโหลดเอกสารอ้างอิง
import DialogEmployeeChart from "@/modules/13_salary/components/02_salaryEmployee/DialogEmployeeChart.vue"; //ผังบัญชีค่าจ้างลูกจ้างประจำ
import DialogEmployeeUpload from "@/modules/13_salary/components/02_salaryEmployee/DialogEmployeeUpload.vue"; //อัปโหลดเอกสารอ้างอิง
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
@ -32,20 +32,23 @@ const {
} = useCounterMixin();
const formFilter = reactive<FormFilter>({
page: 1,
pageSize: 10,
keyword: "",
page: 1, //*หน้า
pageSize: 10, //*จำนวนแถวต่อหน้า
keyword: "", //keyword ค้นหา
});
const maxPage = ref<number>(1);
const totalList = ref<number>(0);
const maxPage = ref<number>(1); //จำนวนหน้า
const totalList = ref<number>(0); //จำนวนรายการ
const modalDialogEmployeeChart = ref<boolean>(false);
const isStatusEdit = ref<boolean>(false);
const activeType = ref<string>("");
const dataRow = ref<EmployeeSalary>();
const modalDialogEmployeeChart = ref<boolean>(false); //popup ผังบัญชีค่าจ้างลูกจ้างประจำ
const isStatusEdit = ref<boolean>(false); //สถานะการแก้ไข
const activeType = ref<string>(""); //ประเภทการกระทำ
const dataRow = ref<EmployeeSalary>(); //ข้อมูลรายกาผังบัญชีค่าจ้างลูกจ้างประจำ
const modalDialogUpload = ref<boolean>(false); //popup อัปโหลดเอกสารอ้างอิง
const salaryChartId = ref<string>(""); //id ผังบัญชีค่าจ้างลูกจ้างประจำ
const isActive = ref<boolean>(false); //สถานะการใช้งาน
/** ข้อมูล Table*/
const rows = ref<EmployeeSalary[]>([]);
const rows = ref<EmployeeSalary[]>([]); //รายการผังบัญชีค่าจ้างลูกจ้างประจำ
const columns = ref<QTableProps["columns"]>([
{
name: "name",
@ -94,9 +97,9 @@ const visibleColumns = ref<string[]>([
/**
* fetch ข้แมูลรายาการผังบัญชีค่าจ้างลูกจ้างประจำ
*/
function fetchListChart() {
async function fetchListChart() {
showLoader();
http
await http
.get(
config.API.salaryEmployeeChart +
`?page=${formFilter.page}&pageSize=${formFilter.pageSize}&keyword=${formFilter.keyword}`
@ -125,10 +128,6 @@ function onEdit(data: EmployeeSalary, type: string) {
modalDialogEmployeeChart.value = true;
}
const modalDialogUpload = ref<boolean>(false);
const salaryChartId = ref<string>("");
const isActive = ref<boolean>(false);
/**
* function เปิด Dialog อัปโหลดเอกสารอ้างอิง
* @param id ผังบัญชีค่าจ้างลูกจ้างประจำ
@ -455,20 +454,20 @@ onMounted(() => {
</template>
</d-table>
<!-- ผังบัญชีค่าจ้างลูกจ้างประจำ -->
<DialogEmployeeChart
v-model:modal="modalDialogEmployeeChart"
:isStatusEdit="isStatusEdit"
:data="dataRow as EmployeeSalary"
:fetchData="fetchListChart"
:activeType="activeType"
/>
<!-- อัปโหลดเอกสารอ้างอิง -->
<DialogEmployeeUpload
v-model:modal="modalDialogUpload"
:id="salaryChartId"
:isActive="isActive"
:is-active="isActive"
/>
<!-- ผังบัญชีค่าจ้างลูกจ้างประจำ -->
<DialogEmployeeChart
v-model:modal="modalDialogEmployeeChart"
:is-status-edit="isStatusEdit"
:active-type="activeType"
:fetch-data="fetchListChart"
:data="dataRow as EmployeeSalary"
/>
</template>

107
src/modules/13_salary/components/SalaryRound/DialogForm.vue → src/modules/13_salary/components/03_salaryRound/DialogForm.vue
View file

@ -41,16 +41,19 @@ const props = defineProps({
isRead: Boolean,
});
const period = ref<string>("");
const isActive = ref<boolean>(false);
const effectiveDate = ref<Date | null>(null);
const period = ref<string>(""); //รอบการขึ้นเงินเดือน
const isActive = ref<boolean>(false); //สถานะการใช้งาน
const effectiveDate = ref<Date | null>(null); //วันที่มีผล
//ตัวเลือกรอบ
const typeOptions = ref<DataOption[]>([
{ id: "SPECIAL", name: "รอบพิเศษ" },
{ id: "APR", name: "รอบเมษายน" },
{ id: "OCT", name: "รอบตุลาคม" },
]);
/** function เคลียข้อมูล form*/
/**
* function เคลียข้อมูล form
*/
function clearForm() {
isActive.value = false;
period.value = "";
@ -59,13 +62,17 @@ function clearForm() {
isRead.value = false;
}
/** function ปืด Dialog*/
/**
* function ปืด Dialog
*/
function close() {
modal.value = false;
clearForm();
}
/** function บัยทึกข้อมูลรอบการขึ้นเงินเดือน*/
/**
* function บัยทึกข้อมูลรอบการขึ้นเงินเดือน
*/
function onSubmit() {
dialogConfirm($q, async () => {
showLoader();
@ -82,8 +89,7 @@ function onSubmit() {
await http[!props.edit ? "post" : "put"](url, body);
await props.getData?.();
await success($q, "บันทีกข้อมูลสำเร็จ");
modal.value = false;
clearForm();
close();
} catch (err) {
messageError($q, err);
} finally {
@ -107,7 +113,9 @@ function onUpdatePeriod(val: string) {
}
}
/** callbackFunction ทำการ fetch ข้อมูลไฟล์เมื่อเปิด Dialog*/
/**
* callbackFunction ทำการ fetch ข้อมูลไฟล์เมื่อเปิด Dialog
*/
watch(
() => modal.value,
() => {
@ -244,20 +252,14 @@ watch(
</template>
</datepicker>
<div class="col q-pa-sm bg-white border_custom text-weight-medium">
<div class="row items-center q-my-sm justify-between">
<div class="row items-center justify-between">
<p class="q-ma-none">สถานะการใช้งาน</p>
<label
:class="
isRead == true ? 'toggle-control noClick' : 'toggle-control'
"
>
<input
type="checkbox"
<label>
<q-toggle
v-model="isActive"
:disable="period === 'SPECIAL' || isRead"
:readonly="isRead"
:disabled="period === 'SPECIAL'"
/>
<span class="control"></span>
</label>
</div>
</div>
@ -279,71 +281,4 @@ watch(
border-radius: 6px !important;
border: 1px solid #e1e1e1;
}
$toggle-background-color-on: #06884d;
$toggle-background-color-off: darkgray;
$toggle-control-color: white;
$toggle-width: 40px;
$toggle-height: 25px;
$toggle-gutter: 3px;
$toggle-radius: 50%;
$toggle-control-speed: 0.15s;
$toggle-control-ease: ease-in;
// These are our computed variables
// change at your own risk.
$toggle-radius: $toggle-height / 2;
$toggle-control-size: $toggle-height - ($toggle-gutter * 2);
.toggle-control {
display: block;
position: relative;
padding-left: $toggle-width;
margin-bottom: 12px;
cursor: pointer;
font-size: 22px;
user-select: none;
input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
input:checked ~ .control {
background-color: $toggle-background-color-on;
&:after {
left: $toggle-width - $toggle-control-size - $toggle-gutter;
}
}
.control {
position: absolute;
top: -7px;
left: -15px;
height: $toggle-height;
width: $toggle-width;
border-radius: $toggle-radius;
background-color: $toggle-background-color-off;
transition: background-color $toggle-control-speed $toggle-control-ease;
&:after {
content: "";
position: absolute;
left: $toggle-gutter;
top: $toggle-gutter;
width: $toggle-control-size;
height: $toggle-control-size;
border-radius: $toggle-radius;
background: $toggle-control-color;
transition: left $toggle-control-speed $toggle-control-ease;
}
}
}
.noClick {
pointer-events: none;
}
</style>

19
src/modules/13_salary/components/SalaryLists/Dashboard.vue → src/modules/13_salary/components/04_salaryLists/Dashboard.vue
View file

@ -1,8 +1,11 @@
<script setup lang="ts">
import { ref, onMounted, computed, watch } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
import { useCounterMixin } from "@/stores/mixin";
/** importType*/
import type { QTableProps } from "quasar";
@ -13,8 +16,6 @@ import type {
import type { ResSalaryOrg } from "@/modules/13_salary/interface/response/SalaryList";
/** importStore*/
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
import { useCounterMixin } from "@/stores/mixin";
/** use*/
const $q = useQuasar();
@ -145,6 +146,7 @@ const itemsCard = computed(() => {
/** ข้อมูล Table*/
const rows = ref<ResSalaryOrg[]>([]);
const filter = ref<string>("");
const columnsAPR = ref<QTableProps["columns"]>([
{
name: "org",
@ -385,10 +387,11 @@ const columns = computed(() => {
: columnsSpeciel.value;
return columnsss;
});
const filter = ref<string>("");
/** function fetch ข้อมูลสถิติ*/
function fetchDataDashboard() {
/**
* function fetch ข้อมูลสถิติ
*/
async function fetchDataDashboard() {
showLoader();
const formData = {
year: props?.year,
@ -396,10 +399,10 @@ function fetchDataDashboard() {
period: props?.roundFilter?.id,
snapshot: props?.snapShot,
};
http
await http
.post(config.API.salaryDashboard, formData)
.then((res) => {
const quota = res.data.result.dashboard;
.then(async (res) => {
const quota = await res.data.result.dashboard;
itemsCardAPR.value[0].total = quota.total;
itemsCardAPR.value[1].total = quota.fifteenPercent.toLocaleString("en", {
minimumFractionDigits: 2,

38
src/modules/13_salary/components/SalaryLists/DialogAddPerson.vue → src/modules/13_salary/components/04_salaryLists/DialogAddPerson.vue
View file

@ -1,6 +1,9 @@
<script setup lang="ts">
import { ref, reactive, watch } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
import config from "@/app.config";
import http from "@/plugins/http";
@ -14,10 +17,6 @@ import type { DataPerson } from "@/modules/13_salary/interface/response/SalaryLi
/** importComponents*/
import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
/** use*/
const $q = useQuasar();
const store = useSalaryListSDataStore();
@ -33,6 +32,7 @@ const props = defineProps({
});
/** Table*/
const rows = ref<DataPerson[]>([]);
const columns = ref<QTableProps["columns"]>([
{
name: "no",
@ -89,8 +89,6 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
]);
const rows = ref<DataPerson[]>([]);
/** ข้อมูุลค้นหา*/
const formFilter = reactive<DataFilterPerson>({
page: 1,
@ -102,14 +100,18 @@ const formFilter = reactive<DataFilterPerson>({
});
const maxPage = ref<number>(1);
/** function close popup*/
/**
* function close popup
*/
function closeModal() {
modal.value = false;
formFilter.page = 1;
formFilter.keyword = "";
}
/** function เรียกรายชื่อ คนเลื่อนเงินเดือน*/
/**
* function เรียกรายชื่อ คนเลื่อนเงินเดือน
*/
function fetchListPerson() {
showLoader();
formFilter.rootId = store.rootId;
@ -164,24 +166,32 @@ function onClickAddPerson(data: DataPerson) {
);
}
/** function updatePage*/
/**
* function updatePage
*/
async function updatePagePagination() {
fetchListPerson();
}
/** function updatePageSize*/
/**
* function updatePageSize
*/
function updatePageSizePagination(newPagination: NewPagination) {
formFilter.page = 1;
formFilter.pageSize = newPagination.rowsPerPage;
}
/** function ค้นหาข้อมูลตาม keyword*/
/**
* function ค้นหาข้อมูลตาม keyword
*/
function searchData() {
formFilter.page = 1;
fetchListPerson();
}
/** callblack function เรียกข้อมูลรายชื่อคนเลื่อนเงินเดือน เมื่อมีการเปิด Popup*/
/**
* callblack function เรียกข้อมูลรายชื่อคนเลื่อนเงินเดือน เมื่อมีการเปิด Popup
*/
watch(
() => modal.value,
() => {
@ -191,7 +201,9 @@ watch(
}
);
/** callblack function เรียกข้อมูลรายชื่อคนเลื่อนเงินเดือน เมื่อมีการเปลี่ยน PageSize*/
/**
* callblack function เรียกข้อมูลรายชื่อคนเลื่อนเงินเดือน เมื่อมีการเปลี่ยน PageSize
*/
watch(
() => formFilter.pageSize,
() => {

72
src/modules/13_salary/components/SalaryLists/DialogFormEdit.vue → src/modules/13_salary/components/04_salaryLists/DialogFormEditSalary.vue
View file

@ -1,15 +1,13 @@
<script setup lang="ts">
import { ref } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import http from "@/plugins/http";
import config from "@/app.config";
/** importComponents*/
import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
/** use*/
const $q = useQuasar();
const mixin = useCounterMixin();
@ -25,24 +23,19 @@ const props = defineProps({
},
});
const amountRef = ref<any>();
/** ฟังก์ชั่นสำหรับ validate ฟอร์ม */
function validateForm() {
if (amountRef.value.validate()) {
onSubmit();
}
}
/** function ปืด Popup */
/**
* function ปืด Popup
*/
function close() {
modal.value = false;
amount.value = null;
}
/** function ยืนยันการบันทึกข้อมูล*/
/**
* function ยืนยันการบันทึกข้อมูล
*/
function onSubmit() {
dialogConfirm($q, () => {
dialogConfirm($q, async () => {
if (amount.value !== null) {
showLoader();
const amountString: string = amount.value.toString();
@ -53,7 +46,7 @@ function onSubmit() {
? amount.value
: Number(amountString.replace(/,/g, "")),
};
http
await http
.post(config.API.salaryPeriod() + `/change/amount`, body)
.then(async () => {
await props.fetchData?.();
@ -74,28 +67,29 @@ function onSubmit() {
<template>
<q-dialog v-model="modal" persistent>
<q-card class="col-12" style="width: 30%">
<Header :tittle="`แก้ไขเงินเดือน`" :close="close" />
<q-separator />
<q-form greedy @submit.prevent @validation-success="onSubmit">
<Header :tittle="`แก้ไขเงินเดือน`" :close="close" />
<q-separator />
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm">
<q-input
ref="amountRef"
dense
outlined
v-model="amount"
label="เงินเดือนฐาน"
mask="###,###,###,###"
reverse-fill-mask
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือนฐาน'}`]"
lazy-rules
hide-bottom-space
class="inputgreen"
/>
</div>
</q-card-section>
<q-separator />
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm">
<q-input
ref="amountRef"
dense
outlined
v-model="amount"
label="เงินเดือนฐาน"
mask="###,###,###,###"
reverse-fill-mask
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือนฐาน'}`]"
lazy-rules
hide-bottom-space
class="inputgreen"
/>
</div>
</q-card-section>
<q-separator />
<form @submit.prevent="validateForm">
<q-card-actions align="right" class="bg-white text-teal">
<q-btn
type="submit"
@ -104,7 +98,7 @@ function onSubmit() {
label="บันทึก"
/>
</q-card-actions>
</form>
</q-form>
</q-card>
</q-dialog>
</template>

5
src/modules/13_salary/components/SalaryLists/DialogInfoCriteria.vue → src/modules/13_salary/components/04_salaryLists/DialogInfoCriteria.vue
View file

@ -1,10 +1,13 @@
<script setup lang="ts">
import { ref } from "vue";
import Header from "@/components/DialogHeader.vue";
const modal = defineModel<boolean>("modal", { required: true });
const separator = ref<any>("cell");
/** ปิด Dialog */
/**
* ปิด Dialog
*/
function closeDialog() {
modal.value = !modal.value;
}

82
src/modules/13_salary/components/SalaryLists/DialogMoveGroup.vue → src/modules/13_salary/components/04_salaryLists/DialogMoveGroup.vue
View file

@ -1,16 +1,15 @@
<script setup lang="ts">
import { ref, defineModel, watch } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
import http from "@/plugins/http";
import config from "@/app.config";
/** importComponents*/
import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
/** use*/
const $q = useQuasar();
const store = useSalaryListSDataStore();
@ -28,32 +27,28 @@ const props = defineProps({
});
/** ตัวแปร*/
const group = ref<string>("");
const groupRef = ref<any>(null);
const group = ref<string>(""); //กลุ่ม
const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
/*** ฟังก์ชั่นสำหรับ validate ฟอร์ม */
function validateForm() {
if (groupRef.value.validate()) {
onSubmit();
}
}
/** function ปืด Popup */
/**
* function ปืด Popup
*/
function close() {
modal.value = false;
group.value = "";
}
/** function ยืนยันการบันทึกข้อมูล*/
/**
* function ยืนยันการบันทึกข้อมูล
*/
function onSubmit() {
dialogConfirm($q, () => {
dialogConfirm($q, async () => {
showLoader();
const body = {
profileId: profileId.value,
groupId: group.value,
};
http
await http
.post(config.API.salaryPeriod() + `/change/group`, body)
.then(async () => {
await props.fetchData?.();
@ -90,32 +85,33 @@ function inputEdit(val: boolean) {
<template>
<q-dialog v-model="modal" persistent>
<q-card class="col-12" style="width: 30%">
<Header :tittle="`ย้ายกลุ่ม`" :close="close" />
<q-separator />
<q-form greedy @submit.prevent @validation-success="onSubmit">
<Header :tittle="`ย้ายกลุ่ม`" :close="close" />
<q-separator />
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm">
<q-select
ref="groupRef"
:class="inputEdit(isReadonly)"
v-model="group"
label="กลุ่ม"
dense
outlined
emit-value
map-options
option-label="name"
option-value="id"
:options="store.groupOp.filter((e) => e.name !== props.group)"
:rules="[(val) => !!val || `${'กรุณากลุ่ม'}`]"
lazy-rules
hide-bottom-space
/>
</div>
</q-card-section>
<q-separator />
<form @submit.prevent="validateForm">
<q-card-actions align="right" class="bg-white text-teal">
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm">
<q-select
ref="groupRef"
:class="inputEdit(isReadonly)"
v-model="group"
label="กลุ่ม"
dense
outlined
emit-value
map-options
option-label="name"
option-value="id"
:options="store.groupOp.filter((e) => e.name !== props.group)"
:rules="[(val:string) => !!val || `${'กรุณากลุ่ม'}`]"
lazy-rules
hide-bottom-space
/>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right">
<q-btn
type="submit"
for="#submitForm"
@ -123,7 +119,7 @@ function inputEdit(val: boolean) {
label="บันทึก"
/>
</q-card-actions>
</form>
</q-form>
</q-card>
</q-dialog>
</template>

156
src/modules/13_salary/components/SalaryLists/DialogMoveLevel.vue → src/modules/13_salary/components/04_salaryLists/DialogMoveLevel.vue
View file

@ -1,27 +1,20 @@
<script setup lang="ts">
import { ref, computed, watch } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
import http from "@/plugins/http";
import config from "@/app.config";
/** importComponents*/
import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
/** use*/
const $q = useQuasar();
const store = useSalaryListSDataStore();
const {
dialogConfirm,
success,
messageError,
showLoader,
hideLoader,
dialogMessageNotify,
} = useCounterMixin();
const { dialogConfirm, success, messageError, showLoader, hideLoader } =
useCounterMixin();
/**porps*/
const modal = defineModel<boolean>("modal", { required: true });
@ -35,9 +28,8 @@ const props = defineProps({
},
});
const type = ref<string>("");
const note = ref<string>("");
const typeRef = ref<any>(null);
const type = ref<string>(""); //เลื่อนขั้น
const note = ref<string>(""); //หมายเหตุ
const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
const isChange = ref<boolean>(false); // มีการแก้ไขข้อมูลหรือไม่
const isReserve = ref<boolean>(false); // สำรองหรือไม่
@ -62,22 +54,19 @@ const typeRangeOps = computed(() => {
];
});
/*** ฟังก์ชั่นสำหรับ validate ฟอร์ม */
function validateForm() {
if (typeRef.value.validate()) {
onSubmit();
}
}
/** function ปืด Popup */
/**
* function ปืด Popup
*/
function close() {
modal.value = false;
type.value = "";
}
/** function ยืนยันการบันทึกข้อมูล*/
/**
* function ยืนยันการบันทึกข้อมูล
*/
function onSubmit() {
dialogConfirm($q, () => {
dialogConfirm($q, async () => {
showLoader();
const body = {
profileId: profileId.value,
@ -85,7 +74,7 @@ function onSubmit() {
isReserve: isReserve.value,
remark: type.value === "NONE" ? note.value : undefined,
};
http
await http
.post(config.API.salaryPeriod() + `/change/type`, body)
.then(async () => {
await props.fetchData?.();
@ -101,80 +90,81 @@ function onSubmit() {
});
}
/**
* function เปลี่ยนระดับ
*/
function chengType() {
note.value = props.typeLevel === "NONE" ? props.remark : "";
}
watch(
() => modal.value,
() => {
console.log(props.remark);
type.value = props.typeLevel == "PENDING" ? "" : props.typeLevel;
note.value = props.typeLevel === "NONE" ? props.remark : "";
isReserve.value = props.isReserve;
isChange.value = false;
}
);
function inputEdit(val: boolean) {
return {
"full-width cursor-pointer inputgreen ": val,
"full-width cursor-pointer inputgreen": !val,
};
}
watch(
() => modal.value,
() => {
type.value = props.typeLevel == "PENDING" ? "" : props.typeLevel;
note.value = props.typeLevel === "NONE" ? props.remark : "";
isReserve.value = props.isReserve;
isChange.value = false;
}
);
</script>
<template>
<q-dialog v-model="modal" persistent>
<q-card class="col-12" style="width: 30%">
<Header :tittle="`เลื่อนขั้น`" :close="close" />
<q-separator />
<q-form greedy @submit.prevent @validation-success="onSubmit">
<Header :tittle="`เลื่อนขั้น`" :close="close" />
<q-separator />
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm">
<q-select
ref="typeRef"
:class="inputEdit(isReadonly)"
v-model="type"
label="เลื่อนขั้น"
dense
outlined
emit-value
map-options
option-label="name"
option-value="id"
:options="typeRangeOps"
:rules="[(val) => !!val || `${'กรุณาเลือก ขั้น'}`]"
lazy-rules
hide-bottom-space
@update:model-value="(isChange = true), chengType()"
/>
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm">
<q-select
ref="typeRef"
:class="inputEdit(isReadonly)"
v-model="type"
label="เลื่อนขั้น"
dense
outlined
emit-value
map-options
option-label="name"
option-value="id"
:options="typeRangeOps"
:rules="[(val) => !!val || `${'กรุณาเลือก ขั้น'}`]"
lazy-rules
hide-bottom-space
@update:model-value="(isChange = true), chengType()"
/>
<q-checkbox
v-if="type === 'FULL'"
keep-color
label="สำรอง"
dense
v-model="isReserve"
@update:model-value="isChange = true"
/>
<q-checkbox
v-if="type === 'FULL'"
keep-color
label="สำรอง"
dense
v-model="isReserve"
@update:model-value="isChange = true"
/>
<q-input
v-if="type === 'NONE'"
outlined
dense
v-model="note"
label="หมายเหตุ"
type="textarea"
:class="inputEdit(isReadonly)"
@update:model-value="isChange = true"
/>
</div>
</q-card-section>
<q-separator />
<form @submit.prevent="validateForm">
<q-card-actions align="right" class="bg-white text-teal">
<q-input
v-if="type === 'NONE'"
outlined
dense
v-model="note"
label="หมายเหตุ"
type="textarea"
:class="inputEdit(isReadonly)"
@update:model-value="isChange = true"
/>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right">
<q-btn
:disabled="!isChange"
type="submit"
@ -183,7 +173,7 @@ function inputEdit(val: boolean) {
label="บันทึก"
/>
</q-card-actions>
</form>
</q-form>
</q-card>
</q-dialog>
</template>

114
src/modules/13_salary/components/SalaryLists/DialogProperties.vue → src/modules/13_salary/components/04_salaryLists/DialogProperties.vue
View file

@ -1,27 +1,20 @@
<script setup lang="ts">
import { ref, computed, watch } from "vue";
import { ref, watch } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
/** importComponents*/
import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
/** use*/
const $q = useQuasar();
const store = useSalaryListSDataStore();
const {
dialogConfirm,
success,
messageError,
showLoader,
hideLoader,
dialogMessageNotify,
} = useCounterMixin();
const { dialogConfirm, success, messageError, showLoader, hideLoader } =
useCounterMixin();
/**porps*/
const modal = defineModel<boolean>("modal", { required: true });
@ -37,41 +30,24 @@ const props = defineProps({
});
const type = ref<string>("");
const isPunish = ref<boolean>(false); // มีการแก้ไขข้อมูลหรือไม่
const isSuspension = ref<boolean>(false); // สำรองหรือไม่
const isAbsent = ref<boolean>(false); // สำรองหรือไม่
const isLeave = ref<boolean>(false); // สำรองหรือไม่
const typeRangeOps = computed(() => {
return store.roundMainCode == "OCT"
? [
{ id: "NONE", name: "ไม่ได้เลื่อน" },
{ id: "HAFT", name: "0.5 ขั้น" },
{ id: "FULL", name: "1 ขั้น" },
{ id: "FULLHAFT", name: "1.5 ขั้น" },
]
: [
{ id: "NONE", name: "ไม่ได้เลื่อน" },
{ id: "HAFT", name: "0.5 ขั้น" },
{ id: "FULL", name: "1 ขั้น" },
];
});
/*** ฟังก์ชั่นสำหรับ validate ฟอร์ม */
function validateForm() {
onSubmit();
}
/** function ปืด Popup */
/**
* function ปืด Popup
*/
function close() {
modal.value = false;
type.value = "";
}
/** function ยืนยันการบันทึกข้อมูล*/
/**
* function ยืนยันการบันทึกข้อมูล
*/
function onSubmit() {
dialogConfirm($q, () => {
dialogConfirm($q, async () => {
showLoader();
const body = {
isPunish: isPunish.value,
@ -79,7 +55,7 @@ function onSubmit() {
isAbsent: isAbsent.value,
isLeave: isLeave.value,
};
http
await http
.put(config.API.salaryProperty(profileId.value), body)
.then(async () => {
await props.fetchData?.();
@ -111,34 +87,40 @@ watch(
<template>
<q-dialog v-model="modal" persistent>
<q-card class="col-12" style="width: 20%">
<Header :tittle="`แก้ไขคุณสมบัติ`" :close="close" />
<q-separator />
<q-form greedy @submit.prevent @validation-success="onSubmit">
<Header :tittle="`แก้ไขคุณสมบัติ`" :close="close" />
<q-separator />
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm column">
<q-checkbox
keep-color
label="ไม่ถูกลงโทษทางวินัย"
dense
v-model="isPunish"
/>
<q-checkbox
keep-color
label="ไม่ถูกพักราชการ"
dense
v-model="isSuspension"
/>
<q-checkbox
keep-color
label="ไม่ขาดราชการ"
dense
v-model="isAbsent"
/>
<q-checkbox
keep-color
label="วันลาไม่เกิน"
dense
v-model="isLeave"
/>
</div>
</q-card-section>
<q-separator />
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm column">
<q-checkbox
keep-color
label="ไม่ถูกลงโทษทางวินัย"
dense
v-model="isPunish"
/>
<q-checkbox
keep-color
label="ไม่ถูกพักราชการ"
dense
v-model="isSuspension"
/>
<q-checkbox
keep-color
label="ไม่ขาดราชการ"
dense
v-model="isAbsent"
/>
<q-checkbox keep-color label="วันลาไม่เกิน" dense v-model="isLeave" />
</div>
</q-card-section>
<q-separator />
<form @submit.prevent="validateForm">
<q-card-actions align="right" class="bg-white text-teal">
<q-btn
type="submit"
@ -147,7 +129,7 @@ watch(
label="บันทึก"
/>
</q-card-actions>
</form>
</q-form>
</q-card>
</q-dialog>
</template>

25
src/modules/13_salary/components/SalaryLists/ProcessStep.vue → src/modules/13_salary/components/04_salaryLists/ProcessStep.vue
View file

@ -1,8 +1,11 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { useQuasar } from "quasar";
import { checkPermission } from "@/utils/permissions";
import axios from "axios";
import { checkPermission } from "@/utils/permissions";
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
import { useCounterMixin } from "@/stores/mixin";
import http from "@/plugins/http";
import config from "@/app.config";
@ -10,8 +13,6 @@ import config from "@/app.config";
import DialogPopupReason from "@/components/Dialogs/PopupReason.vue"; //หมายเหตุ
/** importStore*/
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
import { useCounterMixin } from "@/stores/mixin";
/* use**/
const $q = useQuasar(); //ใช้ noti quasar
@ -32,13 +33,13 @@ const props = defineProps({
getData: Function,
});
const modalRecommend = ref<boolean>(false);
const titleRecommend = ref<string>("");
const listFile = ref<any>([]);
const type = ref<string>("");
const modalRecommend = ref<boolean>(false); //popup
const titleRecommend = ref<string>(""); //หัวข้อ Popup
const listFile = ref<any[]>([]); //รายการไฟล์
const type = ref<string>(""); //ประเภท
const sendStep = ref<number>(1);
const fileUpload = ref<any>(null);
const document = ref<string>("");
const fileUpload = ref<any>(null); //ไฟล์
const document = ref<string>(""); //ดาวน์โหลดไฟล์
/**
* function อัปโหลดไฟล์เจ้าหน้าที่
@ -112,10 +113,10 @@ function uploadfile(uploadUrl: string, file: any) {
}
/**
* fetchList ไฟล์
* fetch รายการไฟล์
*/
function getListFile() {
http
async function getListFile() {
await http
.get(
config.API.subFile(
"ระบบเงินเดือน",

6
src/modules/13_salary/components/SalaryLists/TabMain.vue → src/modules/13_salary/components/04_salaryLists/TabMain.vue
View file

@ -15,9 +15,9 @@ import type {
} from "@/modules/13_salary/interface/response/SalaryList";
/** importComponents*/
import TableTabType1 from "@/modules/13_salary/components/SalaryLists/TableTypePending.vue";
import TableTabType2 from "@/modules/13_salary/components/SalaryLists/TableTypeOther.vue";
import DialogInfoCriteria from "@/modules/13_salary/components/SalaryLists/DialogInfoCriteria.vue";
import TableTabType1 from "@/modules/13_salary/components/04_salaryLists/TableTypePending.vue";
import TableTabType2 from "@/modules/13_salary/components/04_salaryLists/TableTypeOther.vue";
import DialogInfoCriteria from "@/modules/13_salary/components/04_salaryLists/DialogInfoCriteria.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";

70
src/modules/13_salary/components/SalaryLists/TableTypeOther.vue → src/modules/13_salary/components/04_salaryLists/TableTypeOther.vue
View file

@ -11,10 +11,10 @@ import type { NewPagination } from "@/modules/13_salary/interface/index/Main";
import type { DataFilter } from "@/modules/13_salary/interface/index/SalaryList";
/** importComponents*/
import DialogAddPerson from "@/modules/13_salary/components/SalaryLists//DialogAddPerson.vue";
import DialogFormEdit from "@/modules/13_salary/components/SalaryLists/DialogFormEdit.vue";
import DialogMoveGroup from "@/modules/13_salary/components/SalaryLists/DialogMoveGroup.vue";
import DialogMoveLevel from "@/modules/13_salary/components/SalaryLists/DialogMoveLevel.vue";
import DialogAddPerson from "@/modules/13_salary/components/04_salaryLists//DialogAddPerson.vue";
import DialogFormEdit from "@/modules/13_salary/components/04_salaryLists/DialogFormEditSalary.vue";
import DialogMoveGroup from "@/modules/13_salary/components/04_salaryLists/DialogMoveGroup.vue";
import DialogMoveLevel from "@/modules/13_salary/components/04_salaryLists/DialogMoveLevel.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
@ -155,7 +155,6 @@ const baseColumns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
]);
const visibleColumns = ref<string[]>([
"no",
"posNo",
@ -170,27 +169,30 @@ const visibleColumns = ref<string[]>([
"isRetired",
"remark",
]);
const columns = computed(() => {
if (props.type !== "NONE") {
if (baseColumns.value) {
return baseColumns.value.filter((column) => column.name !== "remark");
}
}
return baseColumns.value;
});
/** modalDialog*/
const modalDialogAddPerson = ref<boolean>(false);
const modalDialogForm = ref<boolean>(false);
const modalDialogMoveGroup = ref<boolean>(false);
const modalDialogMoveLeve = ref<boolean>(false);
const modalDialogAddPerson = ref<boolean>(false); //popup เพิ่มคนเลื่อนเงินเดือน
const modalDialogForm = ref<boolean>(false); //popup แก้ไขเงินเดือน
const modalDialogMoveGroup = ref<boolean>(false); //popup ย้ายกลุ่ม
const modalDialogMoveLeve = ref<boolean>(false); //popup เลื่อนขั้น
const profileId = ref<string>("");
const amount = ref<number>(0);
const profileId = ref<string>(""); //id คน
const amount = ref<number>(0); //เงินเดือน
const typeLevel = ref<string>(""); //เลื่อนขั้น
const isReserve = ref<boolean>(false);
const remark = ref<string>(""); //หมายเหตุ
/** function openPopup เพิ่มคนเลื่อนเงินเดือน*/
/**
* function openPopup เพิ่มคนเลื่อนเงินเดือน
*/
function onClickAddPerson() {
modalDialogAddPerson.value = !modalDialogAddPerson.value;
}
@ -217,12 +219,8 @@ function onClickMovieGroup(id: string) {
modalDialogMoveGroup.value = !modalDialogMoveGroup.value;
}
const typeLevel = ref<string>("");
const isReserve = ref<boolean>(false);
const remark = ref<string>("");
/**
* function openPopup ย้ายกขั้น
* function openPopup ย้ายกลุ่ม
* @param id profileId
*
*/
@ -261,24 +259,32 @@ function onClickDelete(id: string) {
});
}
/** function updatePageTable*/
/**
* function updatePageTable
*/
function updatePagePagination() {
props.fetchDataTable?.();
}
/** function updatePageSizeTable*/
/**
* function updatePageSizeTable
*/
function updatePageSizePagination(newPagination: NewPagination) {
formFilter.value.page = 1;
formFilter.value.pageSize = newPagination.rowsPerPage;
}
/** function ค้นหาข้อมูล Table*/
/**
* function ค้นหาข้อมูล Table
*/
function searchData() {
formFilter.value.page = 1;
props.fetchDataTable?.();
}
/** callblack function เรียกข้อมูลรายชื่อใหม่ เมื่อมีการเปลี่ยน PageSize*/
/**
* callblack function เรียกข้อมูลรายชื่อใหม่ เมื่อมีการเปลี่ยน PageSize
*/
watch(
() => formFilter.value.pageSize,
() => {
@ -515,27 +521,27 @@ watch(
<DialogAddPerson
v-model:modal="modalDialogAddPerson"
:fetchData="props.fetchDataTable"
:fetch-data="props.fetchDataTable"
/>
<DialogFormEdit
v-model:modal="modalDialogForm"
v-model:profileId="profileId"
v-model:profile-id="profileId"
v-model:amount="amount"
:fetchData="props.fetchDataTable"
:fetch-data="props.fetchDataTable"
/>
<DialogMoveGroup
v-model:modal="modalDialogMoveGroup"
v-model:profileId="profileId"
v-model:profile-id="profileId"
:fetch-data="props.fetchDataTable"
:group="store.tabGroup === 'group1' ? 'กลุ่ม1' : 'กลุ่ม2'"
:fetchData="props.fetchDataTable"
/>
<DialogMoveLevel
:typeLevel="typeLevel"
:isReserve="isReserve"
v-model:modal="modalDialogMoveLeve"
v-model:profileId="profileId"
:fetchData="props.fetchDataTable"
v-model:profile-id="profileId"
:fetch-data="props.fetchDataTable"
:type-level="typeLevel"
:is-reserve="isReserve"
:type="store.tabType"
:remark="remark"
/>

77
src/modules/13_salary/components/SalaryLists/TableTypePending.vue → src/modules/13_salary/components/04_salaryLists/TableTypePending.vue
View file

@ -9,11 +9,11 @@ import type { NewPagination } from "@/modules/13_salary/interface/index/Main";
import type { DataFilter } from "@/modules/13_salary/interface/index/SalaryList";
/** importComponents*/
import DialogAddPerson from "@/modules/13_salary/components/SalaryLists//DialogAddPerson.vue"; //เพิ่มคนเลื่อนเงินเดือน
import DialogFormEdit from "@/modules/13_salary/components/SalaryLists/DialogFormEdit.vue"; // แก้ไขเงินเดือน
import DialogMoveGroup from "@/modules/13_salary/components/SalaryLists/DialogMoveGroup.vue"; // ย้ายกลุ่ม
import DialogMoveLevel from "@/modules/13_salary/components/SalaryLists/DialogMoveLevel.vue"; // เลื่อนขั้น
import DialogProperties from "@/modules/13_salary/components/SalaryLists/DialogProperties.vue"; //แก้ไขคุณสมบัติ
import DialogAddPerson from "@/modules/13_salary/components/04_salaryLists//DialogAddPerson.vue"; //เพิ่มคนเลื่อนเงินเดือน
import DialogFormEdit from "@/modules/13_salary/components/04_salaryLists/DialogFormEditSalary.vue"; // แก้ไขเงินเดือน
import DialogMoveGroup from "@/modules/13_salary/components/04_salaryLists/DialogMoveGroup.vue"; // ย้ายกลุ่ม
import DialogMoveLevel from "@/modules/13_salary/components/04_salaryLists/DialogMoveLevel.vue"; // เลื่อนขั้น
import DialogProperties from "@/modules/13_salary/components/04_salaryLists/DialogProperties.vue"; //แก้ไขคุณสมบัติ
import DialogInfo from "@/modules/13_salary/components/DialogInfoMain.vue";
/** importStore*/
@ -181,20 +181,23 @@ const visibleColumns = ref<string[]>([
]);
/** modalDialog*/
const modalDialogAddPerson = ref<boolean>(false);
const modalDialogForm = ref<boolean>(false);
const modalDialogMoveGroup = ref<boolean>(false);
const modalDialogMoveLeve = ref<boolean>(false);
const modalDialogAddPerson = ref<boolean>(false); //popup เพิ่มคนเลื่อนเงินเดือน
const modalDialogForm = ref<boolean>(false); //popup แก้ไขเงินเดือน
const modalDialogMoveGroup = ref<boolean>(false); //popup ย้ายกลุ่ม
const modalDialogMoveLeve = ref<boolean>(false); //popup เลื่อนขั้น
const modalDialogProperties = ref<boolean>(false);
const modalDialogInfo = ref<boolean>(false);
const modalDialogInfo = ref<boolean>(false); // /popup ข้อมูลส่วนตัว
/** ตัวแปร*/
const profileId = ref<string>("");
const amount = ref<number>(0);
const profileId = ref<string>(""); //id คน
const amount = ref<number>(0); //เงินเดือน
const typeLevel = ref<string>(""); //เลื่อนขั้น
const isReserve = ref<boolean>(false);
const isPunish = ref<boolean>(false);
const isSuspension = ref<boolean>(false);
const isAbsent = ref<boolean>(false);
const isLeave = ref<boolean>(false);
/**
* function ยืนยันการลบรายชื่อ
* @param id profileId
@ -217,7 +220,9 @@ function onClickDelete(id: string) {
});
}
/** function openPopup เพิ่มคนเลื่อนเงินเดือน*/
/**
* function openPopup เพิ่มคนเลื่อนเงินเดือน
*/
function onClickAddPerson() {
modalDialogAddPerson.value = !modalDialogAddPerson.value;
}
@ -244,9 +249,6 @@ function onClickMovieGroup(id: string) {
modalDialogMoveGroup.value = !modalDialogMoveGroup.value;
}
const typeLevel = ref<string>("");
const isReserve = ref<boolean>(false);
/**
* function openPopup ย้ายกขั้น
* @param id profileId
@ -259,23 +261,33 @@ function onClickMoveLevel(id: string, typeVal: string, isReserveVal: boolean) {
isReserve.value = isReserveVal;
}
/** function updatePageTable*/
/**
* function updatePageTable
*/
function updatePagePagination() {
props.fetchDataTable?.();
}
/** function updatePageSizeTable*/
/**
* function updatePageSizeTable
*/
function updatePageSizePagination(newPagination: NewPagination) {
formFilter.value.page = 1;
formFilter.value.pageSize = newPagination.rowsPerPage;
}
/** function ค้นหาข้อมูล Table*/
/**
* function ค้นหาข้อมูล Table
*/
function searchData() {
formFilter.value.page = 1;
props.fetchDataTable?.();
}
/**
* function เปิด popup คุณสมบัติ
* @param data ข่อมูลคุณสมบัติ
*/
function onProperties(data: any) {
modalDialogProperties.value = true;
profileId.value = data.id;
@ -293,7 +305,12 @@ watch(
}
);
const infoType = ref<string>("");
const infoType = ref<string>(""); //ประเภทข้อมูล
/**
* function ดูข้อมูลส่วนตัว
* @param type ประเภทข้อมูล
* @param id id ที่ต้องการดู
*/
function onClickViewInfo(type: string, id: string) {
infoType.value = type;
profileId.value = id;
@ -513,13 +530,13 @@ function onClickViewInfo(type: string, id: string) {
<!-- เพิ่มคนเลื่อนเงินเดือน -->
<DialogAddPerson
v-model:modal="modalDialogAddPerson"
:fetchData="props.fetchDataTable"
:fetch-data="props.fetchDataTable"
/>
<!-- แก้ไขเงินเดือน -->
<DialogFormEdit
v-model:modal="modalDialogForm"
v-model:profileId="profileId"
v-model:profile-id="profileId"
v-model:amount="amount"
:fetchData="props.fetchDataTable"
/>
@ -527,18 +544,18 @@ function onClickViewInfo(type: string, id: string) {
<!-- ย้ายกลุ่ม -->
<DialogMoveGroup
v-model:modal="modalDialogMoveGroup"
v-model:profileId="profileId"
v-model:profile-id="profileId"
:fetch-data="props.fetchDataTable"
:group="store.tabGroup === 'group1' ? 'กลุ่ม1' : 'กลุ่ม2'"
:fetchData="props.fetchDataTable"
/>
<!-- เลื่อนขั้น -->
<DialogMoveLevel
:typeLevel="typeLevel"
:isReserve="isReserve"
v-model:modal="modalDialogMoveLeve"
v-model:profileId="profileId"
:fetchData="props.fetchDataTable"
v-model:profile-id="profileId"
:fetch-data="props.fetchDataTable"
:type-level="typeLevel"
:is-reserve="isReserve"
:remark="''"
/>
@ -555,9 +572,9 @@ function onClickViewInfo(type: string, id: string) {
<DialogInfo
v-model:modal="modalDialogInfo"
v-model:profileId="profileId"
v-model:profile-id="profileId"
:type="infoType"
:employeeClass="''"
:employee-class="''"
/>
</template>

0
src/modules/13_salary/components/SalaryEmployeeLists/Dashboard.vue → src/modules/13_salary/components/05_salaryListsEmployee/Dashboard.vue
View file

53
src/modules/13_salary/components/SalaryEmployeeLists/DialogAddPerson.vue → src/modules/13_salary/components/05_salaryListsEmployee/DialogAddPerson.vue
View file

@ -1,6 +1,9 @@
<script setup lang="ts">
import { ref, reactive, watch } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
import config from "@/app.config";
import http from "@/plugins/http";
@ -14,10 +17,6 @@ import type { DataPerson } from "@/modules/13_salary/interface/response/SalaryLi
/** importComponents*/
import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
/** use*/
const $q = useQuasar();
const store = useSalaryEmployeeListSDataStore();
@ -33,6 +32,7 @@ const props = defineProps({
});
/** Table*/
const rows = ref<DataPerson[]>([]);
const columns = ref<QTableProps["columns"]>([
{
name: "no",
@ -89,8 +89,6 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
]);
const rows = ref<DataPerson[]>([]);
/** ข้อมูุลค้นหา*/
const formFilter = reactive<DataFilterPerson>({
page: 1,
@ -102,21 +100,25 @@ const formFilter = reactive<DataFilterPerson>({
});
const maxPage = ref<number>(1);
/** function close popup*/
/**
* function close popup
*/
function closeModal() {
modal.value = false;
formFilter.page = 1;
formFilter.keyword = "";
}
/** function เรียกรายชื่อ คนเลื่อนเงินเดือน*/
function fetchListPerson() {
/**
* function เรียกรายชื่อ คนเลื่อนเงินเดือน
*/
async function fetchListPerson() {
showLoader();
formFilter.rootId = store.rootId;
formFilter.period = store.roundMainCode;
formFilter.year = store.roundYear;
http
await http
.post(config.API.salaryListPersonEmp, formFilter)
.then((res) => {
const data = res.data.result.data;
@ -168,24 +170,32 @@ function onClickAddPerson(data: DataPerson) {
);
}
/** function updatePage*/
/**
* function updatePage
*/
async function updatePagePagination() {
fetchListPerson();
}
/** function updatePageSize*/
/**
* function updatePageSize
*/
function updatePageSizePagination(newPagination: NewPagination) {
formFilter.page = 1;
formFilter.pageSize = newPagination.rowsPerPage;
}
/** function ค้นหาข้อมูลตาม keyword*/
/**
* function ค้นหาข้อมูลตาม keyword
*/
function searchData() {
formFilter.page = 1;
fetchListPerson();
}
/** callblack function เรียกข้อมูลรายชื่อคนเลื่อนเงินเดือน เมื่อมีการเปิด Popup*/
/**
* callblack function เรียกข้อมูลรายชื่อคนเลื่อนเงินเดือน เมื่อมีการเปิด Popup
*/
watch(
() => modal.value,
() => {
@ -195,7 +205,9 @@ watch(
}
);
/** callblack function เรียกข้อมูลรายชื่อคนเลื่อนเงินเดือน เมื่อมีการเปลี่ยน PageSize*/
/**
* callblack function เรียกข้อมูลรายชื่อคนเลื่อนเงินเดือน เมื่อมีการเปลี่ยน PageSize
*/
watch(
() => formFilter.pageSize,
() => {
@ -302,17 +314,6 @@ watch(
</div>
</q-card-section>
<q-separator />
<!-- <q-card-actions align="right" class="bg-white text-teal">
<q-btn
type="submit"
unelevated
dense
class="q-px-md items-center"
color="light-blue-10"
label="บันทึก"
/>
</q-card-actions> -->
</q-card>
</q-dialog>
</template>

70
src/modules/13_salary/components/SalaryEmployeeLists/DialogFormEdit.vue → src/modules/13_salary/components/05_salaryListsEmployee/DialogFormEditSalary.vue
View file

@ -1,15 +1,13 @@
<script setup lang="ts">
import { ref } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import http from "@/plugins/http";
import config from "@/app.config";
/** importComponents*/
import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
/** use*/
const $q = useQuasar();
const mixin = useCounterMixin();
@ -25,24 +23,17 @@ const props = defineProps({
},
});
const amountRef = ref<any>();
/** ฟังก์ชั่นสำหรับ validate ฟอร์ม */
function validateForm() {
if (amountRef.value.validate()) {
onSubmit();
}
}
/** function ปืด Popup */
function close() {
modal.value = false;
amount.value = null;
}
/** function ยืนยันการบันทึกข้อมูล*/
/**
* function ยืนยันการบันทึกข้อมูล
*/
function onSubmit() {
dialogConfirm($q, () => {
dialogConfirm($q, async () => {
if (amount.value !== null) {
showLoader();
const amountString: string = amount.value.toString();
@ -53,7 +44,7 @@ function onSubmit() {
? amount.value
: Number(amountString.replace(/,/g, "")),
};
http
await http
.post(config.API.salaryPeriodEmp() + `/change/amount`, body)
.then(async () => {
await props.fetchData?.();
@ -74,29 +65,30 @@ function onSubmit() {
<template>
<q-dialog v-model="modal" persistent>
<q-card class="col-12" style="width: 30%">
<Header :tittle="`แก้ไขเงินเดือน`" :close="close" />
<q-separator />
<q-form greedy @submit.prevent @validation-success="onSubmit">
<Header :tittle="`แก้ไขเงินเดือน`" :close="close" />
<q-separator />
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm">
<q-input
ref="amountRef"
dense
outlined
v-model="amount"
label="เงินเดือนฐาน"
mask="###,###,###,###"
reverse-fill-mask
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือนฐาน'}`]"
lazy-rules
hide-bottom-space
class="inputgreen"
/>
</div>
</q-card-section>
<q-separator />
<form @submit.prevent="validateForm">
<q-card-actions align="right" class="bg-white text-teal">
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm">
<q-input
ref="amountRef"
dense
outlined
v-model="amount"
label="เงินเดือนฐาน"
mask="###,###,###,###"
reverse-fill-mask
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือนฐาน'}`]"
lazy-rules
hide-bottom-space
class="inputgreen"
/>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right">
<q-btn
type="submit"
for="#submitForm"
@ -104,7 +96,7 @@ function onSubmit() {
label="บันทึก"
/>
</q-card-actions>
</form>
</q-form>
</q-card>
</q-dialog>
</template>

5
src/modules/13_salary/components/SalaryEmployeeLists/DialogInfoCriteria.vue → src/modules/13_salary/components/05_salaryListsEmployee/DialogInfoCriteria.vue
View file

@ -4,7 +4,10 @@ import Header from "@/components/DialogHeader.vue";
const modal = defineModel<boolean>("modal", { required: true });
const separator = ref<any>("cell");
/** ปิด Dialog */
/**
* ปิด Dialog
*/
function closeDialog() {
modal.value = !modal.value;
}

98
src/modules/13_salary/components/SalaryEmployeeLists/DialogMoveGroup.vue → src/modules/13_salary/components/05_salaryListsEmployee/DialogMoveGroup.vue
View file

@ -1,16 +1,15 @@
<script setup lang="ts">
import { ref, defineModel, watch } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
import http from "@/plugins/http";
import config from "@/app.config";
/** importComponents*/
import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
/** use*/
const $q = useQuasar();
const store = useSalaryEmployeeListSDataStore();
@ -28,32 +27,29 @@ const props = defineProps({
});
/** ตัวแปร*/
const group = ref<string>("");
const groupRef = ref<any>(null);
const group = ref<string>(""); //กลุ่ม
const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
/*** ฟังก์ชั่นสำหรับ validate ฟอร์ม */
function validateForm() {
if (groupRef.value.validate()) {
onSubmit();
}
}
/** function ปืด Popup */
/**
* function ปืด Popup
*/
function close() {
modal.value = false;
group.value = "";
}
/** function ยืนยันการบันทึกข้อมูล*/
/**
* function ยืนยันการบันทึกข้อมูล
*/
function onSubmit() {
dialogConfirm($q, () => {
dialogConfirm($q, async () => {
showLoader();
const body = {
profileId: profileId.value,
groupId: group.value,
};
http
await http
.post(config.API.salaryPeriod() + `/change/group`, body)
.then(async () => {
await props.fetchData?.();
@ -69,6 +65,13 @@ function onSubmit() {
});
}
function inputEdit(val: boolean) {
return {
"full-width cursor-pointer inputgreen ": val,
"full-width cursor-pointer inputgreen": !val,
};
}
watch(
() => modal.value,
() => {
@ -78,45 +81,38 @@ watch(
}
}
);
function inputEdit(val: boolean) {
return {
"full-width cursor-pointer inputgreen ": val,
"full-width cursor-pointer inputgreen": !val,
};
}
</script>
<template>
<q-dialog v-model="modal" persistent>
<q-card class="col-12" style="width: 30%">
<Header :tittle="`ย้ายกลุ่ม`" :close="close" />
<q-separator />
<q-form greedy @submit.prevent @validation-success="onSubmit">
<Header :tittle="`ย้ายกลุ่ม`" :close="close" />
<q-separator />
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm">
<q-select
ref="groupRef"
:class="inputEdit(isReadonly)"
v-model="group"
label="กลุ่ม"
dense
outlined
emit-value
map-options
option-label="name"
option-value="id"
:options="store.groupOp.filter((e) => e.name !== props.group)"
:rules="[(val) => !!val || `${'กรุณากลุ่ม'}`]"
lazy-rules
hide-bottom-space
/>
</div>
</q-card-section>
<q-separator />
<form @submit.prevent="validateForm">
<q-card-actions align="right" class="bg-white text-teal">
<!-- <q-btn flat label="OK" v-close-popup /> -->
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm">
<q-select
ref="groupRef"
:class="inputEdit(isReadonly)"
v-model="group"
label="กลุ่ม"
dense
outlined
emit-value
map-options
option-label="name"
option-value="id"
:options="store.groupOp.filter((e) => e.name !== props.group)"
:rules="[(val) => !!val || `${'กรุณากลุ่ม'}`]"
lazy-rules
hide-bottom-space
/>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right">
<q-btn
type="submit"
for="#submitForm"
@ -124,7 +120,7 @@ function inputEdit(val: boolean) {
label="บันทึก"
/>
</q-card-actions>
</form>
</q-form>
</q-card>
</q-dialog>
</template>

142
src/modules/13_salary/components/SalaryEmployeeLists/DialogMoveLevel.vue → src/modules/13_salary/components/05_salaryListsEmployee/DialogMoveLevel.vue
View file

@ -1,16 +1,15 @@
<script setup lang="ts">
import { ref, computed, watch } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
import http from "@/plugins/http";
import config from "@/app.config";
/** importComponents*/
import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
/** use*/
const $q = useQuasar();
const store = useSalaryEmployeeListSDataStore();
@ -29,13 +28,11 @@ const props = defineProps({
},
});
const type = ref<string>("");
const note = ref<string>("");
const typeRef = ref<any>(null);
const type = ref<string>(""); //เลื่อนระดับ
const note = ref<string>(""); //หมายเหตุ
const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
const isChange = ref<boolean>(false); // มีการแก้ไขข้อมูลหรือไม่
const isReserve = ref<boolean>(false); // สำรองหรือไม่
const typeRangeOps = computed(() => {
return store.roundMainCode === "OCT"
? [
@ -56,22 +53,19 @@ const typeRangeOps = computed(() => {
];
});
/*** ฟังก์ชั่นสำหรับ validate ฟอร์ม */
function validateForm() {
if (typeRef.value.validate()) {
onSubmit();
}
}
/** function ปืด Popup */
/**
* function ปืด Popup
*/
function close() {
modal.value = false;
type.value = "";
}
/** function ยืนยันการบันทึกข้อมูล*/
/**
* function ยืนยันการบันทึกข้อมูล
*/
function onSubmit() {
dialogConfirm($q, () => {
dialogConfirm($q, async () => {
showLoader();
const body = {
profileId: profileId.value,
@ -79,7 +73,7 @@ function onSubmit() {
isReserve: isReserve.value,
remark: type.value === "NONE" ? note.value : undefined,
};
http
await http
.post(config.API.salaryPeriodEmp() + `/change/type`, body)
.then(async () => {
await props.fetchData?.();
@ -95,10 +89,20 @@ function onSubmit() {
});
}
/**
* function เปลี่ยนระดับ
*/
function chengType() {
note.value = props.typeLevel === "NONE" ? props.remark : "";
}
function inputEdit(val: boolean) {
return {
"full-width cursor-pointer inputgreen ": val,
"full-width cursor-pointer inputgreen": !val,
};
}
watch(
() => modal.value,
() => {
@ -108,66 +112,60 @@ watch(
isChange.value = false;
}
);
function inputEdit(val: boolean) {
return {
"full-width cursor-pointer inputgreen ": val,
"full-width cursor-pointer inputgreen": !val,
};
}
</script>
<template>
<q-dialog v-model="modal" persistent>
<q-card class="col-12" style="width: 30%">
<Header :tittle="`เลื่อนขั้น`" :close="close" />
<q-separator />
<q-form greedy @submit.prevent @validation-success="onSubmit">
<Header :tittle="`เลื่อนขั้น`" :close="close" />
<q-separator />
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm">
<q-select
ref="typeRef"
:class="inputEdit(isReadonly)"
v-model="type"
label="เลื่อนขั้น"
dense
outlined
emit-value
map-options
option-label="name"
option-value="id"
:options="typeRangeOps"
:rules="[(val) => !!val || `${'กรุณาเลือก ขั้น'}`]"
lazy-rules
hide-bottom-space
@update:model-value="(isChange = true), chengType()"
/>
<!-- :options="typeRangeOps.filter((e) => e.id !== store.tabType)" -->
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm">
<q-select
ref="typeRef"
:class="inputEdit(isReadonly)"
v-model="type"
label="เลื่อนขั้น"
dense
outlined
emit-value
map-options
option-label="name"
option-value="id"
:options="typeRangeOps"
:rules="[(val) => !!val || `${'กรุณาเลือก ขั้น'}`]"
lazy-rules
hide-bottom-space
@update:model-value="(isChange = true), chengType()"
/>
<!-- :options="typeRangeOps.filter((e) => e.id !== store.tabType)" -->
<q-checkbox
v-if="type === 'FULL'"
keep-color
label="สำรอง"
dense
v-model="isReserve"
@update:model-value="isChange = true"
/>
<q-checkbox
v-if="type === 'FULL'"
keep-color
label="สำรอง"
dense
v-model="isReserve"
@update:model-value="isChange = true"
/>
<q-input
v-if="type === 'NONE'"
:class="inputEdit(isReadonly)"
outlined
dense
v-model="note"
label="หมายเหตุ"
type="textarea"
@update:model-value="isChange = true"
/>
</div>
</q-card-section>
<q-separator />
<form @submit.prevent="validateForm">
<q-card-actions align="right" class="bg-white text-teal">
<q-input
v-if="type === 'NONE'"
:class="inputEdit(isReadonly)"
outlined
dense
v-model="note"
label="หมายเหตุ"
type="textarea"
@update:model-value="isChange = true"
/>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right">
<q-btn
:disabled="!isChange"
type="submit"
@ -176,7 +174,7 @@ function inputEdit(val: boolean) {
label="บันทึก"
/>
</q-card-actions>
</form>
</q-form>
</q-card>
</q-dialog>
</template>

99
src/modules/13_salary/components/SalaryEmployeeLists/DialogProperties.vue → src/modules/13_salary/components/05_salaryListsEmployee/DialogProperties.vue
View file

@ -1,6 +1,9 @@
<script setup lang="ts">
import { ref, computed, watch } from "vue";
import { ref, watch } from "vue";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
import http from "@/plugins/http";
import config from "@/app.config";
@ -8,8 +11,6 @@ import config from "@/app.config";
import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
/** use*/
const $q = useQuasar();
@ -43,20 +44,19 @@ const isSuspension = ref<boolean>(false); // สำรองหรือไม
const isAbsent = ref<boolean>(false); // สำรองหรือไม่
const isLeave = ref<boolean>(false); // สำรองหรือไม่
/*** ฟังก์ชั่นสำหรับ validate ฟอร์ม */
function validateForm() {
onSubmit();
}
/** function ปืด Popup */
/**
* function ปืด Popup
*/
function close() {
modal.value = false;
type.value = "";
}
/** function ยืนยันการบันทึกข้อมูล*/
/**
* function ยืนยันการบันทึกข้อมูล
*/
function onSubmit() {
dialogConfirm($q, () => {
dialogConfirm($q, async () => {
showLoader();
const body = {
isPunish: isPunish.value,
@ -64,7 +64,7 @@ function onSubmit() {
isAbsent: isAbsent.value,
isLeave: isLeave.value,
};
http
await http
.put(config.API.salaryPropertyEmp(profileId.value), body)
.then(async () => {
await props.fetchData?.();
@ -94,43 +94,44 @@ watch(
<template>
<q-dialog v-model="modal" persistent>
<q-card class="col-12" style="width: 20%">
<Header :tittle="`แก้ไขคุณสมบัติ`" :close="close" />
<q-separator />
<q-form greedy @submit.prevent @validation-success="onSubmit">
<Header :tittle="`แก้ไขคุณสมบัติ`" :close="close" />
<q-separator />
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm column">
<q-checkbox
toggle-indeterminate
keep-color
label="ไม่ถูกลงโทษทางวินัย"
dense
v-model="isPunish"
/>
<q-checkbox
toggle-indeterminate
keep-color
label="ไม่ถูกพักราชการ"
dense
v-model="isSuspension"
/>
<q-checkbox
toggle-indeterminate
keep-color
label="ไม่ขาดราชการ"
dense
v-model="isAbsent"
/>
<q-checkbox
toggle-indeterminate
keep-color
label="วันลาไม่เกิน"
dense
v-model="isLeave"
/>
</div>
</q-card-section>
<q-separator />
<q-card-section class="scroll" style="max-height: 70vh">
<div class="q-gutter-y-sm column">
<q-checkbox
toggle-indeterminate
keep-color
label="ไม่ถูกลงโทษทางวินัย"
dense
v-model="isPunish"
/>
<q-checkbox
toggle-indeterminate
keep-color
label="ไม่ถูกพักราชการ"
dense
v-model="isSuspension"
/>
<q-checkbox
toggle-indeterminate
keep-color
label="ไม่ขาดราชการ"
dense
v-model="isAbsent"
/>
<q-checkbox
toggle-indeterminate
keep-color
label="วันลาไม่เกิน"
dense
v-model="isLeave"
/>
</div>
</q-card-section>
<q-separator />
<form @submit.prevent="validateForm">
<q-card-actions align="right" class="bg-white text-teal">
<q-btn
type="submit"
@ -139,7 +140,7 @@ watch(
label="บันทึก"
/>
</q-card-actions>
</form>
</q-form>
</q-card>
</q-dialog>
</template>

53
src/modules/13_salary/components/SalaryEmployeeLists/ProcessStep.vue → src/modules/13_salary/components/05_salaryListsEmployee/ProcessStep.vue
View file

@ -1,16 +1,16 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { useQuasar } from "quasar";
import { checkPermission } from "@/utils/permissions";
import axios from "axios";
import { checkPermission } from "@/utils/permissions";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
import http from "@/plugins/http";
import config from "@/app.config";
import DialogPopupReason from "@/components/Dialogs/PopupReason.vue"; //หมายเหตุ
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
const $q = useQuasar(); //ใช้ noti quasar
const mixin = useCounterMixin();
const store = useSalaryEmployeeListSDataStore();
@ -29,11 +29,12 @@ const props = defineProps({
getData: Function,
});
const modalRecommend = ref<boolean>(false); //popup
const titleRecommend = ref<string>(""); //หัวข้อ Popup
const sendStep = ref<number>(1);
const fileUpload = ref<any>(null);
const document = ref<string>("");
const type = ref<string>("");
const listFile = ref<any>([]);
const fileUpload = ref<any>(null); //ไฟล์
const type = ref<string>(""); //ประเภท
const listFile = ref<any[]>([]); //รายการไฟล์
/**
* function อัปโหลดไฟล์เจ้าหน้าที่
* @param event file
@ -79,6 +80,10 @@ async function uploadFile(event: any) {
);
}
/**
* functoin อัปโหลดไฟล์
* @param uploadUrl link อัปโหลด
*/
function fileUpLoad(url: string) {
axios
.put(url, fileUpload.value, {
@ -98,6 +103,10 @@ function fileUpLoad(url: string) {
});
}
/**
* ยินยันการบันทึกคำแนะนำ
* @param reason คำแนะนำ
*/
function saveReccommend(reason: string) {
dialogConfirm(
$q,
@ -131,6 +140,11 @@ function saveReccommend(reason: string) {
);
}
/**
* ยืนยันการส่ง
* @param msg ส่งเอกสารให้ ผอ. ตรวจสอบ,ยืนยันและส่งเอกสารให้,ยืนยันการตรวจสอบ
* @param type officer, head,owner
*/
function sendToDirector(msg: string, type: string) {
dialogConfirm(
$q,
@ -160,16 +174,22 @@ function sendToDirector(msg: string, type: string) {
);
}
const modalRecommend = ref<boolean>(false);
const titleRecommend = ref<string>("");
/**
* ส่งคำแนะนำให้ ผอ. ตรวจสอบ
* @param title หัวข้อ
* @param typeOrder ประเภทคำสั่ง
*/
function sendAndRecommend(title: string, typeOrder: string) {
modalRecommend.value = true;
titleRecommend.value = title;
type.value = typeOrder;
}
function fetchListFile() {
http
/**
* fetch รายการไฟล์
*/
async function fetchListFile() {
await http
.get(
config.API.subFile(
"ระบบเงินเดือน",
@ -186,6 +206,10 @@ function fetchListFile() {
});
}
/**
* ลบไฟล์
* @param fileName ชื่อไฟล์
*/
function onDeleteFile(fileName: string) {
dialogRemove($q, () => {
showLoader();
@ -213,6 +237,10 @@ function onDeleteFile(fileName: string) {
});
}
/**
* โหลดไฟล์
* @param fileName ชื่อไฟล์
*/
function downloadFile(fileName: string) {
showLoader();
http
@ -236,6 +264,7 @@ function downloadFile(fileName: string) {
hideLoader();
});
}
onMounted(() => {
if (props.rootId) {
fetchListFile();

98
src/modules/13_salary/components/SalaryEmployeeLists/TabMain.vue → src/modules/13_salary/components/05_salaryListsEmployee/TabMain.vue
View file

@ -15,9 +15,9 @@ import type {
} from "@/modules/13_salary/interface/response/SalaryList";
/** importComponents*/
import TableTabType1 from "@/modules/13_salary/components/SalaryEmployeeLists/TableTypePending.vue";
import TableTabType2 from "@/modules/13_salary/components/SalaryEmployeeLists/TableTypeOther.vue";
import DialogInfoCriteria from "@/modules/13_salary/components/SalaryEmployeeLists/DialogInfoCriteria.vue";
import TableTabType1 from "@/modules/13_salary/components/05_salaryListsEmployee/TableTypePending.vue";
import TableTabType2 from "@/modules/13_salary/components/05_salaryListsEmployee/TableTypeOther.vue";
import DialogInfoCriteria from "@/modules/13_salary/components/05_salaryListsEmployee/DialogInfoCriteria.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
@ -36,11 +36,14 @@ const props = defineProps({
roundFilter: { type: Object, require: true },
});
const total = ref<number>();
const splitterModel = ref<number>(13);
const rows = ref<DataPeriod[]>([]);
const modalDialogInfoCriteria = ref<boolean>(false); //popup หลักเกณฑ์การพิจารณาเลื่อนขั้นเงินข้าราชการ
const isRetire = ref<boolean | string>(false); //แสดงเฉพาะผู้เกษียณอายุราชการ
const rows = ref<DataPeriod[]>([]); //ข้อมูลรายชื่อ
const total = ref<number>(0); //จำนวนรายการ
const maxPage = ref<number>(1); //จำนวนหน้า
/** itemsTab กลุ่ม*/
//itemsTab กลุ่ม
const itemsTabGroup = ref([
{
lable: "กลุ่ม 1",
@ -51,8 +54,7 @@ const itemsTabGroup = ref([
name: "group2",
},
]);
/** itemsTab ขั้น*/
//itemsTab ขั้น
const itemsTabType = computed(() => {
return store.roundMainCode === "OCT"
? [
@ -61,11 +63,6 @@ const itemsTabType = computed(() => {
name: "tab1",
type: "PENDING",
},
// {
// lable: "รายชื่อผู้เกษียณอายุราชการ",
// name: "tab5",
// type: "RETIRE",
// },
{
lable: "1 ขั้น",
name: "tab2",
@ -128,8 +125,7 @@ const itemsTabType = computed(() => {
},
];
});
/** itemsCard*/
//itemsCard
const itemsCard = ref([
{
lable: "จำนวนคนทั้งหมด",
@ -205,15 +201,13 @@ const itemsCard = ref([
total: 0,
},
]);
/** ข้อมูลค้นหารายชื่อคยขึ้นเงินเดือน*/
//ข้อมูลค้นหารายชื่อคยขึ้นเงินเดือน
const formFilter = reactive<DataFilter>({
page: 1,
pageSize: 10,
keyword: "",
type: store.tabType,
});
const maxPage = ref<number>(1);
/**
* function เรียกข้อมูลจำนวนโควต้า
@ -250,7 +244,7 @@ function fetchDataQuota(id: string) {
* function เรียกข้อมูลรายชื่อ
* @param id กลุ่ม
*/
function fetchDataPeriod(id: string) {
async function fetchDataPeriod(id: string) {
showLoader();
rows.value = [];
let formData = {
@ -266,7 +260,7 @@ function fetchDataPeriod(id: string) {
: "0",
};
http
await http
.put(config.API.salaryListPeriodORGEmp(id), formData)
.then((res) => {
rows.value = res.data.result.data;
@ -283,7 +277,9 @@ function fetchDataPeriod(id: string) {
});
}
/**function เปลี่ยนขั้น*/
/**
* function เปลี่ยนขั้น
*/
function changeTabType() {
formFilter.page = 1;
formFilter.pageSize = 10;
@ -291,13 +287,20 @@ function changeTabType() {
store.groupId && fetchDataPeriod(store.groupId);
}
/** function เรียกข้อมูลรายชื่ออีกครั้ง*/
/**
* function เรียกข้อมูลรายชื่ออีกครั้ง
*/
function fetchDataPeriodNew() {
store.groupId && fetchDataPeriod(store.groupId);
store.groupId && fetchDataQuota(store.groupId);
}
function onClickDownload(data: DataOption, type: string = "xlsx") {
/**
* function โหลดไฟล์
* @param data ข้อมูลที่ต้องการโหล
* @param type ประเภทไฟล์ docx,xlsx
*/
async function onClickDownload(data: DataOption, type: string = "xlsx") {
showLoader();
if (data.id === "emp-08" || data.id === "emp2-08") {
const formData = {
@ -311,11 +314,11 @@ function onClickDownload(data: DataOption, type: string = "xlsx") {
? `${props?.roundFilter?.year}-03-31`
: `${props?.roundFilter?.year}-09-30`,
};
http
await http
.post(config.API.leaveReportLeaveday("employee"), formData)
.then((res) => {
const dataList = res.data.result;
genReportXLSX(dataList, data.name);
.then(async (res) => {
const dataList = await res.data.result;
await genReportXLSX(dataList, data.name);
})
.catch((e) => {
messageError($q, e);
@ -325,7 +328,7 @@ function onClickDownload(data: DataOption, type: string = "xlsx") {
});
} else {
if (props.rootId && props.periodId) {
http
await http
.get(
config.API.salaryReportListsByid(
data.id,
@ -333,15 +336,9 @@ function onClickDownload(data: DataOption, type: string = "xlsx") {
props.periodId
)
)
.then((res) => {
const dataList = res.data.result;
// if (type === "pdf") {
// console.log(type);
// genReport(dataList, data.name, type);
// } else {
genReportXLSX(dataList, data.name, type);
// }
.then(async (res) => {
const dataList = await res.data.result;
await genReportXLSX(dataList, data.name, type);
})
.catch((e) => {
messageError($q, e);
@ -353,7 +350,14 @@ function onClickDownload(data: DataOption, type: string = "xlsx") {
}
}
const modalDialogInfoCriteria = ref<boolean>(false);
/**
* funrion แสดงเฉพาะผู้เกษียณอายุราชการ
*/
function updateIsShowRetire() {
isRetire.value = !isRetire.value;
fetchDataPeriodNew();
}
onMounted(() => {
if (props.rootId) {
fetchDataQuota(store.groupId);
@ -361,12 +365,6 @@ onMounted(() => {
splitterModel.value = store.roundMainCode === "APR" ? 13 : 16;
}
});
const isRetire = ref<boolean | string>(false);
const updateIsShowRetire = () => {
isRetire.value = !isRetire.value;
fetchDataPeriodNew();
};
</script>
<template>
@ -505,18 +503,18 @@ const updateIsShowRetire = () => {
>
<TableTabType1
v-if="index === 0"
v-model:max-page="maxPage"
v-model:form-filter="formFilter"
:fetch-data-table="fetchDataPeriodNew"
:rows="rows"
v-model:maxPage="maxPage"
v-model:formFilter="formFilter"
:fetchDataTable="fetchDataPeriodNew"
:total="total"
/>
<TableTabType2
v-else
:rows="rows"
v-model:maxPage="maxPage"
v-model:formFilter="formFilter"
:fetchDataTable="fetchDataPeriodNew"
v-model:max-page="maxPage"
v-model:form-filter="formFilter"
:fetch-data-table="fetchDataPeriodNew"
:total="total"
:type="item.type"
/>

74
src/modules/13_salary/components/SalaryEmployeeLists/TableTypeOther.vue → src/modules/13_salary/components/05_salaryListsEmployee/TableTypeOther.vue
View file

@ -1,7 +1,10 @@
<script setup lang="ts">
import { ref, watch, computed } from "vue";
import { useQuasar } from "quasar";
import { checkPermission } from "@/utils/permissions";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
import config from "@/app.config";
import http from "@/plugins/http";
@ -11,14 +14,10 @@ import type { NewPagination } from "@/modules/13_salary/interface/index/Main";
import type { DataFilter } from "@/modules/13_salary/interface/index/SalaryList";
/** importComponents*/
import DialogAddPerson from "@/modules/13_salary/components/SalaryEmployeeLists//DialogAddPerson.vue";
import DialogFormEdit from "@/modules/13_salary/components/SalaryEmployeeLists/DialogFormEdit.vue";
import DialogMoveGroup from "@/modules/13_salary/components/SalaryEmployeeLists/DialogMoveGroup.vue";
import DialogMoveLevel from "@/modules/13_salary/components/SalaryEmployeeLists/DialogMoveLevel.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
import DialogAddPerson from "@/modules/13_salary/components/05_salaryListsEmployee//DialogAddPerson.vue";
import DialogFormEdit from "@/modules/13_salary/components/05_salaryListsEmployee/DialogFormEditSalary.vue";
import DialogMoveGroup from "@/modules/13_salary/components/05_salaryListsEmployee/DialogMoveGroup.vue";
import DialogMoveLevel from "@/modules/13_salary/components/05_salaryListsEmployee/DialogMoveLevel.vue";
/** use*/
const $q = useQuasar();
@ -167,7 +166,6 @@ const baseColumns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
]);
const visibleColumns = ref<string[]>([
"no",
"posNo",
@ -183,7 +181,6 @@ const visibleColumns = ref<string[]>([
"isRetired",
"remark",
]);
const columns = computed(() => {
if (props.type !== "NONE") {
if (baseColumns.value) {
@ -194,15 +191,20 @@ const columns = computed(() => {
});
/** modalDialog*/
const modalDialogAddPerson = ref<boolean>(false);
const modalDialogForm = ref<boolean>(false);
const modalDialogMoveGroup = ref<boolean>(false);
const modalDialogMoveLeve = ref<boolean>(false);
const modalDialogAddPerson = ref<boolean>(false); //popup คนเลื่อนเงินเดือน
const modalDialogForm = ref<boolean>(false); //popup แก้ไขเงินเดือน
const modalDialogMoveGroup = ref<boolean>(false); //popup ย้ายกลุ่ม
const modalDialogMoveLeve = ref<boolean>(false); //popup เลื่อนขั้น
const profileId = ref<string>("");
const amount = ref<number>(0);
const profileId = ref<string>(""); //id คน
const amount = ref<number>(0); //เงินเดือน
const typeLevel = ref<string>(""); //เลื่อนขั้น
const isReserve = ref<boolean>(false); //สำรอง
const remark = ref<string>(""); //หมายเหตุ
/** function openPopup เพิ่มคนเลื่อนค่าจ้าง*/
/**
* function openPopup เพิ่มคนเลื่อนค่าจ้าง
*/
function onClickAddPerson() {
modalDialogAddPerson.value = !modalDialogAddPerson.value;
}
@ -229,10 +231,6 @@ function onClickMovieGroup(id: string) {
modalDialogMoveGroup.value = !modalDialogMoveGroup.value;
}
const typeLevel = ref<string>("");
const isReserve = ref<boolean>(false);
const remark = ref<string>("");
/**
* function openPopup ย้ายกขั้น
* @param id profileId
@ -273,24 +271,32 @@ function onClickDelete(id: string) {
});
}
/** function updatePageTable*/
/**
* function updatePageTable
*/
function updatePagePagination() {
props.fetchDataTable?.();
}
/** function updatePageSizeTable*/
/**
* function updatePageSizeTable
*/
function updatePageSizePagination(newPagination: NewPagination) {
formFilter.value.page = 1;
formFilter.value.pageSize = newPagination.rowsPerPage;
}
/** function ค้นหาข้อมูล Table*/
/**
* function ค้นหาข้อมูล Table
*/
function searchData() {
formFilter.value.page = 1;
props.fetchDataTable?.();
}
/** callblack function เรียกข้อมูลรายชื่อใหม่ เมื่อมีการเปลี่ยน PageSize*/
/**
* callblack function เรียกข้อมูลรายชื่อใหม่ เมื่อมีการเปลี่ยน PageSize
*/
watch(
() => formFilter.value.pageSize,
() => {
@ -528,27 +534,27 @@ watch(
<DialogAddPerson
v-model:modal="modalDialogAddPerson"
:fetchData="props.fetchDataTable"
:fetch-data="props.fetchDataTable"
/>
<DialogFormEdit
v-model:modal="modalDialogForm"
v-model:profileId="profileId"
v-model:profile-id="profileId"
v-model:amount="amount"
:fetchData="props.fetchDataTable"
:fetch-data="props.fetchDataTable"
/>
<DialogMoveGroup
v-model:modal="modalDialogMoveGroup"
v-model:profileId="profileId"
v-model:profile-id="profileId"
:fetch-data="props.fetchDataTable"
:group="store.tabGroup === 'group1' ? 'กลุ่ม1' : 'กลุ่ม2'"
:fetchData="props.fetchDataTable"
/>
<DialogMoveLevel
:typeLevel="typeLevel"
:isReserve="isReserve"
v-model:modal="modalDialogMoveLeve"
v-model:profileId="profileId"
:fetchData="props.fetchDataTable"
v-model:profile-id="profileId"
:fetch-data="props.fetchDataTable"
:type-level="typeLevel"
:is-reserve="isReserve"
:type="store.tabType"
:remark="remark"
/>

110
src/modules/13_salary/components/SalaryEmployeeLists/TableTypePending.vue → src/modules/13_salary/components/05_salaryListsEmployee/TableTypePending.vue
View file

@ -1,7 +1,12 @@
<script setup lang="ts">
import { ref, watch } from "vue";
import { useQuasar } from "quasar";
import { checkPermission } from "@/utils/permissions";
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
import http from "@/plugins/http";
import config from "@/app.config";
/** importType*/
import type { QTableProps } from "quasar";
@ -9,19 +14,13 @@ import type { NewPagination } from "@/modules/13_salary/interface/index/Main";
import type { DataFilter } from "@/modules/13_salary/interface/index/SalaryList";
/** importComponents*/
import DialogAddPerson from "@/modules/13_salary/components/SalaryEmployeeLists//DialogAddPerson.vue";
import DialogFormEdit from "@/modules/13_salary/components/SalaryEmployeeLists/DialogFormEdit.vue";
import DialogMoveGroup from "@/modules/13_salary/components/SalaryEmployeeLists/DialogMoveGroup.vue";
import DialogMoveLevel from "@/modules/13_salary/components/SalaryEmployeeLists/DialogMoveLevel.vue";
import DialogProperties from "@/modules/13_salary/components/SalaryEmployeeLists/DialogProperties.vue";
import DialogAddPerson from "@/modules/13_salary/components/05_salaryListsEmployee//DialogAddPerson.vue";
import DialogFormEdit from "@/modules/13_salary/components/05_salaryListsEmployee/DialogFormEditSalary.vue";
import DialogMoveGroup from "@/modules/13_salary/components/05_salaryListsEmployee/DialogMoveGroup.vue";
import DialogMoveLevel from "@/modules/13_salary/components/05_salaryListsEmployee/DialogMoveLevel.vue";
import DialogProperties from "@/modules/13_salary/components/05_salaryListsEmployee/DialogProperties.vue";
import DialogInfo from "@/modules/13_salary/components/DialogInfoMain.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useSalaryEmployeeListSDataStore } from "@/modules/13_salary/store/SalaryEmployeeListsStore";
import http from "@/plugins/http";
import config from "@/app.config";
/** use*/
const $q = useQuasar();
const store = useSalaryEmployeeListSDataStore();
@ -194,20 +193,23 @@ const visibleColumns = ref<string[]>([
]);
/** modalDialog*/
const modalDialogAddPerson = ref<boolean>(false);
const modalDialogForm = ref<boolean>(false);
const modalDialogMoveGroup = ref<boolean>(false);
const modalDialogMoveLeve = ref<boolean>(false);
const modalDialogProperties = ref<boolean>(false);
const modalDialogInfo = ref<boolean>(false);
const modalDialogAddPerson = ref<boolean>(false); //popup คนเลื่อนเงินเดือน
const modalDialogForm = ref<boolean>(false); //popup แก้ไขเงินเดือน
const modalDialogMoveGroup = ref<boolean>(false); //popup ย้ายกลุ่ม
const modalDialogMoveLeve = ref<boolean>(false); //popup เลื่อนขั้น
const modalDialogProperties = ref<boolean>(false); //popup คุณสมบัติ
const modalDialogInfo = ref<boolean>(false); //popup ข้อมูลส่วนตัว
/** ตัวแปร*/
const profileId = ref<string>("");
const amount = ref<number>(0);
const profileId = ref<string>(""); //id คน
const amount = ref<number>(0); //เงินเดือน
const typeLevel = ref<string>(""); //เลื่อนขั้น
const isReserve = ref<boolean>(false); //สำรอง
const isPunish = ref<boolean>(false);
const isSuspension = ref<boolean>(false);
const isAbsent = ref<boolean>(false);
const isLeave = ref<boolean>(false);
/**
* function ยืนยันการลบรายชื่อ
* @param id profileId
@ -230,7 +232,9 @@ function onClickDelete(id: string) {
});
}
/** function openPopup เพิ่มคนเลื่อนค่าจ้าง*/
/**
* function openPopup เพิ่มคนเลื่อนค่าจ้าง
*/
function onClickAddPerson() {
modalDialogAddPerson.value = !modalDialogAddPerson.value;
}
@ -257,8 +261,6 @@ function onClickMovieGroup(id: string) {
modalDialogMoveGroup.value = !modalDialogMoveGroup.value;
}
const typeLevel = ref<string>("");
const isReserve = ref<boolean>(false);
/**
* function openPopup ย้ายกขั้น
* @param id profileId
@ -271,23 +273,33 @@ function onClickMoveLevel(id: string, typeVal: string, isReserveVal: boolean) {
isReserve.value = isReserveVal;
}
/** function updatePageTable*/
/**
* function updatePageTable
*/
function updatePagePagination() {
props.fetchDataTable?.();
}
/** function updatePageSizeTable*/
/**
* function updatePageSizeTable
*/
function updatePageSizePagination(newPagination: NewPagination) {
formFilter.value.page = 1;
formFilter.value.pageSize = newPagination.rowsPerPage;
}
/** function ค้นหาข้อมูล Table*/
/**
* function ค้นหาข้อมูล Table
*/
function searchData() {
formFilter.value.page = 1;
props.fetchDataTable?.();
}
/**
* function เปิด popup คุณสมบัติ
* @param data ข่อมูลคุณสมบัติ
*/
function onProperties(data: any) {
modalDialogProperties.value = true;
profileId.value = data.id;
@ -296,20 +308,28 @@ function onProperties(data: any) {
isAbsent.value = data.isAbsent;
isLeave.value = data.isLeave;
}
/** callblack function เรียกข้อมูลรายชื่อใหม่ เมื่อมีการเปลี่ยน PageSize*/
const infoType = ref<string>(""); //ประเภทข้อมูล
/**
* function ดูข้อมูลส่วนตัว
* @param type ประเภทข้อมูล
* @param id id ที่ต้องการดู
*/
function onClickViewInfo(type: string, id: string) {
infoType.value = type;
profileId.value = id;
modalDialogInfo.value = true;
}
/**
* callblack function เรียกข้อมูลรายชื่อใหม่ เมื่อมีการเปลี่ยน PageSize
*/
watch(
() => formFilter.value.pageSize,
() => {
updatePagePagination();
}
);
const infoType = ref<string>("");
function onClickViewInfo(type: string, id: string) {
infoType.value = type;
profileId.value = id;
modalDialogInfo.value = true;
}
</script>
<template>
@ -531,44 +551,44 @@ function onClickViewInfo(type: string, id: string) {
<DialogAddPerson
v-model:modal="modalDialogAddPerson"
:fetchData="props.fetchDataTable"
:fetch-data="props.fetchDataTable"
/>
<DialogFormEdit
v-model:modal="modalDialogForm"
v-model:profileId="profileId"
v-model:profile-id="profileId"
v-model:amount="amount"
:fetchData="props.fetchDataTable"
:fetch-data="props.fetchDataTable"
/>
<DialogMoveGroup
v-model:modal="modalDialogMoveGroup"
v-model:profileId="profileId"
v-model:profile-id="profileId"
:fetch-data="props.fetchDataTable"
:group="store.tabGroup === 'group1' ? 'กลุ่ม1' : 'กลุ่ม2'"
:fetchData="props.fetchDataTable"
/>
<DialogMoveLevel
:typeLevel="typeLevel"
:isReserve="isReserve"
v-model:modal="modalDialogMoveLeve"
v-model:profileId="profileId"
:fetchData="props.fetchDataTable"
v-model:profile-id="profileId"
:type-level="typeLevel"
:is-reserve="isReserve"
:fetch-data="props.fetchDataTable"
:remark="''"
/>
<DialogProperties
v-model:modal="modalDialogProperties"
v-model:id="profileId"
:fetch-data="props.fetchDataTable"
:is-punish="isPunish"
:is-suspension="isSuspension"
:is-absent="isAbsent"
:is-leave="isLeave"
:fetch-data="props.fetchDataTable"
/>
<DialogInfo
v-model:modal="modalDialogInfo"
v-model:profileId="profileId"
v-model:profile-id="profileId"
:type="infoType"
:employeeClass="'-employee'"
:employee-class="'-employee'"
/>
</template>