update:新增举报中心

This commit is contained in:
lihaoyuan 2025-08-14 18:38:04 +08:00
parent e3844d6d11
commit 141a23fa9b
5 changed files with 462 additions and 0 deletions

View File

@ -64,3 +64,19 @@ export function getSmsRecord(params) {
params,
})
}
export function getReportList(){
return request({
url:URL.account.base.config.report_list,
method:'get',
})
}
export function dealReport(data){
return request({
url:URL.account.base.config.deal_report,
method:'post',
headers: {
'Content-Type': 'application/json'
},
data: JSON.stringify(data)
})
}

View File

@ -255,6 +255,8 @@ let url = {
editLanguage:
api_url + '/admin/account/account-base-config/editLanguage',
cleanCache: api_url + '/admin/account/account-base-config/cleanCache',
report_list: api_url+'/admin/sns/snsUserReport/list',
deal_report:'/admin/sns/snsUserReport/dealReport',
},
user: {

View File

@ -84,7 +84,23 @@ export function convertRouter(asyncRoutes) {
route.children.push(obj)
}
if (route.meta.title == '设置') {
const obj = {
path: '/report',
component: '@/views/settings/config/report.vue',
name: 'Vab86001',
redirect: null,
meta: {
title: '举报中心',
icon: '',
noClosable: 0,
hidden: null,
},
menuHidden: false,
}
route.children.push(obj)
}
if (route.meta.title == '基础') {
const cloudPrintRoute = {
path: '/cloudPrint',

View File

@ -0,0 +1,253 @@
<template>
<div class="report_container">
<div class="filter">
<el-input
v-model="filter.reportName"
class="input_item"
clearable
placeholder="请输入举报人或举报人的手机号/ID/昵称"
prefix-icon="el-icon-search"
/>
<el-select
v-model="filter.state"
clearable
filterable
placeholder="选择处理状态"
>
<el-option
v-for="item in reportList"
:key="item.report_id"
:label="item.report_name"
:value="item.report_id"
/>
</el-select>
<el-button size="medium" type="primary" @click="handleSearch">
查询
</el-button>
</div>
<div class="list">
<el-table
ref="reportTable"
:data="tableData"
style="width: 100%"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" />
<el-table-column label="举报正文" prop="reportContent" width="180px"/>
<el-table-column label="举报凭证" prop="reportVerify">
<template #default="scope">
<div v-if="scope.row.reportVerify && scope.row.reportVerify.length">
<el-image
v-for="(img, index) in scope.row.reportVerify"
:key="index"
:src="img.url"
:preview-src-list="scope.row.reportVerify.map(item => item.url)"
style="width: 50px; height: 50px; margin-right: 5px; cursor: pointer"
fit="cover"
/>
</div>
<span v-else>无凭证</span>
</template>
</el-table-column>
<el-table-column label="举报人昵称" prop="reporterName" width="100" />
<el-table-column
label="举报人手机号码"
prop="reporterNumber"
width="120"
/>
<el-table-column label="举报时间" prop="reporterTime" />
<el-table-column label="状态" prop="state">
<template #default="scope">
<el-tag
:type="scope.row.state === '未处理' ? 'warning' : 'success'"
>
{{ scope.row.state }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="被举报人名称" prop="reportedName" width="120" />
<el-table-column
label="被举报人手机号"
prop="reportedNumber"
width="130"
/>
<el-table-column label="被举报人用户ID" prop="reportedId" width="130" />
<el-table-column label="操作">
<template #default="scope">
<el-button
plain
size="mini"
type="primary"
@click="handleReport(scope.row)"
>
处理举报
</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
background
:current-page="pagination.pageNum"
layout="total, sizes, prev, pager, next, jumper"
:page-size="pagination.pageSize"
:total="pagination.total"
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
/>
<ReportDetail ref="handleReport" @success="handleSuccess" />
</div>
</div>
</template>
<script>
import ReportDetail from './reportDetail.vue';
import { getReportList } from '@/api/base/config';
export default {
components: {
ReportDetail
},
data() {
return {
filter: {
reportName: '',
state: '',
},
//
reportList: [
{ report_id: 0, report_name: "未处理" },
{ report_id: 1, report_name: "已处理" }
],
tableData: [],
pagination: {
pageNum: 1,
pageSize: 10,
total: 0,
pages: 0
},
multipleSelection: []
}
},
mounted() {
this.handleReportList();
},
methods: {
//
handleReport(row) {
this.$refs.handleReport.open(row);
},
//
handleSuccess() {
this.handleReportList();
},
//
handleSelectionChange(val) {
this.multipleSelection = val;
},
//
async handleReportList() {
try {
const params = {
pageNum: this.pagination.pageNum,
pageSize: this.pagination.pageSize,
reportName: this.filter.reportName,
state: this.filter.state
};
let res = await getReportList(params);
//
this.tableData = (res.records || []).map(item => ({
id: item.id,
reportContent: item.reportContent,
reportVerify: item.evidenceImages
? JSON.parse(item.evidenceImages)
: [],
reporterName: item.reporterNickname,
reporterNumber: item.reporterPhone || '无',
reporterTime: item.createdAt,
state: this.getStatusText(item.processingStatus),
reportedName: item.reportedNickname,
reportedNumber: item.reportedPhone || '无',
reportedId: item.reportedUserId
}));
//
this.pagination = {
...this.pagination,
total: res.total || 0,
pageNum: res.current || 1,
pageSize: res.size || 10,
pages: res.pages || 0
};
} catch (error) {
console.error('获取举报列表失败:', error);
this.$message.error('获取数据失败,请重试');
}
},
//
handleCurrentChange(val) {
this.pagination.pageNum = val;
this.handleReportList();
},
//
handleSizeChange(val) {
this.pagination.pageSize = val;
this.pagination.pageNum = 1;
this.handleReportList();
},
//
handleSearch() {
this.pagination.pageNum = 1;
this.handleReportList();
},
//
getStatusText(status) {
switch (status) {
case 0:
return '未处理';
case 1:
return '已受理';
case 2:
return '已驳回';
case 3:
return '处理完成';
default:
return '未知状态';
}
},
}
}
</script>
<style lang="scss" scoped>
.filter {
display: flex;
align-items: center;
padding: 20px;
margin-bottom: 15px;
gap: 10px;
border-radius: 5px;
box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.1);
background: #fff;
.input_item {
width: 250px;
}
}
.list {
background: #fff;
padding: 20px;
display: flex;
flex-direction: column;
gap: 10px;
border-radius: 5px;
box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.1);
}
.tool {
display: flex;
gap: 10px;
::v-deep .el-button {
margin-left: 0 !important;
}
}
</style>

View File

@ -0,0 +1,175 @@
<template>
<el-dialog
:visible.sync="visible"
title="处理举报"
width="600px"
:before-close="handleClose"
>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="处理状态" prop="processingStatus">
<el-select
v-model="form.processingStatus"
placeholder="请选择处理状态"
@change="handleStatusChange"
>
<el-option label="受理中" value="1" />
<el-option label="证据不足" value="2" />
<el-option label="已处理" value="3" />
</el-select>
</el-form-item>
<el-form-item
label="处理结果"
prop="processingResult"
v-if="['2', '3'].includes(form.processingStatus)"
>
<el-input
v-model="form.processingResult"
type="textarea"
rows="3"
placeholder="请输入处理结果"
/>
</el-form-item>
<!-- 处理佐证材料仅状态3时显示 -->
<el-form-item label="佐证材料" v-if="form.processingStatus === '3'">
<PicUpload
:width="148"
:height="148"
:showFileList="true"
:fileList="uploadFiles"
@get-file="handleGetFile"
@remove-file="handleRemoveFile"
/>
<div style="margin-top: 10px; font-size: 12px; color: #666">
支持上传图片作为处理佐证
</div>
</el-form-item>
</el-form>
<div slot="footer">
<el-button @click="handleClose">取消</el-button>
<el-button type="primary" @click="handleSubmit">提交处理</el-button>
</div>
</el-dialog>
</template>
<script>
import { dealReport } from '@/api/base/config';
import PicUpload from '@/components/material/PicUpload.vue';
export default {
components: {
PicUpload,
},
data() {
return {
visible: false,
form: {
id: null, // ID
processingStatus: '', // 1/2/3
processingResult: '', // 2/3
processingEvidenceImages: [], // 3
},
rules: {
processingStatus: [
{ required: true, message: '请选择处理状态', trigger: 'change' },
],
processingResult: [
{ required: true, message: '请输入处理结果', trigger: 'blur' },
],
},
uploadFiles: [], //
};
},
methods: {
open(row) {
this.visible = true;
this.form = {
...this.form,
id: row.id,
processingStatus: '',
processingResult: '',
processingEvidenceImages: [],
};
this.uploadFiles = []; //
},
//
handleStatusChange(val) {
if (val === '1') {
this.form.processingResult = '';
this.uploadFiles = [];
this.form.processingEvidenceImages = [];
} else if (val === '2') {
this.uploadFiles = [];
this.form.processingEvidenceImages = [];
}
},
//
handleGetFile(files) {
this.uploadFiles = files;
this.form.processingEvidenceImages = files.map(file => ({
url: file,
description: '处理佐证材料'
}));
},
//
handleRemoveFile(files) {
this.uploadFiles = files;
this.form.processingEvidenceImages = files.map(file => ({
url: file,
description: '处理佐证材料'
}));
},
async handleSubmit() {
this.$refs.form.validate(async (valid) => {
if (!valid) return;
//
const submitData = {
id: this.form.id,
processingStatus: this.form.processingStatus,
};
// 23
if (['2', '3'].includes(this.form.processingStatus)) {
submitData.processingResult = this.form.processingResult;
}
// 3
if (this.form.processingStatus === '3') {
if (this.form.processingEvidenceImages.length === 0) {
return this.$message.warning('请上传佐证材料');
}
// JSON
submitData.processingEvidenceImages = JSON.stringify(this.form.processingEvidenceImages);
}
//
try {
await dealReport(submitData); //
this.$message.success('处理成功');
this.visible = false;
this.$emit('success'); //
} catch (err) {
this.$message.error('处理失败:' + (err.message || '未知错误'));
}
});
},
//
handleClose() {
this.visible = false;
this.$refs.form.resetFields(); //
this.uploadFiles = []; //
},
},
};
</script>
<style scoped>
.upload-demo {
margin-top: 10px;
}
</style>