From 2d3d56ff801b73afdb779267004d740f9beafe57 Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期二, 31 十月 2023 16:09:44 +0800 Subject: [PATCH] 2023.10.31 --- src/views/overlay-clue/report/components/QuestionDetail.vue | 84 +++++++++++++++++++++++++++++++++-------- 1 files changed, 67 insertions(+), 17 deletions(-) diff --git a/src/views/overlay-clue/components/QuestionDetail.vue b/src/views/overlay-clue/report/components/QuestionDetail.vue similarity index 76% rename from src/views/overlay-clue/components/QuestionDetail.vue rename to src/views/overlay-clue/report/components/QuestionDetail.vue index ac67c93..81c524a 100644 --- a/src/views/overlay-clue/components/QuestionDetail.vue +++ b/src/views/overlay-clue/report/components/QuestionDetail.vue @@ -7,7 +7,7 @@ destroy-on-close > <template #header> - <span> 鍙嶉闂</span> + <span> 娣诲姞闂</span> </template> <el-form label-width="90px" @@ -16,11 +16,17 @@ :model="formObj" ref="formRef" > + <el-form-item label="闂鍚嶇О" prop="cqName"> + <el-input + v-model="formObj.cqName" + placeholder="璇疯緭鍏ラ棶棰樺悕绉�" + ></el-input> + </el-form-item> <el-form-item label="闂鎻忚堪" prop="cqDescription"> <el-input v-model="formObj.cqDescription" type="textarea" - placeholder="璇疯緭鍏ヨ鎯�" + placeholder="璇疯緭鍏ラ棶棰樻弿杩�" ></el-input> </el-form-item> <el-form-item label="鎵�鍦ㄨ闀�" prop="cqStreet"> @@ -34,7 +40,10 @@ </el-select> </el-form-item> <el-form-item label="璇︾粏鍦板潃" prop="cqAddress"> - <el-input v-model="formObj.cqAddress"></el-input> + <el-input + v-model="formObj.cqAddress" + placeholder="璇疯緭鍏ュ湴鍧�鎴栬�呴�氳繃鈥滃潗鏍囨嬀鍙栤�濊嚜鍔ㄨ幏寰�" + ></el-input> </el-form-item> <el-form-item label="鍧愭爣" prop="coordinate"> <el-input @@ -57,6 +66,7 @@ accept="image/png, image/jpeg" :limit="3" multiple + :on-preview="handleFilePreview" :on-remove="handleFileRemove" :on-change="handleFileChange" > @@ -80,6 +90,13 @@ > </template> </el-dialog> + <el-image-viewer + v-if="previewShow" + :url-list="urlList" + :initial-index="initialIndex" + :infinite="false" + @close="closePreview" + ></el-image-viewer> <MapSearch v-model:show="mapDialogShow" @on-submit="selectAddress" @@ -99,13 +116,30 @@ question: Object }); -const emit = defineEmits(['update:show', 'onSubmit'], ['onClose']); +const emit = defineEmits(['update:show', 'onSubmit', 'onClose']); // 涓婃姤寮瑰嚭妗� const dialogShow = ref(false); const mapDialogShow = ref(false); const uploadRef = ref(); const fileList = ref([]); + +const previewShow = ref(false); +const initialIndex = ref(0); +const urlList = computed(() => + fileList.value.map((value) => { + return value.url; + }) +); + +function handleFilePreview(file) { + initialIndex.value = fileList.value.indexOf(file); + previewShow.value = true; +} + +function closePreview() { + previewShow.value = false; +} function handleFileRemove(file, fileList) { formObj.value.files = fileList; @@ -127,6 +161,13 @@ const loading = ref(false); // 琛ㄥ崟妫�鏌ヨ鍒� const rules = reactive({ + cqName: [ + { + required: true, + message: '闂鍚嶇О涓嶈兘涓虹┖', + trigger: 'blur' + } + ], cqDescription: [ { required: true, @@ -182,6 +223,7 @@ const coor = formObj.value.coordinate.split(','); const q = { cId: parseInt(props.clueId), + cqName: formObj.value.cqName, cqDescription: formObj.value.cqDescription, cqStreet: formObj.value.cqStreet, cqAddress: formObj.value.cqAddress, @@ -238,26 +280,34 @@ url: f }); }); - return question; + return { ...question }; } watch( - () => props.show, + () => [props.show, props.question], (val) => { - dialogShow.value = val; - } -); -watch( - () => props.question, - (val) => { - fileList.value = []; - if (val) { - formObj.value = parseFormObj(val); - } else { - formObj.value = {}; + dialogShow.value = val[0]; + if (val[0]) { + fileList.value = []; + if (val[1]) { + formObj.value = parseFormObj(val[1]); + } else { + formObj.value = {}; + } } } ); +// watch( +// () => props.question, +// (val) => { +// fileList.value = []; +// if (val) { +// formObj.value = parseFormObj(val); +// } else { +// formObj.value = {}; +// } +// } +// ); watch(dialogShow, (val) => { emit('update:show', val); }); -- Gitblit v1.9.3