api รายการสืบสวนข้อเท็จจริง
This commit is contained in:
setthawutttty
parent
691a989c16
commit
3c5fcc029b
14 changed files with 1025 additions and 383 deletions
|
|
@ -8,63 +8,101 @@ import { useInvestigateFactStore } from "@/modules/11_discipline/store/Investiga
|
|||
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";
|
||||
import config from "@/app.config";
|
||||
import http from "@/plugins/http";
|
||||
|
||||
const $q = useQuasar();
|
||||
const mixin = useCounterMixin();
|
||||
const store = useInvestigateFactStore();
|
||||
const { dialogConfirm } = mixin;
|
||||
const { dialogConfirm, showLoader, success, hideLoader, messageError } = mixin;
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const id = ref<string>(route.params.id as string);
|
||||
|
||||
/** ข้อมูล v-model ของฟอร์ม */
|
||||
const data = reactive<FormData>({
|
||||
id: "",
|
||||
idComplaint: "",
|
||||
investigationDetail: "",
|
||||
complaint: "",
|
||||
complaintdetail: "",
|
||||
detail: "",
|
||||
investigationDescription: "",
|
||||
fault: "",
|
||||
other: "",
|
||||
investigationDetailOther: "",
|
||||
evidenceFiles: null,
|
||||
fileComplaint: null,
|
||||
clickTime: false,
|
||||
date: null,
|
||||
dateEnd: new Date(),
|
||||
investigation: "",
|
||||
investigationDateStart: null,
|
||||
investigationDateEnd: null,
|
||||
daysExtend: null,
|
||||
statusResult: "",
|
||||
causeText: "",
|
||||
investigationStatusResult: "",
|
||||
investigationCauseText: "",
|
||||
complaintStatus: "",
|
||||
reason: "",
|
||||
result: "",
|
||||
directors: [],
|
||||
disciplineInvestigateDocs: [],
|
||||
disciplineInvestigateRelevantDocs: [],
|
||||
status: "",
|
||||
documentFile: null,
|
||||
respondentType: "",
|
||||
organizationId: "",
|
||||
persons:[]
|
||||
});
|
||||
|
||||
/** จำลองข้อมูลจาก api */
|
||||
const fetchData = async () => {
|
||||
// ดึงค่าจาก api
|
||||
data.complaint = "เรื่องที่ 1";
|
||||
data.complaintdetail = "รายละเอียด";
|
||||
data.detail = "รายละเอียด";
|
||||
data.fault = "001";
|
||||
data.other = "";
|
||||
data.evidenceFiles = null;
|
||||
data.fileComplaint = null;
|
||||
data.clickTime = false;
|
||||
data.date = new Date("2023-11-07T14:58:00");
|
||||
data.dateEnd = new Date("2023-11-08T14:58:00");
|
||||
data.investigation = "appoint_directors";
|
||||
data.daysExtend = null;
|
||||
data.statusResult = "not_specified";
|
||||
data.causeText = "";
|
||||
data.complaintStatus = "NEW";
|
||||
};
|
||||
function getData() {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.investigateById(id.value))
|
||||
.then((res) => {
|
||||
console.log(res.data.result);
|
||||
const dataList = res.data.result;
|
||||
data.id = dataList.id;
|
||||
data.idComplaint = dataList.idComplaint;
|
||||
data.respondentType = dataList.respondentType
|
||||
data.persons = dataList.persons
|
||||
data.investigationDetail = dataList.investigationDetail;
|
||||
data.investigationDetailOther = dataList.investigationDetailOther;
|
||||
data.investigationDateStart = dataList.investigationDateStart;
|
||||
data.investigationDateEnd = dataList.investigationDateEnd;
|
||||
data.investigationDescription = dataList.investigationDescription;
|
||||
data.investigationCauseText = dataList.investigationCauseText;
|
||||
data.status = dataList.status;
|
||||
data.result = dataList.result;
|
||||
data.directors = dataList.director;
|
||||
data.disciplineInvestigateDocs = dataList.disciplineInvestigateDocs;
|
||||
data.disciplineInvestigateRelevantDocs =
|
||||
dataList.disciplineInvestigateRelevantDocs;
|
||||
data.investigationStatusResult = dataList.investigationStatusResult;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* บันทึกข้อมูลที่เเก้ไข
|
||||
* @param id ระบุ บุคคล
|
||||
*/
|
||||
async function onSubmit(id: string) {
|
||||
async function onSubmit(data: any) {
|
||||
// put
|
||||
console.log("edit", id);
|
||||
router.push(`/discipline/investigatefacts`);
|
||||
console.log("edit", data);
|
||||
showLoader();
|
||||
http
|
||||
.put(config.API.investigateById(id.value), data)
|
||||
.then((res) => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
// router.push(`/discipline/complaints`);
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
hideLoader();
|
||||
});
|
||||
// router.push(`/discipline/investigatefacts`);
|
||||
}
|
||||
|
||||
const modalPopup = ref<boolean>(false);
|
||||
|
|
@ -110,17 +148,40 @@ function confirmSentInvestigate() {
|
|||
|
||||
/** ฟังชั่น ยุติเรื่อง*/
|
||||
function confirmEndInvestigate() {
|
||||
console.log("sent");
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.investigateReject(id.value))
|
||||
.then((res) => {
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
await getData();
|
||||
});
|
||||
}
|
||||
|
||||
/** ฟังชั่น ยกเลิกการยุติเรื่อง*/
|
||||
function confirmCancelInvestigate() {
|
||||
console.log("sent");
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.investigateResume(id.value))
|
||||
.then((res) => {
|
||||
getData();
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/** โหลดข้อมูลเมื่อเข้าหน้านี้ */
|
||||
onMounted(() => {
|
||||
fetchData();
|
||||
getData();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
@ -137,24 +198,24 @@ onMounted(() => {
|
|||
class="q-mr-sm"
|
||||
@click="$router.push(`/discipline/investigatefacts`)"
|
||||
/>
|
||||
<div class="q-ma-none">แก้ไขรายการสืบสวนข้อเท็จจริง {{ id }}#id</div>
|
||||
<div class="q-ma-none">แก้ไขรายการสืบสวนข้อเท็จจริง</div>
|
||||
<q-space />
|
||||
<div class="q-gutter-x-sm">
|
||||
<q-btn
|
||||
v-if="data.complaintStatus === 'NEW'"
|
||||
v-if="data.status === 'NEW'"
|
||||
label="ส่งไปสอบสวน"
|
||||
color="public"
|
||||
@click="sentInvestigate"
|
||||
/>
|
||||
|
||||
<q-btn
|
||||
v-if="data.complaintStatus === 'NEW'"
|
||||
v-if="data.status === 'NEW'"
|
||||
label="ยุติเรื่อง"
|
||||
color="red-7"
|
||||
@click="endInvestigate"
|
||||
/>
|
||||
<q-btn
|
||||
v-if="data.complaintStatus === 'STOP'"
|
||||
v-if="data.status === 'STOP'"
|
||||
label="ยกเลิกการยุติเรื่อง"
|
||||
color="red-7"
|
||||
@click="cancelInvestigate"
|
||||
|
|
@ -181,12 +242,16 @@ onMounted(() => {
|
|||
<FormComplaints :on-submit="onSubmit" />
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="investigatefacts">
|
||||
<FormInvestigatefacts :on-submit="onSubmit" :data="data" />
|
||||
<FormInvestigatefacts
|
||||
:on-submit="onSubmit"
|
||||
:data="data"
|
||||
:get-data="getData"
|
||||
/>
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
</q-card>
|
||||
|
||||
<Popup :modal="modalPopup" :close="closePopup" title="ส่งไปสอบสวน"/>
|
||||
<Popup :modal="modalPopup" :close="closePopup" title="ส่งไปสอบสวน" />
|
||||
</div>
|
||||
</template>
|
||||
<style scoped>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,9 @@
|
|||
import { useRouter, useRoute } from "vue-router";
|
||||
import { onMounted, ref, watch, reactive, computed } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import type { QTableProps } from "quasar";
|
||||
import Dialogbody from "@/modules/11_discipline/components/3_InvestigateDisciplinary/Dialogbody.vue";
|
||||
import DialogAddPersonal from "@/components/Dialogs/AddPersonal.vue";
|
||||
import Table from "@/modules/11_discipline/components/3_InvestigateDisciplinary/DirectorTable.vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useInvestigateDisStore } from "@/modules/11_discipline/store/InvestigateDisStore";
|
||||
|
|
@ -12,35 +14,50 @@ import type {
|
|||
MyObjectInvestigateRef,
|
||||
} from "@/modules/11_discipline/interface/request/investigateFact";
|
||||
|
||||
import config from "@/app.config";
|
||||
import http from "@/plugins/http";
|
||||
|
||||
const $q = useQuasar();
|
||||
const route = useRoute();
|
||||
|
||||
const modalPerson = ref<boolean>(false);
|
||||
const toggleModal = () => (modalPerson.value = !modalPerson.value);
|
||||
/**เรียกใช้ store */
|
||||
const investigateFactStore = useInvestigateFactStore();
|
||||
const mixin = useCounterMixin();
|
||||
const { filterFnOptionsType } = investigateFactStore;
|
||||
const { date2Thai, dialogConfirm } = mixin;
|
||||
const {
|
||||
date2Thai,
|
||||
dialogConfirm,
|
||||
showLoader,
|
||||
hideLoader,
|
||||
success,
|
||||
messageError,
|
||||
dialogRemove,
|
||||
} = mixin;
|
||||
const investigateDis = useInvestigateDisStore();
|
||||
|
||||
// const complaintsOptions = ref<any>([]);
|
||||
const isUpdate = ref<boolean>(false);
|
||||
|
||||
const filterTable = ref<string>("");
|
||||
const filterKeyword = ref<string>("");
|
||||
const maxPage = ref<number>(1);
|
||||
const page = ref<number>(1);
|
||||
const rowsPerPage = ref<number>(10);
|
||||
/** ตัวแปร ref สำหรับแสดง validate */
|
||||
const complaintRef = ref<Object | null>(null);
|
||||
const complaintdetailRef = ref<Object | null>(null);
|
||||
const detailRef = ref<Object | null>(null);
|
||||
const investigationDescriptionRef = ref<Object | null>(null);
|
||||
const faultRef = ref<Object | null>(null);
|
||||
const otherRef = ref<Object | null>(null);
|
||||
const evidenceFilesRef = ref<Object | null>(null);
|
||||
const investigationDetailOtherRef = ref<Object | null>(null);
|
||||
const fileComplaintRef = ref<Object | null>(null);
|
||||
const clickTimeRef = ref<Object | null>(null);
|
||||
const dateRef = ref<Object | null>(null);
|
||||
const dateEndRef = ref<Object | null>(null);
|
||||
const investigationRef = ref<Object | null>(null);
|
||||
const investigationDetailRef = 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);
|
||||
const investigationStatusResultRef = ref<Object | null>(null);
|
||||
const investigationCauseTextRef = ref<Object | null>(null);
|
||||
const resultRef = ref<Object | null>(null);
|
||||
|
||||
/** รับ props มาจากหน้าหลัก */
|
||||
const props = defineProps({
|
||||
|
|
@ -52,47 +69,59 @@ const props = defineProps({
|
|||
type: Function,
|
||||
default: () => "",
|
||||
},
|
||||
getData: {
|
||||
type: Function,
|
||||
default: () => "",
|
||||
},
|
||||
});
|
||||
|
||||
const filter = ref<string>("");
|
||||
|
||||
/** ข้อมูล v-model ของฟอร์ม */
|
||||
const formData = reactive<FormData>({
|
||||
id: "",
|
||||
idComplaint: "",
|
||||
complaint: "",
|
||||
complaintdetail: "",
|
||||
detail: "",
|
||||
investigationDescription: "",
|
||||
fault: "",
|
||||
other: "",
|
||||
investigationDetailOther: "",
|
||||
evidenceFiles: null,
|
||||
fileComplaint: null,
|
||||
clickTime: false,
|
||||
date: null,
|
||||
dateEnd: new Date(),
|
||||
investigation: "",
|
||||
investigationDateStart: null,
|
||||
investigationDateEnd: null,
|
||||
investigationDetail: "",
|
||||
daysExtend: null,
|
||||
statusResult: "",
|
||||
causeText: "",
|
||||
investigationStatusResult: "",
|
||||
investigationCauseText: "",
|
||||
complaintStatus: "",
|
||||
reason: "",
|
||||
result: "",
|
||||
directors: [],
|
||||
disciplineInvestigateDocs: [],
|
||||
disciplineInvestigateRelevantDocs: [],
|
||||
status: "",
|
||||
documentFile: null,
|
||||
respondentType: "",
|
||||
organizationId: "",
|
||||
persons: [],
|
||||
});
|
||||
const evidenceFiles = ref<any>([{ name: "ชื่อไฟล์" }, { name: "ชื่อไฟล์" }]);
|
||||
|
||||
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
|
||||
const objectInvestigate: MyObjectInvestigateRef = {
|
||||
complaint: complaintRef,
|
||||
complaintdetail: complaintdetailRef,
|
||||
detail: detailRef,
|
||||
investigationDescription: investigationDescriptionRef,
|
||||
fault: faultRef,
|
||||
other: otherRef,
|
||||
evidenceFiles: evidenceFilesRef,
|
||||
investigationDetailOther: investigationDetailOtherRef,
|
||||
fileComplaint: fileComplaintRef,
|
||||
date: dateRef,
|
||||
dateEnd: dateEndRef,
|
||||
investigation: investigationRef,
|
||||
investigationDetail: investigationDetailRef,
|
||||
daysExtend: daysExtendRef,
|
||||
statusResult: statusResultRef,
|
||||
causeText: causeTextRef,
|
||||
reason: reasonRef,
|
||||
investigationStatusResult: investigationStatusResultRef,
|
||||
investigationCauseText: investigationCauseTextRef,
|
||||
result: resultRef,
|
||||
};
|
||||
|
||||
const rows = ref([]);
|
||||
|
|
@ -103,6 +132,93 @@ const initialPagination = ref<any>({
|
|||
rowsPerPage: 0,
|
||||
});
|
||||
|
||||
/** หัวตาราง */
|
||||
const columnsPerson = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "no",
|
||||
align: "left",
|
||||
label: "ลำดับ",
|
||||
sortable: false,
|
||||
field: "no",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "idcard",
|
||||
align: "left",
|
||||
label: "เลขบัตรประชาชน",
|
||||
sortable: true,
|
||||
field: "idcard",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "name",
|
||||
align: "left",
|
||||
label: "ชื่อ - นามสกุล",
|
||||
sortable: true,
|
||||
field: "name",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "posNo",
|
||||
align: "left",
|
||||
label: "ตำแหน่งเลขที่",
|
||||
sortable: true,
|
||||
field: "posNo",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "position",
|
||||
align: "left",
|
||||
label: "ตำแหน่ง",
|
||||
sortable: true,
|
||||
field: "position",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "positionLevel",
|
||||
align: "left",
|
||||
label: "ระดับ",
|
||||
sortable: true,
|
||||
field: "positionLevel",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "salary",
|
||||
align: "left",
|
||||
label: "เงินเดือน",
|
||||
sortable: true,
|
||||
field: "salary",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "organization",
|
||||
align: "left",
|
||||
label: "หน่วยงาน",
|
||||
sortable: true,
|
||||
field: "organization",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
|
||||
/** หัวข้อที่เเสดงในตาราง */
|
||||
const visibleColumnsPerson = ref<string[]>([
|
||||
"no",
|
||||
"idcard",
|
||||
"name",
|
||||
"posNo",
|
||||
"position",
|
||||
"positionLevel",
|
||||
"salary",
|
||||
"organization",
|
||||
]);
|
||||
/*** ฟังก์ชั่นสำหรับ validate ฟอร์ม */
|
||||
function validateForm() {
|
||||
const hasError = [];
|
||||
|
|
@ -133,7 +249,11 @@ function onSubmit() {
|
|||
dialogConfirm(
|
||||
$q,
|
||||
async () => {
|
||||
props.onSubmit(formData);
|
||||
if (investigateFactStore.rowsAdd) {
|
||||
formData.persons = investigateFactStore.rowsAdd;
|
||||
props.onSubmit(formData);
|
||||
} else props.onSubmit(formData);
|
||||
// props.onSubmit(formData);
|
||||
},
|
||||
"ยืนยันการบันทึกข้อมูล",
|
||||
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
|
||||
|
|
@ -147,27 +267,9 @@ function onSubmit() {
|
|||
function calEndDate(val: string) {
|
||||
const date = new Date(props.data.dateEnd);
|
||||
const dateNew = new Date();
|
||||
formData.dateEnd = new Date(dateNew.setDate(date.getDate() + Number(val)));
|
||||
}
|
||||
|
||||
async function fetchDataDetail() {
|
||||
if (props.data !== null) {
|
||||
// isUpdate.value = true;
|
||||
formData.complaint = props.data.complaint;
|
||||
formData.complaintdetail = props.data.complaintdetail;
|
||||
formData.detail = props.data.detail;
|
||||
formData.fault = props.data.fault;
|
||||
formData.other = props.data.other;
|
||||
formData.evidenceFiles = props.data.evidenceFiles;
|
||||
formData.fileComplaint = props.data.fileComplaint;
|
||||
formData.clickTime = props.data.clickTime;
|
||||
formData.date = props.data.date;
|
||||
formData.dateEnd = props.data.dateEnd;
|
||||
formData.investigation = props.data.investigation;
|
||||
formData.daysExtend = props.data.daysExtend;
|
||||
formData.statusResult = props.data.statusResult;
|
||||
formData.causeText = props.data.results;
|
||||
}
|
||||
formData.investigationDateEnd = new Date(
|
||||
dateNew.setDate(date.getDate() + Number(val))
|
||||
);
|
||||
}
|
||||
|
||||
const modal = ref<boolean>(false);
|
||||
|
|
@ -183,11 +285,6 @@ function clickClose() {
|
|||
modal.value = false;
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
await fetchDataDetail();
|
||||
console.log(route.name);
|
||||
});
|
||||
|
||||
/**
|
||||
* เช็คข้อมูลจาก props
|
||||
* เมื่อมีข้อมูล
|
||||
|
|
@ -196,22 +293,202 @@ onMounted(async () => {
|
|||
watch(props.data, async () => {
|
||||
if (props.data !== null) {
|
||||
isUpdate.value = true;
|
||||
formData.id = props.data.id;
|
||||
formData.complaint = props.data.complaint;
|
||||
formData.respondentType = props.data.respondentType;
|
||||
formData.complaintdetail = props.data.complaintdetail;
|
||||
formData.detail = props.data.detail;
|
||||
formData.investigationDescription = props.data.investigationDescription;
|
||||
formData.fault = props.data.fault;
|
||||
formData.other = props.data.other;
|
||||
formData.evidenceFiles = props.data.evidenceFiles;
|
||||
formData.investigationDetailOther = props.data.investigationDetailOther;
|
||||
formData.fileComplaint = props.data.fileComplaint;
|
||||
formData.clickTime = props.data.clickTime;
|
||||
formData.date = props.data.date;
|
||||
formData.dateEnd = props.data.dateEnd;
|
||||
formData.investigation = props.data.investigation;
|
||||
formData.investigationDateStart = props.data.investigationDateStart;
|
||||
formData.investigationDateEnd = props.data.investigationDateEnd;
|
||||
formData.investigationDetail = props.data.investigationDetail;
|
||||
formData.daysExtend = props.data.daysExtend;
|
||||
formData.statusResult = props.data.results;
|
||||
formData.causeText = props.data.results;
|
||||
formData.investigationStatusResult = props.data.investigationStatusResult;
|
||||
formData.investigationCauseText = props.data.investigationCauseText;
|
||||
formData.result = props.data.result;
|
||||
|
||||
investigateFactStore.rowsAdd = props.data.persons
|
||||
rows.value = props.data.directors
|
||||
}
|
||||
});
|
||||
|
||||
function uploadFileRelevant() {
|
||||
const Data = new FormData();
|
||||
Data.append("file", formData.evidenceFiles);
|
||||
showLoader();
|
||||
http
|
||||
.put(config.API.investigateRelevantUploadFile(formData.id), Data)
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
props.getData();
|
||||
// router.push(`/discipline/complaints`);
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function uploadFile() {
|
||||
const Data = new FormData();
|
||||
Data.append("file", formData.documentFile);
|
||||
showLoader();
|
||||
http
|
||||
.put(config.API.investigateUploadFile(formData.id), Data)
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
props.getData();
|
||||
// router.push(`/discipline/complaints`);
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* เปิดลิงค์ไฟล์
|
||||
* @param link รับมาเป็น https ลิงค์
|
||||
*/
|
||||
function downloadFile(link: string) {
|
||||
window.open(link, "_blank");
|
||||
}
|
||||
|
||||
/**
|
||||
* เปิดลิงค์ไฟล์
|
||||
* @param link รับมาเป็น https ลิงค์
|
||||
*/
|
||||
function downloadFileRelevant(link: string) {
|
||||
window.open(link, "_blank");
|
||||
}
|
||||
|
||||
/**
|
||||
* ลบไฟล์
|
||||
* @param id id file
|
||||
*/
|
||||
function deleteFileRelevant(id: string) {
|
||||
dialogRemove($q, () => confirmDeleteRelevant(id));
|
||||
}
|
||||
|
||||
/**
|
||||
* ยืนยัน ลบ ไฟล์
|
||||
* @param id id file
|
||||
*/
|
||||
function confirmDeleteRelevant(id: string) {
|
||||
showLoader();
|
||||
http
|
||||
.delete(config.API.investigateRelevantFileDelete(formData.id, id))
|
||||
.then((res) => {
|
||||
success($q, `ลบไฟล์สำเร็จ`);
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
props.getData();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* ลบไฟล์
|
||||
* @param id id file
|
||||
*/
|
||||
function deleteFile(id: string) {
|
||||
dialogRemove($q, () => confirmDelete(id));
|
||||
}
|
||||
|
||||
/**
|
||||
* ยืนยัน ลบ ไฟล์
|
||||
* @param id id file
|
||||
*/
|
||||
function confirmDelete(id: string) {
|
||||
showLoader();
|
||||
http
|
||||
.delete(config.API.investigateFileDelete(formData.id, id))
|
||||
.then((res) => {
|
||||
success($q, `ลบไฟล์สำเร็จ`);
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
props.getData();
|
||||
});
|
||||
}
|
||||
async function addPerson(data: any) {
|
||||
await investigateFactStore.fetchInvestigateAdd(data);
|
||||
toggleModal();
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังชั่น รับค่าจาก คอมโพเเนน
|
||||
* @param returnData ค่าที่ได้คืนมา
|
||||
*/
|
||||
function handleSave(returnData: any) {
|
||||
addPerson(returnData);
|
||||
toggleModal();
|
||||
}
|
||||
|
||||
function getOc() {
|
||||
http.get(config.API.typeOc()).then((res) => {
|
||||
const data = res.data.result;
|
||||
investigateFactStore.ocListFn(data);
|
||||
});
|
||||
}
|
||||
|
||||
async function updatePagingProp(rowPerpage: number, pageCurrent: number) {
|
||||
rowsPerPage.value = rowPerpage;
|
||||
page.value = pageCurrent;
|
||||
await getList();
|
||||
}
|
||||
|
||||
async function getList() {
|
||||
showLoader();
|
||||
await http
|
||||
.get(
|
||||
config.API.directorList(
|
||||
page.value,
|
||||
rowsPerPage.value,
|
||||
filterKeyword.value
|
||||
)
|
||||
)
|
||||
//
|
||||
.then((res) => {
|
||||
maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
|
||||
const data = res.data.result.data;
|
||||
investigateDis.fecthDirector(data);
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function returnDirector(data: any) {
|
||||
clickClose();
|
||||
const dataList = data.map((item: any) => item.id);
|
||||
console.log(dataList);
|
||||
formData.directors = dataList;
|
||||
rows.value = data;
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
console.log(route.name);
|
||||
getOc();
|
||||
investigateFactStore.columnsPerson = columnsPerson.value;
|
||||
investigateFactStore.visibleColumnsPerson = visibleColumnsPerson.value;
|
||||
});
|
||||
</script>
|
||||
<template>
|
||||
<q-card flat class="q-mt-sm">
|
||||
|
|
@ -275,54 +552,170 @@ watch(props.data, async () => {
|
|||
</template>
|
||||
</q-select>
|
||||
</div> -->
|
||||
|
||||
<div class="col-3">
|
||||
<q-select
|
||||
:readonly="statusStep"
|
||||
:disable="statusStep"
|
||||
for="#investigation"
|
||||
outlined
|
||||
hide-bottom-space
|
||||
dense
|
||||
ref="investigationRef"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกลักษณะการสืบสวน'}`]"
|
||||
v-model="formData.investigation"
|
||||
:options="investigateFactStore.investigationOp"
|
||||
label="ลักษณะการสืบสวน"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
use-input
|
||||
@filter="(inputValue: any,
|
||||
<q-select
|
||||
for="SelectrespondentType"
|
||||
v-model="formData.respondentType"
|
||||
ref="respondentTypeRef"
|
||||
dense
|
||||
outlined
|
||||
:readonly="formData.status !== 'NEW' && formData.status !== ''"
|
||||
label="ผู้ถูกร้องเรียน"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
emit-value
|
||||
use-input
|
||||
map-options
|
||||
hide-bottom-space
|
||||
:options="investigateFactStore.respondentTypeOps"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกผู้ร้องเรียน'}`]"
|
||||
lazy-rules
|
||||
@filter="(inputValue: any,
|
||||
doneFn: Function) => investigateFactStore.filterSelector(inputValue, doneFn, 'filterrespondentType'
|
||||
)"
|
||||
>
|
||||
<template v-slot:no-option>
|
||||
<q-item>
|
||||
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-select>
|
||||
<q-select
|
||||
:readonly="statusStep"
|
||||
:disable="statusStep"
|
||||
for="#investigationDetail"
|
||||
outlined
|
||||
hide-bottom-space
|
||||
dense
|
||||
ref="investigationDetailRef"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกลักษณะการสืบสวน'}`]"
|
||||
v-model="formData.investigationDetail"
|
||||
:options="investigateFactStore.investigationDetailOp"
|
||||
label="ลักษณะการสืบสวน"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
use-input
|
||||
@filter="(inputValue: any,
|
||||
doneFn: Function) => filterFnOptionsType(inputValue, doneFn, 'investigationOp'
|
||||
)"
|
||||
><template v-slot:no-option>
|
||||
<q-item>
|
||||
<q-item-section class="text-grey">
|
||||
ไม่มีข้อมูล
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-select>
|
||||
><template v-slot:no-option>
|
||||
<q-item>
|
||||
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-select>
|
||||
<div
|
||||
class="col-xs-12 col-sm-3"
|
||||
v-if="formData.respondentType === 'ORGANIZATION'"
|
||||
id="organizationId"
|
||||
>
|
||||
<q-select
|
||||
for="inputOffice"
|
||||
name="organizationId"
|
||||
ref="organizationIdRef"
|
||||
dense
|
||||
hide-bottom-space
|
||||
:readonly="formData.status !== 'NEW' && formData.status !== ''"
|
||||
outlined
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
emit-value
|
||||
map-options
|
||||
v-model="formData.organizationId"
|
||||
:options="investigateFactStore.organizationIdOp"
|
||||
label="เลือกสำนักงาน"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกสำนักงาน'}`]"
|
||||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
<div class="row col-12" v-if="formData.respondentType === 'PERSON'">
|
||||
<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="formData.status === 'NEW' || formData.status === ''"
|
||||
size="12px"
|
||||
flat
|
||||
round
|
||||
dense
|
||||
color="add"
|
||||
class="q-ml-sm"
|
||||
@click="toggleModal"
|
||||
icon="mdi-plus"
|
||||
>
|
||||
<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="investigateFactStore.columnsPerson"
|
||||
:rows="investigateFactStore.rowsAdd"
|
||||
row-key="idcard"
|
||||
flat
|
||||
bordered
|
||||
:paging="true"
|
||||
dense
|
||||
class="custom-header-table"
|
||||
:visible-columns="investigateFactStore.visibleColumnsPerson"
|
||||
>
|
||||
<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>
|
||||
{{ col.value }}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</d-table>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="formData.investigation === '003'" class="col-12">
|
||||
<div v-if="formData.investigationDetail === 'OTHER'" class="col-12">
|
||||
<q-input
|
||||
for="#other"
|
||||
for="#investigationDetailOther"
|
||||
class="full-width cursor-pointer"
|
||||
outlined
|
||||
ref="otherRef"
|
||||
ref="investigationDetailOtherRef"
|
||||
dense
|
||||
borderless
|
||||
v-model="formData.other"
|
||||
v-model="formData.investigationDetailOther"
|
||||
hide-bottom-space
|
||||
:label="`${'รายการอื่นๆ(โปรดระบุ)'}`"
|
||||
type="textarea"
|
||||
:rules="[
|
||||
(val) =>
|
||||
formData.investigation === '003'
|
||||
formData.investigationDetail === 'OTHER'
|
||||
? !!val || 'กรุณาเลือกจำนวนวันที่ต้องการขยาย'
|
||||
: true,
|
||||
]"
|
||||
|
|
@ -336,7 +729,10 @@ watch(props.data, async () => {
|
|||
>
|
||||
วันที่สืบสวน
|
||||
<q-checkbox
|
||||
v-if="formData.clickTime != null && statusStep === false"
|
||||
v-if="
|
||||
props.data.investigationDateStart === null &&
|
||||
props.data.investigationDateEnd === null
|
||||
"
|
||||
for="#clickTime"
|
||||
size="md"
|
||||
v-model="formData.clickTime"
|
||||
|
|
@ -354,7 +750,7 @@ watch(props.data, async () => {
|
|||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
:readonly="isUpdate && statusStep"
|
||||
v-model="formData.date"
|
||||
v-model="formData.investigationDateStart"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
:enableTimePicker="false"
|
||||
|
|
@ -376,7 +772,9 @@ watch(props.data, async () => {
|
|||
borderless
|
||||
hide-bottom-space
|
||||
:model-value="
|
||||
formData.date ? date2Thai(formData.date) : null
|
||||
formData.investigationDateStart
|
||||
? date2Thai(formData.investigationDateStart)
|
||||
: null
|
||||
"
|
||||
:rules="[
|
||||
(val) =>
|
||||
|
|
@ -433,7 +831,7 @@ watch(props.data, async () => {
|
|||
<div class="col-3">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="formData.dateEnd"
|
||||
v-model="formData.investigationDateEnd"
|
||||
:readonly="statusStep && isUpdate"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
|
|
@ -456,7 +854,9 @@ watch(props.data, async () => {
|
|||
hide-bottom-space
|
||||
borderless
|
||||
:model-value="
|
||||
formData.dateEnd ? date2Thai(formData.dateEnd) : null
|
||||
formData.investigationDateEnd
|
||||
? date2Thai(formData.investigationDateEnd)
|
||||
: null
|
||||
"
|
||||
:rules="[
|
||||
(val) =>
|
||||
|
|
@ -588,14 +988,14 @@ watch(props.data, async () => {
|
|||
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
for="#detail"
|
||||
for="#investigationDescription"
|
||||
class="full-width cursor-pointer"
|
||||
outlined
|
||||
ref="detailRef"
|
||||
ref="investigationDescriptionRef"
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formData.detail"
|
||||
v-model="formData.investigationDescription"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกรายละเอียด'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'รายละเอียด'}`"
|
||||
|
|
@ -622,10 +1022,12 @@ watch(props.data, async () => {
|
|||
dense
|
||||
:readonly="statusStep"
|
||||
lazy-rules
|
||||
ref="statusResultRef"
|
||||
v-model="formData.statusResult"
|
||||
ref="investigationStatusResultRef"
|
||||
v-model="formData.investigationStatusResult"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกผลการสืบสวน'}`]"
|
||||
:options="investigateFactStore.statusResultOptions"
|
||||
:options="
|
||||
investigateFactStore.investigationStatusResultOptions
|
||||
"
|
||||
label="ผลการสืบสวน"
|
||||
emit-value
|
||||
map-options
|
||||
|
|
@ -645,17 +1047,22 @@ watch(props.data, async () => {
|
|||
</q-select>
|
||||
</div>
|
||||
|
||||
<div v-if="formData.statusResult == 'have_cause'" class="col-3">
|
||||
<div
|
||||
v-if="formData.investigationStatusResult == 'HAVE_CAUSE'"
|
||||
class="col-3"
|
||||
>
|
||||
<q-select
|
||||
for="#fault"
|
||||
outlined
|
||||
dense
|
||||
ref="causeTextRef"
|
||||
v-model="formData.causeText"
|
||||
ref="investigationCauseTextRef"
|
||||
v-model="formData.investigationCauseText"
|
||||
:rules="[
|
||||
(val) => !!val || `${'กรุณาเลือกร้ายแรง/ไม่ร้ายแรง'}`,
|
||||
]"
|
||||
:options="investigateFactStore.causeTextOptions"
|
||||
:options="
|
||||
investigateFactStore.investigationCauseTextOptions
|
||||
"
|
||||
label="ร้ายแรง/ไม่ร้ายแรง"
|
||||
emit-value
|
||||
map-options
|
||||
|
|
@ -677,11 +1084,11 @@ watch(props.data, async () => {
|
|||
<q-input
|
||||
class="full-width cursor-pointer"
|
||||
outlined
|
||||
ref="reasonRef"
|
||||
ref="resultRef"
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formData.reason"
|
||||
v-model="formData.result"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกเหตุผล'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'เหตุผล'}`"
|
||||
|
|
@ -696,11 +1103,13 @@ watch(props.data, async () => {
|
|||
for="#evidenceFiles"
|
||||
outlined
|
||||
dense
|
||||
ref="evidenceFilesRef"
|
||||
v-model="formData.evidenceFiles"
|
||||
label="เอกสารที่เกี่ยวข้องกับการสืบสวน"
|
||||
lazy-rules
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกไฟล์เอกสารที่เกี่ยวข้องกับการสืบสวน']"
|
||||
:rules="[
|
||||
(val) =>
|
||||
!!val || 'กรุณาเลือกไฟล์เอกสารที่เกี่ยวข้องกับการสืบสวน',
|
||||
]"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
|
|
@ -716,6 +1125,7 @@ watch(props.data, async () => {
|
|||
color="add"
|
||||
class="q-ml-sm"
|
||||
icon="mdi-upload"
|
||||
@click="uploadFileRelevant"
|
||||
><q-tooltip>อัปโหลดเอกสาร</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
|
|
@ -724,10 +1134,11 @@ watch(props.data, async () => {
|
|||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
v-for="(file, index) in evidenceFiles"
|
||||
v-for="(file, index) in props.data
|
||||
.disciplineInvestigateRelevantDocs"
|
||||
:key="index"
|
||||
>
|
||||
<q-item-section>{{ file.name + (index + 1) }}</q-item-section>
|
||||
<q-item-section>{{ file.fileName }}</q-item-section>
|
||||
<q-item-section avatar>
|
||||
<div class="row">
|
||||
<div>
|
||||
|
|
@ -738,6 +1149,7 @@ watch(props.data, async () => {
|
|||
size="12px"
|
||||
color="blue"
|
||||
icon="mdi-download-outline"
|
||||
@click="downloadFileRelevant(file.pathName)"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลด</q-tooltip>
|
||||
</q-btn>
|
||||
|
|
@ -750,6 +1162,7 @@ watch(props.data, async () => {
|
|||
size="12px"
|
||||
color="red"
|
||||
icon="mdi-delete-outline"
|
||||
@click="deleteFileRelevant(file.id)"
|
||||
><q-tooltip>ลบเอกสารหลักฐาน</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
|
|
@ -783,11 +1196,10 @@ watch(props.data, async () => {
|
|||
<div class="col-xs-12 q-pa-sm row">
|
||||
<q-file
|
||||
class="col-11 q-mt-sm"
|
||||
for="#evidenceFiles"
|
||||
for="#documentFile"
|
||||
outlined
|
||||
dense
|
||||
ref="evidenceFilesRef"
|
||||
v-model="formData.evidenceFiles"
|
||||
v-model="formData.documentFile"
|
||||
label="ไฟล์เอกสารหลักฐาน"
|
||||
lazy-rules
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกไฟล์เอกสารหลักฐาน']"
|
||||
|
|
@ -806,6 +1218,7 @@ watch(props.data, async () => {
|
|||
color="add"
|
||||
class="q-ml-sm q-mt-sm"
|
||||
icon="mdi-upload"
|
||||
@click="uploadFile"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
|
|
@ -815,10 +1228,10 @@ watch(props.data, async () => {
|
|||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
v-for="(file, index) in evidenceFiles"
|
||||
:key="index"
|
||||
v-for="file in props.data.disciplineInvestigateDocs"
|
||||
:key="file.id"
|
||||
>
|
||||
<q-item-section>{{ file.name + (index + 1) }}</q-item-section>
|
||||
<q-item-section>{{ file.fileName }}</q-item-section>
|
||||
<q-item-section avatar>
|
||||
<div class="row">
|
||||
<div>
|
||||
|
|
@ -829,6 +1242,7 @@ watch(props.data, async () => {
|
|||
size="12px"
|
||||
color="blue"
|
||||
icon="mdi-download-outline"
|
||||
@click="downloadFile(file.pathName)"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลดเอกสารหลักฐาน</q-tooltip>
|
||||
</q-btn>
|
||||
|
|
@ -841,6 +1255,7 @@ watch(props.data, async () => {
|
|||
size="12px"
|
||||
color="red"
|
||||
icon="mdi-delete-outline"
|
||||
@click="deleteFile(file.id)"
|
||||
><q-tooltip>ลบเอกสารหลักฐาน</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
|
|
@ -854,11 +1269,28 @@ watch(props.data, async () => {
|
|||
</div>
|
||||
</q-card>
|
||||
|
||||
<DialogAddPersonal
|
||||
title="ผู้ถูกร้องเรียน"
|
||||
:checkId="investigateFactStore.rowsAdd"
|
||||
:modal="modalPerson"
|
||||
btn-title="เพิ่มรายชื่อผู้ถูกสอบสวน"
|
||||
:close="toggleModal"
|
||||
:save="addPerson"
|
||||
@returnData="handleSave"
|
||||
/>
|
||||
|
||||
<Dialogbody
|
||||
:get-list="getList"
|
||||
v-model:Modal="modal"
|
||||
:clickClose="clickClose"
|
||||
:rows2="investigateDis.rows2"
|
||||
v-model:filterKeyword2="filterKeyword2"
|
||||
v-model:type="type"
|
||||
:filterTable="filterTable"
|
||||
:rowsPerPage="rowsPerPage"
|
||||
:page="page"
|
||||
:maxPage="maxPage"
|
||||
@update:pagination="updatePagingProp"
|
||||
@returnDirector="returnDirector"
|
||||
/>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,26 +1,26 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, useAttrs, onMounted } from "vue";
|
||||
import { ref, useAttrs, onMounted,watch } from "vue";
|
||||
|
||||
import router from "@/router";
|
||||
import { useQuasar } from "quasar";
|
||||
// import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
// import config from "@/app.config";
|
||||
// import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import http from "@/plugins/http";
|
||||
|
||||
import { useInvestigateFactStore } from "@/modules/11_discipline/store/InvestigateFactStore";
|
||||
const dataInvestigate = useInvestigateFactStore();
|
||||
const { fecthList } = dataInvestigate;
|
||||
// const mixin = useCounterMixin();
|
||||
// const {
|
||||
// date2Thai,
|
||||
// success,
|
||||
// messageError,
|
||||
// showLoader,
|
||||
// hideLoader,
|
||||
// dialogConfirm,
|
||||
// dialogRemove,
|
||||
// } = mixin;
|
||||
const mixin = useCounterMixin();
|
||||
const {
|
||||
date2Thai,
|
||||
success,
|
||||
messageError,
|
||||
showLoader,
|
||||
hideLoader,
|
||||
dialogConfirm,
|
||||
dialogRemove,
|
||||
} = mixin;
|
||||
const $q = useQuasar(); //ใช้ noti quasar
|
||||
|
||||
/** ค้นหาข้อมูลในตาราง */
|
||||
|
|
@ -33,15 +33,55 @@ const resetFilter = () => {
|
|||
}
|
||||
};
|
||||
|
||||
const currentPage = ref<number>(1);
|
||||
const maxPage = ref<number>(1);
|
||||
const page = ref<number>(1);
|
||||
const rowsPerPage = ref<number>(10);
|
||||
|
||||
/**
|
||||
*pagination ของตาราง
|
||||
*/
|
||||
const pagination = ref({
|
||||
descending: false,
|
||||
page: page.value,
|
||||
rowsPerPage: rowsPerPage.value,
|
||||
});
|
||||
|
||||
watch(() => currentPage.value,() => {
|
||||
rowsPerPage.value = pagination.value.rowsPerPage;
|
||||
getList();
|
||||
});
|
||||
|
||||
watch(()=>pagination.value.rowsPerPage,()=>{
|
||||
rowsPerPage.value = pagination.value.rowsPerPage;
|
||||
currentPage.value = 1
|
||||
getList();
|
||||
})
|
||||
async function getList() {
|
||||
showLoader();
|
||||
await http
|
||||
.get(
|
||||
config.API.investigateMain(
|
||||
currentPage.value,
|
||||
rowsPerPage.value,
|
||||
filterKeyword.value
|
||||
)
|
||||
)
|
||||
.then((res) => {
|
||||
maxPage.value = Math.ceil(res.data.result.total / rowsPerPage.value);
|
||||
const data = res.data.result.data
|
||||
dataInvestigate.fecthList(data);
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
const attrs = ref<any>(useAttrs());
|
||||
|
||||
/** แสดงจำนวนในตาราง */
|
||||
const pagination = ref({
|
||||
// sortBy: "desc",
|
||||
descending: false,
|
||||
page: 1,
|
||||
rowsPerPage: 10,
|
||||
});
|
||||
|
||||
/**ไปยังหน้าเพิ่มข้อมูล */
|
||||
const clickAdd = () => {
|
||||
|
|
@ -60,19 +100,7 @@ function editPage(id: string) {
|
|||
* ส่งข้อมูลจำลองไปยัง store
|
||||
*/
|
||||
onMounted(async () => {
|
||||
await fecthList([
|
||||
{
|
||||
id: "001",
|
||||
subject: "ทุจริตในหน้าที่",
|
||||
interrogated: "บุคคล",
|
||||
complaintOffenseDetails: "NOT_SPECIFIED",
|
||||
investigationDetail: "appoint_directors",
|
||||
startDate: new Date ("2023-11-20"),
|
||||
endDate: new Date ("2023-11-25"),
|
||||
statusResult: "not_specified",
|
||||
status: "new"
|
||||
},
|
||||
]);
|
||||
getList()
|
||||
});
|
||||
</script>
|
||||
<template>
|
||||
|
|
@ -152,6 +180,17 @@ onMounted(async () => {
|
|||
:visible-columns="dataInvestigate.visibleColumns"
|
||||
v-model:pagination="pagination"
|
||||
>
|
||||
<template v-slot:pagination="scope">
|
||||
<q-pagination
|
||||
v-model="currentPage"
|
||||
active-color="primary"
|
||||
color="dark"
|
||||
:max="Number(maxPage)"
|
||||
size="sm"
|
||||
boundary-links
|
||||
direction-links
|
||||
></q-pagination>
|
||||
</template>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue