เรื่องร้องเรียน อัปโหลด ลบ ไฟล์

This commit is contained in:
setthawutttty 2023-11-23 15:41:05 +07:00
parent 7e88b119cf
commit e5291cfe34
4 changed files with 99 additions and 85 deletions

View file

@ -17,5 +17,6 @@ export default {
complaintAdd:() => `${discipline}/complaint`, complaintAdd:() => `${discipline}/complaint`,
complaintbyId:(id:string) => `${discipline}/complaint/${id}`, complaintbyId:(id:string) => `${discipline}/complaint/${id}`,
complaintList:(page:number,pageSize:number,keyword:string) => `${discipline}/complaint?page=${page}&pageSize=${pageSize}&keyword=${keyword}`, complaintList:(page:number,pageSize:number,keyword:string) => `${discipline}/complaint?page=${page}&pageSize=${pageSize}&keyword=${keyword}`,
complaintFileUpload:(id:string) => `${discipline}/complaint/file/${id}`,
complaintFileDelete:(id:string,docId:string) => `${discipline}/complaint/file/${id}/${docId}`
}; };

View file

@ -46,6 +46,7 @@ const fileListOj = reactive<ArrayFileList>({
}); });
const data = reactive<FormData>({ const data = reactive<FormData>({
id:'',
respondentType: "", respondentType: "",
organizationId: "", organizationId: "",
consideredAgency: "", consideredAgency: "",
@ -132,6 +133,7 @@ async function getData() {
.get(config.API.complaintbyId(id.value)) .get(config.API.complaintbyId(id.value))
.then((res) => { .then((res) => {
const dataList = res.data.result; const dataList = res.data.result;
data.id = dataList.id
data.respondentType = dataList.respondentType data.respondentType = dataList.respondentType
data.organizationId = dataList.organizationId data.organizationId = dataList.organizationId
data.consideredAgency = dataList.consideredAgency data.consideredAgency = dataList.consideredAgency
@ -149,7 +151,7 @@ async function getData() {
data.rejectReason = dataList.rejectReason data.rejectReason = dataList.rejectReason
data.disciplineComplaintDocs = dataList.disciplineComplaintDocs data.disciplineComplaintDocs = dataList.disciplineComplaintDocs
console.log('list', dataList.persons) console.log('list', data.id)
}) })
.catch((e) => { .catch((e) => {
messageError($q, e); messageError($q, e);
@ -271,7 +273,7 @@ onMounted(() => {
</div> </div>
</div> </div>
<Form :on-submit="onSubmit" :data="data" /> <Form :on-submit="onSubmit" :data="data" :get-data="getData"/>
<Popup :modal="modalPopup" :close="closePopup" /> <Popup :modal="modalPopup" :close="closePopup" />
</div> </div>
</template> </template>

View file

@ -28,7 +28,15 @@ const fileDocDataUpload = ref<File[]>([]);
/** เรียกใช้ store */ /** เรียกใช้ store */
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const complainstStore = useComplainstDataStore(); const complainstStore = useComplainstDataStore();
const { date2Thai, dialogConfirm, dialogRemove, success } = mixin; const {
date2Thai,
dialogConfirm,
dialogRemove,
success,
messageError,
hideLoader,
showLoader,
} = mixin;
const { selectComplainantTpye, filterSelector } = complainstStore; // function store complainstStore const { selectComplainantTpye, filterSelector } = complainstStore; // function store complainstStore
/** validateForm */ /** validateForm */
@ -57,6 +65,10 @@ const props = defineProps({
type: Function, type: Function,
default: () => "", default: () => "",
}, },
getData: {
type: Function,
default: () => "",
},
}); });
const fileListOj = reactive<ArrayFileList>({ const fileListOj = reactive<ArrayFileList>({
@ -66,6 +78,7 @@ const fileListOj = reactive<ArrayFileList>({
}); });
const formData = reactive<FormData>({ const formData = reactive<FormData>({
id: "",
respondentType: "", respondentType: "",
organizationId: null, organizationId: null,
consideredAgency: "", consideredAgency: "",
@ -303,12 +316,10 @@ function onSubmit() {
dialogConfirm( dialogConfirm(
$q, $q,
async () => { async () => {
if(complainstStore.rowsAdd){ if (complainstStore.rowsAdd) {
formData.persons = complainstStore.rowsAdd formData.persons = complainstStore.rowsAdd;
props.onSubmit(formData) props.onSubmit(formData);
}else( } else props.onSubmit(formData);
props.onSubmit(formData)
)
// props.onSubmit(formData); // props.onSubmit(formData);
}, },
"ยืนยันการบันทึกข้อมูล", "ยืนยันการบันทึกข้อมูล",
@ -341,7 +352,18 @@ function deleteFile(id: string) {
* @param id id file * @param id id file
*/ */
function confirmDelete(id: string) { function confirmDelete(id: string) {
success($q, `ลบไฟล์สำเร็จ #id:${id}`); showLoader();
http
.delete(config.API.complaintFileDelete(formData.id, id))
.then((res) => {
success($q, `ลบไฟล์สำเร็จ`);
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
props.getData();
});
} }
/** /**
@ -352,7 +374,7 @@ function confirmDelete(id: string) {
watch(props.data, async () => { watch(props.data, async () => {
fileList.value = props.data.disciplineComplaintDocs; fileList.value = props.data.disciplineComplaintDocs;
complainstStore.fetchComplainstAdd(props.data.persons); complainstStore.fetchComplainstAdd(props.data.persons);
formData.id = props.data.id;
formData.respondentType = props.data.respondentType; formData.respondentType = props.data.respondentType;
formData.organizationId = props.data.organizationId; formData.organizationId = props.data.organizationId;
formData.consideredAgency = props.data.consideredAgency; formData.consideredAgency = props.data.consideredAgency;
@ -365,10 +387,8 @@ watch(props.data, async () => {
formData.dateNotification = props.data.dateNotification; formData.dateNotification = props.data.dateNotification;
formData.complaintFrom = props.data.complaintFrom; formData.complaintFrom = props.data.complaintFrom;
formData.appellant = props.data.appellant; formData.appellant = props.data.appellant;
formData.documentFile = props.data.documentFile;
formData.status = props.data.status; formData.status = props.data.status;
formData.persons = complainstStore.rowsAdd formData.persons = complainstStore.rowsAdd;
}); });
/** /**
@ -380,7 +400,27 @@ function handleSave(returnData: any) {
toggleModal(); toggleModal();
} }
async function addPerson(data:any) { function upLoadFileDoc() {
const Data = new FormData();
Data.append("file", formData.documentFile);
showLoader();
http
.put(config.API.complaintFileUpload(formData.id), Data)
.then((res) => {
console.log(res);
success($q, "บันทึกข้อมูลสำเร็จ");
router.push(`/discipline/complaints`);
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
hideLoader();
});
console.log("file", formData.documentFile, formData.id);
}
async function addPerson(data: any) {
await complainstStore.fetchComplainstAdd(data); await complainstStore.fetchComplainstAdd(data);
toggleModal(); toggleModal();
} }
@ -410,10 +450,7 @@ onMounted(() => {
ref="respondentTypeRef" ref="respondentTypeRef"
dense dense
outlined outlined
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
label="ผู้ถูกร้องเรียน" label="ผู้ถูกร้องเรียน"
option-value="id" option-value="id"
option-label="name" option-label="name"
@ -450,10 +487,7 @@ onMounted(() => {
ref="organizationIdRef" ref="organizationIdRef"
dense dense
hide-bottom-space hide-bottom-space
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
outlined outlined
option-label="name" option-label="name"
option-value="id" option-value="id"
@ -478,10 +512,7 @@ onMounted(() => {
label="หน่วยงานที่พิจารณา" label="หน่วยงานที่พิจารณา"
option-value="id" option-value="id"
option-label="name" option-label="name"
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
hide-bottom-space hide-bottom-space
emit-value emit-value
map-options map-options
@ -512,10 +543,7 @@ onMounted(() => {
> >
กรองเรยน กรองเรยน
<q-btn <q-btn
v-if=" v-if="formData.status === 'NEW' || formData.status === ''"
formData.status === 'NEW' ||
formData.status === ''
"
size="12px" size="12px"
flat flat
round round
@ -582,10 +610,7 @@ onMounted(() => {
ref="titleRef" ref="titleRef"
dense dense
outlined outlined
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
hide-bottom-space hide-bottom-space
v-model="formData.title" v-model="formData.title"
:rules="[(val) => !!val || 'กรุณาการข้อมูล']" :rules="[(val) => !!val || 'กรุณาการข้อมูล']"
@ -602,10 +627,7 @@ onMounted(() => {
ref="descriptionRef" ref="descriptionRef"
dense dense
outlined outlined
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
hide-bottom-space hide-bottom-space
v-model="formData.description" v-model="formData.description"
:rules="[(val) => !!val || 'กรุณาการข้อมูล']" :rules="[(val) => !!val || 'กรุณาการข้อมูล']"
@ -623,10 +645,7 @@ onMounted(() => {
:locale="'th'" :locale="'th'"
autoApply autoApply
borderless borderless
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
:enableTimePicker="false" :enableTimePicker="false"
week-start="0" week-start="0"
> >
@ -643,8 +662,7 @@ onMounted(() => {
outlined outlined
dense dense
:readonly=" :readonly="
formData.status !== 'NEW' && formData.status !== 'NEW' && formData.status !== ''
formData.status !== ''
" "
hide-bottom-space hide-bottom-space
class="full-width datepicker" class="full-width datepicker"
@ -678,10 +696,7 @@ onMounted(() => {
ref="levelConsiderationRef" ref="levelConsiderationRef"
dense dense
outlined outlined
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
v-model="formData.levelConsideration" v-model="formData.levelConsideration"
:options="levelConsiderationtoptions" :options="levelConsiderationtoptions"
label="ระดับการพิจารณา" label="ระดับการพิจารณา"
@ -702,10 +717,7 @@ onMounted(() => {
v-model="formData.dateConsideration" v-model="formData.dateConsideration"
@update:model-value="selectLevel(formData.levelConsideration)" @update:model-value="selectLevel(formData.levelConsideration)"
:locale="'th'" :locale="'th'"
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
autoApply autoApply
borderless borderless
:enableTimePicker="false" :enableTimePicker="false"
@ -730,8 +742,7 @@ onMounted(() => {
: null : null
" "
:readonly=" :readonly="
formData.status !== 'NEW' && formData.status !== 'NEW' && formData.status !== ''
formData.status !== ''
" "
label="วันที่กำหนดวันพิจารณา" label="วันที่กำหนดวันพิจารณา"
hide-bottom-space hide-bottom-space
@ -759,10 +770,7 @@ onMounted(() => {
ref="offenseDetailsRef" ref="offenseDetailsRef"
dense dense
outlined outlined
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
v-model="formData.offenseDetails" v-model="formData.offenseDetails"
:options="offenseDetailstoptions" :options="offenseDetailstoptions"
label="ลักษณะความผิด" label="ลักษณะความผิด"
@ -782,10 +790,7 @@ onMounted(() => {
v-model="formData.dateNotification" v-model="formData.dateNotification"
:locale="'th'" :locale="'th'"
autoApply autoApply
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
borderless borderless
:enableTimePicker="false" :enableTimePicker="false"
week-start="0" week-start="0"
@ -803,8 +808,7 @@ onMounted(() => {
outlined outlined
dense dense
:readonly=" :readonly="
formData.status !== 'NEW' && formData.status !== 'NEW' && formData.status !== ''
formData.status !== ''
" "
hide-bottom-space hide-bottom-space
class="full-width datepicker" class="full-width datepicker"
@ -838,10 +842,7 @@ onMounted(() => {
for="selectReceivecomplaints" for="selectReceivecomplaints"
ref="complaintFromRef" ref="complaintFromRef"
dense dense
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
outlined outlined
v-model="formData.complaintFrom" v-model="formData.complaintFrom"
:options="complaintFromtoptions" :options="complaintFromtoptions"
@ -863,10 +864,7 @@ onMounted(() => {
dense dense
outlined outlined
v-model="formData.appellant" v-model="formData.appellant"
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
label="ผู้ร้องเรียน" label="ผู้ร้องเรียน"
:rules="[(val) => !!val || `${'กรุณากรอกข้อมูล'}`]" :rules="[(val) => !!val || `${'กรุณากรอกข้อมูล'}`]"
lazy-rules lazy-rules
@ -875,15 +873,29 @@ onMounted(() => {
rows="5" rows="5"
/> />
</div> </div>
<div class="col-xs-12 col-sm-12">
<q-input
for="inputInspectionResults"
ref="inputRef"
dense
outlined
hide-bottom-space
v-model="formData.rejectReason"
:rules="[
(val) => !!val || 'กรุณากรอกผลการตรวจสอบเรื่องร้องเรียน',
]"
lazy-rules
label="ผลการตรวจสอบเรื่องร้องเรียน"
type="textarea"
rows="5"
/>
</div>
</div> </div>
</div> </div>
<q-separator /> <q-separator />
<div <div
class="row col-12 q-pa-sm" class="row col-12 q-pa-sm"
v-if=" v-if="formData.status === 'NEW' || formData.status === ''"
formData.status === 'NEW' ||
formData.status === ''
"
> >
<q-space /> <q-space />
<q-btn <q-btn
@ -899,25 +911,22 @@ onMounted(() => {
</q-card> </q-card>
</div> </div>
<div class="col-12 q-mt-sm q-mb-lg"> <div class="col-12 q-mt-sm q-mb-lg" v-if="props.data">
<q-card flat bordered> <q-card flat bordered>
<div <div
class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md" class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md"
> >
ปโหลดไฟลเอกสารหลกฐาน {{ formData.status === 'NEW'? 'อัปโหลดไฟล์เอกสารหลักฐาน':'ไฟล์เอกสารหลักฐาน'}}
</div> </div>
<div class="col-12"><q-separator /></div> <div class="col-12"><q-separator /></div>
<div class="row q-ma-sm q-col-gutter-x-sm"> <div class="row q-ma-sm q-col-gutter-x-sm" v-if="formData.status === 'NEW'">
<div class="col-11" id="documentFile"> <div class="col-11" id="documentFile">
<q-file <q-file
for="inputFiles" for="inputFiles"
outlined outlined
dense dense
class="fit" class="fit"
:readonly=" :readonly="formData.status !== 'NEW' && formData.status !== ''"
formData.status !== 'NEW' &&
formData.status !== ''
"
v-model="formData.documentFile" v-model="formData.documentFile"
@added="fileUploadDoc" @added="fileUploadDoc"
label="ไฟล์เอกสารหลักฐาน" label="ไฟล์เอกสารหลักฐาน"
@ -940,6 +949,7 @@ onMounted(() => {
color="add" color="add"
class="q-ml-sm" class="q-ml-sm"
icon="mdi-upload" icon="mdi-upload"
@click="upLoadFileDoc()"
><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn ><q-tooltip>ปโหลดไฟล</q-tooltip></q-btn
> >
</div> </div>

View file

@ -1,4 +1,5 @@
interface FormData { interface FormData {
id:string
respondentType: string respondentType: string
consideredAgency: string consideredAgency: string
title: string title: string