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

บันทึกผล

Browse source
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-07-30 18:07:41 +07:00
parent 3531301713
commit c91843ceba
9 changed files with 918 additions and 170 deletions
Download patch file Download diff file Expand all files Collapse all files

67
src/modules/15_development/views/MainPage.vue
View file

@ -6,8 +6,6 @@ import genReportXLSX from "@/plugins/genreportxlsx";
import http from "@/plugins/http";
import config from "@/app.config";
import DialogHeader from "@/components/DialogHeader.vue";
/**importType*/
import type {
DataOption,
@ -22,12 +20,19 @@ import type {
DataTree,
} from "@/modules/15_development/interface/response/Main";
/**
* importComponents
*/
import DialogHeader from "@/components/DialogHeader.vue";
import { useDevelopmentDataStore } from "@/modules/15_development/store/developmentStore";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
/** use*/
const $q = useQuasar();
const router = useRouter();
const store = useDevelopmentDataStore();
const {
showLoader,
hideLoader,
@ -144,13 +149,17 @@ function onAdd() {
modal.value = true;
}
/** function fetchข้อมูลหน้าแรกใหม่*/
/**
* function fetchข้อมูลหน้าแรกใหม่
*/
function fetchListProjectNew() {
formQuery.page = 1;
fetchListProject();
}
/** function Download รายการโครงการ*/
/**
* function Download รายการโครงการ
*/
function onDownload() {
showLoader();
http
@ -170,7 +179,9 @@ function onDownload() {
});
}
/** function ปิด Dialog เพิ่มโครงการ/หลักสูตรการฝึกอบรม*/
/**
* function ปิด Dialog เพิ่มโครงการ/หลักสูตรการฝึกอบรม
*/
function closeDialog() {
modal.value = false;
formProject.year = null;
@ -179,12 +190,14 @@ function closeDialog() {
formProject.nodeId = "";
}
/** dialog submit */
async function onSubmit() {
/**
* dialog submit
*/
function onSubmit() {
if (formProject.nodeId) {
dialogConfirm($q, async () => {
await showLoader();
await http
showLoader();
http
.post(config.API.developmentMain, formProject)
.then(async (res) => {
await closeDialog();
@ -235,14 +248,18 @@ function fetchTree(id: string) {
});
}
/** function เลือกหน่วยงานที่รับผิดชอบ*/
/**
* function เลือกหน่วยงานที่รับผิดชอบ
*/
function updateSelected(data: DataTree) {
formProject.node = data.orgLevel;
formProject.nodeId = data.orgTreeId;
formProject.orgRevisionId = data.orgRevisionId;
}
/** function เลือกหน่วยงานที่จะค้นหาโครงการ */
/**
* function เลือกหน่วยงานที่จะค้นหาโครงกา
*/
function updateSelectedTreeMain(data: DataTree) {
if (formQuery.node === data.orgLevel && formQuery.nodeId === data.orgTreeId) {
formQuery.node = null;
@ -263,6 +280,14 @@ function updatePagination(newPagination: NewPagination) {
formQuery.pageSize = newPagination.rowsPerPage;
}
/**
* function redirect หน้าบันทึกผล
* @param id โครงการ
*/
function onRedirectToRecordPage(id: string) {
router.push(`/development/record/${id}`);
}
/** callbackFunction ทำเมื่อมีการอัปเดท pageSize*/
watch(
() => formQuery.pageSize,
@ -274,6 +299,7 @@ watch(
/** ดึงข้อมูลเมื่อโหลดหน้าเสร็จสิ้น */
onMounted(() => {
fetchActive();
formQuery.status = store.projectStatus;
});
</script>
@ -282,6 +308,7 @@ onMounted(() => {
รายการโครงการ/หลักสูตรการฝึกอบรมที่หน่วยงานของกรุงเทพมหานครเป็นผู้จัด
</div>
<q-card bordered class="col-12 row caedNone">
<!-- หน่วยงาน/ส่วนราชการ -->
<div class="col-xs-12 col-sm-3 row">
<div class="col-12 row no-wrap">
<div class="col-12 q-py-sm q-px-sm">
@ -342,6 +369,8 @@ onMounted(() => {
</div>
</div>
</div>
<!-- รายการโครงการ -->
<div class="col-xs-12 col-sm-9 q-pa-md row">
<div class="col-12">
<q-toolbar class="row col-8 q-pa-none q-gutter-x-sm" style="padding: 0">
@ -479,6 +508,7 @@ onMounted(() => {
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-if="formQuery.status === 'FINISH'" auto-width />
<q-th v-for="col in props.cols" :key="col.name" :props="props">
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
@ -486,11 +516,23 @@ onMounted(() => {
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td v-if="formQuery.status === 'FINISH'">
<q-btn
flat
round
color="public"
icon="mdi-content-save-edit-outline"
size="12px"
@click.pervent="onRedirectToRecordPage(props.row.id)"
>
<q-tooltip>บันทึกผล</q-tooltip></q-btn
>
</q-td>
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="onClickAddOrView(true, props.row.id)"
@click.pervent="onClickAddOrView(true, props.row.id)"
>
<div class="table_ellipsis">
{{ col.value ? col.value : "-" }}
@ -518,6 +560,7 @@ onMounted(() => {
</div>
</q-card>
<!-- Popup เพิ่มโครงการ/หลักสูตรการฝึกอบรม -->
<q-dialog persistent v-model="modal">
<q-card flat bordered style="min-width: 60vw">
<q-form greedy @submit.prevent @validation-success="onSubmit()">

262
src/modules/15_development/views/RecordPage.vue Normal file
View file

@ -0,0 +1,262 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { useQuasar } from "quasar";
import { useRouter, useRoute } from "vue-router";
import http from "@/plugins/http";
import config from "@/app.config";
import env from "@/api/index";
/**
* importComponents
*/
import Record from "@/modules/15_development/components/Record.vue"; // บันทึกผล
import DialogRecordPerson from "@/modules/15_development/components/DialogRecordPerson.vue";
import type { ResRecord } from "@/modules/15_development/interface/response/Main";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useDevelopmentDataStore } from "@/modules/15_development/store/developmentStore";
/**
* use
*/
const $q = useQuasar();
const router = useRouter();
const route = useRoute();
const store = useDevelopmentDataStore();
const { showLoader, hideLoader, messageError, dialogConfirm, success } =
useCounterMixin();
/**
* ตัวแปร
*/
const projectId = ref<string>(route.params.id.toLocaleString());
const tab = ref<string>("IN");
const title = ref<string>("");
const isLoadPage = ref<boolean>(false);
const files = ref<any>(null);
const listPerson = ref<ResRecord[]>([]);
const modalAddPerson = ref<boolean>(false);
/**
* function fetch ข้อมูลเบื้องต้น
* @param id ProjectId
*/
function fetchData(id: string) {
showLoader();
http
.get(config.API.developmentMainTab("tab1", id))
.then(async (res) => {
title.value = res.data.result.projectName;
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
/**
* function เรียกข้อมูลรายชื่อทั้งหมด
*/
function fetchDataProject() {
isLoadPage.value = false;
showLoader();
http
.get(config.API.developmentMainTab("tab6", projectId.value))
.then(async (res) => {
listPerson.value = await res.data.result;
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
isLoadPage.value = true;
});
}
/**
* function อัปโหลดไฟล์
* @param file ไฟล์
*/
function clickUpload(file: any) {
dialogConfirm(
$q,
async () => {
showLoader();
const selectedFile = file;
const formData = new FormData();
formData.append("file", selectedFile);
await http
.post(config.API.developmentMainTab("tab6", projectId.value), formData)
.then(async () => {
await fetchDataProject();
await success($q, "อัปโหลดไฟล์สำเร็จ");
files.value = null;
})
.catch((err) => {
messageError($q, err);
showLoader();
});
},
"ยืนยันการอัปโหลดไฟล์",
"ต้องการยืนยันการอัปโหลดไฟล์นี้หรือไม่ ?"
);
}
/**
* function ส่งไปบันทึกที่ทะเบียนประวัติ
*/
function sendRecordRegistry() {
dialogConfirm(
$q,
() => {
showLoader();
http
.get(config.API.developmentMainTab("tab6/done", projectId.value))
.then(async () => {
await fetchDataProject();
await success($q, "ส่งข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
hideLoader();
});
},
"ยืนยันการส่งข้อมูลไปบันทึกยังทะเบียนประวัติ",
"ต้องการยืนยันการส่งข้อมูลไปบันทึกยังทะเบียนประวัติหรือไม่"
);
}
/**
* function ดาวน์โหลดไฟล์ต้นแบบ
*/
function downloadFile() {
const link = document.createElement("a");
link.href = `${window.location.protocol}//${window.location.host}/default-บันทึกผล.xlsx`;
link.download = "default-บันทึกผล.xlsx";
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
onMounted(() => {
fetchDataProject();
fetchData(projectId.value);
store.projectStatus = "FINISH";
});
</script>
<template>
<div class="toptitle text-dark col-12 row items-center">
<q-btn
flat
round
dense
class="q-mr-sm"
icon="mdi-arrow-left"
color="primary"
@click="router.go(-1)"
/>
{{ `บันทึกผล${title}` }}
</div>
<q-card flat bordered>
<q-toolbar class="q-pa-md">
<q-file
v-model="files"
dense
label="อัปโหลดไฟล์"
outlined
accept=".xlsx"
hide-bottom-space
clearable
class="col-xs-12 col-sm-4"
>
<template v-slot:prepend>
<q-icon name="attach_file" color="blue" />
</template>
</q-file>
<q-btn
v-if="files"
size="md"
icon="mdi-upload"
round
flat
color="blue"
@click="clickUpload(files)"
>
<q-tooltip>อัปโหลดไฟล์</q-tooltip>
</q-btn>
<q-btn
size="md"
icon="mdi-download"
round
flat
color="green"
@click="downloadFile"
>
<q-tooltip>ดาวน์โหลดไฟล์ต้นแบบ</q-tooltip>
</q-btn>
<q-btn
v-if="listPerson.length > 0"
size="md"
icon="mdi-clipboard-account-outline"
round
flat
color="public"
@click="sendRecordRegistry()"
>
<q-tooltip>ส่งไปบันทึกที่ทะเบียนประวัติ</q-tooltip>
</q-btn>
<q-space />
<q-btn
flat
round
dense
icon="add"
color="primary"
@click="modalAddPerson = true"
>
<q-tooltip>เพิ่ม</q-tooltip>
</q-btn>
</q-toolbar>
</q-card>
<q-card flat bordered class="q-mt-sm">
<q-tabs
v-model="tab"
dense
align="left"
inline-label
class="rounded-borders"
indicator-color="primary"
active-bg-color="teal-1"
active-class="text-primary"
>
<q-tab name="IN" label="รายชื่อที่อยู่ในทะเบียนประวัติ" />
<q-tab name="OUT" label="รายชื่อบุคคลภายนอก" />
</q-tabs>
<q-separator />
<div class="q-pa-sm" style="padding: 0px" v-if="isLoadPage">
<q-tab-panels v-model="tab" animated>
<q-tab-panel name="IN">
<Record :isProfile="true" :listPerson="listPerson" />
</q-tab-panel>
<q-tab-panel name="OUT">
<Record :isProfile="false" :listPerson="listPerson" />
</q-tab-panel>
</q-tab-panels>
</div>
</q-card>
<DialogRecordPerson
v-model:modal="modalAddPerson"
v-model:tab="tab"
:fetchData="fetchDataProject"
/>
</template>
<style scoped></style>