Merge branch 'develop' into devTee

# Conflicts:
#	src/modules/04_registryPerson/components/requestEdit/01_TabInformation.vue
This commit is contained in:
setthawutttty 2024-10-11 15:51:39 +07:00
commit ea01d168cb
20 changed files with 384 additions and 328 deletions

View file

@ -147,7 +147,6 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
]);
const columnsPostition = ref<QTableProps["columns"]>([
{
name: "no",
@ -222,7 +221,6 @@ const columnsPostition = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
]);
const visibleColumns = ref<string[]>([
"isPosition",
"no",
@ -505,7 +503,7 @@ function onSubmit() {
posmasterId: dataPosMaster.id,
typeCommand: type.value,
};
props.onSubmit?.(body);
await props.onSubmit?.(body);
close();
});
}

View file

@ -8,7 +8,9 @@ import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import { useOrganizational } from "@/modules/02_organization/store/organizational";
import { useStructStore } from "@/modules/02_organization/store/chart";
const storeOrg = useStructStore();
const $q = useQuasar();
const mixin = useCounterMixin();
const store = useOrganizational();

View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, onMounted, watch } from "vue";
import { ref, onMounted, watch, onBeforeMount } from "vue";
import { useQuasar } from "quasar";
import { OrgChart } from "bma-org-chart";
import "bma-org-chart/org-chart.css";
@ -9,11 +9,13 @@ import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import { useOrganizational } from "@/modules/02_organization/store/organizational";
import { useStructStore } from "@/modules/02_organization/store/chart";
import avatar from "@/assets/avatar_user.jpg";
import chartData from "@/assets/orgChartData";
const mixin = useCounterMixin();
const store = useOrganizational();
const storeOrg = useStructStore();
const { showLoader, hideLoader, messageError } = mixin;
const $q = useQuasar(); // show dialog
@ -34,10 +36,11 @@ async function fetchOrgChart() {
.get(urlRequest)
.then(async (response) => {
if (response.data.result.length > 0) {
const data = response.data.result;
const data = await response.data.result;
const updatedData = await Promise.all(data.map(addAvatarToData));
dataSource.value = updatedData[0];
dataSource.value = await updatedData[0];
storeOrg.dataSource = updatedData[0];
if (dataSourceLock.value === undefined)
dataSourceLock.value = dataSource.value;
@ -109,7 +112,7 @@ function savePDF() {
watch(
[() => store.typeOrganizational, () => store.historyId],
async ([new1], [old1]) => {
([new1], [old1]) => {
if (new1 === "old" && old1 !== "old") {
store.historyId = "";
}
@ -121,7 +124,7 @@ watch(
? store.draftId
: store.historyId;
await fetchOrgChart();
fetchOrgChart();
}
);
@ -133,7 +136,11 @@ onMounted(async () => {
? store.draftId
: store.historyId;
await fetchOrgChart();
fetchOrgChart();
});
onBeforeMount(() => {
storeOrg.dataSource = undefined;
});
</script>
@ -158,6 +165,7 @@ onMounted(async () => {
<q-separator />
<div style="overflow-x: auto; overflow-y: auto" class="q-pt-md">
<OrgChart
v-if="storeOrg.dataSource"
style="height: 70vh"
ref="chartRef"
class="org"

View file

@ -0,0 +1,9 @@
import { defineStore } from "pinia";
import { ref } from "vue";
export const useStructStore = defineStore("StructStore", () => {
const dataSource = ref();
return {
dataSource,
};
});

View file

@ -111,6 +111,43 @@ async function closeDialog() {
modal.value = false;
count.value = 0;
childData.value = [];
formInformations.bloodGroup = null;
formInformations.relationship = null;
formInformations.gender = null;
formInformations.religion = null;
formInformations.citizenId = "";
formInformations.nationality = null;
formInformations.ethnicity = null;
formInformations.birthDate = null;
formInformations.phone = null;
formInformations.lastName = "";
formInformations.firstName = "";
formInformations.prefix = "";
formInformations.rank = null;
fatherData.isLive = 1;
fatherData.citizenId = "";
fatherData.prefix = "";
fatherData.firstName = "";
fatherData.lastName = "";
fatherData.job = "";
motherData.isLive = 1;
motherData.citizenId = "";
motherData.prefix = "";
motherData.firstName = "";
motherData.lastName = "";
motherData.job = "";
coupleData.isLive = 1;
coupleData.citizenId = "";
coupleData.prefix = "";
coupleData.firstName = "";
coupleData.lastName = "";
coupleData.job = "";
coupleData.lastNameOld = "";
coupleData.statusMarital = "";
}
/** อัพเดตข้อมูลส่วนตัว */
@ -161,9 +198,13 @@ async function upDateAddress() {
async function upDateFamily() {
await saveFather();
await saveMother();
await saveCouple();
for (const child of childData.value) {
await saveChildren(child);
if (coupleData.citizenId !== "") {
await saveCouple();
}
if (childData.value.length !== 0) {
for (const child of childData.value) {
await saveChildren(child);
}
}
count.value + 1;
}

View file

@ -378,7 +378,7 @@ onMounted(() => {
color="primary"
@click.pervent="onDownloadFile(props.row.id)"
>
<q-tooltip>หลกฐานอางอ</q-tooltip>
<q-tooltip>ดาวนโหลดเอกสารหลกฐาน</q-tooltip>
</q-btn>
</div>
<div v-else class="table_ellipsis2">

View file

@ -276,7 +276,6 @@ watch(
}
);
/** HooK lifecycle ทำงานเมื่อมีการเรียกใช้งาน Componenets*/
onMounted(() => {
fetchData();
@ -402,7 +401,7 @@ onMounted(() => {
color="primary"
@click.pervent="onDownloadFile(props.row.id)"
>
<q-tooltip>หลกฐานอางอ</q-tooltip>
<q-tooltip>ดาวนโหลดเอกสารหลกฐาน</q-tooltip>
</q-btn>
</div>
<div v-else>

View file

@ -252,18 +252,18 @@ watch(modal, (val) => {
<template>
<q-dialog v-model="modal" persistent>
<q-card style="min-width: 65%">
<q-form greedy @submit.prevent @validation-success="onSubmit">
<DialogHeader
:tittle="`${formData.createdFullName}
<DialogHeader
:tittle="`${formData.createdFullName}
(ขอแกไขเม ${
formData.createdAt ? date2Thai(formData.createdAt, true, true) : ''
})`"
:close="closeDialog"
/>
<q-separator />
:close="closeDialog"
/>
<q-separator />
<!-- สถานะคำรอง -->
<q-card-section>
<!-- สถานะคำรอง -->
<q-form greedy @submit.prevent @validation-success="onSubmit">
<q-card-section v-if="formData.status == 'PENDING'">
<q-card bordered class="col-12">
<div class="row q-pa-md q-col-gutter-sm">
<!-- สถานะ -->
@ -320,171 +320,171 @@ watch(modal, (val) => {
</q-card-actions>
</q-card>
</q-card-section>
<!-- รายละเอยด -->
<q-card-section class="q-pt-none">
<q-card bordered class="col-12">
<div class="col-12 text-weight-medium bg-grey-1 q-py-xs q-px-md">
รายละเอยด
</div>
<q-separator />
<div class="row q-col-gutter-sm q-pa-md">
<div class="col-12">
<q-input
readonly
outlined
v-model="formData.topic"
label="ชื่อเรื่อง/เนื้อเรื่อง/หัวข้อการพัฒนา"
dense
/>
</div>
<div class="col-12">
<div class="q-mb-sm text-weight-medium text-body2">
การพฒนา
</div>
<div class="row col-12 q-ml-md q-col-gutter-sm">
<!-- 70 การลงมอปฏ (โดยผงคบบญชามอบหมาย) -->
<div class="col-4">
<div class="q-mb-sm text-weight-medium text-body2">
70 การลงมอปฏ (โดยผงคบบญชามอบหมาย)
</div>
<q-option-group
disable
class="check_box q-mt-sm"
keep-color
color="primary"
dense
v-model="formData.developmentProjects"
:options="itemsDevelopment70"
type="checkbox"
/>
<div
class="row"
v-if="formData.developmentProjects.includes('other1')"
>
<div class="col-8 q-mt-sm relative-position">
<div class="other_custom_input">
<q-input
readonly
v-model="formData.reasonDevelopment70"
dense
outlined
label="กรุณาระบุ"
></q-input>
</div>
</div>
</div>
</div>
<!-- 20 การเรยนรจากผ (Coach/Mentor/Consulting) -->
<div class="col-4">
<div class="q-mb-sm text-weight-medium text-body2">
20 การเรยนรจากผ (Coach/Mentor/Consulting)
</div>
<q-option-group
disable
class="check_box q-mt-sm"
keep-color
color="primary"
dense
v-model="formData.developmentProjects"
:options="itemsDevelopment20"
type="checkbox"
/>
<div
class="row"
v-if="formData.developmentProjects.includes('other2')"
>
<div class="col-8 q-mt-sm relative-position">
<div class="other_custom_input">
<q-input
readonly
v-model="formData.reasonDevelopment20"
dense
outlined
label="กรุณาระบุ"
></q-input>
</div>
</div>
</div>
</div>
<!-- 10 การฝกอบรมอนๆ -->
<div class="col-4">
<div class="q-mb-sm text-weight-medium text-body2">
10 การฝกอบรมอนๆ
</div>
<q-option-group
disable
class="check_box q-mt-sm"
keep-color
color="primary"
dense
v-model="formData.developmentProjects"
:options="itemsDevelopment10"
type="checkbox"
/>
<div
class="row"
v-if="formData.developmentProjects.includes('other3')"
>
<div class="offset-4 col-8 q-mt-sm relative-position">
<div class="other_custom_input">
<q-input
readonly
v-model="formData.reasonDevelopment10"
dense
outlined
label="กรุณาระบุ"
></q-input>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- เปาหมายการนำไปพฒนางาน -->
<div class="col-12">
<q-input
readonly
outlined
v-model="formData.developmentTarget"
label="เป้าหมายการนำไปพัฒนางาน"
dense
type="textarea"
/>
</div>
<!-- การวดผลการพฒนา -->
<div class="col-12">
<q-input
readonly
outlined
v-model="formData.developmentResults"
label="วิธีการวัดผลการพัฒนา"
dense
type="textarea"
/>
</div>
<!-- รายงานผลการพฒนา -->
<div class="col-12">
<q-input
readonly
outlined
v-model="formData.developmentReport"
label="รายงานผลการพัฒนา"
dense
type="textarea"
/>
</div>
</div>
</q-card>
</q-card-section>
</q-form>
<!-- รายละเอยด -->
<q-card-section class="q-pt-sm">
<q-card bordered class="col-12">
<div class="col-12 text-weight-medium bg-grey-1 q-py-xs q-px-md">
รายละเอยด
</div>
<q-separator />
<div class="row q-col-gutter-sm q-pa-md">
<div class="col-12">
<q-input
readonly
outlined
v-model="formData.topic"
label="ชื่อเรื่อง/เนื้อเรื่อง/หัวข้อการพัฒนา"
dense
/>
</div>
<div class="col-12">
<div class="q-mb-sm text-weight-medium text-body2">
การพฒนา
</div>
<div class="row col-12 q-ml-md q-col-gutter-sm">
<!-- 70 การลงมอปฏ (โดยผงคบบญชามอบหมาย) -->
<div class="col-4">
<div class="q-mb-sm text-weight-medium text-body2">
70 การลงมอปฏ (โดยผงคบบญชามอบหมาย)
</div>
<q-option-group
disable
class="check_box q-mt-sm"
keep-color
color="primary"
dense
v-model="formData.developmentProjects"
:options="itemsDevelopment70"
type="checkbox"
/>
<div
class="row"
v-if="formData.developmentProjects.includes('other1')"
>
<div class="col-8 q-mt-sm relative-position">
<div class="other_custom_input">
<q-input
readonly
v-model="formData.reasonDevelopment70"
dense
outlined
label="กรุณาระบุ"
></q-input>
</div>
</div>
</div>
</div>
<!-- 20 การเรยนรจากผ (Coach/Mentor/Consulting) -->
<div class="col-4">
<div class="q-mb-sm text-weight-medium text-body2">
20 การเรยนรจากผ (Coach/Mentor/Consulting)
</div>
<q-option-group
disable
class="check_box q-mt-sm"
keep-color
color="primary"
dense
v-model="formData.developmentProjects"
:options="itemsDevelopment20"
type="checkbox"
/>
<div
class="row"
v-if="formData.developmentProjects.includes('other2')"
>
<div class="col-8 q-mt-sm relative-position">
<div class="other_custom_input">
<q-input
readonly
v-model="formData.reasonDevelopment20"
dense
outlined
label="กรุณาระบุ"
></q-input>
</div>
</div>
</div>
</div>
<!-- 10 การฝกอบรมอนๆ -->
<div class="col-4">
<div class="q-mb-sm text-weight-medium text-body2">
10 การฝกอบรมอนๆ
</div>
<q-option-group
disable
class="check_box q-mt-sm"
keep-color
color="primary"
dense
v-model="formData.developmentProjects"
:options="itemsDevelopment10"
type="checkbox"
/>
<div
class="row"
v-if="formData.developmentProjects.includes('other3')"
>
<div class="offset-4 col-8 q-mt-sm relative-position">
<div class="other_custom_input">
<q-input
readonly
v-model="formData.reasonDevelopment10"
dense
outlined
label="กรุณาระบุ"
></q-input>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- เปาหมายการนำไปพฒนางาน -->
<div class="col-12">
<q-input
readonly
outlined
v-model="formData.developmentTarget"
label="เป้าหมายการนำไปพัฒนางาน"
dense
type="textarea"
/>
</div>
<!-- การวดผลการพฒนา -->
<div class="col-12">
<q-input
readonly
outlined
v-model="formData.developmentResults"
label="วิธีการวัดผลการพัฒนา"
dense
type="textarea"
/>
</div>
<!-- รายงานผลการพฒนา -->
<div class="col-12">
<q-input
readonly
outlined
v-model="formData.developmentReport"
label="รายงานผลการพัฒนา"
dense
type="textarea"
/>
</div>
</div>
</q-card>
</q-card-section>
</q-card>
</q-dialog>
</template>

View file

@ -812,6 +812,7 @@ onMounted(async () => {
: formDetail.prefix ?? ""
}${formDetail.firstName} ${formDetail.lastName}`
}}
<span class="text-red"> {{ leaveReason }}</span>
</h2>
</div>
</div>

View file

@ -744,7 +744,8 @@ function onSubmitDate() {
function openModalOrder(val: boolean) {
// object #e.draft == "" &&
rowsOrder.value = rows.value.filter(
(e: any) => e.nodeName !== null && e.reportingDate !== null
(e: any) =>
e.nodeName !== null && e.reportingDate !== null && e.statusId !== "REPORT"
);
modalOrder.value = val;
}
@ -808,6 +809,7 @@ onMounted(async () => {
<q-btn
v-if="
props.row.statusId !== 'DONE' &&
props.row.statusId !== 'REPORT' &&
(checkPermission($route)?.attrIsGet ||
checkPermission($route)?.attrIsUpdate)
"

View file

@ -296,7 +296,7 @@ function openModalOrder() {
modal.value = true;
}
function onSave(data: any) {
async function onSave(data: any) {
const dataAppoint = {
node: data.node,
nodeId: data.nodeId,
@ -314,7 +314,7 @@ function onSave(data: any) {
};
showLoader();
http
await http
.put(config.API.receivePosition(personalId.value), dataAppoint)
.then(async () => {
await fecthlistRecevice();

View file

@ -414,7 +414,7 @@ watch(
"
label="วัน/เดือน/ปี เกิด"
:rules="[
(val) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี เกิด'}`,
(val:string) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี เกิด'}`,
]"
>
<template v-slot:prepend>

View file

@ -13,6 +13,7 @@ import type { DataEmployee } from "@/modules/08_registryEmployee/interface/respo
/** importComponents*/
import DialogHeader from "@/components/DialogHeader.vue";
import DialogCreateCommand from "@/modules/18_command/components/DialogCreateCommand.vue";
const $q = useQuasar();
const {
@ -164,9 +165,9 @@ const visibleColumns = ref<String[]>([
"statustext",
]);
/**
* งกนยนยนการสงออกคำส
*/
const modalCommand = ref<boolean>(false); //
/** ฟังก์ชันยืนยันการส่งออกคำสั่ง*/
function onClickSendOrder() {
if (selected.value.length == 0) {
dialogMessageNotify($q, "กรุณาเลือกคนออกคำสั่ง");
@ -174,27 +175,8 @@ function onClickSendOrder() {
dialogConfirm(
$q,
() => {
showLoader();
let pId: string[] = [];
selected.value.forEach((e: any) => {
pId.push(e.id);
});
let data = {
id: pId,
};
http
.post(config.API.orgProfileReport, data)
.then(async () => {
await props?.fetchData?.();
await success($q, "บันทึกสำเร็จ");
closeDialog();
})
.catch((err) => {
messageError($q, err);
})
.finally(async () => {
hideLoader();
});
modalCommand.value = true;
closeDialog();
},
"ยื่นยันการส่งรายชื่อไปออกคำสั่ง",
"ต้องการยืนยันการส่งรายชื่อไปออกคำสั่งนี้หรือไม่ ?"
@ -202,15 +184,17 @@ function onClickSendOrder() {
}
}
/**
* งกนดงขอมลราชชอสงออกคำส
*/
/** ฟังก์ชันดึงข้อมูลราชชื่อส่งออกคำสั่ง*/
function fetchList() {
selected.value = [];
showLoader();
http
.get(config.API.registryNew("-employee") + `/temp`)
.then((res) => {
rows.value = res.data.result.data;
rows.value = res.data.result.data.map((e: DataEmployee) => ({
...e,
profileId: e.id,
}));
})
.catch((err) => {
messageError($q, err);
@ -220,17 +204,13 @@ function fetchList() {
});
}
/**
* งกนป Popup
*/
/** ฟังก์ชันปิด Popup*/
function closeDialog() {
modal.value = false;
selected.value = [];
}
/**
* ทำเม modal เป true
*
* ทำการเรยก fetchList เพอขอมลราชชอสงออกคำส
*/
watch(
@ -243,13 +223,14 @@ watch(
<template>
<q-dialog v-model="modal">
<q-card style="min-width: 80%">
<q-card style="min-width: 70%">
<DialogHeader tittle="ส่งรายชื่อไปออกคำสั่ง" :close="closeDialog" />
<q-separator />
<q-card-section class="q-pt-none">
<div class="row q-col-gutter-sm">
<div class="row">
<div class="col-12">
<q-toolbar style="padding: 0">
<q-space />
<q-input
borderless
outlined
@ -258,7 +239,7 @@ watch(
v-model="filter"
ref="filterRef"
placeholder="ค้นหา"
style="width: 850px; max-width: auto"
style="max-width: auto"
>
<template v-slot:append>
<q-icon name="search" />
@ -336,6 +317,13 @@ watch(
</q-card-actions>
</q-card>
</q-dialog>
<!-- dialog สรางคำส -->
<DialogCreateCommand
v-model:modal="modalCommand"
:command-type-code="'C-PM-21'"
:persons="selected"
/>
</template>
<style scoped></style>

View file

@ -46,6 +46,7 @@ async function fetchData() {
isDraft.value = data.isDraft;
isSign.value = data.isSign;
isAttachment.value = data.isAttachment;
store.readonly = step.value > 2;
})
.catch((err) => {
messageError($q, err);
@ -64,8 +65,8 @@ function onConfirmSignature() {
.put(config.API.command + `/sign/${commandId.value}`, {
sign: signaturetype.value === "Live" ? true : false,
})
.then(async (res) => {
fetchData();
.then(async () => {
await fetchData();
})
.catch((err) => {
messageError($q, err);

View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { onMounted, reactive, ref, watch } from "vue";
import { onMounted, reactive, ref } from "vue";
import { useQuasar } from "quasar";
import { useRoute } from "vue-router";
@ -36,7 +36,7 @@ const props = defineProps({
const commandId = ref<string>(route.params.id.toString()); //ID
//
let formData = reactive<FormDataDetail>({
let formData = reactive({
commandNo: "",
commandYear: null,
detailHeader: "",
@ -46,7 +46,7 @@ let formData = reactive<FormDataDetail>({
commandAffectDate: null, //
commandExcecuteDate: null, //
isBangkok: null,
isAttachment: true,
// isAttachment: true,
});
const modalPreview = ref<boolean>(false); //
const isIdofficer = ref<boolean>(false); // .
@ -102,13 +102,6 @@ onMounted(() => {
: props.formCommandList.isBangkok;
fetchCheckIdofficer();
});
/**
* งกนทองการนำฟงกนออกไปใชใน Components แม
*/
defineExpose({
onSubmit,
});
</script>
<template>

View file

@ -95,8 +95,20 @@ const columns = ref<QTableProps["columns"]>([
return `${row.prefix ?? ""}${row.firstName ?? ""} ${row.lastName ?? ""}`;
},
},
{
name: "amount",
align: "left",
label: "เงินเดือน",
field: "amount",
format(val) {
return val ? val.toLocaleString() : "-";
},
sortable: true,
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
]);
const visibleColumns = ref<String[]>(["no", "citizenId", "fullName"]);
const visibleColumns = ref<String[]>(["no", "citizenId", "fullName", "amount"]);
const modalSalary = ref<boolean>(false);
const titleName = ref<string>("");
@ -122,9 +134,9 @@ async function onSawpPos(val: any, type: string) {
showLoader();
await http
.get(config.API.commandSwap("tab2", type, val.id))
.then((res) => {
.then(async () => {
await getPersonList();
success($q, "แก้ไขข้อมูลสำเร็จ");
getPersonList();
})
.catch((e) => {
messageError($q, e);
@ -139,9 +151,9 @@ function onDelete(id: string) {
showLoader();
await http
.delete(config.API.commandAction(id, "tab2"))
.then((res) => {
.then(async () => {
await getPersonList();
success($q, "ลบข้อมูลสำเร็จ");
getPersonList();
})
.catch((e) => {
messageError($q, e);
@ -221,15 +233,13 @@ async function getCommandSalaryList(type: string) {
});
}
function onSubmit() {}
/** ดึงข้อมูล บุคคล */
async function getPersonList() {
showLoader();
await http
.get(config.API.commandAction(commandId.value, "tab2"))
.then((res) => {
const data = res.data.result;
.then(async (res) => {
const data = await res.data.result;
templatePos.value = data.commandSalaryId;
position.value = data.positionDetail;
rows.value = data.commandRecives;
@ -248,13 +258,6 @@ onMounted(async () => {
await getCommandSalaryList(props.commandSysId);
}
});
/**
* งกนทองการนำฟงกนออกไปใชใน Components แม
*/
defineExpose({
onSubmit,
});
</script>
<template>

View file

@ -196,13 +196,6 @@ function onSubmit() {
onMounted(() => {
fetchData();
});
/**
* งกนทองการนำฟงกนออกไปใชใน Components แม
*/
defineExpose({
onSubmit,
});
</script>
<template>

View file

@ -21,6 +21,9 @@ const mixin = useCounterMixin();
const { messageError, showLoader, hideLoader } = mixin;
const commandId = ref<string>(route.params.id.toString());
const props = defineProps({
formCommandList: { type: Object, required: true },
});
const isAttachment = defineModel<boolean>("isAttachment", { required: true });
@ -90,14 +93,14 @@ async function downloadCover(type: string) {
if (tab.value === "main") {
genReport(
dataCover.value,
"คำสั่ง คำสั่งบรรจุและแต่งตั้ง: สำหรับผู้สอบแข่งขันได้",
`คำสั่ง ${props.formCommandList.issue}`,
type,
"?folder=command"
);
} else {
genReportXLSX(
dataAttachment.value,
"เอกสารแนบท้าย คำสั่งบรรจุและแต่งตั้ง: สำหรับผู้สอบแข่งขันได้",
`เอกสารแนบท้าย ${props.formCommandList.issue}`,
type,
"?folder=command"
);

View file

@ -7,10 +7,10 @@ import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import DialogHeader from "@/components/DialogHeader.vue";
import CurruncyInput from "@/components/CurruncyInput.vue";
const $q = useQuasar();
const { dialogConfirm, messageError, success } = useCounterMixin();
const { showLoader, hideLoader, dialogConfirm, messageError, success } =
useCounterMixin();
const props = defineProps({
getData: Function,
@ -22,41 +22,53 @@ const commandEditRecive = defineModel<string>("commandEditRecive", {
required: true,
});
const formData = reactive({
salaryAmount: 0,
positionSalaryAmount: 0,
monthSalaryAmount: 0,
const formData = reactive<any>({
amount: null,
positionSalaryAmount: null,
mouthSalaryAmount: null,
remarkVertical: null,
remarkHorizontal: null,
});
function onSubmit() {
dialogConfirm($q, () => {
showLoader();
http
.put(config.API.commandEditRecive("tab2", commandEditRecive.value), {
mouthSalaryAmount: formData.salaryAmount, //
positionSalaryAmount: formData.positionSalaryAmount, //
amount: formData.monthSalaryAmount, //
mouthSalaryAmount:
typeof formData.monthSalaryAmount === "string"
? Number(formData.monthSalaryAmount?.replace(/,/g, ""))
: formData.monthSalaryAmount, //
positionSalaryAmount:
typeof formData.positionSalaryAmount === "string"
? Number(formData.positionSalaryAmount?.replace(/,/g, ""))
: formData.positionSalaryAmount, //
amount:
typeof formData.amount === "string"
? Number(formData.amount?.replace(/,/g, ""))
: formData.amount, //
remarkVertical: formData.remarkVertical, //
remarkHorizontal: formData.remarkHorizontal, //
})
.then((res) => {
.then(async () => {
await props.getData?.();
success($q, "บันทึกข้อมูลสำเร็จ");
onClose();
props.getData?.();
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {});
.finally(() => {
hideLoader();
});
});
}
function onClose() {
modal.value = false;
formData.salaryAmount = 0;
formData.positionSalaryAmount = 0;
formData.monthSalaryAmount = 0;
formData.amount = null;
formData.positionSalaryAmount = null;
formData.monthSalaryAmount = null;
formData.remarkVertical = null;
formData.remarkHorizontal = null;
}
@ -67,9 +79,9 @@ watch(
if (modal.value) {
if (props.selectPersonData) {
const list = props.selectPersonData;
formData.salaryAmount = list.mouthSalaryAmount;
formData.amount = list.amount;
formData.positionSalaryAmount = list.positionSalaryAmount;
formData.monthSalaryAmount = list.amount;
formData.monthSalaryAmount = list.mouthSalaryAmount;
formData.remarkVertical = list.remarkVertical;
formData.remarkHorizontal = list.remarkHorizontal;
}
@ -80,41 +92,76 @@ watch(
<template>
<q-dialog v-model="modal" persistent>
<q-card style="width: 50vw; max-width: 50vw">
<q-card style="min-width: 40vw">
<q-form q-form greedy @submit.prevent @validation-success="onSubmit">
<DialogHeader :tittle="titleName" :close="onClose" />
<q-separator />
<q-card-section>
<div class="row col-12 q-col-gutter-sm">
<div class="col-xs-6 col-sm-6 col-md-6">
<CurruncyInput
<!-- <CurruncyInput
:edit="true"
:dense="true"
v-model="formData.salaryAmount"
v-model="formData.amount"
:label="`${'เงินเดือน'}`"
:rules="[(val: any) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
hide-bottom-space
/> -->
<q-input
dense
outlined
lazy-rules
hide-bottom-space
v-model="formData.amount"
class="inputgreen"
mask="###,###,###,###,###,###"
reverse-fill-mask
:label="`${'เงินเดือน'}`"
:rules="[(val: any) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
/>
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<CurruncyInput
<q-input
dense
outlined
lazy-rules
hide-bottom-space
v-model="formData.positionSalaryAmount"
class="inputgreen"
mask="###,###,###,###,###,###"
reverse-fill-mask
:label="`${'เงินประจำตำแหน่ง'}`"
/>
<!-- <CurruncyInput
:edit="true"
:dense="true"
v-model="formData.positionSalaryAmount"
:label="`${'เงินประจำตำแหน่ง'}`"
hide-bottom-space
/>
/> -->
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<CurruncyInput
<q-input
dense
outlined
lazy-rules
hide-bottom-space
v-model="formData.monthSalaryAmount"
class="inputgreen"
mask="###,###,###,###,###,###"
reverse-fill-mask
:label="`${'เงินค่าตอบแทนรายเดือน'}`"
/>
<!-- <CurruncyInput
:edit="true"
:dense="true"
v-model="formData.monthSalaryAmount"
:label="`${'เงินค่าตอบแทนรายเดือน'}`"
hide-bottom-space
/>
/> -->
</div>
<div class="col-xs-6 col-sm-6 col-md-12">
<q-input
@ -123,7 +170,7 @@ watch(
v-model="formData.remarkVertical"
label="หมายเหตุแนวตั้ง"
type="textarea"
rows="2"
rows="5"
class="inputgreen"
/>
</div>
@ -134,7 +181,7 @@ watch(
v-model="formData.remarkHorizontal"
type="textarea"
label="หมายเหตุแนวนอน"
rows="2"
rows="5"
class="inputgreen"
/>
</div>

View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { onMounted, ref, watch, reactive, onBeforeMount } from "vue";
import { onMounted, ref, reactive } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
@ -18,21 +18,13 @@ import ReceivedCopy from "@/modules/18_command/components/Step/3_ReceivedCopy.vu
import Attached from "@/modules/18_command/components/Step/4_Attached.vue"; //
const $q = useQuasar();
const { showLoader, hideLoader, messageError, date2Thai } = useCounterMixin();
const { showLoader, hideLoader, messageError } = useCounterMixin();
const router = useRouter();
const route = useRoute();
const commandId = ref<string>(route.params.id.toString()); //ID
const store = useCommandDetail();
const childDetailRef = ref<InstanceType<typeof Detail> | null>(null); //ref components
const childListPersonsRef = ref<InstanceType<typeof ListPersons> | null>(null); //ref components
const childReceivedCopyRef = ref<InstanceType<typeof ReceivedCopy> | null>(
null
); //ref components
const childAttachedRef = ref<InstanceType<typeof Attached> | null>(null); //ref components
const tabs = ref<string>("Main"); //Tab
const readonly = ref<boolean>(route.name === "commandViewDetailPage"); //
const isChangeData = ref<boolean>(false); //
// Tab
const tabsManu = ref<ItemTabs[]>([
@ -62,7 +54,7 @@ let formCommandList = reactive<FormDataDetail>({
commandAffectDate: null, //
commandExcecuteDate: null, //
commandSysId: "", //
isAttachment:true
isAttachment: true,
});
/**
@ -97,28 +89,8 @@ async function fetchDataCommandList() {
});
}
/**
* การเปลยนแปลงของ tabs เมอมการเปลยนแปลง
*
* เชคการเปลยนแปลงของขอม าการเปลยนแปลงของขอมลจะบนทกขอม
*/
// watch(tabs, (newValue, oldValue) => {
// //
// if (isChangeData.value) {
// const refMap: { [key: string]: any } = {
// Detail: childDetailRef,
// ListPersons: childListPersonsRef,
// ReceivedCopy: childReceivedCopyRef,
// Attached: childAttachedRef,
// };
// refMap[oldValue]?.value?.onSubmit();
// }
// });
/**
* ทำงานเม Components กเรยกใชงาน
*
* กำหนดค `store.readonly` เม route.name เป "commandViewDetailPage" จะอานขอมลไดอยางเดยว
*/
onMounted(async () => {
@ -169,7 +141,6 @@ onMounted(async () => {
<q-tab-panel style="padding: 0px" name="Main">
<q-card>
<Main
ref="childDetailRef"
v-model:is-change-data="isChangeData"
:on-check-change-data="onCheckChangeData"
/>
@ -179,7 +150,6 @@ onMounted(async () => {
<q-tab-panel style="padding: 0px" name="Detail">
<q-card>
<Detail
ref="childDetailRef"
v-model:is-change-data="isChangeData"
:on-check-change-data="onCheckChangeData"
:fetch-data-command-list="fetchDataCommandList"
@ -190,7 +160,6 @@ onMounted(async () => {
<q-tab-panel class="bg-grey-2" style="padding: 0px" name="ListPersons">
<ListPersons
ref="childListPersonsRef"
v-model:is-change-data="isChangeData"
:on-check-change-data="onCheckChangeData"
:fetch-data-command-list="fetchDataCommandList"
@ -201,7 +170,6 @@ onMounted(async () => {
<q-tab-panel style="padding: 0px" name="ReceivedCopy">
<q-card>
<ReceivedCopy
ref="childReceivedCopyRef"
v-model:is-change-data="isChangeData"
:on-check-change-data="onCheckChangeData"
/>
@ -211,10 +179,10 @@ onMounted(async () => {
<q-tab-panel style="padding: 0px" name="Attached">
<q-card>
<Attached
ref="childAttachedRef"
v-model:is-change-data="isChangeData"
v-model:is-attachment="formCommandList.isAttachment"
:on-check-change-data="onCheckChangeData"
v-model:is-attachment="formCommandList.isAttachment "
:form-command-list="formCommandList"
/>
</q-card>
</q-tab-panel>