From d22ce1ad1c4656f5c2212bbabb35ba498300aced Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期四, 20 七月 2023 17:12:20 +0800 Subject: [PATCH] 线索下发及提交结论和问题模块基本完成 --- src/views/overlay-clue/components/ClueReportConclusion.vue | 193 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 193 insertions(+), 0 deletions(-) diff --git a/src/views/overlay-clue/components/ClueReportConclusion.vue b/src/views/overlay-clue/components/ClueReportConclusion.vue new file mode 100644 index 0000000..a42a427 --- /dev/null +++ b/src/views/overlay-clue/components/ClueReportConclusion.vue @@ -0,0 +1,193 @@ +<template> + <div class="fy-h2"> + 绾跨储缁撹 + <el-button + v-if="conclusion" + type="warning" + size="small" + plain + icon="Upload" + @click="pushConclusion" + :disabled="pushing ? true : conclusion.ccUploaded" + >{{ pushing ? '鎺ㄩ�佷腑' : pushText }}</el-button + > + </div> + <el-descriptions v-if="conclusion" :column="1" size="small" border> + <el-descriptions-item width="1px" min-width="30px"> + <template #label> + <div class="descriptions-item">闂绫诲瀷</div> + </template> + {{ conclusion.ccQuestionType }} + </el-descriptions-item> + <el-descriptions-item label="绾跨储缁撹"> + {{ conclusion.ccConclusion }} + </el-descriptions-item> + <el-descriptions-item label="璇︾粏鎻忚堪"> + {{ conclusion.ccDetails }} + </el-descriptions-item> + </el-descriptions> + <div v-else class="fy-dashed-border"> + <el-empty :image-size="50" description="绾跨储缁撹鏈笂浼�"> + <el-button type="primary" @click="openDialog" + >鍙嶉涓婃姤</el-button + > + </el-empty> + </div> + <el-dialog + v-model="dialogShow" + width="50%" + :close-on-click-modal="false" + :close-on-press-escape="false" + > + <template #header> + <span> 鍙嶉缁撹</span> + </template> + <el-form + label-width="120px" + label-position="left" + :rules="rules" + :model="formObj" + ref="formRef" + > + <el-form-item label="闂绫诲瀷" prop="ccQuestionType"> + <el-radio-group v-model="formObj.ccQuestionType"> + <el-radio label="鏈夐棶棰�">鏈夐棶棰�</el-radio> + <el-radio label="鏃犻棶棰�">鏃犻棶棰�</el-radio> + <el-radio label="宸茶В鍐�">宸茶В鍐�</el-radio> + </el-radio-group> + </el-form-item> + <el-form-item label="绾跨储缁撹" prop="ccConclusion"> + <el-input v-model="formObj.ccConclusion"></el-input> + </el-form-item> + <el-form-item label="璇︾粏鎻忚堪" prop="ccDetails"> + <el-input + v-model="formObj.ccDetails" + type="textarea" + placeholder="璇疯緭鍏ヨ鎯�" + ></el-input> + </el-form-item> + </el-form> + <template #footer> + <el-button @click="onCancel">鍙栨秷</el-button> + <el-button type="primary" :loading="loading" @click="onSubmit" + >纭畾</el-button + > + </template> + </el-dialog> +</template> + +<script setup> +import { reactive, ref, watch, computed } from 'vue'; +import { useFormConfirm } from '@/composables/formConfirm'; +import clueConclusionApi from '@/api/clue/clueConclusionApi'; + +const props = defineProps({ + clueId: Number +}); + +watch( + () => props.clueId, + () => { + getConclusion(); + } +); + +// 鎺ㄩ�佺姸鎬� +const pushing = ref(false); + +// 绾跨储缁撹 +const conclusion = ref({}); + +// 涓婃姤寮瑰嚭妗� +const dialogShow = ref(false); +const { formObj, formRef, onSubmit, onCancel, clear } = + useFormConfirm({ + submit: { + do: submit + }, + cancel: { + do: cancel + } + }); +const loading = ref(false); +// 琛ㄥ崟妫�鏌ヨ鍒� +const rules = reactive({ + ccQuestionType: [ + { + required: true, + message: '闂绫诲瀷涓嶈兘涓虹┖', + trigger: 'change' + } + ], + ccConclusion: [ + { + required: true, + message: '绾跨储缁撹涓嶈兘涓虹┖', + trigger: 'blur' + } + ], + ccDetails: [ + { + required: true, + message: '璇︾粏鎻忚堪涓嶈兘涓虹┖', + trigger: 'blur' + } + ] +}); + +// 鎵撳紑涓婃姤鍙嶉瀵硅瘽妗� +function openDialog() { + dialogShow.value = true; +} + +function submit() { + formObj.value.cid = props.clueId; + return uploadConclusion(); +} +function cancel() { + dialogShow.value = false; +} + +/** + * 涓婁紶绾跨储缁撹 + */ +function uploadConclusion() { + loading.value = true; + return clueConclusionApi + .uploadConclusion(formObj.value) + .then(() => { + dialogShow.value = false; + clear(); + getConclusion(); + }) + .finally(() => { + loading.value = false; + }); +} + +/** + * 鑾峰彇绾跨储缁撹 + */ +function getConclusion() { + clueConclusionApi.getConclusion(props.clueId).then((res) => { + conclusion.value = res; + }); +} + +function pushConclusion() { + clueConclusionApi + .pushConclusion([conclusion.value.ccId]) + .then(() => { + pushing.value = true; + }); +} + +const pushText = computed(() => { + return conclusion.value.ccUploaded ? '宸叉帹閫�' : '鎺ㄩ�侀棶棰�'; +}); +</script> +<style scoped> +.descriptions-item { + /* background: aqua; */ +} +</style> -- Gitblit v1.9.3