5 changed files with 2315 additions and 0 deletions
@ -0,0 +1,458 @@
|
||||
<template> |
||||
<div class="container"> |
||||
<header> |
||||
<el-form :label-width="114"> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="问题来源"> |
||||
<el-select |
||||
v-model="query.sourceTableSubOneList" |
||||
clearable |
||||
filterable |
||||
multiple |
||||
collapse-tags |
||||
placeholder="请选择来源" |
||||
style="width: 100%" |
||||
> |
||||
<el-option |
||||
v-for="item in dict.ts12389SourceTableSubOneList" |
||||
:key="item.value" |
||||
:value="item.value" |
||||
:label="item.label" |
||||
/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="信件编号"> |
||||
<el-input |
||||
placeholder="请输入编号" |
||||
v-model="query.originId" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="登记/受理时间"> |
||||
<date-time-range-picker-ext |
||||
v-model="query.discoveryTimeList" |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="来件人"> |
||||
<el-input |
||||
placeholder="来件人姓名、身份证号码、联系电话" |
||||
v-model="query.personInfo" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="涉及二级机构" prop="secondDepartName"> |
||||
<depart-tree-select |
||||
v-model="query.secondDepartId" |
||||
:check-strictly="true" |
||||
@node-click="(row) => (query.secondDepartName = row.shortName)" |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="办理方式"> |
||||
<el-select |
||||
v-model="query.handleMethod" |
||||
placeholder="全部" |
||||
clearable |
||||
> |
||||
<el-option value="0" label="自办"/> |
||||
<el-option value="1" label="下发"/> |
||||
</el-select> |
||||
|
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="办理状态"> |
||||
<el-select |
||||
v-model="query.status" |
||||
clearable |
||||
placeholder="办理状态" |
||||
> |
||||
<el-option value="0" label="未办理"/> |
||||
<el-option value="1" label="已办理"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="标签"> |
||||
<el-select |
||||
placeholder="全部" |
||||
clearable |
||||
v-model="query.tags" |
||||
multiple |
||||
collapse-tags |
||||
> |
||||
<el-option |
||||
v-for="item in dict.sfssTags" |
||||
:key="item.id" |
||||
:value="item.dictValue" |
||||
:label="item.dictLabel" |
||||
/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="来件内容"> |
||||
<el-input |
||||
placeholder="请输入来件内容" |
||||
v-model="query.thingDesc" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="是否重复件"> |
||||
<el-select |
||||
v-model="query.repeatt" |
||||
placeholder="全部" |
||||
clearable |
||||
> |
||||
<el-option value="0" label="否"/> |
||||
<el-option value="1" label="是"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="核查结论" > |
||||
<el-select v-model="query.checkStatusList" clearable multiple |
||||
style="width: 280px"> |
||||
<el-option v-for="item in dict.checkStatus" :value="item.dictValue" :label="item.dictLabel"></el-option> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="初核材料"> |
||||
<el-select |
||||
v-model="query.initialReviewFileList" |
||||
placeholder="全部" |
||||
clearable |
||||
multiple |
||||
> |
||||
<el-option value="0" label="未上传"/> |
||||
<el-option value="1" label="已上传"/> |
||||
<el-option value="2" label="超时上传"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
|
||||
</el-form> |
||||
<div class="mb-25 flex between"> |
||||
<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> |
||||
<div class="table-container" v-loading="loading"> |
||||
<el-table :data="list"> |
||||
<el-table-column label="信件编号" width="130" prop="originId" show-overflow-tooltip/> |
||||
<el-table-column label="来源" width="100" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ row.sourceTablePath }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column |
||||
label="登记/受理时间" |
||||
width="170" |
||||
prop="discoveryTime" |
||||
:formatter="(_, __, v) => v ? timeFormat(v, 'yyyy-mm-dd hh:MM:ss') : '/'" |
||||
show-overflow-tooltip |
||||
/> |
||||
<el-table-column label="来件人姓名" width="100" prop="responderName" |
||||
:formatter="row => row.responderName ? row.responderName : '匿名'"/> |
||||
<el-table-column label="身份证号" width="100" prop="responderIdCode" |
||||
:formatter="row => row.responderIdCode ? row.responderIdCode : '无'" show-overflow-tooltip/> |
||||
<el-table-column label="联系电话" width="100" prop="responderPhone" |
||||
:formatter="row => row.responderPhone ? row.responderPhone : '无'" show-overflow-tooltip/> |
||||
<el-table-column label="被投诉机构" width="130" prop="secondDepartName"/> |
||||
<el-table-column label="来信内容" width="100" prop="thingDesc" show-overflow-tooltip/> |
||||
<el-table-column label="涉嫌问题" width="100" prop="involveProblemStr" show-overflow-tooltip/> |
||||
<el-table-column label="是否重复件" width="100"> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.yesNo, row.repeatt) }} |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column label="初核限时" width="150" align="center"> |
||||
<template #default="{ row }"> |
||||
<!-- 有状态:显示状态文案 --> |
||||
<el-tag v-if="row.gwf3>=1" :type="row.gwf3 === '2' ? 'danger' : 'success'"> |
||||
{{ row.gwf3 === '2' ? '超时完成初核' : '按时完成初核' }} |
||||
</el-tag> |
||||
|
||||
<!-- 无状态:显示倒计时 --> |
||||
<countdown v-else :time="Number(row.remainingDuration || 0)"/> |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column label="标签" width="100" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.sfssTags, row.tag) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="办结情况" width="100" prop="completionStatus"> |
||||
<template #default="{ row }"> |
||||
{{ |
||||
row.completionStatus === '1' ? '程序办结' : |
||||
row.completionStatus === '2' ? '已解决合理诉求' : |
||||
'/' |
||||
}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="群众认可" width="100" prop="publicRecognition"> |
||||
<template #default="{ row }"> |
||||
{{ |
||||
row.publicRecognition === '1' ? '认可' : |
||||
row.publicRecognition === '2' ? '不认可' : |
||||
row.publicRecognition === '3' ? '不接电话' : |
||||
'/' |
||||
}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="办理方式" width="100"> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.handleMethodType, row.handleMethod) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="业务类别" width="100" prop="businessTypeName"/> |
||||
<el-table-column label="核查结论" width="140" prop="checkStatus" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.checkStatus, row.checkStatus) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="状态" prop="status" width="100"> |
||||
<template #default="{ row }"> |
||||
<span :style="row.status === '0' ? 'color: red' : ''"> |
||||
{{ |
||||
row.status === '0' ? '未办理' : |
||||
row.status === '1' ? '已办理' : |
||||
'-' |
||||
}} |
||||
</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="操作" width="100" fixed="right"> |
||||
<template #default="{ row }"> |
||||
<el-button type="primary" link @click="handleWatchDetail(row)">查看详情</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> |
||||
</div> |
||||
|
||||
<!-- 查看详情 --> |
||||
<complaint_detail |
||||
v-model="detailShow" |
||||
:id="activeId" |
||||
:dict="dict"/> |
||||
|
||||
</template> |
||||
|
||||
|
||||
<script setup> |
||||
import { ref, watch, computed, onMounted } from 'vue'; |
||||
import {timeFormat} from "@/utils/util"; |
||||
import useCatchStore from "@/stores/modules/catch"; |
||||
import { |
||||
exportData, |
||||
getComplaintCollectionPage |
||||
} from "@/api/data/complaintCollection.ts"; |
||||
import Complaint_detail from "@/components/data/complaint_detail.vue"; |
||||
|
||||
|
||||
const catchStore = useCatchStore(); |
||||
|
||||
const query = ref({ |
||||
size: 10, |
||||
current: 1, |
||||
sourceTableList: ['17'], |
||||
sourceTableSubOneList: [], |
||||
initialReviewFileList: [], |
||||
}); |
||||
|
||||
|
||||
|
||||
const list = ref([]); |
||||
const total = ref(0); |
||||
const loading = ref(false) |
||||
const getList = async () => { |
||||
loading.value = true; |
||||
|
||||
// 确保始终包含默认来源 |
||||
if (!query.value.sourceTableList.includes('17')) { |
||||
query.value.sourceTableList = ['17', ...query.value.sourceTableList]; |
||||
} |
||||
|
||||
const params = { |
||||
...query.value, |
||||
} |
||||
|
||||
let res = await getComplaintCollectionPage(params); |
||||
list.value = res.complaintCollectionPageDTOS; |
||||
total.value = res.total; |
||||
loading.value = false; |
||||
} |
||||
|
||||
function reset() { |
||||
query.value = { |
||||
size: 10, |
||||
current: 1, |
||||
sourceTableList: ['17'], |
||||
sourceTableSubOneList: [], |
||||
initialReviewFileList: [], |
||||
}; |
||||
getList(); |
||||
} |
||||
|
||||
onMounted(() => { |
||||
getList() |
||||
}) |
||||
|
||||
const storeDict = computed(() => |
||||
catchStore.getDicts([ |
||||
"businessType", |
||||
"suspectProblem", |
||||
"policeType", |
||||
"hostLevel", |
||||
"timeLimit", |
||||
"approvalFlow", |
||||
"specialSupervision", |
||||
"checkStatus", |
||||
"sfssSourceTable", |
||||
"sfssTags", |
||||
"accountabilityTarget" |
||||
]) || {} |
||||
); |
||||
|
||||
const ts12389SourceTableSubOneList = computed(() => { |
||||
const list = storeDict.value.sfssSourceTable || [] |
||||
|
||||
// 二级:remark 等于12389投诉的dictValue |
||||
const children = list |
||||
.filter(d => d.remark === '17') |
||||
.sort((a, b) => (a.dictSort ?? 0) - (b.dictSort ?? 0)) |
||||
|
||||
return children.map(c => ({ |
||||
label: c.dictLabel, |
||||
value: String(c.dictValue), |
||||
})) |
||||
}) |
||||
|
||||
const localDict = { |
||||
yesNo: [ |
||||
{id: 1, dictLabel: "是", dictValue: "1"}, |
||||
{id: 2, dictLabel: "否", dictValue: "0"}, |
||||
], |
||||
handleMethodType: [ |
||||
{id: 1, dictLabel: "自办", dictValue: "0"}, |
||||
{id: 2, dictLabel: "下发", dictValue: "1"}, |
||||
], |
||||
}; |
||||
|
||||
const dict = computed(() => ({ |
||||
...storeDict.value, |
||||
...localDict, |
||||
ts12389SourceTableSubOneList: ts12389SourceTableSubOneList.value, |
||||
})); |
||||
|
||||
function getDictLabel(list, value) { |
||||
if (!Array.isArray(list)) return '/' |
||||
|
||||
if (value === null || value === undefined || value === '') return '/' |
||||
|
||||
let values = [] |
||||
|
||||
if (Array.isArray(value)) { |
||||
values = value |
||||
} |
||||
else if (typeof value === 'string' && value.includes(',')) { |
||||
values = value.split(',').map(v => v.trim()) |
||||
} |
||||
else { |
||||
values = [value] |
||||
} |
||||
|
||||
const labels = values |
||||
.map(v => { |
||||
const item = list.find(d => d.dictValue == v) |
||||
return item?.dictLabel |
||||
}) |
||||
.filter(Boolean) |
||||
|
||||
return labels.length ? labels.join(',') : '/' |
||||
} |
||||
|
||||
const detailShow = ref(false) |
||||
const activeId = ref("") |
||||
const handleWatchDetail = async (row) => { |
||||
activeId.value = row.id |
||||
detailShow.value = true |
||||
} |
||||
|
||||
const handleExport = async () => { |
||||
let body = { |
||||
...query.value |
||||
} |
||||
await exportData(body); |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.el-form-item .el-form-item { |
||||
margin-bottom: 18px; |
||||
} |
||||
|
||||
:deep() { |
||||
.el-form-item--label-right .el-form-item__label { |
||||
text-align: right; |
||||
line-height: 32px; |
||||
margin-bottom: 0; |
||||
} |
||||
} |
||||
|
||||
p { |
||||
margin: 0; |
||||
line-height: 1.4; |
||||
} |
||||
|
||||
.dialog-footer { |
||||
display: flex; |
||||
justify-content: flex-end; |
||||
padding: 0 24px 16px; |
||||
} |
||||
</style> |
||||
// 这是ai写的页面 |
||||
@ -0,0 +1,459 @@
|
||||
<template> |
||||
<div class="container"> |
||||
<header> |
||||
<el-form :label-width="114"> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="问题来源"> |
||||
<el-select |
||||
v-model="query.sourceTableSubOneList" |
||||
clearable |
||||
filterable |
||||
multiple |
||||
collapse-tags |
||||
placeholder="请选择来源" |
||||
style="width: 100%" |
||||
> |
||||
<el-option |
||||
v-for="item in dict.gabxfSourceTableSubOneList" |
||||
:key="item.value" |
||||
:value="item.value" |
||||
:label="item.label" |
||||
/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="信件编号"> |
||||
<el-input |
||||
placeholder="请输入编号" |
||||
v-model="query.originId" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="登记/受理时间"> |
||||
<date-time-range-picker-ext |
||||
v-model="query.discoveryTimeList" |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="来件人"> |
||||
<el-input |
||||
placeholder="来件人姓名、身份证号码、联系电话" |
||||
v-model="query.personInfo" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="涉及二级机构" prop="secondDepartName"> |
||||
<depart-tree-select |
||||
v-model="query.secondDepartId" |
||||
:check-strictly="true" |
||||
@node-click="(row) => (query.secondDepartName = row.shortName)" |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="办理方式"> |
||||
<el-select |
||||
v-model="query.handleMethod" |
||||
placeholder="全部" |
||||
clearable |
||||
> |
||||
<el-option value="0" label="自办"/> |
||||
<el-option value="1" label="下发"/> |
||||
</el-select> |
||||
|
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="办理状态"> |
||||
<el-select |
||||
v-model="query.status" |
||||
clearable |
||||
placeholder="办理状态" |
||||
> |
||||
<el-option value="0" label="未办理"/> |
||||
<el-option value="1" label="已办理"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="标签"> |
||||
<el-select |
||||
placeholder="全部" |
||||
clearable |
||||
v-model="query.tags" |
||||
multiple |
||||
collapse-tags |
||||
> |
||||
<el-option |
||||
v-for="item in dict.sfssTags" |
||||
:key="item.id" |
||||
:value="item.dictValue" |
||||
:label="item.dictLabel" |
||||
/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="来件内容"> |
||||
<el-input |
||||
placeholder="请输入来件内容" |
||||
v-model="query.thingDesc" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="是否重复件"> |
||||
<el-select |
||||
v-model="query.repeatt" |
||||
placeholder="全部" |
||||
clearable |
||||
> |
||||
<el-option value="0" label="否"/> |
||||
<el-option value="1" label="是"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="核查结论" > |
||||
<el-select v-model="query.checkStatusList" clearable multiple |
||||
style="width: 280px"> |
||||
<el-option v-for="item in dict.checkStatus" :value="item.dictValue" :label="item.dictLabel"></el-option> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="初核材料"> |
||||
<el-select |
||||
v-model="query.initialReviewFileList" |
||||
placeholder="全部" |
||||
clearable |
||||
multiple |
||||
> |
||||
<el-option value="0" label="未上传"/> |
||||
<el-option value="1" label="已上传"/> |
||||
<el-option value="2" label="超时上传"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
</el-form> |
||||
<div class="mb-25 flex between"> |
||||
<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> |
||||
<div class="table-container" v-loading="loading"> |
||||
<el-table :data="list"> |
||||
<el-table-column label="信件编号" width="130" prop="originId" show-overflow-tooltip/> |
||||
<el-table-column label="来源" width="100" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ row.sourceTablePath }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column |
||||
label="登记/受理时间" |
||||
width="170" |
||||
prop="discoveryTime" |
||||
:formatter="(_, __, v) => v ? timeFormat(v, 'yyyy-mm-dd hh:MM:ss') : '/'" |
||||
show-overflow-tooltip |
||||
/> |
||||
<el-table-column label="来件人姓名" width="100" prop="responderName" |
||||
:formatter="row => row.responderName ? row.responderName : '匿名'"/> |
||||
<el-table-column label="身份证号" width="100" prop="responderIdCode" |
||||
:formatter="row => row.responderIdCode ? row.responderIdCode : '无'" show-overflow-tooltip/> |
||||
<el-table-column label="联系电话" width="100" prop="responderPhone" |
||||
:formatter="row => row.responderPhone ? row.responderPhone : '无'" show-overflow-tooltip/> |
||||
<el-table-column label="被投诉机构" width="130" prop="secondDepartName"/> |
||||
<el-table-column label="来信内容" width="100" prop="thingDesc" show-overflow-tooltip/> |
||||
<el-table-column label="涉嫌问题" width="100" prop="involveProblemStr" show-overflow-tooltip/> |
||||
<el-table-column label="是否重复件" width="100"> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.yesNo, row.repeatt) }} |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column label="初核限时" width="150" align="center"> |
||||
<template #default="{ row }"> |
||||
<!-- 有状态:显示状态文案 --> |
||||
<el-tag v-if="row.gwf3>=1" :type="row.gwf3 === '2' ? 'danger' : 'success'"> |
||||
{{ row.gwf3 === '2' ? '超时完成初核' : '按时完成初核' }} |
||||
</el-tag> |
||||
|
||||
<!-- 无状态:显示倒计时 --> |
||||
<countdown v-else :time="Number(row.remainingDuration || 0)"/> |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column label="标签" width="100" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.sfssTags, row.tag) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="办结情况" width="100" prop="completionStatus"> |
||||
<template #default="{ row }"> |
||||
{{ |
||||
row.completionStatus === '1' ? '程序办结' : |
||||
row.completionStatus === '2' ? '已解决合理诉求' : |
||||
'/' |
||||
}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="群众认可" width="100" prop="publicRecognition"> |
||||
<template #default="{ row }"> |
||||
{{ |
||||
row.publicRecognition === '1' ? '认可' : |
||||
row.publicRecognition === '2' ? '不认可' : |
||||
row.publicRecognition === '3' ? '不接电话' : |
||||
'/' |
||||
}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="办理方式" width="100"> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.handleMethodType, row.handleMethod) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="业务类别" width="100" prop="businessTypeName"/> |
||||
<el-table-column label="核查结论" width="140" prop="checkStatus" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.checkStatus, row.checkStatus) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="状态" prop="status" width="100"> |
||||
<template #default="{ row }"> |
||||
<span :style="row.status === '0' ? 'color: red' : ''"> |
||||
{{ |
||||
row.status === '0' ? '未办理' : |
||||
row.status === '1' ? '已办理' : |
||||
'-' |
||||
}} |
||||
</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="操作" width="100" fixed="right"> |
||||
<template #default="{ row }"> |
||||
<el-button type="primary" link @click="handleWatchDetail(row)">查看详情</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> |
||||
</div> |
||||
|
||||
<!-- 查看详情 --> |
||||
<complaint_detail |
||||
v-model="detailShow" |
||||
:id="activeId" |
||||
:dict="dict"/> |
||||
|
||||
</template> |
||||
|
||||
|
||||
<script setup> |
||||
import { ref, watch, computed, onMounted } from 'vue'; |
||||
import {timeFormat} from "@/utils/util"; |
||||
import feedback from "@/utils/feedback"; |
||||
import useCatchStore from "@/stores/modules/catch"; |
||||
import { |
||||
exportData, |
||||
getComplaintCollectionPage |
||||
} from "@/api/data/complaintCollection.ts"; |
||||
import Complaint_detail from "@/components/data/complaint_detail.vue"; |
||||
|
||||
|
||||
const catchStore = useCatchStore(); |
||||
|
||||
const query = ref({ |
||||
size: 10, |
||||
current: 1, |
||||
sourceTableList: ['22'], |
||||
sourceTableSubOneList: [], |
||||
initialReviewFileList: [], |
||||
}); |
||||
|
||||
|
||||
|
||||
const list = ref([]); |
||||
const total = ref(0); |
||||
const loading = ref(false) |
||||
const getList = async () => { |
||||
loading.value = true; |
||||
|
||||
// 确保始终包含默认来源 |
||||
if (!query.value.sourceTableList.includes('22')) { |
||||
query.value.sourceTableList = ['22', ...query.value.sourceTableList]; |
||||
} |
||||
|
||||
const params = { |
||||
...query.value, |
||||
} |
||||
|
||||
let res = await getComplaintCollectionPage(params); |
||||
list.value = res.complaintCollectionPageDTOS; |
||||
total.value = res.total; |
||||
loading.value = false; |
||||
} |
||||
|
||||
function reset() { |
||||
query.value = { |
||||
size: 10, |
||||
current: 1, |
||||
sourceTableList: ['22'], |
||||
sourceTableSubOneList: [], |
||||
initialReviewFileList: [], |
||||
}; |
||||
getList(); |
||||
} |
||||
|
||||
onMounted(() => { |
||||
getList() |
||||
}) |
||||
|
||||
const storeDict = computed(() => |
||||
catchStore.getDicts([ |
||||
"businessType", |
||||
"suspectProblem", |
||||
"policeType", |
||||
"hostLevel", |
||||
"timeLimit", |
||||
"approvalFlow", |
||||
"specialSupervision", |
||||
"checkStatus", |
||||
"sfssSourceTable", |
||||
"sfssTags", |
||||
"accountabilityTarget" |
||||
]) || {} |
||||
); |
||||
|
||||
const gabxfSourceTableSubOneList = computed(() => { |
||||
const list = storeDict.value.sfssSourceTable || [] |
||||
|
||||
// 二级:remark 等于公安部信访的dictValue |
||||
const children = list |
||||
.filter(d => d.remark === '22') |
||||
.sort((a, b) => (a.dictSort ?? 0) - (b.dictSort ?? 0)) |
||||
|
||||
return children.map(c => ({ |
||||
label: c.dictLabel, |
||||
value: String(c.dictValue), |
||||
})) |
||||
}) |
||||
|
||||
const localDict = { |
||||
yesNo: [ |
||||
{id: 1, dictLabel: "是", dictValue: "1"}, |
||||
{id: 2, dictLabel: "否", dictValue: "0"}, |
||||
], |
||||
handleMethodType: [ |
||||
{id: 1, dictLabel: "自办", dictValue: "0"}, |
||||
{id: 2, dictLabel: "下发", dictValue: "1"}, |
||||
], |
||||
}; |
||||
|
||||
const dict = computed(() => ({ |
||||
...storeDict.value, |
||||
...localDict, |
||||
gabxfSourceTableSubOneList: gabxfSourceTableSubOneList.value, |
||||
})); |
||||
|
||||
function getDictLabel(list, value) { |
||||
if (!Array.isArray(list)) return '/' |
||||
|
||||
if (value === null || value === undefined || value === '') return '/' |
||||
|
||||
let values = [] |
||||
|
||||
if (Array.isArray(value)) { |
||||
values = value |
||||
} |
||||
else if (typeof value === 'string' && value.includes(',')) { |
||||
values = value.split(',').map(v => v.trim()) |
||||
} |
||||
else { |
||||
values = [value] |
||||
} |
||||
|
||||
const labels = values |
||||
.map(v => { |
||||
const item = list.find(d => d.dictValue == v) |
||||
return item?.dictLabel |
||||
}) |
||||
.filter(Boolean) |
||||
|
||||
return labels.length ? labels.join(',') : '/' |
||||
} |
||||
|
||||
const detailShow = ref(false) |
||||
const activeId = ref("") |
||||
const handleWatchDetail = async (row) => { |
||||
activeId.value = row.id |
||||
detailShow.value = true |
||||
} |
||||
|
||||
const handleExport = async () => { |
||||
let body = { |
||||
...query.value |
||||
} |
||||
await exportData(body); |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.el-form-item .el-form-item { |
||||
margin-bottom: 18px; |
||||
} |
||||
|
||||
:deep() { |
||||
.el-form-item--label-right .el-form-item__label { |
||||
text-align: right; |
||||
line-height: 32px; |
||||
margin-bottom: 0; |
||||
} |
||||
} |
||||
|
||||
p { |
||||
margin: 0; |
||||
line-height: 1.4; |
||||
} |
||||
|
||||
.dialog-footer { |
||||
display: flex; |
||||
justify-content: flex-end; |
||||
padding: 0 24px 16px; |
||||
} |
||||
</style> |
||||
|
||||
// 这是ai写的页面 |
||||
@ -0,0 +1,453 @@
|
||||
<template> |
||||
<div class="container"> |
||||
<header> |
||||
<el-form :label-width="114"> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="问题来源"> |
||||
<el-select |
||||
v-model="query.sourceTableSubOneList" |
||||
clearable |
||||
filterable |
||||
multiple |
||||
collapse-tags |
||||
placeholder="请选择来源" |
||||
style="width: 100%" |
||||
> |
||||
<el-option |
||||
v-for="item in dict.gjxfSourceTableSubOneList" |
||||
:key="item.value" |
||||
:value="item.value" |
||||
:label="item.label" |
||||
/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="信件编号"> |
||||
<el-input |
||||
placeholder="请输入编号" |
||||
v-model="query.originId" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="登记/受理时间"> |
||||
<date-time-range-picker-ext |
||||
v-model="query.discoveryTimeList" |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="来件人"> |
||||
<el-input |
||||
placeholder="来件人姓名、身份证号码、联系电话" |
||||
v-model="query.personInfo" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="涉及二级机构" prop="secondDepartName"> |
||||
<depart-tree-select |
||||
v-model="query.secondDepartId" |
||||
:check-strictly="true" |
||||
@node-click="(row) => (query.secondDepartName = row.shortName)" |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="办理方式"> |
||||
<el-select |
||||
v-model="query.handleMethod" |
||||
placeholder="全部" |
||||
clearable |
||||
> |
||||
<el-option value="0" label="自办"/> |
||||
<el-option value="1" label="下发"/> |
||||
</el-select> |
||||
|
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="办理状态"> |
||||
<el-select |
||||
v-model="query.status" |
||||
clearable |
||||
placeholder="办理状态" |
||||
> |
||||
<el-option value="0" label="未办理"/> |
||||
<el-option value="1" label="已办理"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="标签"> |
||||
<el-select |
||||
placeholder="全部" |
||||
clearable |
||||
v-model="query.tags" |
||||
multiple |
||||
collapse-tags |
||||
> |
||||
<el-option |
||||
v-for="item in dict.sfssTags" |
||||
:key="item.id" |
||||
:value="item.dictValue" |
||||
:label="item.dictLabel" |
||||
/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="来件内容"> |
||||
<el-input |
||||
placeholder="请输入来件内容" |
||||
v-model="query.thingDesc" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="是否重复件"> |
||||
<el-select |
||||
v-model="query.repeatt" |
||||
placeholder="全部" |
||||
clearable |
||||
> |
||||
<el-option value="0" label="否"/> |
||||
<el-option value="1" label="是"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="核查结论" > |
||||
<el-select v-model="query.checkStatusList" clearable multiple |
||||
style="width: 280px"> |
||||
<el-option v-for="item in dict.checkStatus" :value="item.dictValue" :label="item.dictLabel"></el-option> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="初核材料"> |
||||
<el-select |
||||
v-model="query.initialReviewFileList" |
||||
placeholder="全部" |
||||
clearable |
||||
multiple |
||||
> |
||||
<el-option value="0" label="未上传"/> |
||||
<el-option value="1" label="已上传"/> |
||||
<el-option value="2" label="超时上传"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
</el-form> |
||||
<div class="mb-25 flex between"> |
||||
<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> |
||||
<div class="table-container" v-loading="loading"> |
||||
<el-table :data="list"> |
||||
<el-table-column label="信件编号" width="130" prop="originId" show-overflow-tooltip/> |
||||
<el-table-column label="来源" width="100" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ row.sourceTablePath }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column |
||||
label="登记/受理时间" |
||||
width="170" |
||||
prop="discoveryTime" |
||||
:formatter="(_, __, v) => v ? timeFormat(v, 'yyyy-mm-dd hh:MM:ss') : '/'" |
||||
show-overflow-tooltip |
||||
/> |
||||
<el-table-column label="来件人姓名" width="100" prop="responderName" |
||||
:formatter="row => row.responderName ? row.responderName : '匿名'"/> |
||||
<el-table-column label="身份证号" width="100" prop="responderIdCode" |
||||
:formatter="row => row.responderIdCode ? row.responderIdCode : '无'" show-overflow-tooltip/> |
||||
<el-table-column label="联系电话" width="100" prop="responderPhone" |
||||
:formatter="row => row.responderPhone ? row.responderPhone : '无'" show-overflow-tooltip/> |
||||
<el-table-column label="被投诉机构" width="130" prop="secondDepartName"/> |
||||
<el-table-column label="来信内容" width="100" prop="thingDesc" show-overflow-tooltip/> |
||||
<el-table-column label="涉嫌问题" width="100" prop="involveProblemStr" show-overflow-tooltip/> |
||||
<el-table-column label="是否重复件" width="100"> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.yesNo, row.repeatt) }} |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column label="初核限时" width="150" align="center"> |
||||
<template #default="{ row }"> |
||||
<!-- 有状态:显示状态文案 --> |
||||
<el-tag v-if="row.gwf3>=1" :type="row.gwf3 === '2' ? 'danger' : 'success'"> |
||||
{{ row.gwf3 === '2' ? '超时完成初核' : '按时完成初核' }} |
||||
</el-tag> |
||||
|
||||
<!-- 无状态:显示倒计时 --> |
||||
<countdown v-else :time="Number(row.remainingDuration || 0)"/> |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column label="标签" width="100" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.sfssTags, row.tag) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="办结情况" width="100" prop="completionStatus"> |
||||
<template #default="{ row }"> |
||||
{{ |
||||
row.completionStatus === '1' ? '程序办结' : |
||||
row.completionStatus === '2' ? '已解决合理诉求' : |
||||
'/' |
||||
}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="群众认可" width="100" prop="publicRecognition"> |
||||
<template #default="{ row }"> |
||||
{{ |
||||
row.publicRecognition === '1' ? '认可' : |
||||
row.publicRecognition === '2' ? '不认可' : |
||||
row.publicRecognition === '3' ? '不接电话' : |
||||
'/' |
||||
}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="办理方式" width="100"> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.handleMethodType, row.handleMethod) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="业务类别" width="100" prop="businessTypeName"/> |
||||
<el-table-column label="核查结论" width="140" prop="checkStatus" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.checkStatus, row.checkStatus) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="状态" prop="status" width="100"> |
||||
<template #default="{ row }"> |
||||
<span :style="row.status === '0' ? 'color: red' : ''"> |
||||
{{ |
||||
row.status === '0' ? '未办理' : |
||||
row.status === '1' ? '已办理' : |
||||
'-' |
||||
}} |
||||
</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="操作" width="100" fixed="right"> |
||||
<template #default="{ row }"> |
||||
<el-button type="primary" link @click="handleWatchDetail(row)">查看详情</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> |
||||
</div> |
||||
|
||||
<!-- 查看详情 --> |
||||
<complaint_detail |
||||
v-model="detailShow" |
||||
:id="activeId" |
||||
:dict="dict"/> |
||||
|
||||
</template> |
||||
|
||||
|
||||
<script setup> |
||||
import {computed, onMounted, ref} from 'vue'; |
||||
import {timeFormat} from "@/utils/util"; |
||||
import useCatchStore from "@/stores/modules/catch"; |
||||
import {exportData, getComplaintCollectionPage} from "@/api/data/complaintCollection.ts"; |
||||
import Complaint_detail from "@/components/data/complaint_detail.vue"; |
||||
|
||||
|
||||
const catchStore = useCatchStore(); |
||||
|
||||
const query = ref({ |
||||
size: 10, |
||||
current: 1, |
||||
sourceTableList: ['21'], |
||||
sourceTableSubOneList: [], |
||||
initialReviewFileList: [], |
||||
}); |
||||
|
||||
|
||||
|
||||
const list = ref([]); |
||||
const total = ref(0); |
||||
const loading = ref(false) |
||||
const getList = async () => { |
||||
loading.value = true; |
||||
|
||||
// 确保始终包含默认来源 |
||||
if (!query.value.sourceTableList.includes('21')) { |
||||
query.value.sourceTableList = ['21', ...query.value.sourceTableList]; |
||||
} |
||||
|
||||
const params = { |
||||
...query.value, |
||||
} |
||||
|
||||
let res = await getComplaintCollectionPage(params); |
||||
list.value = res.complaintCollectionPageDTOS; |
||||
total.value = res.total; |
||||
loading.value = false; |
||||
} |
||||
|
||||
function reset() { |
||||
query.value = { |
||||
size: 10, |
||||
current: 1, |
||||
sourceTableList: ['21'], |
||||
sourceTableSubOneList: [], |
||||
initialReviewFileList: [], |
||||
}; |
||||
getList(); |
||||
} |
||||
|
||||
onMounted(() => { |
||||
getList() |
||||
}) |
||||
|
||||
const storeDict = computed(() => |
||||
catchStore.getDicts([ |
||||
"businessType", |
||||
"suspectProblem", |
||||
"policeType", |
||||
"hostLevel", |
||||
"timeLimit", |
||||
"approvalFlow", |
||||
"specialSupervision", |
||||
"checkStatus", |
||||
"sfssSourceTable", |
||||
"sfssTags", |
||||
"accountabilityTarget" |
||||
]) || {} |
||||
); |
||||
|
||||
const localDict = { |
||||
yesNo: [ |
||||
{id: 1, dictLabel: "是", dictValue: "1"}, |
||||
{id: 2, dictLabel: "否", dictValue: "0"}, |
||||
], |
||||
handleMethodType: [ |
||||
{id: 1, dictLabel: "自办", dictValue: "0"}, |
||||
{id: 2, dictLabel: "下发", dictValue: "1"}, |
||||
], |
||||
}; |
||||
|
||||
const gjxfSourceTableSubOneList = computed(() => { |
||||
const list = storeDict.value.sfssSourceTable || [] |
||||
|
||||
// 二级:remark 等于国家信访的dictValue |
||||
const children = list |
||||
.filter(d => d.remark === '21') |
||||
.sort((a, b) => (a.dictSort ?? 0) - (b.dictSort ?? 0)) |
||||
|
||||
return children.map(c => ({ |
||||
label: c.dictLabel, |
||||
value: String(c.dictValue), |
||||
})) |
||||
}) |
||||
|
||||
const dict = computed(() => ({ |
||||
...storeDict.value, |
||||
...localDict, |
||||
gjxfSourceTableSubOneList: gjxfSourceTableSubOneList.value, |
||||
})); |
||||
|
||||
function getDictLabel(list, value) { |
||||
if (!Array.isArray(list)) return '/' |
||||
|
||||
if (value === null || value === undefined || value === '') return '/' |
||||
|
||||
let values = [] |
||||
|
||||
if (Array.isArray(value)) { |
||||
values = value |
||||
} |
||||
else if (typeof value === 'string' && value.includes(',')) { |
||||
values = value.split(',').map(v => v.trim()) |
||||
} |
||||
else { |
||||
values = [value] |
||||
} |
||||
|
||||
const labels = values |
||||
.map(v => { |
||||
const item = list.find(d => d.dictValue == v) |
||||
return item?.dictLabel |
||||
}) |
||||
.filter(Boolean) |
||||
|
||||
return labels.length ? labels.join(',') : '/' |
||||
} |
||||
|
||||
const detailShow = ref(false) |
||||
const activeId = ref("") |
||||
const handleWatchDetail = async (row) => { |
||||
activeId.value = row.id |
||||
detailShow.value = true |
||||
} |
||||
|
||||
const handleExport = async () => { |
||||
let body = { |
||||
...query.value |
||||
} |
||||
await exportData(body); |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.el-form-item .el-form-item { |
||||
margin-bottom: 18px; |
||||
} |
||||
|
||||
:deep() { |
||||
.el-form-item--label-right .el-form-item__label { |
||||
text-align: right; |
||||
line-height: 32px; |
||||
margin-bottom: 0; |
||||
} |
||||
} |
||||
|
||||
p { |
||||
margin: 0; |
||||
line-height: 1.4; |
||||
} |
||||
|
||||
.dialog-footer { |
||||
display: flex; |
||||
justify-content: flex-end; |
||||
padding: 0 24px 16px; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,487 @@
|
||||
<template> |
||||
<div class="container"> |
||||
<header> |
||||
<el-form :label-width="114"> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="问题来源"> |
||||
<el-select |
||||
v-model="query.sourceTableSubOneList" |
||||
clearable |
||||
filterable |
||||
multiple |
||||
collapse-tags |
||||
placeholder="请选择来源" |
||||
style="width: 100%" |
||||
> |
||||
<el-option |
||||
v-for="item in dict.jzxxSourceTableSubOneList" |
||||
:key="item.value" |
||||
:value="item.value" |
||||
:label="item.label" |
||||
/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="信件编号"> |
||||
<el-input |
||||
placeholder="请输入编号" |
||||
v-model="query.originId" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="登记/受理时间"> |
||||
<date-time-range-picker-ext |
||||
v-model="query.discoveryTimeList" |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="来件人"> |
||||
<el-input |
||||
placeholder="来件人姓名、身份证号码、联系电话" |
||||
v-model="query.personInfo" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="涉及二级机构" prop="secondDepartName"> |
||||
<depart-tree-select |
||||
v-model="query.secondDepartId" |
||||
:check-strictly="true" |
||||
@node-click="(row) => (query.secondDepartName = row.shortName)" |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="办理方式"> |
||||
<el-select |
||||
v-model="query.handleMethod" |
||||
placeholder="全部" |
||||
clearable |
||||
> |
||||
<el-option value="0" label="自办"/> |
||||
<el-option value="1" label="下发"/> |
||||
</el-select> |
||||
|
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="办理状态"> |
||||
<el-select |
||||
v-model="query.status" |
||||
clearable |
||||
placeholder="办理状态" |
||||
> |
||||
<el-option value="0" label="未办理"/> |
||||
<el-option value="1" label="已办理"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="标签"> |
||||
<el-select |
||||
placeholder="全部" |
||||
clearable |
||||
v-model="query.tags" |
||||
multiple |
||||
collapse-tags |
||||
> |
||||
<el-option |
||||
v-for="item in dict.sfssTags" |
||||
:key="item.id" |
||||
:value="item.dictValue" |
||||
:label="item.dictLabel" |
||||
/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="来件内容"> |
||||
<el-input |
||||
placeholder="请输入来件内容" |
||||
v-model="query.thingDesc" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="是否重复件"> |
||||
<el-select |
||||
v-model="query.repeatt" |
||||
placeholder="全部" |
||||
clearable |
||||
> |
||||
<el-option value="0" label="否"/> |
||||
<el-option value="1" label="是"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="核查结论" > |
||||
<el-select v-model="query.checkStatusList" clearable multiple |
||||
style="width: 280px"> |
||||
<el-option v-for="item in dict.checkStatus" :value="item.dictValue" :label="item.dictLabel"></el-option> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="初核材料"> |
||||
<el-select |
||||
v-model="query.initialReviewFileList" |
||||
placeholder="全部" |
||||
clearable |
||||
multiple |
||||
> |
||||
<el-option value="0" label="未上传"/> |
||||
<el-option value="1" label="已上传"/> |
||||
<el-option value="2" label="超时上传"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="信件状态"> |
||||
<el-select |
||||
v-model="query.processingStatus" |
||||
placeholder="全部" |
||||
clearable |
||||
style="width: 100%" |
||||
> |
||||
<el-option value="processing" label="办理中"/> |
||||
<el-option value="completion" label="已办结"/> |
||||
<el-option value="delayed" label="已延期"/> |
||||
<el-option value="terminated" label="已终止"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
|
||||
</el-form> |
||||
<div class="mb-25 flex between"> |
||||
<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> |
||||
<div class="table-container" v-loading="loading"> |
||||
<el-table :data="list"> |
||||
<el-table-column label="信件编号" width="130" prop="originId" show-overflow-tooltip/> |
||||
<el-table-column label="来源" width="100" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ row.sourceTablePath }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column |
||||
label="登记/受理时间" |
||||
width="170" |
||||
prop="discoveryTime" |
||||
:formatter="(_, __, v) => v ? timeFormat(v, 'yyyy-mm-dd hh:MM:ss') : '/'" |
||||
show-overflow-tooltip |
||||
/> |
||||
<el-table-column label="来件人姓名" width="100" prop="responderName" |
||||
:formatter="row => row.responderName ? row.responderName : '匿名'"/> |
||||
<el-table-column label="身份证号" width="100" prop="responderIdCode" |
||||
:formatter="row => row.responderIdCode ? row.responderIdCode : '无'" show-overflow-tooltip/> |
||||
<el-table-column label="联系电话" width="100" prop="responderPhone" |
||||
:formatter="row => row.responderPhone ? row.responderPhone : '无'" show-overflow-tooltip/> |
||||
<el-table-column label="被投诉机构" width="130" prop="secondDepartName"/> |
||||
<el-table-column label="来信内容" width="100" prop="thingDesc" show-overflow-tooltip/> |
||||
<el-table-column label="涉嫌问题" width="100" prop="involveProblemStr" show-overflow-tooltip/> |
||||
<el-table-column label="是否重复件" width="100"> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.yesNo, row.repeatt) }} |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column label="初核限时" width="150" align="center"> |
||||
<template #default="{ row }"> |
||||
<!-- 有状态:显示状态文案 --> |
||||
<el-tag v-if="row.gwf3>=1" :type="row.gwf3 === '2' ? 'danger' : 'success'"> |
||||
{{ row.gwf3 === '2' ? '超时完成初核' : '按时完成初核' }} |
||||
</el-tag> |
||||
|
||||
<!-- 无状态:显示倒计时 --> |
||||
<countdown v-else :time="Number(row.remainingDuration || 0)"/> |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column label="标签" width="100" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.sfssTags, row.tag) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="办结情况" width="100" prop="completionStatus"> |
||||
<template #default="{ row }"> |
||||
{{ |
||||
row.completionStatus === '1' ? '程序办结' : |
||||
row.completionStatus === '2' ? '已解决合理诉求' : |
||||
'/' |
||||
}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="群众认可" width="100" prop="publicRecognition"> |
||||
<template #default="{ row }"> |
||||
{{ |
||||
row.publicRecognition === '1' ? '认可' : |
||||
row.publicRecognition === '2' ? '不认可' : |
||||
row.publicRecognition === '3' ? '不接电话' : |
||||
'/' |
||||
}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="办理方式" width="100"> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.handleMethodType, row.handleMethod) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="业务类别" width="100" prop="businessTypeName"/> |
||||
<el-table-column label="核查结论" width="140" prop="checkStatus" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.checkStatus, row.checkStatus) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="状态" prop="status" width="100"> |
||||
<template #default="{ row }"> |
||||
<span :style="row.status === '0' ? 'color: red' : ''"> |
||||
{{ |
||||
row.status === '0' ? '未办理' : |
||||
row.status === '1' ? '已办理' : |
||||
'-' |
||||
}} |
||||
</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="信件状态(局)" width="120" prop="processingStatus"> |
||||
<template #default="{ row }"> |
||||
{{ |
||||
row.processingStatus === 'completion' ? '已办结' : |
||||
row.processingStatus === 'processing' ? '办理中' : |
||||
row.processingStatus === 'delayed' ? '已延期' : |
||||
row.processingStatus === 'terminated' ? '已终止' : |
||||
'/' |
||||
}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="操作" width="100" fixed="right"> |
||||
<template #default="{ row }"> |
||||
<el-button type="primary" link @click="handleWatchDetail(row)">查看详情</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> |
||||
</div> |
||||
|
||||
<!-- 查看详情 --> |
||||
<complaint_detail |
||||
v-model="detailShow" |
||||
:id="activeId" |
||||
:dict="dict"/> |
||||
|
||||
</template> |
||||
|
||||
|
||||
<script setup> |
||||
import { ref, watch, computed, onMounted } from 'vue'; |
||||
import {timeFormat} from "@/utils/util"; |
||||
import useCatchStore from "@/stores/modules/catch"; |
||||
import { |
||||
exportData, |
||||
getComplaintCollectionPage |
||||
} from "@/api/data/complaintCollection.ts"; |
||||
import Complaint_detail from "@/components/data/complaint_detail.vue"; |
||||
|
||||
|
||||
const catchStore = useCatchStore(); |
||||
|
||||
const query = ref({ |
||||
size: 10, |
||||
current: 1, |
||||
sourceTableList: ['23'], |
||||
sourceTableSubOneList: [], |
||||
initialReviewFileList: [], |
||||
processingStatus: '', |
||||
}); |
||||
|
||||
|
||||
|
||||
const list = ref([]); |
||||
const total = ref(0); |
||||
const loading = ref(false) |
||||
const getList = async () => { |
||||
loading.value = true; |
||||
|
||||
// 确保始终包含默认来源 |
||||
if (!query.value.sourceTableList.includes('23')) { |
||||
query.value.sourceTableList = ['23', ...query.value.sourceTableList]; |
||||
} |
||||
|
||||
const params = { |
||||
...query.value, |
||||
} |
||||
|
||||
let res = await getComplaintCollectionPage(params); |
||||
list.value = res.complaintCollectionPageDTOS; |
||||
total.value = res.total; |
||||
loading.value = false; |
||||
} |
||||
|
||||
function reset() { |
||||
query.value = { |
||||
size: 10, |
||||
current: 1, |
||||
sourceTableList: ['23'], |
||||
sourceTableSubOneList: [], |
||||
initialReviewFileList: [], |
||||
processingStatus: '', |
||||
}; |
||||
getList(); |
||||
} |
||||
|
||||
onMounted(() => { |
||||
getList() |
||||
}) |
||||
|
||||
const storeDict = computed(() => |
||||
catchStore.getDicts([ |
||||
"businessType", |
||||
"suspectProblem", |
||||
"policeType", |
||||
"hostLevel", |
||||
"timeLimit", |
||||
"approvalFlow", |
||||
"specialSupervision", |
||||
"checkStatus", |
||||
"sfssSourceTable", |
||||
"sfssTags", |
||||
"accountabilityTarget" |
||||
]) || {} |
||||
); |
||||
|
||||
const jzxxSourceTableSubOneList = computed(() => { |
||||
const list = storeDict.value.sfssSourceTable || [] |
||||
|
||||
// 二级:remark 等于局长信箱的dictValue |
||||
const children = list |
||||
.filter(d => d.remark === '23') |
||||
.sort((a, b) => (a.dictSort ?? 0) - (b.dictSort ?? 0)) |
||||
|
||||
return children.map(c => ({ |
||||
label: c.dictLabel, |
||||
value: String(c.dictValue), |
||||
})) |
||||
}) |
||||
|
||||
const localDict = { |
||||
yesNo: [ |
||||
{id: 1, dictLabel: "是", dictValue: "1"}, |
||||
{id: 2, dictLabel: "否", dictValue: "0"}, |
||||
], |
||||
handleMethodType: [ |
||||
{id: 1, dictLabel: "自办", dictValue: "0"}, |
||||
{id: 2, dictLabel: "下发", dictValue: "1"}, |
||||
], |
||||
}; |
||||
|
||||
const dict = computed(() => ({ |
||||
...storeDict.value, |
||||
...localDict, |
||||
jzxxSourceTableSubOneList: jzxxSourceTableSubOneList.value, |
||||
})); |
||||
|
||||
function getDictLabel(list, value) { |
||||
if (!Array.isArray(list)) return '/' |
||||
|
||||
if (value === null || value === undefined || value === '') return '/' |
||||
|
||||
let values = [] |
||||
|
||||
if (Array.isArray(value)) { |
||||
values = value |
||||
} |
||||
else if (typeof value === 'string' && value.includes(',')) { |
||||
values = value.split(',').map(v => v.trim()) |
||||
} |
||||
else { |
||||
values = [value] |
||||
} |
||||
|
||||
const labels = values |
||||
.map(v => { |
||||
const item = list.find(d => d.dictValue == v) |
||||
return item?.dictLabel |
||||
}) |
||||
.filter(Boolean) |
||||
|
||||
return labels.length ? labels.join(',') : '/' |
||||
} |
||||
|
||||
const detailShow = ref(false) |
||||
const activeId = ref("") |
||||
const handleWatchDetail = async (row) => { |
||||
activeId.value = row.id |
||||
detailShow.value = true |
||||
} |
||||
|
||||
const handleExport = async () => { |
||||
let body = { |
||||
...query.value |
||||
} |
||||
await exportData(body); |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.el-form-item .el-form-item { |
||||
margin-bottom: 18px; |
||||
} |
||||
|
||||
:deep() { |
||||
.el-form-item--label-right .el-form-item__label { |
||||
text-align: right; |
||||
line-height: 32px; |
||||
margin-bottom: 0; |
||||
} |
||||
} |
||||
|
||||
p { |
||||
margin: 0; |
||||
line-height: 1.4; |
||||
} |
||||
|
||||
.dialog-footer { |
||||
display: flex; |
||||
justify-content: flex-end; |
||||
padding: 0 24px 16px; |
||||
} |
||||
</style> |
||||
|
||||
// 这是ai写的页面 |
||||
@ -0,0 +1,458 @@
|
||||
<template> |
||||
<div class="container"> |
||||
<header> |
||||
<el-form :label-width="114"> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="问题来源"> |
||||
<el-select |
||||
v-model="query.sourceTableSubOneList" |
||||
clearable |
||||
filterable |
||||
multiple |
||||
collapse-tags |
||||
placeholder="请选择来源" |
||||
style="width: 100%" |
||||
> |
||||
<el-option |
||||
v-for="item in dict.leaderSourceTableSubOneList" |
||||
:key="item.value" |
||||
:value="item.value" |
||||
:label="item.label" |
||||
/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="信件编号"> |
||||
<el-input |
||||
placeholder="请输入编号" |
||||
v-model="query.originId" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="登记/受理时间"> |
||||
<date-time-range-picker-ext |
||||
v-model="query.discoveryTimeList" |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="来件人"> |
||||
<el-input |
||||
placeholder="来件人姓名、身份证号码、联系电话" |
||||
v-model="query.personInfo" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="涉及二级机构" prop="secondDepartName"> |
||||
<depart-tree-select |
||||
v-model="query.secondDepartId" |
||||
:check-strictly="true" |
||||
@node-click="(row) => (query.secondDepartName = row.shortName)" |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="办理方式"> |
||||
<el-select |
||||
v-model="query.handleMethod" |
||||
placeholder="全部" |
||||
clearable |
||||
> |
||||
<el-option value="0" label="自办"/> |
||||
<el-option value="1" label="下发"/> |
||||
</el-select> |
||||
|
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="办理状态"> |
||||
<el-select |
||||
v-model="query.status" |
||||
clearable |
||||
placeholder="办理状态" |
||||
> |
||||
<el-option value="0" label="未办理"/> |
||||
<el-option value="1" label="已办理"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="标签"> |
||||
<el-select |
||||
placeholder="全部" |
||||
clearable |
||||
v-model="query.tags" |
||||
multiple |
||||
collapse-tags |
||||
> |
||||
<el-option |
||||
v-for="item in dict.sfssTags" |
||||
:key="item.id" |
||||
:value="item.dictValue" |
||||
:label="item.dictLabel" |
||||
/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
<el-row> |
||||
<el-col :span="6"> |
||||
<el-form-item label="来件内容"> |
||||
<el-input |
||||
placeholder="请输入来件内容" |
||||
v-model="query.thingDesc" |
||||
clearable |
||||
/> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="是否重复件"> |
||||
<el-select |
||||
v-model="query.repeatt" |
||||
placeholder="全部" |
||||
clearable |
||||
> |
||||
<el-option value="0" label="否"/> |
||||
<el-option value="1" label="是"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="核查结论" > |
||||
<el-select v-model="query.checkStatusList" clearable multiple |
||||
style="width: 280px"> |
||||
<el-option v-for="item in dict.checkStatus" :value="item.dictValue" :label="item.dictLabel"></el-option> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="6"> |
||||
<el-form-item label="初核材料"> |
||||
<el-select |
||||
v-model="query.initialReviewFileList" |
||||
placeholder="全部" |
||||
clearable |
||||
multiple |
||||
> |
||||
<el-option value="0" label="未上传"/> |
||||
<el-option value="1" label="已上传"/> |
||||
<el-option value="2" label="超时上传"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
</el-form> |
||||
<div class="mb-25 flex between"> |
||||
<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> |
||||
<div class="table-container" v-loading="loading"> |
||||
<el-table :data="list"> |
||||
<el-table-column label="信件编号" width="130" prop="originId" show-overflow-tooltip/> |
||||
<el-table-column label="来源" width="100" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ row.sourceTablePath }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column |
||||
label="登记/受理时间" |
||||
width="170" |
||||
prop="discoveryTime" |
||||
:formatter="(_, __, v) => v ? timeFormat(v, 'yyyy-mm-dd hh:MM:ss') : '/'" |
||||
show-overflow-tooltip |
||||
/> |
||||
<el-table-column label="来件人姓名" width="100" prop="responderName" |
||||
:formatter="row => row.responderName ? row.responderName : '匿名'"/> |
||||
<el-table-column label="身份证号" width="100" prop="responderIdCode" |
||||
:formatter="row => row.responderIdCode ? row.responderIdCode : '无'" show-overflow-tooltip/> |
||||
<el-table-column label="联系电话" width="100" prop="responderPhone" |
||||
:formatter="row => row.responderPhone ? row.responderPhone : '无'" show-overflow-tooltip/> |
||||
<el-table-column label="被投诉机构" width="130" prop="secondDepartName"/> |
||||
<el-table-column label="来信内容" width="100" prop="thingDesc" show-overflow-tooltip/> |
||||
<el-table-column label="涉嫌问题" width="100" prop="involveProblemStr" show-overflow-tooltip/> |
||||
<el-table-column label="是否重复件" width="100"> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.yesNo, row.repeatt) }} |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column label="初核限时" width="150" align="center"> |
||||
<template #default="{ row }"> |
||||
<!-- 有状态:显示状态文案 --> |
||||
<el-tag v-if="row.gwf3>=1" :type="row.gwf3 === '2' ? 'danger' : 'success'"> |
||||
{{ row.gwf3 === '2' ? '超时完成初核' : '按时完成初核' }} |
||||
</el-tag> |
||||
|
||||
<!-- 无状态:显示倒计时 --> |
||||
<countdown v-else :time="Number(row.remainingDuration || 0)"/> |
||||
</template> |
||||
</el-table-column> |
||||
|
||||
<el-table-column label="标签" width="100" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.sfssTags, row.tag) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="办结情况" width="100" prop="completionStatus"> |
||||
<template #default="{ row }"> |
||||
{{ |
||||
row.completionStatus === '1' ? '程序办结' : |
||||
row.completionStatus === '2' ? '已解决合理诉求' : |
||||
'/' |
||||
}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="群众认可" width="100" prop="publicRecognition"> |
||||
<template #default="{ row }"> |
||||
{{ |
||||
row.publicRecognition === '1' ? '认可' : |
||||
row.publicRecognition === '2' ? '不认可' : |
||||
row.publicRecognition === '3' ? '不接电话' : |
||||
'/' |
||||
}} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="办理方式" width="100"> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.handleMethodType, row.handleMethod) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="业务类别" width="100" prop="businessTypeName"/> |
||||
<el-table-column label="核查结论" width="140" prop="checkStatus" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ getDictLabel(dict.checkStatus, row.checkStatus) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="状态" prop="status" width="100"> |
||||
<template #default="{ row }"> |
||||
<span :style="row.status === '0' ? 'color: red' : ''"> |
||||
{{ |
||||
row.status === '0' ? '未办理' : |
||||
row.status === '1' ? '已办理' : |
||||
'-' |
||||
}} |
||||
</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="操作" width="100" fixed="right"> |
||||
<template #default="{ row }"> |
||||
<el-button type="primary" link @click="handleWatchDetail(row)">查看详情</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> |
||||
</div> |
||||
|
||||
<!-- 查看详情 --> |
||||
<complaint_detail |
||||
v-model="detailShow" |
||||
:id="activeId" |
||||
:dict="dict"/> |
||||
|
||||
</template> |
||||
|
||||
|
||||
<script setup> |
||||
import { ref, watch, computed, onMounted } from 'vue'; |
||||
import {timeFormat} from "@/utils/util"; |
||||
import useCatchStore from "@/stores/modules/catch"; |
||||
import { |
||||
exportData, |
||||
getComplaintCollectionPage |
||||
} from "@/api/data/complaintCollection.ts"; |
||||
import Complaint_detail from "@/components/data/complaint_detail.vue"; |
||||
|
||||
|
||||
const catchStore = useCatchStore(); |
||||
|
||||
const query = ref({ |
||||
size: 10, |
||||
current: 1, |
||||
sourceTableList: ['leader_explain'], |
||||
sourceTableSubOneList: [], |
||||
initialReviewFileList: [], |
||||
}); |
||||
|
||||
|
||||
|
||||
const list = ref([]); |
||||
const total = ref(0); |
||||
const loading = ref(false) |
||||
const getList = async () => { |
||||
loading.value = true; |
||||
|
||||
// 确保始终包含默认来源 |
||||
if (!query.value.sourceTableList.includes('leader_explain')) { |
||||
query.value.sourceTableList = ['leader_explain', ...query.value.sourceTableList]; |
||||
} |
||||
|
||||
const params = { |
||||
...query.value, |
||||
} |
||||
|
||||
let res = await getComplaintCollectionPage(params); |
||||
list.value = res.complaintCollectionPageDTOS; |
||||
total.value = res.total; |
||||
loading.value = false; |
||||
} |
||||
|
||||
function reset() { |
||||
query.value = { |
||||
size: 10, |
||||
current: 1, |
||||
sourceTableList: ['leader_explain'], |
||||
sourceTableSubOneList: [], |
||||
initialReviewFileList: [], |
||||
}; |
||||
getList(); |
||||
} |
||||
|
||||
onMounted(() => { |
||||
getList() |
||||
}) |
||||
|
||||
const storeDict = computed(() => |
||||
catchStore.getDicts([ |
||||
"businessType", |
||||
"suspectProblem", |
||||
"policeType", |
||||
"hostLevel", |
||||
"timeLimit", |
||||
"approvalFlow", |
||||
"specialSupervision", |
||||
"checkStatus", |
||||
"sfssSourceTable", |
||||
"sfssTags", |
||||
"accountabilityTarget" |
||||
]) || {} |
||||
); |
||||
|
||||
const leaderSourceTableSubOneList = computed(() => { |
||||
const list = storeDict.value.sfssSourceTable || [] |
||||
|
||||
// 二级:remark 等于领导交办的dictValue |
||||
const children = list |
||||
.filter(d => d.remark === 'leader_explain') |
||||
.sort((a, b) => (a.dictSort ?? 0) - (b.dictSort ?? 0)) |
||||
|
||||
return children.map(c => ({ |
||||
label: c.dictLabel, |
||||
value: String(c.dictValue), |
||||
})) |
||||
}) |
||||
|
||||
const localDict = { |
||||
yesNo: [ |
||||
{id: 1, dictLabel: "是", dictValue: "1"}, |
||||
{id: 2, dictLabel: "否", dictValue: "0"}, |
||||
], |
||||
handleMethodType: [ |
||||
{id: 1, dictLabel: "自办", dictValue: "0"}, |
||||
{id: 2, dictLabel: "下发", dictValue: "1"}, |
||||
], |
||||
}; |
||||
|
||||
const dict = computed(() => ({ |
||||
...storeDict.value, |
||||
...localDict, |
||||
leaderSourceTableSubOneList: leaderSourceTableSubOneList.value, |
||||
})); |
||||
|
||||
function getDictLabel(list, value) { |
||||
if (!Array.isArray(list)) return '/' |
||||
|
||||
if (value === null || value === undefined || value === '') return '/' |
||||
|
||||
let values = [] |
||||
|
||||
if (Array.isArray(value)) { |
||||
values = value |
||||
} |
||||
else if (typeof value === 'string' && value.includes(',')) { |
||||
values = value.split(',').map(v => v.trim()) |
||||
} |
||||
else { |
||||
values = [value] |
||||
} |
||||
|
||||
const labels = values |
||||
.map(v => { |
||||
const item = list.find(d => d.dictValue == v) |
||||
return item?.dictLabel |
||||
}) |
||||
.filter(Boolean) |
||||
|
||||
return labels.length ? labels.join(',') : '/' |
||||
} |
||||
|
||||
const detailShow = ref(false) |
||||
const activeId = ref("") |
||||
const handleWatchDetail = async (row) => { |
||||
activeId.value = row.id |
||||
detailShow.value = true |
||||
} |
||||
|
||||
const handleExport = async () => { |
||||
let body = { |
||||
...query.value |
||||
} |
||||
await exportData(body); |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.el-form-item .el-form-item { |
||||
margin-bottom: 18px; |
||||
} |
||||
|
||||
:deep() { |
||||
.el-form-item--label-right .el-form-item__label { |
||||
text-align: right; |
||||
line-height: 32px; |
||||
margin-bottom: 0; |
||||
} |
||||
} |
||||
|
||||
p { |
||||
margin: 0; |
||||
line-height: 1.4; |
||||
} |
||||
|
||||
.dialog-footer { |
||||
display: flex; |
||||
justify-content: flex-end; |
||||
padding: 0 24px 16px; |
||||
} |
||||
</style> |
||||
|
||||
// 这是ai写的页面 |
||||
Loading…
Reference in new issue