Merge branch 'develop' into devTee
This commit is contained in:
setthawutttty
commit
64af4fec67
26 changed files with 681 additions and 353 deletions
|
|
@ -1,4 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
/** props*/
|
||||
const props = defineProps({
|
||||
editvisible: Boolean,
|
||||
modalEdit: Boolean,
|
||||
|
|
@ -32,6 +33,8 @@ const edit = async () => {
|
|||
updateEdit(!props.editvisible);
|
||||
props.edit();
|
||||
};
|
||||
|
||||
/* บันทึกข้อมูล**/
|
||||
const checkSave = () => {
|
||||
props.validate();
|
||||
props.save();
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
/** props*/
|
||||
const props = defineProps({
|
||||
title: String,
|
||||
close: {
|
||||
|
|
@ -6,6 +7,10 @@ const props = defineProps({
|
|||
default: () => console.log("not function"),
|
||||
},
|
||||
});
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่น close
|
||||
*/
|
||||
const close = async () => {
|
||||
props.close();
|
||||
};
|
||||
|
|
|
|||
|
|
@ -11,11 +11,12 @@ import http from "@/plugins/http";
|
|||
import config from "@/app.config";
|
||||
import type { ResponseData } from "@/modules/06_retirement/interface/response/expulsion";
|
||||
|
||||
/** use */
|
||||
const $q = useQuasar();
|
||||
const router = useRouter();
|
||||
const modal = ref<boolean>(false);
|
||||
const mixin = useCounterMixin();
|
||||
const retirementStore = useRetirementDataStore();
|
||||
|
||||
const {
|
||||
date2Thai,
|
||||
messageError,
|
||||
|
|
@ -26,7 +27,7 @@ const {
|
|||
} = mixin;
|
||||
const { statusText } = retirementStore;
|
||||
|
||||
const modal = ref<boolean>(false);
|
||||
/** คอลัมน์ที่แสดง */
|
||||
const visibleColumns = ref<string[]>([
|
||||
"no",
|
||||
"fullname",
|
||||
|
|
@ -46,6 +47,7 @@ const resetFilter = () => {
|
|||
filterRef.value.focus();
|
||||
};
|
||||
|
||||
/** คอลัมน์ */
|
||||
const rows = ref<ResponseData[]>([]);
|
||||
const rows2 = ref<ResponseData[]>([]);
|
||||
const filters = ref<ResponseData[]>([]);
|
||||
|
|
@ -115,10 +117,14 @@ const columns = ref<QTableProps["columns"]>([
|
|||
},
|
||||
]);
|
||||
|
||||
/** HOOK */
|
||||
onMounted(async () => {
|
||||
await getData();
|
||||
});
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่น modal
|
||||
*/
|
||||
const openModalOrder = () => {
|
||||
openModal();
|
||||
const row = filters.value.filter(
|
||||
|
|
@ -136,7 +142,12 @@ const openModalOrder = () => {
|
|||
);
|
||||
rows2.value = row;
|
||||
};
|
||||
const openModal = () => (modal.value = true);
|
||||
const closeModal = () => (modal.value = false);
|
||||
|
||||
/**
|
||||
* นำข้อมูลมาจาก API
|
||||
*/
|
||||
const getData = async () => {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -179,6 +190,10 @@ const getData = async () => {
|
|||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* ลบข้อมูล
|
||||
* @param id ไอดีข้อมูล
|
||||
*/
|
||||
const clickDelete = async (id: string) => {
|
||||
dialogRemove(
|
||||
$q,
|
||||
|
|
@ -189,7 +204,7 @@ const clickDelete = async (id: string) => {
|
|||
`ต้องการทำการลบข้อมูลนี้ใช่หรือไม่?`
|
||||
);
|
||||
};
|
||||
|
||||
//ลบข้อมูลจากAPI
|
||||
const deleteData = async (id: string) => {
|
||||
await http
|
||||
.delete(config.API.expulsionByid(id))
|
||||
|
|
@ -205,8 +220,7 @@ const deleteData = async (id: string) => {
|
|||
});
|
||||
};
|
||||
|
||||
const openModal = () => (modal.value = true);
|
||||
const closeModal = () => (modal.value = false);
|
||||
/** Setting Pagination */
|
||||
const pagination = ref({
|
||||
sortBy: "createdAt",
|
||||
descending: true,
|
||||
|
|
|
|||
|
|
@ -4,19 +4,18 @@ import { useQuasar } from "quasar";
|
|||
import { useRoute, useRouter } from "vue-router";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import CurrencyInput from "@/components/CurruncyInput.vue";
|
||||
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import keycloak from "@/plugins/keycloak";
|
||||
|
||||
/**Import Type */
|
||||
import type { QForm } from "quasar";
|
||||
import type { ResponseDataDetail } from "@/modules/06_retirement/interface/response/expulsion";
|
||||
|
||||
/** Use */
|
||||
const $q = useQuasar();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const mixin = useCounterMixin();
|
||||
|
||||
const dataId = route.params.id.toString();
|
||||
const {
|
||||
date2Thai,
|
||||
|
|
@ -27,10 +26,10 @@ const {
|
|||
dialogConfirm,
|
||||
} = mixin;
|
||||
|
||||
/**ตัวแปร */
|
||||
const myForm = ref<QForm | null>(null);
|
||||
const roleAdmin = ref<boolean>(false);
|
||||
const edit = ref<boolean>(false);
|
||||
|
||||
const organizationPositionOld = ref<string>("");
|
||||
const positionTypeOld = ref<string>("");
|
||||
const positionLevelOld = ref<string>("");
|
||||
|
|
@ -40,6 +39,7 @@ const organization = ref<string>("");
|
|||
const date = ref<Date | null>(null);
|
||||
const reason = ref<string>("");
|
||||
|
||||
/**Setค่าตัวแปร */
|
||||
const responseData = ref<ResponseDataDetail>({
|
||||
personId: "",
|
||||
avataPath: "",
|
||||
|
|
@ -57,6 +57,7 @@ const responseData = ref<ResponseDataDetail>({
|
|||
fullname: "",
|
||||
});
|
||||
|
||||
/**Hook */
|
||||
onMounted(async () => {
|
||||
if (keycloak.tokenParsed != null) {
|
||||
roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
|
||||
|
|
@ -64,6 +65,9 @@ onMounted(async () => {
|
|||
await getData();
|
||||
});
|
||||
|
||||
/**
|
||||
* นำข้อมูลมาจาก API
|
||||
*/
|
||||
const getData = async () => {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -108,11 +112,15 @@ const getData = async () => {
|
|||
});
|
||||
};
|
||||
|
||||
/**ฟังก์ชั่นcancel */
|
||||
const clickCancel = async () => {
|
||||
await getData();
|
||||
edit.value = false;
|
||||
};
|
||||
|
||||
/**
|
||||
* Functionบันทึก
|
||||
*/
|
||||
const conditionSave = async () => {
|
||||
if (myForm.value !== null) {
|
||||
myForm.value.validate().then((success) => {
|
||||
|
|
@ -129,7 +137,7 @@ const conditionSave = async () => {
|
|||
});
|
||||
}
|
||||
};
|
||||
|
||||
//Save จาก Api
|
||||
const saveData = async () => {
|
||||
const body = {
|
||||
organization: organization.value,
|
||||
|
|
@ -157,6 +165,10 @@ const saveData = async () => {
|
|||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Function เพิ่ม Class เวลา Edit
|
||||
* @param val เมื่อเป็นEdit จะเปลี่ยน Class
|
||||
*/
|
||||
const getClass = (val: boolean) => {
|
||||
return {
|
||||
"full-width inputgreen cursor-pointer": val,
|
||||
|
|
|
|||
|
|
@ -6,12 +6,14 @@ import { useCounterMixin } from "@/stores/mixin";
|
|||
import { useQuasar } from "quasar";
|
||||
import { useRoute } from "vue-router";
|
||||
|
||||
/** Use */
|
||||
const $q = useQuasar(); //ใช้ noti quasar
|
||||
const mixin = useCounterMixin();
|
||||
const { messageError, success, showLoader, hideLoader, dialogConfirm } = mixin;
|
||||
const route = useRoute();
|
||||
|
||||
const retireld_params = route.params.id;
|
||||
|
||||
/** props*/
|
||||
const props = defineProps({
|
||||
retireld: String,
|
||||
profileId: String,
|
||||
|
|
@ -27,6 +29,7 @@ const retireld = ref<any>();
|
|||
const type = ref<any>();
|
||||
const filter = ref<string>("");
|
||||
|
||||
/** คอลัมน์ */
|
||||
const columns = ref<any["columns"]>([
|
||||
{
|
||||
name: "index",
|
||||
|
|
@ -78,6 +81,7 @@ watch(modal, () => {
|
|||
fecthlistRetire();
|
||||
}
|
||||
});
|
||||
|
||||
// fecth profile
|
||||
const fecthlistRetire = async () => {
|
||||
showLoader();
|
||||
|
|
@ -93,6 +97,7 @@ const fecthlistRetire = async () => {
|
|||
messageError($q, e);
|
||||
});
|
||||
};
|
||||
|
||||
// เรียกรายชื่อประกาศเกษียณอายุราชการเพิ่ม
|
||||
const findlist = async (id: string) => {
|
||||
let data = [{}];
|
||||
|
|
@ -154,6 +159,9 @@ const updateListData = (retireld: string, pId: string) => {
|
|||
props.UpdateListId(retireld, pId);
|
||||
};
|
||||
|
||||
/**
|
||||
* Setiting Pagination
|
||||
*/
|
||||
const paging = ref<boolean>(true);
|
||||
const pagination = ref({
|
||||
sortBy: "fullname",
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ import config from "@/app.config";
|
|||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
import DialogPopupReason from "@/components/Dialogs/PopupReason.vue";
|
||||
|
||||
/** Use */
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const $q = useQuasar();
|
||||
|
|
@ -26,6 +27,7 @@ const {
|
|||
} = mixin;
|
||||
const myForm = ref<QForm | null>(null);
|
||||
|
||||
/** ตัวแปร */
|
||||
const retireld_params = route.params.retirementId;
|
||||
const modalNote = ref<boolean>(false);
|
||||
const note = ref<string>("");
|
||||
|
|
@ -37,7 +39,14 @@ const statusUpload = ref<boolean>();
|
|||
const modalEdit = ref<boolean>(false);
|
||||
const textReport = ref<string>("");
|
||||
const employeeType = ref<string>("OFFICER");
|
||||
const action = ref<string>("");
|
||||
const fileUpload = ref<any>(null);
|
||||
const round = ref<number>();
|
||||
const typeReport = ref<string>("");
|
||||
const statusReport = ref<boolean>();
|
||||
const dataProfile = ref<Object>([]);
|
||||
|
||||
/** คอลัมน์ที่แสดง */
|
||||
const columns = ref<any["columns"]>([]);
|
||||
const rows = ref<any>([]);
|
||||
const visibleColumns = ref<string[]>([
|
||||
|
|
@ -55,22 +64,20 @@ const visibleColumns = ref<string[]>([
|
|||
"bureau",
|
||||
]);
|
||||
|
||||
const action = ref<string>("");
|
||||
const fileUpload = ref<any>(null);
|
||||
|
||||
/** Hook */
|
||||
onMounted(() => {
|
||||
retireld.value = retireld_params.toString();
|
||||
fecthlistprofile(retireld.value);
|
||||
});
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่นปิด Dialog
|
||||
*/
|
||||
const closeDialog = () => {
|
||||
modalNote.value = false;
|
||||
modalUpload.value = false;
|
||||
};
|
||||
const round = ref<number>();
|
||||
const typeReport = ref<string>("");
|
||||
const statusReport = ref<boolean>();
|
||||
const dataProfile = ref<Object>([]);
|
||||
|
||||
// fecthlist
|
||||
const fecthlistprofile = async (id: string) => {
|
||||
showLoader();
|
||||
|
|
@ -121,6 +128,7 @@ const fecthlistprofile = async (id: string) => {
|
|||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
//คอลัมน์
|
||||
columns.value = [
|
||||
{
|
||||
name: "order",
|
||||
|
|
@ -243,6 +251,7 @@ const fecthCheck = async (id: string) => {
|
|||
messageError($q, err);
|
||||
});
|
||||
};
|
||||
|
||||
// DelProfile
|
||||
const clickDelete = () => {
|
||||
dialogRemove(
|
||||
|
|
@ -269,6 +278,7 @@ const clickDelete = () => {
|
|||
"ต้องการลบข้อมูลนี้ใช่หรือไม่ ?"
|
||||
);
|
||||
};
|
||||
|
||||
// แก้ไข้ข้อมูล
|
||||
const saveNote = () => {
|
||||
dialogConfirm(
|
||||
|
|
@ -296,19 +306,23 @@ const saveNote = () => {
|
|||
);
|
||||
};
|
||||
|
||||
//อัพเดท ListId
|
||||
const UpdateListId = (retireld: string, pId: string) => {
|
||||
profileId.value = pId;
|
||||
fecthlistprofile(retireld);
|
||||
};
|
||||
|
||||
// กลับหน้าเดิม
|
||||
const backHistory = () => {
|
||||
window.history.back();
|
||||
};
|
||||
|
||||
const visibleNote = computed(() => {
|
||||
if (note.value === "" || note.value === undefined) {
|
||||
return true;
|
||||
}
|
||||
});
|
||||
|
||||
// อัปโหลดไฟล์
|
||||
const modalUpload = ref<boolean>(false);
|
||||
const signDate = ref<Date | null>(null);
|
||||
|
|
@ -352,6 +366,7 @@ const uploadFile = async (event: any, signDate: any) => {
|
|||
});
|
||||
}
|
||||
};
|
||||
|
||||
// downloadAttachment
|
||||
const downloadAttachment = async (type: string, id: string) => {
|
||||
showLoader();
|
||||
|
|
@ -369,6 +384,7 @@ const downloadAttachment = async (type: string, id: string) => {
|
|||
hideLoader();
|
||||
});
|
||||
};
|
||||
|
||||
// downloadFile
|
||||
const downloadFile = (response: any, filename: string) => {
|
||||
const link = document.createElement("a");
|
||||
|
|
@ -379,6 +395,7 @@ const downloadFile = (response: any, filename: string) => {
|
|||
link.click();
|
||||
document.body.removeChild(link);
|
||||
};
|
||||
|
||||
// ยืนยันการแก้ไขข้อมูล
|
||||
const saveEdiitReport = (reason: string) => {
|
||||
const formdata = new FormData();
|
||||
|
|
@ -403,15 +420,18 @@ const saveEdiitReport = (reason: string) => {
|
|||
"ต้องการยืนยันการแก้ไขข้อมูลนี้หรือไม่ ?"
|
||||
);
|
||||
};
|
||||
|
||||
// เปิด popup เหตุผล
|
||||
const openmodalEditReport = () => {
|
||||
modalEdit.value = true;
|
||||
};
|
||||
|
||||
// ปิด popup เหตุผล
|
||||
const closemodalEditReport = () => {
|
||||
modalEdit.value = false;
|
||||
};
|
||||
|
||||
/** Setting Pagination */
|
||||
const paging = ref<boolean>(true);
|
||||
const pagination = ref({
|
||||
sortBy: "order",
|
||||
|
|
|
|||
|
|
@ -6,11 +6,13 @@ import { useRouter } from "vue-router";
|
|||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
/** Use */
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin();
|
||||
const { dialogConfirm, messageError } = mixin;
|
||||
const router = useRouter();
|
||||
|
||||
/** Prop */
|
||||
const props = defineProps({
|
||||
type: {
|
||||
type: String,
|
||||
|
|
@ -63,6 +65,7 @@ const clickAdd = () => {
|
|||
}
|
||||
}
|
||||
};
|
||||
|
||||
// เลือกรายการเพิ่ม
|
||||
const clickSelect = async (action: string) => {
|
||||
dialogConfirm(
|
||||
|
|
@ -81,6 +84,7 @@ const clickSelect = async (action: string) => {
|
|||
"ต้องการแก้ไขข้อมูลประกาศเกษียณใช่หรือไม่ ?"
|
||||
);
|
||||
};
|
||||
|
||||
// เพิ่มรอบประกาศเกษียณอายุราชการ API
|
||||
const cerateRetirement = async (data: object) => {
|
||||
await http
|
||||
|
|
|
|||
|
|
@ -6,11 +6,14 @@ import { useCounterMixin } from "@/stores/mixin";
|
|||
import { useRouter } from "vue-router";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
/** Use */
|
||||
const router = useRouter();
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin();
|
||||
const { showLoader, hideLoader, messageError, success, date2Thai } = mixin;
|
||||
|
||||
/** คอลัมน์ */
|
||||
const rows = ref<any>([]);
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{
|
||||
|
|
@ -88,6 +91,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
|
||||
/** คอลัมน์ที่แสดง */
|
||||
const visibleColumns = ref<string[]>([
|
||||
"no",
|
||||
"prefix",
|
||||
|
|
@ -99,9 +104,13 @@ const visibleColumns = ref<string[]>([
|
|||
"oc",
|
||||
"createdAt",
|
||||
]);
|
||||
|
||||
/**Hook */
|
||||
onMounted(() => {
|
||||
fectListDecased();
|
||||
});
|
||||
|
||||
/**เรียกข้อมูลจาก APi */
|
||||
const fectListDecased = async () => {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -134,6 +143,8 @@ const resetFilter = () => {
|
|||
filterKeyword.value = "";
|
||||
filterRef.value.focus();
|
||||
};
|
||||
|
||||
/** Setting Pagination */
|
||||
const nextPage = (id: string) => {
|
||||
router.push("/deceased/" + id);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, onMounted } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import DialogHeader from "@/modules/04_registry/components/DialogHeader.vue";
|
||||
import type { QInput, QForm } from "quasar";
|
||||
|
|
@ -9,15 +8,28 @@ import type { treeTab } from "@/modules/05_placement/interface/index/Main";
|
|||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import type { QTableProps } from "quasar";
|
||||
|
||||
import type {
|
||||
requestSendNoti,
|
||||
DataCopyOrder,
|
||||
ResponseOrganiz,
|
||||
} from "@/modules/06_retirement/interface/response/Deceased";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
|
||||
/** Use */
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
||||
const {
|
||||
dialogRemove,
|
||||
messageError,
|
||||
showLoader,
|
||||
hideLoader,
|
||||
success,
|
||||
dialogConfirm,
|
||||
} = mixin;
|
||||
|
||||
/** props*/
|
||||
const props = defineProps({
|
||||
next: {
|
||||
type: Function,
|
||||
|
|
@ -31,24 +43,25 @@ const props = defineProps({
|
|||
const profileId = ref<string>(route.params.id.toString());
|
||||
const next = () => props.next();
|
||||
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
||||
const { dialogRemove, messageError, showLoader, hideLoader, success,dialogConfirm } = mixin;
|
||||
|
||||
/**ตัวแปร */
|
||||
const myForm = ref<QForm | null>(null);
|
||||
const filterRef = ref<QInput>();
|
||||
const filter = ref<string>("");
|
||||
|
||||
const modal = ref<boolean>(false);
|
||||
const search = ref<string>("");
|
||||
const expanded = ref<string[]>([]);
|
||||
const selected = ref<string>("");
|
||||
const nodesTree = ref<treeTab[]>([]);
|
||||
|
||||
const selectedModal = ref<ResponseOrganiz[]>([]);
|
||||
|
||||
const filterModal = ref<string>("");
|
||||
const rows = ref<DataCopyOrder[]>([]);
|
||||
const editRows = ref<DataCopyOrder[]>([]);
|
||||
|
||||
/** คอลัมน์Modal ที่แสดง */
|
||||
const visibleColumnsModal = ref<String[]>(["no", "idCard", "name", "position"]);
|
||||
|
||||
/** คอลัมน์Modal */
|
||||
const rowsModal = ref<ResponseOrganiz[]>([]);
|
||||
const columnsModal = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "no",
|
||||
|
|
@ -88,13 +101,13 @@ const columnsModal = ref<QTableProps["columns"]>([
|
|||
},
|
||||
]);
|
||||
|
||||
const rowsModal = ref<ResponseOrganiz[]>([]);
|
||||
|
||||
/** selcet OPtion */
|
||||
const optionSelect = ref<any>([
|
||||
{ id: 1, name: "อีเมล" },
|
||||
{ id: 2, name: "กล่องข้อความ" },
|
||||
]);
|
||||
|
||||
/** คอลัมน์ที่แสดง */
|
||||
const visibleColumns = ref<String[]>([
|
||||
"no",
|
||||
"idCard",
|
||||
|
|
@ -103,6 +116,8 @@ const visibleColumns = ref<String[]>([
|
|||
"unit",
|
||||
"send",
|
||||
]);
|
||||
|
||||
/** คอลัมน์ */
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{ name: "no", align: "left", label: "ลำดับ", field: "no", sortable: true },
|
||||
{
|
||||
|
|
@ -152,14 +167,15 @@ const columns = ref<QTableProps["columns"]>([
|
|||
},
|
||||
]);
|
||||
|
||||
const rows = ref<DataCopyOrder[]>([]);
|
||||
|
||||
const editRows = ref<DataCopyOrder[]>([]);
|
||||
|
||||
/** Hook */
|
||||
onMounted(async () => {
|
||||
await getData();
|
||||
});
|
||||
|
||||
/**
|
||||
* ดึงข้อมูล list จาก api
|
||||
* @param id id ของข้อมูล
|
||||
*/
|
||||
const listModal = async (id: string) => {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -189,6 +205,7 @@ const listModal = async (id: string) => {
|
|||
});
|
||||
};
|
||||
|
||||
/** เรียกข้อมูลจาก api */
|
||||
const getData = async () => {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -235,6 +252,9 @@ const getData = async () => {
|
|||
});
|
||||
};
|
||||
|
||||
/**
|
||||
*ฟังก์ชั่น Save
|
||||
*/
|
||||
const saveData = async () => {
|
||||
showLoader();
|
||||
const persons = selectedModal.value.map((item) => ({
|
||||
|
|
@ -260,6 +280,10 @@ const resetFilter = () => {
|
|||
filterRef.value!.focus();
|
||||
};
|
||||
|
||||
/**
|
||||
* class จัดรูปแบบแสดงระหว่างข้อมูลที่แก้ไขหรือแสดงเฉยๆ
|
||||
* @param val ข้อมูล input สำหรับแก้ไขหรือไม่
|
||||
*/
|
||||
const getClass = (val: boolean) => {
|
||||
return {
|
||||
"full-width inputgreen cursor-pointer": val,
|
||||
|
|
@ -267,10 +291,14 @@ const getClass = (val: boolean) => {
|
|||
};
|
||||
};
|
||||
|
||||
/** Close Modal */
|
||||
const clickClose = async () => {
|
||||
modal.value = false;
|
||||
};
|
||||
|
||||
/**
|
||||
* กดปุ่มเพิ่มด้านบน table
|
||||
*/
|
||||
const clickAdd = async () => {
|
||||
await nodeTree();
|
||||
selected.value = "";
|
||||
|
|
@ -282,10 +310,16 @@ const clickAdd = async () => {
|
|||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* ลบข้อมูล
|
||||
*/
|
||||
const clickDelete = (id: string) => {
|
||||
dialogRemove($q, () => deleteData(id));
|
||||
};
|
||||
|
||||
/**
|
||||
* โหลดโครงสร้าง tree
|
||||
*/
|
||||
const nodeTree = async () => {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -305,10 +339,12 @@ const nodeTree = async () => {
|
|||
});
|
||||
};
|
||||
|
||||
// เลือกหน่วยงาน
|
||||
const onSelected = async (id: string) => {
|
||||
await listModal(id);
|
||||
};
|
||||
|
||||
/**ลบข้อมูล */
|
||||
const deleteData = async (id: string) => {
|
||||
await http
|
||||
.delete(config.API.detailByidDeceased(id))
|
||||
|
|
@ -323,16 +359,24 @@ const deleteData = async (id: string) => {
|
|||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Save ข้อมูล
|
||||
*/
|
||||
const saveDataCopyOrder = async () => {
|
||||
if (myForm.value !== null) {
|
||||
myForm.value.validate().then(async (result: boolean) => {
|
||||
if (result) {
|
||||
dialogConfirm($q,() => fetchSaveCopyOrder(),'ยืนยันการส่งหนังสือเวียน','ต้องการยืนยันการส่งหนังสือเวียนหรือไม่')
|
||||
dialogConfirm(
|
||||
$q,
|
||||
() => fetchSaveCopyOrder(),
|
||||
"ยืนยันการส่งหนังสือเวียน",
|
||||
"ต้องการยืนยันการส่งหนังสือเวียนหรือไม่"
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
//อัพเดทข้อมูลหลัง Save
|
||||
const fetchSaveCopyOrder = async () => {
|
||||
let list: requestSendNoti[] = [];
|
||||
rows.value.map((r: DataCopyOrder) => {
|
||||
|
|
@ -343,7 +387,6 @@ const fetchSaveCopyOrder = async () => {
|
|||
isSendNotification: true,
|
||||
});
|
||||
});
|
||||
|
||||
showLoader();
|
||||
await http
|
||||
.put(config.API.notiDeceased(profileId.value), { Persons: list })
|
||||
|
|
@ -359,7 +402,6 @@ const fetchSaveCopyOrder = async () => {
|
|||
getData();
|
||||
});
|
||||
};
|
||||
|
||||
const updateData = (row: DataCopyOrder) => {
|
||||
editRows.value.push(row);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ import { useCounterMixin } from "@/stores/mixin";
|
|||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
/**use*/
|
||||
const $q = useQuasar();
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
|
@ -15,6 +16,7 @@ const fullName = ref<string>("");
|
|||
const profileId = ref<string>(route.params.id.toString());
|
||||
const detail = ref<any>([]);
|
||||
|
||||
/** Hook */
|
||||
onMounted(() => {
|
||||
fectdata();
|
||||
});
|
||||
|
|
@ -63,6 +65,10 @@ const downloadFile = (response: any, filename: string) => {
|
|||
document.body.removeChild(link);
|
||||
};
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่น ดาว์โหลด
|
||||
* @param type typeของรายละเอียด
|
||||
*/
|
||||
const fileDownload = async (type: string) => {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@ import DialogHeader from "@/modules/05_placement/components/PersonalList/DialogH
|
|||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
/** use */
|
||||
const $q = useQuasar();
|
||||
const selected = ref<ResponseItems[]>([]);
|
||||
const mixin = useCounterMixin();
|
||||
|
|
@ -15,6 +16,7 @@ const { showLoader, success, messageError, dialogConfirm, hideLoader } = mixin;
|
|||
const filterKeyword = ref<string>("");
|
||||
const filterRef = ref<any>(null);
|
||||
|
||||
/** คอลัมน์ */
|
||||
const columns2 = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "no",
|
||||
|
|
@ -107,6 +109,8 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
]);
|
||||
|
||||
/** คอลัมน์ที่แสดง */
|
||||
const visibleColumns2 = ref<string[]>([
|
||||
"no",
|
||||
"fullname",
|
||||
|
|
@ -118,6 +122,7 @@ const visibleColumns2 = ref<string[]>([
|
|||
"statustext",
|
||||
]);
|
||||
|
||||
/** props*/
|
||||
const props = defineProps({
|
||||
modal: Boolean,
|
||||
closeModal: Function,
|
||||
|
|
@ -132,6 +137,9 @@ const resetFilter = () => {
|
|||
filterRef.value.focus();
|
||||
};
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่นการ Selected Data
|
||||
*/
|
||||
const checkSelected = computed(() => {
|
||||
if (selected.value.length === 0) {
|
||||
return true;
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ import config from "@/app.config";
|
|||
import type { QTableProps } from "quasar";
|
||||
import type { ResponseItems } from "@/modules/06_retirement/interface/response/Main";
|
||||
|
||||
/** use */
|
||||
const RetirementData = useRetirementDataStore();
|
||||
const { statusText } = RetirementData;
|
||||
const $q = useQuasar(); //ใช้ noti quasar
|
||||
|
|
@ -17,6 +18,7 @@ const router = useRouter();
|
|||
const mixin = useCounterMixin();
|
||||
const { messageError, date2Thai, showLoader, hideLoader } = mixin;
|
||||
|
||||
/** คอลัมน์ */
|
||||
const rows = ref<ResponseItems[]>([]);
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{
|
||||
|
|
@ -120,6 +122,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
]);
|
||||
|
||||
/** คอลัมน์ที่แสดง */
|
||||
const visibleColumns = ref<string[]>([
|
||||
"no",
|
||||
"prefix",
|
||||
|
|
@ -148,12 +152,13 @@ const closeModal = () => {
|
|||
modal.value = false;
|
||||
filterKeyword2.value = "";
|
||||
};
|
||||
|
||||
//reset filter
|
||||
const resetFilter = () => {
|
||||
filterKeyword.value = "";
|
||||
filterRef.value.focus();
|
||||
};
|
||||
|
||||
//เปิด Modal
|
||||
const openModalOrder = async () => {
|
||||
openModal();
|
||||
const row = await filters.value.filter(
|
||||
|
|
@ -170,6 +175,7 @@ const openModalOrder = async () => {
|
|||
rows2.value = row;
|
||||
};
|
||||
|
||||
/**Hook */
|
||||
onMounted(async () => {
|
||||
await fecthlist();
|
||||
});
|
||||
|
|
@ -219,6 +225,8 @@ const fecthlist = async () => {
|
|||
hideLoader();
|
||||
});
|
||||
};
|
||||
|
||||
/**Setting pagination */
|
||||
const pagination = ref({
|
||||
sortBy: "datetext",
|
||||
descending: true,
|
||||
|
|
@ -234,28 +242,66 @@ const pagination = ref({
|
|||
<div class="row col-12">
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div>
|
||||
<q-btn @click="openModalOrder" size="14px" flat round color="add" icon="mdi-account-arrow-right">
|
||||
<q-btn
|
||||
@click="openModalOrder"
|
||||
size="14px"
|
||||
flat
|
||||
round
|
||||
color="add"
|
||||
icon="mdi-account-arrow-right"
|
||||
>
|
||||
<q-tooltip>ส่งไปออกคำสั่งลาออก</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
|
||||
<q-space />
|
||||
|
||||
<q-input class="col-xs-12 col-sm-3 col-md-2" standout dense v-model="filterKeyword" ref="filterRef" outlined
|
||||
debounce="300" placeholder="ค้นหา">
|
||||
<q-input
|
||||
class="col-xs-12 col-sm-3 col-md-2"
|
||||
standout
|
||||
dense
|
||||
v-model="filterKeyword"
|
||||
ref="filterRef"
|
||||
outlined
|
||||
debounce="300"
|
||||
placeholder="ค้นหา"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon v-if="filterKeyword == ''" name="search" />
|
||||
<q-icon v-if="filterKeyword !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
|
||||
<q-icon
|
||||
v-if="filterKeyword !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="resetFilter"
|
||||
/>
|
||||
</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"
|
||||
class="col-xs-12 col-sm-3 col-md-2" />
|
||||
<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"
|
||||
class="col-xs-12 col-sm-3 col-md-2"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 q-pt-sm">
|
||||
<d-table :columns="columns" :rows="rows" :filter="filterKeyword" row-key="id" :visible-columns="visibleColumns"
|
||||
v-model:pagination="pagination">
|
||||
<d-table
|
||||
:columns="columns"
|
||||
:rows="rows"
|
||||
:filter="filterKeyword"
|
||||
row-key="id"
|
||||
:visible-columns="visibleColumns"
|
||||
v-model:pagination="pagination"
|
||||
>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th v-for="col in props.cols" :key="col.name" :props="props">
|
||||
|
|
@ -264,7 +310,11 @@ const pagination = ref({
|
|||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer" @click="router.push(`/retirement/resign/${props.row.id}`)">
|
||||
<q-tr
|
||||
:props="props"
|
||||
class="cursor-pointer"
|
||||
@click="router.push(`/retirement/resign/${props.row.id}`)"
|
||||
>
|
||||
<q-td key="no" :props="props">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</q-td>
|
||||
|
|
@ -303,7 +353,12 @@ const pagination = ref({
|
|||
</div>
|
||||
</q-card>
|
||||
|
||||
<DialogSendToCommand v-model:modal="modal" :closeModal="closeModal" :rows2="rows2"
|
||||
v-model:filterKeyword2="filterKeyword2" :fecthlistRecevice="fecthlist" />
|
||||
<DialogSendToCommand
|
||||
v-model:modal="modal"
|
||||
:closeModal="closeModal"
|
||||
:rows2="rows2"
|
||||
v-model:filterKeyword2="filterKeyword2"
|
||||
:fecthlistRecevice="fecthlist"
|
||||
/>
|
||||
</template>
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
|
|||
|
|
@ -6,20 +6,22 @@ import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogF
|
|||
import DialogHeader from "@/modules/05_placement/components/PersonalList/DialogHeader.vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useRetirementDataStore } from "@/modules/06_retirement/store";
|
||||
|
||||
import CurrencyInput from "@/components/CurruncyInput.vue";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import keycloak from "@/plugins/keycloak";
|
||||
import type { TypeFile, rowFile } from "@/modules/06_retirement/interface/response/Main";
|
||||
import type {
|
||||
TypeFile,
|
||||
rowFile,
|
||||
} from "@/modules/06_retirement/interface/response/Main";
|
||||
import type { QTableProps } from "quasar";
|
||||
|
||||
/** Use */
|
||||
const $q = useQuasar();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const mixin = useCounterMixin();
|
||||
const RetirementData = useRetirementDataStore();
|
||||
|
||||
const {
|
||||
messageError,
|
||||
date2Thai,
|
||||
|
|
@ -31,6 +33,7 @@ const {
|
|||
} = mixin;
|
||||
const { statusText } = RetirementData;
|
||||
|
||||
/** ตัวแปร */
|
||||
const roleUser = ref<string>("");
|
||||
const id = ref<string>(route.params.id.toString());
|
||||
const myForm = ref<QForm | null>(null);
|
||||
|
|
@ -58,7 +61,6 @@ const dataDetail = ref<any>({
|
|||
statustext: "",
|
||||
fullname: "",
|
||||
});
|
||||
|
||||
const organizationPositionOld = ref<string>("");
|
||||
const positionTypeOld = ref<string>("");
|
||||
const positionLevelOld = ref<string>("");
|
||||
|
|
@ -70,12 +72,12 @@ const reason = ref<string>("");
|
|||
const location = ref<string>("");
|
||||
const status = ref<string>("");
|
||||
const remarkHorizontal = ref<string>("");
|
||||
|
||||
const modal = ref<boolean>(false);
|
||||
const actionPass = ref<boolean>(false);
|
||||
const reasonReign = ref<string>("");
|
||||
const dateBreak = ref<Date | null>(null);
|
||||
|
||||
/** คอลัมน์ */
|
||||
const rows = ref<TypeFile[]>([]);
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{
|
||||
|
|
@ -107,9 +109,11 @@ const columns = ref<QTableProps["columns"]>([
|
|||
},
|
||||
]);
|
||||
|
||||
/**เปิด-ปิด modal */
|
||||
const closeModal = () => (modal.value = false);
|
||||
const openModal = () => (modal.value = true);
|
||||
|
||||
/** Hook */
|
||||
onMounted(async () => {
|
||||
fetchData(id.value);
|
||||
if (keycloak.tokenParsed !== undefined) {
|
||||
|
|
@ -139,6 +143,9 @@ const diffDate = () => {
|
|||
return false;
|
||||
};
|
||||
|
||||
/**
|
||||
* นำข้อมูลมาจาก API
|
||||
*/
|
||||
const fetchData = async (id: string) => {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -187,13 +194,14 @@ const fetchData = async (id: string) => {
|
|||
// document.body.removeChild(link);
|
||||
// };
|
||||
|
||||
/**Pop up */
|
||||
const popUp = (action: "pass" | "passNot") => {
|
||||
reasonReign.value = "";
|
||||
dateBreak.value = null;
|
||||
actionPass.value = action === "pass";
|
||||
openModal();
|
||||
};
|
||||
|
||||
//เงื่อนไขpop up
|
||||
const conditionPopup = () => {
|
||||
if (myFormConfirm.value !== null) {
|
||||
myFormConfirm.value.validate().then(async (check) => {
|
||||
|
|
@ -208,6 +216,7 @@ const conditionPopup = () => {
|
|||
}
|
||||
};
|
||||
|
||||
//pop up ยืนยันการอนุมัติ
|
||||
const confirmpopUp = async () => {
|
||||
dialogConfirm(
|
||||
$q,
|
||||
|
|
@ -233,6 +242,7 @@ const confirmpopUp = async () => {
|
|||
);
|
||||
};
|
||||
|
||||
//pop up การยับยั้งสำเร็จ
|
||||
const rejectpopUp = async () => {
|
||||
dialogConfirm(
|
||||
$q,
|
||||
|
|
@ -258,15 +268,26 @@ const rejectpopUp = async () => {
|
|||
"ต้องการยืนยันการยับยั้งนี้หรือไม่ ?"
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
* ไปยังข้อมูล
|
||||
* @param id ไอดีข้อมูล
|
||||
*/
|
||||
const redirectToRegistry = (id: string) => {
|
||||
router.push(`/registry/${id}`);
|
||||
};
|
||||
|
||||
/**
|
||||
* กดยกเลิก
|
||||
*/
|
||||
const clickCancel = async () => {
|
||||
await fetchData(id.value);
|
||||
edit.value = false;
|
||||
};
|
||||
|
||||
/**
|
||||
* Functionบันทึก
|
||||
*/
|
||||
const conditionSave = () => {
|
||||
if (myForm.value !== null) {
|
||||
myForm.value.validate().then((success) => {
|
||||
|
|
@ -285,7 +306,7 @@ const conditionSave = () => {
|
|||
});
|
||||
}
|
||||
};
|
||||
|
||||
//Save จาก Api
|
||||
const saveData = async () => {
|
||||
const formData = new FormData();
|
||||
const send = date.value !== null ? new Date(date.value).toUTCString() : "";
|
||||
|
|
@ -317,12 +338,18 @@ const saveData = async () => {
|
|||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Function เพิ่ม Class เวลา Edit
|
||||
* @param val เมื่อเป็นEdit จะเปลี่ยน Class
|
||||
*/
|
||||
const getClass = (val: boolean) => {
|
||||
return {
|
||||
"full-width inputgreen cursor-pointer": val,
|
||||
"full-width cursor-pointer": !val,
|
||||
};
|
||||
};
|
||||
|
||||
/** แปลง StatusOrder */
|
||||
const statusOrder = (val: boolean) => {
|
||||
switch (val) {
|
||||
case true:
|
||||
|
|
@ -335,12 +362,12 @@ const statusOrder = (val: boolean) => {
|
|||
// เอกสารดาวน์โหลด
|
||||
const rowsFileDownload = ref<rowFile[]>([
|
||||
{
|
||||
fileName:
|
||||
"แบบฟอร์มหนังสือขอลาออกจากราชการ",
|
||||
fileName: "แบบฟอร์มหนังสือขอลาออกจากราชการ",
|
||||
pathName: "",
|
||||
}
|
||||
},
|
||||
]);
|
||||
|
||||
// ดาว์นโหลดไฟล์
|
||||
const fileDownload = async (type: string, fileName: string) => {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -358,6 +385,7 @@ const fileDownload = async (type: string, fileName: string) => {
|
|||
});
|
||||
};
|
||||
|
||||
// ดาว์นโหลดไฟล์
|
||||
const downloadFile = (response: any, filename: string) => {
|
||||
const link = document.createElement("a");
|
||||
var fileName = filename;
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@ import { useOrderPlacementDataStore } from "@/modules/05_placement/store";
|
|||
import router from "@/router";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
/** Use */
|
||||
const $q = useQuasar(); //ใช้ noti quasar
|
||||
const DataStore = useOrderPlacementDataStore();
|
||||
const pagination = ref({
|
||||
|
|
@ -16,7 +17,6 @@ const pagination = ref({
|
|||
page: 1,
|
||||
rowsPerPage: 10,
|
||||
});
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const { dateText } = mixin;
|
||||
|
||||
|
|
@ -25,6 +25,7 @@ const textDate = (value: Date) => {
|
|||
return dateText(value);
|
||||
};
|
||||
|
||||
/** คอลัมน์ที่แสดง */
|
||||
const visibleColumns = ref<string[]>([
|
||||
"Order",
|
||||
"OrderType",
|
||||
|
|
@ -263,6 +264,7 @@ const rows = ref<FormOrderPlacementMainData[]>([
|
|||
let OriginalData = ref<FormOrderPlacementMainData[]>([]);
|
||||
let UpdataData = ref<FormOrderPlacementMainData[]>([]);
|
||||
|
||||
/**Hook */
|
||||
onMounted(async () => {
|
||||
await OriginalDataFetch();
|
||||
fiscalYearFilter();
|
||||
|
|
@ -271,6 +273,9 @@ onMounted(async () => {
|
|||
OrderTypeFilter();
|
||||
});
|
||||
|
||||
/**
|
||||
* ดึงค่าข้อมูลจาก store
|
||||
*/
|
||||
const OriginalDataFetch = async () => {
|
||||
await DataStore.DataMainOrder(rows.value);
|
||||
OriginalData.value = await DataStore.DataMainOrigOrder;
|
||||
|
|
@ -282,6 +287,10 @@ const redirectToPage = (id?: number) => {
|
|||
router.push(`/placement/order/detail`);
|
||||
};
|
||||
|
||||
/**
|
||||
* function delete
|
||||
* @param id id delete
|
||||
*/
|
||||
const clickDelete = (id: string) => {
|
||||
$q.dialog({
|
||||
title: "ยืนยันการลบข้อมูล",
|
||||
|
|
@ -297,6 +306,7 @@ const clickDelete = (id: string) => {
|
|||
.onDismiss(() => {});
|
||||
};
|
||||
|
||||
//route ไปหน้า OrderplacementDetail
|
||||
const clickAdd = () => {
|
||||
router.push({ name: "OrderplacementDetail" });
|
||||
};
|
||||
|
|
@ -320,6 +330,9 @@ const fiscalYearFilter = async () => {
|
|||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* เลือกประเภทคำสั่ง
|
||||
*/
|
||||
const OrderType = ref<string>("");
|
||||
const OrderTypeOption = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
|
||||
const addedOrderTypeValues: string[] = [];
|
||||
|
|
@ -335,6 +348,10 @@ const OrderTypeFilter = async () => {
|
|||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* เลือกStatus คำสั่ง
|
||||
*/
|
||||
const OrderStatus = ref<string>("");
|
||||
const OrderStatusOption = reactive<DataOption[]>([{ id: 1, name: "ทั้งหมด" }]);
|
||||
const addedOrderStatusValues: string[] = [];
|
||||
|
|
@ -366,9 +383,7 @@ const resetFilter = () => {
|
|||
filterKeyword.value = "";
|
||||
filterRef.value.focus();
|
||||
};
|
||||
|
||||
const attrs = ref<any>(useAttrs());
|
||||
|
||||
const searchFilterTable = async () => {
|
||||
await DataStore.DataUpdateOrder(
|
||||
OrderType.value,
|
||||
|
|
@ -378,6 +393,7 @@ const searchFilterTable = async () => {
|
|||
UpdataData.value = DataStore.DataMainUpdateOrder;
|
||||
};
|
||||
|
||||
/**Setting pagination */
|
||||
const paging = ref<boolean>(true);
|
||||
const paginationLabel = (start: string, end: string, total: string) => {
|
||||
if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { ref, onMounted, onUnmounted } from "vue";
|
|||
import type { QTableProps } from "quasar";
|
||||
import type {
|
||||
DataResTime,
|
||||
TableRows,
|
||||
TableRowsTime,
|
||||
} from "@/modules/09_leave/interface/response/work";
|
||||
import type { DataOption } from "@/modules/09_leave/interface/index/Main";
|
||||
|
||||
|
|
@ -19,12 +19,13 @@ import { useWorklistDataStore } from "@/modules/09_leave/stores/WorkStore";
|
|||
/** useStore */
|
||||
const mixin = useCounterMixin();
|
||||
const workStore = useWorklistDataStore();
|
||||
const { date2Thai, showLoader, hideLoader } = mixin;
|
||||
const { date2Thai, dateToISO, showLoader, hideLoader } = mixin;
|
||||
|
||||
const keyword = ref<string>("");
|
||||
const page = ref<number>(1);
|
||||
const rowsPerPage = ref<number>(2);
|
||||
const maxPage = ref<number>(7);
|
||||
const rowsPerPage = ref<number>(10);
|
||||
const maxPage = ref<number>(1);
|
||||
const filetStatus = ref<string>("");
|
||||
|
||||
/** ข้อมูลหัวตาราง*/
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
|
|
@ -64,6 +65,15 @@ const columns = ref<QTableProps["columns"]>([
|
|||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "checkInStatus",
|
||||
align: "left",
|
||||
label: "สถานะ",
|
||||
sortable: true,
|
||||
field: "checkInStatus",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "checkOutTime",
|
||||
align: "left",
|
||||
|
|
@ -83,11 +93,11 @@ const columns = ref<QTableProps["columns"]>([
|
|||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "checkStatus",
|
||||
name: "checkOutStatus",
|
||||
align: "left",
|
||||
label: "สถานะ",
|
||||
sortable: true,
|
||||
field: "checkStatus",
|
||||
field: "checkOutStatus",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
|
|
@ -97,96 +107,94 @@ const visibleColumns = ref<string[]>([
|
|||
"fullName",
|
||||
"checkInTime",
|
||||
"checkInLocation",
|
||||
"checkInStatus",
|
||||
"checkOutTime",
|
||||
"checkOutLocation",
|
||||
"checkStatus",
|
||||
"checkOutStatus",
|
||||
]);
|
||||
const rows = ref<TableRows[]>([]);
|
||||
const optionStatusMain = ref<DataOption[]>([]);
|
||||
const optionStatus = ref<DataOption[]>([]);
|
||||
const filetStatus = ref<string>("");
|
||||
const rows = ref<TableRowsTime[]>([]);
|
||||
|
||||
async function fetchListTimeRecord() {
|
||||
showLoader();
|
||||
const listData: DataResTime[] = [
|
||||
// {
|
||||
// id: "00000000-0000-0000-0000-000000000000",
|
||||
// fullName: "นางอมร ใจดี",
|
||||
// checkDate: new Date(),
|
||||
// checkInTime: "08:30",
|
||||
// checkInLocation: "สำนักงงาน",
|
||||
// checkInLat: "18.7903",
|
||||
// checkInLon: "99.0029",
|
||||
// checkOutLocation: "สำนักงงาน",
|
||||
// checkOutTime: "18:04",
|
||||
// checkOutLat: "18.7903",
|
||||
// checkOutLon: "99.0029",
|
||||
// checkStatus: "normal",
|
||||
// },
|
||||
// {
|
||||
// id: "00000000-0000-0000-0000-000000000000",
|
||||
// fullName: "นางอมร ใจดี",
|
||||
// checkDate: new Date(),
|
||||
// checkInTime: "08:30",
|
||||
// checkInLocation: "สำนักงงาน",
|
||||
// checkInLat: "18.7903",
|
||||
// checkInLon: "99.0029",
|
||||
// checkOutLocation: "สำนักงงาน",
|
||||
// checkOutTime: "18:04",
|
||||
// checkOutLat: "18.7903",
|
||||
// checkOutLon: "99.0029",
|
||||
// checkStatus: "normal",
|
||||
// },
|
||||
// {
|
||||
// id: "00000000-0000-0000-0000-000000000000",
|
||||
// fullName: "นางอมร ใจดี",
|
||||
// checkDate: new Date(),
|
||||
// checkInTime: "08:30",
|
||||
// checkInLocation: "สำนักงงาน",
|
||||
// checkInLat: "18.7903",
|
||||
// checkInLon: "99.0029",
|
||||
// checkOutLocation: "สำนักงงาน",
|
||||
// checkOutTime: "18:04",
|
||||
// checkOutLat: "18.7903",
|
||||
// checkOutLon: "99.0029",
|
||||
// checkStatus: "normal",
|
||||
// },
|
||||
{
|
||||
id: "00000000-0000-0000-0000-000000000000",
|
||||
fullName: "นางอมร ใจดี",
|
||||
checkInDate: new Date(),
|
||||
checkInTime: "08:30",
|
||||
checkInLocation: "สำนักงงาน",
|
||||
checkInLat: "18.7903",
|
||||
checkInLon: "99.0029",
|
||||
checkInStatus: "normal",
|
||||
checkOutDate: new Date(),
|
||||
checkOutLocation: "สำนักงงาน",
|
||||
checkOutTime: "18:04",
|
||||
checkOutLat: "18.7903",
|
||||
checkOutLon: "99.0029",
|
||||
checkOutStatus: "late",
|
||||
},
|
||||
{
|
||||
id: "00000000-0000-0000-0000-000000000000",
|
||||
fullName: "นางอมร ใจดี",
|
||||
checkInDate: new Date(),
|
||||
checkInTime: "08:30",
|
||||
checkInLocation: "สำนักงงาน",
|
||||
checkInLat: "18.7903",
|
||||
checkInLon: "99.0029",
|
||||
checkInStatus: "normal",
|
||||
checkOutDate: new Date(),
|
||||
checkOutLocation: "สำนักงงาน",
|
||||
checkOutTime: "18:04",
|
||||
checkOutLat: "18.7903",
|
||||
checkOutLon: "99.0029",
|
||||
checkOutStatus: "late",
|
||||
},
|
||||
];
|
||||
|
||||
let datalist: TableRows[] = listData.map((e: DataResTime) => ({
|
||||
const date = new Date(workStore.selectDate as string | Date);
|
||||
startDate: dateToISO(date), //*วันที่เริ่ม
|
||||
endDate: dateToISO(date), //*วันที่สิ้นสุด
|
||||
status: filetStatus.value, //*สถานะ
|
||||
page: page.value, //*หน้า
|
||||
pageSize: rowsPerPage.value, //*จำนวนแถวต่อหน้า
|
||||
keyword: keyword.value, //keyword ค้นหา
|
||||
};
|
||||
|
||||
console.log(querySting);
|
||||
|
||||
const datalist: TableRowsTime[] = listData.map((e: DataResTime) => ({
|
||||
id: e.id,
|
||||
fullName: e.fullName,
|
||||
checkDate: e.checkDate && date2Thai(e.checkDate),
|
||||
checkInDate: e.checkInDate && date2Thai(e.checkInDate),
|
||||
checkInTime: e.checkInTime,
|
||||
checkInLocation: e.checkInLocation,
|
||||
checkInLat: e.checkInLat,
|
||||
checkInLon: e.checkInLon,
|
||||
checkInStatus: e.checkInStatus && workStore.convertSatatus(e.checkInStatus),
|
||||
checkOutDate: e.checkOutDate && date2Thai(e.checkOutDate),
|
||||
checkOutLocation: e.checkOutLocation,
|
||||
checkOutTime: e.checkOutTime,
|
||||
checkOutLat: e.checkOutLat,
|
||||
checkOutLon: e.checkOutLon,
|
||||
checkStatus: e.checkStatus && workStore.convertSatatus(e.checkStatus),
|
||||
checkOutStatus:
|
||||
e.checkOutStatus && workStore.convertSatatus(e.checkOutStatus),
|
||||
}));
|
||||
rows.value = datalist;
|
||||
fetchOption(datalist);
|
||||
maxPage.value = Math.ceil(rows.value.length / rowsPerPage.value);
|
||||
hideLoader();
|
||||
}
|
||||
|
||||
//
|
||||
function fetchOption(data: TableRows[]) {
|
||||
const double_status = [...new Set(data.map((item: any) => item.checkStatus))];
|
||||
optionStatusMain.value = [{ id: "all", name: "ทั้งหมด" }];
|
||||
for (let i = 1; i <= double_status.length; i++) {
|
||||
const status = double_status[i - 1];
|
||||
if (typeof status === "string") {
|
||||
const listtype: DataOption = {
|
||||
id: status,
|
||||
name: status,
|
||||
};
|
||||
optionStatusMain.value.push(listtype);
|
||||
optionStatus.value = optionStatusMain.value;
|
||||
}
|
||||
}
|
||||
async function updatePaging(
|
||||
params: any,
|
||||
currentPage: number,
|
||||
key: string,
|
||||
status: string
|
||||
) {
|
||||
page.value = currentPage;
|
||||
rowsPerPage.value = params.rowsPerPage ?? rowsPerPage.value;
|
||||
keyword.value = key ?? keyword.value;
|
||||
filetStatus.value = status;
|
||||
await fetchListTimeRecord();
|
||||
}
|
||||
|
||||
/** Hook*/
|
||||
|
|
@ -200,12 +208,13 @@ onMounted(async () => {
|
|||
onUnmounted(() => {});
|
||||
</script>
|
||||
<template>
|
||||
<ToolBar :option="optionStatus" :filetStatus="filetStatus" />
|
||||
<ToolBar :filetStatus="filetStatus" @update:pagination="updatePaging" />
|
||||
<TableList
|
||||
:rows="rows.length > 0 ? rows : []"
|
||||
:page="page"
|
||||
:rowsPerPage="rowsPerPage"
|
||||
:maxPage="maxPage"
|
||||
@update:pagination="updatePaging"
|
||||
/>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -94,7 +94,7 @@ const rows = ref<TableRows[]>([]);
|
|||
/** QueryString*/
|
||||
const keyword = ref<string>("");
|
||||
const page = ref<number>(1);
|
||||
const rowsPerPage = ref<number>(5);
|
||||
const rowsPerPage = ref<number>(10);
|
||||
const maxPage = ref<number>(1);
|
||||
|
||||
/** เรียกข้อมูลรายการลงเวลาปฏิบัติงาน (รายการลงเวลา) */
|
||||
|
|
|
|||
|
|
@ -9,16 +9,25 @@ const workStore = useWorklistDataStore();
|
|||
const mixin = useCounterMixin();
|
||||
const { date2Thai } = mixin;
|
||||
|
||||
const props = defineProps({
|
||||
option: {
|
||||
type: Object,
|
||||
require: true,
|
||||
},
|
||||
});
|
||||
const emit = defineEmits(["update:pagination"]);
|
||||
const updateProp = (newPagination: any, keyword: string, status: string) => {
|
||||
// ส่ง event ไปยัง parent component เพื่ออัพเดทค่า props
|
||||
emit("update:pagination", newPagination, 1, keyword, status);
|
||||
};
|
||||
|
||||
const option = ref<any[]>([
|
||||
{ id: "", name: "ทั้งหมด" },
|
||||
{ id: "normal", name: "ปกติ" },
|
||||
{ id: "late", name: "สาย" },
|
||||
{ id: "absent", name: "ขาดราชการ" },
|
||||
]);
|
||||
const filetStatus = ref<string>("");
|
||||
const keyword = ref<string>("");
|
||||
|
||||
function filterFn() {
|
||||
updateProp([], keyword.value, filetStatus.value);
|
||||
}
|
||||
|
||||
/** Functicon หาค่ามากสุดและปิดวันที่ไม่ให้เลือกวันล่วงหน้า*/
|
||||
function calculateMaxDate() {
|
||||
const today = new Date();
|
||||
|
|
@ -38,6 +47,7 @@ function calculateMaxDate() {
|
|||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
:max-date="calculateMaxDate()"
|
||||
@update:model-value="filterFn"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
|
|
@ -77,7 +87,8 @@ function calculateMaxDate() {
|
|||
label="สถานะ"
|
||||
use-input
|
||||
v-model="filetStatus"
|
||||
:options="props.option as readonly any[] || undefined"
|
||||
:options="option"
|
||||
@update:model-value="filterFn"
|
||||
>
|
||||
<template v-slot:no-option>
|
||||
<q-item>
|
||||
|
|
@ -95,6 +106,7 @@ function calculateMaxDate() {
|
|||
v-model="keyword"
|
||||
label="ค้นหา"
|
||||
debounce="300"
|
||||
@keydown.enter.prevent="filterFn"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon name="search" />
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@ import { useCounterMixin } from "@/stores/mixin";
|
|||
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
|
||||
import { useLeavelistDataStoreTest } from "@/modules/09_leave/stores/ListLeave";
|
||||
import DialogReason from "@/components/Dialogs/PopupReason.vue";
|
||||
import DialogReason1 from "@/components/Dialogs/PopupReason.vue";
|
||||
const APIDATA = useLeavelistDataStoreTest();
|
||||
|
||||
/** importType */
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, onMounted } from "vue";
|
||||
import { ref, onMounted, watch } from "vue";
|
||||
import type { QTableProps } from "quasar";
|
||||
import { useRouter } from "vue-router";
|
||||
|
||||
|
|
@ -11,12 +11,6 @@ const leaveStore = useLeavelistDataStore();
|
|||
|
||||
const router = useRouter();
|
||||
|
||||
/** Hook*/
|
||||
onMounted(() => {
|
||||
leaveStore.columns = columns.value;
|
||||
leaveStore.visibleColumns = visibleColumns.value;
|
||||
});
|
||||
|
||||
/** เรียน funtion จาก stores*/
|
||||
// const { date2Thai } = mixin;
|
||||
// const { optionYear, searchDataFn, filterOption } = leaveStore;
|
||||
|
|
@ -77,10 +71,49 @@ const visibleColumns = ref<string[]>([
|
|||
"status",
|
||||
]);
|
||||
|
||||
const props = defineProps({
|
||||
rows: {
|
||||
type: Object,
|
||||
require: true,
|
||||
},
|
||||
page: {
|
||||
type: Number,
|
||||
require: true,
|
||||
},
|
||||
rowsPerPage: {
|
||||
type: Number,
|
||||
require: true,
|
||||
},
|
||||
maxPage: {
|
||||
type: Number,
|
||||
require: true,
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(["update:querySting"]);
|
||||
|
||||
function updateQuerySting(newPage: number, pageSize: number) {
|
||||
// ส่ง event ไปยัง parent component เพื่ออัพเดทค่า props
|
||||
emit("update:querySting", newPage, pageSize);
|
||||
}
|
||||
|
||||
const currentPage = ref<number>(1);
|
||||
const pagination = ref({
|
||||
descending: true,
|
||||
page: 1,
|
||||
rowsPerPage: 10,
|
||||
page: props.page,
|
||||
rowsPerPage: props.rowsPerPage,
|
||||
});
|
||||
|
||||
watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
|
||||
// updateProp(pagination.value, currentPage.value);
|
||||
currentPage.value &&
|
||||
pagination.value.rowsPerPage &&
|
||||
updateQuerySting(currentPage.value, pagination.value.rowsPerPage);
|
||||
});
|
||||
|
||||
/** Hook*/
|
||||
onMounted(() => {
|
||||
leaveStore.visibleColumns = visibleColumns.value;
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
@ -89,7 +122,6 @@ const pagination = ref({
|
|||
ref="table"
|
||||
:columns="columns"
|
||||
:rows="leaveStore.rows"
|
||||
:filter="leaveStore.filterTable"
|
||||
row-key="id"
|
||||
flat
|
||||
bordered
|
||||
|
|
@ -98,7 +130,6 @@ const pagination = ref({
|
|||
class="custom-header-table"
|
||||
:visible-columns="leaveStore.visibleColumns"
|
||||
v-model:pagination="pagination"
|
||||
:loading="leaveStore.loadTable"
|
||||
>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
|
|
@ -125,8 +156,16 @@ const pagination = ref({
|
|||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:loading>
|
||||
<q-inner-loading showing color="primary" />
|
||||
<template v-slot:pagination="scope">
|
||||
<q-pagination
|
||||
v-model="currentPage"
|
||||
active-color="primary"
|
||||
color="dark"
|
||||
:max="Number(props.maxPage)"
|
||||
size="sm"
|
||||
boundary-links
|
||||
direction-links
|
||||
></q-pagination>
|
||||
</template>
|
||||
</d-table>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,116 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, reactive, onMounted } from "vue";
|
||||
|
||||
import type { DateFilter } from "@/modules/09_leave/interface/request/leave";
|
||||
import type {
|
||||
DataOption,
|
||||
DataOption2,
|
||||
} from "@/modules/09_leave/interface/index/Main";
|
||||
/** importStores*/
|
||||
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
|
||||
|
||||
const leaveStore = useLeavelistDataStore();
|
||||
const { searchDataFn, filterOption } = leaveStore;
|
||||
|
||||
const emit = defineEmits(["update:querySting"]);
|
||||
|
||||
/** formFilter*/
|
||||
const filter = reactive<DateFilter>({
|
||||
year: 0, //*ปีในการยื่นขอใบลา(ใช้เป็น คศ.)
|
||||
type: "00000000-0000-0000-0000-000000000000", //*Id ประเภทการลา
|
||||
status: "ALL", //*สถานะการของลา
|
||||
keyword: "", //keyword ค้นหา
|
||||
});
|
||||
|
||||
/**
|
||||
* function update ข้อมูลการค้นหา (QuerySting)
|
||||
* @param newPage หน้า
|
||||
* @param pageSize ข้อมูลต่อแถว
|
||||
* @param dateFilter ข้อมูล Filter
|
||||
*/
|
||||
function updateQuerySting(
|
||||
newPage: number,
|
||||
pageSize: number,
|
||||
dateFilter: DateFilter
|
||||
) {
|
||||
// ส่ง event ไปยัง parent component เพื่ออัพเดทค่า props
|
||||
emit("update:querySting", newPage, pageSize, dateFilter);
|
||||
}
|
||||
|
||||
/** function ค้นหาข้อมูลใน Table*/
|
||||
async function filterListLeave() {
|
||||
filter.status && filter.type && (await updateQuerySting(1, 10, filter));
|
||||
}
|
||||
|
||||
/** Option*/
|
||||
const optionYear = ref<DataOption2[]>([
|
||||
{
|
||||
id: 0,
|
||||
name: "ทั้งหมด",
|
||||
},
|
||||
{
|
||||
id: 2023,
|
||||
name: "2566",
|
||||
},
|
||||
]);
|
||||
const optionType = ref<DataOption[]>([
|
||||
{
|
||||
id: "00000000-0000-0000-0000-000000000000",
|
||||
name: "ทั้งหมด",
|
||||
},
|
||||
]);
|
||||
const optionStatus = ref<DataOption[]>([
|
||||
{
|
||||
id: "ALL",
|
||||
name: "ทั้งหมด",
|
||||
},
|
||||
{
|
||||
id: "NEW",
|
||||
name: "ใหม่",
|
||||
},
|
||||
{
|
||||
id: "PENDING ",
|
||||
name: "กำลังดำเนินการ",
|
||||
},
|
||||
{
|
||||
id: "APPROVE ",
|
||||
name: "อนุมัติ",
|
||||
},
|
||||
{
|
||||
id: "REJECT ",
|
||||
name: "ไม่อนุมัติ",
|
||||
},
|
||||
]);
|
||||
const optionTypeMain = ref<DataOption[]>(optionType.value);
|
||||
const optionStatusMain = ref<DataOption[]>(optionStatus.value);
|
||||
|
||||
async function fetchOption() {
|
||||
console.log("loadOption รอ API");
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่นค้นหาข้อมูลของ Option Filter
|
||||
* @param val คำที่ค้นหา
|
||||
* @param update Function
|
||||
* @param name ประเภทของ Select
|
||||
*/
|
||||
function filterOption(val: string, update: any, name: string) {
|
||||
update(() => {
|
||||
const needle = val.toLowerCase();
|
||||
if (name === "type") {
|
||||
optionType.value = optionTypeMain.value.filter(
|
||||
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
|
||||
);
|
||||
} else if (name === "status") {
|
||||
optionStatus.value = optionStatusMain.value.filter(
|
||||
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
await fetchOption();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -15,11 +122,12 @@ const { searchDataFn, filterOption } = leaveStore;
|
|||
map-options
|
||||
outlined
|
||||
dense
|
||||
v-model="leaveStore.selectYear"
|
||||
:options="leaveStore.optionYear"
|
||||
v-model="filter.year"
|
||||
:options="optionYear"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
label="ปีงบประมาณ"
|
||||
@update:model-value="filterListLeave"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-3 col-md-2">
|
||||
|
|
@ -29,14 +137,12 @@ const { searchDataFn, filterOption } = leaveStore;
|
|||
map-options
|
||||
outlined
|
||||
dense
|
||||
v-model="leaveStore.selectType"
|
||||
:options="leaveStore.leaveOps"
|
||||
v-model="filter.type"
|
||||
:options="optionType"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
label="ประเภทการลา"
|
||||
@update:model-value="
|
||||
searchDataFn(leaveStore.selectType, leaveStore.selectStatus)
|
||||
"
|
||||
@update:model-value="filterListLeave"
|
||||
use-input
|
||||
@filter="
|
||||
(inputValue:any, doneFn:Function) =>
|
||||
|
|
@ -57,14 +163,12 @@ const { searchDataFn, filterOption } = leaveStore;
|
|||
map-options
|
||||
outlined
|
||||
dense
|
||||
v-model="leaveStore.selectStatus"
|
||||
:options="leaveStore.statusOps"
|
||||
v-model="filter.status"
|
||||
:options="optionStatus"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
label="สถานะ"
|
||||
@update:model-value="
|
||||
searchDataFn(leaveStore.selectType, leaveStore.selectStatus)
|
||||
"
|
||||
@update:model-value="filterListLeave"
|
||||
use-input
|
||||
@filter="
|
||||
(inputValue:any, doneFn:Function) =>
|
||||
|
|
@ -84,8 +188,9 @@ const { searchDataFn, filterOption } = leaveStore;
|
|||
for="filterTable"
|
||||
dense
|
||||
outlined
|
||||
v-model="leaveStore.filterTable"
|
||||
v-model="filter.keyword"
|
||||
label="ค้นหา"
|
||||
@keydown.enter.prevent="filterListLeave"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-3 col-md-2">
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
interface DataOption {
|
||||
id: string;
|
||||
name: string;
|
||||
id: string;
|
||||
name: string;
|
||||
}
|
||||
export type {
|
||||
DataOption
|
||||
};
|
||||
interface DataOption2 {
|
||||
id: number;
|
||||
name: string;
|
||||
}
|
||||
export type { DataOption, DataOption2 };
|
||||
|
|
|
|||
|
|
@ -5,6 +5,21 @@ interface ListsData {
|
|||
Date: Date;
|
||||
status: string;
|
||||
}
|
||||
interface QuerySting {
|
||||
year: number; //*ปีในการยื่นขอใบลา(ใช้เป็น คศ.)
|
||||
type: string; //*Id ประเภทการลา
|
||||
status: string; //*สถานะการของลา
|
||||
page: number; //*หน้า
|
||||
pageSize: number; //*จำนวนแถวต่อหน้า
|
||||
keyword: string; //keyword ค้นหา
|
||||
}
|
||||
|
||||
interface DateFilter {
|
||||
year: number; //*ปีในการยื่นขอใบลา(ใช้เป็น คศ.)
|
||||
type: string; //*Id ประเภทการลา
|
||||
status: string; //*สถานะการของลา
|
||||
keyword: string; //keyword ค้นหา
|
||||
}
|
||||
interface FremData {
|
||||
id: string; //Id การยื่นขอลา
|
||||
leaveTypeName: string | null; //Name ประเภทการลา
|
||||
|
|
@ -63,4 +78,4 @@ interface FremData {
|
|||
coupleDaySumTotalHistory: string; //ประวัติ ในกรณีลาติดต่อกับครั้งก่อน รวมทั้งนี้ด้วย เป็นเวลา กี่ปี กี่เดือน กี่วัน (ลาติดตามคู่สมรส)
|
||||
}
|
||||
|
||||
export type { ListsData, FremData };
|
||||
export type { ListsData, FremData, QuerySting, DateFilter };
|
||||
|
|
|
|||
|
|
@ -1,8 +1,10 @@
|
|||
interface DataRows {
|
||||
leaveType: string;
|
||||
name: string;
|
||||
Date: string;
|
||||
status: string;
|
||||
id: string; //*Id การยื่นขอลา
|
||||
leaveTypeName: string | null; //Name ประเภทการลา
|
||||
leaveTypeId: string; //Id ประเภทการลา
|
||||
fullname: string; //คำนำหน้า ชื่อ นามสกุล คนขอลา
|
||||
dateSendLeave: string | null; //วันที่ยื่นใบลา
|
||||
status: string | null; //ส
|
||||
}
|
||||
interface FormData {
|
||||
id: string;
|
||||
|
|
|
|||
|
|
@ -1,29 +1,48 @@
|
|||
interface TableRows {
|
||||
id: string; //id รายการลงเวลาปฏิบัติงาน
|
||||
fullName: String; //ชื่อ-นามสกุล
|
||||
fullName: string; //ชื่อ-นามสกุล
|
||||
checkDate: string | null; //วันที่เข้างาน
|
||||
checkInTime: string; //เวลาเข้างาน
|
||||
checkInLocation: String; //พิกัดเข้างาน
|
||||
checkInLat: String; //อัลติจูดเข้างาน
|
||||
checkInLon: String; //ละติจูดเข้างาน
|
||||
checkOutLocation: String; //พิกัดออกงาน
|
||||
checkInLocation: string; //พิกัดเข้างาน
|
||||
checkInLat: string; //อัลติจูดเข้างาน
|
||||
checkInLon: string; //ละติจูดเข้างาน
|
||||
checkOutLocation: string; //พิกัดออกงาน
|
||||
checkOutTime: string; //เวลาออกงาน
|
||||
checkOutLat: String; //อัลติจูดออกงาน
|
||||
checkOutLon: String; //ละติจูดออกงาน
|
||||
checkOutLat: string; //อัลติจูดออกงาน
|
||||
checkOutLon: string; //ละติจูดออกงาน
|
||||
}
|
||||
|
||||
interface TableRowsTime {
|
||||
id: string; //id รายการลงเวลาปฏิบัติงาน
|
||||
fullName: string; //ชื่อ-นามสกุล
|
||||
checkInDate: string | null; //วันที่เข้างาน
|
||||
checkInTime: string; //เวลาเข้างาน
|
||||
checkInLocation: string; //พิกัดเข้างาน
|
||||
checkInLat: string; //อัลติจูดเข้างาน
|
||||
checkInLon: string; //ละติจูดเข้างาน
|
||||
checkInStatus: string | undefined; //สถานะการลงเวลาเข้างาน
|
||||
checkOutDate: string | null;
|
||||
checkOutLocation: string; //พิกัดออกงาน
|
||||
checkOutTime: string; //เวลาออกงาน
|
||||
checkOutLat: string; //อัลติจูดออกงาน
|
||||
checkOutLon: string; //ละติจูดออกงาน
|
||||
checkOutStatus: string | undefined; //สถานะการลงเวลาออกงาน
|
||||
}
|
||||
interface DataResTime {
|
||||
id: string; //id รายการลงเวลาปฏิบัติงาน
|
||||
fullName: String; //ชื่อ-นามสกุล
|
||||
checkDate: Date | null; //วันที่เข้างาน
|
||||
fullName: string; //ชื่อ-นามสกุล
|
||||
checkInDate: Date | null; //วันที่เข้างาน
|
||||
checkInTime: string; //เวลาเข้างาน
|
||||
checkInLocation: String; //พิกัดเข้างาน
|
||||
checkInLat: String; //อัลติจูดเข้างาน
|
||||
checkInLon: String; //ละติจูดเข้างาน
|
||||
checkOutLocation: String; //พิกัดออกงาน
|
||||
checkInLocation: string; //พิกัดเข้างาน
|
||||
checkInLat: string; //อัลติจูดเข้างาน
|
||||
checkInLon: string; //ละติจูดเข้างาน
|
||||
checkInStatus: string; //สถานะการลงเวลาเข้างาน
|
||||
checkOutDate: Date | null; //วันที่ออกงาน
|
||||
checkOutLocation: string; //พิกัดออกงาน
|
||||
checkOutTime: string; //เวลาออกงาน
|
||||
checkOutLat: String; //อัลติจูดออกงาน
|
||||
checkOutLon: String; //ละติจูดออกงาน
|
||||
checkStatus: string;
|
||||
checkOutLat: string; //อัลติจูดออกงาน
|
||||
checkOutLon: string; //ละติจูดออกงาน
|
||||
checkOutStatus: string; //สถานะการลงเวลาออกงาน
|
||||
}
|
||||
interface DataResLog {
|
||||
id: string; //id รายการลงเวลาปฏิบัติงาน
|
||||
|
|
@ -38,4 +57,4 @@ interface DataResLog {
|
|||
checkOutLat: String; //อัลติจูดออกงาน
|
||||
checkOutLon: String; //ละติจูดออกงาน
|
||||
}
|
||||
export type { TableRows, DataResLog, DataResTime };
|
||||
export type { TableRows, DataResLog, DataResTime, TableRowsTime };
|
||||
|
|
|
|||
|
|
@ -3,43 +3,20 @@ import { ref, onMounted } from "vue";
|
|||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
/** importType*/
|
||||
import type { DataOption } from "@/modules/09_leave/interface/index/Main";
|
||||
import type { QTableProps } from "quasar";
|
||||
import type { DataRows } from "@/modules/09_leave/interface/response/leave";
|
||||
import type {
|
||||
ListsData,
|
||||
FremData,
|
||||
} from "@/modules/09_leave/interface/request/leave";
|
||||
import type { FremData } from "@/modules/09_leave/interface/request/leave";
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const { date2Thai, showLoader, hideLoader } = mixin;
|
||||
|
||||
export const useLeavelistDataStore = defineStore("leave", () => {
|
||||
/** TABMENU*/
|
||||
const amounttab1 = ref<number>(0);
|
||||
const amounttab2 = ref<number>(0);
|
||||
|
||||
/**ข้อมูลใน Table*/
|
||||
const mainData = ref<any>([]);
|
||||
const rows = ref<DataRows[]>([]);
|
||||
|
||||
const columns = ref<QTableProps["columns"]>([]);
|
||||
const visibleColumns = ref<string[]>([]);
|
||||
const loadTable = ref<boolean>(false);
|
||||
const leaveOp = [
|
||||
{ id: "all", name: "ทั้งหมด" },
|
||||
{ id: "leave1", name: "ลากิจส่วนตัว" },
|
||||
{ id: "leave2", name: "ลาป่วย" },
|
||||
];
|
||||
const statusOp = [
|
||||
{ id: "all", name: "ทั้งหมด" },
|
||||
{ id: "NEW", name: "ใหม่" },
|
||||
{ id: "PENDING", name: "อยู่ระหว่างดำเนินการ" },
|
||||
{ id: "APPROVE", name: "อนุมัติ" },
|
||||
{ id: "REJECT", name: "ไม่อนุมัติ" },
|
||||
];
|
||||
const leaveOps = ref<any>(leaveOp);
|
||||
const statusOps = ref<any>(statusOp);
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่น fetchList
|
||||
* @param data รับข้อมูลจาก Page
|
||||
|
|
@ -55,101 +32,7 @@ export const useLeavelistDataStore = defineStore("leave", () => {
|
|||
}));
|
||||
console.log(datalist);
|
||||
mainData.value = datalist;
|
||||
// const filteramounttab1 = datalist.filter((e) => e.status === "PENDING");
|
||||
// amounttab1.value = filteramounttab1.length;
|
||||
// amounttab2.value = datalist.length;
|
||||
await searchDataFn(selectType.value, selectStatus.value);
|
||||
}
|
||||
|
||||
/**ref ของการค้นหาข้อมูล */
|
||||
const selectYear = ref<string>("all");
|
||||
const selectType = ref<string>("all");
|
||||
const selectStatus = ref<string>("all");
|
||||
const optionYear = ref<DataOption[]>([{ id: "all", name: "ทั้งหมด" }]);
|
||||
const optionType = ref<DataOption[]>([]);
|
||||
const optionStatus = ref<DataOption[]>([]);
|
||||
const optionTypeMain = ref<DataOption[]>([]);
|
||||
const optionStatusMain = ref<DataOption[]>([]);
|
||||
const filterTable = ref<string>("");
|
||||
/**
|
||||
* ฟังก์ชั่นค้นหาข้อมูลใน Table
|
||||
* @param type รับข้อมูลประเภท
|
||||
* @param status รับค่าสถานะ
|
||||
*/
|
||||
function searchDataFn(type: string, status: string) {
|
||||
type = type || "all";
|
||||
status = convertSatatus(status) || "all";
|
||||
// showLoader()
|
||||
loadTable.value = true;
|
||||
if (selectYear.value == "all" && type == "all" && status == "all") {
|
||||
console.log(1);
|
||||
rows.value = mainData.value;
|
||||
} else if (selectYear.value !== "all" && type == "all" && status == "all") {
|
||||
console.log(2);
|
||||
} else if (selectYear.value == "all" && type !== "all" && status == "all") {
|
||||
console.log(3);
|
||||
rows.value = mainData.value.filter((e: any) => e.leaveTypeId === type);
|
||||
} else if (selectYear.value == "all" && type == "all" && status !== "all") {
|
||||
console.log(4);
|
||||
console.log(status);
|
||||
|
||||
rows.value = mainData.value.filter((e: any) => e.status === status);
|
||||
} else if (
|
||||
selectYear.value !== "all" &&
|
||||
type !== "all" &&
|
||||
status == "all"
|
||||
) {
|
||||
console.log(5);
|
||||
} else if (
|
||||
selectYear.value !== "all" &&
|
||||
type == "all" &&
|
||||
status !== "all"
|
||||
) {
|
||||
console.log(6);
|
||||
} else if (
|
||||
selectYear.value == "all" &&
|
||||
type !== "all" &&
|
||||
status !== "all"
|
||||
) {
|
||||
console.log(7);
|
||||
rows.value = mainData.value.filter(
|
||||
(e: any) => e.leaveTypeId === type && e.status === status
|
||||
);
|
||||
} else console.log("ค้นหาจากทั้งหมด");
|
||||
setTimeout(function () {
|
||||
loadTable.value = false;
|
||||
}, 500);
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่นเคลียร์ข้อมูลค้นหา
|
||||
*/
|
||||
function clearFilter() {
|
||||
selectYear.value = "all";
|
||||
selectType.value = "all";
|
||||
selectStatus.value = "all";
|
||||
filterTable.value = "";
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชั่นค้นหาข้อมูลของ Option Filter
|
||||
* @param val คำที่ค้นหา
|
||||
* @param update Function
|
||||
* @param name ประเภทของ Select
|
||||
*/
|
||||
function filterOption(val: string, update: any, name: string) {
|
||||
update(() => {
|
||||
const needle = val.toLowerCase();
|
||||
if (name === "type") {
|
||||
leaveOps.value = leaveOp.filter(
|
||||
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
|
||||
);
|
||||
} else if (name === "status") {
|
||||
statusOps.value = statusOp.filter(
|
||||
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
|
||||
);
|
||||
}
|
||||
});
|
||||
rows.value = mainData.value;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -220,30 +103,12 @@ export const useLeavelistDataStore = defineStore("leave", () => {
|
|||
}
|
||||
|
||||
return {
|
||||
amounttab1,
|
||||
amounttab2,
|
||||
/**ข้อมูลใน Table */
|
||||
rows,
|
||||
fetchList,
|
||||
loadTable,
|
||||
columns,
|
||||
visibleColumns,
|
||||
|
||||
/**ค้นหาข้อมูล */
|
||||
filterTable,
|
||||
selectYear,
|
||||
selectType,
|
||||
selectStatus,
|
||||
optionYear,
|
||||
optionType,
|
||||
optionStatus,
|
||||
clearFilter,
|
||||
searchDataFn,
|
||||
filterOption,
|
||||
leaveOp,
|
||||
statusOp,
|
||||
leaveOps,
|
||||
statusOps,
|
||||
/** Function แปลงค่า */
|
||||
convertLeave,
|
||||
convertLeaveDaytype,
|
||||
|
|
|
|||
|
|
@ -1,7 +1,11 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, onMounted } from "vue";
|
||||
import { ref, reactive, onMounted } from "vue";
|
||||
|
||||
/**importType*/
|
||||
import type {
|
||||
QuerySting,
|
||||
DateFilter,
|
||||
} from "@/modules/09_leave/interface/request/leave";
|
||||
import type { DataRows } from "@/modules/09_leave/interface/response/leave";
|
||||
|
||||
/**importStroe*/
|
||||
|
|
@ -14,30 +18,55 @@ import ToolBar from "@/modules/09_leave/components/2_Leave/ToolBar.vue";
|
|||
|
||||
const leaveStore = useLeavelistDataStore();
|
||||
const APIDATA = useLeavelistDataStoreTest();
|
||||
const { fetchList, clearFilter } = leaveStore;
|
||||
const { fetchList } = leaveStore;
|
||||
|
||||
/** เรียกข้อมูลจาก API*/
|
||||
function fecthLeaveList() {
|
||||
const data = APIDATA.data;
|
||||
maxPage.value = Math.ceil(data.length / querySting.pageSize);
|
||||
fetchList(data); /** ส่งข้อมูลไป stores*/
|
||||
}
|
||||
|
||||
function updatePaging(
|
||||
newPage: number,
|
||||
pageSize: number,
|
||||
dateFilter: DateFilter
|
||||
) {
|
||||
querySting.year = dateFilter ? dateFilter.year : querySting.year;
|
||||
querySting.type = dateFilter ? dateFilter.type : querySting.type;
|
||||
querySting.status = dateFilter ? dateFilter.status : querySting.status;
|
||||
querySting.page = newPage;
|
||||
querySting.pageSize = pageSize;
|
||||
querySting.keyword = dateFilter ? dateFilter.keyword : querySting.keyword;
|
||||
|
||||
console.log(querySting);
|
||||
}
|
||||
|
||||
const maxPage = ref<number>(1);
|
||||
const querySting = reactive<QuerySting>({
|
||||
year: 0, //*ปีในการยื่นขอใบลา(ใช้เป็น คศ.)
|
||||
type: "00000000-0000-0000-0000-000000000000", //*Id ประเภทการลา
|
||||
status: "ALL", //*สถานะการของลา
|
||||
page: 1, //*หน้า
|
||||
pageSize: 5, //*จำนวนแถวต่อหน้า
|
||||
keyword: "", //keyword ค้นหา
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
fecthLeaveList();
|
||||
});
|
||||
/** เรียกข้อมูลจาก API*/
|
||||
function fecthLeaveList() {
|
||||
const data = APIDATA.data;
|
||||
|
||||
fetchList(data); /** ส่งข้อมูลไป stores*/
|
||||
}
|
||||
|
||||
/** เปลี่ยน TAB*/
|
||||
function changTab() {
|
||||
clearFilter();
|
||||
fecthLeaveList();
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<div class="toptitle text-dark col-12 row items-center">รายการลา</div>
|
||||
<div>
|
||||
<q-card flat bordered class="col-12 q-mt-sm q-pt-sm q-pa-md">
|
||||
<ToolBar />
|
||||
<TableList />
|
||||
<ToolBar @update:querySting="updatePaging" />
|
||||
<TableList
|
||||
:page="querySting.page"
|
||||
:rowsPerPage="querySting.pageSize"
|
||||
:maxPage="maxPage"
|
||||
@update:querySting="updatePaging"
|
||||
/>
|
||||
</q-card>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue