update ฟอร์มสืบสวน สอบสวนวินัย

This commit is contained in:
Warunee Tamkoo 2023-11-23 15:47:14 +07:00
parent 422ea07f4d
commit b5cc5c9cb7
12 changed files with 768 additions and 564 deletions

View file

@ -673,355 +673,369 @@ onMounted(async () => {
</div>
</q-card>
<div class="col-12 row q-col-gutter-md q-mt-sm">
<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-card flat class="q-pa-md q-mt-sm">
<div class="col-12 row q-col-gutter-md">
<div class="row col-12">
<q-card
bordered
class="row col-12"
style="border: 1px solid #d6dee1"
>
ปโหลดหลกฐานสนบสนนขอกลาวหา
</div>
<div class="col-12"><q-separator /></div>
<div class="col-xs-12 q-pa-sm row">
<q-file
class="col-11 q-mt-sm"
outlined
dense
ref="filesEvidenceRef"
for="#filesEvidence"
v-model="formData.filesEvidence"
@added="fileUploadDoc"
label="ไฟล์เอกสารหลักฐานสรุปพยานหลักฐานสนับสนุนข้อกล่าวหา"
hide-bottom-space
lazy-rules
accept=".pdf,.xlsx,.doc"
<div
class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
<div class="col-1 self-center">
<q-btn
size="14px"
flat
round
dense
color="add"
class="q-ml-sm q-mt-sm"
icon="mdi-upload"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
>
ปโหลดหลกฐานสนบสนนขอกลาวหา
</div>
</div>
<div class="col-xs-12 q-pa-sm row">
<q-list bordered separator class="full-width">
<q-item
clickable
v-ripple
v-for="(file, index) in filesEvidence"
:key="index"
<div class="col-12"><q-separator /></div>
<div class="col-xs-12 q-pa-sm row">
<q-file
class="col-11 q-mt-sm"
outlined
dense
ref="filesEvidenceRef"
for="#filesEvidence"
v-model="formData.filesEvidence"
@added="fileUploadDoc"
label="ไฟล์เอกสารหลักฐานสรุปพยานหลักฐานสนับสนุนข้อกล่าวหา"
hide-bottom-space
lazy-rules
accept=".pdf,.xlsx,.doc"
>
<q-item-section>{{
file.name + (index + 1)
}}</q-item-section>
<q-item-section avatar>
<div class="row">
<div>
<q-btn
dense
flat
round
size="12px"
color="blue"
icon="mdi-download-outline"
>
<q-tooltip>ดาวนโหลดเอกสารหลกฐาน</q-tooltip>
</q-btn>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
<div class="col-1 self-center">
<q-btn
size="14px"
flat
round
dense
color="add"
class="q-ml-sm q-mt-sm"
icon="mdi-upload"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
>
</div>
</div>
<div class="col-xs-12 q-pa-sm row">
<q-list bordered separator class="full-width">
<q-item
clickable
v-ripple
v-for="(file, index) in filesEvidence"
:key="index"
>
<q-item-section>{{
file.name + (index + 1)
}}</q-item-section>
<q-item-section avatar>
<div class="row">
<div>
<q-btn
dense
flat
round
size="12px"
color="blue"
icon="mdi-download-outline"
>
<q-tooltip>ดาวนโหลดเอกสารหลกฐาน</q-tooltip>
</q-btn>
</div>
<div>
<q-btn
dense
flat
round
size="12px"
color="red"
icon="mdi-delete-outline"
><q-tooltip>ลบเอกสารหลกฐาน</q-tooltip></q-btn
>
</div>
</div>
<div>
<q-btn
dense
flat
round
size="12px"
color="red"
icon="mdi-delete-outline"
><q-tooltip>ลบเอกสารหลกฐาน</q-tooltip></q-btn
>
</div>
</div>
</q-item-section>
</q-item>
</q-list>
</div>
</q-card>
</q-item-section>
</q-item>
</q-list>
</div>
</q-card>
</div>
</div>
</q-card>
<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-card flat class="q-pa-md q-mt-sm">
<div class="col-12 row q-col-gutter-md">
<div class="row col-12">
<q-card
bordered
class="row col-12"
style="border: 1px solid #d6dee1"
>
ปโหลดบนทกถอยคำของผกลาวหา
</div>
<div class="col-12"><q-separator /></div>
<div class="col-xs-12 q-pa-sm row">
<q-file
class="col-11 q-mt-sm"
outlined
dense
ref="filesRecordAccuserRef"
for="#filesRecordAccuser"
v-model="formData.filesRecordAccuser"
@added="fileUploadDoc"
label="ไฟล์เอกสารบันทึกถ้อยคำของผู้กล่าวหา"
hide-bottom-space
lazy-rules
accept=".pdf,.xlsx,.doc"
<div
class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
<div class="col-1 self-center">
<q-btn
size="14px"
flat
round
dense
color="add"
class="q-ml-sm q-mt-sm"
icon="mdi-upload"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
>
ปโหลดบนทกถอยคำของผกลาวหา
</div>
</div>
<div class="col-xs-12 q-pa-sm row">
<q-list bordered separator class="full-width">
<q-item
clickable
v-ripple
v-for="(file, index) in filesRecordAccuser"
:key="index"
<div class="col-12"><q-separator /></div>
<div class="col-xs-12 q-pa-sm row">
<q-file
class="col-11 q-mt-sm"
outlined
dense
ref="filesRecordAccuserRef"
for="#filesRecordAccuser"
v-model="formData.filesRecordAccuser"
@added="fileUploadDoc"
label="ไฟล์เอกสารบันทึกถ้อยคำของผู้กล่าวหา"
hide-bottom-space
lazy-rules
accept=".pdf,.xlsx,.doc"
>
<q-item-section>{{
file.name + (index + 1)
}}</q-item-section>
<q-item-section avatar>
<div class="row">
<div>
<q-btn
dense
flat
round
size="12px"
color="blue"
icon="mdi-download-outline"
>
<q-tooltip>ดาวนโหลดเอกสารหลกฐาน</q-tooltip>
</q-btn>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
<div class="col-1 self-center">
<q-btn
size="14px"
flat
round
dense
color="add"
class="q-ml-sm q-mt-sm"
icon="mdi-upload"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
>
</div>
</div>
<div class="col-xs-12 q-pa-sm row">
<q-list bordered separator class="full-width">
<q-item
clickable
v-ripple
v-for="(file, index) in filesRecordAccuser"
:key="index"
>
<q-item-section>{{
file.name + (index + 1)
}}</q-item-section>
<q-item-section avatar>
<div class="row">
<div>
<q-btn
dense
flat
round
size="12px"
color="blue"
icon="mdi-download-outline"
>
<q-tooltip>ดาวนโหลดเอกสารหลกฐาน</q-tooltip>
</q-btn>
</div>
<div>
<q-btn
dense
flat
round
size="12px"
color="red"
icon="mdi-delete-outline"
><q-tooltip>ลบเอกสารหลกฐาน</q-tooltip></q-btn
>
</div>
</div>
<div>
<q-btn
dense
flat
round
size="12px"
color="red"
icon="mdi-delete-outline"
><q-tooltip>ลบเอกสารหลกฐาน</q-tooltip></q-btn
>
</div>
</div>
</q-item-section>
</q-item>
</q-list>
</div>
</q-card>
</q-item-section>
</q-item>
</q-list>
</div>
</q-card>
</div>
</div>
</q-card>
<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-card flat class="q-pa-md q-mt-sm">
<div class="col-12 row q-col-gutter-md">
<div class="row col-12">
<q-card
bordered
class="row col-12"
style="border: 1px solid #d6dee1"
>
ปโหลดพยานและการบนทกถอยคำ
</div>
<div class="col-12"><q-separator /></div>
<div class="col-xs-12 q-pa-sm row">
<q-file
class="col-11 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"
<div
class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
<div class="col-1 self-center">
<q-btn
size="14px"
flat
round
dense
color="add"
class="q-ml-sm q-mt-sm"
icon="mdi-upload"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
>
ปโหลดพยานและการบนทกถอยคำ
</div>
</div>
<div class="col-xs-12 q-pa-sm row">
<q-list bordered separator class="full-width">
<q-item
clickable
v-ripple
v-for="(file, index) in filesWitnesses"
:key="index"
<div class="col-12"><q-separator /></div>
<div class="col-xs-12 q-pa-sm row">
<q-file
class="col-11 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"
>
<q-item-section>{{
file.name + (index + 1)
}}</q-item-section>
<q-item-section avatar>
<div class="row">
<div>
<q-btn
dense
flat
round
size="12px"
color="blue"
icon="mdi-download-outline"
>
<q-tooltip>ดาวนโหลดเอกสารหลกฐาน</q-tooltip>
</q-btn>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
<div class="col-1 self-center">
<q-btn
size="14px"
flat
round
dense
color="add"
class="q-ml-sm q-mt-sm"
icon="mdi-upload"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
>
</div>
</div>
<div class="col-xs-12 q-pa-sm row">
<q-list bordered separator class="full-width">
<q-item
clickable
v-ripple
v-for="(file, index) in filesWitnesses"
:key="index"
>
<q-item-section>{{
file.name + (index + 1)
}}</q-item-section>
<q-item-section avatar>
<div class="row">
<div>
<q-btn
dense
flat
round
size="12px"
color="blue"
icon="mdi-download-outline"
>
<q-tooltip>ดาวนโหลดเอกสารหลกฐาน</q-tooltip>
</q-btn>
</div>
<div>
<q-btn
dense
flat
round
size="12px"
color="red"
icon="mdi-delete-outline"
><q-tooltip>ลบเอกสารหลกฐาน</q-tooltip></q-btn
>
</div>
</div>
<div>
<q-btn
dense
flat
round
size="12px"
color="red"
icon="mdi-delete-outline"
><q-tooltip>ลบเอกสารหลกฐาน</q-tooltip></q-btn
>
</div>
</div>
</q-item-section>
</q-item>
</q-list>
</div>
</q-card>
</q-item-section>
</q-item>
</q-list>
</div>
</q-card>
</div>
</div>
</q-card>
<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-card flat class="q-pa-md q-mt-sm">
<div class="col-12 row q-col-gutter-md">
<div class="row col-12">
<q-card
bordered
class="row col-12"
style="border: 1px solid #d6dee1"
>
ปโหลดไฟลเอกสารหลกฐานอ
</div>
<div class="col-12"><q-separator /></div>
<div class="col-xs-12 q-pa-sm row">
<q-file
class="col-11 q-mt-sm"
outlined
dense
ref="filesEtcRef"
for="#filesEtc"
v-model="formData.filesEtc"
@added="fileUploadDoc"
label="ไฟล์เอกสารหลักฐานอื่น ๆ"
hide-bottom-space
lazy-rules
accept=".pdf,.xlsx,.doc"
<div
class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
<div class="col-1 self-center">
<q-btn
size="14px"
flat
round
dense
color="add"
class="q-ml-sm q-mt-sm"
icon="mdi-upload"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
>
ปโหลดไฟลเอกสารหลกฐานอ
</div>
</div>
<div class="col-xs-12 q-pa-sm row">
<q-list bordered separator class="full-width">
<q-item
clickable
v-ripple
v-for="(file, index) in filesEtc"
:key="index"
<div class="col-12"><q-separator /></div>
<div class="col-xs-12 q-pa-sm row">
<q-file
class="col-11 q-mt-sm"
outlined
dense
ref="filesEtcRef"
for="#filesEtc"
v-model="formData.filesEtc"
@added="fileUploadDoc"
label="ไฟล์เอกสารหลักฐานอื่น ๆ"
hide-bottom-space
lazy-rules
accept=".pdf,.xlsx,.doc"
>
<q-item-section>{{
file.name + (index + 1)
}}</q-item-section>
<q-item-section avatar>
<div class="row">
<div>
<q-btn
dense
flat
round
size="12px"
color="blue"
icon="mdi-download-outline"
>
<q-tooltip>ดาวนโหลดเอกสารหลกฐาน</q-tooltip>
</q-btn>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
<div class="col-1 self-center">
<q-btn
size="14px"
flat
round
dense
color="add"
class="q-ml-sm q-mt-sm"
icon="mdi-upload"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
>
</div>
</div>
<div class="col-xs-12 q-pa-sm row">
<q-list bordered separator class="full-width">
<q-item
clickable
v-ripple
v-for="(file, index) in filesEtc"
:key="index"
>
<q-item-section>{{
file.name + (index + 1)
}}</q-item-section>
<q-item-section avatar>
<div class="row">
<div>
<q-btn
dense
flat
round
size="12px"
color="blue"
icon="mdi-download-outline"
>
<q-tooltip>ดาวนโหลดเอกสารหลกฐาน</q-tooltip>
</q-btn>
</div>
<div>
<q-btn
dense
flat
round
size="12px"
color="red"
icon="mdi-delete-outline"
><q-tooltip>ลบเอกสารหลกฐาน</q-tooltip></q-btn
>
</div>
</div>
<div>
<q-btn
dense
flat
round
size="12px"
color="red"
icon="mdi-delete-outline"
><q-tooltip>ลบเอกสารหลกฐาน</q-tooltip></q-btn
>
</div>
</div>
</q-item-section>
</q-item>
</q-list>
</div>
</q-card>
</q-item-section>
</q-item>
</q-list>
</div>
</q-card>
</div>
</div>
</div>
</q-card>
</div>
</form>
</div>