/*
|
* @Company: hugeInfo
|
* @Author: ldh
|
* @Date: 2022-07-22 15:03:44
|
* @LastEditTime: 2023-11-21 11:00:32
|
* @LastEditors: dminyi 1301963064@qq.com
|
* @Version: 1.0.0
|
* @Description: 司法确认结果
|
*/
|
import React, { useEffect, useState, useRef } from 'react';
|
import { Row, Col, Typography, Space } from 'antd';
|
import * as $$ from '../../../utils/utility';
|
import NameCard from '../../../components/NameCard';
|
import MyUpload from '../../../components/MyUpload';
|
import FilesDrawer from '../../../components/FilesDrawer';
|
import { mp4 } from '../../../assets/images/icon';
|
import CaseFolderCheck from '../../../components/CaseFolderCheck';
|
|
const { Paragraph, Link, Text } = Typography;
|
|
// 司法确认结果接口
|
function getJudicialResultApi(judicId) {
|
return $$.ax.request({ url: 'judicTask/judicRecord?judicId=' + judicId, type: 'get', service: 'mediate' });
|
}
|
|
const JudicialResultCheck = ({ contentData = {} }) => {
|
const myUploadRef = useRef();
|
|
|
// TODO：协助调解反馈暂时没有，modal没有。
|
const msg = [
|
{ title: '司法确认结果', key: 'judicResultName', span: 6 },
|
{ title: '司法确认案号', key: 'judicNo', span: 6 },
|
{ title: '调解案号', key: 'caseNo', span: 12 },
|
{
|
title: '司法确认时间',
|
value:
|
$$.myTimeFormat(contentData['judicStartTime'], 'YYYY-MM-DD HH:mm') + ' ~ ' + $$.myTimeFormat(contentData['judicEndTime'], 'YYYY-MM-DD HH:mm'),
|
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 },
|
];
|
|
return (
|
<div className="mediationResult">
|
{/* 为了获取myUploadRef实例调用方法 */}
|
<MyUpload type="diy" myUploadRef={myUploadRef} />
|
<Row gutter={[16, 12]}>
|
<Col span={24}>
|
<Space size="small">
|
<div className='MediationInfo-subTitle'></div>
|
<h5>司法确认结果</h5>
|
</Space>
|
</Col>
|
{msg.map((x, t) => {
|
let dom = null;
|
if (x.type === 'nameCard') {
|
dom = <NameCard name={contentData[x.key]} userId={contentData[x.id]} />;
|
} else if (x.type === 'picture') {
|
let arr = contentData[x.key]?.filter((_, index) => index < 2);
|
dom = (
|
<FilesDrawer
|
name={
|
<div className="mediationResult-imgBox">
|
{arr.length === 0 && '-'}
|
{arr.map((item, index) => (
|
<div className="mediationResult-img" key={index}>
|
<img style={{ width: '100%', height: '100%' }} src={$$.appUrl.fileUrl + $$.appUrl.fileShowUrl + item.id} alt="" />
|
</div>
|
))}
|
{contentData[x.key]?.length > 2 && (
|
<div className="mediationResult-img mediationResult-img-add">+{contentData[x.key]?.length - 2}</div>
|
)}
|
</div>
|
}
|
title="司法确认上传附件"
|
filesData={contentData[x.key]}
|
/>
|
);
|
} else if (x.type === 'link') {
|
dom = (
|
<Link onClick={x.func} className="public-underline">
|
查看详情
|
</Link>
|
);
|
} else {
|
let value = x.key ? contentData[x.key] || '-' : x.value;
|
dom = (
|
<Paragraph className="caseDetail-paragraph" ellipsis={{ tooltip: value, rows: x.span === 24 ? 2 : 1 }}>
|
{value}
|
</Paragraph>
|
);
|
}
|
return (
|
<Col span={x.span} key={t} style={{ display: 'flex' }}>
|
<div>{x.title}：</div>
|
{dom}
|
</Col>
|
);
|
})}
|
<Col span={24}>
|
<div className="caseDetail-divider" />
|
</Col>
|
<Col span={24}>
|
<h5>司法确认视频录像信息</h5>
|
</Col>
|
<Col span={24}>
|
<Row gutter={[16, 12]}>
|
{contentData.meetVideoList?.length === 0 && <Col span={24}>{$$.MyEmpty({ description: '无司法确认视频录像信息' })}</Col>}
|
{contentData.meetVideoList?.map((x, t) => (
|
<Col span={8} key={t}>
|
<div className="public-fileCard public-fileCard-noBorder">
|
<img src={mp4} alt="" />
|
<div className="public-fileCard-main">
|
<Text ellipsis={{ tooltip: x.videoName }}>{x.videoName}</Text>
|
<Space size="middle" className="public-fileCard-action">
|
<Link onClick={() => window.open(x.playUrl)}>在线播放</Link>
|
<Link href={x.downUrl}>下载</Link>
|
</Space>
|
</div>
|
</div>
|
<div className="public-fileCard-text">
|
<div>状态：{x.recordStatusName || '-'}</div>
|
<div>上传时间：{$$.timeFormat(x.startTime)}</div>
|
</div>
|
</Col>
|
))}
|
</Row>
|
</Col>
|
<Col span={24}>
|
<div className="caseDetail-divider" />
|
</Col>
|
<Col span={24}>
|
<h5>结果文书信息</h5>
|
</Col>
|
<Col span={24}>
|
<Row gutter={[16, 12]}>
|
{!contentData.resultFileInfoList?.length && <Col span={24}>{$$.MyEmpty({ description: '无结果文书信息' })}</Col>}
|
{contentData?.resultFileInfoList?.map((x, t) =>
|
x.fileList?.map((y, z) => {
|
return (
|
<Col span={12} key={z}>
|
<div className="public-fileCard public-fileCard-noBorder">
|
<img src={$$.fileType(x.cat)} alt="" />
|
<div className="public-fileCard-main">
|
<Text ellipsis={{ tooltip: y.name }}>{y.name}</Text>
|
<Space size="middle" className="public-fileCard-action">
|
<Link onClick={() => myUploadRef.current.handleOpenFiles(y)}>在线预览</Link>
|
<Link onClick={() => myUploadRef.current.handleDownloadFiles(y)}>下载</Link>
|
</Space>
|
</div>
|
</div>
|
<div className="public-fileCard-text">
|
<div>材料类型：{y.ownerTypeName || '-'}</div>
|
<div>材料数量：1份</div>
|
<div>上传时间：{$$.timeFormat(y.createTime)}</div>
|
</div>
|
</Col>
|
);
|
})
|
)}
|
</Row>
|
</Col>
|
<Col span={24}>
|
<div className="caseDetail-divider" />
|
</Col>
|
<Col span={24}>
|
<h5>申请人参与信息</h5>
|
</Col>
|
{contentData.plaintiffList?.length > 0 || contentData.defendantList?.length > 0 ? (
|
['plaintiffList', 'defendantList'].map((item, index) => (
|
<Col span={24} key={index}>
|
<Row gutter={[16, 12]}>
|
{contentData[item]?.map((x, t) => (
|
<Col span={8} key={t}>
|
<div className="public-nameCard">
|
<div className={`public-nameCard-card ${index === 0 ? 'public-nameCard-card-blue' : 'public-nameCard-card-orange'}`}>
|
{x.userName.substr(0, 1)}
|
<div className="public-nameCard-card-bottomRight" style={{ color: x.signStatus === '3' && 'rgba(0,0,0,0.65)' }}>
|
{x.fixStatusName}
|
</div>
|
</div>
|
<div className="public-nameCard-content">
|
<div>
|
<Text ellipsis={{ tooltip: x.userName }}>{x.userName}</Text>
|
</div>
|
<div>联系电话：{x.userMobile}</div>
|
<div
|
style={{ marginTop: '2px', position: 'absolute' }}
|
className={`public-nameCard-tag ${index === 0 ? 'public-nameCard-tag-blue' : 'public-nameCard-tag-orange'}`}
|
>
|
{x.userTypeName}
|
</div>
|
</div>
|
</div>
|
</Col>
|
))}
|
</Row>
|
</Col>
|
))
|
) : (
|
<Col span={24}>{$$.MyEmpty({ description: '暂无申请人参与信息' })}</Col>
|
)}
|
</Row>
|
</div>
|
);
|
};
|
|
const JudicialResult = ({ judicialId }) => {
|
// 司法确认结果数据
|
const [data, setData] = useState({});
|
|
//初始化组件数据
|
useEffect(() => {
|
// 获取记录数据
|
async function getJudicialResult() {
|
global.setSpinning(true);
|
const res = await getJudicialResultApi(judicialId);
|
global.setSpinning(false);
|
if (res.type) {
|
setData(res.data || {});
|
}
|
}
|
getJudicialResult();
|
}, [judicialId]);
|
|
return !data.serieStatus ? (
|
<div style={{ backgroundColor: '#ffffff', height: '100%', paddingTop: '10%' }}>{$$.MyEmpty({ style: { margin: 0 } })}</div>
|
) : data.serieStatus === '2' ? (
|
<CaseFolderCheck caseData={data.content || []} childrenDom={(x) => <JudicialResultCheck contentData={x} />} />
|
) : (
|
<JudicialResultCheck contentData={(data.content || [])[0]} />
|
);
|
};
|
|
export default JudicialResult;
|
