รายการเลื่อนเงินเดือนข้าราชการ ฯ => ปรับ API Report

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-07-05 11:59:12 +07:00
parent 0c3cd367c3
commit cee77d4ac6
4 changed files with 196 additions and 209 deletions

View file

@ -1,4 +1,3 @@
divdivdivdivdivdivdiv
<script setup lang="ts">
import { ref, reactive, onMounted } from "vue";
import { QForm, useQuasar } from "quasar";
@ -273,6 +272,7 @@ onMounted(() => {
</script>
<template>
<q-card>
<q-form @submit.prevent greedy @validation-success="onSubmit()">
<q-card-section>

View file

@ -49,6 +49,7 @@ const filterMain = ref<string>("");
const visibleColumns = ref<string[]>(["including", "includingName"]);
const roundOp = ref<DataOption[]>([
{ id: "", name: "ทั้งหมด" },
{ id: "APR", name: "รอบเมษายน" },
{ id: "OCT", name: "รอบตุลาคม" },
]);
@ -66,29 +67,31 @@ const nodeData = reactive<any>({
});
function fetchList() {
showLoader();
http
.post(config.API.kpiPlan + `/search`, {
isAll: isAll.value,
keyword: nodeData.keyword,
node: nodeData.node ? nodeData.node : 0,
nodeId: nodeData.nodeId,
period: nodeData.round,
year: year.value?.toString(),
pageSize: nodeData.pageSize,
page: nodeData.page,
})
.then((res) => {
const data = res.data.result.data;
totalList.value = Math.ceil(res.data.result.total / nodeData.pageSize);
rows.value = data;
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
if (nodeData.nodeId) {
showLoader();
http
.post(config.API.kpiPlan + `/search`, {
isAll: isAll.value,
keyword: nodeData.keyword,
node: nodeData.node ? nodeData.node : 0,
nodeId: nodeData.nodeId,
period: nodeData.round,
year: year.value?.toString(),
pageSize: nodeData.pageSize,
page: nodeData.page,
})
.then((res) => {
const data = res.data.result.data;
totalList.value = Math.ceil(res.data.result.total / nodeData.pageSize);
rows.value = data;
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
}
function onClickAddOrView(status: boolean = false, id: string = "") {
@ -187,9 +190,8 @@ function onClickHistory(id: string) {
});
}
onMounted(async () => {
await fetchActive();
// await fetchList();
onMounted(() => {
fetchActive();
});
</script>

View file

@ -25,24 +25,14 @@ const router = useRouter();
const { showLoader, hideLoader, dialogRemove, success, messageError } =
useCounterMixin();
const positionOp = ref<DataOption[]>([]);
const positionMainOp = ref<DataOption[]>([]);
const positionOp = ref<DataOption[]>([{ id: "", name: "ทั้งหมด" }]);
const positionMainOp = ref<DataOption[]>([{ id: "", name: "ทั้งหมด" }]);
const maxPage = ref<number>(1);
const totalList = ref<number>(1); //
/** หัวตาราง */
const rows = ref<any>([]);
const columns = ref<QTableProps["columns"]>([
// {
// name: "no",
// align: "left",
// label: " ",
// sortable: true,
// field: "no",
// headerStyle: "font-size: 14px",
// style: "font-size: 14px",
// },
{
name: "including",
align: "left",
@ -79,6 +69,7 @@ const pagination = ref({
/** Option รอบการประเมิน*/
const roundOp = ref<DataOption[]>([
{ id: "", name: "ทั้งหมด" },
{ id: "APR", name: "รอบเมษายน" },
{ id: "OCT", name: "รอบตุลาคม" },
]);
@ -173,6 +164,7 @@ function getOptions() {
.then((res) => {
const dataOp = res.data.result;
const uniqueNames = new Set();
const filteredData = dataOp
.filter((item: any) => {
if (!uniqueNames.has(item.positionName)) {
@ -186,7 +178,8 @@ function getOptions() {
name: item.positionName,
}));
positionMainOp.value = filteredData;
positionMainOp.value.push(...filteredData);
positionOp.value.push(...filteredData);
})
.catch((err) => {
messageError($q, err);
@ -196,19 +189,6 @@ function getOptions() {
});
}
function statusTothai(val: string) {
switch (val) {
case "SPECIAL":
return "รอบพิเศษ";
case "APR":
return "รอบเมษายน";
case "OCT":
return "รอบตุลาคม";
default:
return "-";
}
}
function setModel(val: string) {
formFilter.position = val;
}
@ -245,160 +225,158 @@ onMounted(async () => {
รายการตวชดตามตำแหน
</div>
<q-card flat bordered class="q-pa-md">
<div class="row q-gutter-sm no-wrap q-mb-sm">
<q-select
dense
v-model="formFilter.position"
label="ตำแหน่ง"
outlined
emit-value
map-options
fill-input
hide-selected
hide-bottom-space
option-label="name"
option-value="id"
:options="positionOp"
use-input
@filter="(inputValue:any,doneFn:Function) => filterOption(inputValue, doneFn) "
@update:model-value="(formFilter.page = 1), fetchList()"
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey"> ไมอม </q-item-section>
</q-item>
</template>
<template v-if="formFilter.position !== ''" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
(formFilter.position = ''), (formFilter.page = 1), fetchList()
"
class="cursor-pointer"
/>
</template>
</q-select>
<div class="row q-gutter-sm no-wrap q-mb-sm">
<q-select
dense
:model-value="formFilter.position"
label="ตำแหน่ง"
outlined
emit-value
map-options
fill-input
hide-selected
hide-bottom-space
option-label="name"
option-value="id"
:options="positionOp"
use-input
@input-value="setModel"
@filter="(inputValue:any,doneFn:Function) => filterOption(inputValue, doneFn) "
@update:model-value="fetchList"
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey"> ไมอม </q-item-section>
</q-item>
</template>
<template v-if="formFilter.position" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
formFilter.position = '';
fetchList();
"
class="cursor-pointer"
/>
</template>
</q-select>
<datepicker
style="width: 150px"
menu-class-name="modalfix"
v-model="formFilter.year"
:locale="'th'"
autoApply
year-picker
:enableTimePicker="false"
@update:model-value="(formFilter.page = 1), fetchList()"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
outlined
:model-value="
formFilter.year === null
? 'ทั้งหมด'
: Number(formFilter.year) + 543
"
:label="`${'ปีงบประมาณ'}`"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
<template v-if="formFilter.year" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
(formFilter.year = null), (formFilter.page = 1), fetchList()
"
class="cursor-pointer"
/>
</template>
</q-input>
</template>
</datepicker>
<datepicker
style="width: 150px"
menu-class-name="modalfix"
v-model="formFilter.year"
:locale="'th'"
autoApply
year-picker
:enableTimePicker="false"
@update:model-value="(formFilter.page = 1), fetchList()"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
outlined
:model-value="
formFilter.year === null
? 'ทั้งหมด'
: Number(formFilter.year) + 543
"
:label="`${'ปีงบประมาณ'}`"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
<template v-if="formFilter.year" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
(formFilter.year = null), (formFilter.page = 1), fetchList()
"
class="cursor-pointer"
/>
</template>
</q-input>
</template>
</datepicker>
<q-select
dense
outlined
v-model="formFilter.round"
:options="roundOp"
label="รอบการประเมิน"
option-label="name"
option-value="id"
emit-value
map-options
@update:model-value="(formFilter.page = 1), fetchList()"
style="width: 160px"
>
<template v-if="formFilter.round !== ''" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
(formFilter.round = ''), (formFilter.page = 1), fetchList()
"
class="cursor-pointer"
/>
</template>
</q-select>
<q-select
dense
outlined
v-model="formFilter.round"
:options="roundOp"
label="รอบการประเมิน"
option-label="name"
option-value="id"
emit-value
map-options
@update:model-value="fetchList"
style="width: 160px"
>
<template v-if="formFilter.round" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="(formFilter.round = ''), fetchList()"
class="cursor-pointer"
/>
</template>
</q-select>
<q-btn
flat
round
dense
icon="add"
color="primary"
@click="onClickAddOrView()"
>
<q-tooltip>เพ</q-tooltip>
</q-btn>
<q-btn
flat
round
dense
icon="add"
color="primary"
@click="onClickAddOrView()"
>
<q-tooltip>เพ</q-tooltip>
</q-btn>
<q-space />
<q-input
standout
dense
v-model="formFilter.keyword"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
@keyup.enter="fetchList()"
>
<template v-slot:append>
<q-icon v-if="formFilter.keyword == ''" name="search" />
<q-icon
v-if="formFilter.keyword !== ''"
name="clear"
class="cursor-pointer"
@click="formFilter.keyword = ''"
/>
</template>
</q-input>
<q-select
v-model="visibleColumns"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columns"
option-value="name"
options-cover
style="min-width: 150px"
/>
</div>
<q-space />
<q-input
standout
dense
v-model="formFilter.keyword"
ref="filterRef"
outlined
debounce="300"
placeholder="ค้นหา"
@keyup.enter="(formFilter.page = 1), fetchList()"
>
<template v-slot:append>
<q-icon v-if="formFilter.keyword == ''" name="search" />
<q-icon
v-if="formFilter.keyword !== ''"
name="clear"
class="cursor-pointer"
@click="formFilter.keyword = ''"
/>
</template>
</q-input>
<q-select
v-model="visibleColumns"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columns"
option-value="name"
options-cover
style="min-width: 150px"
/>
</div>
<div class="col-12">
<d-table

View file

@ -332,14 +332,21 @@ function onClickDownload(data: DataOption) {
});
} else {
if (props.rootId && props.periodId) {
const url = config.API.salaryReportListsByid(
data.id,
props.rootId,
props.periodId
);
const isGovernmentId =
data.id === "gov-01" ||
data.id === "gov-04" ||
data.id === "gov-05" ||
data.id === "gov-07";
const finalUrl = isGovernmentId ? `${url}/${store.tabGroup}` : url;
http
.get(
config.API.salaryReportListsByid(
data.id,
props.rootId,
props.periodId
)
)
.get(finalUrl)
.then((res) => {
const dataList = res.data.result;
genReportXLSX(dataList, data.name);