รายการอุทธรณ์ร้องทุกข์

This commit is contained in:
setthawutttty 2023-12-14 10:18:04 +07:00
parent c65ac3cba6
commit 50b8f028b6
10 changed files with 885 additions and 207 deletions

View file

@ -3,6 +3,7 @@ const disciplineMain = `${env.API_URI}/discipline`;
const discipline = `${env.API_URI}/discipline/disciplinary`;
const investigate = `${env.API_URI}/discipline/investigate`;
const suspend = `${env.API_URI}/discipline/suspend`;
const appeal = `${env.API_URI}/discipline/complaint_appeal`;
export default {
directorList: (page: number, pageSize: number, keyword: string) =>
@ -77,4 +78,12 @@ export default {
suspendReport: () => `${suspend}/report`,
reportresult: (id: string) => `${disciplineMain}/result/report/${id}`,
appealMainList: (status: string, type: string, year: number, page: number, pageSize: number, keyword: string) => `${appeal}/admin?status=${status}&type=${type}&year=${year}&page=${page}&pageSize=${pageSize}&keyword=${keyword}`,
appealAdd: () => `${appeal}`,
appealByID: (id:string) => `${appeal}/${id}`,
appealUpLoadFile: (id:string) => `${appeal}/file/${id}`,
appealDeleteFile: (id:string,docId:string) => `${appeal}/file/${id}/${docId}`
};

View file

@ -1,14 +1,45 @@
<script setup lang="ts">
import Form from "@/modules/11_discipline/components/8_AppealComplain/Form.vue";
import config from "@/app.config";
import http from "@/plugins/http";
import { useRoute, useRouter } from "vue-router";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
const mixin = useCounterMixin();
const { showLoader, messageError, hideLoader, dialogConfirm, success } = mixin;
const $q = useQuasar();
const router = useRouter();
/** บันทึกข้อมูลเเละ route กลับหน้าหลัก */
async function onSubmit(){
console.log("add");
router.push(`/discipline-appealcomplain`);
};
async function onSubmit(data: any) {
console.log("add", data);
const formData = new FormData();
formData.append("profileId", data.profileId);
formData.append("citizenId", data.citizenId);
formData.append("fullname", data.fullname);
formData.append("title", data.title);
formData.append("description", data.description);
formData.append("type", data.type);
formData.append("year", data.year);
formData.append("caseType", data.caseType);
formData.append("caseNumber", data.caseNumber);
formData.append("file", data.file);
showLoader();
http
.post(config.API.appealAdd(), formData)
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
hideLoader();
});
// router.push(`/discipline-appealcomplain`);
}
</script>
<template>

View file

@ -0,0 +1,133 @@
<script setup lang="ts">
import { ref, onMounted, reactive } from "vue";
import Form from "@/modules/11_discipline/components/8_AppealComplain/Form.vue";
import { useRoute, useRouter } from "vue-router";
import { useCounterMixin } from "@/stores/mixin";
import type {
EditDataList,
HistoryStatusType,
fileObType,
} from "@/modules/11_discipline/interface/response/appealComplain";
import config from "@/app.config";
import http from "@/plugins/http";
import { useQuasar } from "quasar";
const $q = useQuasar();
const mixin = useCounterMixin();
const { showLoader, messageError, hideLoader, dialogConfirm, success } = mixin;
const route = useRoute();
const router = useRouter();
const id = ref<string>(route.params.id as string);
const historyStatusOb = reactive<HistoryStatusType>({
status: "",
createdAt: "",
});
const fileOb = reactive<fileObType>({
id: "",
pathName: "",
fileName: "",
});
const data = reactive<EditDataList>({
id: "",
title: "",
description: "",
status: "",
type: "",
year: new Date().getFullYear(),
caseType: "",
caseNumber: "",
fullname: "",
citizenId: "",
profileId: "",
lastUpdatedAt: "",
historyStatus: [historyStatusOb],
disciplineComplaint_Appeal_Docs: [fileOb],
});
/** บันทึกข้อมูลเเละ route กลับหน้าหลัก */
async function onSubmit(data: any) {
console.log(data)
const dataList = {
title: data.title,
description: data.description,
type: data.type,
year: data.year,
caseType: data.caseType,
caseNumber: data.caseNumber,
status: data.status,
};
showLoader();
http
.put(config.API.appealByID(id.value), dataList)
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
getData();
hideLoader();
});
// router.push(`/discipline-appealcomplain`);
}
function getData() {
showLoader();
http
.get(config.API.appealByID(id.value))
.then((res) => {
console.log(res);
const dataList = res.data.result;
data.id = dataList.id;
data.title = dataList.title;
data.description = dataList.description;
data.status = dataList.status;
data.type = dataList.type;
data.year = dataList.year;
data.caseType = dataList.caseType;
data.caseNumber = dataList.caseNumber;
data.fullname = dataList.fullname;
data.citizenId = dataList.citizenId;
data.profileId = dataList.profileId;
data.lastUpdatedAt = dataList.lastUpdatedAt;
data.disciplineComplaint_Appeal_Docs = dataList.disciplineComplaint_Appeal_Docs
data.historyStatus = dataList.historyStatus
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
}
onMounted(() => {
// fetchData();
getData();
});
</script>
<template>
<div class="col-xs-12 col-sm-12 col-md-11">
<div class="toptitle text-dark col-12 row items-center">
<q-btn
for="#backMaininvestigate"
icon="mdi-arrow-left"
unelevated
round
dense
flat
color="primary"
class="q-mr-sm"
@click="router.go(-1)"
/>
แกไขการอทธรณ/องทกข
</div>
<Form :on-submit="onSubmit" :data="data" :get-data="getData" />
</div>
</template>

View file

@ -1,16 +1,19 @@
<script setup lang="ts">
import { ref, reactive } from "vue";
import { ref, reactive, watch, onMounted } from "vue";
import { useQuasar } from "quasar";
import { useRoute, useRouter } from "vue-router";
import type { QTableProps } from "quasar";
import DialogAddPersonal from "@/components/Dialogs/AddPersonal.vue";
import { useCounterMixin } from "@/stores/mixin";
import { useAppealComplainStore } from "@/modules/11_discipline/store/AppealComplainStore";
import { useDisciplineMainStore } from "@/modules/11_discipline/store/main";
import type { MyObjectAppealRef } from "@/modules/11_discipline/interface/response/appealComplain";
import config from "@/app.config";
import http from "@/plugins/http";
import type { MyObjectAppealRef } from "@/modules/11_discipline/interface/response/appealComplain";
const isReadonly = ref<boolean>(false); //
const mainStore = useDisciplineMainStore();
const router = useRouter();
/** รับ props มาจากหน้าหลัก */
@ -32,26 +35,87 @@ const props = defineProps({
const $q = useQuasar();
const modalPerson = ref<boolean>(false);
const mixin = useCounterMixin();
const { dialogConfirm } = mixin;
const {
dialogConfirm,
dialogRemove,
showLoader,
success,
messageError,
dialogMessageNotify,
hideLoader
} = mixin;
const dataStore = useAppealComplainStore();
const modalEdit = ref<boolean>(false);
const formData = reactive<any>({
profileId: "xx",
title: "",
description: "",
caseType: "",
caseNumber: "",
type: "",
status: "",
file: null,
disciplineComplaint_Appeal_Docs:[],
year: new Date().getFullYear().toString(),
});
/** ตัวแปร validate */
const typeRef = ref<Object | null>(null);
const statusRef = ref<Object | null>(null);
const titleRef = ref<Object | null>(null);
const descriptionRef = ref<Object | null>(null);
const caseTypeRef = ref<Object | null>(null);
const caseNumberRef = ref<Object | null>(null);
const objectAppeal: MyObjectAppealRef = {
complaint: typeRef,
complaintdetail: statusRef,
type: typeRef,
title: titleRef,
description: descriptionRef,
caseTypeRef: caseTypeRef,
caseNumberRef: caseNumberRef,
};
/** หัวข้อที่เเสดงในตารางผู้ถูกร้องเรียน */
const visibleColumns = ref<string[]>(["info", "no", "citizenId", "fullname"]);
/** หัวตารางผู้ถูกร้องเรียน */
const columns = ref<QTableProps["columns"]>([
{
name: "info",
align: "left",
label: "",
sortable: false,
field: "info",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "no",
align: "left",
label: "ลำดับ",
sortable: false,
field: "no",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "citizenId",
align: "left",
label: "เลขบัตรประชาชน",
sortable: true,
field: "citizenId",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "fullname",
align: "left",
label: "ชื่อ - นามสกุล",
sortable: true,
field: "fullname",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
]);
/*** ฟังก์ชั่นสำหรับ validate ฟอร์ม */
function validateForm() {
const hasError = [];
@ -66,7 +130,14 @@ function validateForm() {
}
if (hasError.every((result) => result === true)) {
onSubmit();
if (dataStore.rowsAdd.length > 0) {
onSubmit();
} else {
dialogMessageNotify(
$q,
"กรุณาเพิ่มผู้ยื่นอุทธณ์/ร้องทุกข์ อย่างน้อย 1 บุคคล"
);
}
} else {
console.log("ไม่ผ่าน ");
// console.log(hasError);
@ -74,159 +145,455 @@ function validateForm() {
}
function toggleModal() {
modalPerson.value = true
modalPerson.value = !modalPerson.value;
}
async function addPerson(data: any) {
toggleModal();
}
function handleSave(returnData: any) {
console.log(returnData)
modalPerson.value = false
mainStore.rowsAdd = returnData
console.log(returnData);
modalPerson.value = false;
dataStore.rowsAdd = returnData.map((item: any) => ({
profileId: item.personId,
fullname: item.name,
citizenId: item.idcard,
}));
}
function inputEdit(val: boolean) {
return {
"full-width cursor-pointer ": val,
"full-width cursor-pointer inputgreen": !val,
};
}
function uploadFile() {
/** uploadFile */
const Data = new FormData();
Data.append("file", formData.file);
showLoader();
http
.put(config.API.appealUpLoadFile(formData.id), Data)
.then((res) => {
console.log(res);
success($q, "อัปโหลดไฟล์สำเร็จ");
props.getData();
// router.push(`/discipline/complaints`);
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
hideLoader();
formData.file = null;
});
}
function downloadFile(link: string) {
window.open(link, "_blank");
}
function deleteFile(id: string) {
dialogRemove($q, () => confirmDelete(id));
}
/**
* นย ลบ ไฟล
* @param id id file
*/
function confirmDelete(id: string) {
showLoader();
http
.delete(config.API.appealDeleteFile(formData.id, id))
.then((res) => {
success($q, `ลบไฟล์สำเร็จ`);
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
props.getData();
});
}
watch(props.data, async () => {
if (props.data !== null) {
isReadonly.value = true
formData.id = props.data.id;
formData.title = props.data.title;
formData.description = props.data.description;
formData.status = props.data.status;
formData.type = props.data.type;
formData.year = props.data.year;
formData.caseType = props.data.caseType;
formData.caseNumber = props.data.caseNumber;
formData.fullname = props.data.fullname;
formData.citizenId = props.data.citizenId;
formData.profileId = props.data.profileId;
formData.lastUpdatedAt = props.data.lastUpdatedAt;
formData.disciplineComplaint_Appeal_Docs = props.data.disciplineComplaint_Appeal_Docs
dataStore.getRow([
{
profileId: props.data.profileId,
fullname: props.data.fullname,
citizenId: props.data.citizenId,
},
]);
}
});
function onSubmit() {
dialogConfirm(
$q,
async () => {
console.log("add");
const dataRow = dataStore.rowsAdd;
const data = {
profileId: dataRow[0].profileId,
citizenId: dataRow[0].citizenId,
fullname: dataRow[0].fullname,
title: formData.title,
description: formData.description,
type: formData.type,
year: formData.year,
caseType: formData.caseType,
caseNumber: formData.caseNumber,
file: formData.file,
status: formData.status,
};
props.onSubmit(data);
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
);
}
onMounted(() => {
dataStore.columns = columns.value;
dataStore.visibleColumns = visibleColumns.value;
});
</script>
<template>
<form @submit.prevent="validateForm">
<q-card bordered>
<div class="q-pa-md">
<div class="q-gutter-y-sm">
<div class="row q-gutter-x-sm">
<div class="col-3">
<q-select
ref="typeRef"
v-model="formData.type"
label="ประเภท"
dense
outlined
emit-value
map-options
option-label="name"
option-value="id"
:options="dataStore.typeOptions"
:rules="[(val) => !!val || `${'กรุณาเลือกผู้ร้องเรียน'}`]"
lazy-rules
hide-bottom-space
/>
<div class="row">
<div class="col-sm-12 col-md-12">
<form @submit.prevent="validateForm">
<q-card bordered>
<div class="q-pa-md">
<div class="q-gutter-y-sm">
<div class="row">
<div class="col-3">
<q-select
ref="typeRef"
:class="inputEdit(isReadonly)"
:readonly="isReadonly"
v-model="formData.type"
label="ประเภท"
dense
outlined
emit-value
map-options
option-label="name"
option-value="id"
:options="dataStore.typeOptions"
:rules="[(val) => !!val || `${'กรุณาเลือกประเภท'}`]"
lazy-rules
hide-bottom-space
/>
</div>
</div>
<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"
>
นอทธณ/องทกข
<q-btn
v-if="!isReadonly"
size="12px"
flat
round
dense
color="add"
class="q-ml-sm"
icon="mdi-plus"
@click="toggleModal"
>
<q-tooltip>เพมผนอทธณ/องทกข</q-tooltip>
</q-btn>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-xs-12 q-pa-sm">
<q-table
ref="table"
:columns="dataStore.columns"
:rows="dataStore.rowsAdd"
row-key="idcard"
flat
bordered
dense
hide-bottom
class="custom-header-table"
:visible-columns="dataStore.visibleColumns"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th
v-for="col in props.cols"
:key="col.name"
:props="props"
style="color: #000000; font-weight: 500"
>
<span class="text-weight-medium">{{
col.label
}}</span>
</q-th>
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else-if="col.name == 'info'">
<q-btn
size="14px"
flat
round
dense
color="info"
icon="info"
@click="
router.push(`/registry/${props.row.personId}`)
"
><q-tooltip
>อมลในทะเบยนประว</q-tooltip
></q-btn
>
</div>
<div
v-else-if="col.name === 'organization'"
class="table_ellipsis"
>
{{ props.row.organization }}
</div>
<div v-else>
{{ col.value }}
</div>
</q-td>
</q-tr>
</template>
</q-table>
</div>
</q-card>
</div>
<div class="row col-12">
<div class="col-xs-3 col-sm-3" id="title">
<q-input
ref="titleRef"
dense
:class="inputEdit(isReadonly)"
outlined
hide-bottom-space
v-model="formData.title"
:rules="[(val) => !!val || 'กรุณากรอกเรื่องร้องเรียน']"
lazy-rules
label="เรื่องร้องเรียน"
/>
</div>
</div>
<div class="col-xs-12 col-sm-12" id="detail">
<q-input
ref="descriptionRef"
dense
:class="inputEdit(isReadonly)"
outlined
hide-bottom-space
v-model="formData.description"
:rules="[
(val) => !!val || 'กรุณากรอกรายละเอียดเรื่องร้องทุกข์',
]"
lazy-rules
label="รายละเอียดเรื่องร้องทุกข์"
type="textarea"
rows="5"
/>
</div>
<div class="row q-gutter-x-sm">
<div class="col-3">
<datepicker
menu-class-name="modalfix"
v-model="formData.year"
class="col-2"
:locale="'th'"
autoApply
:readonly="isReadonly"
year-picker
:enableTimePicker="false"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
:class="inputEdit(isReadonly)"
:readonly="isReadonly"
lazy-rules
outlined
:model-value="Number(formData.year) + 543"
:label="`${'ปีงบประมาณ'}`"
>
<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-3">
<q-input
ref="caseTypeRef"
:class="inputEdit(isReadonly)"
v-model="formData.caseType"
dense
outlined
:rules="[(val) => !!val || 'กรุณากรอกประเภทคดี']"
lazy-rules
label="ประเภทคดี"
/>
</div>
<div class="col-3">
<q-input
ref="caseNumberRef"
:class="inputEdit(isReadonly)"
v-model="formData.caseNumber"
dense
outlined
:rules="[(val) => !!val || 'กรุณากรอกเลขที่คดี']"
lazy-rules
label="เลขที่คดี"
/>
</div>
<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="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 class="col-12"><q-separator /></div>
<div class="col-12 q-pa-sm row">
<q-file
for="inputFiles"
class="col-11"
outlined
dense
v-model="formData.file"
@added="uploadFile"
label="ไฟล์เอกสารหลักฐาน"
hide-bottom-space
lazy-rules
accept=".pdf,.xlsx,.doc"
clearable
>
นอทธณ/องทกข
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
<div class="col-1 self-center text-center">
<q-btn
size="12px"
v-if="formData.file && isReadonly"
size="14px"
flat
round
dense
color="add"
class="q-ml-sm"
icon="mdi-plus"
@click="toggleModal"
icon="mdi-upload"
@click="uploadFile"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
>
<q-tooltip>เพมผนอทธณ/องทกข</q-tooltip>
</q-btn>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-xs-12 q-pa-sm">
<d-table
ref="table"
:columns="mainStore.columnsRespondent"
:rows="mainStore.rowsAdd"
row-key="idcard"
flat
</div>
<div v-if="formData.disciplineComplaint_Appeal_Docs.length > 0" class="col-xs-12 q-pa-sm row">
<q-list
v-for="data in formData.disciplineComplaint_Appeal_Docs"
:key="data.id"
class="full-width"
bordered
:paging="false"
dense
hide-bottom
class="custom-header-table"
:visible-columns="mainStore.visibleColumnsRespondent"
separator
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th
v-for="col in props.cols"
:key="col.name"
:props="props"
style="color: #000000; font-weight: 500"
>
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
<q-th auto-width></q-th>
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else-if="col.name == 'info'">
<q-btn
size="14px"
flat
round
dense
color="info"
icon="info"
@click="
router.push(`/registry/${props.row.personId}`)
"
><q-tooltip
>อมลในทะเบยนประว</q-tooltip
></q-btn
>
</div>
<div
v-else-if="col.name === 'organization'"
class="table_ellipsis"
>
{{ props.row.organization }}
</div>
<div v-else>
{{ col.value }}
</div>
</q-td>
</q-tr>
</template>
</d-table>
<q-item clickable v-ripple>
<q-item-section>{{ data.fileName }}</q-item-section>
<q-space />
<q-btn
size="12px"
flat
round
dense
color="blue"
icon="mdi-download"
@click="downloadFile(data.pathName)"
><q-tooltip>ดาวนโหลดไฟล</q-tooltip></q-btn
>
<q-btn
size="12px"
flat
round
dense
color="red"
class="q-ml-sm"
icon="mdi-delete-outline"
@click="deleteFile(data.id)"
><q-tooltip>ลบไฟล</q-tooltip></q-btn
>
</q-item>
</q-list>
</div>
</q-card>
<div class="col-12 q-pa-sm" v-else>
<q-card class="q-pa-md" bordered> ไมรายการเอกสาร </q-card>
</div>
</q-card>
</div>
</div>
</div>
<q-separator />
<div class="row col-12 q-pa-sm">
<q-space />
<q-btn id="onSubmit" type="submit" label="บันทึก" color="secondary"
><q-tooltip>นท</q-tooltip></q-btn
>
</div>
</q-card>
</form>
</div>
<!-- พโหลดไฟล -->
<!-- <div class="col-sm-12 col-md-3">
<q-card flat bordered class="q-pa-md q-mb-sm">
<div class="col-xs-12">
</div>
</div>
<q-separator />
<div class="row col-12 q-pa-sm">
<q-space />
<q-btn id="onSubmit" type="submit" label="บันทึก" color="secondary"
><q-tooltip>นท</q-tooltip></q-btn
>
</div>
</q-card>
</form>
</q-card>
</div> -->
</div>
<DialogAddPersonal
title="ผู้ถูกร้องเรียน"
:modal="modalPerson"
@ -238,3 +605,35 @@ function onSubmit() {
selecetSwitch="single"
/>
</template>
<style lang="scss">
.icon-color {
color: #4154b3;
}
.custom-header-table {
height: auto;
.q-table tr:nth-child(odd) td {
background: white;
}
.q-table tr:nth-child(even) td {
background: #f8f8f8;
}
.q-table thead tr {
background: #ecebeb;
}
.q-table thead tr th {
position: sticky;
z-index: 1;
}
/* this will be the loading indicator */
.q-table thead tr:last-child th {
/* height of all previous header rows */
top: 48px;
}
.q-table thead tr:first-child th {
top: 0;
}
}
</style>

View file

@ -47,7 +47,7 @@ const pagination = ref({
const formData = reactive<any>({
type: "ALL",
status: "",
status: "ALL",
year: new Date().getFullYear().toString(),
});
@ -55,11 +55,11 @@ const visibleColumns = ref<string[]>([
"no",
"type",
"title",
"name",
"idCard",
"fullname",
"citizenId",
"caseType",
"caseNo",
"dateEdit",
"caseNumber",
"lastUpdatedAt",
"status",
]);
@ -93,22 +93,22 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
{
name: "name",
name: "fullname",
align: "left",
label: "ชื่อ-นามสกุล",
sortable: true,
field: "name",
field: "fullname",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "idCard",
name: "citizenId",
align: "left",
label: "เลขประจำตัวประชาชน",
sortable: true,
field: "idCard",
field: "citizenId",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
@ -126,22 +126,22 @@ const columns = ref<QTableProps["columns"]>([
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "caseNo",
name: "caseNumber",
align: "left",
label: "คดีเลขที่",
sortable: true,
field: "caseNo",
field: "caseNumber",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "dateEdit",
name: "lastUpdatedAt",
align: "left",
label: "วันที่แก้ไข",
sortable: true,
field: "dateEdit",
field: "lastUpdatedAt",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
@ -201,11 +201,15 @@ watch(
/** ไปยังหน้าเพิ่มข้อมูล */
function redirectToPageadd() {
dataStore.rowsAdd = []
router.push(`/discipline-appealcomplain/add`);
}
function editPage(id: string) {
router.push(`/discipline-appealcomplain/${id}`);
}
function filterFn() {
// getList();
getData()
console.log("enter", filterKeyword.value);
}
@ -225,27 +229,43 @@ function editStatusReturn(data: any) {
});
console.log(data);
}
function getData() {
showLoader();
http
.get(
config.API.appealMainList(
formData.status,
formData.type,
formData.year,
currentPage.value,
rowsPerPage.value,
filterKeyword.value
)
)
.then((res) => {
maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
fetchAppealComplain(res.data.result.data)
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
}
function dataUpdate(){
getData()
}
/** เรียกใช้งาน ฟังชั่น ตอนเริ่มโหลดหน้า */
onMounted(async () => {
getData()
// await getList();
dataStore.visibleColumns = visibleColumns.value;
dataStore.columns = columns.value;
const data = [
{
id: "xxx-xxx-xxx",
type: "อุทธรณ์",
title: "โดนหัวหน้าตัดสินโดยไม่ยุติธรรม",
prefix: "นาง",
firstName: "สมใจ",
lastName: "ดีใจ",
idCard: "1234567890123",
caseType: "YYYY",
caseNo: "YYYY",
dateEdit: new Date("2023-12-08T06:55:00"),
status: "NEW",
},
];
await fetchAppealComplain(data);
});
</script>
@ -279,6 +299,7 @@ onMounted(async () => {
autoApply
year-picker
:enableTimePicker="false"
@update:model-value="dataUpdate"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
@ -291,6 +312,7 @@ onMounted(async () => {
outlined
:model-value="Number(formData.year) + 543"
:label="`${'ปีงบประมาณ'}`"
>
<template v-slot:prepend>
<q-icon
@ -316,6 +338,7 @@ onMounted(async () => {
option-label="name"
option-value="id"
:options="type"
@update:model-value="dataUpdate"
/>
</div>
<div class="col-2">
@ -329,6 +352,7 @@ onMounted(async () => {
option-label="name"
option-value="id"
:options="dataStore.statusOptions"
@update:model-value="dataUpdate"
/>
</div>
<q-space />
@ -372,8 +396,7 @@ onMounted(async () => {
ref="table"
:columns="dataStore.columns"
:rows="dataStore.rows"
:filter="filterKeyword"
row-key="interrogated"
row-key="id"
flat
bordered
:paging="true"
@ -409,7 +432,12 @@ onMounted(async () => {
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td v-for="col in props.cols" :key="col.name" :props="props">
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="editPage(props.row.id)"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>

View file

@ -98,7 +98,7 @@ watch(
<form @submit.prevent="validateForm">
<q-toolbar>
<q-toolbar-title class="text-subtitle2 text-bold">
{{ `แก้ไขสถานะ ${props.data.name}` }}
{{ `แก้ไขสถานะ ${props.data.fullname}` }}
</q-toolbar-title>
<q-btn
icon="close"

View file

@ -2,6 +2,10 @@ interface DataOption {
id: string;
name: string;
}
interface DataOptionYear {
id: number;
name: string;
}
interface DataOptioGroup {
id: string;
name: string;
@ -78,4 +82,5 @@ export type {
responseType,
FileLists,
DataOptioGroup,
DataOptionYear,
};

View file

@ -1,35 +1,70 @@
interface MainList {
id: string
type: string
title: string
prefix: string
firstName: string
lastName: string
idCard: string
caseType: string
caseNo: string
dateEdit: Date
description: string
status: string
type: string
year: number
caseType: string
caseNumber: string
fullname: string
citizenId: string
profileId: string
lastUpdatedAt: Date
}
interface RowList {
id: string
type: string
title: string
name: string
prefix: string
firstName: string
lastName: string
idCard: string
caseType: string
caseNo: string
dateEdit: string | null
description: string
status: string
type: string
year: number
caseType: string
caseNumber: string
fullname: string
citizenId: string
profileId: string
lastUpdatedAt: string | null
}
interface RowAddList {
profileId:string
fullname:string
citizenId:string
}
interface EditDataList {
id: string
title: string
description: string
status: string
type: string
year: number
caseType: string
caseNumber: string
fullname: string
citizenId: string
profileId: string
lastUpdatedAt: string
historyStatus: object | null
disciplineComplaint_Appeal_Docs: object | null
}
interface HistoryStatusType {
status: string
createdAt: string
}
interface fileObType {
id:string
pathName:string
fileName:string
}
interface MyObjectAppealRef {
complaint: object | null;
complaintdetail: object | null;
type: object | null;
title: object | null;
description: object | null;
caseTypeRef: object | null;
caseNumberRef: object | null;
[key: string]: any;
}
@ -39,4 +74,5 @@ interface EditStatusRef {
[key: string]: any;
}
export type { MainList, RowList , MyObjectAppealRef ,EditStatusRef};
export type { MainList, RowList, MyObjectAppealRef, EditStatusRef,EditDataList,HistoryStatusType,fileObType,RowAddList };

View file

@ -70,6 +70,7 @@ const suspendEditPage = () =>
const appealComplain = () => import('@/modules/11_discipline/components/8_AppealComplain/MainPage.vue')
const appealComplainAdd = () => import('@/modules/11_discipline/components/8_AppealComplain/AddPage.vue')
const appealComplainEdit = () => import('@/modules/11_discipline/components/8_AppealComplain/EditPage.vue')
export default [
{
path: "/discipline/complaints",
@ -302,6 +303,16 @@ export default [
Role: "discipline",
},
},
{
path: "/discipline-appealcomplain/:id",
name: "appealComplainEdit",
component: appealComplainEdit,
meta: {
Auth: true,
Key: [11.4],
Role: "discipline",
},
},
// {
// path: "/discipline-order",

View file

@ -3,12 +3,13 @@ import { ref } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import type { QTableProps } from "quasar";
import type { DataOption } from '@/modules/11_discipline/interface/index/Main'
import type { MainList, RowList } from '@/modules/11_discipline/interface/response/appealComplain'
import type { MainList, RowList,RowAddList } from '@/modules/11_discipline/interface/response/appealComplain'
export const useAppealComplainStore = defineStore(
"AppealComplainStore",
() => {
const rows = ref<RowList[]>([]);
const rowsAdd = ref<RowAddList[]>([]);
const visibleColumns = ref<string[]>([]);
const columns = ref<QTableProps["columns"]>([]);
@ -17,29 +18,51 @@ export const useAppealComplainStore = defineStore(
function fetchAppealComplain(data: MainList[]) {
let dataList: RowList[] = data.map((e: MainList) => ({
id: e.id,
type: e.type,
profileId: e.profileId,
type: typeConvert(e.type),
title: e.title,
name: `${e.prefix}${e.firstName} ${e.lastName}`,
prefix: e.prefix,
firstName: e.firstName,
lastName: e.lastName,
idCard: e.idCard,
description: e.description,
year: e.year,
fullname: e.fullname,
citizenId: e.citizenId,
caseType: e.caseType,
caseNo: e.caseNo,
dateEdit: date2Thai(e.dateEdit),
caseNumber: e.caseNumber,
lastUpdatedAt: date2Thai(e.lastUpdatedAt),
status: statusTothai(e.status),
}));
rows.value = dataList;
}
function getRow(data:RowAddList[]){
if(data){
rowsAdd.value = data
}
}
const statusTothai = (val: string) => {
switch (val) {
case "NEW":
return "ใหม่";
case "STOP":
return "ยุติเรื่อง";
case "SEND_INVESTIGATE":
return "มีมูลส่งไปสืบสวนแล้ว";
case "RECEIVE_DOC":
return "ได้รับเอกสารแล้ว";
case "RECEIVE_APPEAL":
return "รับอุทธรณ์/ร้องทุกข์";
case "NO_RECEIVE_APPEAL":
return "ไม่รับอุทธรณ์/ร้องทุกข์";
case "DIAGNOSTIC":
return "ตั้งองค์คณะวินิจฉัย";
case "SUMMARY":
return "สรุปผลการพิจารณา";
case "DONE":
return "ปิดคำร้อง";
default:
return "-";
}
};
const typeConvert = (val: string) => {
switch (val) {
case "APPEAL":
return "อุทธรณ์";
case "COMPLAIN":
return "ร้องทุกข์";
default:
return "-";
}
@ -54,13 +77,14 @@ export const useAppealComplainStore = defineStore(
])
const statusOptions = ref<DataOption[]>([
{ id: "ALL", name: "ทั้งหมด" },
{ id: "NEW", name: "ใหม่" },
{ id: "xx1", name: "ได้รับเอกสารแล้ว" },
{ id: "xx2", name: "รับอุทธรณ์/ร้องทุกข์" },
{ id: "xx3", name: "ไม่รับอุทธรณ์/ร้องทุกข์" },
{ id: "xx4", name: "ตั้งองค์คณะวินิจฉัย" },
{ id: "xx5", name: "สรุปผลการพิจารณา" },
{ id: "xx6", name: "ปิดคำร้อง" },
{ id: "RECEIVE_DOC", name: "ได้รับเอกสารแล้ว" },
{ id: "RECEIVE_APPEAL", name: "รับอุทธรณ์/ร้องทุกข์" },
{ id: "NO_RECEIVE_APPEAL", name: "ไม่รับอุทธรณ์/ร้องทุกข์" },
{ id: "DIAGNOSTIC", name: "ตั้งองค์คณะวินิจฉัย" },
{ id: "SUMMARY", name: "สรุปผลการพิจารณา" },
{ id: "DONE", name: "ปิดคำร้อง" },
]);
// function filterSelector(val: string, update: Function, type: string) {
@ -91,6 +115,8 @@ export const useAppealComplainStore = defineStore(
typeOptions,
statusOptions,
fiscalyearOP,
getRow,
rowsAdd
};
}
);