/*
|
* @Author: dminyi 1301963064@qq.com
|
* @Date: 2023-11-15 14:35:47
|
* @LastEditors: dminyi 1301963064@qq.com
|
* @LastEditTime: 2023-11-29 14:53:54
|
* @FilePath: \hugeDyh2.0\customerSystem\src\views\caseDetail\components\JudicialAll.jsx
|
* @Description:
|
*/
|
import React, { useState, useEffect, useRef } from 'react';
|
import { Row, Col, Space, Typography } from 'antd';
|
import { ShareAltOutlined, ProfileOutlined } from '@ant-design/icons';
|
import * as $$ from '../../../utils/utility';
|
import MyUpload from '../../../components/MyUpload';
|
import MyModal from '../../../components/MyModal';
|
import DisputeMsg from './DisputeMsg';
|
import { cardIconCaseCheck } from '../../../assets/images/icon';
|
import ProgressStep from '../../../components/ProgressStep';
|
import { JudicialResult } from './index';
|
|
|
const { Link, Text, Paragraph } = Typography;
|
|
// 司法确认详情接口
|
function getJudicialApplyApi(submitData) {
|
return $$.ax.request({ url: 'judicInfo/getJudicInfo', type: 'get', data: submitData, service: 'mediate' });
|
}
|
|
|
const JudicialApply = ({ judicialId }) => {
|
const myUploadRef = useRef();
|
|
|
|
const [caseCheckModal, setCaseCheckModal] = useState(false);
|
|
// 数据
|
const [data, setData] = useState({});
|
|
const msg = [
|
{ title: '司法确认结果', key: 'judicResultName', span: 6 },
|
{ title: '司法确认案号', key: 'judicNo', span: 6 },
|
{ title: '调解案号', key: 'caseNo', span: 12 },
|
{
|
title: '司法确认时间',
|
value:
|
$$.myTimeFormat() + ' ~ ' + $$.myTimeFormat(),
|
span: 6,
|
},
|
{ title: '司法确认地点', key: 'meetAddr', span: 6 },
|
{ title: '司法确认方式', key: 'meetWayName', span: 6 },
|
{ title: '司法确认上传附件', key: 'sceneFileInfoList', span: 6, type: 'picture' },
|
{ title: '受理单位', key: 'courtName', span: 6 },
|
{ title: '承办法官', key: 'judgeName', id: 'judgeId', span: 6, type: 'nameCard' },
|
{ title: '助理/书记员', key: 'assistName', span: 6 },
|
{ title: '协助司法确认反馈', span: 6, type: 'link' },
|
{ title: '诉前调确号', key: 'mediateJudicNo', span: 6 },
|
{ title: '司法确认备注', key: 'judicContent', span: 24 },
|
];
|
|
|
const getFiles = (type) => {
|
return data?.applyFileList?.filter((item) => item.ownerType === type)[0]?.fileList || [];
|
};
|
|
//初始化
|
useEffect(() => {
|
async function getJudicialApply() {
|
global.setSpinning(true);
|
const res = await getJudicialApplyApi({ id: judicialId });
|
global.setSpinning(false);
|
if (res.type) {
|
setData(res.data);
|
}
|
}
|
if (judicialId) {
|
getJudicialApply();
|
}
|
}, [judicialId]);
|
|
|
|
return !data || !data.id ? (
|
<div style={{ backgroundColor: '#ffffff', height: '100%', paddingTop: '10%' }}>{$$.MyEmpty({ style: { margin: 0 } })}</div>
|
) : (
|
<>
|
{/* 为了获取myUploadRef实例调用方法 */}
|
<MyUpload type="diy" showFileList={false} myUploadRef={myUploadRef} />
|
<div className="judicialApply">
|
<div className="caseDetail-card judicialApply-left">
|
<div className="caseDetail-cardTitle">
|
<Space size="small">
|
<div className='MediationInfo-subTitle'></div>
|
<h5>申请信息</h5>
|
</Space>
|
</div>
|
<div className="caseDetail-cardMain">
|
<Row gutter={[16, 12]}>
|
<Col span={24}>
|
<h5>调解案件</h5>
|
<div className="public-fileCard">
|
<img src={cardIconCaseCheck} alt="" onClick={() => setCaseCheckModal(true)} style={{ cursor: 'pointer' }} />
|
<div className="public-fileCard-main">
|
<Text ellipsis={{ tooltip: data.plaintiffs }}>申请人：{data.plaintiffs}</Text>
|
<Text ellipsis={{ tooltip: data.defendants }} style={{ marginTop: '4px', display: 'block' }}>
|
被申请人：{data.defendants}
|
</Text>
|
</div>
|
</div>
|
</Col>
|
<Col span={24}>
|
<h5>受理单位</h5>
|
<div>{data.courtName}</div>
|
</Col>
|
<Col span={24}>
|
<h5>申请说明</h5>
|
<pre>{data.applyContent || '-'}</pre>
|
</Col>
|
{[
|
{ key: '22_00018-302', title: '调解协议书' },
|
{ key: '22_00018-402', title: '司法确认申请书' },
|
{ key: '22_00018-306', title: '人民调解委员会主持调解的证明' },
|
{ key: '22_00018-409', title: '其他材料' },
|
].map((item, index) => (
|
<Col span={24} key={index}>
|
<h5>{item.title}</h5>
|
<Row gutter={[16, 8]}>
|
{getFiles(item.key).length === 0
|
? $$.MyEmpty({ style: { margin: 0 } })
|
: getFiles(item.key).map((x, t) => (
|
<Col span={12} key={t}>
|
<div className="public-fileCard">
|
<img src={$$.fileType(x.cat)} alt="" />
|
<div className="public-fileCard-main">
|
<Text ellipsis={{ tooltip: x.name }}>{x.name}</Text>
|
<Space size="middle" className="public-fileCard-action">
|
<Link onClick={() => myUploadRef.current.handleOpenFiles(x)}>预览</Link>
|
<Link onClick={() => myUploadRef.current.handleDownloadFiles(x)}>下载</Link>
|
</Space>
|
</div>
|
</div>
|
<div className="public-fileCard-text">
|
<div>上传人：{x.uploaderName || '-'}</div>
|
<div>上传时间：{$$.timeFormat(x.createTime)}</div>
|
</div>
|
</Col>
|
))}
|
</Row>
|
</Col>
|
))}
|
|
</Row>
|
</div>
|
</div>
|
<div className="caseDetail-card judicialApply-right">
|
<div className="caseDetail-cardTitle">
|
<Space size="small">
|
<div className="caseDetail-cardTitle-icon caseDetail-cardTitle-iconOrange">
|
<ShareAltOutlined />
|
</div>
|
<h5>审查记录</h5>
|
</Space>
|
</div>
|
<div className="caseDetail-cardMain">
|
<ProgressStep caseId={data.caseId} pageFrom="judicialApply" />
|
</div>
|
</div>
|
</div>
|
{/* <div style={{ backgroundColor: '#ffffff', margin: '0px 24px' }}>
|
<div className="judicialApply">
|
<div className="caseDetail-cardMain">
|
<Row gutter={[16, 12]}>
|
<Col span={24}>
|
<div className="caseDetail-cardTitle">
|
<Space size="small">
|
<div className='MediationInfo-subTitle'></div>
|
<h5>司法确认结果</h5>
|
</Space>
|
</div>
|
</Col>
|
{msg.map((x, t) => {
|
return (
|
<Col span={x.span || 6} key={t} >
|
<div>{x.title}：</div>
|
<Paragraph
|
className="caseDetail-paragraph"
|
ellipsis={{
|
expandable: x.span === 24 ? true : null,
|
tooltip: x.span === 24 ? false : x.tooltip || data[x.key],
|
rows: x.span === 24 ? 2 : 1,
|
}}
|
>
|
{x.content || data[x.key] || '-'}
|
</Paragraph>
|
</Col>
|
);
|
})}
|
|
{[
|
{ key: '22_00018-305', title: '司法确认视频录像信息' },
|
{ key: '22_00018-304', title: '结果文书信息' },
|
{ key: '22_00018-303', title: '申请人参与信息' },
|
].map((item, index) => (
|
<Col span={24} key={index}>
|
<h5>{item.title}</h5>
|
<Row gutter={[16, 8]}>
|
{getFiles(item.key).length === 0
|
? $$.MyEmpty({ style: { margin: 0 } })
|
: getFiles(item.key).map((x, t) => (
|
<Col span={12} key={t}>
|
<div className="public-fileCard">
|
<img src={$$.fileType(x.cat)} alt="" />
|
<div className="public-fileCard-main">
|
<Text ellipsis={{ tooltip: x.name }}>{x.name}</Text>
|
<Space size="middle" className="public-fileCard-action">
|
<Link onClick={() => myUploadRef.current.handleOpenFiles(x)}>预览</Link>
|
<Link onClick={() => myUploadRef.current.handleDownloadFiles(x)}>下载</Link>
|
</Space>
|
</div>
|
</div>
|
<div className="public-fileCard-text">
|
<div>上传人：{x.uploaderName || '-'}</div>
|
<div>上传时间：{$$.timeFormat(x.createTime)}</div>
|
</div>
|
</Col>
|
))}
|
</Row>
|
</Col>
|
))}
|
</Row>
|
</div>
|
</div>
|
</div> */}
|
<div style={{ backgroundColor: '#ffffff', margin: '0px 24px' }}>
|
<JudicialResult judicialId={judicialId} />
|
</div>
|
|
<MyModal width={1200} visible={caseCheckModal} onCancel={() => setCaseCheckModal(false)} footer={false}>
|
<DisputeMsg caseId={data.caseId} isModal />
|
</MyModal>
|
|
</>
|
);
|
};
|
|
|
|
export default JudicialApply;
|
