แก้วินัย

This commit is contained in:
setthawutttty 2023-11-21 10:29:11 +07:00
parent dd9d4de08a
commit 18e1e0d2bd
4 changed files with 277 additions and 211 deletions

View file

@ -2,11 +2,16 @@
import { onMounted, reactive, ref } from "vue"; import { onMounted, reactive, ref } from "vue";
import Form from "@/modules/11_discipline/components/1_Complaint/Form.vue"; import Form from "@/modules/11_discipline/components/1_Complaint/Form.vue";
import { useRouter, useRoute } from "vue-router"; import { useRouter, useRoute } from "vue-router";
import { useQuasar } from "quasar";
import type { import type {
FormData, FormData,
ArrayPerson, ArrayPerson,
} from "@/modules/11_discipline/interface/request/complaint"; } from "@/modules/11_discipline/interface/request/complaint";
import { useCounterMixin } from "@/stores/mixin";
const $q = useQuasar();
const mixin = useCounterMixin()
const { dialogConfirm } = mixin
const router = useRouter(); const router = useRouter();
const route = useRoute(); const route = useRoute();
const id = ref<string>(route.params.id as string); const id = ref<string>(route.params.id as string);
@ -75,6 +80,35 @@ async function onSubmit() {
router.push(`/discipline/complaints`); router.push(`/discipline/complaints`);
} }
/** ยืนยัน มีมูลส่งไปสืบสวน */
function sentInvestigate(){
dialogConfirm($q,()=> confirmSentInvestigate(),'ยืนยันส่งไปสืบสวน','ต้องการยืนยันส่งไปสืบสวนใช่หรือไม่?')
}
/** ยืนยัน ยุติเรื่อง */
function endInvestigate(){
dialogConfirm($q,()=> confirmEndInvestigate(),'ยืนยันยุติเรื่อง','ต้องการยืนยันยุติเรื่องใช่หรือไม่?')
}
/** ยืนยัน ยกเลิกการยุติเรื่อง */
function cancelInvestigate(){
dialogConfirm($q,()=> confirmCancelInvestigate(),'ยืนยันยกเลิกการยุติเรื่อง','ต้องการยืนยันยกเลิกการยุติเรื่องใช่หรือไม่?')
}
/** ฟังชั่น มีมูลส่งไปสืบสวน*/
function confirmSentInvestigate(){
console.log('sent')
}
/** ฟังชั่น ยุติเรื่อง*/
function confirmEndInvestigate(){
console.log('sent')
}
/** ฟังชั่น ยกเลิกการยุติเรื่อง*/
function confirmCancelInvestigate(){
console.log('sent')
}
/** เรียกใช้งาน ฟังชั่น ตอนเริ่มโหลดหน้า */ /** เรียกใช้งาน ฟังชั่น ตอนเริ่มโหลดหน้า */
onMounted(() => { onMounted(() => {
console.log(data); console.log(data);
@ -101,16 +135,19 @@ onMounted(() => {
v-if="data.complaintStatus === 'NEW'" v-if="data.complaintStatus === 'NEW'"
label="มีมูลส่งไปสืบสวน" label="มีมูลส่งไปสืบสวน"
color="public" color="public"
@click="sentInvestigate"
/> />
<q-btn <q-btn
v-if="data.complaintStatus === 'NEW'" v-if="data.complaintStatus === 'NEW'"
label="ยุติเรื่อง" label="ยุติเรื่อง"
color="red-7" color="red-7"
@click="endInvestigate"
/> />
<q-btn <q-btn
v-if="data.complaintStatus === 'STOP'" v-if="data.complaintStatus === 'STOP'"
label="ยกเลิกการยุติเรื่อง" label="ยกเลิกการยุติเรื่อง"
color="red-7" color="red-7"
@click="cancelInvestigate"
/> />
</div> </div>
</div> </div>

View file

@ -3,7 +3,12 @@ import { onMounted, reactive, ref } from "vue";
import Form from "@/modules/11_discipline/components/2_InvestigateFacts/Form.vue"; import Form from "@/modules/11_discipline/components/2_InvestigateFacts/Form.vue";
import type { FormData } from "@/modules/11_discipline/interface/request/investigate"; import type { FormData } from "@/modules/11_discipline/interface/request/investigate";
import { useRouter, useRoute } from "vue-router"; import { useRouter, useRoute } from "vue-router";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
const $q = useQuasar()
const mixin = useCounterMixin()
const { dialogConfirm } = mixin
const router = useRouter(); const router = useRouter();
const route = useRoute(); const route = useRoute();
const id = ref<string>(route.params.id as string); const id = ref<string>(route.params.id as string);
@ -45,7 +50,6 @@ const fetchData = async () => {
data.daysExtend = null; data.daysExtend = null;
data.statusResult = "ไม่ระบุ"; data.statusResult = "ไม่ระบุ";
data.causeText = ""; data.causeText = "";
data.complaintStatus = "NEW";
}; };
/** /**
@ -58,6 +62,16 @@ async function onSubmit(id:string){
router.push(`/discipline/investigatefacts`); router.push(`/discipline/investigatefacts`);
}; };
/** ยืนยัน ส่งไปสอบสวน */
function sentInvestigate(){
dialogConfirm($q,()=> confirmSentInvestigate(),'ยืนยันส่งไปสอบสวน','ต้องการยืนยันส่งไปสอบสวนใช่หรือไม่?')
}
/** ฟังชั่น ส่งไปสอบสวน*/
function confirmSentInvestigate(){
console.log('sent')
}
/** โหลดข้อมูลเมื่อเข้าหน้านี้ */ /** โหลดข้อมูลเมื่อเข้าหน้านี้ */
onMounted(() => { onMounted(() => {
fetchData(); fetchData();
@ -81,19 +95,9 @@ onMounted(() => {
<q-space /> <q-space />
<div class="q-gutter-x-sm"> <div class="q-gutter-x-sm">
<q-btn <q-btn
v-if="data.complaintStatus === 'NEW'" label="ส่งไปสอบสวน"
label="มีมูลส่งไปออกคำสั่ง"
color="public" color="public"
/> @click="sentInvestigate"
<q-btn
v-if="data.complaintStatus === 'NEW'"
label="ยุติเรื่อง"
color="red-7"
/>
<q-btn
v-if="data.complaintStatus === 'STOP'"
label="ยกเลิกการยุติเรื่อง"
color="red-7"
/> />
</div> </div>
</div> </div>

View file

@ -13,10 +13,10 @@ import { diffDates } from "@fullcalendar/core/internal";
const $q = useQuasar(); const $q = useQuasar();
/**เรียกใช้ store */ /**เรียกใช้ store */
const investigateFactStore = useInvestigateFactStore(); const investigateFactStore = useInvestigateFactStore();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { filterFnOptionsType } = investigateFactStore; const { filterFnOptionsType } = investigateFactStore;
const { date2Thai, dialogConfirm } = mixin; const { date2Thai, dialogConfirm } = mixin;
const complaintsOptions = ref<any>([]); const complaintsOptions = ref<any>([]);
const isUpdate = ref<boolean>(false); const isUpdate = ref<boolean>(false);
@ -65,7 +65,7 @@ const formData = reactive<FormData>({
daysExtend: null, daysExtend: null,
statusResult: "ยังไม่ระบุ", statusResult: "ยังไม่ระบุ",
causeText: "", causeText: "",
complaintStatus:'' complaintStatus: "",
}); });
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */ /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
@ -132,7 +132,7 @@ function calEndDate(val: string) {
formData.dateEnd = new Date(dateNew.setDate(date.getDate() + Number(val))); formData.dateEnd = new Date(dateNew.setDate(date.getDate() + Number(val)));
} }
/** /**
* เชคขอมลจาก props * เชคขอมลจาก props
* เมอมอม * เมอมอม
* เกบขอมลลง formData * เกบขอมลลง formData
@ -158,9 +158,9 @@ watch(props.data, async () => {
}); });
</script> </script>
<template> <template>
<q-card flat bordered class="col-12 q-mt-sm"> <q-card flat bordered class="q-mt-sm">
<form @submit.prevent="validateForm"> <form @submit.prevent="validateForm">
<div class="q-pa-md"> <div class="q-pa-md q-col-gutter-md">
<div class="col-xs-12 row items-center q-col-gutter-md"> <div class="col-xs-12 row items-center q-col-gutter-md">
<div class="col-6"> <div class="col-6">
<q-select <q-select
@ -174,6 +174,7 @@ watch(props.data, async () => {
label="เรื่องร้องเรียน" label="เรื่องร้องเรียน"
emit-value emit-value
map-options map-options
hide-bottom-space
option-label="name" option-label="name"
option-value="id" option-value="id"
use-input use-input
@ -201,6 +202,7 @@ watch(props.data, async () => {
:options="investigateFactStore.faultOp" :options="investigateFactStore.faultOp"
label="ลักษณะความผิด" label="ลักษณะความผิด"
emit-value emit-value
hide-bottom-space
map-options map-options
option-label="name" option-label="name"
option-value="id" option-value="id"
@ -222,6 +224,7 @@ watch(props.data, async () => {
<q-select <q-select
for="#investigation" for="#investigation"
outlined outlined
hide-bottom-space
dense dense
ref="investigationRef" ref="investigationRef"
:rules="[(val) => !!val || `${'กรุณาเลือกลักษณะการสืบสวน'}`]" :rules="[(val) => !!val || `${'กรุณาเลือกลักษณะการสืบสวน'}`]"
@ -245,57 +248,53 @@ watch(props.data, async () => {
</template> </template>
</q-select> </q-select>
</div> </div>
</div>
<div v-if="formData.investigation === '003'" class="col-12"> <div v-if="formData.investigation === '003'" class="col-12">
<q-input <q-input
for="#other" for="#other"
class="full-width cursor-pointer" class="full-width cursor-pointer"
outlined outlined
ref="otherRef" ref="otherRef"
dense dense
borderless borderless
v-model="formData.other" v-model="formData.other"
hide-bottom-space hide-bottom-space
:label="`${'รายการอื่นๆ(โปรดระบุ)'}`" :label="`${'รายการอื่นๆ(โปรดระบุ)'}`"
type="textarea" type="textarea"
:rules="[ :rules="[
(val) => (val) =>
formData.investigation === '003' formData.investigation === '003'
? !!val || 'กรุณาเลือกจำนวนวันที่ต้องการขยาย' ? !!val || 'กรุณาเลือกจำนวนวันที่ต้องการขยาย'
: true, : true,
]" ]"
/> />
</div> </div>
<div class="row col-12"> <div class="row">
<q-card <q-card bordered class="col-12" style="border: 1px solid #d6dee1">
bordered <div
class="row col-12" class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
style="border: 1px solid #d6dee1"
> >
<div นทบสวน
class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-sm q-px-md" <q-checkbox
> v-if="data != null"
นทบสวน for="#clickTime"
<q-checkbox size="md"
v-if="data != null" v-model="formData.clickTime"
for="#clickTime" label="ขยายเวลา"
size="md" color="primary"
v-model="formData.clickTime" dense
label="ขยายเวลา" class="text-weight-medium q-ml-sm"
color="primary" keep-color
dense />
class="text-weight-medium q-ml-sm" </div>
keep-color <div class="col-12"><q-separator /></div>
/> <div class="q-pa-sm">
</div> <div class="q-col-gutter-sm row">
<div class="col-3" v-if="!formData.clickTime">
<div class="col-12"><q-separator /></div>
<div class="col-xs-12 col-sm-12 q-pa-sm row">
<div class="q-col-gutter-sm row">
<datepicker <datepicker
v-if="!formData.clickTime"
menu-class-name="modalfix" menu-class-name="modalfix"
:readonly="isUpdate" :readonly="isUpdate"
v-model="formData.date" v-model="formData.date"
@ -339,9 +338,10 @@ watch(props.data, async () => {
</q-input> </q-input>
</template> </template>
</datepicker> </datepicker>
</div>
<div class="col-3" v-if="formData.clickTime">
<q-select <q-select
v-if="formData.clickTime"
for="#daysExtend" for="#daysExtend"
outlined outlined
dense dense
@ -371,7 +371,9 @@ watch(props.data, async () => {
</q-item> </q-item>
</template> </template>
</q-select> </q-select>
</div>
<div class="col-3">
<datepicker <datepicker
menu-class-name="modalfix" menu-class-name="modalfix"
v-model="formData.dateEnd" v-model="formData.dateEnd"
@ -418,138 +420,139 @@ watch(props.data, async () => {
</datepicker> </datepicker>
</div> </div>
</div> </div>
</q-card> </div>
</div> </q-card>
</div>
<div class="col-12"> <div class="col-12">
<q-input <q-input
for="#complaintdetail" for="#complaintdetail"
class="full-width cursor-pointer" class="full-width cursor-pointer"
outlined outlined
ref="complaintdetailRef" ref="complaintdetailRef"
dense dense
lazy-rules lazy-rules
borderless borderless
v-model="formData.complaintdetail" v-model="formData.complaintdetail"
:rules="[ :rules="[
(val) => !!val || `${'กรุณากรอกรายละเอียดเรื่องร้องเรียน'}`, (val) => !!val || `${'กรุณากรอกรายละเอียดเรื่องร้องเรียน'}`,
]" ]"
hide-bottom-space hide-bottom-space
:label="`${'รายละเอียดเรื่องร้องเรียน'}`" :label="`${'รายละเอียดเรื่องร้องเรียน'}`"
type="textarea" type="textarea"
/> />
</div> </div>
<div class="col-12"> <div class="col-12">
<q-file <q-file
for="#fileComplaint" for="#fileComplaint"
outlined outlined
ref="fileComplaintRef" ref="fileComplaintRef"
dense dense
v-model="formData.fileComplaint" v-model="formData.fileComplaint"
label="ไฟล์เอกสารหลักฐานเรื่องร้องเรียน" label="ไฟล์เอกสารหลักฐานเรื่องร้องเรียน"
lazy-rules lazy-rules
:rules="[(val) => !!val || 'กรุณาเลือกไฟล์หลักฐานการรับ']" :rules="[(val) => !!val || 'กรุณาเลือกไฟล์หลักฐานการรับ']"
hide-bottom-space hide-bottom-space
> >
<template v-slot:prepend> <template v-slot:prepend>
<q-icon name="attach_file" color="primary" /> <q-icon name="attach_file" color="primary" />
</template> </template>
</q-file> </q-file>
</div> </div>
<div class="col-12"> <div class="col-12">
<q-input <q-input
for="#detail" for="#detail"
class="full-width cursor-pointer" class="full-width cursor-pointer"
outlined outlined
ref="detailRef" ref="detailRef"
dense dense
lazy-rules lazy-rules
borderless borderless
v-model="formData.detail" v-model="formData.detail"
:rules="[(val) => !!val || `${'กรุณากรอกรายละเอียด'}`]" :rules="[(val) => !!val || `${'กรุณากรอกรายละเอียด'}`]"
hide-bottom-space hide-bottom-space
:label="`${'รายละเอียด'}`" :label="`${'รายละเอียด'}`"
type="textarea" type="textarea"
/> />
</div> </div>
<div class="col-12"> <div class="col-12">
<q-file <q-file
for="#evidenceFiles" for="#evidenceFiles"
outlined
dense
ref="evidenceFilesRef"
v-model="formData.evidenceFiles"
label="ไฟล์เอกสารหลักฐาน"
lazy-rules
:rules="[(val) => !!val || 'กรุณาเลือกไฟล์เอกสารหลักฐาน']"
hide-bottom-space
>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
<div class="row col-12 q-col-gutter-md">
<div class="col-3">
<q-select
for="#fault"
outlined outlined
dense dense
ref="evidenceFilesRef"
v-model="formData.evidenceFiles"
label="ไฟล์เอกสารหลักฐาน"
lazy-rules lazy-rules
:rules="[(val) => !!val || 'กรุณาเลือกไฟล์เอกสารหลักฐาน']" ref="statusResultRef"
hide-bottom-space v-model="formData.statusResult"
> :rules="[(val) => !!val || `${'กรุณาเลือกผลการสืบสวน'}`]"
<template v-slot:prepend> :options="investigateFactStore.statusResultOptions"
<q-icon name="attach_file" color="primary" /> label="ผลการสืบสวน"
</template> emit-value
</q-file> map-options
</div> option-label="name"
option-value="id"
<div class="row col-12 q-col-gutter-md"> use-input
<div class="col-3"> @filter="(inputValue: any,
<q-select
for="#fault"
outlined
dense
lazy-rules
ref="statusResultRef"
v-model="formData.statusResult"
:rules="[(val) => !!val || `${'กรุณาเลือกผลการสืบสวน'}`]"
:options="investigateFactStore.statusResultOptions"
label="ผลการสืบสวน"
emit-value
map-options
option-label="name"
option-value="id"
use-input
@filter="(inputValue: any,
doneFn: Function) => filterFnOptionsType(inputValue, doneFn, 'faultOp' doneFn: Function) => filterFnOptionsType(inputValue, doneFn, 'faultOp'
)" )"
><template v-slot:no-option> ><template v-slot:no-option>
<q-item> <q-item>
<q-item-section class="text-grey"> <q-item-section class="text-grey">
ไมอม ไมอม
</q-item-section> </q-item-section>
</q-item> </q-item>
</template> </template>
</q-select> </q-select>
</div> </div>
<div v-if="formData.statusResult == 'have_cause'" class="col-3"> <div v-if="formData.statusResult == 'have_cause'" class="col-3">
<q-select <q-select
for="#fault" for="#fault"
outlined outlined
dense dense
ref="causeTextRef" ref="causeTextRef"
v-model="formData.causeText" v-model="formData.causeText"
:rules="[(val) => !!val || `${'กรุณาเลือกร้ายแรง/ไม่ร้ายแรง'}`]" :rules="[(val) => !!val || `${'กรุณาเลือกร้ายแรง/ไม่ร้ายแรง'}`]"
:options="investigateFactStore.causeTextOptions" :options="investigateFactStore.causeTextOptions"
label="ร้ายแรง/ไม่ร้ายแรง" label="ร้ายแรง/ไม่ร้ายแรง"
emit-value emit-value
map-options map-options
option-label="name" option-label="name"
option-value="id" option-value="id"
use-input use-input
><template v-slot:no-option> ><template v-slot:no-option>
<q-item> <q-item>
<q-item-section class="text-grey"> <q-item-section class="text-grey">
ไมอม ไมอม
</q-item-section> </q-item-section>
</q-item> </q-item>
</template> </template>
</q-select> </q-select>
</div>
</div> </div>
</div> </div>
</div> </div>
<q-separator /> <q-separator />
<div class="row col-12 q-pa-sm"> <div class="row col-12 q-pa-sm">
<q-space /> <q-space />

View file

@ -3,12 +3,15 @@ import { onMounted, reactive, ref } from "vue";
import Form from "@/modules/11_discipline/components/3_InvestigateDisciplinary/Form.vue"; import Form from "@/modules/11_discipline/components/3_InvestigateDisciplinary/Form.vue";
import type { FormData } from "@/modules/11_discipline/interface/request/disciplinary"; import type { FormData } from "@/modules/11_discipline/interface/request/disciplinary";
import { useRouter, useRoute } from "vue-router"; import { useRouter, useRoute } from "vue-router";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
const $q = useQuasar();
const mixin = useCounterMixin();
const { dialogConfirm } = mixin;
const router = useRouter(); const router = useRouter();
const route = useRoute(); const route = useRoute();
const id = ref<string>(route.params.id as string); const id = ref<string>(route.params.id as string);
/** ข้อมูล v-model ของฟอร์ม */ /** ข้อมูล v-model ของฟอร์ม */
const data = reactive<FormData>({ const data = reactive<FormData>({
complaint: "", complaint: "",
@ -34,36 +37,51 @@ const data = reactive<FormData>({
/** จำลองข้อมูลจาก api */ /** จำลองข้อมูลจาก api */
const fetchData = async () => { const fetchData = async () => {
data.complaint = "test1" data.complaint = "test1";
data.dateInvestigate = new Date("2023-11-08T14:58:00") data.dateInvestigate = new Date("2023-11-08T14:58:00");
data.dateAllegation = new Date("2023-11-08T14:58:00") data.dateAllegation = new Date("2023-11-08T14:58:00");
data.dateEvident = new Date("2023-11-08T14:58:00") data.dateEvident = new Date("2023-11-08T14:58:00");
data.casefault = "test1" data.casefault = "test1";
data.typefault = "2" data.typefault = "2";
data.faultLevel = "2" data.faultLevel = "2";
data.refLaw = "test" data.refLaw = "test";
data.detailComplaint = "รายละเอียด" data.detailComplaint = "รายละเอียด";
data.whereInvestigate = "ที่ไหน" data.whereInvestigate = "ที่ไหน";
data.trueDetail = "รายละเอียด" data.trueDetail = "รายละเอียด";
data.evidence = "รายละเอียด" data.evidence = "รายละเอียด";
data.recordAccuser = "รายละเอียด" data.recordAccuser = "รายละเอียด";
data.witnesses = "รายละเอียด" data.witnesses = "รายละเอียด";
data.InvestResults = "รายละเอียด" data.InvestResults = "รายละเอียด";
data.filesEvidence = null data.filesEvidence = null;
data.filesRecordAccuser = null data.filesRecordAccuser = null;
data.filesWitnesses = null data.filesWitnesses = null;
data.filesEtc = null data.filesEtc = null;
}; };
/** /**
* นทกขอมลทเเกไข * นทกขอมลทเเกไข
* @param id ระบ คคล * @param id ระบ คคล
*/ */
const onSubmit = async (id:string) => { const onSubmit = async (id: string) => {
console.log("edit"); console.log("edit");
router.push(`/discipline/disciplinary`); router.push(`/discipline/disciplinary`);
}; };
/** ยืนยัน ส่งไปออกคำสั่ง */
function sentIssue() {
dialogConfirm(
$q,
() => confirmSentIssue(),
"ยืนยันส่งไปออกคำสั่ง",
"ต้องการยืนยันส่งไปออกคำสั่งใช่หรือไม่?"
);
}
/** ฟังชั่น ส่งไปออกคำสั่ง*/
function confirmSentIssue() {
console.log("sent");
}
/** โหลดข้อมูลเมื่อเข้าหน้านี้ */ /** โหลดข้อมูลเมื่อเข้าหน้านี้ */
onMounted(() => { onMounted(() => {
fetchData(); fetchData();
@ -82,7 +100,11 @@ onMounted(() => {
class="q-mr-sm" class="q-mr-sm"
@click="$router.push(`/discipline/disciplinary`)" @click="$router.push(`/discipline/disciplinary`)"
/> />
แกไขการสอบสวนความผดทางว {{ id }}#id <div class="q-ma-none">แกไขการสอบสวนความผดทางว {{ id }}#id</div>
<q-space />
<div class="q-gutter-x-sm">
<q-btn label="ส่งไปออกคำสั่ง" color="public" @click="sentIssue" />
</div>
</div> </div>
<Form :on-submit="onSubmit" :data="data" /> <Form :on-submit="onSubmit" :data="data" />
</div> </div>