feat
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490
parent
9256f6cd16
commit
6aa8a61b40
3 changed files with 362 additions and 2 deletions
217
src/modules/04_registryPerson/components/DialogResingn.vue
Normal file
217
src/modules/04_registryPerson/components/DialogResingn.vue
Normal file
|
|
@ -0,0 +1,217 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, reactive } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
/** import components*/
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
import type { DataOption } from "@/modules/04_registryPerson/interface/index/Main";
|
||||
|
||||
//use
|
||||
const $q = useQuasar();
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const { showLoader, hideLoader, messageError, date2Thai, dateToISO } =
|
||||
useCounterMixin();
|
||||
|
||||
//props
|
||||
const modal = defineModel<boolean>("modal", { required: true });
|
||||
|
||||
const form = reactive({
|
||||
location: "",
|
||||
activeDate: null as Date | null,
|
||||
reason: "",
|
||||
files: null as File | null,
|
||||
remark: "",
|
||||
});
|
||||
|
||||
const reasonOp = ref<DataOption[]>([
|
||||
{
|
||||
id: "CAREER",
|
||||
name: "ประกอบอาชีพอื่น",
|
||||
},
|
||||
{
|
||||
id: "MOVE",
|
||||
name: "รับราชการสังกัดอื่น",
|
||||
},
|
||||
{
|
||||
id: "FAMILY",
|
||||
name: "ดูแลบิดามารดา",
|
||||
},
|
||||
{
|
||||
id: "EDUCATION",
|
||||
name: "ศึกษาต่อ",
|
||||
},
|
||||
{
|
||||
id: "OTHER",
|
||||
name: "อื่น ๆ",
|
||||
},
|
||||
]);
|
||||
|
||||
async function onSubmit() {
|
||||
try {
|
||||
showLoader();
|
||||
const formData = new FormData();
|
||||
formData.append("Location", form.location);
|
||||
formData.append(
|
||||
"ActiveDate",
|
||||
form.activeDate !== null ? dateToISO(form.activeDate) : ""
|
||||
);
|
||||
formData.append("Reason", form.reason);
|
||||
if (form.files) {
|
||||
formData.append("file", form.files);
|
||||
}
|
||||
if (form.reason === "OTHER") {
|
||||
formData.append("remark", form.remark);
|
||||
}
|
||||
|
||||
// await http.post(config.API.listtransfer(), formData);
|
||||
// success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
} catch (error) {
|
||||
messageError($q, error);
|
||||
} finally {
|
||||
hideLoader();
|
||||
}
|
||||
}
|
||||
|
||||
/** function ปิด popup*/
|
||||
function closeDialog() {
|
||||
modal.value = false;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-dialog v-model="modal" persistent>
|
||||
<q-card style="width: 40vw; max-width: 50vw">
|
||||
<q-form greedy @submit.prevent="onSubmit">
|
||||
<DialogHeader :tittle="'ขอลาออก'" :close="closeDialog" />
|
||||
<q-separator />
|
||||
|
||||
<q-card-section class="q-pa-md">
|
||||
<div class="col-12 row q-col-gutter-sm">
|
||||
<div class="col-md-9 col-sm-12">
|
||||
<q-input
|
||||
class="inputgreen"
|
||||
dense
|
||||
outlined
|
||||
v-model="form.location"
|
||||
hide-bottom-space
|
||||
label="สถานที่ยื่นขอลาออกจากราชการ"
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกสถานที่ยื่นขอลาออกจากราชการ'}`]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-md-3 col-sm-12">
|
||||
<datepicker
|
||||
class="inputgreen"
|
||||
menu-class-name="modalfix"
|
||||
v-model="form.activeDate"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
hide-bottom-space
|
||||
class="full-width"
|
||||
:model-value="
|
||||
form.activeDate != null
|
||||
? date2Thai(form.activeDate)
|
||||
: null
|
||||
"
|
||||
:label="`${'วันที่ขอลาออกจากราชการ'}`"
|
||||
:rules="[
|
||||
(val: string) =>
|
||||
!!val || `${'กรุณาเลือกวันที่ขอลาออกจากราชการ'}`,
|
||||
]"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<q-select
|
||||
v-model="form.reason"
|
||||
class="inputgreen'"
|
||||
dense
|
||||
outlined
|
||||
emit-value
|
||||
map-options
|
||||
hide-bottom-space
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
:options="reasonOp"
|
||||
label="เหตุผลที่ลาออกจากราชการ"
|
||||
:rules="[
|
||||
(val: string) => !!val || `${'กรุณาเลือกเหตุผลที่ลาออกจากราชการ'}`,
|
||||
]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-12" v-if="form.reason == 'OTHER'">
|
||||
<q-input
|
||||
class="inputgreen'"
|
||||
v-model="form.remark"
|
||||
outlined
|
||||
hide-bottom-space
|
||||
dense
|
||||
type="textarea"
|
||||
label="ระบุเหตุผล"
|
||||
:rules="[
|
||||
(val: string) => !!val || `${'กรุณาระบุเหตุผล'}`,
|
||||
]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<q-file
|
||||
v-model="form.files"
|
||||
class="inputgreen"
|
||||
outlined
|
||||
dense
|
||||
accept=".pdf"
|
||||
label="เอกสารเพิ่มเติม"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" /> </template
|
||||
></q-file>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right">
|
||||
<q-btn type="submit" :label="`บันทึก`" color="public">
|
||||
<q-tooltip>บันทึก</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
118
src/modules/04_registryPerson/components/DialogTransfer.vue
Normal file
118
src/modules/04_registryPerson/components/DialogTransfer.vue
Normal file
|
|
@ -0,0 +1,118 @@
|
|||
div
|
||||
<script setup lang="ts">
|
||||
import { reactive, ref } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
/** import components*/
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
//use
|
||||
const $q = useQuasar();
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const { showLoader, hideLoader, messageError, success } = useCounterMixin();
|
||||
|
||||
//props
|
||||
const modal = defineModel<boolean>("modal", { required: true });
|
||||
|
||||
const form = reactive({
|
||||
tranferOrg: "",
|
||||
noteReason: "",
|
||||
files: null as File | null,
|
||||
});
|
||||
|
||||
async function onSubmit() {
|
||||
try {
|
||||
showLoader();
|
||||
const formData = new FormData();
|
||||
formData.append("Organization", form.tranferOrg);
|
||||
formData.append("Reason", form.noteReason);
|
||||
if (form.files) {
|
||||
formData.append("file", form.files);
|
||||
}
|
||||
|
||||
// await http.post(config.API.listtransfer(), formData);
|
||||
// success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
} catch (error) {
|
||||
messageError($q, error);
|
||||
} finally {
|
||||
hideLoader();
|
||||
}
|
||||
}
|
||||
|
||||
/** function ปิด popup*/
|
||||
function closeDialog() {
|
||||
modal.value = false;
|
||||
form.tranferOrg = "";
|
||||
form.noteReason = "";
|
||||
form.files = null;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-dialog v-model="modal" persistent>
|
||||
<q-card style="width: 40vw; max-width: 50vw">
|
||||
<q-form greedy @submit.prevent="onSubmit">
|
||||
<DialogHeader :tittle="'ขอโอน'" :close="closeDialog" />
|
||||
<q-separator />
|
||||
|
||||
<q-card-section class="q-pa-md">
|
||||
<div class="col-12 row q-col-gutter-sm">
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
class="inputgreen"
|
||||
dense
|
||||
outlined
|
||||
v-model="form.tranferOrg"
|
||||
hide-bottom-space
|
||||
label="หน่วยงานที่ขอโอนไป"
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกหน่วยงานที่ขอโอนไป'}`]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
class="inputgreen"
|
||||
dense
|
||||
outlined
|
||||
v-model="form.noteReason"
|
||||
label="เหตุผล"
|
||||
hide-bottom-space
|
||||
type="textarea"
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกเหตุผล'}`]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<q-file
|
||||
v-model="form.files"
|
||||
class="inputgreen"
|
||||
outlined
|
||||
dense
|
||||
accept=".pdf"
|
||||
label="เอกสารเพิ่มเติม"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" /> </template
|
||||
></q-file>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions align="right">
|
||||
<q-btn type="submit" :label="`บันทึก`" color="public">
|
||||
<q-tooltip>บันทึก</q-tooltip>
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
Loading…
Add table
Add a link
Reference in a new issue