แก้ฟอร์ม

This commit is contained in:
setthawutttty 2023-12-14 16:34:23 +07:00
parent e24449e331
commit 11bd7d4294
4 changed files with 98 additions and 138 deletions

View file

@ -7,7 +7,7 @@ import { useCounterMixin } from "@/stores/mixin";
import type {
EditDataList,
HistoryStatusType,
fileObType,
FileObType,
} from "@/modules/11_discipline/interface/response/appealComplain";
import config from "@/app.config";
import http from "@/plugins/http";
@ -25,7 +25,7 @@ const historyStatusOb = reactive<HistoryStatusType>({
createdAt: "",
});
const fileOb = reactive<fileObType>({
const fileOb = reactive<FileObType>({
id: "",
pathName: "",
fileName: "",

View file

@ -42,7 +42,7 @@ const {
success,
messageError,
dialogMessageNotify,
hideLoader
hideLoader,
} = mixin;
const dataStore = useAppealComplainStore();
@ -55,7 +55,7 @@ const formData = reactive<any>({
caseNumber: "",
type: "",
file: null,
disciplineComplaint_Appeal_Docs:[],
disciplineComplaint_Appeal_Docs: [],
year: new Date().getFullYear().toString(),
});
@ -220,7 +220,7 @@ function confirmDelete(id: string) {
watch(props.data, async () => {
if (props.data !== null) {
isReadonly.value = true
isReadonly.value = true;
formData.id = props.data.id;
formData.title = props.data.title;
@ -234,7 +234,8 @@ watch(props.data, async () => {
formData.citizenId = props.data.citizenId;
formData.profileId = props.data.profileId;
formData.lastUpdatedAt = props.data.lastUpdatedAt;
formData.disciplineComplaint_Appeal_Docs = props.data.disciplineComplaint_Appeal_Docs
formData.disciplineComplaint_Appeal_Docs =
props.data.disciplineComplaint_Appeal_Docs;
dataStore.getRow([
{
profileId: props.data.profileId,
@ -274,8 +275,8 @@ onMounted(() => {
});
</script>
<template>
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="row q-col-gutter-xs">
<div class="col-sm-12 col-md-9">
<form @submit.prevent="validateForm">
<q-card bordered>
<div class="q-pa-md">
@ -477,6 +478,7 @@ onMounted(() => {
outlined
:rules="[(val) => !!val || 'กรุณากรอกประเภทคดี']"
lazy-rules
hide-bottom-space
label="ประเภทคดี"
/>
</div>
@ -490,87 +492,9 @@ onMounted(() => {
:rules="[(val) => !!val || 'กรุณากรอกเลขที่คดี']"
lazy-rules
label="เลขที่คดี"
hide-bottom-space
/>
</div>
<q-card bordered class="row col-12" style="border: 1px solid #d6dee1">
<div class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md">
ปโหลดไฟลเอกสารหลกฐาน
</div>
<div class="col-12"><q-separator /></div>
<div class="col-12 q-pa-sm row">
<q-file
for="inputFiles"
class="col-11"
outlined
dense
v-model="formData.file"
@added="uploadFile"
label="ไฟล์เอกสารหลักฐาน"
hide-bottom-space
lazy-rules
accept=".pdf,.xlsx,.doc"
clearable
>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
<div class="col-1 self-center text-center">
<q-btn
v-if="formData.file && isReadonly"
size="14px"
flat
round
dense
color="add"
icon="mdi-upload"
@click="uploadFile"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
>
</div>
</div>
<div v-if="formData.disciplineComplaint_Appeal_Docs.length > 0" class="col-xs-12 q-pa-sm row">
<q-list
v-for="data in formData.disciplineComplaint_Appeal_Docs"
:key="data.id"
class="full-width"
bordered
separator
>
<q-item clickable v-ripple>
<q-item-section>{{ data.fileName }}</q-item-section>
<q-space />
<q-btn
size="12px"
flat
round
dense
color="blue"
icon="mdi-download"
@click="downloadFile(data.pathName)"
><q-tooltip>ดาวนโหลดไฟล</q-tooltip></q-btn
>
<q-btn
size="12px"
flat
round
dense
color="red"
class="q-ml-sm"
icon="mdi-delete-outline"
@click="deleteFile(data.id)"
><q-tooltip>ลบไฟล</q-tooltip></q-btn
>
</q-item>
</q-list>
</div>
<div class="col-12 q-pa-sm" v-else>
<q-card class="q-pa-md" bordered> ไมรายการเอกสาร </q-card>
</div>
</q-card>
</div>
</div>
</div>
@ -585,13 +509,89 @@ onMounted(() => {
</form>
</div>
<!-- พโหลดไฟล -->
<!-- <div class="col-sm-12 col-md-3">
<q-card flat bordered class="q-pa-md q-mb-sm">
<div class="col-xs-12">
<div class="col-sm-12 col-md-3">
<q-card bordered class="row col-12" style="border: 1px solid #d6dee1">
<div class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md">
ปโหลดไฟลเอกสารหลกฐาน
</div>
<div class="col-12"><q-separator /></div>
<div class="col-12 q-pa-sm row">
<q-file
for="inputFiles"
class="col-11"
outlined
dense
v-model="formData.file"
@added="uploadFile"
label="ไฟล์เอกสารหลักฐาน"
hide-bottom-space
lazy-rules
accept=".pdf,.xlsx,.doc"
clearable
>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
<div class="col-1 self-center text-center">
<q-btn
v-if="formData.file && isReadonly"
size="14px"
flat
round
dense
color="add"
icon="mdi-upload"
@click="uploadFile"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
>
</div>
</div>
<div
v-if="formData.disciplineComplaint_Appeal_Docs.length > 0"
class="col-xs-12 q-pa-sm row"
>
<q-list
v-for="data in formData.disciplineComplaint_Appeal_Docs"
:key="data.id"
class="full-width"
bordered
separator
>
<q-item clickable v-ripple>
<q-item-section>{{ data.fileName }}</q-item-section>
<q-space />
<q-btn
size="12px"
flat
round
dense
color="blue"
icon="mdi-download"
@click="downloadFile(data.pathName)"
><q-tooltip>ดาวนโหลดไฟล</q-tooltip></q-btn
>
<q-btn
size="12px"
flat
round
dense
color="red"
class="q-ml-sm"
icon="mdi-delete-outline"
@click="deleteFile(data.id)"
><q-tooltip>ลบไฟล</q-tooltip></q-btn
>
</q-item>
</q-list>
</div>
<div class="col-12 q-pa-sm" v-else>
<q-card class="q-pa-md" bordered> ไมรายการเอกสาร </q-card>
</div>
</q-card>
</div> -->
</div>
</div>
<DialogAddPersonal

View file

@ -447,55 +447,15 @@ onMounted(async () => {
</q-td>
<td auto-width>
<q-btn
icon="mdi-dots-vertical"
size="12px"
color="grey-7"
icon="mdi-pencil"
size="10px"
color="primary"
flat
round
dense
@click.stop
@click="openEditStatus(props.row)"
>
<q-menu transition-show="jump-down" transition-hide="jump-up">
<q-list dense style="min-width: auto">
<q-item clickable @click="openEditStatus(props.row)">
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-tooltip>แกไขสถานะ</q-tooltip>
<q-icon color="primary" size="xs" name="mdi-pencil" />
</q-item-section>
<q-item-section>แกไขสถานะ</q-item-section>
</q-item>
<q-item clickable v-close-popup>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-tooltip>แกไขคำรอง</q-tooltip>
<q-icon color="primary" size="xs" name="mdi-pencil" />
</q-item-section>
<q-item-section>แกไขคำรอง</q-item-section>
</q-item>
<q-item clickable v-close-popup>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-tooltip>รายละเอยดคำรอง</q-tooltip>
<q-icon
color="blue"
size="xs"
name="mdi-information-outline"
/>
</q-item-section>
<q-item-section>รายละเอยดคำรอง</q-item-section>
</q-item>
</q-list>
</q-menu>
<q-tooltip>แกไขสถานะ</q-tooltip>
</q-btn>
</td>
</q-tr>

View file

@ -54,7 +54,7 @@ interface HistoryStatusType {
status: string
createdAt: string
}
interface fileObType {
interface FileObType {
id:string
pathName:string
fileName:string
@ -75,4 +75,4 @@ interface EditStatusRef {
}
export type { MainList, RowList, MyObjectAppealRef, EditStatusRef,EditDataList,HistoryStatusType,fileObType,RowAddList };
export type { MainList, RowList, MyObjectAppealRef, EditStatusRef,EditDataList,HistoryStatusType,FileObType,RowAddList };