<template>
|
<div class="fy-h2">线索问题</div>
|
<template v-if="questionList.length > 0">
|
<template v-for="(item, index) in questionList" :key="index">
|
<DescriptionsList :title="item.cqUid">
|
<template #extra>
|
<div>
|
<el-button
|
v-if="!clueData.cuploaded"
|
type="danger"
|
size="small"
|
icon="Delete"
|
@click="deleteQuestion(item)"
|
></el-button>
|
<el-button
|
type="primary"
|
size="small"
|
@click="checkQuestion(item)"
|
>{{
|
clueData.cuploaded ? '问题详情' : '修改问题'
|
}}</el-button
|
>
|
</div>
|
</template>
|
<DescriptionsListItem
|
label="问题名称"
|
:content="item.cqName"
|
/>
|
<DescriptionsListItem
|
label="所在街镇"
|
:content="item.cqStreet"
|
/>
|
<DescriptionsListItem
|
label="问题描述"
|
:content="item.cqDescription"
|
/>
|
</DescriptionsList>
|
<!-- <el-divider /> -->
|
</template>
|
<div class="btn-wrap">
|
<el-button
|
v-if="!clueData.cuploaded"
|
type="primary"
|
@click="openDialog"
|
>添加问题</el-button
|
>
|
</div>
|
</template>
|
<div v-else class="fy-dashed-border">
|
<el-empty :image-size="50" description="无线索问题">
|
<el-button type="primary" @click="openDialog"
|
>反馈上报</el-button
|
>
|
</el-empty>
|
</div>
|
<QuestionDetail
|
:clueData="clueData"
|
:uploaded="clueData.cuploaded"
|
v-model:show="dialogShow"
|
:question="selectedQuestion"
|
@on-submit="getQuestion"
|
></QuestionDetail>
|
</template>
|
|
<script setup>
|
import { ref, watch, computed, inject } from 'vue';
|
import clueQuestionApi from '@/api/clue/clueQuestionApi';
|
import QuestionDetail from './QuestionDetail.vue';
|
import {
|
useMessageBoxTip,
|
useMessageBox
|
} from '@/composables/messageBox';
|
|
// 决定当前是否是内部线索相关操作
|
const isInternal = inject('isInternal', false);
|
|
const props = defineProps({
|
// clueId: Number,
|
clueData: {
|
type: Object,
|
default: () => {
|
return {};
|
}
|
}
|
});
|
|
// 线索结论
|
const questionList = ref([]);
|
// 上报弹出框
|
const dialogShow = ref(false);
|
const selectedQuestion = ref();
|
const deleteLoading = ref(false);
|
|
watch(
|
() => props.clueData,
|
() => {
|
getQuestion();
|
}
|
);
|
|
// 打开上报反馈对话框
|
function openDialog() {
|
selectedQuestion.value = undefined;
|
dialogShow.value = true;
|
}
|
|
// 查看问题详情
|
function checkQuestion(item) {
|
selectedQuestion.value = item;
|
dialogShow.value = true;
|
}
|
|
// 删除问题
|
function deleteQuestion(item) {
|
useMessageBoxTip({
|
confirmMsg: '确认是否删除问题',
|
confirmTitle: '删除问题',
|
onConfirm: () => {
|
return clueQuestionApi
|
.deleteQuestion(item.cqId)
|
.then((res) => {
|
if (res) {
|
const index = questionList.value.indexOf(item);
|
questionList.value.splice(index, 1);
|
}
|
})
|
.finally(() => (deleteLoading.value = true));
|
}
|
});
|
}
|
|
/**
|
* 获取线索结论
|
*/
|
function getQuestion() {
|
clueQuestionApi
|
.getQuestion(props.clueData.cid, isInternal)
|
.then((res) => {
|
questionList.value = res;
|
});
|
}
|
|
function pushQuestion(item) {
|
clueQuestionApi.pushQuestion([item.cqId]).then(() => {
|
item.pushing = true;
|
});
|
}
|
</script>
|
<style scoped>
|
.btn-wrap {
|
display: flex;
|
justify-content: center;
|
padding: 16px;
|
}
|
</style>
|
