数字督察一体化平台-前端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

322 lines
12 KiB

<template>
<div class="container">
<header>
<el-form :label-width="80">
<el-row>
<el-col :span="6"> </el-col>
</el-row>
<div class="form-row flex">
<label class="text-center">基本信息</label>
<div class="flex wrap query-box">
<div style="width: 340px">
<el-form-item label="受理时间">
<date-time-range-picker-ext
v-model="query.discoveryTime"
/>
</el-form-item>
</div>
<el-input
placeholder="具体内容"
v-model="query.thingDesc"
clearable
style="width: 260px"
/>
<el-select
style="width: 160px"
placeholder="初访重访"
clearable
v-model="query.initialPetition"
>
<el-option
v-for="item in dict.initialPetition"
:key="item.id"
:label="item.dictLabel"
:value="item.dictValue"
/>
</el-select>
</div>
</div>
<div class="form-row flex">
<label class="text-center">核查情况</label>
<div class="flex wrap query-box">
<div style="width: 160px">
<depart-tree-select
v-model="query.involveDepartId"
placeholder="涉及单位"
/>
</div>
<div style="width: 160px">
<depart-tree-select
v-model="query.handleDepartId"
placeholder="办理单位"
/>
</div>
<el-input
placeholder="处理情况简要描述"
v-model="query.checkStatusDesc"
clearable
style="width: 260px"
/>
<div class="flex gap-4">
<el-select
v-model="query.blameKey"
style="width: 90px"
@change="delete query.blameValue"
>
<el-option value="name" label="姓名" />
<el-option value="empNo" label="警号" />
<el-option value="idCode" label="身份证" />
</el-select>
<el-input
placeholder="问责人员(民警、辅警)"
v-model="query.blameValue"
clearable
style="width: 190px"
/>
</div>
<el-select
style="width: 160px"
placeholder="办理状态"
clearable
v-model="query.processingStatus"
multiple
>
<el-option
v-for="item in dict.processingStatus"
:key="item.id"
:label="item.dictLabel"
:value="item.dictValue"
/>
</el-select>
</div>
</div>
</el-form>
<div class="flex between mt-20 mb-26">
<div>
<el-button type="primary" @click="handleExport"
>数据导出</el-button
>
</div>
<div>
<el-button type="primary" @click="getList">
<template #icon
><icon name="el-icon-Search"
/></template>
查询</el-button
>
<el-button @click="reset">重置</el-button>
</div>
</div>
</header>
<main>
<div class="table-container" v-loading="loading">
<el-table :data="list" ref="tableRef">
<el-table-column
label="投诉渠道"
prop="channelForFilingComplaints"
width="90"
align="center"
/>
<el-table-column
label="受理层级"
prop="acceptanceLevel"
width="90"
/>
<el-table-column
label="受理时间"
prop="discoveryTime"
width="160"
/>
<el-table-column
label="投诉人"
prop="responderName"
width="90"
/>
<el-table-column
label="投诉人电话"
prop="responderPhone"
width="120"
/>
<el-table-column
label="被投诉单位"
prop="involveDepartName"
width="160"
show-overflow-tooltip
/>
<el-table-column
label="办理单位"
show-overflow-tooltip
width="160"
>
<template #default="{ row }">
<span
>{{ row.handleSecondDepartName
}}{{ row.handleThreeDepartName }}</span
>
</template>
</el-table-column>
<el-table-column
label="具体内容"
prop="thingDesc"
show-overflow-tooltip
width="200"
/>
<el-table-column
label="问题类别"
prop="involveProblem"
width="200"
>
<template #default="{ row }">
<span>{{
getInvolveProblem(
row.involveProblem,
dict.suspectProblem
)
}}</span>
</template>
</el-table-column>
<el-table-column
label="业务类别"
prop="businessTypeName"
width="200"
show-overflow-tooltip
/>
<el-table-column
label="处理情况简要描述"
prop="checkStatusDesc"
show-overflow-tooltip
width="200"
/>
<el-table-column label="初重信访" align="center" width="85">
<template #default="{ row }">
<span>{{
getDictLable(
dict.initialPetition,
row.initialPetition
)
}}</span>
</template>
</el-table-column>
<el-table-column label="群众集访" width="85" align="center">
<template #default="{ row }">
<span v-if="row.massVisits === true">是</span>
<span v-if="row.massVisits === false">否</span>
</template>
</el-table-column>
<el-table-column label="办理状态" width="100">
<template #default="{ row }">
<el-tag
:type="
row.processingStatus ===
ProcessingStatus.COMPLETED
? 'success'
: 'primary'
"
v-if="row.processingStatus"
>{{
getDictLable(
dict.processingStatus,
row.processingStatus
)
}}</el-tag
>
</template>
</el-table-column>
<el-table-column label="操作" width="80" fixed="right">
<template #default="{ row }">
<el-button
type="primary"
link
@click="handleAction(row)"
v-if="row.id"
>详情</el-button
>
</template>
</el-table-column>
</el-table>
</div>
<div class="flex end mt-8">
<el-pagination
@size-change="getList"
@current-change="getList"
:page-sizes="[10, 20, 50]"
v-model:page-size="query.size"
v-model:current-page="query.current"
layout="total, sizes, prev, pager, next"
:total="total"
>
</el-pagination>
</div>
</main>
</div>
<negative-dialog
v-model="show"
:id="activeNegativeId"
@close="show = false"
ref="negativeDialogRef"
/>
</template>
<script setup>
import { BASE_PATH } from "@/api/request";
import { ProcessingStatus } from "@/enums/flowEnums";
import { ProblemSources } from "@/enums/dictEnums";
import { listNegativeXf } from "@/api/books";
import { getDictLable, getInvolveProblem } from "@/utils/util";
import useCatchStore from "@/stores/modules/catch";
const catchStore = useCatchStore();
const dict = catchStore.getDicts([
"initialPetition",
"processingStatus",
"suspectProblem"
]);
const query = ref({
current: 1,
size: 10,
blameKey: "name",
});
const list = ref([]);
const total = ref(0);
const loading = ref(false);
function getList() {
loading.value = true;
listNegativeXf(query.value, ProblemSources.GABXF).then((data) => {
list.value = data.records;
total.value = data.total;
loading.value = false;
});
}
function reset() {
query.value = {
current: 1,
size: 10,
blameKey: "name",
};
getList();
}
onMounted(() => {
getList();
});
const show = ref(false);
const activeNegativeId = ref("");
function handleAction(row) {
show.value = true;
activeNegativeId.value = row.id;
}
function handleExport() {
window.open(`${BASE_PATH}/negative/books/export/xf/${ProblemSources.GABXF}?` + new URLSearchParams(query.value).toString())
}
</script>
<style lang="scss" scoped>
</style>