fix: ปรับโหลด ขอโอน อุทรณ์/ร้องทุกข์ ขอลาออก

This commit is contained in:
setthawutttty 2025-08-06 14:40:36 +07:00
parent 2050ac6b9e
commit 04184c0d70
8 changed files with 113 additions and 56 deletions

View file

@ -15,7 +15,7 @@ const $q = useQuasar();
const route = useRoute();
const router = useRouter();
const mixin = useCounterMixin();
const { success, messageError, showLoader, hideLoader, dialogConfirm } = mixin;
const { success, messageError, dialogConfirm ,showLoader,hideLoader} = mixin;
const id = ref<string>(
router.currentRoute.value.name === "addTransfer"
@ -23,6 +23,7 @@ const id = ref<string>(
: route.params.id.toString()
); //id path
const isLoading = ref<boolean>(false);
const files = ref<any>(); //
const tranferOrg = ref<string>(""); //
const noteReason = ref<string>(""); //
@ -42,7 +43,7 @@ async function saveData() {
/** ฟังก์ชั่นสร้างขอโอน */
async function createTransfer() {
showLoader();
showLoader()
const formData = new FormData();
formData.append("Organization", tranferOrg.value);
formData.append("Reason", noteReason.value);
@ -51,14 +52,14 @@ async function createTransfer() {
.post(config.API.listtransfer(), formData)
.then((res) => {
router.push(`/transfer/` + res.data.result);
hideLoader()
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
hideLoader()
})
.finally(() => {
hideLoader();
});
.finally(() => {});
}
/**
@ -66,7 +67,7 @@ async function createTransfer() {
* @param id ไอดของขอม
*/
async function fecthDataTransfer(id: string) {
showLoader();
isLoading.value = true;
await http
.get(config.API.transferByid(id))
.then((res: any) => {
@ -74,13 +75,13 @@ async function fecthDataTransfer(id: string) {
tranferOrg.value = data.organization;
noteReason.value = data.reason;
files.value = data.docs;
isLoading.value = false;
})
.catch((e: any) => {
messageError($q, e);
isLoading.value = false;
})
.finally(() => {
hideLoader();
});
.finally(() => {});
}
/**
@ -129,6 +130,7 @@ onMounted(() => {
<div class="row">
<div class="col-12 row q-col-gutter-sm">
<q-input
v-if="!isLoading"
:class="
routeName != 'addTransfer' ? 'col-12' : 'col-12 inputgreen'
"
@ -140,8 +142,11 @@ onMounted(() => {
:readonly="routeName != 'addTransfer'"
:rules="[(val:string) => !!val || `${'กรุณากรอกหน่วยงานที่ขอโอนไป'}`]"
/>
<div class="col-12" v-else>
<q-skeleton type="QInput" height="40px" />
</div>
<q-input
v-if="!isLoading"
:class="
routeName != 'addTransfer' ? 'col-12' : 'col-12 inputgreen'
"
@ -154,7 +159,9 @@ onMounted(() => {
:readonly="routeName != 'addTransfer'"
:rules="[(val:string) => !!val || `${'กรุณากรอกเหตุผล'}`]"
/>
<div class="col-12" v-else>
<q-skeleton type="QInput" height="120px" />
</div>
<div class="col-12 row" v-if="routeName == 'addTransfer'">
<q-file
v-model="files"

View file

@ -14,14 +14,15 @@ import type {
TransferMain,
} from "@/modules/02_transfer/interface/Main";
import SkeletonTable from "@/components/SkeletonTable.vue";
const $q = useQuasar();
const router = useRouter();
const mixin = useCounterMixin();
const transferData = useTransferDataStore();
const { statusText } = transferData;
const { date2Thai, messageError, showLoader, hideLoader, onSearchDataTable } =
mixin;
const { date2Thai, messageError, onSearchDataTable } = mixin;
const pagination = ref({
sortBy: "desc",
@ -30,6 +31,7 @@ const pagination = ref({
rowsPerPage: 10,
});
const isLoading = ref<boolean>(false);
const rows = ref<TransferMain[]>([]);
const rowsData = ref<TransferMain[]>([]);
const filter = ref<string>("");
@ -120,7 +122,7 @@ const columns = ref<QTableProps["columns"]>([
//
async function fecthListTransfer() {
showLoader();
isLoading.value = true;
await http
.get(config.API.listUserTransfer())
.then((res) => {
@ -139,12 +141,11 @@ async function fecthListTransfer() {
}));
rows.value = listData;
rowsData.value = listData;
isLoading.value = false;
})
.catch((e: any) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
isLoading.value = false;
});
}
@ -246,6 +247,7 @@ onMounted(async () => {
</div>
<div>
<d-table
v-if="!isLoading"
flat
bordered
dense
@ -339,6 +341,7 @@ onMounted(async () => {
</div>
</template>
</d-table>
<SkeletonTable v-else :columns="columns" />
</div>
</q-card>
</div>

View file

@ -1,6 +1,6 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { useQuasar } from "quasar";
import { is, useQuasar } from "quasar";
import type { QForm, QTableProps } from "quasar";
import { useRouter, useRoute } from "vue-router";
@ -20,6 +20,8 @@ import Dialog from "@/modules/03_retire/views/DialogRetire.vue";
import Header from "@/components/DialogHeader.vue";
import Workflow from "@/components/Workflow/Main.vue";
import SkeletonTable from "@/components/SkeletonTable.vue";
const $q = useQuasar();
const route = useRoute();
const router = useRouter();
@ -44,6 +46,7 @@ const id = ref<string>(
? route.params.id.toString()
: ""
); // id path
const isLoad = ref<boolean>(false);
const rowsApprover = ref<RowsType>();
const myform = ref<QForm | null>(null); //form
const tranferOrg = ref(""); //
@ -201,7 +204,7 @@ function cancelResing() {
* @param id ไอดของขอม
*/
async function fectDataresign(id: string) {
showLoader();
isLoad.value = true;
await http
.get(config.API.resingByidType(link.value, id))
.then((res) => {
@ -225,13 +228,12 @@ async function fectDataresign(id: string) {
};
files.value = data.docs;
dataDetail.value = data;
isLoad.value = false;
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
.finally(() => {});
}
/**
@ -318,6 +320,7 @@ onMounted(async () => {
<div class="col-12 row q-col-gutter-sm q-pa-md">
<q-input
v-if="!isLoad"
:class="
routeName !== 'AddRetire'
? 'col-md-9 col-xs-12'
@ -332,7 +335,9 @@ onMounted(async () => {
:readonly="routeName != 'AddRetire'"
:rules="[(val:string) => !!val || `${'กรุณากรอกสถานที่ยื่นขอลาออกจากราชการ'}`]"
/>
<div class="col-md-9 col-xs-12 inputgreen" v-else>
<q-skeleton type="QInput" height="40px" />
</div>
<!-- <datepicker
:class="
routeName !== 'AddRetire'
@ -383,6 +388,7 @@ onMounted(async () => {
</datepicker> -->
<datepicker
v-if="!isLoad"
:class="
routeName !== 'AddRetire'
? 'col-md-3 col-xs-12'
@ -428,7 +434,11 @@ onMounted(async () => {
</q-input>
</template>
</datepicker>
<div v-else class="col-md-3 col-xs-12">
<q-skeleton type="QInput" height="40px" />
</div>
<q-select
v-if="!isLoad"
v-model="noteReason"
:class="
routeName !== 'AddRetire' ? 'col-12' : 'col-12 inputgreen'
@ -448,6 +458,9 @@ onMounted(async () => {
]"
>
</q-select>
<div v-else class="col-12">
<q-skeleton type="QInput" height="40px" />
</div>
<q-input
:class="
routeName !== 'AddRetire' ? 'col-12' : 'col-12 inputgreen'
@ -595,6 +608,7 @@ onMounted(async () => {
<q-separator />
<div class="col-12 q-pa-sm">
<d-table
v-if="!isLoad"
ref="table"
:columns="columnsCommanders"
:rows="rowsApprover?.commanders ?? []"
@ -643,11 +657,11 @@ onMounted(async () => {
</q-tr>
</template>
</d-table>
<SkeletonTable v-else :columns="columnsCommanders" />
</div>
</q-card>
</div>
<!-- ผลการพจารณาของผอำนาจ -->
<div class="col-12 row" v-if="routeName != 'AddRetire'">
<q-card bordered class="row col-12 text-dark q-mt-sm">
<div
@ -662,7 +676,7 @@ onMounted(async () => {
<div class="col-12 row bg-white q-col-gutter-md">
<div class="col-xs-6 row items-start">
<div class="col-12 text-top"> - นามสก</div>
<div class="col-12 text-detail">
<div class="col-12 text-detail" v-if="!isLoad">
{{
rowsApprover &&
rowsApprover.approvers &&
@ -671,10 +685,11 @@ onMounted(async () => {
: "-"
}}
</div>
<q-skeleton v-else type="text" width="150px" />
</div>
<div class="col-xs-6 row items-start">
<div class="col-12 text-top">สถานะ</div>
<div class="col-12 text-detail">
<div v-if="!isLoad" class="col-12 text-detail">
{{
rowsApprover &&
rowsApprover.approvers &&
@ -685,12 +700,13 @@ onMounted(async () => {
: "-"
}}
</div>
<q-skeleton v-else type="text" width="150px" />
</div>
<div class="col-xs-6 row items-start">
<div class="col-12 text-top">
นสดทายทบย
</div>
<div class="col-12 text-detail">
<div v-if="!isLoad" class="col-12 text-detail">
{{
rowsApprover &&
rowsApprover.approvers &&
@ -701,12 +717,13 @@ onMounted(async () => {
: "-"
}}
</div>
<q-skeleton v-else type="text" width="150px" />
</div>
<div class="col-xs-12 row items-start">
<div class="col-12 text-top">
ความคดเหนและเหตผล
</div>
<div class="col-12 text-detail">
<div v-if="!isLoad" class="col-12 text-detail">
{{
rowsApprover &&
rowsApprover.approvers &&
@ -715,6 +732,7 @@ onMounted(async () => {
: "-"
}}
</div>
<q-skeleton v-else type="text" width="150px" />
</div>
</div>
</div>
@ -751,6 +769,7 @@ onMounted(async () => {
<q-separator />
<div class="col-12 q-pa-sm">
<d-table
v-if="!isLoad"
ref="table"
:columns="columnsCommanders"
:rows="rowsApprover?.cancelCommanders ?? []"
@ -799,11 +818,11 @@ onMounted(async () => {
</q-tr>
</template>
</d-table>
<SkeletonTable v-else :columns="columnsCommanders" />
</div>
</q-card>
</div>
<!-- ผลการพจารณาของผอำนาจ -->
<div class="col-12 row" v-if="routeName != 'AddRetire'">
<q-card bordered class="row col-12 text-dark q-mt-sm">
<div

View file

@ -15,16 +15,21 @@ import type {
MainListResponse,
} from "@/modules/03_retire/interface/Main";
import SkeletonTable from "@/components/SkeletonTable.vue";
const $q = useQuasar();
const router = useRouter();
const link = ref<string>("");
const dataStore = useDataStore();
const mixin = useCounterMixin();
const { date2Thai, messageError, showLoader, hideLoader } = mixin;
const { date2Thai, messageError, showLoader, hideLoader, onSearchDataTable } =
mixin;
const RestData = useRestDataStore();
const { statusText } = RestData; //Func status to text
const isLoad = ref<boolean>(false);
const rows = ref<MainList[]>([]);
const rowsData = ref<MainList[]>([]);
const filter = ref<string>("");
const pagination = ref({
sortBy: "desc",
@ -91,11 +96,12 @@ const columns = ref<QTableProps["columns"]>([
/** ดึงข้อมูล */
async function fectListleave() {
isLoad.value = true;
await http
.get(config.API.listUserByType(link.value))
.then(async (res) => {
let data = await res.data.result;
rows.value = data.map((e: MainListResponse) => ({
const list = data.map((e: MainListResponse) => ({
id: e.id,
placeLeave: e.location,
dateStartLeave: date2Thai(e.sendDate),
@ -103,9 +109,13 @@ async function fectListleave() {
status: e.status,
statustext: statusText(e.status),
}));
rowsData.value = list;
rows.value = list;
isLoad.value = false;
})
.catch((e: any) => {
messageError($q, e);
isLoad.value = false;
})
.finally(() => {});
}
@ -117,10 +127,13 @@ async function clickAdd() {
router.push(`/retire/add`);
}
/** ทำก่อน mounted */
onBeforeMount(() => {
showLoader();
});
function onSearch() {
rows.value = onSearchDataTable(
filter.value,
rowsData.value,
columns.value ? columns.value : []
);
}
/**
* เรยกฟงกนทงหมดตอนเรยกใชไฟล
@ -128,7 +141,6 @@ onBeforeMount(() => {
onMounted(async () => {
link.value = await dataStore.getProFileType();
await fectListleave();
hideLoader();
});
</script>
<template>
@ -161,15 +173,10 @@ onMounted(async () => {
debounce="300"
placeholder="ค้นหา"
style="max-width: 200px"
@keydown.enter.prevent="onSearch"
>
<template v-slot:append>
<q-icon v-if="filter == ''" name="search" />
<q-icon
v-if="filter !== ''"
name="clear"
class="cursor-pointer"
@click="filter = ''"
/>
<q-icon name="search" />
</template>
</q-input>
<!-- แสดงคอลมนใน table -->
@ -193,6 +200,7 @@ onMounted(async () => {
</div>
<div>
<d-table
v-if="!isLoad"
flat
bordered
dense
@ -272,6 +280,7 @@ onMounted(async () => {
</div>
</template>
</d-table>
<SkeletonTable v-else :columns="columns" />
</div>
</q-card>
</div>

View file

@ -21,6 +21,7 @@ const $q = useQuasar();
const mixin = useCounterMixin();
const storeData = useDataStore();
const isLoad = ref<boolean>(false)
const { findOrgName, success, messageError, showLoader, hideLoader } = mixin;
const formProfile = reactive<FormProfile>({
@ -34,15 +35,18 @@ const formProfile = reactive<FormProfile>({
/** ดึงข้อมูลจาก keycloak*/
async function getProFile() {
try {
showLoader();
isLoad.value = true
if (!storeData.dataprofilePosition) {
const res = await http.get(config.API.profilePosition());
await updateFormProfile(res.data.result);
isLoad.value = false
} else {
await updateFormProfile(storeData.dataprofilePosition);
isLoad.value = false
}
} catch (error) {
messageError($q, error);
isLoad.value = false
} finally {
hideLoader();
}
@ -113,7 +117,7 @@ onMounted(() => {
/>
เพมอทธรณ/องทกข
</div>
<Form :on-submit="onSubmit" :form-profile="formProfile" />
<Form :on-submit="onSubmit" :form-profile="formProfile" v-model:isLoad="isLoad"/>
</div>
</div>
</template>

View file

@ -22,6 +22,7 @@ const route = useRoute();
const mixin = useCounterMixin();
const { messageError, showLoader, hideLoader } = mixin;
const isLoad = ref<boolean>(false);
const id = ref<string>(route.params.id as string);
const historyStatusOb = reactive<HistoryStatusType>({
status: "",
@ -53,7 +54,7 @@ const data = reactive<EditDataList>({
/** ดึงข้อมูล */
function getData() {
showLoader();
isLoad.value = true;
http
.get(config.API.appealByID(id.value))
.then((res) => {
@ -73,13 +74,13 @@ function getData() {
data.disciplineComplaint_Appeal_Docs =
dataList.disciplineComplaint_Appeal_Docs;
data.historyStatus = dataList.historyStatus;
isLoad.value = false;
})
.catch((e) => {
messageError($q, e);
isLoad.value = false;
})
.finally(() => {
hideLoader();
});
.finally(() => {});
}
/** /
@ -122,7 +123,7 @@ onMounted(() => {
/>
แกไขอทธรณ/องทกข
</div>
<Form :data="data" :get-report="getReport" />
<Form :data="data" :get-report="getReport" v-model:is-load="isLoad"/>
</div>
</div>
</template>

View file

@ -17,6 +17,7 @@ const mixin = useCounterMixin();
const { dialogConfirm } = mixin;
const dataStore = useAppealComplainStore();
const isLoad = defineModel<boolean>("isLoad", { required: true });
const printForm = ref<string>("");
const isReadOnly = ref<boolean>(false);
const historyStatusOb = reactive<HistoryStatusType>({
@ -237,6 +238,7 @@ watch(
<div class="row q-col-gutter-sm">
<div class="col-xs-12 col-md-3">
<q-select
v-if="!isLoad"
:class="inputEdit(isReadOnly)"
:readonly="isReadOnly"
ref="typeRef"
@ -253,9 +255,11 @@ watch(
lazy-rules
hide-bottom-space
/>
<q-skeleton v-else type="QSelect" height="40px" />
</div>
<div class="col-xs-12 col-md-3">
<q-input
v-if="!isLoad"
:class="inputEdit(isReadOnly)"
:readonly="isReadOnly"
ref="titleRef"
@ -268,11 +272,13 @@ watch(
label="เรื่องอุทธรณ์/ร้องทุกข์"
hide-bottom-space
/>
<q-skeleton v-else type="QInput" height="40px" />
</div>
</div>
<div class="row">
<div class="col-12">
<q-input
v-if="!isLoad"
:class="inputEdit(isReadOnly)"
:readonly="isReadOnly"
ref="descriptionRef"
@ -287,11 +293,13 @@ watch(
rows="5"
hide-bottom-space
/>
<q-skeleton v-else type="QInput" height="120px" />
</div>
</div>
<div class="row" v-if="!isReadOnly">
<div class="col-12">
<q-file
v-if="!isLoad"
ref="fileRef"
v-model="formData.files"
label="อัปโหลดเอกสารหลักฐาน"
@ -301,6 +309,7 @@ watch(
hide-bottom-space
bg-color="white"
/>
<q-skeleton v-else type="QInput" height="40px" />
</div>
</div>
<q-card bordered class="col-12 row" v-if="isReadOnly">

View file

@ -13,6 +13,8 @@ import { useAppealComplainStore } from "@/modules/07_appealComplain/store";
import type { FormType } from "@/modules/07_appealComplain/interface/response/mainType";
import type { DataOption } from "@/modules/07_appealComplain/interface/index/main";
import SkeletonTable from "@/components/SkeletonTable.vue";
const $q = useQuasar();
const router = useRouter();
const mixin = useCounterMixin();
@ -25,6 +27,7 @@ const type = ref<DataOption[]>([
...dataStore.typeOptions,
]);
const isload = ref<boolean>(false);
const total = ref<number>(0);
const totalList = ref<number>(1);
const pagination = ref({
@ -154,7 +157,7 @@ const columns = ref<QTableProps["columns"]>([
//
async function getData() {
showLoader();
isload.value = true;
await http
.get(
config.API.appealMainList(
@ -166,20 +169,20 @@ async function getData() {
filterKeyword.value
)
)
.then((res) => {
.then(async (res) => {
totalList.value = Math.ceil(
res.data.result.total / pagination.value.rowsPerPage
);
total.value = res.data.result.total;
let data = res.data.result.data;
dataStore.fetchAppealComplain(data);
await dataStore.fetchAppealComplain(data);
isload.value = false;
})
.catch((e: any) => {
messageError($q, e);
isload.value = false;
})
.finally(() => {
hideLoader();
});
.finally(() => {});
}
/**
@ -374,7 +377,9 @@ onMounted(async () => {
/>
<div class="col-12">
<SkeletonTable v-if="isload" :columns="dataStore.columns" />
<d-table
v-else
flat
bordered
dense