<template>
|
<div class="fy-h2">线索问题</div>
|
<template v-if="questionList.length > 0">
|
<el-descriptions
|
v-for="(item, index) in questionList"
|
:title="'问题 ' + item.cqUid"
|
:key="index"
|
:column="2"
|
size="small"
|
border
|
>
|
<template #extra>
|
<el-button-group>
|
<el-button
|
type="warning"
|
size="small"
|
plain
|
icon="Upload"
|
@click="pushQuestion(item)"
|
:disabled="item.pushing ? true : item.cqUploaded"
|
>{{
|
item.cqUploaded
|
? '已推送'
|
: item.pushing
|
? '推送中'
|
: '推送问题'
|
}}</el-button
|
>
|
<el-button
|
type="primary"
|
size="small"
|
@click="checkQuestion(item)"
|
>问题详情</el-button
|
>
|
</el-button-group>
|
</template>
|
<el-descriptions-item
|
width="1px"
|
min-width="70px"
|
label="问题编号"
|
>
|
{{ item.cqUid }}
|
</el-descriptions-item>
|
<el-descriptions-item label="所在街镇">
|
{{ item.cqStreet }}
|
</el-descriptions-item>
|
<el-descriptions-item label="问题描述">
|
{{ item.cqDescription }}
|
</el-descriptions-item>
|
<!-- <el-descriptions-item label="详细地址">
|
{{ item.cqAddress }}
|
</el-descriptions-item>
|
<el-descriptions-item label="经度">
|
{{ item.cqLongitude }}
|
</el-descriptions-item>
|
<el-descriptions-item label="纬度">
|
{{ item.cqLatitude }}
|
</el-descriptions-item>
|
<el-descriptions-item label="创建时间">
|
{{ item.cqCreateTime }}
|
</el-descriptions-item> -->
|
</el-descriptions>
|
<div class="btn-wrap">
|
<el-button 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
|
:clueId="clueId"
|
v-model:show="dialogShow"
|
:question="selectedQuestion"
|
@on-submit="getQuestion"
|
></QuestionDetail>
|
</template>
|
|
<script setup>
|
import { ref, watch, computed } from 'vue';
|
import clueQuestionApi from '@/api/clue/clueQuestionApi';
|
import QuestionDetail from './QuestionDetail.vue';
|
|
const props = defineProps({
|
clueId: Number
|
});
|
|
// 线索结论
|
const questionList = ref([]);
|
// 上报弹出框
|
const dialogShow = ref(false);
|
const selectedQuestion = ref();
|
|
watch(
|
() => props.clueId,
|
() => {
|
getQuestion();
|
}
|
);
|
|
// 打开上报反馈对话框
|
function openDialog() {
|
selectedQuestion.value = undefined;
|
dialogShow.value = true;
|
}
|
|
// 查看问题详情
|
function checkQuestion(item) {
|
selectedQuestion.value = item;
|
dialogShow.value = true;
|
}
|
/**
|
* 获取线索结论
|
*/
|
function getQuestion() {
|
clueQuestionApi.getQuestion(props.clueId).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>
|