ปรับ Layout สืบสวนข้อเท็จจริง,สอบสวนความผิดทางวินัย
This commit is contained in:
Tanyalak
parent
7716b459ac
commit
960f996ebc
7 changed files with 577 additions and 505 deletions
|
|
@ -117,341 +117,340 @@ watch(props.data, async () => {
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<q-card flat bordered class="col-12 q-mt-sm">
|
<q-card flat bordered class="col-12 q-mt-sm">
|
||||||
<div class="q-pa-md">
|
|
||||||
<form @submit.prevent="validateForm">
|
<form @submit.prevent="validateForm">
|
||||||
<div class="row col-12">
|
<div class="q-pa-md">
|
||||||
<div class="col-12 row bg-white q-col-gutter-md">
|
<div class="col-xs-12 row items-center q-col-gutter-md">
|
||||||
<div class="col-xs-12 row items-center">
|
<div class="col-12">
|
||||||
<div class="col-12">
|
<q-input
|
||||||
<q-input
|
for="#complaint"
|
||||||
for="#complaint"
|
class="full-width inputgreen cursor-pointer"
|
||||||
class="full-width inputgreen cursor-pointer"
|
ref="complaintRef"
|
||||||
ref="complaintRef"
|
outlined
|
||||||
outlined
|
dense
|
||||||
dense
|
lazy-rules
|
||||||
lazy-rules
|
borderless
|
||||||
borderless
|
v-model="formData.complaint"
|
||||||
v-model="formData.complaint"
|
:rules="[(val) => !!val || `${'กรุณากรอกเรื่องร้องเรียน'}`]"
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกเรื่องร้องเรียน'}`]"
|
hide-bottom-space
|
||||||
hide-bottom-space
|
:label="`${'เรื่องร้องเรียน'}`"
|
||||||
:label="`${'เรื่องร้องเรียน'}`"
|
type="textarea"
|
||||||
type="textarea"
|
/>
|
||||||
/>
|
</div>
|
||||||
</div>
|
<div class="col-6">
|
||||||
<div class="row no-wrap col-12">
|
<q-select
|
||||||
<div class="col-4 q-my-md q-mr-xs">
|
for="#fault"
|
||||||
<q-select
|
outlined
|
||||||
for="#fault"
|
dense
|
||||||
outlined
|
ref="faultRef"
|
||||||
dense
|
v-model="formData.fault"
|
||||||
ref="faultRef"
|
:rules="[(val) => !!val || `${'กรุณาเลือกลักษณะความผิด'}`]"
|
||||||
v-model="formData.fault"
|
:options="investigateFactStore.faultOp"
|
||||||
:rules="[(val) => !!val || `${'กรุณาเลือกลักษณะความผิด'}`]"
|
label="ลักษณะความผิด"
|
||||||
:options="investigateFactStore.faultOp"
|
emit-value
|
||||||
label="ลักษณะความผิด"
|
map-options
|
||||||
emit-value
|
option-label="name"
|
||||||
map-options
|
option-value="id"
|
||||||
option-label="name"
|
hide-bottom-space
|
||||||
option-value="id"
|
use-input
|
||||||
use-input
|
@filter="(inputValue: any,
|
||||||
@filter="(inputValue: any,
|
doneFn: Function) => filterFnOptionsType(inputValue, doneFn, 'faultOp'
|
||||||
doneFn: Function) => filterFnOptionsType(inputValue, doneFn, 'faultOp'
|
)"
|
||||||
)"
|
><template v-slot:no-option>
|
||||||
><template v-slot:no-option>
|
<q-item>
|
||||||
<q-item>
|
<q-item-section class="text-grey">
|
||||||
<q-item-section class="text-grey">
|
ไม่มีข้อมูล
|
||||||
ไม่มีข้อมูล
|
</q-item-section>
|
||||||
</q-item-section>
|
</q-item>
|
||||||
</q-item>
|
</template>
|
||||||
</template>
|
</q-select>
|
||||||
</q-select>
|
</div>
|
||||||
</div>
|
<div class="col-6">
|
||||||
<div class="col-4 q-my-md q-mr-xs">
|
<q-select
|
||||||
<q-select
|
for="#investigation"
|
||||||
for="#investigation"
|
outlined
|
||||||
outlined
|
dense
|
||||||
dense
|
ref="investigationRef"
|
||||||
ref="investigationRef"
|
:rules="[
|
||||||
:rules="[
|
(val) => !!val || `${'กรุณาเลือกลักษณะการสืบสวน'}`,
|
||||||
(val) => !!val || `${'กรุณาเลือกลักษณะการสืบสวน'}`,
|
]"
|
||||||
]"
|
v-model="formData.investigation"
|
||||||
v-model="formData.investigation"
|
:options="investigateFactStore.investigationOp"
|
||||||
:options="investigateFactStore.investigationOp"
|
label="ลักษณะการสืบสวน"
|
||||||
label="ลักษณะการสืบสวน"
|
emit-value
|
||||||
emit-value
|
map-options
|
||||||
map-options
|
option-label="name"
|
||||||
option-label="name"
|
option-value="id"
|
||||||
option-value="id"
|
hide-bottom-space
|
||||||
use-input
|
use-input
|
||||||
@filter="(inputValue: any,
|
@filter="(inputValue: any,
|
||||||
doneFn: Function) => filterFnOptionsType(inputValue, doneFn, 'investigationOp'
|
doneFn: Function) => filterFnOptionsType(inputValue, doneFn, 'investigationOp'
|
||||||
)"
|
)"
|
||||||
><template v-slot:no-option>
|
><template v-slot:no-option>
|
||||||
<q-item>
|
<q-item>
|
||||||
<q-item-section class="text-grey">
|
<q-item-section class="text-grey">
|
||||||
ไม่มีข้อมูล
|
ไม่มีข้อมูล
|
||||||
</q-item-section>
|
</q-item-section>
|
||||||
</q-item>
|
</q-item>
|
||||||
</template>
|
</template>
|
||||||
</q-select>
|
</q-select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div
|
||||||
<div
|
v-if="formData.investigation === '003'"
|
||||||
v-if="formData.investigation === '003'"
|
class="col-12"
|
||||||
class="col-12 q-mb-md"
|
>
|
||||||
|
<q-input
|
||||||
|
for="#other"
|
||||||
|
class="full-width inputgreen cursor-pointer"
|
||||||
|
outlined
|
||||||
|
ref="otherRef"
|
||||||
|
dense
|
||||||
|
borderless
|
||||||
|
v-model="formData.other"
|
||||||
|
hide-bottom-space
|
||||||
|
:label="`${'รายการอื่นๆ(โปรดระบุ)'}`"
|
||||||
|
type="textarea"
|
||||||
|
:rules="[
|
||||||
|
(val) =>
|
||||||
|
formData.investigation === '003'
|
||||||
|
? !!val || 'กรุณาเลือกจำนวนวันที่ต้องการขยาย'
|
||||||
|
: true,
|
||||||
|
]"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="row col-12">
|
||||||
|
<q-card bordered class="row col-12" style="border:1px solid #d6dee1;">
|
||||||
|
<div class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md">
|
||||||
|
วันที่สืบสวน
|
||||||
|
<q-checkbox
|
||||||
|
for="#clickTime"
|
||||||
|
size="md"
|
||||||
|
v-model="formData.clickTime"
|
||||||
|
label="ขยายเวลา"
|
||||||
|
color="primary"
|
||||||
|
class="text-weight-medium q-ml-sm"
|
||||||
|
keep-color
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-12"><q-separator /></div>
|
||||||
|
<div class="col-xs-12 col-sm-12 q-pa-sm row">
|
||||||
|
<div v-if="formData.clickTime !== true" class="q-col-gutter-sm row">
|
||||||
|
<datepicker
|
||||||
|
menu-class-name="modalfix"
|
||||||
|
v-model="formData.date"
|
||||||
|
:locale="'th'"
|
||||||
|
autoApply
|
||||||
|
:enableTimePicker="false"
|
||||||
|
week-start="0"
|
||||||
|
>
|
||||||
|
<template #year="{ year }">{{ year + 543 }}</template>
|
||||||
|
<template #year-overlay-value="{ value }">{{
|
||||||
|
parseInt(value + 543)
|
||||||
|
}}</template>
|
||||||
|
<template #trigger>
|
||||||
|
<q-input
|
||||||
|
for="#date"
|
||||||
|
class="full-width inputgreen cursor-pointer"
|
||||||
|
ref="dateRef"
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
lazy-rules
|
||||||
|
borderless
|
||||||
|
hide-bottom-space
|
||||||
|
:model-value="
|
||||||
|
formData.date ? date2Thai(formData.date) : null
|
||||||
|
"
|
||||||
|
:rules="[
|
||||||
|
(val) =>
|
||||||
|
!!val || `${'กรุณาเลือกวันที่เริ่มการสอบสวน'}`,
|
||||||
|
]"
|
||||||
|
:label="`${'วันที่เริ่มการสอบสวน'}`"
|
||||||
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<q-icon
|
||||||
|
name="event"
|
||||||
|
class="cursor-pointer"
|
||||||
|
color="primary"
|
||||||
|
>
|
||||||
|
</q-icon>
|
||||||
|
</template>
|
||||||
|
</q-input>
|
||||||
|
</template>
|
||||||
|
</datepicker>
|
||||||
|
<datepicker
|
||||||
|
menu-class-name="modalfix"
|
||||||
|
v-model="formData.dateEnd"
|
||||||
|
:locale="'th'"
|
||||||
|
autoApply
|
||||||
|
:enableTimePicker="false"
|
||||||
|
week-start="0"
|
||||||
|
>
|
||||||
|
<template #year="{ year }">{{ year + 543 }}</template>
|
||||||
|
<template #year-overlay-value="{ value }">{{
|
||||||
|
parseInt(value + 543)
|
||||||
|
}}</template>
|
||||||
|
<template #trigger>
|
||||||
|
<q-input
|
||||||
|
for="#dateEnd"
|
||||||
|
ref="dateEndRef"
|
||||||
|
class="full-width inputgreen cursor-pointer"
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
lazy-rules
|
||||||
|
hide-bottom-space
|
||||||
|
borderless
|
||||||
|
:model-value="
|
||||||
|
formData.dateEnd
|
||||||
|
? date2Thai(formData.dateEnd)
|
||||||
|
: null
|
||||||
|
"
|
||||||
|
:rules="[
|
||||||
|
(val) =>
|
||||||
|
!!val || `${'กรุณาเลือกวันที่สิ้นสุดการสอบสวน'}`,
|
||||||
|
]"
|
||||||
|
:label="`${'วันที่สิ้นสุดการสอบสวน'}`"
|
||||||
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<q-icon
|
||||||
|
name="event"
|
||||||
|
class="cursor-pointer"
|
||||||
|
color="primary"
|
||||||
|
>
|
||||||
|
</q-icon>
|
||||||
|
</template>
|
||||||
|
</q-input>
|
||||||
|
</template>
|
||||||
|
</datepicker>
|
||||||
|
</div>
|
||||||
|
<div v-else class="q-mx-xs col-xs-12 col-sm-6">
|
||||||
|
<q-select
|
||||||
|
for="#daysExtend"
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
lazy-rules
|
||||||
|
ref="daysExtendRef"
|
||||||
|
v-model="formData.daysExtend"
|
||||||
|
:options="investigateFactStore.daysExtendOp"
|
||||||
|
label="จำนวนวันที่ต้องการขยาย"
|
||||||
|
emit-value
|
||||||
|
hide-bottom-space
|
||||||
|
map-options
|
||||||
|
:rules="[
|
||||||
|
(val) =>
|
||||||
|
formData.clickTime === true
|
||||||
|
? !!val || 'กรุณาเลือกจำนวนวันที่ต้องการขยาย'
|
||||||
|
: true,
|
||||||
|
]"
|
||||||
|
option-label="name"
|
||||||
|
option-value="id"
|
||||||
|
use-input
|
||||||
|
@filter="(inputValue: any,
|
||||||
|
doneFn: Function) => filterFnOptionsType(inputValue, doneFn, 'daysExtendOp'
|
||||||
|
)"
|
||||||
|
><template v-slot:no-option>
|
||||||
|
<q-item>
|
||||||
|
<q-item-section class="text-grey">
|
||||||
|
ไม่มีข้อมูล
|
||||||
|
</q-item-section>
|
||||||
|
</q-item>
|
||||||
|
</template>
|
||||||
|
</q-select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</q-card>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 ">
|
||||||
|
<q-input
|
||||||
|
for="#complaintdetail"
|
||||||
|
class="full-width inputgreen cursor-pointer"
|
||||||
|
outlined
|
||||||
|
ref="complaintdetailRef"
|
||||||
|
dense
|
||||||
|
lazy-rules
|
||||||
|
borderless
|
||||||
|
v-model="formData.complaintdetail"
|
||||||
|
:rules="[
|
||||||
|
(val) => !!val || `${'กรุณากรอกรายละเอียดเรื่องร้องเรียน'}`,
|
||||||
|
]"
|
||||||
|
hide-bottom-space
|
||||||
|
:label="`${'รายละเอียดเรื่องร้องเรียน'}`"
|
||||||
|
type="textarea"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-12">
|
||||||
|
<q-file
|
||||||
|
for="#fileComplaint"
|
||||||
|
outlined
|
||||||
|
ref="fileComplaintRef"
|
||||||
|
dense
|
||||||
|
v-model="formData.fileComplaint"
|
||||||
|
label="ไฟล์เอกสารหลักฐานเรื่องร้องเรียน"
|
||||||
|
lazy-rules
|
||||||
|
:rules="[(val) => !!val || 'กรุณาเลือกไฟล์หลักฐานการรับ']"
|
||||||
|
hide-bottom-space
|
||||||
>
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<q-icon name="attach_file" color="primary" />
|
||||||
|
</template>
|
||||||
|
</q-file>
|
||||||
|
</div>
|
||||||
|
<div class="col-12">
|
||||||
|
<q-input
|
||||||
|
for="#detail"
|
||||||
|
class="full-width inputgreen cursor-pointer"
|
||||||
|
outlined
|
||||||
|
ref="detailRef"
|
||||||
|
dense
|
||||||
|
lazy-rules
|
||||||
|
borderless
|
||||||
|
v-model="formData.detail"
|
||||||
|
:rules="[(val) => !!val || `${'กรุณากรอกรายละเอียด'}`]"
|
||||||
|
hide-bottom-space
|
||||||
|
:label="`${'รายละเอียด'}`"
|
||||||
|
type="textarea"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-12">
|
||||||
|
<q-file
|
||||||
|
for="#evidenceFiles"
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
ref="evidenceFilesRef"
|
||||||
|
v-model="formData.evidenceFiles"
|
||||||
|
label="ไฟล์หลักฐานการรับ"
|
||||||
|
lazy-rules
|
||||||
|
:rules="[(val) => !!val || 'กรุณาเลือกไฟล์หลักฐานการรับ']"
|
||||||
|
hide-bottom-space
|
||||||
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<q-icon name="attach_file" color="primary" />
|
||||||
|
</template>
|
||||||
|
</q-file>
|
||||||
|
</div>
|
||||||
|
<div class="row col-12 items-start">
|
||||||
|
<div class="col-4">
|
||||||
<q-input
|
<q-input
|
||||||
for="#other"
|
for="#results"
|
||||||
class="full-width inputgreen cursor-pointer"
|
standout
|
||||||
outlined
|
|
||||||
ref="otherRef"
|
|
||||||
dense
|
dense
|
||||||
borderless
|
ref="resultsRef"
|
||||||
v-model="formData.other"
|
:rules="[(val) => !!val || `${'กรุณากรอกผลการสืบสวน'}`]"
|
||||||
|
v-model="formData.results"
|
||||||
|
outlined
|
||||||
|
debounce="300"
|
||||||
|
placeholder="ผลการสืบสวน"
|
||||||
hide-bottom-space
|
hide-bottom-space
|
||||||
:label="`${'รายการอื่นๆ(โปรดระบุ)'}`"
|
|
||||||
type="textarea"
|
|
||||||
:rules="[
|
|
||||||
(val) =>
|
|
||||||
formData.investigation === '003'
|
|
||||||
? !!val || 'กรุณาเลือกจำนวนวันที่ต้องการขยาย'
|
|
||||||
: true,
|
|
||||||
]"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row items-start col-12">
|
|
||||||
<p
|
|
||||||
class="text-weight-medium q-ma-none text-center align-top q-pt-sm"
|
|
||||||
>
|
>
|
||||||
วันที่สืบสวน
|
</q-input>
|
||||||
</p>
|
</div>
|
||||||
<q-checkbox
|
<div class="col-4">
|
||||||
for="#clickTime"
|
<q-btn
|
||||||
size="md"
|
id="#confirm"
|
||||||
v-model="formData.clickTime"
|
label="ยืนยันผลการสืบสวน"
|
||||||
label="ขยายเวลา"
|
|
||||||
color="primary"
|
color="primary"
|
||||||
class="text-weight-medium q-ml-sm"
|
class="q-py-sm q-ml-sm"
|
||||||
keep-color
|
|
||||||
/>
|
|
||||||
<div v-if="formData.clickTime !== true" class="self-start row">
|
|
||||||
<div class="q-mx-xs">
|
|
||||||
<datepicker
|
|
||||||
menu-class-name="modalfix"
|
|
||||||
v-model="formData.date"
|
|
||||||
:locale="'th'"
|
|
||||||
autoApply
|
|
||||||
:enableTimePicker="false"
|
|
||||||
week-start="0"
|
|
||||||
>
|
|
||||||
<template #year="{ year }">{{ year + 543 }}</template>
|
|
||||||
<template #year-overlay-value="{ value }">{{
|
|
||||||
parseInt(value + 543)
|
|
||||||
}}</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
for="#date"
|
|
||||||
class="full-width inputgreen cursor-pointer"
|
|
||||||
ref="dateRef"
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
borderless
|
|
||||||
:model-value="
|
|
||||||
formData.date ? date2Thai(formData.date) : null
|
|
||||||
"
|
|
||||||
:rules="[
|
|
||||||
(val) =>
|
|
||||||
!!val || `${'กรุณาเลือกวันที่เริ่มการสอบสวน'}`,
|
|
||||||
]"
|
|
||||||
:label="`${'วันที่เริ่มการสอบสวน'}`"
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
name="event"
|
|
||||||
class="cursor-pointer"
|
|
||||||
color="primary"
|
|
||||||
>
|
|
||||||
</q-icon>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</datepicker>
|
|
||||||
</div>
|
|
||||||
<div class="q-mx-xs q-">
|
|
||||||
<datepicker
|
|
||||||
menu-class-name="modalfix"
|
|
||||||
v-model="formData.dateEnd"
|
|
||||||
:locale="'th'"
|
|
||||||
autoApply
|
|
||||||
:enableTimePicker="false"
|
|
||||||
week-start="0"
|
|
||||||
>
|
|
||||||
<template #year="{ year }">{{ year + 543 }}</template>
|
|
||||||
<template #year-overlay-value="{ value }">{{
|
|
||||||
parseInt(value + 543)
|
|
||||||
}}</template>
|
|
||||||
<template #trigger>
|
|
||||||
<q-input
|
|
||||||
for="#dateEnd"
|
|
||||||
ref="dateEndRef"
|
|
||||||
class="full-width inputgreen cursor-pointer"
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
borderless
|
|
||||||
:model-value="
|
|
||||||
formData.dateEnd
|
|
||||||
? date2Thai(formData.dateEnd)
|
|
||||||
: null
|
|
||||||
"
|
|
||||||
:rules="[
|
|
||||||
(val) =>
|
|
||||||
!!val || `${'กรุณาเลือกวันที่สิ้นสุดการสอบสวน'}`,
|
|
||||||
]"
|
|
||||||
:label="`${'วันที่สิ้นสุดการสอบสวน'}`"
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon
|
|
||||||
name="event"
|
|
||||||
class="cursor-pointer"
|
|
||||||
color="primary"
|
|
||||||
>
|
|
||||||
</q-icon>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</template>
|
|
||||||
</datepicker>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-else class="q-mx-xs">
|
|
||||||
<q-select
|
|
||||||
for="#daysExtend"
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
ref="daysExtendRef"
|
|
||||||
v-model="formData.daysExtend"
|
|
||||||
:options="investigateFactStore.daysExtendOp"
|
|
||||||
label="จำนวนวันที่ต้องการขยาย"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
:rules="[
|
|
||||||
(val) =>
|
|
||||||
formData.clickTime === true
|
|
||||||
? !!val || 'กรุณาเลือกจำนวนวันที่ต้องการขยาย'
|
|
||||||
: true,
|
|
||||||
]"
|
|
||||||
option-label="name"
|
|
||||||
option-value="id"
|
|
||||||
use-input
|
|
||||||
@filter="(inputValue: any,
|
|
||||||
doneFn: Function) => filterFnOptionsType(inputValue, doneFn, 'daysExtendOp'
|
|
||||||
)"
|
|
||||||
><template v-slot:no-option>
|
|
||||||
<q-item>
|
|
||||||
<q-item-section class="text-grey">
|
|
||||||
ไม่มีข้อมูล
|
|
||||||
</q-item-section>
|
|
||||||
</q-item>
|
|
||||||
</template>
|
|
||||||
</q-select>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 q-my-xs">
|
|
||||||
<q-input
|
|
||||||
for="#complaintdetail"
|
|
||||||
class="full-width inputgreen cursor-pointer"
|
|
||||||
outlined
|
|
||||||
ref="complaintdetailRef"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
borderless
|
|
||||||
v-model="formData.complaintdetail"
|
|
||||||
:rules="[
|
|
||||||
(val) => !!val || `${'กรุณากรอกรายละเอียดเรื่องร้องเรียน'}`,
|
|
||||||
]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'รายละเอียดเรื่องร้องเรียน'}`"
|
|
||||||
type="textarea"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 q-my-sm">
|
|
||||||
<q-file
|
|
||||||
for="#fileComplaint"
|
|
||||||
outlined
|
|
||||||
ref="fileComplaintRef"
|
|
||||||
dense
|
|
||||||
v-model="formData.fileComplaint"
|
|
||||||
label="ไฟล์เอกสารหลักฐานเรื่องร้องเรียน"
|
|
||||||
lazy-rules
|
|
||||||
:rules="[(val) => !!val || 'กรุณาเลือกไฟล์หลักฐานการรับ']"
|
|
||||||
hide-bottom-space
|
|
||||||
>
|
>
|
||||||
<template v-slot:prepend>
|
<q-tooltip>ยืนยันผลการสืบสวน</q-tooltip>
|
||||||
<q-icon name="attach_file" color="primary" />
|
</q-btn>
|
||||||
</template>
|
|
||||||
</q-file>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 q-my-sm">
|
|
||||||
<q-input
|
|
||||||
for="#detail"
|
|
||||||
class="full-width inputgreen cursor-pointer"
|
|
||||||
outlined
|
|
||||||
ref="detailRef"
|
|
||||||
dense
|
|
||||||
lazy-rules
|
|
||||||
borderless
|
|
||||||
v-model="formData.detail"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกรายละเอียด'}`]"
|
|
||||||
hide-bottom-space
|
|
||||||
:label="`${'รายละเอียด'}`"
|
|
||||||
type="textarea"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 q-my-xs">
|
|
||||||
<q-file
|
|
||||||
for="#evidenceFiles"
|
|
||||||
outlined
|
|
||||||
dense
|
|
||||||
ref="evidenceFilesRef"
|
|
||||||
v-model="formData.evidenceFiles"
|
|
||||||
label="ไฟล์หลักฐานการรับ"
|
|
||||||
lazy-rules
|
|
||||||
:rules="[(val) => !!val || 'กรุณาเลือกไฟล์หลักฐานการรับ']"
|
|
||||||
hide-bottom-space
|
|
||||||
>
|
|
||||||
<template v-slot:prepend>
|
|
||||||
<q-icon name="attach_file" color="primary" />
|
|
||||||
</template>
|
|
||||||
</q-file>
|
|
||||||
</div>
|
|
||||||
<div class="row col-12 items-start q-mt-sm">
|
|
||||||
<div class="col-4">
|
|
||||||
<q-input
|
|
||||||
for="#results"
|
|
||||||
standout
|
|
||||||
dense
|
|
||||||
ref="resultsRef"
|
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกผลการสืบสวน'}`]"
|
|
||||||
v-model="formData.results"
|
|
||||||
outlined
|
|
||||||
debounce="300"
|
|
||||||
placeholder="ผลการสืบสวน"
|
|
||||||
>
|
|
||||||
</q-input>
|
|
||||||
</div>
|
|
||||||
<div class="col-4">
|
|
||||||
<q-btn
|
|
||||||
id="#confirm"
|
|
||||||
label="ยืนยันผลการสืบสวน"
|
|
||||||
color="public"
|
|
||||||
class="q-py-sm q-ml-sm"
|
|
||||||
>
|
|
||||||
<q-tooltip>ยืนยันผลการสืบสวน</q-tooltip>
|
|
||||||
</q-btn>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -464,6 +463,5 @@ watch(props.data, async () => {
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
|
||||||
</q-card>
|
</q-card>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -22,6 +22,7 @@ const visibleColumns2 = ref<string[]>([
|
||||||
"duty",
|
"duty",
|
||||||
"email",
|
"email",
|
||||||
"telephone",
|
"telephone",
|
||||||
|
"role"
|
||||||
]);
|
]);
|
||||||
const columns2 = ref<QTableProps["columns"]>([
|
const columns2 = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
|
|
@ -90,6 +91,17 @@ const columns2 = ref<QTableProps["columns"]>([
|
||||||
sort: (a: string, b: string) =>
|
sort: (a: string, b: string) =>
|
||||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: "role",
|
||||||
|
align: "left",
|
||||||
|
label: "จำนวนเรื่องสืบสวน",
|
||||||
|
sortable: true,
|
||||||
|
field: "role",
|
||||||
|
headerStyle: "font-size: 14px",
|
||||||
|
style: "font-size: 14px",
|
||||||
|
sort: (a: string, b: string) =>
|
||||||
|
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||||
|
},
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
|
|
@ -138,35 +150,28 @@ watchEffect(() => {
|
||||||
<q-card style="width: 1200px; max-width: 80vw">
|
<q-card style="width: 1200px; max-width: 80vw">
|
||||||
<DialogHeader title="เลือกรายชื่อกรรมการ" :close="clickClose" />
|
<DialogHeader title="เลือกรายชื่อกรรมการ" :close="clickClose" />
|
||||||
<q-separator />
|
<q-separator />
|
||||||
<q-card-section class="q-pt-none">
|
<q-card-section >
|
||||||
<div>
|
<q-input
|
||||||
<div>
|
borderless
|
||||||
<q-toolbar style="padding: 0">
|
outlined
|
||||||
<q-input
|
dense
|
||||||
borderless
|
class="col-12 q-mb-sm"
|
||||||
outlined
|
debounce="300"
|
||||||
dense
|
:model-value="filterKeyword2"
|
||||||
class="col-12"
|
@update:model-value="updateInput"
|
||||||
debounce="300"
|
placeholder="ค้นหารายชื่อ"
|
||||||
:model-value="filterKeyword2"
|
style="max-width: 100%"
|
||||||
@update:model-value="updateInput"
|
>
|
||||||
placeholder="ค้นหารายชื่อ"
|
<template v-slot:append>
|
||||||
style="max-width: 100%"
|
<q-icon v-if="filterKeyword2 == ''" name="search" />
|
||||||
>
|
<q-icon
|
||||||
<template v-slot:append>
|
v-if="filterKeyword2 !== ''"
|
||||||
<q-icon v-if="filterKeyword2 == ''" name="search" />
|
name="clear"
|
||||||
<q-icon
|
class="cursor-pointer"
|
||||||
v-if="filterKeyword2 !== ''"
|
@click="Reset"
|
||||||
name="clear"
|
/>
|
||||||
class="cursor-pointer"
|
</template>
|
||||||
@click="Reset"
|
</q-input>
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</q-input>
|
|
||||||
</q-toolbar>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<d-table
|
<d-table
|
||||||
:columns="columns2"
|
:columns="columns2"
|
||||||
:rows="rows2"
|
:rows="rows2"
|
||||||
|
|
@ -208,6 +213,8 @@ watchEffect(() => {
|
||||||
</d-table>
|
</d-table>
|
||||||
</q-card-section>
|
</q-card-section>
|
||||||
|
|
||||||
|
<q-separator />
|
||||||
|
|
||||||
<q-card-actions align="right" class="bg-white text-teal">
|
<q-card-actions align="right" class="bg-white text-teal">
|
||||||
<q-btn
|
<q-btn
|
||||||
label="เพิ่มรายชื่อกรรมการ"
|
label="เพิ่มรายชื่อกรรมการ"
|
||||||
|
|
|
||||||
|
|
@ -30,6 +30,7 @@ onMounted(async () => {
|
||||||
duty: "ประธาน",
|
duty: "ประธาน",
|
||||||
email: "e@email.com",
|
email: "e@email.com",
|
||||||
telephone: "0800808080",
|
telephone: "0800808080",
|
||||||
|
role: "4",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
nameDirector: "นาย สรวิชญ์ พลสิทธิ์",
|
nameDirector: "นาย สรวิชญ์ พลสิทธิ์",
|
||||||
|
|
@ -37,6 +38,7 @@ onMounted(async () => {
|
||||||
duty: "เลขานุการ",
|
duty: "เลขานุการ",
|
||||||
email: "g@gmail.com",
|
email: "g@gmail.com",
|
||||||
telephone: "0614565145",
|
telephone: "0614565145",
|
||||||
|
role: "6",
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
await hideLoader();
|
await hideLoader();
|
||||||
|
|
@ -213,10 +215,8 @@ watch(props.data, async () => {
|
||||||
<form @submit.prevent="validateForm">
|
<form @submit.prevent="validateForm">
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<q-card bordered>
|
<q-card bordered>
|
||||||
<div class="col-12 row q-col-gutter-md q-pa-md">
|
<div class="col-12 row q-pa-md">
|
||||||
<div class="col-xs-12 col-sm-12 row">
|
<div class="col-12 row q-col-gutter-md">
|
||||||
<q-separator />
|
|
||||||
<div class="col-12 row q-pa-sm q-col-gutter-sm">
|
|
||||||
<q-input
|
<q-input
|
||||||
class="col-12"
|
class="col-12"
|
||||||
dense
|
dense
|
||||||
|
|
@ -225,6 +225,7 @@ watch(props.data, async () => {
|
||||||
for="#Complaint"
|
for="#Complaint"
|
||||||
ref="complaintRef"
|
ref="complaintRef"
|
||||||
label="เรื่องร้องเรียน"
|
label="เรื่องร้องเรียน"
|
||||||
|
hide-bottom-space
|
||||||
type="textarea"
|
type="textarea"
|
||||||
:rules="[(val:string) => !!val || `${'กรุณากรอกเรื่องร้องเรียน'}`]"
|
:rules="[(val:string) => !!val || `${'กรุณากรอกเรื่องร้องเรียน'}`]"
|
||||||
/>
|
/>
|
||||||
|
|
@ -251,6 +252,7 @@ watch(props.data, async () => {
|
||||||
outlined
|
outlined
|
||||||
dense
|
dense
|
||||||
class="full-width datepicker"
|
class="full-width datepicker"
|
||||||
|
hide-bottom-space
|
||||||
:model-value="
|
:model-value="
|
||||||
dateInvestigate != null
|
dateInvestigate != null
|
||||||
? date2Thai(dateInvestigate)
|
? date2Thai(dateInvestigate)
|
||||||
|
|
@ -293,6 +295,7 @@ watch(props.data, async () => {
|
||||||
outlined
|
outlined
|
||||||
dense
|
dense
|
||||||
class="col-xs-12 col-sm-4"
|
class="col-xs-12 col-sm-4"
|
||||||
|
hide-bottom-space
|
||||||
:model-value="
|
:model-value="
|
||||||
dateAllegation != null
|
dateAllegation != null
|
||||||
? date2Thai(dateAllegation)
|
? date2Thai(dateAllegation)
|
||||||
|
|
@ -338,6 +341,7 @@ watch(props.data, async () => {
|
||||||
outlined
|
outlined
|
||||||
dense
|
dense
|
||||||
class="full-width datepicker"
|
class="full-width datepicker"
|
||||||
|
hide-bottom-space
|
||||||
:model-value="
|
:model-value="
|
||||||
dateEvident != null ? date2Thai(dateEvident) : null
|
dateEvident != null ? date2Thai(dateEvident) : null
|
||||||
"
|
"
|
||||||
|
|
@ -358,65 +362,70 @@ watch(props.data, async () => {
|
||||||
</q-input>
|
</q-input>
|
||||||
</template>
|
</template>
|
||||||
</datepicker>
|
</datepicker>
|
||||||
<div class="col-xs-12 col-sm-12 text-bold">
|
<div class="row col-12">
|
||||||
กรรมการ
|
<q-card bordered class="row col-12" style="border:1px solid #d6dee1;">
|
||||||
<q-btn
|
<div class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md">
|
||||||
size="12px"
|
กรรมการ
|
||||||
flat
|
<q-btn
|
||||||
round
|
size="12px"
|
||||||
color="add"
|
flat
|
||||||
@click="popup()"
|
round
|
||||||
icon="mdi-plus"
|
color="add"
|
||||||
>
|
@click="popup()"
|
||||||
<q-tooltip>เพิ่มกรรมการ</q-tooltip>
|
icon="mdi-plus"
|
||||||
</q-btn>
|
>
|
||||||
|
<q-tooltip>เพิ่มกรรมการ</q-tooltip>
|
||||||
|
</q-btn>
|
||||||
|
</div>
|
||||||
|
<div class="col-12"><q-separator /></div>
|
||||||
|
<div class="col-xs-12 q-pa-sm row">
|
||||||
|
<Table
|
||||||
|
class="col-12"
|
||||||
|
style="max-height: 80vh"
|
||||||
|
:rows="rows"
|
||||||
|
:columns="investigateDis.columnsDirector"
|
||||||
|
:filter="filter"
|
||||||
|
:visible-columns="investigateDis.visibleColumnsDirector"
|
||||||
|
v-model:inputfilter="filter"
|
||||||
|
v-model:inputvisible="investigateDis.visibleColumnsDirector"
|
||||||
|
:pagination="initialPagination"
|
||||||
|
:nornmalData="true"
|
||||||
|
:paging="true"
|
||||||
|
:titleText="''"
|
||||||
|
>
|
||||||
|
<template #columns="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'" class="table_ellipsis2">
|
||||||
|
{{ props.rowIndex + 1 }}
|
||||||
|
</div>
|
||||||
|
<div v-else class="table_ellipsis2">
|
||||||
|
{{ col.value }}
|
||||||
|
</div>
|
||||||
|
</q-td>
|
||||||
|
<q-td>
|
||||||
|
<q-btn
|
||||||
|
dense
|
||||||
|
size="12px"
|
||||||
|
flat
|
||||||
|
round
|
||||||
|
color="red"
|
||||||
|
@click="deleteData(props.row.id)"
|
||||||
|
icon="mdi-delete"
|
||||||
|
>
|
||||||
|
<q-tooltip>ลบข้อมูล</q-tooltip>
|
||||||
|
</q-btn>
|
||||||
|
</q-td>
|
||||||
|
</q-tr>
|
||||||
|
</template>
|
||||||
|
</Table>
|
||||||
|
</div>
|
||||||
|
</q-card>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-xs-12 col-sm-12 q-pb-md">
|
|
||||||
<Table
|
|
||||||
style="max-height: 80vh"
|
|
||||||
:rows="rows"
|
|
||||||
:columns="investigateDis.columnsDirector"
|
|
||||||
:filter="filter"
|
|
||||||
:visible-columns="investigateDis.visibleColumnsDirector"
|
|
||||||
v-model:inputfilter="filter"
|
|
||||||
v-model:inputvisible="investigateDis.visibleColumnsDirector"
|
|
||||||
:pagination="initialPagination"
|
|
||||||
:nornmalData="true"
|
|
||||||
:paging="true"
|
|
||||||
:titleText="''"
|
|
||||||
>
|
|
||||||
<template #columns="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'" class="table_ellipsis2">
|
|
||||||
{{ props.rowIndex + 1 }}
|
|
||||||
</div>
|
|
||||||
<div v-else class="table_ellipsis2">
|
|
||||||
{{ col.value }}
|
|
||||||
</div>
|
|
||||||
</q-td>
|
|
||||||
<q-td>
|
|
||||||
<q-btn
|
|
||||||
dense
|
|
||||||
size="12px"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
color="red"
|
|
||||||
@click="deleteData(props.row.id)"
|
|
||||||
icon="mdi-delete"
|
|
||||||
>
|
|
||||||
<q-tooltip>ลบข้อมูล</q-tooltip>
|
|
||||||
</q-btn>
|
|
||||||
</q-td>
|
|
||||||
</q-tr>
|
|
||||||
</template>
|
|
||||||
</Table>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<q-input
|
<q-input
|
||||||
class="col-xs-12 col-sm-6"
|
class="col-xs-12 col-sm-6"
|
||||||
dense
|
dense
|
||||||
|
|
@ -425,12 +434,14 @@ watch(props.data, async () => {
|
||||||
v-model="formData.casefault"
|
v-model="formData.casefault"
|
||||||
for="#casefault"
|
for="#casefault"
|
||||||
label="กรณีมีความผิด"
|
label="กรณีมีความผิด"
|
||||||
|
hide-bottom-space
|
||||||
:rules="[(val) => !!val || `${'กรุณากรอกกรณีมีความผิด'}`]"
|
:rules="[(val) => !!val || `${'กรุณากรอกกรณีมีความผิด'}`]"
|
||||||
lazy-rules
|
lazy-rules
|
||||||
/>
|
/>
|
||||||
<q-input
|
<q-input
|
||||||
class="col-xs-12 col-sm-6"
|
class="col-xs-12 col-sm-6"
|
||||||
dense
|
dense
|
||||||
|
hide-bottom-space
|
||||||
outlined
|
outlined
|
||||||
for="#whereInvestigate"
|
for="#whereInvestigate"
|
||||||
ref="whereInvestigateRef"
|
ref="whereInvestigateRef"
|
||||||
|
|
@ -450,6 +461,7 @@ watch(props.data, async () => {
|
||||||
option-value="id"
|
option-value="id"
|
||||||
emit-value
|
emit-value
|
||||||
map-options
|
map-options
|
||||||
|
hide-bottom-space
|
||||||
:options="investigateDis.optionsTypefault"
|
:options="investigateDis.optionsTypefault"
|
||||||
label="ลักษณะความผิด"
|
label="ลักษณะความผิด"
|
||||||
/>
|
/>
|
||||||
|
|
@ -464,13 +476,15 @@ watch(props.data, async () => {
|
||||||
option-value="id"
|
option-value="id"
|
||||||
emit-value
|
emit-value
|
||||||
map-options
|
map-options
|
||||||
|
hide-bottom-space
|
||||||
:options="investigateDis.optionsfaultLevel"
|
:options="investigateDis.optionsfaultLevel"
|
||||||
label="ระดับโทษความผิด"
|
label="ระดับโทษความผิด"
|
||||||
/>
|
/>
|
||||||
<q-input
|
<q-input
|
||||||
class="col-xs-12 col-sm-6 q-pb-md"
|
class="col-xs-12 col-sm-6"
|
||||||
dense
|
dense
|
||||||
for="#refLaw"
|
for="#refLaw"
|
||||||
|
hide-bottom-space
|
||||||
outlined
|
outlined
|
||||||
ref="refLawRef"
|
ref="refLawRef"
|
||||||
v-model="formData.refLaw"
|
v-model="formData.refLaw"
|
||||||
|
|
@ -484,6 +498,7 @@ watch(props.data, async () => {
|
||||||
class="col-12"
|
class="col-12"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
|
hide-bottom-space
|
||||||
for="#detailComplaint"
|
for="#detailComplaint"
|
||||||
ref="detailComplaintRef"
|
ref="detailComplaintRef"
|
||||||
v-model="formData.detailComplaint"
|
v-model="formData.detailComplaint"
|
||||||
|
|
@ -495,6 +510,7 @@ watch(props.data, async () => {
|
||||||
class="col-12"
|
class="col-12"
|
||||||
dense
|
dense
|
||||||
outlined
|
outlined
|
||||||
|
hide-bottom-space
|
||||||
for="#trueDetail"
|
for="#trueDetail"
|
||||||
ref="trueDetailRef"
|
ref="trueDetailRef"
|
||||||
v-model="formData.trueDetail"
|
v-model="formData.trueDetail"
|
||||||
|
|
@ -502,90 +518,123 @@ watch(props.data, async () => {
|
||||||
type="textarea"
|
type="textarea"
|
||||||
:rules="[(val:string) => !!val || `${'กรุณากรอกรายละเอียดสืบสวนข้อเท็จจริง'}`]"
|
:rules="[(val:string) => !!val || `${'กรุณากรอกรายละเอียดสืบสวนข้อเท็จจริง'}`]"
|
||||||
/>
|
/>
|
||||||
<q-input
|
<div class="row col-12">
|
||||||
class="col-12"
|
<q-card bordered class="row col-12" style="border:1px solid #d6dee1;">
|
||||||
dense
|
<div class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md">
|
||||||
outlined
|
หลักฐานสนับสนุนข้อกล่าวหา
|
||||||
for="#evidence"
|
</div>
|
||||||
ref="evidenceRef"
|
<div class="col-12"><q-separator /></div>
|
||||||
v-model="formData.evidence"
|
<div class="col-xs-12 q-pa-sm row">
|
||||||
label="สรุปพยานหลักฐานสนับสนุนข้อกล่าวหา"
|
<q-input
|
||||||
type="textarea"
|
class="col-12"
|
||||||
:rules="[(val:string) => !!val || `${'กรุณากรอกสรุปพยานหลักฐานสนับสนุนข้อกล่าวหา'}`]"
|
dense
|
||||||
/>
|
outlined
|
||||||
<q-file
|
for="#evidence"
|
||||||
class="col-12 q-pb-md"
|
ref="evidenceRef"
|
||||||
outlined
|
hide-bottom-space
|
||||||
dense
|
v-model="formData.evidence"
|
||||||
ref="filesEvidenceRef"
|
label="สรุปพยานหลักฐานสนับสนุนข้อกล่าวหา"
|
||||||
for="#filesEvidence"
|
type="textarea"
|
||||||
v-model="formData.filesEvidence"
|
:rules="[(val:string) => !!val || `${'กรุณากรอกสรุปพยานหลักฐานสนับสนุนข้อกล่าวหา'}`]"
|
||||||
@added="fileUploadDoc"
|
/>
|
||||||
label="ไฟล์เอกสารหลักฐานสรุปพยานหลักฐานสนับสนุนข้อกล่าวหา"
|
<q-file
|
||||||
hide-bottom-space
|
class="col-12 q-mt-sm"
|
||||||
lazy-rules
|
outlined
|
||||||
accept=".pdf,.xlsx,.doc"
|
dense
|
||||||
>
|
ref="filesEvidenceRef"
|
||||||
<template v-slot:prepend>
|
for="#filesEvidence"
|
||||||
<q-icon name="attach_file" />
|
v-model="formData.filesEvidence"
|
||||||
</template>
|
@added="fileUploadDoc"
|
||||||
</q-file>
|
label="ไฟล์เอกสารหลักฐานสรุปพยานหลักฐานสนับสนุนข้อกล่าวหา"
|
||||||
<q-input
|
hide-bottom-space
|
||||||
class="col-12"
|
lazy-rules
|
||||||
dense
|
accept=".pdf,.xlsx,.doc"
|
||||||
outlined
|
>
|
||||||
ref="recordAccuserRef"
|
<template v-slot:prepend>
|
||||||
for="#recordAccuser"
|
<q-icon name="attach_file" />
|
||||||
v-model="formData.recordAccuser"
|
</template>
|
||||||
label="บันทึกถ้อยคำของผู้กล่าวหา"
|
</q-file>
|
||||||
type="textarea"
|
</div>
|
||||||
:rules="[(val:string) => !!val || `${'กรุณากรอกบันทึกถ้อยคำของผู้กล่าวหา'}`]"
|
</q-card>
|
||||||
/>
|
</div>
|
||||||
<q-file
|
<div class="row col-12">
|
||||||
class="col-12 q-pb-md"
|
<q-card bordered class="row col-12" style="border:1px solid #d6dee1;">
|
||||||
outlined
|
<div class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md">
|
||||||
dense
|
บันทึกถ้อยคำของผู้กล่าวหา
|
||||||
ref="filesRecordAccuserRef"
|
</div>
|
||||||
for="#filesRecordAccuser"
|
<div class="col-12"><q-separator /></div>
|
||||||
v-model="formData.filesRecordAccuser"
|
<div class="col-xs-12 q-pa-sm row">
|
||||||
@added="fileUploadDoc"
|
<q-input
|
||||||
label="ไฟล์เอกสารบันทึกถ้อยคำของผู้กล่าวหา"
|
class="col-12"
|
||||||
hide-bottom-space
|
dense
|
||||||
lazy-rules
|
outlined
|
||||||
accept=".pdf,.xlsx,.doc"
|
ref="recordAccuserRef"
|
||||||
>
|
for="#recordAccuser"
|
||||||
<template v-slot:prepend>
|
v-model="formData.recordAccuser"
|
||||||
<q-icon name="attach_file" />
|
label="บันทึกถ้อยคำของผู้กล่าวหา"
|
||||||
</template>
|
hide-bottom-space
|
||||||
</q-file>
|
type="textarea"
|
||||||
<q-input
|
:rules="[(val:string) => !!val || `${'กรุณากรอกบันทึกถ้อยคำของผู้กล่าวหา'}`]"
|
||||||
class="col-12"
|
/>
|
||||||
dense
|
<q-file
|
||||||
outlined
|
class="col-12 q-mt-sm"
|
||||||
for="#witnesses"
|
outlined
|
||||||
ref="witnessesRef"
|
dense
|
||||||
v-model="formData.witnesses"
|
ref="filesRecordAccuserRef"
|
||||||
label="พยานและการบันทึกถ้อยคำ"
|
for="#filesRecordAccuser"
|
||||||
type="textarea"
|
v-model="formData.filesRecordAccuser"
|
||||||
:rules="[(val:string) => !!val || `${'กรุณากรอกพยานและการบันทึกถ้อยคำ'}`]"
|
@added="fileUploadDoc"
|
||||||
/>
|
label="ไฟล์เอกสารบันทึกถ้อยคำของผู้กล่าวหา"
|
||||||
<q-file
|
hide-bottom-space
|
||||||
class="col-12 q-pb-md"
|
lazy-rules
|
||||||
outlined
|
accept=".pdf,.xlsx,.doc"
|
||||||
dense
|
>
|
||||||
ref="filesWitnessesRef"
|
<template v-slot:prepend>
|
||||||
for="#filesWitnesses"
|
<q-icon name="attach_file" />
|
||||||
v-model="formData.filesWitnesses"
|
</template>
|
||||||
@added="fileUploadDoc"
|
</q-file>
|
||||||
label="ไฟล์เอกสารพยานและการบันทึกถ้อยคำ"
|
</div>
|
||||||
hide-bottom-space
|
</q-card>
|
||||||
lazy-rules
|
</div>
|
||||||
accept=".pdf,.xlsx,.doc"
|
<div class="row col-12">
|
||||||
>
|
<q-card bordered class="row col-12" style="border:1px solid #d6dee1;">
|
||||||
<template v-slot:prepend>
|
<div class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md">
|
||||||
<q-icon name="attach_file" />
|
พยานและการบันทึกถ้อยคำ
|
||||||
</template>
|
</div>
|
||||||
</q-file>
|
<div class="col-12"><q-separator /></div>
|
||||||
|
<div class="col-xs-12 q-pa-sm row">
|
||||||
|
<q-input
|
||||||
|
class="col-12"
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
for="#witnesses"
|
||||||
|
ref="witnessesRef"
|
||||||
|
v-model="formData.witnesses"
|
||||||
|
label="พยานและการบันทึกถ้อยคำ"
|
||||||
|
hide-bottom-space
|
||||||
|
type="textarea"
|
||||||
|
:rules="[(val:string) => !!val || `${'กรุณากรอกพยานและการบันทึกถ้อยคำ'}`]"
|
||||||
|
/>
|
||||||
|
<q-file
|
||||||
|
class="col-12 q-mt-sm"
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
ref="filesWitnessesRef"
|
||||||
|
for="#filesWitnesses"
|
||||||
|
v-model="formData.filesWitnesses"
|
||||||
|
@added="fileUploadDoc"
|
||||||
|
label="ไฟล์เอกสารพยานและการบันทึกถ้อยคำ"
|
||||||
|
hide-bottom-space
|
||||||
|
lazy-rules
|
||||||
|
accept=".pdf,.xlsx,.doc"
|
||||||
|
>
|
||||||
|
<template v-slot:prepend>
|
||||||
|
<q-icon name="attach_file" />
|
||||||
|
</template>
|
||||||
|
</q-file>
|
||||||
|
</div>
|
||||||
|
</q-card>
|
||||||
|
</div>
|
||||||
<q-input
|
<q-input
|
||||||
class="col-12"
|
class="col-12"
|
||||||
dense
|
dense
|
||||||
|
|
@ -594,6 +643,7 @@ watch(props.data, async () => {
|
||||||
ref="InvestResultsRef"
|
ref="InvestResultsRef"
|
||||||
v-model="formData.InvestResults"
|
v-model="formData.InvestResults"
|
||||||
label="ผลการสอบสวน"
|
label="ผลการสอบสวน"
|
||||||
|
hide-bottom-space
|
||||||
type="textarea"
|
type="textarea"
|
||||||
:rules="[(val:string) => !!val || `${'กรุณากรอกผลการสอบสวน'}`]"
|
:rules="[(val:string) => !!val || `${'กรุณากรอกผลการสอบสวน'}`]"
|
||||||
/>
|
/>
|
||||||
|
|
@ -615,7 +665,6 @@ watch(props.data, async () => {
|
||||||
</template>
|
</template>
|
||||||
</q-file>
|
</q-file>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<q-separator />
|
<q-separator />
|
||||||
<div class="row col-12 q-pa-sm">
|
<div class="row col-12 q-pa-sm">
|
||||||
|
|
|
||||||
|
|
@ -29,6 +29,7 @@ const formData = reactive<FormData>({
|
||||||
position: "",
|
position: "",
|
||||||
phone: "",
|
phone: "",
|
||||||
email: "",
|
email: "",
|
||||||
|
role: "",
|
||||||
});
|
});
|
||||||
|
|
||||||
watch(props.data, async () => {
|
watch(props.data, async () => {
|
||||||
|
|
@ -39,6 +40,7 @@ watch(props.data, async () => {
|
||||||
formData.position = props.data.position;
|
formData.position = props.data.position;
|
||||||
formData.phone = props.data.phone;
|
formData.phone = props.data.phone;
|
||||||
formData.email = props.data.email;
|
formData.email = props.data.email;
|
||||||
|
formData.role = props.data.role;
|
||||||
});
|
});
|
||||||
|
|
||||||
// เพิ่มบุคลากร
|
// เพิ่มบุคลากร
|
||||||
|
|
@ -55,6 +57,7 @@ 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 emailRef = ref<object | null>(null);
|
const emailRef = ref<object | null>(null);
|
||||||
|
const roleRef = ref<object | null>(null);
|
||||||
const formRef: FormRef = {
|
const formRef: FormRef = {
|
||||||
prefix: prefixRef,
|
prefix: prefixRef,
|
||||||
firstname: firstnameRef,
|
firstname: firstnameRef,
|
||||||
|
|
@ -62,6 +65,7 @@ const formRef: FormRef = {
|
||||||
position: positionRef,
|
position: positionRef,
|
||||||
phone: phoneRef,
|
phone: phoneRef,
|
||||||
email: emailRef,
|
email: emailRef,
|
||||||
|
role: roleRef,
|
||||||
};
|
};
|
||||||
|
|
||||||
function onValidate() {
|
function onValidate() {
|
||||||
|
|
|
||||||
|
|
@ -29,6 +29,7 @@ interface directorType {
|
||||||
duty: string;
|
duty: string;
|
||||||
email: string;
|
email: string;
|
||||||
telephone: string;
|
telephone: string;
|
||||||
|
role: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export type {
|
export type {
|
||||||
|
|
|
||||||
|
|
@ -5,6 +5,7 @@ interface FormData {
|
||||||
position: string;
|
position: string;
|
||||||
phone: string;
|
phone: string;
|
||||||
email: string;
|
email: string;
|
||||||
|
role: string;
|
||||||
responsibilities:string
|
responsibilities:string
|
||||||
}
|
}
|
||||||
interface FormRef {
|
interface FormRef {
|
||||||
|
|
@ -14,6 +15,7 @@ interface FormRef {
|
||||||
position: object | null;
|
position: object | null;
|
||||||
phone: object | null;
|
phone: object | null;
|
||||||
email: object | null;
|
email: object | null;
|
||||||
|
role: object | null;
|
||||||
[key: string]: any;
|
[key: string]: any;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -51,6 +51,7 @@ export const useInvestigateDisStore = defineStore(
|
||||||
duty: e.duty,
|
duty: e.duty,
|
||||||
email: e.email,
|
email: e.email,
|
||||||
telephone: e.telephone,
|
telephone: e.telephone,
|
||||||
|
role: e.role,
|
||||||
}));
|
}));
|
||||||
rows2.value = datalistDirector;
|
rows2.value = datalistDirector;
|
||||||
selected.value = rows2.value;
|
selected.value = rows2.value;
|
||||||
|
|
@ -204,6 +205,7 @@ export const useInvestigateDisStore = defineStore(
|
||||||
"duty",
|
"duty",
|
||||||
"email",
|
"email",
|
||||||
"telephone",
|
"telephone",
|
||||||
|
"role",
|
||||||
]);
|
]);
|
||||||
const columnsDirector = ref<QTableProps["columns"]>([
|
const columnsDirector = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
|
|
@ -260,6 +262,15 @@ export const useInvestigateDisStore = defineStore(
|
||||||
headerStyle: "font-size: 14px",
|
headerStyle: "font-size: 14px",
|
||||||
style: "font-size: 14px",
|
style: "font-size: 14px",
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: "role",
|
||||||
|
align: "left",
|
||||||
|
label: "จำนวนเรื่องสืบสวน",
|
||||||
|
sortable: true,
|
||||||
|
field: "role",
|
||||||
|
headerStyle: "font-size: 14px",
|
||||||
|
style: "font-size: 14px",
|
||||||
|
},
|
||||||
]);
|
]);
|
||||||
return {
|
return {
|
||||||
fecthList,
|
fecthList,
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue