supervision-vue/src/components/home/work/my-fav.vue

<template>
    <div class="table-container" v-loading="loading">
        <el-table :data="favs">
            <el-table-column type="expand">
                <template #default="{ row }">
                        <div class="row mt-12">
                            <div class="col col-12">
                                <label>样本源头编号</label>
                                <span>{{ row.originId }}</span>
                            </div>
                            <div class="col col-6">
                                <label>问题发现时间</label>
                                <span>{{ row.discoveryTime }}</span>
                            </div>
                            <div class="col col-6">
                                <label>问题发生时间</label>
                                <span>{{ row.happenTime || "/" }}</span>
                            </div>
                            <div class="col col-6">
                                <label>问题录入时间</label>
                                <span>{{ row.crtTime || "/" }}</span>
                            </div>
                            <div class="col col-6">
                                <label>问题来源</label>
                                <span>{{ row.problemSources }}</span>
                            </div>
                            <div class="col col-6">
                                <label>业务类别</label>
                                <span>{{ row.businessTypeName }}</span>
                            </div>
                            <div class="col col-6">
                                <label>涉及警种</label>
                                <span>{{ row.policeTypeName || "/" }}</span>
                            </div>
                            <div class="col col-12">
                                <label>涉嫌问题</label>
                                <span>{{
                                    getInvolveProblem(row.involveProblem, dict.suspectProblem) || "/"
                                }}</span>
                            </div>
                            <div class="col col-6" v-if="row.responderName">
                                <label>投诉反映人</label>
                                <span>{{ row.responderName }}</span>
                            </div>
                            <div class="col col-6" v-if="row.contactPhone">
                                <label>联系电话</label>
                                <span>{{ row.contactPhone }}</span>
                            </div>
                            <div class="col col-6">
                                <label>涉及单位</label>
                                <span>{{ row.involveDepartName || "/" }}</span>
                            </div>
                        </div>
                        <div class="row mt-12">
                            <div class="col col-24">
                                <label>事情简要描述</label>
                                <span>{{ row.thingDesc }}</span>
                            </div>
                        </div>
                    </template>
            </el-table-column>
            <el-table-column
                label="问题发现时间"
                prop="discoveryTime"
                width="164"
            />
            <el-table-column
                label="问题来源"
                prop="problemSources"
                width="84"
            />
            <el-table-column
                label="业务类别"
                prop="businessTypeName"
                width="98"
            />
            <el-table-column label="涉嫌问题" width="100" >
                <template #default="{ row }">
                    <span>{{
                        getInvolveProblem(row.involveProblem, dict.suspectProblem)
                    }}</span>
                </template>
                
            </el-table-column>
            <el-table-column
                label="问题内容"
                prop="thingDesc"
                show-overflow-tooltip
            />
            <el-table-column label="办理状态" width="140" align="center">
                    <template #default="{ row }">
                        <el-tag
                            >{{
                                getDictLable(
                                    dict.processingStatus,
                                    row.processingStatus
                                )
                            }}</el-tag
                        >
                    </template>
                </el-table-column>
                <el-table-column label="流程节点" width="120" show-overflow-tooltip>
                    <template #default="{ row }">
                        <span>{{
                            flowNodes.filter(
                                (item) => item.flowKey === row.flowKey
                            )[0]?.flowName
                        }}</span>
                    </template>
                </el-table-column>
            <el-table-column label="操作" width="98">
                <template #default="{ row }">
                    <el-button type="primary" link @click="handleAction(row)"
                        >立即处理</el-button
                    >
                </template>
            </el-table-column>
        </el-table>
    </div>

    <negative-dialog
        v-model="show"
        :id="activeNegativeId"
        @change="getList"
        @close="show = false"
    />
</template>
<script setup>
import { listFav } from "@/api/work/fav";
import { getDictLable, getInvolveProblem } from "@/utils/util";
import useCatchStore from "@/stores/modules/catch";

const catchStore = useCatchStore();
const dict = catchStore.getDicts(["processingStatus", "suspectProblem"]);
const flowNodes = catchStore.getFlowNodes();

const favs = ref([]);

const loading = ref(true);

function getList() {
    loading.value = true;
    listFav({
        current: 1,
        size: 100,
    }).then((data) => {
        favs.value = data.records;
        loading.value = false
    });
}

onMounted(() => {
    getList();
});

const show = ref(false);
const activeNegativeId = ref("");

function handleAction(row) {
    show.value = true;
    activeNegativeId.value = row.negativeId;
}
</script>
<style lang="scss" scoped>
</style>