/*
|
* @Company: hugeInfo
|
* @Author: lwh
|
* @Date: 2024-12-11 09:38:40
|
* @LastEditTime: 2025-04-19 17:03:57
|
* @LastEditors: lwh
|
* @Version: 1.0.0
|
* @Description:
|
*/
|
import React, { Fragment, useState, useEffect, useRef } from 'react';
|
import { Row, Col, Space, Typography } from 'antd';
|
import { Input, Select, Radio, Button, Form } from '@arco-design/web-react';
|
import { IconInfoCircleFill } from '@arco-design/web-react/icon';
|
import { Scrollbars } from 'react-custom-scrollbars';
|
import * as $$ from '../../utils/utility';
|
import { useNavigate } from 'react-router-dom';
|
import ArcoUpload from '@/components/ArcoUpload';
|
import NewPage from '../../components/NewPage';
|
import PreviewImage from '@/components/PreviewImage';
|
import NameCard2 from '../../components/NameCard2';
|
import MyPDF from '../../components/MyPDF';
|
import SelectObjModal from '../../components/SelectObjModal/selectJudge';
|
import MyButtonTabs from '../../components/MyButtonTabs';
|
import MyModal from '../../components/MyModal';
|
import CaseDetail from './CaseDetail';
|
import { judicial_5, judicial_6 } from '../../assets/images';
|
import './index.less';
|
|
const FormItem = Form.Item;
|
const { Link, Text, Paragraph } = Typography;
|
const { TextArea } = Input;
|
const { Option } = Select;
|
const appUrl = $$.appUrl;
|
// 司法确认详情接口
|
function getJudicInfoApi(submitData) {
|
return $$.ax.request({ url: 'judicInfo/getJudicInfo', type: 'get', data: submitData, service: 'mediate' });
|
}
|
|
// 根据judicId获取案件信息
|
function getCaseDataApi(submitData) {
|
return $$.ax.request({ url: `caseInfo/getCaseInfo`, data: submitData, type: 'get', service: 'mediate' });
|
}
|
|
function delFile(id) {
|
return $$.ax.request({ url: `fileInfo/deleteFileById`, type: 'get', service: 'sys', data: { id } });
|
}
|
// 提交审核
|
function applyJudicialApi(submitData) {
|
return $$.ax.request({ url: `judicInfo/courtAudit`, type: 'post', service: 'mediate', data: submitData });
|
}
|
// 获取助理列表
|
function listAssistApi(submitData) {
|
return $$.ax.request({ url: `ctUserole/listAssist`, type: 'get', service: 'cust', data: submitData });
|
}
|
|
// 办理结果（化解结果、协议文书等结案信息）
|
function getTransactResultApi(caseId) {
|
return $$.ax.request({ url: `caseInfoUnfold/getTransactResult?caseId=${caseId}`, type: 'get', service: 'mediate' });
|
}
|
|
const CourtAuditEdit = () => {
|
const formRef = useRef();
|
const myUploadRef = useRef();
|
let navigate = useNavigate();
|
const judicId = $$.getQueryString('judicId');
|
const caseTaskId = $$.getQueryString('caseTaskId');
|
const caseId = $$.getQueryString('caseId');
|
// 获取idList数组
|
const idList = (() => {
|
try {
|
const idListParam = $$.getQueryString('idList');
|
return idListParam ? JSON.parse(idListParam) : [];
|
} catch (error) {
|
console.error('解析idList失败:', error);
|
return [];
|
}
|
})();
|
|
// 添加Tab活动标签状态
|
const [tabsActive, setTabsActive] = useState(idList.length > 0 ? idList[idList.length - 1] : '');
|
|
const [caseCheckModal, setCaseCheckModal] = useState(false);
|
|
// 回显数据
|
const [data, setData] = useState([]);
|
// 数据
|
const [formData, setFormData] = useState({});
|
const [caseData, setCaseData] = useState({});
|
const [transactResult, setTransactResult] = useState(null);
|
|
const [filesList, setFilesList] = useState([]);
|
// 司法确认部门单位
|
const [listCourt, setListCourt] = useState([]);
|
|
const [stepsNum, setStepsNum] = useState(0);
|
|
// 选择法官弹窗
|
const [isModalVisible, setIsModalVisible] = useState(false);
|
const [selectObjModalData, setSelectObjModalData] = useState({});
|
// 审核结果是否同意
|
const [agree, setAgree] = useState('24_00004-1');
|
|
//删除文件
|
const handleDelFile = async (id) => {
|
const res = await delFile(id);
|
if (res.type) {
|
$$.infoSuccess({ content: '删除成功！' });
|
}
|
};
|
|
// 修改
|
function handleChangeValue(key, value) {
|
formData[key] = value;
|
setFormData({ ...formData });
|
}
|
|
// 提交申请
|
function handleApply() {
|
if (formRef.current) {
|
formRef.current.validate(undefined, (errors, values) => {
|
if (!errors) {
|
const data = formRef?.current.getFields();
|
console.log('data', data);
|
|
$$.arcoModalInfo({
|
icon: <IconInfoCircleFill style={{ color: '#1A6FB8' }} />,
|
title: '提醒',
|
closable: false,
|
style: { borderRadius: '8px' },
|
content: <span>确定提交该司法确认申请审核吗？</span>,
|
okText: '确定',
|
cancelText: '我再想想',
|
onOk: () => {
|
applyJudicial({ ...data, judicId });
|
},
|
});
|
}
|
});
|
}
|
}
|
|
// 提交审核
|
async function applyJudicial(data) {
|
global.setSpinning(true);
|
const res = await applyJudicialApi(data);
|
global.setSpinning(false);
|
if (res.type) {
|
navigate(-1);
|
}
|
}
|
|
// 助理列表字典值选择
|
async function gatListCourt(data) {
|
global.setSpinning(true);
|
const res = await listAssistApi({ courtId: data?.courtId });
|
global.setSpinning(false);
|
if (res.type) {
|
setListCourt(res.data || []);
|
}
|
}
|
|
// 初始化附件回显
|
async function getJudicialApply(id) {
|
global.setSpinning(true);
|
const res = await getJudicInfoApi({ judicId: id });
|
global.setSpinning(false);
|
if (res.type) {
|
setData(res.data);
|
gatListCourt(res.data || {});
|
}
|
}
|
async function getCaseData() {
|
global.setSpinning(true);
|
const res = await getCaseDataApi({ id: caseId });
|
global.setSpinning(false);
|
if (res.type) {
|
const { agentList, personList, ...rest } = res.data;
|
const parList = agentList.concat(personList);
|
const newParList =
|
parList?.map((item) => {
|
const fileInfoList = item.fileInfoList;
|
let file = []; //身份证明材料、企业登记材料
|
let file1 = []; //法人、机构身份证明材料、代理人授权委托书
|
if (fileInfoList && fileInfoList.length != 0) {
|
fileInfoList.forEach((item) => {
|
if (item.ownerType == '22_00018-202' || item.ownerType == '22_00018-203') {
|
item.fileList.forEach((res) => {
|
file.push({
|
...res,
|
uid: res.id,
|
});
|
});
|
}
|
if (item.ownerType == '22_00018-204' || item.ownerType == '22_00018-207') {
|
item.fileList.forEach((res) => {
|
file1.push({
|
...res,
|
uid: res.id,
|
});
|
});
|
}
|
});
|
}
|
return {
|
...item,
|
file,
|
file1,
|
};
|
}) || [];
|
const obj = {
|
...rest,
|
fakeData: newParList,
|
};
|
setCaseData(obj);
|
}
|
}
|
|
async function getTransactResult(id) {
|
const res = await getTransactResultApi(id);
|
if (res.type) {
|
if (res.data) {
|
setTransactResult({ ...res.data });
|
} else {
|
setTransactResult(null);
|
}
|
}
|
}
|
|
//初始化
|
useEffect(() => {
|
if (judicId) {
|
getCaseData();
|
if (idList.length > 0) {
|
getJudicialApply(tabsActive || idList[idList.length - 1]);
|
}
|
getTransactResult(caseId);
|
}
|
}, [tabsActive]);
|
|
return (
|
<NewPage pageHead={{ breadcrumbData: [{ title: '工作台' }, { title: '司法确认申请审核' }], title: '司法确认申请审核' }}>
|
<div style={{ padding: '0 16px' }}>
|
{idList.length > 1 && (
|
<MyButtonTabs
|
tabs={idList.map((item, index) => ({
|
label: `第${['一', '二', '三', '四', '五', '六', '七', '八', '九', '十'][index]}次`,
|
key: item,
|
}))}
|
activeKey={tabsActive || idList[idList.length - 1]}
|
onChange={(activeKey) => setTabsActive(activeKey)}
|
/>
|
)}
|
</div>
|
<Fragment>
|
<Scrollbars style={{ height: idList.length > 1 ? 'calc(100vh - 279px)' : 'calc(100vh - 219px)' }} autoHide>
|
<div className=" dataSync-noScrollPage">
|
<Row gutter={[16, 16]}>
|
<Col span={24}>
|
<Space>
|
<div className="MediationInfo-subTitle"></div>
|
<span style={{ fontSize: '16px', lineHeight: '24px' }}>申请信息</span>
|
</Space>
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">案件信息</div>
|
{/* <div className='judicialSubmit-audit-case' onClick={() => setCaseCheckModal(true)}> */}
|
<div
|
className="judicialSubmit-audit-case"
|
onClick={() => window.open(`${$$.windowUrl}/windowDetail?caseTaskId=${caseTaskId}&caseId=${caseId}`)}
|
>
|
<div style={{ display: 'flex', gap: '16px', alignItems: 'center' }}>
|
<div>
|
<img src={judicial_5} alt="" srcset="" />
|
</div>
|
<div>
|
<div className="judicialSubmit-audit-case-flex">
|
<div>承办部门：{transactResult?.mediateUnitName || '-'}</div>
|
<div className="judicialSubmit-audit-case-subTitle">
|
申请方：
|
{caseData.fakeData?.filter((i) => i.perType === '15_020008-1')?.length === 1
|
? caseData.fakeData?.filter((i) => i.perType === '15_020008-1')[0].trueName
|
: caseData.fakeData?.filter((i) => i.perType === '15_020008-1s')?.length > 1
|
? `${caseData.fakeData?.filter((i) => i.perType === '15_020008-1')[0].trueName}...等共${
|
caseData.fakeData?.filter((i) => i.perType === '15_020008-1')?.length
|
}人`
|
: '-'}{' '}
|
| 被申请方：
|
{caseData.fakeData?.filter((i) => i.perType === '15_020008-2')?.length === 1
|
? caseData.fakeData?.filter((i) => i.perType === '15_020008-1')[0].trueName
|
: caseData.fakeData?.filter((i) => i.perType === '15_020008-2')?.length > 1
|
? `${caseData.fakeData?.filter((i) => i.perType === '15_020008-2')[0].trueName}...等共${
|
caseData.fakeData?.filter((i) => i.perType === '15_020008-2')?.length
|
}人`
|
: '-'}
|
</div>
|
</div>
|
<div className="judicialSubmit-audit-case-subTitle">
|
办结时间：{$$.minuteFormat(transactResult?.closeTime)} | {transactResult?.mediResultName || '-'}
|
</div>
|
</div>
|
</div>
|
<div>
|
<img src={judicial_6} alt="" srcset="" />
|
</div>
|
</div>
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">申请理由</div>
|
<div className="public-infoSubTitle">{data?.applyContent || '-'}</div>
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">调解协议书</div>
|
{data?.fileList?.find((i) => i.ownerType === '22_00018-412')?.fileList?.length ? (
|
data?.fileList
|
?.find((i) => i.ownerType === '22_00018-412')
|
?.fileList?.map((item, index) => {
|
return (
|
<>
|
<MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
|
</>
|
);
|
})
|
) : (
|
<div className="public-infoSubTitle">-</div>
|
)}
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">非诉讼调解协议司法确认申请书</div>
|
{data?.fileList?.find((i) => i.ownerType === '22_00018-402')?.fileList?.length ? (
|
data?.fileList
|
?.find((i) => i.ownerType === '22_00018-402')
|
?.fileList?.map((item, index) => {
|
return (
|
<>
|
<MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
|
</>
|
);
|
})
|
) : (
|
<div className="public-infoSubTitle">-</div>
|
)}
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">诉前联调协议案件移送函</div>
|
{data?.fileList?.find((i) => i.ownerType === '22_00018-403')?.fileList?.length ? (
|
data?.fileList
|
?.find((i) => i.ownerType === '22_00018-403')
|
?.fileList?.map((item, index) => {
|
return (
|
<>
|
<MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
|
</>
|
);
|
})
|
) : (
|
<div className="public-infoSubTitle">-</div>
|
)}
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">送达地址确认书</div>
|
{data?.fileList?.find((i) => i.ownerType === '22_00018-108')?.fileList?.length ? (
|
data?.fileList
|
?.find((i) => i.ownerType === '22_00018-108')
|
?.fileList?.map((item, index) => {
|
return (
|
<>
|
<MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
|
</>
|
);
|
})
|
) : (
|
<div className="public-infoSubTitle">-</div>
|
)}
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">申请时间</div>
|
<div className="public-infoSubTitle">{$$.minuteFormat(data?.applyTime)}</div>
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">申请人</div>
|
<div className="public-infoSubTitle">
|
<span className="public-nameCard2">
|
{data?.applyUnitName}
|
<NameCard2 name={data.applyUserName} userId={data.applyUserId} />
|
</span>
|
</div>
|
</Col>
|
</Row>
|
</div>
|
<div style={{ height: '16px' }}></div>
|
{/* 审核处理 - 只在最后一个元素时显示 */}
|
{tabsActive === idList[idList.length - 1] ? (
|
<div className=" dataSync-noScrollPage">
|
<Row gutter={[16, 16]}>
|
<Col span={24} style={{ marginBottom: '12px' }}>
|
<Space>
|
<div className="MediationInfo-subTitle"></div>
|
<span style={{ fontSize: '16px', lineHeight: '24px' }}>审核处理</span>
|
</Space>
|
</Col>
|
</Row>
|
<Form
|
ref={formRef}
|
layout="vertical"
|
requiredSymbol={false}
|
scrollToFirstError={true}
|
onChange={(first, allValues) => {
|
if (first?.judicAudit) {
|
setAgree(first?.judicAudit);
|
formRef.current.clearFields();
|
formRef.current.setFieldsValue({
|
judicAudit: first.judicAudit,
|
});
|
}
|
}}
|
initialValues={{
|
judicAudit: '24_00004-1',
|
}} //默认值
|
>
|
<Row>
|
<Col span={24}>
|
<FormItem
|
label={<div style={{ display: 'flex' }}>审核结果</div>}
|
field="judicAudit"
|
rules={[{ required: true, message: '请选择审核结果' }]}
|
>
|
<Radio.Group>
|
<Space direction="vertical">
|
{[
|
{ value: '24_00004-1', label: '同意' },
|
{ value: '24_00004-2', label: '不同意' },
|
].map((x) => (
|
<Radio value={x.value} key={x.value} label={x.label}>
|
{x.label}
|
</Radio>
|
))}
|
</Space>
|
</Radio.Group>
|
</FormItem>
|
</Col>
|
{/* 如果选择不同意，则隐藏承办法官 */}
|
{agree === '24_00004-2' && (
|
<>
|
<Col span={24}>
|
<FormItem
|
label={
|
<div style={{ display: 'flex' }}>
|
理由说明<div className="must">必填</div>
|
</div>
|
}
|
field="handleContent"
|
rules={[{ required: true, message: '理由说明不能为空' }]}
|
>
|
<TextArea rows={5} maxLength={256} autoSize={{ minRows: 4, maxRows: 8 }} placeholder="请填写审核不同意的理由说明" />
|
</FormItem>
|
</Col>
|
<Col span={24} className="doubleFile">
|
<div style={{ display: 'flex', marginBottom: '8px' }}>附件材料</div>
|
<ArcoUpload
|
params={{
|
action: `${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId=${caseId}&&ownerId=${judicId}&ownerType=22_00018-411`,
|
}}
|
field="mediationAgreement"
|
label=""
|
editData={{
|
file: filesList || [],
|
}}
|
handleDelFile={handleDelFile}
|
onFileListChange={(v) => {
|
let newList = v?.map((item) => {
|
if (item.response) {
|
return item.response.data[0];
|
} else {
|
return item;
|
}
|
});
|
setFilesList(newList);
|
}}
|
/>
|
</Col>
|
</>
|
)}
|
{agree === '24_00004-1' && (
|
<>
|
<Col span={24}>
|
<FormItem
|
label={
|
<div style={{ display: 'flex' }}>
|
承办法官<div className="must">必填</div>
|
</div>
|
}
|
field="judgeName"
|
rules={[{ required: true, message: '请选择司法确认部门' }]}
|
>
|
<Input.Search
|
style={{ width: '450px' }}
|
placeholder="请选择"
|
onSearch={() => {
|
setSelectObjModalData({ ...selectObjModalData, key: 'judgeName', title: '承办法官' });
|
setIsModalVisible(true);
|
}}
|
searchButton="选择"
|
allowClear
|
maxLength={0}
|
/>
|
</FormItem>
|
</Col>
|
<Col span={24}>
|
<FormItem
|
label={
|
<div style={{ display: 'flex' }}>
|
助理/书记员<div style={{ color: '#86909C' }}>（可多选）</div>
|
</div>
|
}
|
field="courtId"
|
>
|
<Select
|
placeholder="请选择"
|
mode="multiple"
|
allowClear
|
style={{ width: '450px' }}
|
options={listCourt?.map((item) => ({
|
label: item.userName,
|
value: item.userId,
|
}))}
|
onChange={(value, selectedOptions) => {
|
formRef.current.setFieldValue('courtId', value);
|
formRef.current.setFieldValue(
|
'judicAssistList',
|
selectedOptions.map((option) => ({ assUserId: option.value, assUserName: option.children }))
|
);
|
}}
|
></Select>
|
</FormItem>
|
</Col>
|
</>
|
)}
|
</Row>
|
</Form>
|
</div>
|
) : (
|
<div className=" dataSync-noScrollPage">
|
<Row gutter={[16, 16]}>
|
<Col span={24} style={{ marginBottom: '12px' }}>
|
<Space>
|
<div className="MediationInfo-subTitle"></div>
|
<span style={{ fontSize: '16px', lineHeight: '24px' }}>审核信息</span>
|
</Space>
|
</Col>
|
{data?.judicAudit === '24_00004-1' && (
|
<>
|
<Col span={24}>
|
<div className="public-infoTitle">审核结果</div>
|
<div className="public-infoSubTitle public-success">同意</div>
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">承办法官</div>
|
<div className="public-infoSubTitle">
|
<span className="public-nameCard2">
|
{data?.applyUnitName}
|
<NameCard2 name={data.judgeName} userId={data.judgeNameId} />
|
</span>
|
</div>
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">助理/书记员</div>
|
<div style={{ display: 'flex', gap: '16px', flexWrap: 'wrap' }} className="public-infoSubTitle">
|
{data?.judicAssistList?.map((i) => (
|
<span className="public-nameCard2">
|
{i?.assUnitName}
|
<NameCard2 name={i?.assUserName} userId={i?.assUserId} />
|
</span>
|
))}
|
</div>
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">审核时间</div>
|
<div className="public-infoSubTitle">{$$.minuteFormat(data?.applyTime)}</div>
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">审核人</div>
|
<div className="public-infoSubTitle">
|
<span className="public-nameCard2">
|
{data?.applyUnitName}
|
<NameCard2 name={data.applyUserName} userId={data.applyUserId} />
|
</span>
|
</div>
|
</Col>
|
</>
|
)}
|
{data?.judicAudit === '24_00004-2' && (
|
<>
|
<Col span={24}>
|
<div className="public-infoTitle">审核结果</div>
|
<div className="public-infoSubTitle public-danger">不同意</div>
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">理由说明</div>
|
<div className="public-infoSubTitle">{data?.handleContent || '-'}</div>
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">附件材料</div>
|
<div style={{ display: 'flex', gap: '8px' }}>
|
{data?.fileList?.find((i) => i.ownerType === '22_00018-411')?.fileList?.length ? (
|
data?.fileList
|
?.find((i) => i.ownerType === '22_00018-411')
|
?.fileList?.map((item, index) => {
|
return (
|
<>
|
<MyPDF key={index} name={item.name} fileUrl={item.showUrl} fileType={item.suffix} />
|
</>
|
);
|
})
|
) : (
|
<div className="public-infoSubTitle">-</div>
|
)}
|
</div>
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">审核时间</div>
|
<div className="public-infoSubTitle">{$$.minuteFormat(data?.applyTime)}</div>
|
</Col>
|
<Col span={24}>
|
<div className="public-infoTitle">审核人</div>
|
<div className="public-infoSubTitle">
|
<span className="public-nameCard2">
|
{data?.applyUnitName}
|
<NameCard2 name={data.applyUserName} userId={data.applyUserId} />
|
</span>
|
</div>
|
</Col>
|
</>
|
)}
|
</Row>
|
</div>
|
)}
|
</Scrollbars>
|
<div className="dataSync-excel">
|
<Space size="large" style={{ margin: '4px 14px' }}>
|
<Button onClick={() => handleApply()} type="primary" className="dialogPrimary">
|
提交
|
</Button>
|
<Button type="secondary" onClick={() => navigate(-1)}>
|
返回上级页面
|
</Button>
|
</Space>
|
</div>
|
</Fragment>
|
<MyModal width={1200} visible={caseCheckModal} onCancel={() => setCaseCheckModal(false)} footer={false}>
|
<CaseDetail caseId={caseId} caseData={caseData} />
|
</MyModal>
|
<SelectObjModal
|
courtId={data.courtId}
|
visible={isModalVisible}
|
nameStr={'承办法官'}
|
checkKeys={selectObjModalData[selectObjModalData.key]?.key || ''}
|
onOk={(item) => {
|
let { items, keys } = item;
|
setIsModalVisible(false);
|
setSelectObjModalData({ ...selectObjModalData, [selectObjModalData.key]: items });
|
formRef.current.setFieldValue('judgeId', keys[0]);
|
formRef.current.setFieldValue('judgeName', items[0]?.name);
|
}}
|
onClose={() => setIsModalVisible(false)}
|
/>
|
</NewPage>
|
);
|
};
|
|
export default CourtAuditEdit;
|
