<template>
|
<div class="app-container">
|
<el-form inline ref="formRef" :model="form.quparams" label-width="80px">
|
<el-form-item label="投诉内容" prop="content">
|
<el-input placeholder="请输入" v-model="form.quparams.complaintReason"></el-input>
|
</el-form-item>
|
<el-form-item label="投诉对象" prop="executeDeptName">
|
<el-input placeholder="请输入" v-model="form.quparams.executeDeptName"></el-input>
|
</el-form-item>
|
<el-form-item label="投诉人" prop="companyName">
|
<el-input placeholder="请输入" v-model="form.quparams.companyName"></el-input>
|
</el-form-item>
|
<el-form-item label="执法主题" prop="enforceReason">
|
<el-input placeholder="请输入" v-model="form.quparams.enforceReason"></el-input>
|
</el-form-item>
|
<el-form-item label="办理状态" prop="complaintStatus">
|
<el-select style="width: 180px;" v-model="form.quparams.complaintStatus" placeholder="请选择">
|
<el-option v-for="(item,index) in form.status" :key="index" :label="item" :value="index"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
</el-form-item>
|
</el-form>
|
<el-row class="mt20 mb10">
|
<el-col>
|
<el-button icon="Download" type="primary" plain>导出</el-button>
|
</el-col>
|
</el-row>
|
<el-table :data="form.tableData">
|
<el-table-column label="投诉企业" prop="companyName"></el-table-column>
|
<el-table-column label="投诉对象" prop="executeDeptName">
|
<template #default="scope">
|
{{ scope.row.executeDeptName }}
|
</template>
|
</el-table-column>
|
<el-table-column label="投诉类型">
|
<template #default="scope">
|
{{ dispImgType(scope.row.complaintType) }}
|
</template>
|
</el-table-column>
|
<el-table-column label="投诉内容" prop="complaintReason"></el-table-column>
|
<el-table-column label="执法主题" prop="enforceReason">
|
<template #default="scope">
|
<el-link type="primary" @click="look(scope.row)">{{ scope.row.enforceReason }}</el-link>
|
</template>
|
</el-table-column>
|
<el-table-column label="办理状态" prop="complaintStatus">
|
<template #default="scope">
|
{{ form.status[scope.row.complaintStatus] }}
|
</template>
|
</el-table-column>
|
<el-table-column label="操作">
|
<template #default="scope">
|
<el-link type="primary" v-if="scope.row.complaintStatus == 2 || scope.row.complaintStatus == -1" @click="look(scope.row)">查看</el-link>
|
<el-link type="primary" v-if="scope.row.complaintStatus == 0" @click="inComplaintLogHandler(scope.row)">响应</el-link>
|
<el-link type="primary" @click="handlerRes(scope.row)" v-if="scope.row.complaintStatus == 1">办结</el-link>
|
</template>
|
</el-table-column>
|
</el-table>
|
<pagination v-show="form.quparams.total > 0" :total="form.quparams.total" v-model:page="form.quparams.pageNum" v-model:limit="form.quparams.pageSize" @pagination="getList" />
|
<handlerCom ref="handlerComRef"></handlerCom>
|
<orderDetails ref="orderDetailsRef"></orderDetails>
|
</div>
|
</template>
|
|
<script lang="ts" setup>
|
import { listComplaint, inComplaintLog } from '@/api/system/company/company'
|
import { ElMessageBox } from 'element-plus'
|
import handlerCom from './component/index.vue'
|
import orderDetails from '@/views/infomanger/enforcement/component/details.vue'
|
const { proxy } = getCurrentInstance()
|
const { complaint_type } = proxy.useDictPer("complaint_type");
|
console.log(complaint_type)
|
const handlerComRef = ref()
|
const orderDetailsRef = ref()
|
const formRef = ref()
|
const form = reactive({
|
quparams: {
|
content: '',
|
pageSize: 10,
|
pageNum: 1,
|
total: 0,
|
complaintReason: '',
|
executeDeptName: '',
|
complaintStatus: ''
|
},
|
tableData: [],
|
status: {
|
"-1":"已驳回",0:"待响应",1:"处理中",2:"已办结"
|
}
|
})
|
const dispImgType = (e: string) => {
|
return complaint_type.value.find((f: any) => f.value == e)?.label;
|
};
|
function handleQuery() {
|
form.quparams.pageNum = 1
|
listComplaintHttp()
|
}
|
function resetQuery() {
|
formRef.value.resetFields()
|
form.quparams.pageNum = 1
|
listComplaintHttp()
|
}
|
function listComplaintHttp() {
|
listComplaint(form.quparams).then((res: any) => {
|
// console.log(res.rows)
|
form.tableData = res.rows
|
form.quparams.total = res.total
|
})
|
}
|
function handlerRes(item) {
|
handlerComRef.value.openDialog(item)
|
}
|
function look(item) {
|
orderDetailsRef.value.openDialog(item)
|
}
|
function inComplaintLogHandler(item) {
|
ElMessageBox.confirm(
|
'确认响应该条数据?',
|
'提示',
|
{
|
confirmButtonText: '确认',
|
cancelButtonText: '取消',
|
type: 'warning',
|
}
|
)
|
.then(() => {
|
inComplaintLog({id: item.id}).then((res: any) => {
|
// console.log(res)
|
listComplaintHttp()
|
})
|
})
|
|
|
}
|
function getList(e: { limit: number; page: number }) {
|
form.quparams.pageSize = e.limit
|
form.quparams.pageNum = e.page
|
listComplaintHttp()
|
}
|
listComplaintHttp()
|
</script>
|
|
<style scoped lang="scss">
|
.evenly-distributed-labels {
|
:deep(){
|
.el-form-item__label {
|
position: relative; /* 设置相对定位作为星号的定位基准 */
|
text-align: justify;
|
text-align-last: justify; /* 确保最后一行也两端对齐 */
|
padding-left: 10px; /* 为星号预留空间 */
|
display: inline-block;
|
}
|
}
|
}
|
</style>
|
