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 2023-11-16 16:02:18 +07:00
parent e9b7cddf09
commit 7f3dfafe33
11 changed files with 539 additions and 342 deletions
Download patch file Download diff file Expand all files Collapse all files

106
src/modules/11_discipline/components/1_Complaint/EditPage.vue
View file

@ -2,62 +2,88 @@
import { onMounted, reactive, ref } from "vue";
import Form from "@/modules/11_discipline/components/1_Complaint/Form.vue";
import { useRouter, useRoute } from "vue-router";
import type { FormData } from "@/modules/11_discipline/interface/request/complaint";
import type {
FormData,
ArrayPerson,
} from "@/modules/11_discipline/interface/request/complaint";
const router = useRouter();
const route = useRoute();
const id = ref<string>(route.params.id as string);
/** ข้อมูล v-model ของฟอร์ม */
const personOj = reactive<ArrayPerson>({
idcard: "",
name: "",
position: "",
positionLevel: "",
educationQualification: "",
organization: "",
});
const data = reactive<FormData>({
complainantType: "",
complainant: "",
respondentType: "",
office: "",
agency: "",
topicComplaint: "",
detail: "",
datereceive: null,
dateconsideration: null,
offenseDescription: "",
considerationLevel: "",
datewarn: null,
receivecomplaints: "",
petitioner: "",
files: null,
consideredAgency: "",
title: "",
description: "",
dateReceived: null,
dateConsideration: null,
offenseDetails: "",
levelConsideration: "",
dateNotification: null,
complaintFrom: "",
appellant: "",
documentFile: null,
complaintStatus: "",
organizationId: "",
persons: [personOj],
personId:[],
respondentId:[]
});
/** ดึงค่าจาก api */
const fetchData = async () => {
data.complainantType = "2"
data.complainant = "1"
data.office = "0"
data.agency = "2"
data.topicComplaint = "test"
data.detail = "test"
data.datereceive = new Date("2023-11-07T14:58:00")
data.dateconsideration = new Date("2023-11-07T14:58:00")
data.offenseDescription = "0"
data.considerationLevel = "0"
data.datewarn = new Date("2023-11-07T14:58:00")
data.receivecomplaints = "0"
data.petitioner = "test"
data.files = ""
data.respondentType = "PERSON";
data.office = "0";
data.consideredAgency = "2";
data.title = "ทุจริตในหน้าที่";
data.description = "มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน";
data.dateReceived = new Date("2023-11-05");
data.dateConsideration = new Date("2023-11-07T14:58:00");
data.offenseDetails = "NOT_SPECIFIED";
data.levelConsideration = "NORMAL";
data.dateNotification = new Date("2023-11-07T14:58:00");
data.complaintFrom = "สตง";
data.appellant = "สมศรี สุขใจ";
data.documentFile = "";
data.complaintStatus = "NEW";
data.persons = [
{
idcard: "1529900022223",
name: "นางศิรินภา คงน้อย",
position: "ธุรการ",
positionLevel: "ต้น",
educationQualification: "ปริญญาตรี",
organization: "สกจ.",
},
]
};
/** ฟังชั่น แก้ไข */
async function onSubmit() {
console.log("edit");
router.push(`/discipline/complaints`);
};
}
/** เรียกใช้งาน ฟังชั่น ตอนเริ่มโหลดหน้า */
onMounted(() => {
console.log(data);
fetchData();
});
</script>
<template>
<div class="col-xs-12 col-sm-12 col-md-11">
<div class="toptitle col-12 row items-center">
<div class="toptitle col-12 row items-end">
<q-btn
icon="mdi-arrow-left"
unelevated
@ -68,7 +94,25 @@ onMounted(() => {
class="q-mr-sm"
@click="$router.push(`/discipline/complaints`)"
/>
แก้ไขเรื่องร้องเรียน {{ id }}#id
<div class="q-ma-none">แก้ไขเรื่องร้องเรียน {{ id }}#id</div>
<q-space />
<div class="q-gutter-x-sm">
<q-btn
v-if="data.complaintStatus === 'NEW'"
label="มีมูลส่งไปสืบสวน"
color="public"
/>
<q-btn
v-if="data.complaintStatus === 'NEW'"
label="ยุติเรื่อง"
color="red-7"
/>
<q-btn
v-if="data.complaintStatus === 'STOP'"
label="ยกเลิกการยุติเรื่อง"
color="red-7"
/>
</div>
</div>
<Form :on-submit="onSubmit" :data="data" />

437
src/modules/11_discipline/components/1_Complaint/Form.vue
View file

@ -9,6 +9,7 @@ import type {
FormData,
MyObjectComplaintsRef,
DataAddRequest,
ArrayPerson,
} from "@/modules/11_discipline/interface/request/complaint";
/** importStroe*/
@ -28,20 +29,20 @@ const { date2Thai, dialogConfirm } = mixin;
const { selectComplainantTpye, filterSelector } = complainstStore; // function จาก store complainstStore
/** validateForm */
const complainantTypeRef = ref<Object | null>(null);
const respondentTypeRef = ref<Object | null>(null);
const complainantRef = ref<Object | null>(null);
const officeRef = ref<Object | null>(null);
const agencyRef = ref<Object | null>(null);
const topicComplaintRef = ref<Object | null>(null);
const detailRef = ref<Object | null>(null);
const datereceiveRef = ref<Object | null>();
const dateconsiderationRef = ref<Object | null>(null);
const offenseDescriptionRef = ref<Object | null>(null);
const considerationLevelRef = ref<Object | null>(null);
const datewarnRef = ref<Object | null>(null);
const receivecomplaintsRef = ref<Object | null>(null);
const petitionerRef = ref<Object | null>(null);
const filesRef = ref<Object | null>(null);
const consideredAgencyRef = ref<Object | null>(null);
const titleRef = ref<Object | null>(null);
const descriptionRef = ref<Object | null>(null);
const dateReceivedRef = ref<Object | null>();
const dateConsiderationRef = ref<Object | null>(null);
const offenseDetailsRef = ref<Object | null>(null);
const levelConsiderationRef = ref<Object | null>(null);
const dateNotificationRef = ref<Object | null>(null);
const complaintFromRef = ref<Object | null>(null);
const appellantRef = ref<Object | null>(null);
const documentFileRef = ref<Object | null>(null);
/** รับ props มาจากหน้าหลัก */
const props = defineProps({
@ -56,60 +57,72 @@ const props = defineProps({
});
/** ข้อมูล form*/
const personOj = reactive<ArrayPerson>({
idcard: "",
name: "",
position: "",
positionLevel: "",
educationQualification: "",
organization: "",
});
const formData = reactive<FormData>({
complainantType: "",
complainant: "",
respondentType: "",
office: "",
agency: "",
topicComplaint: "",
detail: "",
datereceive: null,
dateconsideration: null,
offenseDescription: "",
considerationLevel: "",
datewarn: null,
receivecomplaints: "",
petitioner: "",
files: null,
consideredAgency: "",
title: "",
description: "",
dateReceived: null,
dateConsideration: null,
offenseDetails: "",
levelConsideration: "",
dateNotification: null,
complaintFrom: "",
appellant: "",
documentFile: null,
complaintStatus: "",
persons: [personOj],
personId: [],
organizationId: null,
respondentId: [],
});
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
const objectComplaintsRef: MyObjectComplaintsRef = {
complainantType: complainantTypeRef,
complainant: complainantRef,
respondentType: respondentTypeRef,
office: officeRef,
agency: agencyRef,
topicComplaint: topicComplaintRef,
detail: detailRef,
datereceive: datereceiveRef,
dateconsideration: dateconsiderationRef,
offenseDescription: offenseDescriptionRef,
considerationLevel: considerationLevelRef,
datewarn: datewarnRef,
receivecomplaints: receivecomplaintsRef,
petitioner: petitionerRef,
files: filesRef,
consideredAgency: consideredAgencyRef,
title: titleRef,
description: descriptionRef,
dateReceived: dateReceivedRef,
dateConsideration: dateConsiderationRef,
offenseDetails: offenseDetailsRef,
levelConsideration: levelConsiderationRef,
dateNotification: dateNotificationRef,
complaintFrom: complaintFromRef,
appellant: appellantRef,
documentFile: documentFileRef,
};
/** options ทั้งหมด*/
const offenseDescriptiontoptions = ref<DataOption[]>([
{ id: "0", name: "ยังไม่ระบุ" },
{ id: "1", name: "ไม่ร้ายแรง" },
{ id: "2", name: "ร้ายแรง" },
const offenseDetailstoptions = ref<DataOption[]>([
{ id: "NOT_SPECIFIED", name: "ยังไม่ระบุ" },
{ id: "NOT_DEADLY", name: "ไม่ร้ายแรง" },
{ id: "DEADLY", name: "ร้ายแรง" },
]);
const considerationLeveltoptions = ref<DataOption[]>([
{ id: "0", name: "ปกติ" },
{ id: "1", name: "ด่วน" },
{ id: "2", name: "ด่วนมาก" },
const levelConsiderationtoptions = ref<DataOption[]>([
{ id: "NORMAL", name: "ปกติ" },
{ id: "URGENT", name: "ด่วน" },
{ id: "VERY_URGENT", name: "ด่วนมาก" },
]);
const receivecomplaintstoptions = ref<DataOption[]>([
{ id: "0", name: "สตง" },
{ id: "1", name: "ปปช" },
{ id: "2", name: "ปปท" },
{ id: "3", name: "จดหมาย" },
{ id: "4", name: "อีเมล" },
{ id: "5", name: "โทรศัพท์" },
{ id: "6", name: "บอกกล่าว" },
const complaintFromtoptions = ref<DataOption[]>([
{ id: "สตง", name: "สตง" },
{ id: "ปปช", name: "ปปช" },
{ id: "ปปท", name: "ปปท" },
{ id: "จดหมาย", name: "จดหมาย" },
{ id: "อีเมล", name: "อีเมล" },
{ id: "โทรศัพท์", name: "โทรศัพท์" },
{ id: "บอกกล่าว", name: "บอกกล่าว" },
]);
/** หัวตาราง */
@ -124,20 +137,20 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
{
name: "cardId",
name: "idcard",
align: "left",
label: "เลขบัตรประชาชน",
sortable: true,
field: "cardId",
field: "idcard",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "fullName",
name: "name",
align: "left",
label: "ชื่อ - นามสกุล",
sortable: true,
field: "fullName",
field: "name",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
@ -151,29 +164,29 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
{
name: "level",
name: "positionLevel",
align: "left",
label: "ระดับ",
sortable: true,
field: "level",
field: "positionLevel",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "degree",
name: "educationQualification",
align: "left",
label: "วุฒิการศึกษา",
sortable: true,
field: "degree",
field: "educationQualification",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "oc",
name: "organization",
align: "left",
label: "สังกัด",
sortable: true,
field: "oc",
field: "organization",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
@ -182,12 +195,12 @@ const columns = ref<QTableProps["columns"]>([
/** หัวข้อที่เเสดงในตาราง */
const visibleColumns = ref<string[]>([
"no",
"cardId",
"fullName",
"idcard",
"name",
"position",
"level",
"degree",
"oc",
"positionLevel",
"educationQualification",
"organization",
]);
/**
@ -195,9 +208,8 @@ const visibleColumns = ref<string[]>([
* @param val บุคคล หน่วยงาน กทม
*/
async function selectComplainant(val: string) {
formData.complainant = "";
formData.office = "";
formData.agency = "";
formData.consideredAgency = "";
if (val === "0") {
await fetchListname(); // ถ้าเลือกบุกคลจะเรียก function fetchListname เรียกรายชื่อจากทะเบียน
} else if (val === "1") {
@ -229,10 +241,10 @@ async function fetchOffice() {}
/**
* ฟังชั่นอัปโหลดไฟล์
* @param files ไฟล์ที่รับมา
* @param documentFile ไฟล์ที่รับมา
*/
async function fileUploadDoc(files: any) {
files.forEach((file: any) => {
async function fileUploadDoc(documentFile: any) {
documentFile.forEach((file: any) => {
fileDocDataUpload.value.push(file);
});
}
@ -251,12 +263,12 @@ function selectLevel(val: string) {
dayNum = 45; // ปกติ
}
// วันแจ้งเตือนล่วงหน้า
if (formData.dateconsideration) {
const currentDate = new Date(formData.dateconsideration);
if (formData.dateConsideration) {
const currentDate = new Date(formData.dateConsideration);
const newDate = new Date(
currentDate.getTime() + dayNum * 24 * 60 * 60 * 1000
);
formData.datewarn = newDate;
formData.dateNotification = newDate;
}
}
@ -299,40 +311,34 @@ async function addPerson() {
const listData: DataAddRequest[] = [
{
id: "001",
cardId: "0000000000001",
prefix: "นาง",
firstName: "ศิรินภา",
lastName: "คงน้อย",
idcard: "0000000000001",
name: "นางศิรินภา คงน้อย",
position: "ตำเเหน่ง1",
level: "level1",
degree: "ป.ตรี",
oc: "สำนักงาน 1",
positionLevel: "level1",
educationQualification: "ป.ตรี",
organization: "สำนักงาน 1",
},
{
id: "002",
cardId: "0000000000002",
prefix: "นาย",
firstName: "แก้ว",
lastName: "คำ",
idcard: "0000000000002",
name: "นายแก้ว คำ",
position: "ตำแหน่ง2",
level: "level2",
degree: "ป.โท",
oc: "สำนักงาน 2",
positionLevel: "level2",
educationQualification: "ป.โท",
organization: "สำนักงาน 2",
},
{
id: "003",
cardId: "0000000000003",
prefix: "นาย",
firstName: "ภัทรานุย",
lastName: "คงนอย",
idcard: "0000000000003",
name: "นายภัทรานุย คงนอย",
position: "ตำแหน่ง2",
level: "level3",
degree: "ป.เอก",
oc: "สำนักงาน 3",
positionLevel: "level3",
educationQualification: "ป.เอก",
organization: "สำนักงาน 3",
},
];
await complainstStore.fetchComplainstAdd(listData);
toggleModal()
toggleModal();
}
/**
@ -341,29 +347,31 @@ async function addPerson() {
* เก็บข้อมูลลง formData
*/
watch(props.data, async () => {
formData.complainantType = props.data.complainantType;
formData.complainant = props.data.complainant;
console.log(props.data.persons);
formData.respondentType = props.data.respondentType;
formData.office = props.data.office;
formData.agency = props.data.agency;
formData.topicComplaint = props.data.topicComplaint;
formData.detail = props.data.detail;
formData.datereceive = props.data.datereceive;
formData.dateconsideration = props.data.dateconsideration;
formData.offenseDescription = props.data.offenseDescription;
formData.considerationLevel = props.data.considerationLevel;
formData.datewarn = props.data.datewarn;
formData.receivecomplaints = props.data.receivecomplaints;
formData.petitioner = props.data.petitioner;
formData.files = props.data.files;
formData.consideredAgency = props.data.consideredAgency;
formData.title = props.data.title;
formData.description = props.data.description;
formData.dateReceived = props.data.dateReceived;
formData.dateConsideration = props.data.dateConsideration;
formData.offenseDetails = props.data.offenseDetails;
formData.levelConsideration = props.data.levelConsideration;
formData.dateNotification = props.data.dateNotification;
formData.complaintFrom = props.data.complaintFrom;
formData.appellant = props.data.appellant;
formData.documentFile = props.data.documentFile;
formData.complaintStatus = props.data.complaintStatus;
complainstStore.fetchComplainstAdd(props.data.persons);
});
/**
* ฟังชั่น รับค่าจาก คอมโพเเนน
* @param returnData ค่าที่ได้คืนมา
*/
function handleSave(returnData:any) {
console.log('returnData:', returnData);
}
function handleSave(returnData: any) {
console.log("returnData:", returnData);
}
onMounted(() => {
complainstStore.columns = columns.value;
@ -376,13 +384,17 @@ onMounted(() => {
<form @submit.prevent="validateForm">
<div class="col-12 row q-pa-md">
<div class="col-xs-12 col-sm-12 row q-col-gutter-md">
<div class="col-xs-12 col-sm-3" id="complainantType">
<div class="col-xs-12 col-sm-3" id="respondentType">
<q-select
for="SelectcomplainantType"
v-model="formData.complainantType"
ref="complainantTypeRef"
for="SelectrespondentType"
v-model="formData.respondentType"
ref="respondentTypeRef"
dense
outlined
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
label="ผู้ถูกร้องเรียน"
option-value="id"
option-label="name"
@ -393,11 +405,9 @@ onMounted(() => {
:options="complainstStore.complainantoptions"
:rules="[(val) => !!val || `${'กรุณาเลือกผู้ร้องเรียน'}`]"
lazy-rules
@update:model-value="
selectComplainant(formData.complainantType)
"
@update:model-value="selectComplainant(formData.respondentType)"
@filter="(inputValue: any,
doneFn: Function) => filterSelector(inputValue, doneFn, 'filtercomplainantType'
doneFn: Function) => filterSelector(inputValue, doneFn, 'filterrespondentType'
)"
>
<template v-slot:no-option>
@ -412,34 +422,47 @@ onMounted(() => {
<div
class="col-xs-12 col-sm-3"
v-if="formData.complainantType === '1'"
v-if="formData.respondentType === 'ORGANIZATION'"
id="office"
>
<q-input
<q-select
for="inputOffice"
name="office"
ref="officeRef"
dense
hide-bottom-space
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
outlined
option-label="name"
option-value="id"
emit-value
map-options
v-model="formData.office"
:options="complainstStore.officeOp"
label="เลือกสำนักงาน"
:rules="[(val) => !!val || `${'กรุณาเลือกสำนักงาน'}`]"
lazy-rules
/>
</div>
<div class="col-xs-12 col-sm-3" id="agency">
<div class="col-xs-12 col-sm-3" id="consideredAgency">
<q-select
ref="agencyRef"
ref="consideredAgencyRef"
for="selectAgency"
dense
outlined
v-model="formData.agency"
:options="complainstStore.agencytoptions"
v-model="formData.consideredAgency"
:options="complainstStore.consideredAgencytoptions"
label="หน่วยงานที่พิจารณา"
option-value="id"
option-label="name"
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
hide-bottom-space
emit-value
map-options
@ -447,7 +470,7 @@ onMounted(() => {
lazy-rules
use-input
@filter="(inputValue: any,
doneFn: Function) => filterSelector(inputValue, doneFn, 'filteragencytoptions'
doneFn: Function) => filterSelector(inputValue, doneFn, 'filterconsideredAgencytoptions'
)"
>
<template v-slot:no-option>
@ -460,10 +483,18 @@ onMounted(() => {
</q-select>
</div>
<div class="full-width" v-if="formData.complainantType === '0'">
<div class="full-width" v-if="formData.respondentType === 'PERSON'">
<div class="row col-12 q-mb-xs">
<q-space />
<q-btn color="blue" outline @click="toggleModal">
<q-btn
color="blue"
outline
@click="toggleModal"
v-if="
formData.complaintStatus === 'NEW' ||
formData.complaintStatus === ''
"
>
<q-icon left name="add" />
<div>เพิ่ม</div>
</q-btn>
@ -520,14 +551,18 @@ onMounted(() => {
</div>
</div>
<div class="col-xs-12 col-sm-12" id="topicComplaint">
<div class="col-xs-12 col-sm-12" id="title">
<q-input
for="inputTopicComplaint"
ref="topicComplaintRef"
ref="titleRef"
dense
outlined
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
hide-bottom-space
v-model="formData.topicComplaint"
v-model="formData.title"
:rules="[(val) => !!val || 'กรุณาการข้อมูล']"
lazy-rules
label="เรื่องร้องเรียน"
@ -536,14 +571,18 @@ onMounted(() => {
/>
</div>
<div class="col-xs-12 col-sm-12" id="detail">
<div class="col-xs-12 col-sm-12" id="description">
<q-input
for="inputDetail"
ref="detailRef"
ref="descriptionRef"
dense
outlined
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
hide-bottom-space
v-model="formData.detail"
v-model="formData.description"
:rules="[(val) => !!val || 'กรุณาการข้อมูล']"
lazy-rules
label="รายละเอียดที่เกี่นวข้องกับเรื่องที่ต้องการจะข้อเรียน"
@ -552,13 +591,17 @@ onMounted(() => {
/>
</div>
<div class="col-xs-12 col-sm-3" id="datereceive">
<div class="col-xs-12 col-sm-3" id="dateReceived">
<datepicker
menu-class-name="modalfix"
v-model="formData.datereceive"
v-model="formData.dateReceived"
:locale="'th'"
autoApply
borderless
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
:enableTimePicker="false"
week-start="0"
>
@ -571,14 +614,18 @@ onMounted(() => {
<template #trigger>
<q-input
for="inputDatereceive"
ref="datereceiveRef"
ref="dateReceivedRef"
outlined
dense
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
hide-bottom-space
class="full-width datepicker"
:model-value="
formData.datereceive != null
? date2Thai(formData.datereceive)
formData.dateReceived != null
? date2Thai(formData.dateReceived)
: null
"
label="วันที่รับเรื่อง"
@ -600,14 +647,18 @@ onMounted(() => {
</datepicker>
</div>
<div class="col-xs-12 col-sm-3" id="considerationLevel">
<div class="col-xs-12 col-sm-3" id="levelConsideration">
<q-select
for="selectConsiderationLevel"
ref="considerationLevelRef"
ref="levelConsiderationRef"
dense
outlined
v-model="formData.considerationLevel"
:options="considerationLeveltoptions"
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
v-model="formData.levelConsideration"
:options="levelConsiderationtoptions"
label="ระดับการพิจารณา"
option-value="id"
option-label="name"
@ -616,16 +667,20 @@ onMounted(() => {
map-options
:rules="[(val) => !!val || `${'กรุณาเลือกระดับการพิจารณา'}`]"
lazy-rules
@update:model-value="selectLevel(formData.considerationLevel)"
@update:model-value="selectLevel(formData.levelConsideration)"
/>
</div>
<div class="col-xs-12 col-sm-3" id="dateconsideration">
<div class="col-xs-12 col-sm-3" id="dateConsideration">
<datepicker
menu-class-name="modalfix"
v-model="formData.dateconsideration"
@update:model-value="selectLevel(formData.considerationLevel)"
v-model="formData.dateConsideration"
@update:model-value="selectLevel(formData.levelConsideration)"
:locale="'th'"
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
autoApply
borderless
:enableTimePicker="false"
@ -640,15 +695,19 @@ onMounted(() => {
<template #trigger>
<q-input
for="inputDateconsideration"
ref="dateconsiderationRef"
ref="dateConsiderationRef"
outlined
dense
class="full-width datepicker"
:model-value="
formData.dateconsideration != null
? date2Thai(formData.dateconsideration)
formData.dateConsideration != null
? date2Thai(formData.dateConsideration)
: null
"
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
label="วันที่กำหนดวันพิจารณา"
hide-bottom-space
:rules="[
@ -669,14 +728,18 @@ onMounted(() => {
</datepicker>
</div>
<div class="col-xs-12 col-sm-3" id="offenseDescription">
<div class="col-xs-12 col-sm-3" id="offenseDetails">
<q-select
for="selectOffenseDescription"
ref="offenseDescriptionRef"
ref="offenseDetailsRef"
dense
outlined
v-model="formData.offenseDescription"
:options="offenseDescriptiontoptions"
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
v-model="formData.offenseDetails"
:options="offenseDetailstoptions"
label="ลักษณะความผิด"
option-value="id"
option-label="name"
@ -688,12 +751,16 @@ onMounted(() => {
/>
</div>
<div class="col-xs-12 col-sm-3" id="datewarn">
<div class="col-xs-12 col-sm-3" id="dateNotification">
<datepicker
menu-class-name="modalfix"
v-model="formData.datewarn"
v-model="formData.dateNotification"
:locale="'th'"
autoApply
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
borderless
:enableTimePicker="false"
week-start="0"
@ -707,14 +774,18 @@ onMounted(() => {
<template #trigger>
<q-input
for="inputDatewarn"
ref="datewarnRef"
ref="dateNotificationRef"
outlined
dense
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
hide-bottom-space
class="full-width datepicker"
:model-value="
formData.datewarn != null
? date2Thai(formData.datewarn)
formData.dateNotification != null
? date2Thai(formData.dateNotification)
: null
"
label="วันที่แจ้งเตือนล่วงหน้า"
@ -737,14 +808,18 @@ onMounted(() => {
</datepicker>
</div>
<div class="col-xs-12 col-sm-3" id="receivecomplaints">
<div class="col-xs-12 col-sm-3" id="complaintFrom">
<q-select
for="selectReceivecomplaints"
ref="receivecomplaintsRef"
ref="complaintFromRef"
dense
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
outlined
v-model="formData.receivecomplaints"
:options="receivecomplaintstoptions"
v-model="formData.complaintFrom"
:options="complaintFromtoptions"
label="รับเรื่องร้องเรียน"
option-value="id"
option-label="name"
@ -756,13 +831,17 @@ onMounted(() => {
/>
</div>
<div class="col-xs-12 col-sm-12" id="petitioner">
<div class="col-xs-12 col-sm-12" id="appellant">
<q-input
for="inputPetitioner"
ref="petitionerRef"
ref="appellantRef"
dense
outlined
v-model="formData.petitioner"
v-model="formData.appellant"
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
label="ผู้ร้องเรียน"
:rules="[(val) => !!val || `${'กรุณากรอกข้อมูล'}`]"
lazy-rules
@ -772,14 +851,18 @@ onMounted(() => {
/>
</div>
<div class="col-12" id="files">
<div class="col-12" id="documentFile">
<q-file
for="inputFiles"
ref="filesRef"
ref="documentFileRef"
outlined
dense
class="fit"
v-model="formData.files"
:readonly="
formData.complaintStatus !== 'NEW' &&
formData.complaintStatus !== ''
"
v-model="formData.documentFile"
@added="fileUploadDoc"
label="ไฟล์เอกสารหลักฐาน"
hide-bottom-space
@ -796,7 +879,13 @@ onMounted(() => {
</div>
</div>
<q-separator />
<div class="row col-12 q-pa-sm">
<div
class="row col-12 q-pa-sm"
v-if="
formData.complaintStatus === 'NEW' ||
formData.complaintStatus === ''
"
>
<q-space />
<q-btn
for="ButtonOnSubmit"

46
src/modules/11_discipline/components/1_Complaint/MainPage.vue
View file

@ -22,34 +22,36 @@ async function fetchListComplaints() {
const listData: DataList[] = [
{
id: "001",
subject: "ทุจริตในหน้าที่",
detail: "มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน",
complainant: "นางศิรินภา คงน้อย",
offenseDescription: "ร้ายแรง",
creationDate: new Date("2023-12-01"),
considerationLevel: "ด่วนมาก",
considerationDeadlineDate: new Date("2023-12-02"),
title: "ทุจริตในหน้าที่",
description: "มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน",
respondent: "นางศิรินภา คงน้อย",
descMistake: "ร้ายแรง",
createdAt: new Date("2023-12-01"),
devLevel: "ด่วนมาก",
considerationDate: new Date("2023-12-02"),
complaintStatus: 'NEW',
},
{
id: "002",
subject: "ทุจริตในหน้าที่",
detail: "มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน",
complainant: "นายแก้ว คำ",
offenseDescription: "ร้ายแรง",
creationDate: new Date("2023-12-01"),
considerationLevel: "ด่วนมาก",
considerationDeadlineDate: new Date("2023-12-02"),
title: "ทุจริตในหน้าที่",
description: "มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน",
respondent: "นายแก้ว คำ",
descMistake: "ร้ายแรง",
createdAt: new Date("2023-12-01"),
devLevel: "ด่วนมาก",
considerationDate: new Date("2023-12-02"),
complaintStatus: 'STOP',
},
{
id: "003",
subject: "ทุจริตในหน้าที่",
detail:
"มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน",
complainant: "นายภัทรานุย คงนอย",
offenseDescription: "ร้ายแรง",
creationDate: new Date("2023-12-01"),
considerationLevel: "ด่วนมาก",
considerationDeadlineDate: new Date("2023-12-02"),
title: "ทุจริตในหน้าที่",
description:"มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน",
respondent: "นายภัทรานุย คงนอย",
descMistake: "ร้ายแรง",
createdAt: new Date("2023-12-01"),
devLevel: "ด่วนมาก",
considerationDate: new Date("2023-12-02"),
complaintStatus: 'SEND_INVESTIGATE',
},
];
await fetchComplainst(listData);

58
src/modules/11_discipline/components/1_Complaint/TableComplaint.vue
View file

@ -29,65 +29,74 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
{
name: "subject",
name: "title",
align: "left",
label: "เรื่อง",
sortable: true,
field: "subject",
field: "title",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "detail",
name: "description",
align: "left",
label: "รายละเอียด",
sortable: true,
field: "detail",
field: "description",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "complainant",
name: "respondent",
align: "left",
label: "ผู้ถูกร้องเรียน",
sortable: true,
field: "complainant",
field: "respondent",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "offenseDescription",
name: "descMistake",
align: "left",
label: "ลักษณะความผิด",
sortable: true,
field: "offenseDescription",
field: "descMistake",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "creationDate",
name: "createdAt",
align: "left",
label: "วันที่สร้างเรื่องร้องเรียน",
sortable: true,
field: "creationDate",
field: "createdAt",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "considerationLevel",
name: "devLevel",
align: "left",
label: "ระดับการพิจารณา",
sortable: true,
field: "considerationLevel",
field: "devLevel",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "considerationDeadlineDate",
name: "considerationDate",
align: "left",
label: "วันที่กำหนดพิจารณา",
sortable: true,
field: "considerationDeadlineDate",
field: "considerationDate",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "complaintStatus",
align: "left",
label: "สถานะเรื่องร้องเรียน",
sortable: true,
field: "complaintStatus",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
@ -96,13 +105,14 @@ const columns = ref<QTableProps["columns"]>([
/** หัวข้อที่เเสดงในตาราง */
const visibleColumns = ref<string[]>([
"no",
"subject",
"detail",
"complainant",
"offenseDescription",
"creationDate",
"considerationLevel",
"considerationDeadlineDate",
"title",
"description",
"respondent",
"descMistake",
"createdAt",
"devLevel",
"considerationDate",
'complaintStatus'
]);
/** เริ่มโหลดหน้า page เอาข้อมูลไปเก็บ ใน store*/
@ -155,10 +165,10 @@ function OpenEdit(id:string){
<q-td v-for="col in props.cols" :key="col.name" :props="props" @click="OpenEdit(props.row.id)">
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-if="col.name == 'detail'">
</div>
<div v-if="col.name == 'description'">
<div class="table_ellipsis">
{{ props.row.detail }}
{{ props.row.description }}
</div>
</div>
<div v-else>

22
src/modules/11_discipline/components/2_InvestigateFacts/EditPage.vue
View file

@ -25,6 +25,7 @@ const data = reactive<FormData>({
daysExtend: null,
statusResult: "",
causeText: "",
complaintStatus: ""
});
/** จำลองข้อมูลจาก api */
@ -44,6 +45,7 @@ const fetchData = async () => {
data.daysExtend = null;
data.statusResult = "ไม่ระบุ";
data.causeText = "";
data.complaintStatus = "NEW";
};
/**
@ -75,7 +77,25 @@ onMounted(() => {
class="q-mr-sm"
@click="$router.push(`/discipline/investigatefacts`)"
/>
แก้ไขรายการสืบสวนข้อเท็จจริง {{ id }}#id
<div class="q-ma-none">แก้ไขรายการสืบสวนข้อเท็จจริง {{ id }}#id</div>
<q-space />
<div class="q-gutter-x-sm">
<q-btn
v-if="data.complaintStatus === 'NEW'"
label="มีมูลส่งไปออกคำสั่ง"
color="public"
/>
<q-btn
v-if="data.complaintStatus === 'NEW'"
label="ยุติเรื่อง"
color="red-7"
/>
<q-btn
v-if="data.complaintStatus === 'STOP'"
label="ยกเลิกการยุติเรื่อง"
color="red-7"
/>
</div>
</div>
<Form :on-submit="onSubmit" :data="data" />

2
src/modules/11_discipline/components/2_InvestigateFacts/Form.vue
View file

@ -65,6 +65,7 @@ const formData = reactive<FormData>({
daysExtend: null,
statusResult: "ยังไม่ระบุ",
causeText: "",
complaintStatus:''
});
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
@ -498,6 +499,7 @@ watch(props.data, async () => {
for="#fault"
outlined
dense
lazy-rules
ref="statusResultRef"
v-model="formData.statusResult"
:rules="[(val) => !!val || `${'กรุณาเลือกผลการสืบสวน'}`]"

81
src/modules/11_discipline/interface/request/complaint.ts
View file

@ -1,50 +1,61 @@
interface FormData {
complainantType: string
complainant: string
respondentType: string
office: string
agency: string
topicComplaint: string
detail: string
datereceive: Date | null
dateconsideration: Date | null
offenseDescription: string
considerationLevel: string
datewarn: Date | null
receivecomplaints: string
petitioner: string
files: any | null
consideredAgency: string
title: string
description: string
dateReceived: Date | null
dateConsideration: Date | null
offenseDetails: string
levelConsideration: string
dateNotification: Date | null
complaintFrom: string
appellant: string
documentFile: any | null
complaintStatus: string
persons: ArrayPerson[]
personId: Array
organizationId:string|null
respondentId:Array
}
interface ArrayPerson {
idcard: string,
name: string,
position: string,
positionLevel: string,
educationQualification: string,
organization: string,
}
interface MyObjectComplaintsRef {
complainantType: object | null;
complainant: object | null;
respondentType: object | null;
office: object | null;
agency: object | null;
topicComplaint: object | null;
datereceive: object | null;
dateconsideration: object | null;
offenseDescription: object | null;
considerationLevel: object | null;
datewarn: object | null;
receivecomplaints: object | null;
petitioner: object | null;
files: object | null;
consideredAgency: object | null;
title: object | null;
description: object | null;
dateReceived: object | null;
dateConsideration: object | null;
offenseDetails: object | null;
levelConsideration: object | null;
dateNotification: object | null;
complaintFrom: object | null;
appellant: object | null;
documentFile: object | null;
[key: string]: any;
}
interface DataAddRequest {
id:string
cardId:string
prefix:string
firstName:string
lastName:string
position:string
level:string
degree:string
oc:string
id: string
idcard: string
name: string
position: string
positionLevel: string
educationQualification: string
organization: string
}
export type {
FormData,
MyObjectComplaintsRef,
DataAddRequest
DataAddRequest,
ArrayPerson
}

1
src/modules/11_discipline/interface/request/investigate.ts
View file

@ -13,6 +13,7 @@ interface FormData {
investigation: string;
statusResult: string;
causeText: string;
complaintStatus:string
}
interface MyObjectInvestigateRef {
complaint: object | null;

53
src/modules/11_discipline/interface/response/complaint.ts
View file

@ -1,41 +1,42 @@
interface DataListRow {
subject: string
detail: string
complainant: string
offenseDescription: string
creationDate: string | null
considerationLevel: string
considerationDeadlineDate: string | null
id:string
title: string
description: string
respondent: string
descMistake: string
createdAt: string
devLevel: string
considerationDate: string
complaintStatus: string
}
interface DataAdd {
id:string
cardId:string
fullName:string
idcard:string
name:string
position:string
level:string
degree:string
oc:string
positionLevel:string
educationQualification:string
organization:string
}
interface DataAddResponse {
id:string
cardId:string
prefix:string
firstName:string
lastName:string
idcard:string
name:string
position:string
level:string
degree:string
oc:string
positionLevel:string
educationQualification:string
organization:string
}
interface DataList {
id:string
subject: string
detail: string
complainant: string
offenseDescription: string
creationDate: Date
considerationLevel: string
considerationDeadlineDate: Date
title: string
description: string
respondent: string
descMistake: string
createdAt: Date
devLevel: string
considerationDate: Date
complaintStatus: string
}

69
src/modules/11_discipline/store/ComplaintsStore.ts
View file

@ -3,7 +3,7 @@ import { ref } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import type { DataOption } from "@/modules/11_discipline/interface/index/Main";
import type { DataList, DataListRow,DataAdd,DataAddResponse } from "@/modules/11_discipline/interface/response/complaint"
import type { DataList, DataListRow, DataAdd, DataAddResponse } from "@/modules/11_discipline/interface/response/complaint"
import type { QTableProps } from "quasar";
const mixin = useCounterMixin()
@ -26,42 +26,58 @@ export const useComplainstDataStore = defineStore("DisciplineComplainst", () =>
function fetchComplainstAdd(data: DataAddResponse[]) {
let datalist = data.map((e: DataAddResponse) => ({
id: e.id,
cardId: e.cardId,
fullName:`${e.prefix}${e.firstName} ${e.lastName}`,
idcard: e.idcard,
name: e.name,
position: e.position,
level: e.level,
degree: e.degree,
oc: e.oc,
positionLevel: e.positionLevel,
educationQualification: e.educationQualification,
organization: e.organization,
}))
rowsAdd.value = datalist
}
function fetchComplainst(data: DataList[]) {
let datalist = data.map((e: DataList) => ({
id: e.id,
subject: e.subject,
detail: e.detail,
complainant: e.complainant,
offenseDescription: e.offenseDescription,
creationDate: date2Thai(e.creationDate),
considerationLevel: e.considerationLevel,
considerationDeadlineDate: date2Thai(e.considerationDeadlineDate),
}))
rows.value = datalist
}
let datalist: DataListRow[] = data.map((e: DataList) => ({
id: e.id,
title: e.title,
description: e.description,
respondent: e.respondent,
descMistake: e.descMistake,
createdAt: date2Thai(e.createdAt)!,
devLevel: e.devLevel,
considerationDate: date2Thai(e.considerationDate)!,
complaintStatus: statusTothai(e.complaintStatus),
}));
rows.value = datalist;
}
// filter options
const complainantoptionsMain = ref<DataOption[]>([
{ id: "0", name: "บุคคล" },
{ id: "1", name: "หน่วยงาน" },
{ id: "2", name: "กรุงเทพมหานคร" },
{ id: "PERSON", name: "บุคคล" },
{ id: "ORGANIZATION", name: "หน่วยงาน" },
{ id: "BANGKOK", name: "กรุงเทพมหานคร" },
]);
const complainantoptions = ref<DataOption[]>(complainantoptionsMain.value)
const agencytoptionsMain = ref<DataOption[]>([
const consideredAgencytoptions = ref<DataOption[]>([
{ id: "0", name: "หน่ายงานเอ" },
{ id: "1", name: "หน่ายงานบี" },
{ id: "2", name: "หน่ายงานชี" },
]);
const agencytoptions = ref<DataOption[]>(agencytoptionsMain.value)
const officeOp = ref<DataOption[]>([
{ id: "0", name: "สำนักงาน1" },
{ id: "1", name: "สำนักงาน2" },
{ id: "2", name: "สำนักงาน3" },
]);
const statusTothai = (val: string) => {
switch (val) {
case 'NEW': return "ใหม่";
case 'STOP': return "ยุติเรื่อง";
case 'SEND_INVESTIGATE': return "มีมูลส่งไปสืบสวนแล้ว";
default: return "-";
}
};
const agencytoptions = ref<DataOption[]>(consideredAgencytoptions.value)
const optionListNameMain = ref<DataOption[]>([])
const optionListName = ref<DataOption[]>([])
@ -79,7 +95,7 @@ export const useComplainstDataStore = defineStore("DisciplineComplainst", () =>
);
} else if (type === "filteragencytoptions") {
agencytoptions.value = agencytoptionsMain.value.filter(
agencytoptions.value = consideredAgencytoptions.value.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
} else if (type === "filtercomplainantOP") {
@ -100,9 +116,10 @@ export const useComplainstDataStore = defineStore("DisciplineComplainst", () =>
selectComplainantTpye,
filterSelector,
complainantoptions,
agencytoptions,
consideredAgencytoptions,
optionListName,
fetchComplainstAdd
fetchComplainstAdd,
officeOp
}