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

วันที่ใหม่

Browse source
This commit is contained in:
setthawutttty 2024-02-13 16:47:37 +07:00
parent f6352c8b81
commit fd117af90e
7 changed files with 1124 additions and 443 deletions
Download patch file Download diff file Expand all files Collapse all files

111
src/modules/04_registry/components/Information/Certicate.vue
View file

@ -118,7 +118,19 @@
/>
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<q-input
v-if="edit"
outlined
v-model="inputIssueDate"
label="วัน/เดือน/ปี ที่ออกใบอนุญาต"
mask="##/##/####"
dense
hide-bottom-space
:error="dayChecked"
error-message="กรุณากรอก วัน/เดือน/ปี ที่ออกใบอนุญาต"
/>
<datepicker
v-else
menu-class-name="modalfix"
:readonly="!edit"
v-model="issueDate"
@ -139,7 +151,7 @@
dense
lazy-rules
:borderless="!edit"
:model-value="date2Thai(issueDate)"
:model-value="date2Thai(issueDate as Date)"
:rules="[
(val) => !!val || `${'กรุณาเลือกวันที่ออกใบอนุญาต'}`,
]"
@ -163,7 +175,19 @@
</datepicker>
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<q-input
v-if="edit"
outlined
v-model="inputExpireDate"
label="วัน/เดือน/ปี ที่หมดอายุ"
mask="##/##/####"
dense
hide-bottom-space
:error="dayChecked2"
error-message="กรุณากรอก วัน/เดือน/ปี ที่หมดอายุ"
/>
<datepicker
v-else
menu-class-name="modalfix"
v-model="expireDate"
:locale="'th'"
@ -185,7 +209,7 @@
dense
lazy-rules
:borderless="!edit"
:model-value="date2Thai(expireDate)"
:model-value="date2Thai(expireDate as Date)"
:rules="[(val) => !!val || `${'กรุณาเลือกวันที่หมดอายุ'}`]"
hide-bottom-space
:label="`${'วันที่หมดอายุ'}`"
@ -276,6 +300,10 @@ import http from "@/plugins/http";
import config from "@/app.config";
import type { QTableProps } from "quasar";
const inputIssueDate = ref<string>("");
const inputExpireDate = ref<string>("");
const dayChecked = ref<boolean>(false);
const dayChecked2 = ref<boolean>(false);
const props = defineProps({
statusEdit: {
type: Boolean,
@ -292,14 +320,22 @@ const store = useProfileDataStore();
const { profileData, changeProfileColumns } = store;
const mixin = useCounterMixin();
const { date2Thai, success, dateToISO, messageError, showLoader, hideLoader } =
mixin;
const {
date2Thai,
success,
dateToISO,
messageError,
showLoader,
hideLoader,
convertDate,
convertDateDisplay,
} = mixin;
const route = useRoute();
const id = ref<string>("");
const certificateNo = ref<string>();
const issuer = ref<string>();
const issueDate = ref<Date>(new Date());
const expireDate = ref<Date>(new Date());
const issueDate = ref<Date | string | null>(new Date());
const expireDate = ref<Date | string | null>(new Date());
const certificateType = ref<string>();
const minDate = ref<Date>();
const myForm = ref<any>(); //form data input
@ -545,6 +581,8 @@ const getData = () => {
issuer.value = row.issuer;
issueDate.value = row.issueDate;
expireDate.value = row.expireDate;
inputIssueDate.value = convertDateDisplay(row.issueDate);
inputExpireDate.value = convertDateDisplay(row.expireDate);
certificateType.value = row.certificateType;
id.value = row.id;
};
@ -587,15 +625,20 @@ const clickAdd = async () => {
const clickSave = async () => {
myForm.value.validate().then(async (result: boolean) => {
if (result) {
if (modalEdit.value) {
await editData();
} else {
await saveData();
if (inputIssueDate.value === "") {
dayChecked.value = true;
} else if (inputExpireDate.value === "") {
dayChecked2.value = true;
} else {
if (modalEdit.value) {
await editData();
} else {
await saveData();
}
}
}
});
};
/**
* บันทึกเพิ่มข้อมูล
*/
@ -606,8 +649,8 @@ const saveData = async () => {
id: id.value,
certificateNo: certificateNo.value,
issuer: issuer.value,
issueDate: dateToISO(issueDate.value),
expireDate: dateToISO(expireDate.value),
issueDate: dateToISO(issueDate.value as Date),
expireDate: dateToISO(expireDate.value as Date),
certificateType: certificateType.value,
})
.then((res) => {
@ -632,8 +675,8 @@ const editData = async () => {
id: id.value,
certificateNo: certificateNo.value,
issuer: issuer.value,
issueDate: dateToISO(issueDate.value),
expireDate: dateToISO(expireDate.value),
issueDate: dateToISO(issueDate.value as Date),
expireDate: dateToISO(expireDate.value as Date),
certificateType: certificateType.value,
})
.then((res) => {
@ -716,6 +759,8 @@ const selectData = async (props: DataProps) => {
issuer.value = props.row.issuer;
issueDate.value = props.row.issueDate;
expireDate.value = props.row.expireDate;
inputIssueDate.value = convertDateDisplay(props.row.issueDate);
inputExpireDate.value = convertDateDisplay(props.row.expireDate);
certificateType.value = props.row.certificateType;
id.value = props.row.id;
await checkRowPage();
@ -732,6 +777,8 @@ const addData = () => {
issuer.value = "";
issueDate.value = new Date();
expireDate.value = new Date();
inputIssueDate.value = '';
inputExpireDate.value = '';
certificateType.value = "";
};
@ -823,6 +870,40 @@ const getClass = (val: boolean) => {
"full-width cursor-pointer": !val,
};
};
watch(
() => inputIssueDate.value,
(value: string) => {
if (value.length === 10) {
const dateVal = convertDate(value);
if (dateVal.isValid) {
dayChecked.value = false;
issueDate.value = dateVal.value;
} else {
dayChecked.value = true;
inputIssueDate.value = "";
}
}
}
);
watch(
() => inputExpireDate.value,
(value: string) => {
if (value.length === 10) {
const dateVal = convertDate(value);
if (dateVal.isValid) {
dayChecked2.value = false;
expireDate.value = dateVal.value;
} else {
dayChecked2.value = true;
inputExpireDate.value = "";
}
}
}
);
</script>
<style lang="scss">
.modalfix {

99
src/modules/04_registry/components/Information/Government.vue
View file

@ -12,7 +12,7 @@
:historyClick="clickHistory"
/>
<q-form ref="myform" class="col-12">
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="row col-12 items-top q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="col-xs-12">
<q-input
:class="getClass(false)"
@ -123,7 +123,19 @@
</div>
<div class="col-12 q-py-md"><q-separator /></div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
v-if="edit"
outlined
v-model="inputContainDate"
label="วัน/เดือน/ปี ที่บรรจุ"
mask="##/##/####"
dense
hide-bottom-space
:error="dayChecked"
error-message="กรุณากรอก วัน/เดือน/ปี ที่บรรจุ"
/>
<datepicker
v-else
v-model="govermentData.containDate"
:locale="'th'"
autoApply
@ -150,7 +162,7 @@
:borderless="!edit"
:model-value="
govermentData.containDate !== null
? date2Thai(govermentData.containDate)
? date2Thai(govermentData.containDate as Date)
: null
"
:rules="[
@ -163,7 +175,9 @@
}`,
]"
:label="`${
profileType == 'officer' ? 'วันที่บรรจุ' : 'วันที่แต่งตั้ง'
profileType == 'officer'
? 'วัน/เดือน/ปี ที่บรรจุ'
: 'วันที่แต่งตั้ง'
}`"
>
<template v-slot:prepend>
@ -181,7 +195,19 @@
</datepicker>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
v-if="edit"
outlined
v-model="inputWorkDate"
label="วัน/เดือน/ปี เริ่มปฎิบัติราชการ"
mask="##/##/####"
dense
hide-bottom-space
:error="dayChecked2"
error-message="กรุณากรอก วัน/เดือน/ปี เริ่มปฎิบัติราชการ"
/>
<datepicker
v-else
v-model="govermentData.workDate"
:locale="'th'"
autoApply
@ -207,7 +233,7 @@
:borderless="!edit"
:model-value="
govermentData.workDate !== null
? date2Thai(govermentData.workDate)
? date2Thai(govermentData.workDate as Date)
: null
"
:rules="[
@ -221,7 +247,7 @@
]"
:label="`${
profileType == 'officer'
? 'เริ่มปฎิบัติราชการ'
? 'วัน/เดือน/ปี เริ่มปฎิบัติราชการ'
: 'วันที่จ้างและแต่งตั้งมีผล'
}`"
>
@ -353,6 +379,10 @@ import { useProfileDataStore } from "@/modules/04_registry/store";
import { storeToRefs } from "pinia";
import type { QTableProps } from "quasar";
const inputContainDate = ref<string>("");
const inputWorkDate = ref<string>("");
const dayChecked = ref<boolean>(false);
const dayChecked2 = ref<boolean>(false);
const props = defineProps({
statusEdit: {
type: Boolean,
@ -373,8 +403,16 @@ const route = useRoute();
const $q = useQuasar();
const mixin = useCounterMixin();
const { date2Thai, success, dateToISO, messageError, showLoader, hideLoader } =
mixin;
const {
date2Thai,
success,
dateToISO,
messageError,
showLoader,
hideLoader,
convertDate,
convertDateDisplay,
} = mixin;
const profileStore = useProfileDataStore();
const { birthDate, retireText } = storeToRefs(profileStore);
const edit = ref<boolean>(false);
@ -640,6 +678,9 @@ const fetchData = async () => {
govermentData.value.age = data.govAgePlus;
govermentData.value.ageAll = data.govAge;
govermentData.value.reasonSameDate = data.reasonSameDate;
inputContainDate.value = convertDateDisplay(data.dateAppoint);
inputWorkDate.value = convertDateDisplay(data.dateStart);
})
.catch((e) => {
messageError($q, e);
@ -659,8 +700,8 @@ const editData = async () => {
showLoader();
await http
.put(config.API.profileGovId(route.params.id.toString()), {
dateAppoint: dateToISO(govermentData.value.containDate),
dateStart: dateToISO(govermentData.value.workDate),
dateAppoint: dateToISO(govermentData.value.containDate as Date),
dateStart: dateToISO(govermentData.value.workDate as Date),
reasonSameDate: govermentData.value.reasonSameDate,
})
.then((res) => {
@ -679,7 +720,13 @@ const editData = async () => {
const saveData = async () => {
await myform.value.validate().then(async (success: boolean) => {
if (success) {
await editData();
if (inputContainDate.value === "") {
dayChecked.value = true;
} else if (inputWorkDate.value === "") {
dayChecked2.value = true;
} else {
await editData();
}
} else {
}
});
@ -769,4 +816,36 @@ const getClass = (val: boolean) => {
"full-width cursor-pointer": !val,
};
};
watch(
() => inputContainDate.value,
(value: string) => {
if (value.length === 10) {
const dateVal = convertDate(value);
if (dateVal.isValid) {
dayChecked.value = false;
govermentData.value.containDate = dateVal.value;
} else {
dayChecked.value = true;
inputContainDate.value = "";
}
}
}
);
watch(
() => inputWorkDate.value,
(value: string) => {
if (value.length === 10) {
const dateVal = convertDate(value);
if (dateVal.isValid) {
dayChecked2.value = false;
govermentData.value.workDate = dateVal.value;
} else {
dayChecked2.value = true;
inputWorkDate.value = "";
}
}
}
);
</script>