ปรับ interfeac
This commit is contained in:
parent
09b1b9f492
commit
cfc073e30c
16 changed files with 462 additions and 277 deletions
|
|
@ -16,7 +16,7 @@ export const useLeavelistDataStore = defineStore("leave", () => {
|
||||||
const mainData = ref<any>([])
|
const mainData = ref<any>([])
|
||||||
const rows = ref<any>([])
|
const rows = ref<any>([])
|
||||||
const loadTable = ref<boolean>(false)
|
const loadTable = ref<boolean>(false)
|
||||||
async function fecthList(data: any) {
|
async function fetchList(data: any) {
|
||||||
let datalist = data.map((e: any) => ({
|
let datalist = data.map((e: any) => ({
|
||||||
leaveType: e.leaveType,
|
leaveType: e.leaveType,
|
||||||
name: e.name,
|
name: e.name,
|
||||||
|
|
@ -161,7 +161,7 @@ export const useLeavelistDataStore = defineStore("leave", () => {
|
||||||
amounttab2,
|
amounttab2,
|
||||||
//ข้อมูลในตาราง
|
//ข้อมูลในตาราง
|
||||||
rows,
|
rows,
|
||||||
fecthList,
|
fetchList,
|
||||||
loadTable,
|
loadTable,
|
||||||
//filter table
|
//filter table
|
||||||
filterTable,
|
filterTable,
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@ export const useWorklistDataStore = defineStore("work", () => {
|
||||||
// ข้อมูลในตาราง
|
// ข้อมูลในตาราง
|
||||||
const rows = ref<any>([])
|
const rows = ref<any>([])
|
||||||
const dataMain = ref<any>([])
|
const dataMain = ref<any>([])
|
||||||
function fecthList(data: any) {
|
function fetchList(data: any) {
|
||||||
let datalist = data.map((e: any) => ({
|
let datalist = data.map((e: any) => ({
|
||||||
fullName: e.fullName,
|
fullName: e.fullName,
|
||||||
timeIn: e.timeIn,
|
timeIn: e.timeIn,
|
||||||
|
|
@ -86,7 +86,7 @@ export const useWorklistDataStore = defineStore("work", () => {
|
||||||
return {
|
return {
|
||||||
//ข้อมูลในตาราง
|
//ข้อมูลในตาราง
|
||||||
rows,
|
rows,
|
||||||
fecthList,
|
fetchList,
|
||||||
//ค้นหาข้อมูล
|
//ค้นหาข้อมูล
|
||||||
filterTable,
|
filterTable,
|
||||||
selectDate,
|
selectDate,
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@ import { useLeavelistDataStore } from "../stores/LeaveStore";
|
||||||
import TableList from "../components/2_Leave/TableList.vue";
|
import TableList from "../components/2_Leave/TableList.vue";
|
||||||
|
|
||||||
const leaveStore = useLeavelistDataStore();
|
const leaveStore = useLeavelistDataStore();
|
||||||
const { fecthList, clearFilter } = leaveStore;
|
const { fetchList, clearFilter } = leaveStore;
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
fecthLeaveList();
|
fecthLeaveList();
|
||||||
|
|
@ -39,7 +39,7 @@ function fecthLeaveList() {
|
||||||
status: "2",
|
status: "2",
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
fecthList(data); // ส่งข้อมูลไป stores
|
fetchList(data); // ส่งข้อมูลไป stores
|
||||||
}
|
}
|
||||||
//เปลี่ยน Tab
|
//เปลี่ยน Tab
|
||||||
function changTab() {
|
function changTab() {
|
||||||
|
|
@ -51,7 +51,7 @@ function changTab() {
|
||||||
<div class="toptitle text-dark col-12 row items-center">รายการลา</div>
|
<div class="toptitle text-dark col-12 row items-center">รายการลา</div>
|
||||||
<div>
|
<div>
|
||||||
<!-- <q-card flat bordered class="col-12 q-mt-sm"> -->
|
<!-- <q-card flat bordered class="col-12 q-mt-sm"> -->
|
||||||
<q-card bordered flat >
|
<q-card bordered flat>
|
||||||
<q-tabs
|
<q-tabs
|
||||||
v-model="leaveStore.tab"
|
v-model="leaveStore.tab"
|
||||||
dense
|
dense
|
||||||
|
|
@ -66,7 +66,6 @@ function changTab() {
|
||||||
@click="changTab"
|
@click="changTab"
|
||||||
name="1"
|
name="1"
|
||||||
label="รายการลาที่อยู่ระหว่างดำเนิดการ"
|
label="รายการลาที่อยู่ระหว่างดำเนิดการ"
|
||||||
|
|
||||||
>
|
>
|
||||||
<q-badge
|
<q-badge
|
||||||
color="grey-4"
|
color="grey-4"
|
||||||
|
|
@ -79,12 +78,7 @@ function changTab() {
|
||||||
rounded
|
rounded
|
||||||
/>
|
/>
|
||||||
</q-tab>
|
</q-tab>
|
||||||
<q-tab
|
<q-tab @click="changTab" name="2" label="รายการลาทั้งหมด">
|
||||||
@click="changTab"
|
|
||||||
name="2"
|
|
||||||
label="รายการลาทั้งหมด"
|
|
||||||
|
|
||||||
>
|
|
||||||
<q-badge
|
<q-badge
|
||||||
color="grey-4"
|
color="grey-4"
|
||||||
:class="
|
:class="
|
||||||
|
|
@ -110,7 +104,7 @@ function changTab() {
|
||||||
<TableList />
|
<TableList />
|
||||||
</q-tab-panel>
|
</q-tab-panel>
|
||||||
</q-tab-panels>
|
</q-tab-panels>
|
||||||
<!-- </q-card> -->
|
<!-- </q-card> -->
|
||||||
</q-card>
|
</q-card>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -9,7 +9,7 @@ import TableList from "../components/1_Work/TableList.vue";
|
||||||
const mixin = useCounterMixin();
|
const mixin = useCounterMixin();
|
||||||
const workStore = useWorklistDataStore();
|
const workStore = useWorklistDataStore();
|
||||||
const { date2Thai } = mixin;
|
const { date2Thai } = mixin;
|
||||||
const { fecthList } = workStore;
|
const { fetchList } = workStore;
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
fecthWorkList();
|
fecthWorkList();
|
||||||
|
|
@ -66,7 +66,7 @@ function fecthWorkList() {
|
||||||
status: "1",
|
status: "1",
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
fecthList(listData); // ส่งข้อมูลไปยัง stores
|
fetchList(listData); // ส่งข้อมูลไปยัง stores
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
|
|
|
||||||
|
|
@ -1,17 +1,17 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted } from "vue";
|
import { ref, onMounted, reactive, watch } from "vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
import { useRouter } from "vue-router";
|
import { useRouter } from "vue-router";
|
||||||
|
|
||||||
// import Type
|
// import Type
|
||||||
|
import type { DataOption } from "@/modules/11_discipline/interface/index/Main";
|
||||||
import type {
|
import type {
|
||||||
DataOption,
|
FormData,
|
||||||
MyObjectComplaintsRef,
|
MyObjectComplaintsRef,
|
||||||
} from "../../interface/index/Main";
|
} from "@/modules/11_discipline/interface/request/complaint";
|
||||||
|
|
||||||
// importStroe
|
// importStroe
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
import { useComplainstDataStore } from "../../store/ComplaintsStore";
|
import { useComplainstDataStore } from "@/modules/11_discipline/store/ComplaintsStore";
|
||||||
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|
@ -19,7 +19,7 @@ const mixin = useCounterMixin();
|
||||||
const { date2Thai, dialogConfirm } = mixin; //function จาก stores หลัก
|
const { date2Thai, dialogConfirm } = mixin; //function จาก stores หลัก
|
||||||
|
|
||||||
const complainstStore = useComplainstDataStore();
|
const complainstStore = useComplainstDataStore();
|
||||||
const { selectComplainantTpye, filterSelector, fectOptioin } = complainstStore; // function จาก store complainstStore
|
const { selectComplainantTpye, filterSelector, fetchOptioin } = complainstStore; // function จาก store complainstStore
|
||||||
|
|
||||||
// options ทั้งหมด
|
// options ทั้งหมด
|
||||||
const complainantoptions = ref<DataOption[]>([
|
const complainantoptions = ref<DataOption[]>([
|
||||||
|
|
@ -52,38 +52,40 @@ const receivecomplaintstoptions = ref<DataOption[]>([
|
||||||
{ id: "6", name: "บอกกล่าว" },
|
{ id: "6", name: "บอกกล่าว" },
|
||||||
]);
|
]);
|
||||||
// ข้อมูล form
|
// ข้อมูล form
|
||||||
const complainantType = ref<string>("");
|
const formData = reactive<FormData>({
|
||||||
const complainant = ref<string>(""); // รายชื่อจากทะเบียน
|
complainantType: "",
|
||||||
const office = ref<string>(""); // สำนักงาน
|
complainant: "",
|
||||||
const agency = ref<string>("");
|
office: "",
|
||||||
const topicComplaint = ref<string>("");
|
agency: "",
|
||||||
const detail = ref<string>("");
|
topicComplaint: "",
|
||||||
const datereceive = ref<Date>();
|
detail: "",
|
||||||
const dateconsideration = ref<Date>();
|
datereceive: null,
|
||||||
const offenseDescription = ref<string>("");
|
dateconsideration: null,
|
||||||
const considerationLevel = ref<string>("");
|
offenseDescription: "",
|
||||||
const datewarn = ref<Date>();
|
considerationLevel: "",
|
||||||
const receivecomplaints = ref<string>("");
|
datewarn: null,
|
||||||
const petitioner = ref<string>("");
|
receivecomplaints: "",
|
||||||
const files = ref<any>();
|
petitioner: "",
|
||||||
|
files: null,
|
||||||
|
});
|
||||||
const fileDocDataUpload = ref<File[]>([]);
|
const fileDocDataUpload = ref<File[]>([]);
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
fectOptioin(complainantoptions.value, agencytoptions.value);
|
fetchOptioin(complainantoptions.value, agencytoptions.value);
|
||||||
});
|
});
|
||||||
// เลือกผู้ร้องเรียน
|
// เลือกผู้ร้องเรียน
|
||||||
async function selectComplainant(val: string) {
|
async function selectComplainant(val: string) {
|
||||||
complainant.value = "";
|
formData.complainant = "";
|
||||||
office.value = "";
|
formData.office = "";
|
||||||
agency.value = "";
|
formData.agency = "";
|
||||||
if (val === "0") {
|
if (val === "0") {
|
||||||
await fectListname(); // ถ้าเลือกบุกคลจะเรียก function fectListname เรียกรายชื่อจากทะเบียน
|
await fetchListname(); // ถ้าเลือกบุกคลจะเรียก function fetchListname เรียกรายชื่อจากทะเบียน
|
||||||
} else if (val === "1") {
|
} else if (val === "1") {
|
||||||
await fectOffice(); // ถ้าเลือกหน่วยงานจะเรียก function fectOffice เรียกโครงสร้างสำนักงาน
|
await fetchOffice(); // ถ้าเลือกหน่วยงานจะเรียก function fetchOffice เรียกโครงสร้างสำนักงาน
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// เรียกรายชื่อ
|
// เรียกรายชื่อ
|
||||||
async function fectListname() {
|
async function fetchListname() {
|
||||||
const listName = [
|
const listName = [
|
||||||
{
|
{
|
||||||
id: "1",
|
id: "1",
|
||||||
|
|
@ -101,7 +103,7 @@ async function fectListname() {
|
||||||
selectComplainantTpye(listName);
|
selectComplainantTpye(listName);
|
||||||
}
|
}
|
||||||
// เรียกโครงสร้างสำนักงาน
|
// เรียกโครงสร้างสำนักงาน
|
||||||
async function fectOffice() {
|
async function fetchOffice() {
|
||||||
// const listOffice = [
|
// const listOffice = [
|
||||||
// {
|
// {
|
||||||
// id: "1",
|
// id: "1",
|
||||||
|
|
@ -134,29 +136,35 @@ function selectLevel(val: string) {
|
||||||
dayNum = 15; // ด่วนมาก
|
dayNum = 15; // ด่วนมาก
|
||||||
}
|
}
|
||||||
// วันแจ้งเตือนล่วงหน้า
|
// วันแจ้งเตือนล่วงหน้า
|
||||||
if (dateconsideration.value) {
|
if (formData.dateconsideration) {
|
||||||
const currentDate = new Date(dateconsideration.value);
|
const currentDate = new Date(formData.dateconsideration);
|
||||||
const newDate = new Date(
|
const newDate = new Date(
|
||||||
currentDate.getTime() + dayNum * 24 * 60 * 60 * 1000
|
currentDate.getTime() + dayNum * 24 * 60 * 60 * 1000
|
||||||
);
|
);
|
||||||
datewarn.value = newDate;
|
formData.datewarn = newDate;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
watch(formData, () => {
|
||||||
|
if (formData.considerationLevel !== "") {
|
||||||
|
selectLevel(formData.considerationLevel);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
// validateForm
|
// validateForm
|
||||||
const complainantTypeRef = ref<any>(null);
|
const complainantTypeRef = ref<Object | null>(null);
|
||||||
const complainantRef = ref<any>(null);
|
const complainantRef = ref<Object | null>(null);
|
||||||
const officeRef = ref<any>(null);
|
const officeRef = ref<Object | null>(null);
|
||||||
const agencyRef = ref<any>(null);
|
const agencyRef = ref<Object | null>(null);
|
||||||
const topicComplaintRef = ref<any>(null);
|
const topicComplaintRef = ref<Object | null>(null);
|
||||||
const detailRef = ref<any>(null);
|
const detailRef = ref<Object | null>(null);
|
||||||
const datereceiveRef = ref<any>();
|
const datereceiveRef = ref<Object | null>();
|
||||||
const dateconsiderationRef = ref<any>(null);
|
const dateconsiderationRef = ref<Object | null>(null);
|
||||||
const offenseDescriptionRef = ref<any>(null);
|
const offenseDescriptionRef = ref<Object | null>(null);
|
||||||
const considerationLevelRef = ref<any>(null);
|
const considerationLevelRef = ref<Object | null>(null);
|
||||||
const datewarnRef = ref<any>(null);
|
const datewarnRef = ref<Object | null>(null);
|
||||||
const receivecomplaintsRef = ref<any>(null);
|
const receivecomplaintsRef = ref<Object | null>(null);
|
||||||
const petitionerRef = ref<any>(null);
|
const petitionerRef = ref<Object | null>(null);
|
||||||
const filesRef = ref<any>(null);
|
const filesRef = ref<Object | null>(null);
|
||||||
|
|
||||||
const objectComplaintsRef: MyObjectComplaintsRef = {
|
const objectComplaintsRef: MyObjectComplaintsRef = {
|
||||||
complainantType: complainantTypeRef,
|
complainantType: complainantTypeRef,
|
||||||
|
|
@ -195,7 +203,9 @@ function validateForm() {
|
||||||
function onSubmit() {
|
function onSubmit() {
|
||||||
dialogConfirm(
|
dialogConfirm(
|
||||||
$q,
|
$q,
|
||||||
async () => {},
|
async () => {
|
||||||
|
console.log(formData);
|
||||||
|
},
|
||||||
"ยืนยันการบันทึกข้อมูล",
|
"ยืนยันการบันทึกข้อมูล",
|
||||||
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
|
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
|
||||||
);
|
);
|
||||||
|
|
@ -222,12 +232,13 @@ function onSubmit() {
|
||||||
<div
|
<div
|
||||||
class="col-xs-12 col-sm-12 row q-col-gutter-x-md q-col-gutter-y-xs"
|
class="col-xs-12 col-sm-12 row q-col-gutter-x-md q-col-gutter-y-xs"
|
||||||
>
|
>
|
||||||
<div class="col-xs-12 col-sm-2">
|
<div class="col-xs-12 col-sm-2" id="complainantType">
|
||||||
<q-select
|
<q-select
|
||||||
|
for="complainantType"
|
||||||
ref="complainantTypeRef"
|
ref="complainantTypeRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="complainantType"
|
v-model="formData.complainantType"
|
||||||
:options="complainstStore.complainantoptions"
|
:options="complainstStore.complainantoptions"
|
||||||
label="ผู้ร้องเรียน"
|
label="ผู้ร้องเรียน"
|
||||||
option-value="id"
|
option-value="id"
|
||||||
|
|
@ -236,7 +247,9 @@ function onSubmit() {
|
||||||
map-options
|
map-options
|
||||||
:rules="[(val) => !!val || `${'กรุณาเลือกผู้ร้องเรียน'}`]"
|
:rules="[(val) => !!val || `${'กรุณาเลือกผู้ร้องเรียน'}`]"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
@update:model-value="selectComplainant(complainantType)"
|
@update:model-value="
|
||||||
|
selectComplainant(formData.complainantType)
|
||||||
|
"
|
||||||
use-input
|
use-input
|
||||||
@filter="(inputValue: any,
|
@filter="(inputValue: any,
|
||||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'filtercomplainantType'
|
doneFn: Function) => filterSelector(inputValue, doneFn, 'filtercomplainantType'
|
||||||
|
|
@ -252,12 +265,17 @@ function onSubmit() {
|
||||||
</q-select>
|
</q-select>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-xs-12 col-sm-2" v-if="complainantType === '0'">
|
<div
|
||||||
|
class="col-xs-12 col-sm-2"
|
||||||
|
id="complainant"
|
||||||
|
v-if="formData.complainantType === '0'"
|
||||||
|
>
|
||||||
<q-select
|
<q-select
|
||||||
|
for="complainant"
|
||||||
ref="complainantRef"
|
ref="complainantRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="complainant"
|
v-model="formData.complainant"
|
||||||
:options="complainstStore.optionListName"
|
:options="complainstStore.optionListName"
|
||||||
label="รายชื่อจากทะเบียรประวัติ"
|
label="รายชื่อจากทะเบียรประวัติ"
|
||||||
option-value="id"
|
option-value="id"
|
||||||
|
|
@ -279,23 +297,30 @@ function onSubmit() {
|
||||||
</template>
|
</template>
|
||||||
</q-select>
|
</q-select>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-2" v-if="complainantType === '1'">
|
<div
|
||||||
|
class="col-xs-12 col-sm-2"
|
||||||
|
v-if="formData.complainantType === '1'"
|
||||||
|
id="office"
|
||||||
|
>
|
||||||
<q-input
|
<q-input
|
||||||
|
for="office"
|
||||||
|
name="office"
|
||||||
ref="officeRef"
|
ref="officeRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="office"
|
v-model="formData.office"
|
||||||
label="เลือกสำนักงาน"
|
label="เลือกสำนักงาน"
|
||||||
:rules="[(val) => !!val || `${'กรุณาเลือกสำนักงาน'}`]"
|
:rules="[(val) => !!val || `${'กรุณาเลือกสำนักงาน'}`]"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-2">
|
<div class="col-xs-12 col-sm-2" id="agency">
|
||||||
<q-select
|
<q-select
|
||||||
ref="agencyRef"
|
ref="agencyRef"
|
||||||
|
for="agency"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="agency"
|
v-model="formData.agency"
|
||||||
:options="complainstStore.agencytoptions"
|
:options="complainstStore.agencytoptions"
|
||||||
label="หน่วยงานที่พิจารณา"
|
label="หน่วยงานที่พิจารณา"
|
||||||
option-value="id"
|
option-value="id"
|
||||||
|
|
@ -318,12 +343,13 @@ function onSubmit() {
|
||||||
</template>
|
</template>
|
||||||
</q-select>
|
</q-select>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-12">
|
<div class="col-xs-12 col-sm-12" id="topicComplaint">
|
||||||
<q-input
|
<q-input
|
||||||
|
for="topicComplaint"
|
||||||
ref="topicComplaintRef"
|
ref="topicComplaintRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="topicComplaint"
|
v-model="formData.topicComplaint"
|
||||||
:rules="[(val) => !!val || 'กรุณาการข้อมูล']"
|
:rules="[(val) => !!val || 'กรุณาการข้อมูล']"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
label="เรื่องร้องเรียน"
|
label="เรื่องร้องเรียน"
|
||||||
|
|
@ -331,12 +357,13 @@ function onSubmit() {
|
||||||
rows="5"
|
rows="5"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-12">
|
<div class="col-xs-12 col-sm-12" id="detail">
|
||||||
<q-input
|
<q-input
|
||||||
|
for="detail"
|
||||||
ref="detailRef"
|
ref="detailRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="detail"
|
v-model="formData.detail"
|
||||||
:rules="[(val) => !!val || 'กรุณาการข้อมูล']"
|
:rules="[(val) => !!val || 'กรุณาการข้อมูล']"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
label="รายละเอียดที่เกี่นวข้องกับเรื่องที่ต้องการจะข้อเรียน"
|
label="รายละเอียดที่เกี่นวข้องกับเรื่องที่ต้องการจะข้อเรียน"
|
||||||
|
|
@ -344,10 +371,10 @@ function onSubmit() {
|
||||||
rows="5"
|
rows="5"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-2">
|
<div class="col-xs-12 col-sm-2" id="datereceive">
|
||||||
<datepicker
|
<datepicker
|
||||||
menu-class-name="modalfix"
|
menu-class-name="modalfix"
|
||||||
v-model="datereceive"
|
v-model="formData.datereceive"
|
||||||
:locale="'th'"
|
:locale="'th'"
|
||||||
autoApply
|
autoApply
|
||||||
borderless
|
borderless
|
||||||
|
|
@ -362,12 +389,15 @@ function onSubmit() {
|
||||||
</template>
|
</template>
|
||||||
<template #trigger>
|
<template #trigger>
|
||||||
<q-input
|
<q-input
|
||||||
|
for="datereceive"
|
||||||
ref="datereceiveRef"
|
ref="datereceiveRef"
|
||||||
outlined
|
outlined
|
||||||
dense
|
dense
|
||||||
class="full-width datepicker"
|
class="full-width datepicker"
|
||||||
:model-value="
|
:model-value="
|
||||||
datereceive != null ? date2Thai(datereceive) : null
|
formData.datereceive != null
|
||||||
|
? date2Thai(formData.datereceive)
|
||||||
|
: null
|
||||||
"
|
"
|
||||||
label="วันที่รับเรื่อง"
|
label="วันที่รับเรื่อง"
|
||||||
:rules="[
|
:rules="[
|
||||||
|
|
@ -387,10 +417,10 @@ function onSubmit() {
|
||||||
</template>
|
</template>
|
||||||
</datepicker>
|
</datepicker>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-2">
|
<div class="col-xs-12 col-sm-2" id="dateconsideration">
|
||||||
<datepicker
|
<datepicker
|
||||||
menu-class-name="modalfix"
|
menu-class-name="modalfix"
|
||||||
v-model="dateconsideration"
|
v-model="formData.dateconsideration"
|
||||||
:locale="'th'"
|
:locale="'th'"
|
||||||
autoApply
|
autoApply
|
||||||
borderless
|
borderless
|
||||||
|
|
@ -405,13 +435,14 @@ function onSubmit() {
|
||||||
</template>
|
</template>
|
||||||
<template #trigger>
|
<template #trigger>
|
||||||
<q-input
|
<q-input
|
||||||
|
for="dateconsideration"
|
||||||
ref="dateconsiderationRef"
|
ref="dateconsiderationRef"
|
||||||
outlined
|
outlined
|
||||||
dense
|
dense
|
||||||
class="full-width datepicker"
|
class="full-width datepicker"
|
||||||
:model-value="
|
:model-value="
|
||||||
dateconsideration != null
|
formData.dateconsideration != null
|
||||||
? date2Thai(dateconsideration)
|
? date2Thai(formData.dateconsideration)
|
||||||
: null
|
: null
|
||||||
"
|
"
|
||||||
label="วันที่กำหนดวันพิจารณา"
|
label="วันที่กำหนดวันพิจารณา"
|
||||||
|
|
@ -432,12 +463,13 @@ function onSubmit() {
|
||||||
</template>
|
</template>
|
||||||
</datepicker>
|
</datepicker>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-2">
|
<div class="col-xs-12 col-sm-2" id="offenseDescription">
|
||||||
<q-select
|
<q-select
|
||||||
|
for="offenseDescription"
|
||||||
ref="offenseDescriptionRef"
|
ref="offenseDescriptionRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="offenseDescription"
|
v-model="formData.offenseDescription"
|
||||||
:options="offenseDescriptiontoptions"
|
:options="offenseDescriptiontoptions"
|
||||||
label="ลักษณะความผิด"
|
label="ลักษณะความผิด"
|
||||||
option-value="id"
|
option-value="id"
|
||||||
|
|
@ -448,12 +480,13 @@ function onSubmit() {
|
||||||
lazy-rules
|
lazy-rules
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-2">
|
<div class="col-xs-12 col-sm-2" id="considerationLevel">
|
||||||
<q-select
|
<q-select
|
||||||
|
for="considerationLevel"
|
||||||
ref="considerationLevelRef"
|
ref="considerationLevelRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="considerationLevel"
|
v-model="formData.considerationLevel"
|
||||||
:options="considerationLeveltoptions"
|
:options="considerationLeveltoptions"
|
||||||
label="ระดับการพิจารณา"
|
label="ระดับการพิจารณา"
|
||||||
option-value="id"
|
option-value="id"
|
||||||
|
|
@ -462,14 +495,14 @@ function onSubmit() {
|
||||||
map-options
|
map-options
|
||||||
:rules="[(val) => !!val || `${'กรุณาเลือกระดับการพิจารณา'}`]"
|
:rules="[(val) => !!val || `${'กรุณาเลือกระดับการพิจารณา'}`]"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
@update:model-value="selectLevel(considerationLevel)"
|
@update:model-value="selectLevel(formData.considerationLevel)"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-3"></div>
|
<div class="col-xs-12 col-sm-3"></div>
|
||||||
<div class="col-xs-12 col-sm-2">
|
<div class="col-xs-12 col-sm-2" id="datewarn">
|
||||||
<datepicker
|
<datepicker
|
||||||
menu-class-name="modalfix"
|
menu-class-name="modalfix"
|
||||||
v-model="datewarn"
|
v-model="formData.datewarn"
|
||||||
:locale="'th'"
|
:locale="'th'"
|
||||||
autoApply
|
autoApply
|
||||||
borderless
|
borderless
|
||||||
|
|
@ -484,11 +517,16 @@ function onSubmit() {
|
||||||
</template>
|
</template>
|
||||||
<template #trigger>
|
<template #trigger>
|
||||||
<q-input
|
<q-input
|
||||||
|
for="datewarn"
|
||||||
ref="datewarnRef"
|
ref="datewarnRef"
|
||||||
outlined
|
outlined
|
||||||
dense
|
dense
|
||||||
class="full-width datepicker"
|
class="full-width datepicker"
|
||||||
:model-value="datewarn != null ? date2Thai(datewarn) : null"
|
:model-value="
|
||||||
|
formData.datewarn != null
|
||||||
|
? date2Thai(formData.datewarn)
|
||||||
|
: null
|
||||||
|
"
|
||||||
label="วันที่แจ้งเตือนล่วงหน้า"
|
label="วันที่แจ้งเตือนล่วงหน้า"
|
||||||
:rules="[
|
:rules="[
|
||||||
(val) =>
|
(val) =>
|
||||||
|
|
@ -508,12 +546,13 @@ function onSubmit() {
|
||||||
</template>
|
</template>
|
||||||
</datepicker>
|
</datepicker>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-2">
|
<div class="col-xs-12 col-sm-2" id="receivecomplaints">
|
||||||
<q-select
|
<q-select
|
||||||
|
for="receivecomplaints"
|
||||||
ref="receivecomplaintsRef"
|
ref="receivecomplaintsRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="receivecomplaints"
|
v-model="formData.receivecomplaints"
|
||||||
:options="receivecomplaintstoptions"
|
:options="receivecomplaintstoptions"
|
||||||
label="รับเรื่องร้องเรียน"
|
label="รับเรื่องร้องเรียน"
|
||||||
option-value="id"
|
option-value="id"
|
||||||
|
|
@ -525,24 +564,26 @@ function onSubmit() {
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-6"></div>
|
<div class="col-xs-12 col-sm-6"></div>
|
||||||
<div class="col-xs-12 col-sm-4">
|
<div class="col-xs-12 col-sm-4" id="petitioner">
|
||||||
<q-input
|
<q-input
|
||||||
|
id="petitioner"
|
||||||
ref="petitionerRef"
|
ref="petitionerRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="petitioner"
|
v-model="formData.petitioner"
|
||||||
label="ผู้ร้องเรียน"
|
label="ผู้ร้องเรียน"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกข้อมูล'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอกข้อมูล'}`]"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-4">
|
<div class="col-xs-12 col-sm-4" id="files">
|
||||||
<q-file
|
<q-file
|
||||||
|
for="files"
|
||||||
ref="filesRef"
|
ref="filesRef"
|
||||||
class="col-xs-12 col-sm-10"
|
class="col-xs-12 col-sm-10"
|
||||||
outlined
|
outlined
|
||||||
dense
|
dense
|
||||||
v-model="files"
|
v-model="formData.files"
|
||||||
@added="fileUploadDoc"
|
@added="fileUploadDoc"
|
||||||
label="ไฟล์เอกสารหลักฐาน"
|
label="ไฟล์เอกสารหลักฐาน"
|
||||||
hide-bottom-space
|
hide-bottom-space
|
||||||
|
|
@ -562,6 +603,7 @@ function onSubmit() {
|
||||||
<div class="row col-12 q-pa-sm">
|
<div class="row col-12 q-pa-sm">
|
||||||
<q-space />
|
<q-space />
|
||||||
<q-btn
|
<q-btn
|
||||||
|
id="onSubmit"
|
||||||
flat
|
flat
|
||||||
round
|
round
|
||||||
color="secondary"
|
color="secondary"
|
||||||
|
|
|
||||||
|
|
@ -2,12 +2,15 @@
|
||||||
import { ref, onMounted } from "vue";
|
import { ref, onMounted } from "vue";
|
||||||
import { useRouter } from "vue-router";
|
import { useRouter } from "vue-router";
|
||||||
import type { QTableProps } from "quasar";
|
import type { QTableProps } from "quasar";
|
||||||
|
|
||||||
|
import type { DataList } from "@/modules/11_discipline/interface/response/complaint";
|
||||||
// importStroe
|
// importStroe
|
||||||
import { useComplainstDataStore } from "../../store/ComplaintsStore";
|
import { useComplainstDataStore } from "@/modules/11_discipline/store/ComplaintsStore";
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|
||||||
const complainstStore = useComplainstDataStore();
|
const complainstStore = useComplainstDataStore();
|
||||||
const { fectComplainst } = complainstStore; // function จาก stores
|
const { fetchComplainst } = complainstStore; // function จาก stores
|
||||||
|
|
||||||
//ข้อมูล Table
|
//ข้อมูล Table
|
||||||
const filterTable = ref<string>("");
|
const filterTable = ref<string>("");
|
||||||
|
|
@ -96,12 +99,12 @@ const visibleColumns = ref<string[]>([
|
||||||
"considerationDeadlineDate",
|
"considerationDeadlineDate",
|
||||||
]);
|
]);
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await fecthListComplaints();
|
await fetchListComplaints();
|
||||||
});
|
});
|
||||||
|
|
||||||
// เรีนกรายการเรื่องร้องเรียน
|
// เรีนกรายการเรื่องร้องเรียน
|
||||||
async function fecthListComplaints() {
|
async function fetchListComplaints() {
|
||||||
const listData = [
|
const listData: DataList[] = [
|
||||||
{
|
{
|
||||||
subject: "ทุจริตในหน้าที่",
|
subject: "ทุจริตในหน้าที่",
|
||||||
detail: "มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน",
|
detail: "มีข้อร้องเรียนเรื่องการทุจริตทางการเงิน",
|
||||||
|
|
@ -131,7 +134,7 @@ async function fecthListComplaints() {
|
||||||
considerationDeadlineDate: "2023-11-01",
|
considerationDeadlineDate: "2023-11-01",
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
await fectComplainst(listData);
|
await fetchComplainst(listData);
|
||||||
}
|
}
|
||||||
function redirectToPageadd() {
|
function redirectToPageadd() {
|
||||||
router.push(`/discipline/complaints/add`);
|
router.push(`/discipline/complaints/add`);
|
||||||
|
|
@ -157,6 +160,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
||||||
<div class="q-pa-md">
|
<div class="q-pa-md">
|
||||||
<q-toolbar style="padding: 0" class="q-gutter-sm q-mb-md">
|
<q-toolbar style="padding: 0" class="q-gutter-sm q-mb-md">
|
||||||
<q-btn
|
<q-btn
|
||||||
|
id="addComplaints"
|
||||||
flat
|
flat
|
||||||
dense
|
dense
|
||||||
round
|
round
|
||||||
|
|
@ -167,10 +171,19 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
||||||
>
|
>
|
||||||
<q-space />
|
<q-space />
|
||||||
<div class="col-2">
|
<div class="col-2">
|
||||||
<q-input dense outlined v-model="filterTable" label="ค้นหา" />
|
<q-input
|
||||||
|
id="filterTable"
|
||||||
|
for="filterTable"
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
v-model="filterTable"
|
||||||
|
label="ค้นหา"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-2">
|
<div class="col-2">
|
||||||
<q-select
|
<q-select
|
||||||
|
id="visibleColumns"
|
||||||
|
for="visibleColumns"
|
||||||
v-model="visibleColumns"
|
v-model="visibleColumns"
|
||||||
multiple
|
multiple
|
||||||
outlined
|
outlined
|
||||||
|
|
@ -186,6 +199,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
||||||
</div>
|
</div>
|
||||||
</q-toolbar>
|
</q-toolbar>
|
||||||
<d-table
|
<d-table
|
||||||
|
id="table"
|
||||||
ref="table"
|
ref="table"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:rows="complainstStore.rows"
|
:rows="complainstStore.rows"
|
||||||
|
|
@ -209,46 +223,21 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
||||||
</template>
|
</template>
|
||||||
<template v-slot:body="props">
|
<template v-slot:body="props">
|
||||||
<q-tr :props="props" class="cursor-pointer" style="height: 40px">
|
<q-tr :props="props" class="cursor-pointer" style="height: 40px">
|
||||||
<q-td key="no" :props="props">
|
<q-td v-for="col in props.cols" :key="col.name" :props="props">
|
||||||
{{ props.rowIndex + 1 }}
|
<div v-if="col.name == 'no'">
|
||||||
</q-td>
|
{{ props.rowIndex + 1 }}
|
||||||
<q-td key="subject" :props="props">
|
</div>
|
||||||
{{ props.row.subject }}
|
<div v-if="col.name == 'detail'">
|
||||||
</q-td>
|
<div class="table_ellipsis">
|
||||||
<q-td key="detail" :props="props">
|
{{ props.row.detail }}
|
||||||
<div class="table_ellipsis">
|
</div>
|
||||||
{{ props.row.detail }}
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
{{ col.value }}
|
||||||
</div>
|
</div>
|
||||||
</q-td>
|
|
||||||
<q-td key="complainant" :props="props">
|
|
||||||
{{ props.row.complainant }}
|
|
||||||
</q-td>
|
|
||||||
<q-td key="offenseDescription" :props="props">
|
|
||||||
{{ props.row.offenseDescription }}
|
|
||||||
</q-td>
|
|
||||||
<q-td key="creationDate" :props="props">
|
|
||||||
{{ props.row.creationDate }}
|
|
||||||
</q-td>
|
|
||||||
<q-td key="considerationLevel" :props="props">
|
|
||||||
{{ props.row.considerationLevel }}
|
|
||||||
</q-td>
|
|
||||||
<q-td key="considerationDeadlineDate" :props="props">
|
|
||||||
{{ props.row.considerationDeadlineDate }}
|
|
||||||
</q-td>
|
</q-td>
|
||||||
</q-tr>
|
</q-tr>
|
||||||
</template>
|
</template>
|
||||||
<!-- <template v-slot:pagination="scope">
|
|
||||||
<q-pagination
|
|
||||||
v-model="pagination.page"
|
|
||||||
active-color="primary"
|
|
||||||
color="dark"
|
|
||||||
:max="scope.pagesNumber"
|
|
||||||
:max-pages="5"
|
|
||||||
size="sm"
|
|
||||||
boundary-links
|
|
||||||
direction-links
|
|
||||||
></q-pagination>
|
|
||||||
</template> -->
|
|
||||||
</d-table>
|
</d-table>
|
||||||
</div>
|
</div>
|
||||||
</q-card>
|
</q-card>
|
||||||
|
|
|
||||||
|
|
@ -2,13 +2,14 @@
|
||||||
import { ref, onMounted } from "vue";
|
import { ref, onMounted } from "vue";
|
||||||
import { useRouter } from "vue-router";
|
import { useRouter } from "vue-router";
|
||||||
import type { QTableProps } from "quasar";
|
import type { QTableProps } from "quasar";
|
||||||
|
import type { DataList } from "../../interface/response/order";
|
||||||
|
|
||||||
// importStroe
|
// importStroe
|
||||||
import { useOrderStore } from "../../store/OrderStore";
|
import { useOrderStore } from "@/modules/11_discipline/store/OrderStore";
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const OrderStore = useOrderStore();
|
const OrderStore = useOrderStore();
|
||||||
const { fecthOrder } = OrderStore; // function จาก stores
|
const { fetchOrder } = OrderStore; // function จาก stores
|
||||||
|
|
||||||
// ข้อมูล table
|
// ข้อมูล table
|
||||||
const columns = ref<QTableProps["columns"]>([
|
const columns = ref<QTableProps["columns"]>([
|
||||||
|
|
@ -78,12 +79,12 @@ const visibleColumns = ref<string[]>([
|
||||||
const filterTable = ref<string>("");
|
const filterTable = ref<string>("");
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await fecthListOrder();
|
await fetchListOrder();
|
||||||
});
|
});
|
||||||
|
|
||||||
// เรียกรายการคำสั่ง จาก API
|
// เรียกรายการคำสั่ง จาก API
|
||||||
async function fecthListOrder() {
|
async function fetchListOrder() {
|
||||||
const listData = [
|
const listData: DataList[] = [
|
||||||
{
|
{
|
||||||
subject: "ทุจริตในหน้าที่",
|
subject: "ทุจริตในหน้าที่",
|
||||||
ordernumber: "1/2556",
|
ordernumber: "1/2556",
|
||||||
|
|
@ -109,7 +110,7 @@ async function fecthListOrder() {
|
||||||
statusorder: "เสร็จสิ้นแล้ว",
|
statusorder: "เสร็จสิ้นแล้ว",
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
await fecthOrder(listData); // ส่งข้อมูลไปยัง stores
|
await fetchOrder(listData); // ส่งข้อมูลไปยัง stores
|
||||||
}
|
}
|
||||||
|
|
||||||
// redirect ไปยังการเพิ่มออกคำสั่งลงโทษทางวินัย
|
// redirect ไปยังการเพิ่มออกคำสั่งลงโทษทางวินัย
|
||||||
|
|
@ -139,6 +140,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
||||||
<div class="q-pa-md">
|
<div class="q-pa-md">
|
||||||
<q-toolbar style="padding: 0" class="q-gutter-sm q-mb-md">
|
<q-toolbar style="padding: 0" class="q-gutter-sm q-mb-md">
|
||||||
<q-btn
|
<q-btn
|
||||||
|
id="addDisciplineOrder"
|
||||||
flat
|
flat
|
||||||
dense
|
dense
|
||||||
round
|
round
|
||||||
|
|
@ -149,10 +151,17 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
||||||
>
|
>
|
||||||
<q-space />
|
<q-space />
|
||||||
<div class="col-2">
|
<div class="col-2">
|
||||||
<q-input dense outlined v-model="filterTable" label="ค้นหา" />
|
<q-input
|
||||||
|
for="filterTable"
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
v-model="filterTable"
|
||||||
|
label="ค้นหา"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-2">
|
<div class="col-2">
|
||||||
<q-select
|
<q-select
|
||||||
|
for="visibleColumns"
|
||||||
v-model="visibleColumns"
|
v-model="visibleColumns"
|
||||||
multiple
|
multiple
|
||||||
outlined
|
outlined
|
||||||
|
|
@ -168,6 +177,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
||||||
</div>
|
</div>
|
||||||
</q-toolbar>
|
</q-toolbar>
|
||||||
<d-table
|
<d-table
|
||||||
|
for="table"
|
||||||
ref="table"
|
ref="table"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:rows="OrderStore.rows"
|
:rows="OrderStore.rows"
|
||||||
|
|
@ -191,40 +201,13 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
||||||
</template>
|
</template>
|
||||||
<template v-slot:body="props">
|
<template v-slot:body="props">
|
||||||
<q-tr :props="props" class="cursor-pointer" style="height: 40px">
|
<q-tr :props="props" class="cursor-pointer" style="height: 40px">
|
||||||
<q-td key="subject" :props="props">
|
<q-td v-for="col in props.cols" :key="col.name" :props="props">
|
||||||
{{ props.row.subject }}
|
<div>
|
||||||
</q-td>
|
{{ col.value }}
|
||||||
<q-td key="ordernumber" :props="props">
|
|
||||||
{{ props.row.ordernumber }}
|
|
||||||
</q-td>
|
|
||||||
<q-td key="dateOrder" :props="props">
|
|
||||||
{{ props.row.dateOrder }}
|
|
||||||
</q-td>
|
|
||||||
<q-td key="orderby" :props="props">
|
|
||||||
<div class="table_ellipsis">
|
|
||||||
{{ props.row.orderby }}
|
|
||||||
</div>
|
</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td key="signer" :props="props">
|
|
||||||
{{ props.row.signer }}
|
|
||||||
</q-td>
|
|
||||||
<q-td key="statusorder" :props="props">
|
|
||||||
{{ props.row.statusorder }}
|
|
||||||
</q-td>
|
|
||||||
</q-tr>
|
</q-tr>
|
||||||
</template>
|
</template>
|
||||||
<!-- <template v-slot:pagination="scope">
|
|
||||||
<q-pagination
|
|
||||||
v-model="pagination.page"
|
|
||||||
active-color="primary"
|
|
||||||
color="dark"
|
|
||||||
:max="scope.pagesNumber"
|
|
||||||
:max-pages="5"
|
|
||||||
size="sm"
|
|
||||||
boundary-links
|
|
||||||
direction-links
|
|
||||||
></q-pagination>
|
|
||||||
</template> -->
|
|
||||||
</d-table>
|
</d-table>
|
||||||
</div>
|
</div>
|
||||||
</q-card>
|
</q-card>
|
||||||
|
|
|
||||||
|
|
@ -3,9 +3,9 @@ import { ref } from "vue";
|
||||||
import { useRouter } from "vue-router";
|
import { useRouter } from "vue-router";
|
||||||
|
|
||||||
// import step
|
// import step
|
||||||
import step01 from "./Step01.vue";
|
import step01 from "@/modules/11_discipline/components/4_Order/Step01.vue";
|
||||||
import step02 from "./Step02.vue";
|
import step02 from "@/modules/11_discipline/components/4_Order/Step02.vue";
|
||||||
import step03 from "./Step03.vue";
|
import step03 from "@/modules/11_discipline/components/4_Order/Step03.vue";
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,12 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from "vue";
|
import { ref, reactive } from "vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
import type { DataOption, MyObjectRef } from "../../interface/index/Main";
|
import type { DataOption } from "@/modules/11_discipline/interface/index/Main";
|
||||||
|
import type {
|
||||||
|
FormData,
|
||||||
|
MyObjectRef,
|
||||||
|
} from "@/modules/11_discipline/interface/request/order";
|
||||||
// importStroe
|
// importStroe
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
|
||||||
|
|
@ -38,28 +42,30 @@ const listInvestigationOptions = ref<DataOption[]>([
|
||||||
{ id: "2", name: "รายการสอบสวนความผิดทางวินัย 3" },
|
{ id: "2", name: "รายการสอบสวนความผิดทางวินัย 3" },
|
||||||
]);
|
]);
|
||||||
// ตัวแปรทั้งหมด
|
// ตัวแปรทั้งหมด
|
||||||
const orderType = ref<string>("");
|
const formData = reactive<FormData>({
|
||||||
const orderBy = ref<string>("");
|
orderType: "",
|
||||||
const listInvestigation = ref<string>("");
|
orderBy: "",
|
||||||
const authority = ref<string>("");
|
listInvestigation: "",
|
||||||
const orderNumber = ref<string>();
|
authority: "",
|
||||||
const dateYear = ref<number>(2023);
|
orderNumber: "",
|
||||||
const date = ref<Date | null>(null);
|
dateYear: 0,
|
||||||
const authorityPosition = ref<string>("");
|
date: null,
|
||||||
const subject = ref<string>("");
|
authorityPosition: "",
|
||||||
const mistakeDetail = ref<string>("");
|
subject: "",
|
||||||
|
mistakeDetail: "",
|
||||||
|
});
|
||||||
|
|
||||||
// validateForm
|
// validateForm
|
||||||
const orderTypeRef = ref<any>(null);
|
const orderTypeRef = ref<Object | null>(null);
|
||||||
const orderByRef = ref<any>(null);
|
const orderByRef = ref<Object | null>(null);
|
||||||
const listInvestigationRef = ref<any>(null);
|
const listInvestigationRef = ref<Object | null>(null);
|
||||||
const authorityRef = ref<any>(null);
|
const authorityRef = ref<Object | null>(null);
|
||||||
const orderNumberRef = ref<any>(null);
|
const orderNumberRef = ref<Object | null>(null);
|
||||||
const dateYearRef = ref<any>(null);
|
const dateYearRef = ref<Object | null>(null);
|
||||||
const dateRef = ref<any>(null);
|
const dateRef = ref<Object | null>(null);
|
||||||
const authorityPositionRef = ref<any>(null);
|
const authorityPositionRef = ref<Object | null>(null);
|
||||||
const subjectRef = ref<any>(null);
|
const subjectRef = ref<Object | null>(null);
|
||||||
const mistakeDetailRef = ref<any>(null);
|
const mistakeDetailRef = ref<Object | null>(null);
|
||||||
const myObjectRef: MyObjectRef = {
|
const myObjectRef: MyObjectRef = {
|
||||||
orderType: orderTypeRef,
|
orderType: orderTypeRef,
|
||||||
orderBy: orderByRef,
|
orderBy: orderByRef,
|
||||||
|
|
@ -91,6 +97,7 @@ function validateForm() {
|
||||||
}
|
}
|
||||||
|
|
||||||
function onSubmit() {
|
function onSubmit() {
|
||||||
|
console.log(formData);
|
||||||
dialogConfirm(
|
dialogConfirm(
|
||||||
$q,
|
$q,
|
||||||
async () => {
|
async () => {
|
||||||
|
|
@ -109,10 +116,11 @@ function onSubmit() {
|
||||||
<div class="col-xs-12 col-sm-6">
|
<div class="col-xs-12 col-sm-6">
|
||||||
ประเภทคำสั่ง
|
ประเภทคำสั่ง
|
||||||
<q-select
|
<q-select
|
||||||
|
for="orderType"
|
||||||
ref="orderTypeRef"
|
ref="orderTypeRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="orderType"
|
v-model="formData.orderType"
|
||||||
:options="orderTypeOptions"
|
:options="orderTypeOptions"
|
||||||
option-value="id"
|
option-value="id"
|
||||||
option-label="name"
|
option-label="name"
|
||||||
|
|
@ -126,10 +134,11 @@ function onSubmit() {
|
||||||
<div class="col-xs-12 col-sm-6">
|
<div class="col-xs-12 col-sm-6">
|
||||||
คำสั่งโดย
|
คำสั่งโดย
|
||||||
<q-select
|
<q-select
|
||||||
|
for="orderBy"
|
||||||
ref="orderByRef"
|
ref="orderByRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="orderBy"
|
v-model="formData.orderBy"
|
||||||
:options="orderByOptions"
|
:options="orderByOptions"
|
||||||
option-value="id"
|
option-value="id"
|
||||||
option-label="name"
|
option-label="name"
|
||||||
|
|
@ -143,10 +152,11 @@ function onSubmit() {
|
||||||
<div class="col-xs-12 col-sm-6">
|
<div class="col-xs-12 col-sm-6">
|
||||||
เลือกรายการสอบสวนความผิดทางวินัย
|
เลือกรายการสอบสวนความผิดทางวินัย
|
||||||
<q-select
|
<q-select
|
||||||
|
for="listInvestigation"
|
||||||
ref="listInvestigationRef"
|
ref="listInvestigationRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="listInvestigation"
|
v-model="formData.listInvestigation"
|
||||||
:options="listInvestigationOptions"
|
:options="listInvestigationOptions"
|
||||||
option-value="id"
|
option-value="id"
|
||||||
option-label="name"
|
option-label="name"
|
||||||
|
|
@ -162,10 +172,11 @@ function onSubmit() {
|
||||||
<div class="col-xs-12 col-sm-6">
|
<div class="col-xs-12 col-sm-6">
|
||||||
ผู้มีอำนาจลงนาม
|
ผู้มีอำนาจลงนาม
|
||||||
<q-input
|
<q-input
|
||||||
|
for="authority"
|
||||||
ref="authorityRef"
|
ref="authorityRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="authority"
|
v-model="formData.authority"
|
||||||
placeholder="กรอกผู้มีอำนาจลงนาม"
|
placeholder="กรอกผู้มีอำนาจลงนาม"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกผู้มีอำนาจลงนาม'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอกผู้มีอำนาจลงนาม'}`]"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
|
|
@ -175,10 +186,11 @@ function onSubmit() {
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
คำสั่งที่
|
คำสั่งที่
|
||||||
<q-input
|
<q-input
|
||||||
|
for="orderNumber"
|
||||||
ref="orderNumberRef"
|
ref="orderNumberRef"
|
||||||
outlined
|
outlined
|
||||||
dense
|
dense
|
||||||
v-model="orderNumber"
|
v-model="formData.orderNumber"
|
||||||
hide-bottom-space
|
hide-bottom-space
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอรคำสั่งที่'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอรคำสั่งที่'}`]"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
|
|
@ -191,7 +203,7 @@ function onSubmit() {
|
||||||
<div class="col-5">
|
<div class="col-5">
|
||||||
พศ
|
พศ
|
||||||
<datepicker
|
<datepicker
|
||||||
v-model="dateYear"
|
v-model="formData.dateYear"
|
||||||
:locale="'th'"
|
:locale="'th'"
|
||||||
autoApply
|
autoApply
|
||||||
year-picker
|
year-picker
|
||||||
|
|
@ -204,9 +216,10 @@ function onSubmit() {
|
||||||
<template #trigger>
|
<template #trigger>
|
||||||
<q-input
|
<q-input
|
||||||
ref="dateYearRef"
|
ref="dateYearRef"
|
||||||
:model-value="dateYear + 543"
|
:model-value="
|
||||||
|
formData.dateYear ? formData.dateYear + 543 : null
|
||||||
|
"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอก พ.ศ.'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอก พ.ศ.'}`]"
|
||||||
:label="`${'พ.ศ.'}`"
|
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
>
|
>
|
||||||
|
|
@ -219,7 +232,7 @@ function onSubmit() {
|
||||||
วันที่มีผลคำสั่ง
|
วันที่มีผลคำสั่ง
|
||||||
<datepicker
|
<datepicker
|
||||||
menu-class-name="modalfix"
|
menu-class-name="modalfix"
|
||||||
v-model="date"
|
v-model="formData.date"
|
||||||
:locale="'th'"
|
:locale="'th'"
|
||||||
autoApply
|
autoApply
|
||||||
borderless
|
borderless
|
||||||
|
|
@ -234,11 +247,14 @@ function onSubmit() {
|
||||||
</template>
|
</template>
|
||||||
<template #trigger>
|
<template #trigger>
|
||||||
<q-input
|
<q-input
|
||||||
|
for="date"
|
||||||
ref="dateRef"
|
ref="dateRef"
|
||||||
outlined
|
outlined
|
||||||
dense
|
dense
|
||||||
class="full-width datepicker"
|
class="full-width datepicker"
|
||||||
:model-value="date != null ? date2Thai(date) : null"
|
:model-value="
|
||||||
|
formData.date != null ? date2Thai(formData.date) : null
|
||||||
|
"
|
||||||
:rules="[(val) => !!val || `${'กรุณาเลือกวันที่มีผลคำสั่ง'}`]"
|
:rules="[(val) => !!val || `${'กรุณาเลือกวันที่มีผลคำสั่ง'}`]"
|
||||||
>
|
>
|
||||||
<template v-slot:prepend>
|
<template v-slot:prepend>
|
||||||
|
|
@ -256,10 +272,11 @@ function onSubmit() {
|
||||||
<div class="col-xs-12 col-sm-6">
|
<div class="col-xs-12 col-sm-6">
|
||||||
ตำแหน่งผู้มีอำนาจลงนาม
|
ตำแหน่งผู้มีอำนาจลงนาม
|
||||||
<q-input
|
<q-input
|
||||||
|
for="authorityPosition"
|
||||||
ref="authorityPositionRef"
|
ref="authorityPositionRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="authorityPosition"
|
v-model="formData.authorityPosition"
|
||||||
placeholder="กรอกตำแหน่งผู้มีอำนาจลงนาม"
|
placeholder="กรอกตำแหน่งผู้มีอำนาจลงนาม"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งผู้มีอำนาจลงนาม'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งผู้มีอำนาจลงนาม'}`]"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
|
|
@ -268,10 +285,11 @@ function onSubmit() {
|
||||||
<div class="col-xs-12 col-sm-6">
|
<div class="col-xs-12 col-sm-6">
|
||||||
คำสั่งเรื่อง
|
คำสั่งเรื่อง
|
||||||
<q-input
|
<q-input
|
||||||
|
for="subject"
|
||||||
ref="subjectRef"
|
ref="subjectRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="subject"
|
v-model="formData.subject"
|
||||||
placeholder="กรอกคำสั่งเรื่อง"
|
placeholder="กรอกคำสั่งเรื่อง"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกคำสั่งเรื่อง'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอกคำสั่งเรื่อง'}`]"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
|
|
@ -280,10 +298,11 @@ function onSubmit() {
|
||||||
<div class="col-xs-12 col-sm-12">
|
<div class="col-xs-12 col-sm-12">
|
||||||
รายละเอียดการกระทำความผิด
|
รายละเอียดการกระทำความผิด
|
||||||
<q-input
|
<q-input
|
||||||
|
for="mistakeDetail"
|
||||||
ref="mistakeDetailRef"
|
ref="mistakeDetailRef"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
v-model="mistakeDetail"
|
v-model="formData.mistakeDetail"
|
||||||
placeholder="กรอกรายละเอียดการกระทำความผิด"
|
placeholder="กรอกรายละเอียดการกระทำความผิด"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกคำสั่งเรื่อง'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอกคำสั่งเรื่อง'}`]"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
|
|
@ -295,6 +314,7 @@ function onSubmit() {
|
||||||
</div>
|
</div>
|
||||||
<q-card-actions align="right">
|
<q-card-actions align="right">
|
||||||
<q-btn
|
<q-btn
|
||||||
|
for="submit"
|
||||||
flat
|
flat
|
||||||
round
|
round
|
||||||
unelevated
|
unelevated
|
||||||
|
|
|
||||||
|
|
@ -1,12 +1,15 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, reactive, watch } from "vue";
|
import { ref, reactive, watch } from "vue";
|
||||||
import type { FormData, FormRef } from "@/modules/11_discipline/interface/request/director";
|
import type {
|
||||||
|
FormData,
|
||||||
|
FormRef,
|
||||||
|
} from "@/modules/11_discipline/interface/request/director";
|
||||||
|
|
||||||
// รับ props มาจาก page หลัก
|
// รับ props มาจาก page หลัก
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
data: {
|
data: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: null
|
default: null,
|
||||||
},
|
},
|
||||||
onSubmit: {
|
onSubmit: {
|
||||||
type: Function,
|
type: Function,
|
||||||
|
|
@ -16,7 +19,7 @@ const props = defineProps({
|
||||||
|
|
||||||
// ข้อมูลรหัสบัตรประชาชน
|
// ข้อมูลรหัสบัตรประชาชน
|
||||||
const idCard = ref<string>("");
|
const idCard = ref<string>("");
|
||||||
const idCardRef = ref<any>(null)
|
const idCardRef = ref<any>(null);
|
||||||
|
|
||||||
// ข้อมูลทั้งก้อน form
|
// ข้อมูลทั้งก้อน form
|
||||||
const formData = reactive<FormData>({
|
const formData = reactive<FormData>({
|
||||||
|
|
@ -30,31 +33,31 @@ const formData = reactive<FormData>({
|
||||||
});
|
});
|
||||||
|
|
||||||
watch(props.data, async () => {
|
watch(props.data, async () => {
|
||||||
console.log("data==>", props.data)
|
console.log("data==>", props.data);
|
||||||
formData.prefix = props.data.prefix
|
formData.prefix = props.data.prefix;
|
||||||
formData.firstname = props.data.firstname
|
formData.firstname = props.data.firstname;
|
||||||
formData.lastname = props.data.lastname
|
formData.lastname = props.data.lastname;
|
||||||
formData.position = props.data.position
|
formData.position = props.data.position;
|
||||||
formData.phone = props.data.phone
|
formData.phone = props.data.phone;
|
||||||
formData.responsibilities = props.data.responsibilities
|
formData.responsibilities = props.data.responsibilities;
|
||||||
formData.email = props.data.email
|
formData.email = props.data.email;
|
||||||
});
|
});
|
||||||
|
|
||||||
// เพิ่มบุคลากร
|
// เพิ่มบุคลากร
|
||||||
function addEmployee() {
|
function addEmployee() {
|
||||||
if (idCardRef.value.validate()) {
|
if (idCardRef.value.validate()) {
|
||||||
console.log("idCard===>", idCard.value)
|
console.log("idCard===>", idCard.value);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// ตรวจสอบข้อมูลก่อนส่งไปยัง api
|
// ตรวจสอบข้อมูลก่อนส่งไปยัง api
|
||||||
const prefixRef = ref<object | null>(null)
|
const prefixRef = ref<object | null>(null);
|
||||||
const firstnameRef = ref<object | null>(null)
|
const firstnameRef = ref<object | null>(null);
|
||||||
const lastnameRef = ref<object | null>(null)
|
const lastnameRef = ref<object | null>(null);
|
||||||
const positionRef = ref<object | null>(null)
|
const positionRef = ref<object | null>(null);
|
||||||
const phoneRef = ref<object | null>(null)
|
const phoneRef = ref<object | null>(null);
|
||||||
const responsibilitiesRef = ref<object | null>(null)
|
const responsibilitiesRef = ref<object | null>(null);
|
||||||
const emailRef = ref<object | null>(null)
|
const emailRef = ref<object | null>(null);
|
||||||
const formRef: FormRef = {
|
const formRef: FormRef = {
|
||||||
prefix: prefixRef,
|
prefix: prefixRef,
|
||||||
firstname: firstnameRef,
|
firstname: firstnameRef,
|
||||||
|
|
@ -62,7 +65,7 @@ const formRef: FormRef = {
|
||||||
position: positionRef,
|
position: positionRef,
|
||||||
phone: phoneRef,
|
phone: phoneRef,
|
||||||
responsibilities: responsibilitiesRef,
|
responsibilities: responsibilitiesRef,
|
||||||
email: emailRef
|
email: emailRef,
|
||||||
};
|
};
|
||||||
|
|
||||||
function onValidate() {
|
function onValidate() {
|
||||||
|
|
@ -77,69 +80,127 @@ function onValidate() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (hasError.every((result) => result === true)) {
|
if (hasError.every((result) => result === true)) {
|
||||||
props.onSubmit()
|
props.onSubmit();
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<form @submit.prevent.stop="onValidate" class="q-gutter-md">
|
<form @submit.prevent.stop="onValidate" class="q-gutter-md">
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
|
|
||||||
<q-card bordered>
|
<q-card bordered>
|
||||||
|
|
||||||
<div class="row q-pa-md q-col-gutter-sm">
|
<div class="row q-pa-md q-col-gutter-sm">
|
||||||
<div class="col-md-3 row q-pa-md text-bold">
|
<div class="col-md-3 row q-pa-md text-bold">
|
||||||
<label>ค้นหาบุคคลากรที่อยู่ในระบบ</label>
|
<label>ค้นหาบุคคลากรที่อยู่ในระบบ</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-6">
|
<div class="col-md-6">
|
||||||
<q-input dense outlined v-model="idCard" label="รหัสบัตรประชาชน" ref="idCardRef"
|
<q-input
|
||||||
:rules="[(val: string) => !!val || `${'กรุณากรอกรหัสบัตรประชาชน'}`]" />
|
dense
|
||||||
|
outlined
|
||||||
|
v-model="idCard"
|
||||||
|
label="รหัสบัตรประชาชน"
|
||||||
|
ref="idCardRef"
|
||||||
|
:rules="[(val: string) => !!val || `${'กรุณากรอกรหัสบัตรประชาชน'}`]"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-2">
|
<div class="col-md-2">
|
||||||
<q-btn unelevated dense color="primary" class="q-px-md q-py-sm" @click="addEmployee" label="เพิ่มบุคลากร" />
|
<q-btn
|
||||||
|
unelevated
|
||||||
|
dense
|
||||||
|
color="primary"
|
||||||
|
class="q-px-md q-py-sm"
|
||||||
|
@click="addEmployee"
|
||||||
|
label="เพิ่มบุคลากร"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row q-px-md q-col-gutter-sm">
|
<div class="row q-px-md q-col-gutter-sm">
|
||||||
<div class="col-md-3">
|
<div class="col-md-3">
|
||||||
<q-input dense outlined v-model="formData.prefix" label="คำนำหน้า" ref="prefixRef"
|
<q-input
|
||||||
:rules="[(val: string) => val !== null && val !== '' || `${'กรุณากรอกคำนำหน้า'}`]" />
|
dense
|
||||||
|
outlined
|
||||||
|
v-model="formData.prefix"
|
||||||
|
label="คำนำหน้า"
|
||||||
|
ref="prefixRef"
|
||||||
|
:rules="[(val: string) => val !== null && val !== '' || `${'กรุณากรอกคำนำหน้า'}`]"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-3">
|
<div class="col-md-3">
|
||||||
<q-input dense outlined v-model="formData.firstname" label="ชื่อ" ref="firstnameRef"
|
<q-input
|
||||||
:rules="[(val: string) => val !== null && val !== '' || `${'กรุณากรอกชื่อ'}`]" />
|
dense
|
||||||
|
outlined
|
||||||
|
v-model="formData.firstname"
|
||||||
|
label="ชื่อ"
|
||||||
|
ref="firstnameRef"
|
||||||
|
:rules="[(val: string) => val !== null && val !== '' || `${'กรุณากรอกชื่อ'}`]"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-3">
|
<div class="col-md-3">
|
||||||
<q-input dense outlined v-model="formData.lastname" label="นามสกุล" ref="lastnameRef"
|
<q-input
|
||||||
:rules="[(val: string) => !!val || `${'กรุณากรอกนามสกุล'}`]" />
|
dense
|
||||||
|
outlined
|
||||||
|
v-model="formData.lastname"
|
||||||
|
label="นามสกุล"
|
||||||
|
ref="lastnameRef"
|
||||||
|
:rules="[(val: string) => !!val || `${'กรุณากรอกนามสกุล'}`]"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-3">
|
<div class="col-md-3">
|
||||||
<q-input dense outlined v-model="formData.position" label="ตำแหน่ง" ref="positionRef"
|
<q-input
|
||||||
:rules="[(val: string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]" />
|
dense
|
||||||
|
outlined
|
||||||
|
v-model="formData.position"
|
||||||
|
label="ตำแหน่ง"
|
||||||
|
ref="positionRef"
|
||||||
|
:rules="[(val: string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-3">
|
<div class="col-md-3">
|
||||||
<q-input dense outlined v-model="formData.phone" label="เบอร์โทร" ref="phoneRef"
|
<q-input
|
||||||
:rules="[(val: string) => !!val || `${'กรุณากรอกเบอร์โทร'}`]" />
|
dense
|
||||||
|
outlined
|
||||||
|
v-model="formData.phone"
|
||||||
|
label="เบอร์โทร"
|
||||||
|
ref="phoneRef"
|
||||||
|
:rules="[(val: string) => !!val || `${'กรุณากรอกเบอร์โทร'}`]"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-3">
|
<div class="col-md-3">
|
||||||
<q-input dense outlined v-model="formData.responsibilities" label="หน้าที่" ref="responsibilitiesRef"
|
<q-input
|
||||||
:rules="[(val: string) => !!val || `${'กรุณากรอกหน้าที่'}`]" />
|
dense
|
||||||
|
outlined
|
||||||
|
v-model="formData.responsibilities"
|
||||||
|
label="หน้าที่"
|
||||||
|
ref="responsibilitiesRef"
|
||||||
|
:rules="[(val: string) => !!val || `${'กรุณากรอกหน้าที่'}`]"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-3">
|
<div class="col-md-3">
|
||||||
<q-input dense outlined v-model="formData.email" label="อีเมล" ref="emailRef"
|
<q-input
|
||||||
:rules="[(val: string) => !!val || `${'กรุณากรอกอีเมล'}`]" />
|
dense
|
||||||
|
outlined
|
||||||
|
v-model="formData.email"
|
||||||
|
label="อีเมล"
|
||||||
|
ref="emailRef"
|
||||||
|
:rules="[(val: string) => !!val || `${'กรุณากรอกอีเมล'}`]"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<q-separator />
|
<q-separator />
|
||||||
<div class="row col-12 q-pa-sm">
|
<div class="row col-12 q-pa-sm">
|
||||||
<q-space />
|
<q-space />
|
||||||
<q-btn type="submit" flat round color="public" icon="mdi-content-save-outline">
|
<q-btn
|
||||||
|
type="submit"
|
||||||
|
flat
|
||||||
|
round
|
||||||
|
color="public"
|
||||||
|
icon="mdi-content-save-outline"
|
||||||
|
>
|
||||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||||
</q-btn>
|
</q-btn>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</q-card>
|
</q-card>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
38
src/modules/11_discipline/interface/request/complaint.ts
Normal file
38
src/modules/11_discipline/interface/request/complaint.ts
Normal file
|
|
@ -0,0 +1,38 @@
|
||||||
|
interface FormData {
|
||||||
|
complainantType: string
|
||||||
|
complainant: 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
|
||||||
|
}
|
||||||
|
|
||||||
|
interface MyObjectComplaintsRef {
|
||||||
|
complainantType: object | null;
|
||||||
|
complainant: 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;
|
||||||
|
[key: string]: any;
|
||||||
|
}
|
||||||
|
|
||||||
|
export type {
|
||||||
|
FormData,
|
||||||
|
MyObjectComplaintsRef
|
||||||
|
}
|
||||||
30
src/modules/11_discipline/interface/request/order.ts
Normal file
30
src/modules/11_discipline/interface/request/order.ts
Normal file
|
|
@ -0,0 +1,30 @@
|
||||||
|
interface FormData {
|
||||||
|
orderType: string;
|
||||||
|
orderBy: string;
|
||||||
|
listInvestigation: string;
|
||||||
|
authority: string;
|
||||||
|
orderNumber: string;
|
||||||
|
dateYear: number;
|
||||||
|
date: Date | null;
|
||||||
|
authorityPosition: string
|
||||||
|
subject: string;
|
||||||
|
mistakeDetail: string
|
||||||
|
}
|
||||||
|
interface MyObjectRef {
|
||||||
|
orderType: object | null;
|
||||||
|
orderBy: object | null;
|
||||||
|
listInvestigation: object | null;
|
||||||
|
authority: object | null;
|
||||||
|
orderNumber: object | null;
|
||||||
|
dateYear: object | null;
|
||||||
|
date: object | null;
|
||||||
|
authorityPosition: object | null;
|
||||||
|
subject: object | null;
|
||||||
|
mistakeDetail: object | null;
|
||||||
|
[key: string]: any;
|
||||||
|
}
|
||||||
|
|
||||||
|
export type {
|
||||||
|
FormData,
|
||||||
|
MyObjectRef
|
||||||
|
}
|
||||||
15
src/modules/11_discipline/interface/response/complaint.ts
Normal file
15
src/modules/11_discipline/interface/response/complaint.ts
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
interface DataList {
|
||||||
|
subject: string
|
||||||
|
detail: string
|
||||||
|
complainant: string
|
||||||
|
offenseDescription: string
|
||||||
|
creationDate: string
|
||||||
|
considerationLevel: string
|
||||||
|
considerationDeadlineDate: string
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
export type {
|
||||||
|
DataList
|
||||||
|
}
|
||||||
15
src/modules/11_discipline/interface/response/order.ts
Normal file
15
src/modules/11_discipline/interface/response/order.ts
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
interface DataList {
|
||||||
|
subject: string
|
||||||
|
ordernumber: string
|
||||||
|
dateOrder: string
|
||||||
|
orderby: string
|
||||||
|
signer: string
|
||||||
|
statusorder: string
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
export type {
|
||||||
|
DataList
|
||||||
|
}
|
||||||
|
|
@ -1,15 +1,14 @@
|
||||||
import { defineStore } from "pinia";
|
import { defineStore } from "pinia";
|
||||||
import { ref } from "vue";
|
import { ref } from "vue";
|
||||||
|
|
||||||
import type { DataOption } from "../interface/index/Main";
|
import type { DataOption } from "@/modules/11_discipline/interface/index/Main";
|
||||||
|
import type { DataList } from "@/modules/11_discipline/interface/response/complaint"
|
||||||
|
|
||||||
|
|
||||||
export const useComplainstDataStore = defineStore("DisciplineComplainst", () => {
|
export const useComplainstDataStore = defineStore("DisciplineComplainst", () => {
|
||||||
const rows = ref<any>([])
|
const rows = ref<DataList[]>([])
|
||||||
|
function fetchComplainst(data: DataList[]) {
|
||||||
|
let datalist = data.map((e: DataList) => ({
|
||||||
|
|
||||||
function fectComplainst(data: any) {
|
|
||||||
let datalist = data.map((e: any) => ({
|
|
||||||
subject: e.subject,
|
subject: e.subject,
|
||||||
detail: e.detail,
|
detail: e.detail,
|
||||||
complainant: e.complainant,
|
complainant: e.complainant,
|
||||||
|
|
@ -20,16 +19,13 @@ export const useComplainstDataStore = defineStore("DisciplineComplainst", () =>
|
||||||
}))
|
}))
|
||||||
rows.value = datalist
|
rows.value = datalist
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const complainantoptionsMain = ref<DataOption[]>()
|
const complainantoptionsMain = ref<DataOption[]>()
|
||||||
const complainantoptions = ref<DataOption[]>()
|
const complainantoptions = ref<DataOption[]>()
|
||||||
const agencytoptionsMain = ref<DataOption[]>()
|
const agencytoptionsMain = ref<DataOption[]>()
|
||||||
const agencytoptions = ref<DataOption[]>()
|
const agencytoptions = ref<DataOption[]>()
|
||||||
const optionListNameMain = ref<DataOption[]>([])
|
const optionListNameMain = ref<DataOption[]>([])
|
||||||
const optionListName = ref<DataOption[]>([])
|
const optionListName = ref<DataOption[]>([])
|
||||||
function fectOptioin(complainantoptions: any, agencytoptions: any) {
|
function fetchOptioin(complainantoptions: any, agencytoptions: any) {
|
||||||
complainantoptionsMain.value = complainantoptions
|
complainantoptionsMain.value = complainantoptions
|
||||||
agencytoptionsMain.value = agencytoptions
|
agencytoptionsMain.value = agencytoptions
|
||||||
}
|
}
|
||||||
|
|
@ -37,7 +33,7 @@ export const useComplainstDataStore = defineStore("DisciplineComplainst", () =>
|
||||||
optionListNameMain.value = list
|
optionListNameMain.value = list
|
||||||
optionListName.value = list
|
optionListName.value = list
|
||||||
}
|
}
|
||||||
function filterSelector(val: any, update: Function, type: string) {
|
function filterSelector(val: string, update: Function, type: string) {
|
||||||
update(() => {
|
update(() => {
|
||||||
if (type === "filtercomplainantType" && complainantoptionsMain.value) {
|
if (type === "filtercomplainantType" && complainantoptionsMain.value) {
|
||||||
complainantoptions.value = complainantoptionsMain.value.filter(
|
complainantoptions.value = complainantoptionsMain.value.filter(
|
||||||
|
|
@ -58,10 +54,10 @@ export const useComplainstDataStore = defineStore("DisciplineComplainst", () =>
|
||||||
return {
|
return {
|
||||||
rows,
|
rows,
|
||||||
optionListName,
|
optionListName,
|
||||||
fectComplainst,
|
fetchComplainst,
|
||||||
selectComplainantTpye,
|
selectComplainantTpye,
|
||||||
filterSelector,
|
filterSelector,
|
||||||
fectOptioin,
|
fetchOptioin,
|
||||||
complainantoptions,
|
complainantoptions,
|
||||||
agencytoptions,
|
agencytoptions,
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,12 @@
|
||||||
import { defineStore } from "pinia";
|
import { defineStore } from "pinia";
|
||||||
import { ref } from "vue";
|
import { ref } from "vue";
|
||||||
|
|
||||||
|
import type { DataList } from "@/modules/11_discipline/interface/response/order"
|
||||||
|
|
||||||
export const useOrderStore = defineStore("DisciplineOrder", () => {
|
export const useOrderStore = defineStore("DisciplineOrder", () => {
|
||||||
const rows = ref<any>([])
|
const rows = ref<DataList[]>([])
|
||||||
async function fecthOrder(data: any) {
|
async function fetchOrder(data: DataList[]) {
|
||||||
let datalist = data.map((e: any) => ({
|
let datalist = data.map((e: DataList) => ({
|
||||||
subject: e.subject,
|
subject: e.subject,
|
||||||
ordernumber: e.ordernumber,
|
ordernumber: e.ordernumber,
|
||||||
dateOrder: e.dateOrder,
|
dateOrder: e.dateOrder,
|
||||||
|
|
@ -19,6 +21,6 @@ export const useOrderStore = defineStore("DisciplineOrder", () => {
|
||||||
|
|
||||||
return {
|
return {
|
||||||
rows,
|
rows,
|
||||||
fecthOrder
|
fetchOrder
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
Loading…
Add table
Add a link
Reference in a new issue