update ฟอร์มสืบสวน สอบสวนวินัย
This commit is contained in:
parent
422ea07f4d
commit
b5cc5c9cb7
12 changed files with 768 additions and 564 deletions
|
|
@ -2,11 +2,12 @@
|
|||
import { onMounted, reactive, ref } from "vue";
|
||||
import FormComplaints from "@/modules/11_discipline/components/1_Complaint/Form.vue"; //เรื่องร้องเรียน
|
||||
import FormInvestigatefacts from "@/modules/11_discipline/components/2_InvestigateFacts/Form.vue"; //สืบสวนข้อเท็จจริง
|
||||
import type { FormData } from "@/modules/11_discipline/interface/request/investigate";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useInvestigateFactStore } from "@/modules/11_discipline/store/InvestigateFactStore";
|
||||
import { useQuasar } from "quasar";
|
||||
import Popup from "@/modules/11_discipline/components/1_Complaint/Popup.vue";
|
||||
import type { FormData } from "@/modules/11_discipline/interface/request/investigateFact";
|
||||
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin();
|
||||
|
|
@ -32,7 +33,8 @@ const data = reactive<FormData>({
|
|||
daysExtend: null,
|
||||
statusResult: "",
|
||||
causeText: "",
|
||||
complaintStatus: "NEW",
|
||||
complaintStatus: "",
|
||||
reason: "",
|
||||
});
|
||||
|
||||
/** จำลองข้อมูลจาก api */
|
||||
|
|
@ -48,10 +50,11 @@ const fetchData = async () => {
|
|||
data.clickTime = false;
|
||||
data.date = new Date("2023-11-07T14:58:00");
|
||||
data.dateEnd = new Date("2023-11-08T14:58:00");
|
||||
data.investigation = "002";
|
||||
data.investigation = "appoint_directors";
|
||||
data.daysExtend = null;
|
||||
data.statusResult = "ไม่ระบุ";
|
||||
data.statusResult = "not_specified";
|
||||
data.causeText = "";
|
||||
data.complaintStatus = "NEW";
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -64,14 +67,20 @@ async function onSubmit(id: string) {
|
|||
router.push(`/discipline/investigatefacts`);
|
||||
}
|
||||
|
||||
const modalPopup = ref<boolean>(false);
|
||||
/** ยืนยัน ส่งไปสอบสวน */
|
||||
function sentInvestigate() {
|
||||
dialogConfirm(
|
||||
$q,
|
||||
() => confirmSentInvestigate(),
|
||||
"ยืนยันส่งไปสอบสวน",
|
||||
"ต้องการยืนยันส่งไปสอบสวนใช่หรือไม่?"
|
||||
);
|
||||
modalPopup.value = true;
|
||||
// dialogConfirm(
|
||||
// $q,
|
||||
// () => confirmSentInvestigate(),
|
||||
// "ยืนยันส่งไปสอบสวน",
|
||||
// "ต้องการยืนยันส่งไปสอบสวนใช่หรือไม่?"
|
||||
// );
|
||||
}
|
||||
|
||||
function closePopup() {
|
||||
modalPopup.value = false;
|
||||
}
|
||||
|
||||
/** ยืนยัน ยุติเรื่อง */
|
||||
|
|
@ -177,7 +186,7 @@ onMounted(() => {
|
|||
</q-tab-panels>
|
||||
</q-card>
|
||||
|
||||
<!-- <Form :on-submit="onSubmit" :data="data" /> -->
|
||||
<Popup :modal="modalPopup" :close="closePopup" title="ส่งไปสอบสวน"/>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped>
|
||||
|
|
|
|||
|
|
@ -10,8 +10,7 @@ import { useInvestigateFactStore } from "@/modules/11_discipline/store/Investiga
|
|||
import type {
|
||||
FormData,
|
||||
MyObjectInvestigateRef,
|
||||
} from "@/modules/11_discipline/interface/request/investigate";
|
||||
import { diffDates } from "@fullcalendar/core/internal";
|
||||
} from "@/modules/11_discipline/interface/request/investigateFact";
|
||||
|
||||
const $q = useQuasar();
|
||||
const route = useRoute();
|
||||
|
|
@ -23,7 +22,7 @@ const { filterFnOptionsType } = investigateFactStore;
|
|||
const { date2Thai, dialogConfirm } = mixin;
|
||||
const investigateDis = useInvestigateDisStore();
|
||||
|
||||
const complaintsOptions = ref<any>([]);
|
||||
// const complaintsOptions = ref<any>([]);
|
||||
const isUpdate = ref<boolean>(false);
|
||||
|
||||
/** ตัวแปร ref สำหรับแสดง validate */
|
||||
|
|
@ -41,6 +40,7 @@ const investigationRef = ref<Object | null>(null);
|
|||
const daysExtendRef = ref<Object | null>(null);
|
||||
const statusResultRef = ref<Object | null>(null);
|
||||
const causeTextRef = ref<Object | null>(null);
|
||||
const reasonRef = ref<Object | null>(null);
|
||||
|
||||
/** รับ props มาจากหน้าหลัก */
|
||||
const props = defineProps({
|
||||
|
|
@ -70,11 +70,12 @@ const formData = reactive<FormData>({
|
|||
dateEnd: new Date(),
|
||||
investigation: "",
|
||||
daysExtend: null,
|
||||
statusResult: "ยังไม่ระบุ",
|
||||
statusResult: "",
|
||||
causeText: "",
|
||||
complaintStatus: "",
|
||||
reason: "",
|
||||
});
|
||||
const evidenceFiles = ref<any>([{ name: "ชื่อไฟล" }, { name: "ชื่อไฟล" }]);
|
||||
const evidenceFiles = ref<any>([{ name: "ชื่อไฟล์" }, { name: "ชื่อไฟล์" }]);
|
||||
|
||||
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
|
||||
const objectInvestigate: MyObjectInvestigateRef = {
|
||||
|
|
@ -91,6 +92,7 @@ const objectInvestigate: MyObjectInvestigateRef = {
|
|||
daysExtend: daysExtendRef,
|
||||
statusResult: statusResultRef,
|
||||
causeText: causeTextRef,
|
||||
reason: reasonRef,
|
||||
};
|
||||
|
||||
const rows = ref([]);
|
||||
|
|
@ -163,7 +165,7 @@ async function fetchDataDetail() {
|
|||
formData.dateEnd = props.data.dateEnd;
|
||||
formData.investigation = props.data.investigation;
|
||||
formData.daysExtend = props.data.daysExtend;
|
||||
formData.statusResult = props.data.results;
|
||||
formData.statusResult = props.data.statusResult;
|
||||
formData.causeText = props.data.results;
|
||||
}
|
||||
}
|
||||
|
|
@ -601,61 +603,162 @@ watch(props.data, async () => {
|
|||
/>
|
||||
</div>
|
||||
|
||||
<div class="row col-12 q-col-gutter-md">
|
||||
<div class="col-3">
|
||||
<q-select
|
||||
for="#fault"
|
||||
outlined
|
||||
dense
|
||||
:readonly="statusStep"
|
||||
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,
|
||||
<div class="row col-12">
|
||||
<q-card bordered class="row col-12" style="border: 1px solid #d6dee1">
|
||||
<div
|
||||
class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md"
|
||||
>
|
||||
ผลการสืบสวน
|
||||
</div>
|
||||
|
||||
<div class="col-12"><q-separator /></div>
|
||||
|
||||
<div class="col-xs-12 q-pa-sm row">
|
||||
<div class="row col-12 q-col-gutter-md">
|
||||
<div class="col-3">
|
||||
<q-select
|
||||
for="#fault"
|
||||
outlined
|
||||
dense
|
||||
:readonly="statusStep"
|
||||
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'
|
||||
)"
|
||||
><template v-slot:no-option>
|
||||
<q-item>
|
||||
<q-item-section class="text-grey">
|
||||
ไม่มีข้อมูล
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-select>
|
||||
</div>
|
||||
><template v-slot:no-option>
|
||||
<q-item>
|
||||
<q-item-section class="text-grey">
|
||||
ไม่มีข้อมูล
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-select>
|
||||
</div>
|
||||
|
||||
<div v-if="formData.statusResult == 'have_cause'" class="col-3">
|
||||
<q-select
|
||||
for="#fault"
|
||||
outlined
|
||||
dense
|
||||
ref="causeTextRef"
|
||||
v-model="formData.causeText"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกร้ายแรง/ไม่ร้ายแรง'}`]"
|
||||
:options="investigateFactStore.causeTextOptions"
|
||||
label="ร้ายแรง/ไม่ร้ายแรง"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
use-input
|
||||
><template v-slot:no-option>
|
||||
<q-item>
|
||||
<q-item-section class="text-grey">
|
||||
ไม่มีข้อมูล
|
||||
<div v-if="formData.statusResult == 'have_cause'" class="col-3">
|
||||
<q-select
|
||||
for="#fault"
|
||||
outlined
|
||||
dense
|
||||
ref="causeTextRef"
|
||||
v-model="formData.causeText"
|
||||
:rules="[
|
||||
(val) => !!val || `${'กรุณาเลือกร้ายแรง/ไม่ร้ายแรง'}`,
|
||||
]"
|
||||
:options="investigateFactStore.causeTextOptions"
|
||||
label="ร้ายแรง/ไม่ร้ายแรง"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
use-input
|
||||
><template v-slot:no-option>
|
||||
<q-item>
|
||||
<q-item-section class="text-grey">
|
||||
ไม่มีข้อมูล
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row col-12">
|
||||
<q-input
|
||||
class="full-width cursor-pointer"
|
||||
outlined
|
||||
ref="reasonRef"
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formData.reason"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกเหตุผล'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'เหตุผล'}`"
|
||||
type="textarea"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 q-pa-sm row">
|
||||
<q-file
|
||||
class="col-11"
|
||||
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 class="col-1 self-center">
|
||||
<q-btn
|
||||
size="14px"
|
||||
flat
|
||||
round
|
||||
dense
|
||||
color="add"
|
||||
class="q-ml-sm"
|
||||
icon="mdi-upload"
|
||||
><q-tooltip>อัปโหลดเอกสาร</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
|
||||
<q-list bordered separator class="full-width q-mt-md">
|
||||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
v-for="(file, index) in evidenceFiles"
|
||||
:key="index"
|
||||
>
|
||||
<q-item-section>{{ file.name + (index + 1) }}</q-item-section>
|
||||
<q-item-section avatar>
|
||||
<div class="row">
|
||||
<div>
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
size="12px"
|
||||
color="blue"
|
||||
icon="mdi-download-outline"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลด</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
<div>
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
size="12px"
|
||||
color="red"
|
||||
icon="mdi-delete-outline"
|
||||
><q-tooltip>ลบเอกสารหลักฐาน</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-select>
|
||||
</div>
|
||||
</q-list>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -668,87 +771,88 @@ watch(props.data, async () => {
|
|||
</div>
|
||||
</form>
|
||||
</q-card>
|
||||
<div class="col-12 row q-col-gutter-md q-mt-sm">
|
||||
<div class="row col-12">
|
||||
<q-card bordered class="row col-12" style="border: 1px solid #d6dee1">
|
||||
<div
|
||||
class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md"
|
||||
>
|
||||
อัปโหลดไฟล์เอกสารหลักฐาน
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="col-xs-12 q-pa-sm row">
|
||||
<q-file
|
||||
class="col-11 q-mt-sm"
|
||||
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 class="col-1 self-center">
|
||||
<q-btn
|
||||
size="14px"
|
||||
flat
|
||||
round
|
||||
dense
|
||||
color="add"
|
||||
class="q-ml-sm q-mt-sm"
|
||||
icon="mdi-upload"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
|
||||
<q-card flat class="q-pa-md q-mt-sm">
|
||||
<div class="col-12 row q-col-gutter-md">
|
||||
<div class="row col-12">
|
||||
<q-card bordered class="row col-12" style="border: 1px solid #d6dee1">
|
||||
<div class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md">
|
||||
อัปโหลดไฟล์เอกสารหลักฐาน
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-12 q-pa-sm row">
|
||||
<q-list bordered separator class="full-width">
|
||||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
v-for="(file, index) in evidenceFiles"
|
||||
:key="index"
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="col-xs-12 q-pa-sm row">
|
||||
<q-file
|
||||
class="col-11 q-mt-sm"
|
||||
for="#evidenceFiles"
|
||||
outlined
|
||||
dense
|
||||
ref="evidenceFilesRef"
|
||||
v-model="formData.evidenceFiles"
|
||||
label="ไฟล์เอกสารหลักฐาน"
|
||||
lazy-rules
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกไฟล์เอกสารหลักฐาน']"
|
||||
hide-bottom-space
|
||||
>
|
||||
<q-item-section>{{ file.name + (index + 1) }}</q-item-section>
|
||||
<q-item-section avatar>
|
||||
<div class="row">
|
||||
<div>
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
size="12px"
|
||||
color="blue"
|
||||
icon="mdi-download-outline"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลดเอกสารหลักฐาน</q-tooltip>
|
||||
</q-btn>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" color="primary" />
|
||||
</template>
|
||||
</q-file>
|
||||
<div class="col-1 self-center">
|
||||
<q-btn
|
||||
size="14px"
|
||||
flat
|
||||
round
|
||||
dense
|
||||
color="add"
|
||||
class="q-ml-sm q-mt-sm"
|
||||
icon="mdi-upload"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-12 q-pa-sm row">
|
||||
<q-list bordered separator class="full-width">
|
||||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
v-for="(file, index) in evidenceFiles"
|
||||
:key="index"
|
||||
>
|
||||
<q-item-section>{{ file.name + (index + 1) }}</q-item-section>
|
||||
<q-item-section avatar>
|
||||
<div class="row">
|
||||
<div>
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
size="12px"
|
||||
color="blue"
|
||||
icon="mdi-download-outline"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลดเอกสารหลักฐาน</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
<div>
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
size="12px"
|
||||
color="red"
|
||||
icon="mdi-delete-outline"
|
||||
><q-tooltip>ลบเอกสารหลักฐาน</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<q-btn
|
||||
dense
|
||||
flat
|
||||
round
|
||||
size="12px"
|
||||
color="red"
|
||||
icon="mdi-delete-outline"
|
||||
><q-tooltip>ลบเอกสารหลักฐาน</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</div>
|
||||
</q-card>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
|
||||
<Dialogbody
|
||||
v-model:Modal="modal"
|
||||
|
|
|
|||
|
|
@ -64,34 +64,13 @@ onMounted(async () => {
|
|||
{
|
||||
id: "001",
|
||||
subject: "ทุจริตในหน้าที่",
|
||||
interrogated: "ศิรินภา คงน้อยี่",
|
||||
fault: "1",
|
||||
status: "0",
|
||||
active: "1",
|
||||
},
|
||||
{
|
||||
id: "002",
|
||||
subject: "ทุจริตในหน้าที่",
|
||||
interrogated: "นายนครชัย วันดี",
|
||||
fault: "1",
|
||||
status: "1",
|
||||
active: "1",
|
||||
},
|
||||
{
|
||||
id: "003",
|
||||
subject: "กระทำทุจริตเงินกองทุน",
|
||||
interrogated: "นายกัณฐิมา กาฬสินธ์ุ",
|
||||
fault: "0",
|
||||
status: "1",
|
||||
active: "1",
|
||||
},
|
||||
{
|
||||
id: "004",
|
||||
subject: "พูดจาไม่สุภาพ",
|
||||
interrogated: "นายปิยรมย์ ศิริธาราฟ",
|
||||
fault: "0",
|
||||
status: "1",
|
||||
active: "1",
|
||||
interrogated: "บุคคล",
|
||||
complaintOffenseDetails: "NOT_SPECIFIED",
|
||||
investigationDetail: "appoint_directors",
|
||||
startDate: new Date ("2023-11-20"),
|
||||
endDate: new Date ("2023-11-25"),
|
||||
statusResult: "not_specified",
|
||||
status: "new"
|
||||
},
|
||||
]);
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue