663 lines
18 KiB
Vue
663 lines
18 KiB
Vue
<script setup lang="ts">
|
|
import { computed, onMounted, ref } from "vue";
|
|
import { useQuasar } from "quasar";
|
|
|
|
import { useSalaryListSDataStore } from "@/modules/13_salary/store/SalaryListsStore";
|
|
import { useCounterMixin } from "@/stores/mixin";
|
|
import {
|
|
checkPermission,
|
|
checkPermissionList,
|
|
checkPermissionCreate,
|
|
} from "@/utils/permissions";
|
|
import config from "@/app.config";
|
|
import http from "@/plugins/http";
|
|
|
|
/** importType*/
|
|
import type {
|
|
DataOption,
|
|
DataOptionShort,
|
|
} from "@/modules/13_salary/interface/index/Main";
|
|
import type {
|
|
DataRound,
|
|
DataAgency,
|
|
DataPeriodLatest,
|
|
} from "@/modules/13_salary/interface/response/SalaryList";
|
|
|
|
/** importComponents*/
|
|
import TabGroup from "@/modules/13_salary/components/04_salaryLists/TabMain.vue";
|
|
import ProcessStep from "@/modules/13_salary/components/04_salaryLists/ProcessStep.vue";
|
|
import PageDashBoard from "@/modules/13_salary/components/04_salaryLists/Dashboard.vue";
|
|
import DialogCommand from "@/modules/18_command/components/DialogCreateCommandORG.vue";
|
|
|
|
/** use*/
|
|
const store = useSalaryListSDataStore();
|
|
const $q = useQuasar();
|
|
const { messageError, showLoader, hideLoader, success, dialogConfirm } =
|
|
useCounterMixin();
|
|
|
|
/** ตัวแปร*/
|
|
const year = ref<number>(new Date().getFullYear()); //ปีงบประมาณ
|
|
const roundFilter = ref<any>(); //รอบการขึ้นเงินเดือน
|
|
const agencyFilter = ref<string>(""); //หน่วยงาน
|
|
const snapFilter = ref<string>(""); //รอบ
|
|
const periodLatest = ref<DataPeriodLatest>();
|
|
const salaryPeriodId = ref<string>("");
|
|
const dataOrg = ref<any[]>([]);
|
|
const isDeputy = ref<boolean>(false); // สำนักงานปลัด
|
|
|
|
//ตัวเลือก
|
|
const roundOptions = ref<DataOptionShort[]>([]); //ตัวเลือกรอบการขึ้นเงินเดือน
|
|
const snapOptions = ref<DataOption[]>([]); //รอบ
|
|
const agencyOptionsMain = ref<DataOption[]>([]); //ข้อมูลหน่วยงาน
|
|
const agencyOptions = ref<DataOption[]>([]); //หน่วยงาน
|
|
|
|
const isLoad = ref<boolean>(false);
|
|
const isDisable = ref<boolean>(false);
|
|
|
|
/** ตัวแปร select*/
|
|
const page = ref<number>(1);
|
|
const pageSize = ref<number>(50);
|
|
const lastPage = ref<number>(0);
|
|
|
|
/** ออกคำสั่ง*/
|
|
const modalCommand = ref<boolean>(false);
|
|
const isOfficer = ref<boolean>(false);
|
|
const isStaff = ref<boolean>(false);
|
|
const titleCommand = computed(() => {
|
|
let txt = "";
|
|
switch (roundFilter.value?.shortCode) {
|
|
case "OCT":
|
|
txt = "1 ตุลาคม";
|
|
break;
|
|
case "APR":
|
|
txt = "1 เมษายน";
|
|
break;
|
|
case "SPECIAL":
|
|
txt = " รอบพิเศษ";
|
|
break;
|
|
}
|
|
return `ปีงบประมาณ ${year.value + 543} รอบการขึ้นเงินเดือน ${txt}`;
|
|
});
|
|
|
|
/** function เรียกข้อมูลรอบการขึ้นเงินเดือน*/
|
|
async function getRound() {
|
|
showLoader();
|
|
isDisable.value = false;
|
|
await http
|
|
.get(
|
|
config.API.salaryPeriodActive(year.value.toString()) +
|
|
`?page=${page.value}&pageSize=${pageSize.value}&keyword=&year=0`
|
|
)
|
|
.then(async (res) => {
|
|
roundOptions.value = [];
|
|
roundFilter.value = [];
|
|
const data = res.data.result.data;
|
|
|
|
if (data.length !== 0) {
|
|
isDisable.value = true;
|
|
lastPage.value = Math.ceil(res.data.result.total / pageSize.value);
|
|
roundOptions.value = await data.map((x: DataRound) => ({
|
|
id: x.id,
|
|
revisionId: x.revisionId,
|
|
shortCode: x.period,
|
|
isClose: x.isClose,
|
|
year: x.year,
|
|
name:
|
|
x.period === "OCT"
|
|
? "รอบตุลาคม "
|
|
: x.period === "SPECIAL"
|
|
? "รอบพิเศษ "
|
|
: "รอบเมษายน ",
|
|
}));
|
|
|
|
roundFilter.value = await (roundOptions.value
|
|
? roundOptions.value[0]
|
|
: "");
|
|
|
|
store.roundMainCode = roundFilter.value.shortCode;
|
|
store.roundYear = roundFilter.value.year;
|
|
store.isClosedRound = roundFilter.value.isClose;
|
|
salaryPeriodId.value = roundFilter.value.id;
|
|
|
|
await getSnap(roundFilter.value.shortCode);
|
|
await getAgency(roundFilter.value.revisionId);
|
|
await getAgencyPosition(roundFilter.value.revisionId);
|
|
} else {
|
|
isLoad.value = false;
|
|
roundFilter.value = "ไม่มีข้อมูล";
|
|
snapFilter.value = "ไม่มีข้อมูล";
|
|
agencyFilter.value = "ไม่มีข้อมูล";
|
|
hideLoader();
|
|
}
|
|
})
|
|
.catch((e) => {
|
|
messageError($q, e);
|
|
hideLoader();
|
|
});
|
|
}
|
|
|
|
/**
|
|
* function เรียกรอบ
|
|
* @param code value รอบเงินเดือน
|
|
*/
|
|
async function getSnap(code: string) {
|
|
snapOptions.value =
|
|
code == "OCT"
|
|
? [
|
|
{
|
|
id: "SNAP1",
|
|
name: "1 กันยายน",
|
|
},
|
|
{
|
|
id: "SNAP2",
|
|
name: "1 ตุลาคม",
|
|
},
|
|
]
|
|
: code === "APR"
|
|
? [
|
|
{
|
|
id: "SNAP1",
|
|
name: "1 มีนาคม",
|
|
},
|
|
{
|
|
id: "SNAP2",
|
|
name: "1 เมษายน",
|
|
},
|
|
]
|
|
: [
|
|
{
|
|
id: "SNAP1",
|
|
name: "พิเศษ 1",
|
|
},
|
|
{
|
|
id: "SNAP2",
|
|
name: "พิเศษ 2",
|
|
},
|
|
];
|
|
snapFilter.value = snapOptions.value[0].id;
|
|
}
|
|
|
|
/**
|
|
* function เรียกข้อมูลหน่ยวงาน
|
|
* @param id revisionId
|
|
*/
|
|
async function getAgency(id: string) {
|
|
if (id) {
|
|
await http
|
|
.get(config.API.activeOrganizationRootById(id))
|
|
.then(async (res) => {
|
|
const data = res.data.result;
|
|
dataOrg.value = data;
|
|
agencyOptions.value = [];
|
|
agencyOptionsMain.value = [];
|
|
agencyOptionsMain.value = await [
|
|
{
|
|
id: "ALL",
|
|
name: "ทั้งหมด",
|
|
},
|
|
].concat(
|
|
data.map((x: DataAgency) => ({
|
|
id: x.id,
|
|
name: x.orgRootName,
|
|
}))
|
|
);
|
|
agencyOptions.value = agencyOptionsMain.value;
|
|
})
|
|
.catch((err) => {
|
|
messageError($q, err);
|
|
hideLoader();
|
|
});
|
|
} else {
|
|
agencyOptionsMain.value = [];
|
|
agencyFilter.value = "";
|
|
}
|
|
}
|
|
|
|
/**
|
|
* function เรียกข้อมูลหน่ยวงานปจุบัน
|
|
* @param id revisionId
|
|
*/
|
|
async function getAgencyPosition(id: string) {
|
|
if (id) {
|
|
await http
|
|
.get(config.API.keycloakPositionByid(id))
|
|
.then(async (res) => {
|
|
const data = await res.data.result;
|
|
store.rootId = data.rootId;
|
|
|
|
const position = agencyOptions.value?.find(
|
|
(e: DataOption) => e.id === data.rootId
|
|
);
|
|
|
|
agencyFilter.value = position ? position.id : "ALL";
|
|
isDeputy.value = position
|
|
? dataOrg.value.find((e) => e.id === position.id)?.isDeputy
|
|
: false;
|
|
|
|
if (agencyFilter.value && roundFilter.value.id && snapFilter.value) {
|
|
await fetchSalalyPeriod(
|
|
agencyFilter.value,
|
|
roundFilter.value.id,
|
|
snapFilter.value
|
|
);
|
|
}
|
|
})
|
|
.catch((err) => {
|
|
messageError($q, err);
|
|
hideLoader();
|
|
});
|
|
} else agencyFilter.value = "";
|
|
}
|
|
|
|
/**
|
|
*
|
|
* @param rootId id หน่วยงาน
|
|
* @param periodId id รอบการขึ้นเงินเดือน
|
|
* @param snap id รอบ
|
|
*/
|
|
async function fetchSalalyPeriod(
|
|
rootId: string,
|
|
periodId: string,
|
|
snap: string
|
|
) {
|
|
if (rootId) {
|
|
isLoad.value = false;
|
|
const body = {
|
|
rootId: rootId,
|
|
salaryPeriodId: periodId,
|
|
snapshot: snap,
|
|
};
|
|
|
|
await http
|
|
.post(config.API.salaryListPeriodLatest, body)
|
|
.then(async (res) => {
|
|
const data = await res.data.result;
|
|
|
|
if (roundFilter.value.shortCode !== "SPECIAL") {
|
|
if (Object.values(data).includes(null)) {
|
|
isLoad.value = false;
|
|
} else {
|
|
data && store.fetchPeriodLatest(data, store.tabGroup);
|
|
periodLatest.value = data;
|
|
isLoad.value = true;
|
|
}
|
|
} else {
|
|
data && store.fetchPeriodLatest(data, store.tabGroup);
|
|
periodLatest.value = data;
|
|
isLoad.value = true;
|
|
}
|
|
|
|
if (!data.group1id) {
|
|
hideLoader();
|
|
}
|
|
})
|
|
.catch((err) => {
|
|
messageError($q, err);
|
|
hideLoader();
|
|
});
|
|
}
|
|
}
|
|
|
|
/** function เปลี่ยนรอบการขั้นเงินเดือน*/
|
|
async function onChangeRound() {
|
|
// เก็บสถานะการปิดรอบในตัวแปร isClosedRound เพื่อใช้ในการเช็ค
|
|
store.isClosedRound = roundFilter.value.isClose;
|
|
salaryPeriodId.value = roundFilter.value.id;
|
|
if (roundFilter.value.shortCode === "SPECIAL") {
|
|
store.tabGroup = "group1";
|
|
}
|
|
getSnap(roundFilter.value.shortCode);
|
|
await getAgency(roundFilter.value.revisionId);
|
|
await getAgencyPosition(roundFilter.value.revisionId);
|
|
if (agencyFilter.value && roundFilter.value.id && snapFilter.value) {
|
|
store.tabType = "PENDING";
|
|
store.roundMainCode = roundFilter.value.shortCode;
|
|
store.roundYear = roundFilter.value.year;
|
|
} else {
|
|
isLoad.value = false;
|
|
}
|
|
}
|
|
|
|
/** function เปลี่ยนรอบ*/
|
|
async function onChangeSnap() {
|
|
if (agencyFilter.value && roundFilter.value.id && snapFilter.value) {
|
|
await fetchSalalyPeriod(
|
|
agencyFilter.value,
|
|
roundFilter.value.id,
|
|
snapFilter.value
|
|
);
|
|
}
|
|
}
|
|
|
|
/** function เปลี่ยนหน่วยงาน*/
|
|
async function onChangeAgency() {
|
|
store.rootId = agencyFilter.value;
|
|
isDeputy.value = dataOrg.value.find(
|
|
(e) => e.id === agencyFilter.value
|
|
)?.isDeputy;
|
|
if (
|
|
agencyFilter.value !== "ALL" &&
|
|
roundFilter.value.id &&
|
|
snapFilter.value
|
|
) {
|
|
await fetchSalalyPeriod(
|
|
agencyFilter.value,
|
|
roundFilter.value.id,
|
|
snapFilter.value
|
|
);
|
|
}
|
|
}
|
|
|
|
/** function fetch PeriodQuota*/
|
|
function getQuota() {
|
|
http
|
|
.get(config.API.salaryListPeriodQuota(store.groupId))
|
|
.then((res) => {
|
|
const data = res.data.result;
|
|
store.statusQuota = data.status;
|
|
})
|
|
.catch((e) => {
|
|
messageError($q, e);
|
|
hideLoader();
|
|
});
|
|
}
|
|
|
|
/**
|
|
* functioon ค้นหาข้อมูลรายการหน่วยงาน
|
|
* @param val คำค้นหา
|
|
* @param update function
|
|
* @param refData typeSelector
|
|
*/
|
|
function filterSelector(val: string, update: Function, refData: string) {
|
|
switch (refData) {
|
|
case "agencyFilter":
|
|
update(() => {
|
|
agencyOptions.value = agencyOptionsMain.value.filter(
|
|
(v: DataOption) => v.name.indexOf(val) > -1
|
|
);
|
|
});
|
|
|
|
default:
|
|
break;
|
|
}
|
|
}
|
|
|
|
async function fetchCheckisOfficer() {
|
|
http
|
|
.get(config.API.workflowKeycloakSystem(`SYS_SALARY_OFFICER`))
|
|
.then((res) => {
|
|
const data = res.data.result;
|
|
isOfficer.value = data.isOfficer;
|
|
isStaff.value = data.isStaff;
|
|
})
|
|
.catch((e) => {
|
|
messageError($q, e);
|
|
hideLoader();
|
|
});
|
|
}
|
|
|
|
function onClosePeriodSalalry() {
|
|
dialogConfirm(
|
|
$q,
|
|
async () => {
|
|
showLoader();
|
|
await http
|
|
.put(
|
|
config.API.salaryChangeIsclose +
|
|
`/${snapFilter.value}/${roundFilter.value.id}`,
|
|
{
|
|
isClose: true,
|
|
}
|
|
)
|
|
.then(async () => {
|
|
await fetchSalalyPeriod(
|
|
agencyFilter.value,
|
|
roundFilter.value.id,
|
|
snapFilter.value
|
|
);
|
|
success($q, "ปิดการแก้ไขสำเร็จ");
|
|
})
|
|
.catch((err) => {
|
|
messageError($q, err);
|
|
})
|
|
.finally(() => {
|
|
hideLoader();
|
|
});
|
|
},
|
|
"ปิดการแก้ไข",
|
|
"ต้องการปิดการแก้ไขรอบการขึ้นเงินเดือนนี้ใข่หรือไม่"
|
|
);
|
|
}
|
|
|
|
onMounted(async () => {
|
|
await Promise.all([getRound(), fetchCheckisOfficer()]);
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="row items-center">
|
|
<div class="toptitle text-dark row items-center q-py-xs">
|
|
รายการเลื่อนเงินเดือนข้าราชการฯ
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row items-center">
|
|
<q-space />
|
|
<div class="row q-col-gutter-sm items-center q-py-xs">
|
|
<div
|
|
v-if="
|
|
(((isOfficer || isStaff) && snapFilter === 'SNAP2') ||
|
|
roundFilter?.shortCode === 'SPECIAL') &&
|
|
periodLatest?.group1IsClose &&
|
|
checkPermissionList(['COMMAND']) &&
|
|
checkPermissionCreate('COMMAND')
|
|
"
|
|
>
|
|
<q-btn
|
|
flat
|
|
round
|
|
dense
|
|
color="primary"
|
|
icon="mdi-account-arrow-right"
|
|
@click.pervent="modalCommand = true"
|
|
>
|
|
<q-tooltip>ส่งไปออกคำสั่ง</q-tooltip>
|
|
</q-btn>
|
|
</div>
|
|
|
|
<div v-if="isOfficer && !periodLatest?.group1IsClose">
|
|
<q-btn
|
|
flat
|
|
round
|
|
dense
|
|
color="red"
|
|
icon="mdi-pencil-lock-outline"
|
|
@click.stop.prevent="onClosePeriodSalalry"
|
|
>
|
|
<q-tooltip>ปิดให้แก้ไข</q-tooltip>
|
|
</q-btn>
|
|
</div>
|
|
|
|
<datepicker
|
|
v-model="year"
|
|
:locale="'th'"
|
|
autoApply
|
|
year-picker
|
|
:enableTimePicker="false"
|
|
style="width: 150px"
|
|
@update:model-value="getRound()"
|
|
>
|
|
<template #year="{ year }">{{ year + 543 }}</template>
|
|
<template #year-overlay-value="{ value }">{{
|
|
parseInt(value + 543)
|
|
}}</template>
|
|
<template #trigger>
|
|
<q-input
|
|
dense
|
|
outlined
|
|
:model-value="Number(year) + 543"
|
|
:label="`${'ปีงบประมาณ'}`"
|
|
bg-color="white"
|
|
>
|
|
<template v-slot:prepend>
|
|
<q-icon
|
|
name="event"
|
|
class="cursor-pointer"
|
|
style="color: var(--q-primary)"
|
|
>
|
|
</q-icon>
|
|
</template>
|
|
</q-input>
|
|
</template>
|
|
</datepicker>
|
|
|
|
<q-select
|
|
v-model="roundFilter"
|
|
label="รอบการขึ้นเงินเดือน"
|
|
dense
|
|
outlined
|
|
map-options
|
|
option-label="name"
|
|
option-value="id"
|
|
:options="roundOptions"
|
|
lazy-rules
|
|
hide-bottom-space
|
|
bg-color="white"
|
|
@update:model-value="onChangeRound"
|
|
:disable="!isDisable"
|
|
>
|
|
<template v-slot:option="scope">
|
|
<q-item v-bind="scope.itemProps">
|
|
<q-item-section>
|
|
<q-item-label>{{ scope.opt.name }}</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
</template>
|
|
</q-select>
|
|
|
|
<q-select
|
|
v-if="roundFilter ? roundFilter.shortCode !== 'SPECIAL' : false"
|
|
v-model="snapFilter"
|
|
label="ราชชื่อรอบ"
|
|
dense
|
|
outlined
|
|
emit-value
|
|
map-options
|
|
option-label="name"
|
|
option-value="id"
|
|
:options="snapOptions"
|
|
lazy-rules
|
|
hide-bottom-space
|
|
bg-color="white"
|
|
@update:model-value="onChangeSnap"
|
|
:disable="!isDisable"
|
|
/>
|
|
|
|
<q-select
|
|
:readonly="checkPermission($route)?.attrOwnership === 'STAFF'"
|
|
v-model="agencyFilter"
|
|
label="หน่วยงาน"
|
|
lazy-rules
|
|
dense
|
|
outlined
|
|
emit-value
|
|
map-options
|
|
hide-selected
|
|
fill-input
|
|
option-label="name"
|
|
option-value="id"
|
|
:options="agencyOptions"
|
|
hide-bottom-space
|
|
bg-color="white"
|
|
@update:model-value="onChangeAgency"
|
|
:disable="!isDisable"
|
|
use-input
|
|
@filter="(inputValue:string,
|
|
doneFn:Function) => filterSelector(inputValue, doneFn,'agencyFilter'
|
|
) "
|
|
>
|
|
<template v-slot:no-option>
|
|
<q-item>
|
|
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
|
|
</q-item>
|
|
</template>
|
|
<template
|
|
v-if="
|
|
agencyFilter !== 'ALL' &&
|
|
checkPermission($route)?.attrOwnership === 'OWNER'
|
|
"
|
|
v-slot:append
|
|
>
|
|
<q-icon
|
|
name="cancel"
|
|
@click.stop.prevent="
|
|
(agencyOptions = agencyOptionsMain), (agencyFilter = 'ALL')
|
|
"
|
|
class="cursor-pointer"
|
|
/>
|
|
</template>
|
|
</q-select>
|
|
</div>
|
|
</div>
|
|
|
|
<q-card flat bordered>
|
|
<div v-if="agencyFilter !== 'ALL'">
|
|
<TabGroup
|
|
v-if="isLoad"
|
|
:period-latest="periodLatest"
|
|
:period-id="roundFilter.id"
|
|
:root-id="agencyFilter"
|
|
:round-filter="roundFilter"
|
|
:snap-shot="snapFilter"
|
|
:revision-id="roundFilter.revisionId"
|
|
/>
|
|
<q-card v-else class="q-pa-sm">
|
|
<div class="q-pa-sm">
|
|
<q-banner inline-actions rounded class="bg-grey-1 text-center">
|
|
ไม่มีข้อมูล
|
|
</q-banner>
|
|
</div>
|
|
</q-card>
|
|
</div>
|
|
<div v-else>
|
|
<PageDashBoard
|
|
:year="year"
|
|
:snap-shot="snapFilter"
|
|
:round-filter="roundFilter"
|
|
/>
|
|
</div>
|
|
</q-card>
|
|
|
|
<q-card
|
|
v-if="isLoad && !store.isClosedRound"
|
|
flat
|
|
bordered
|
|
class="row col-12 q-mt-xs"
|
|
>
|
|
<ProcessStep
|
|
v-if="agencyFilter !== 'ALL'"
|
|
:period-id="roundFilter.id"
|
|
:root-id="agencyFilter"
|
|
:get-data="getQuota"
|
|
:period-latest="periodLatest"
|
|
/>
|
|
</q-card>
|
|
|
|
<DialogCommand
|
|
v-model:modal="modalCommand"
|
|
v-model:root-id="agencyFilter"
|
|
v-model:is-officer="isOfficer"
|
|
v-model:is-staff="isStaff"
|
|
system-name="SALARY"
|
|
:command-type-code-array="['C-PM-33', 'C-PM-34', 'C-PM-35']"
|
|
:salary-period-id="salaryPeriodId"
|
|
:title-command="titleCommand"
|
|
:is-deputy="isDeputy"
|
|
/>
|
|
</template>
|
|
|
|
<style lang="sass" scoped>
|
|
.my-card
|
|
width: 100%
|
|
max-width: 200px
|
|
</style>
|