riku
2023-10-31 1f96f089eb3546c682313d29513be04ac72e2de5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<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>
          <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>
        <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 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>