/*
|
* @Company: hugeInfo
|
* @Author: lwh
|
* @Date: 2025-04-10 16:45:00
|
* @LastEditTime: 2025-05-13 17:04:37
|
* @LastEditors: lwh
|
* @Version: 1.0.0
|
* @Description: 申请记录详情
|
*/
|
import React, { useState, useEffect } from 'react';
|
import { useHistory } from 'react-router-dom';
|
import { TextareaItem, Button, Modal, Drawer, Radio } from 'dingtalk-design-mobile';
|
import { Scrollbars } from 'react-custom-scrollbars';
|
|
import { sqjl_1, sqjl_2, sqjl_3, applyClose_1 } from '../../../../assets/img';
|
import NavBarPage from '../../../../components/NavBarPage';
|
import DingUpload from '../../../../components/DingUpload';
|
import * as $$ from '../../../../utils/utility';
|
import './detail.less';
|
|
// 审核接口
|
function submit(type, data) {
|
let url = type === '回退申请' ? `caseTask/returnAudit` : type === '联合处置申请' ? `caseAssistApply/reviewCaseAssistApply` : `caseTask/windupAudit`;
|
return $$.ax.request({ url: url, type: 'post', service: 'mediate', data });
|
}
|
|
const SqjlDetail = () => {
|
const caseId = $$.getQueryString('caseId');
|
const caseTaskId = $$.getQueryString('caseTaskId');
|
const text = $$.getQueryString('text');
|
const btn = $$.getQueryString('btn');
|
const history = useHistory();
|
|
const [applyInfo, setApplyInfo] = useState({});
|
const [fileList, setFileList] = useState([]);
|
const [drawerVisible, setDrawerVisible] = useState(false);
|
const [submitting, setSubmitting] = useState(false);
|
const [cooperateDepts, setCooperateDepts] = useState([]); // 配合部门列表
|
const [auditForm, setAuditForm] = useState({
|
auditResult: '同意', // 审核结果: 同意/不同意
|
rejectReason: '', // 不同意的理由类型
|
content: '', // 审核意见内容
|
fileList: [], // 审核附件
|
});
|
|
useEffect(() => {
|
const record = $$.getLocal('sqjl_record') || {};
|
const { object } = record;
|
if (record.type === '回退申请') {
|
object.applyStatus = object.returnStatus;
|
object.applyTime = object.returnTime;
|
object.applyUnitName = object.returnUnitName;
|
object.applyUserName = object.returnUserName;
|
object.applyUserId = object.returnUserId;
|
}
|
if (record.type === '上报申请') {
|
object.applyStatus = object.applyStatus;
|
object.applyTime = object.appearTime;
|
object.applyUnitName = object.appearUnitName;
|
object.applyUserName = object.appearUserName;
|
object.applyUserId = object.appearUserId;
|
}
|
if (record.type === '司法确认申请') {
|
object.applyStatus = object.judicAudit === '24_00004-0' ? 0 : 1;
|
object.auditResult = object.judicAudit;
|
}
|
setApplyInfo(record?.object || {});
|
setFileList(record?.fileList?.[0]?.fileList || []);
|
$$.clearLocal('sqjl_record');
|
}, []);
|
|
// 获取申请状态图标
|
const getStatusImg = () => {
|
if (!applyInfo) return null;
|
|
// 未审核状态
|
if (applyInfo.auditResult === null || applyInfo.auditResult === undefined) {
|
return sqjl_1;
|
}
|
// 已审核状态
|
return applyInfo.auditResult === '24_00004-1' ? sqjl_2 : sqjl_3;
|
};
|
|
// 获取状态文本
|
const getStatusText = () => {
|
if (!applyInfo) return '';
|
|
if (applyInfo.auditResult === null || applyInfo.auditResult === undefined) {
|
return '待审核';
|
}
|
return applyInfo.auditResult === '24_00004-1' ? '审核通过' : '审核不通过';
|
};
|
|
// 打开审核抽屉
|
const handleShowAuditDrawer = () => {
|
setDrawerVisible(true);
|
};
|
|
// 关闭审核抽屉
|
const handleCloseAuditDrawer = () => {
|
setDrawerVisible(false);
|
};
|
|
// 更新审核表单
|
const handleAuditFormChange = (field, value) => {
|
setAuditForm((prev) => ({
|
...prev,
|
[field]: value,
|
}));
|
|
// 如果切换了审核结果，重置理由
|
if (field === 'auditResult' && value === '同意') {
|
setAuditForm((prev) => ({
|
...prev,
|
rejectReason: '',
|
content: '',
|
}));
|
}
|
};
|
|
// 提交审核
|
const handleSubmitAudit = async () => {
|
// 验证表单
|
if (!auditForm.auditResult) {
|
$$.showToast({ content: '请选择审核结果' });
|
return;
|
}
|
|
if (auditForm.auditResult === '不同意') {
|
if (text !== '联合处置申请') {
|
if (!auditForm.rejectReason) {
|
$$.showToast({ content: '请选择理由' });
|
return;
|
}
|
|
if (auditForm.rejectReason === '其他' && !auditForm.content) {
|
$$.showToast({ content: '请填写不同意的理由' });
|
return;
|
}
|
} else {
|
if (!auditForm.content) {
|
$$.showToast({ content: '请填写不同意的理由' });
|
return;
|
}
|
}
|
}
|
|
const params = {
|
caseId,
|
caseTaskId,
|
id: applyInfo?.id,
|
auditResult: auditForm.auditResult === '同意' ? '24_00004-1' : '24_00004-2',
|
auditContent:
|
auditForm.auditResult === '同意'
|
? '同意'
|
: text === '联合处置申请'
|
? auditForm.content
|
: auditForm.rejectReason === '其他'
|
? auditForm.content
|
: auditForm.rejectReason,
|
};
|
|
global.setSpinning(true);
|
const res = await submit(text, params);
|
global.setSpinning(false);
|
if (res.type) {
|
$$.showToast({ type: 'success', content: '提交成功' });
|
handleCloseAuditDrawer();
|
// 返回两层
|
history.go(-2);
|
}
|
};
|
|
return (
|
<NavBarPage title={text || '申请详情'}>
|
<Scrollbars style={{ height: 'calc(100vh - 112px)', backgroundColor: '#F2F2F2' }}>
|
<div className="sqjl-detail">
|
<div className="sqjl-detail-card">
|
{getStatusImg() && (
|
<div className="sqjl-detail-status">
|
<img src={getStatusImg()} alt={getStatusText()} />
|
</div>
|
)}
|
<div className="sqjl-detail-row">
|
<div className="sqjl-detail-label">申请时间</div>
|
<div className="sqjl-detail-value">{applyInfo.applyTime ? $$.timeFormat(applyInfo.applyTime) : '-'}</div>
|
</div>
|
<div className="sqjl-detail-row">
|
<div className="sqjl-detail-label">申请人</div>
|
<div className="sqjl-detail-value">
|
{applyInfo.applyUserName || '-'} {applyInfo.applyUnitName ? `(${applyInfo.applyUnitName})` : '-'}
|
</div>
|
</div>
|
{text === '上报申请' && (
|
<>
|
<div className="sqjl-detail-row">
|
<div className="sqjl-detail-label">上报意见</div>
|
<div className="sqjl-detail-dept">{applyInfo.appearContent}</div>
|
</div>
|
</>
|
)}
|
{text === '回退申请' && (
|
<>
|
<div className="sqjl-detail-row">
|
<div className="sqjl-detail-label">回退理由</div>
|
<div className="sqjl-detail-dept">{applyInfo.returnContent}</div>
|
</div>
|
</>
|
)}
|
{text === '联合处置申请' && (
|
<>
|
<div className="sqjl-detail-row">
|
<div className="sqjl-detail-label">添加配合部门</div>
|
<div className="sqjl-detail-value">
|
<div className="sqjl-detail-dept">{applyInfo.applyAssistUnitName}</div>
|
</div>
|
</div>
|
<div className="sqjl-detail-row">
|
<div className="sqjl-detail-label">添加理由</div>
|
<div className="sqjl-detail-dept">{applyInfo.applyContent || '-'}</div>
|
</div>
|
</>
|
)}
|
{text === '结案申请' && (
|
<>
|
<div className="sqjl-detail-row">
|
<div className="sqjl-detail-label">化解结果</div>
|
<div className="sqjl-detail-value">
|
<div className="sqjl-detail-dept">
|
{applyInfo.mediateResult === '24_00004-2' ? '化解不成功' : '化解成功'}
|
</div>
|
</div>
|
</div>
|
{applyInfo.mediateResult === '24_00004-2' && (
|
<>
|
<div className="sqjl-detail-row">
|
<div className="sqjl-detail-label">无法化解理由</div>
|
<div className="sqjl-detail-dept">
|
{applyInfo.failReason && (
|
<>
|
<div>1、调解过程中采取的措施及解决方案</div>
|
<div>{applyInfo.failReason}</div>
|
</>
|
)}
|
{applyInfo.failReasonTwo && (
|
<>
|
<div>2、最终难以调和的原因</div>
|
<div>{applyInfo.failReasonTwo}</div>
|
</>
|
)}
|
</div>
|
</div>
|
<div className="sqjl-detail-row">
|
<div className="sqjl-detail-label">结案意见</div>
|
<div className="sqjl-detail-dept">{applyInfo.windupContent || '-'}</div>
|
</div>
|
</>
|
)}
|
</>
|
)}
|
<div className="sqjl-detail-files">
|
<DingUpload
|
fileList={fileList}
|
disabled={true}
|
viewOnly={true}
|
title="附件材料"
|
mainId={caseTaskId}
|
ownerId={caseTaskId}
|
ownerType="CASE_TASK"
|
/>
|
</div>
|
</div>
|
|
{/* 审核信息 */}
|
{applyInfo.auditTime && (
|
<div className="sqjl-detail-card sqjl-detail-audit-info">
|
<div className="sqjl-detail-row">
|
<div className="sqjl-detail-label">审核时间</div>
|
<div className="sqjl-detail-value">{$$.timeFormat(applyInfo.auditTime)}</div>
|
</div>
|
<div className="sqjl-detail-row">
|
<div className="sqjl-detail-label">审核人</div>
|
<div className="sqjl-detail-value">
|
{applyInfo.auditUserName || '-'} {applyInfo.auditUnitName ? `(${applyInfo.auditUnitName})` : '-'}
|
{applyInfo.auditPhone && <span className="sqjl-detail-phone"> {applyInfo.auditPhone}</span>}
|
</div>
|
</div>
|
{applyInfo.auditResultName && (
|
<div className="sqjl-detail-row">
|
<div className="sqjl-detail-label">审核意见</div>
|
<div className="sqjl-detail-value">{applyInfo.auditResultName}</div>
|
</div>
|
)}
|
</div>
|
)}
|
</div>
|
</Scrollbars>
|
{btn && (
|
<div className="sqjl-detail-bottom">
|
<Button type="primary" block onClick={handleShowAuditDrawer}>
|
审核
|
</Button>
|
</div>
|
)}
|
|
{/* 审核抽屉 */}
|
<Drawer visible={drawerVisible} position="bottom" onMaskClick={handleCloseAuditDrawer}>
|
<div className="audit-drawer">
|
<div className="audit-drawer-header">
|
<div className="audit-drawer-title">审核</div>
|
<div className="audit-drawer-close" onClick={handleCloseAuditDrawer}>
|
<i className="audit-drawer-close-icon"></i>
|
</div>
|
</div>
|
|
<div className="audit-drawer-content">
|
<div className="audit-drawer-scroll">
|
<div className="audit-section">
|
<div className="audit-section-title">审核结果</div>
|
<div className="audit-radio-group">
|
<div
|
className={`audit-radio-item ${auditForm.auditResult === '同意' ? 'active' : ''}`}
|
onClick={() => handleAuditFormChange('auditResult', '同意')}
|
>
|
<span>同意</span>
|
{auditForm.auditResult === '同意' ? (
|
<img src={applyClose_1} alt="选中" className="audit-radio-checked" />
|
) : (
|
<div className="audit-radio-unchecked"></div>
|
)}
|
</div>
|
<div
|
className={`audit-radio-item ${auditForm.auditResult === '不同意' ? 'active' : ''}`}
|
onClick={() => handleAuditFormChange('auditResult', '不同意')}
|
>
|
<span>不同意</span>
|
{auditForm.auditResult === '不同意' ? (
|
<img src={applyClose_1} alt="选中" className="audit-radio-checked" />
|
) : (
|
<div className="audit-radio-unchecked"></div>
|
)}
|
</div>
|
</div>
|
</div>
|
|
{auditForm.auditResult === '不同意' && (
|
<>
|
{text === '回退申请' && (
|
<>
|
<div className="audit-section required-field">
|
<div className="audit-section-title">理由说明</div>
|
<div className="audit-reason-group">
|
<div
|
className={`audit-reason-item ${auditForm.rejectReason === '回退理由不充分' ? 'active' : ''}`}
|
onClick={() => handleAuditFormChange('rejectReason', '回退理由不充分')}
|
>
|
{auditForm.rejectReason === '回退理由不充分' ? (
|
<img src={applyClose_1} alt="选中" className="audit-radio-checked" />
|
) : (
|
<div className="audit-radio-unchecked"></div>
|
)}
|
<span>回退理由不充分</span>
|
</div>
|
<div
|
className={`audit-reason-item ${auditForm.rejectReason === '回退超迟' ? 'active' : ''}`}
|
onClick={() => handleAuditFormChange('rejectReason', '回退超迟')}
|
>
|
{auditForm.rejectReason === '回退超迟' ? (
|
<img src={applyClose_1} alt="选中" className="audit-radio-checked" />
|
) : (
|
<div className="audit-radio-unchecked"></div>
|
)}
|
<span>回退超迟</span>
|
</div>
|
<div
|
className={`audit-reason-item ${auditForm.rejectReason === '其他' ? 'active' : ''}`}
|
onClick={() => handleAuditFormChange('rejectReason', '其他')}
|
>
|
{auditForm.rejectReason === '其他' ? (
|
<img src={applyClose_1} alt="选中" className="audit-radio-checked" />
|
) : (
|
<div className="audit-radio-unchecked"></div>
|
)}
|
<span>其他</span>
|
</div>
|
</div>
|
</div>
|
{auditForm.rejectReason === '其他' && (
|
<div className="audit-content-wrapper">
|
<TextareaItem
|
placeholder={`请填写不同意${text}的理由`}
|
value={auditForm.content}
|
onChange={(value) => handleAuditFormChange('content', value)}
|
rows={4}
|
/>
|
</div>
|
)}
|
</>
|
)}
|
{text === '上报申请' && (
|
<>
|
<div className="audit-section required-field">
|
<div className="audit-section-title">理由说明</div>
|
<div className="audit-reason-group">
|
<div
|
className={`audit-reason-item ${auditForm.rejectReason === '上报理由不充分' ? 'active' : ''}`}
|
onClick={() => handleAuditFormChange('rejectReason', '上报理由不充分')}
|
>
|
{auditForm.rejectReason === '上报理由不充分' ? (
|
<img src={applyClose_1} alt="选中" className="audit-radio-checked" />
|
) : (
|
<div className="audit-radio-unchecked"></div>
|
)}
|
<span>上报理由不充分</span>
|
</div>
|
<div
|
className={`audit-reason-item ${auditForm.rejectReason === '上报延迟' ? 'active' : ''}`}
|
onClick={() => handleAuditFormChange('rejectReason', '上报延迟')}
|
>
|
{auditForm.rejectReason === '上报延迟' ? (
|
<img src={applyClose_1} alt="选中" className="audit-radio-checked" />
|
) : (
|
<div className="audit-radio-unchecked"></div>
|
)}
|
<span>上报延迟</span>
|
</div>
|
<div
|
className={`audit-reason-item ${auditForm.rejectReason === '其他' ? 'active' : ''}`}
|
onClick={() => handleAuditFormChange('rejectReason', '其他')}
|
>
|
{auditForm.rejectReason === '其他' ? (
|
<img src={applyClose_1} alt="选中" className="audit-radio-checked" />
|
) : (
|
<div className="audit-radio-unchecked"></div>
|
)}
|
<span>其他</span>
|
</div>
|
</div>
|
</div>
|
{auditForm.rejectReason === '其他' && (
|
<div className="audit-content-wrapper">
|
<TextareaItem
|
placeholder={`请填写不同意${text}的理由`}
|
value={auditForm.content}
|
onChange={(value) => handleAuditFormChange('content', value)}
|
rows={4}
|
/>
|
</div>
|
)}
|
</>
|
)}
|
{text === '联合处置申请' && (
|
<>
|
<div className="audit-section required-field">
|
<div className="audit-section-title">理由说明</div>
|
<div className="audit-content-wrapper">
|
<TextareaItem
|
placeholder={`请填写不同意${text}的理由`}
|
value={auditForm.content}
|
onChange={(value) => handleAuditFormChange('content', value)}
|
rows={4}
|
/>
|
</div>
|
</div>
|
</>
|
)}
|
{text === '结案申请' && (
|
<div className="audit-section required-field">
|
<div className="audit-section-title">理由说明</div>
|
<div className="audit-reason-group">
|
<div
|
className={`audit-reason-item ${auditForm.rejectReason === '材料不完整' ? 'active' : ''}`}
|
onClick={() => handleAuditFormChange('rejectReason', '材料不完整')}
|
>
|
{auditForm.rejectReason === '材料不完整' ? (
|
<img src={applyClose_1} alt="选中" className="audit-radio-checked" />
|
) : (
|
<div className="audit-radio-unchecked"></div>
|
)}
|
<span>材料不完整</span>
|
</div>
|
<div
|
className={`audit-reason-item ${auditForm.rejectReason === '办理流程有问题' ? 'active' : ''}`}
|
onClick={() => handleAuditFormChange('rejectReason', '办理流程有问题')}
|
>
|
{auditForm.rejectReason === '办理流程有问题' ? (
|
<img src={applyClose_1} alt="选中" className="audit-radio-checked" />
|
) : (
|
<div className="audit-radio-unchecked"></div>
|
)}
|
<span>办理流程有问题</span>
|
</div>
|
<div
|
className={`audit-reason-item ${auditForm.rejectReason === '当事人不满意调解结果' ? 'active' : ''}`}
|
onClick={() => handleAuditFormChange('rejectReason', '当事人不满意调解结果')}
|
>
|
{auditForm.rejectReason === '当事人不满意调解结果' ? (
|
<img src={applyClose_1} alt="选中" className="audit-radio-checked" />
|
) : (
|
<div className="audit-radio-unchecked"></div>
|
)}
|
<span>当事人不满意调解结果</span>
|
</div>
|
<div
|
className={`audit-reason-item ${auditForm.rejectReason === '其他' ? 'active' : ''}`}
|
onClick={() => handleAuditFormChange('rejectReason', '其他')}
|
>
|
{auditForm.rejectReason === '其他' ? (
|
<img src={applyClose_1} alt="选中" className="audit-radio-checked" />
|
) : (
|
<div className="audit-radio-unchecked"></div>
|
)}
|
<span>其他</span>
|
</div>
|
</div>
|
{auditForm.rejectReason === '其他' && (
|
<div className="audit-content-wrapper">
|
<TextareaItem
|
placeholder={`请填写不同意${text}的具体理由`}
|
value={auditForm.content}
|
onChange={(value) => handleAuditFormChange('content', value)}
|
rows={4}
|
/>
|
</div>
|
)}
|
</div>
|
)}
|
</>
|
)}
|
|
<div className="audit-attach-section">
|
<DingUpload
|
fileList={auditForm.fileList}
|
title="附件材料"
|
subtitle="可添加审核相关附件"
|
mainId={caseId}
|
ownerId={applyInfo?.id || ''}
|
ownerType="22_00018-513"
|
/>
|
</div>
|
</div>
|
|
<div className="audit-footer">
|
<Button type="primary" block onClick={handleSubmitAudit} loading={submitting}>
|
提交
|
</Button>
|
</div>
|
</div>
|
</div>
|
</Drawer>
|
</NavBarPage>
|
);
|
};
|
|
export default SqjlDetail;
|
