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.
337 lines
11 KiB
337 lines
11 KiB
<template> |
|
<div class="container"> |
|
<header> |
|
<el-form :label-width="114"> |
|
<el-row> |
|
<el-col :span="6"> |
|
<el-form-item label="信件编号"> |
|
<el-input |
|
placeholder="请输入" |
|
v-model="query.originId" |
|
/> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="6"> |
|
<el-form-item label="投诉人"> |
|
<div class="flex gap"> |
|
<el-select |
|
v-model="query.responderKey" |
|
style="width: 160px" |
|
@change="delete query.responderValue" |
|
> |
|
<el-option value="name" label="姓名" /> |
|
<el-option value="phone" label="电话" /> |
|
</el-select> |
|
<el-input |
|
placeholder="请输入" |
|
v-model="query.responderValue" |
|
clearable |
|
/> |
|
</div> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="6"> |
|
<el-form-item label="来信时间"> |
|
<date-time-range-picker-ext |
|
v-model="query.discoveryTime" |
|
/> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="6"> |
|
<el-form-item label="具体内容"> |
|
<el-input |
|
placeholder="请输入" |
|
v-model="query.thingDesc" |
|
/> |
|
</el-form-item> |
|
</el-col> |
|
</el-row> |
|
</el-form> |
|
<div class="mb-25 flex between"> |
|
<div> |
|
<el-button type="primary" @click="handleInvolvedIssue" >涉及问题导入</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"> |
|
<el-table :data="list"> |
|
<el-table-column |
|
label="信件编号" |
|
prop="originId" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="来信时间" |
|
prop="discoveryTime" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column |
|
label="投诉人" |
|
prop="responderName" |
|
width="90" |
|
/> |
|
<el-table-column label="电话" prop="contactPhone" /> |
|
<el-table-column |
|
label="具体内容" |
|
prop="thingDesc" |
|
show-overflow-tooltip |
|
/> |
|
<el-table-column label="办理单位" show-overflow-tooltip> |
|
<template #default="{ row }"> |
|
<span>{{ row.handleSecondDepartName }}</span> |
|
<span>{{ row.handleThreeDepartName }}</span> |
|
</template> |
|
</el-table-column> |
|
<el-table-column |
|
label="是否属实" |
|
prop="checkStatusName" |
|
width="100" |
|
align="center" |
|
/> |
|
<el-table-column label="办理状态" width="110"> |
|
<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="200"> |
|
<template #default="{ row }"> |
|
<el-button |
|
v-if=" row.checkStatus && row.checkStatus != 3" |
|
type="primary" |
|
link |
|
@click="handleAction(row)" |
|
>问题详情</el-button |
|
> |
|
<el-button |
|
v-else |
|
type="primary" |
|
link |
|
@click="handleDetailRow(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> |
|
|
|
<el-dialog v-model="detailShow" title="信访详情" width="50vw"> |
|
<el-row :gutter="20" tyle="margin-top: 20px"> |
|
<el-col :span="12" > |
|
<label>反映人姓名:</label> {{actionRow.responderName}} |
|
</el-col> |
|
<el-col :span="12"> |
|
<label>反映人联系方式：</label>{{actionRow.contactPhone}} |
|
</el-col> |
|
</el-row> |
|
<el-row :gutter="20" style="margin-top: 20px"> |
|
<el-col :span="12"> |
|
<label>核查情况:</label> {{actionRow.checkStatusName}} |
|
</el-col> |
|
<el-col :span="12" > |
|
<label>业务类别：</label>{{actionRow.businessTypeName}} |
|
</el-col> |
|
</el-row> |
|
<el-row :gutter="20" style="margin-top: 20px"> |
|
<el-col :span="12"> |
|
<label>问题发生时间：</label>{{actionRow.crtTime}} |
|
</el-col> |
|
</el-row> |
|
<el-row :gutter="20" style="margin-top: 20px"> |
|
<el-col > |
|
<label>反映人内容:</label> {{actionRow.thingDesc}} |
|
</el-col> |
|
</el-row> |
|
<el-row :gutter="20" style="margin-top: 20px"> |
|
<el-col > |
|
<label>核查情况内容:</label> {{actionRow.checkStatusDesc}} |
|
</el-col> |
|
</el-row> |
|
</el-dialog> |
|
|
|
|
|
<negative-dialog |
|
v-model="show" |
|
:id="activeNegativeId" |
|
@close="show = false" |
|
/> |
|
|
|
<el-dialog title="涉及问题导入" v-model="involvedIssueShow" width="60vw" :lock-scroll="false"> |
|
<div v-loading="involvedIssueLoading"> |
|
<el-upload |
|
drag |
|
:multiple="false" |
|
:auto-upload="false" |
|
:show-file-list="false" |
|
v-model:file-list="fileList" |
|
accept="application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" |
|
class="mt-20" |
|
> |
|
<template v-if="fileList.length == 0"> |
|
<el-icon class="el-icon--upload"> |
|
<upload-filled/> |
|
</el-icon> |
|
<div class="el-upload__text"> |
|
<p>点击或拖拽文件到此区域上传</p> |
|
</div> |
|
</template> |
|
<template v-else> |
|
<el-icon class="el-icon--upload" |
|
><Select |
|
/></el-icon> |
|
<div class="el-upload__text"> |
|
已选择文件：{{ |
|
fileList[fileList.length - 1].name |
|
}} |
|
</div> |
|
</template> |
|
</el-upload> |
|
<div class="mt-20"> |
|
<span>文件模板</span> |
|
<a |
|
class="link" |
|
:href="`${BASE_PATH}/templates/涉企涉冻导入模板.xlsx`" |
|
target="__blank" |
|
>涉企涉冻导入模板.xlsx 下载</a |
|
> |
|
</div> |
|
<footer class="flex end mt-20 v-center"> |
|
<el-button type="primary" |
|
size="large" |
|
@click="handleInvolvedIssueNext" |
|
:disabled="involvedIssueLoading"> |
|
确认 |
|
</el-button> |
|
</footer> |
|
</div> |
|
</el-dialog> |
|
</template> |
|
<script setup> |
|
import { ProcessingStatus } from "@/enums/flowEnums"; |
|
import { |
|
listMailbox |
|
} from "@/api/data/mailbox"; |
|
import feedback from "@/utils/feedback"; |
|
import { getDictLable, getYearTime} from "@/utils/util"; |
|
import useCatchStore from "@/stores/modules/catch"; |
|
import {replenishInvolvedIssueDataFun} from "@/api/data/dataThread"; |
|
import {BASE_PATH} from "@/api/request"; |
|
import Dialog from "../../components/comfort/dialog.vue"; |
|
const route = useRoute() |
|
const catchStore = useCatchStore(); |
|
const dict = catchStore.getDicts(["distributionState"]); |
|
|
|
const query = ref({ |
|
size: 10, |
|
current: 1, |
|
responderKey: "name", |
|
}); |
|
|
|
const list = ref([]); |
|
const total = ref(0); |
|
const detailShow = ref(false) |
|
const actionRow = ref({}) |
|
|
|
const handleDetailRow = (row)=>{ |
|
actionRow.value=row |
|
detailShow.value=true |
|
} |
|
|
|
//检测跳转来源界面是否为大屏 |
|
// watch(()=>route.query.toString(), |
|
// ()=>{ |
|
// if(route.query.open){ |
|
// query.value.createTime=getYearTime() |
|
// } |
|
// getList() |
|
// },{immediate:true,deep:true}) |
|
|
|
function getList() { |
|
listMailbox(query.value).then((data) => { |
|
list.value = data.records; |
|
total.value = data.total; |
|
}); |
|
} |
|
|
|
function reset() { |
|
query.value = { |
|
size: 10, |
|
current: 1, |
|
responderKey: "name", |
|
}; |
|
getList(); |
|
} |
|
|
|
getList(); |
|
|
|
const show = ref(false); |
|
const activeNegativeId = ref(""); |
|
|
|
function handleAction(row) { |
|
show.value = true; |
|
activeNegativeId.value = row.id; |
|
} |
|
|
|
const involvedIssueShow =ref(false); |
|
const involvedIssueLoading =ref(false); |
|
const fileList = ref([]) |
|
/** |
|
* 涉及问题导入 |
|
* */ |
|
function handleInvolvedIssue(){ |
|
involvedIssueShow.value=true; |
|
} |
|
const handleInvolvedIssueNext =async ()=>{ |
|
const formData = new FormData(); |
|
formData.append("file", fileList.value[fileList.value.length - 1].raw); |
|
involvedIssueLoading.value = true; |
|
try { |
|
await replenishInvolvedIssueDataFun(formData); |
|
feedback.msgSuccess("操作成功"); |
|
involvedIssueShow.value=false; |
|
involvedIssueLoading.value=false; |
|
} catch (e) { |
|
involvedIssueLoading.value = false; |
|
involvedIssueShow.value=false; |
|
throw e; |
|
} |
|
} |
|
|
|
</script> |
|
<style lang="scss" scoped> |
|
</style>
|
|
|