import React, { useState, useEffect } from 'react';
|
import { Row, Col, Space, Button, Switch } from 'antd';
|
import PersonCard from '@/components/personCard';
|
import * as $$ from '@/utils/utility';
|
import { Typography } from '@arco-design/web-react';
|
import { question, register } from '@/assets/images';
|
import FileTable from "./FileTable";
|
|
function getCaseInfoApi(id) {
|
return $$.ax.request({ url: '/caseInfo/getCaseInfo?id=' + id, type: 'get', service: 'mediate' });
|
}
|
|
|
export default function MatterDetail(props) {
|
const [fakeData, setFakeData] = useState([]);//当事人信息数据
|
const [infoData, setInfoData] = useState({});
|
|
useEffect(() => {
|
console.log(props);
|
getCaseInfo(props.caseId)
|
}, [props.caseId])
|
|
|
//获取id
|
const getCaseInfo = async (id) => {
|
const res = await getCaseInfoApi(props.caseId)
|
if (res.type) {
|
let data = res.data
|
const partyList = data.personList.concat(data.agentList)
|
setInfoData({
|
...data,
|
questionName: data.queProvName === null ? '-' : data.queProvName + '/' + data.queCityName + '/' + data.queAreaName + '/' + data.queRoadName,
|
caseType: data.caseTypeFirstName === null ? '-' : data.caseTypeFirstName + '/' + data.caseTypeName
|
})
|
setFakeData(partyList.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') {
|
file.push({
|
name: item.fileList[0].trueName,
|
uid: item.fileList[0].id,
|
})
|
}
|
if (item.ownerType == '22_00018-204' || item.ownerType == '22_00018-207') {
|
file1.push({
|
name: item.fileList[0].trueName,
|
uid: item.fileList[0].id,
|
})
|
}
|
})
|
}
|
return {
|
...item,
|
file,
|
file1
|
}
|
}))
|
}
|
|
}
|
|
return (
|
<div style={{ position: 'relative' }}>
|
<Typography.Paragraph>
|
<div className='dataSync-noScrollPage'>
|
|
<Col span={24} style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
|
<Space size='small'>
|
<div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>当事人信息</h5>
|
</Space>
|
{props.hasApplet && <div>
|
<Switch checkedChildren="当事人小程序可见" unCheckedChildren="当事人小程序不可见" defaultChecked />
|
</div>
|
}
|
</Col>
|
<div style={{ margin: '16px 0' }}>
|
<PersonCard
|
isCheck={false}
|
data={fakeData}
|
/>
|
</div>
|
<Col span={24} className='title'>
|
<Space size='small'>
|
<div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>纠纷基本情况</h5>
|
</Space>
|
</Col>
|
<Row gutter={[16, 16]}>
|
<Col span={8}>
|
<div><div className="title-text">事项状态</div></div>
|
<div style={{ color: '#1A6FB8' }}>{infoData?.statusName || '-'}</div>
|
</Col>
|
<Col span={16}>
|
<div><div className="title-text">事项编号</div></div>
|
<div>{infoData?.caseRef || '-'}</div>
|
</Col>
|
{/*事项等级分为三级，颜色需要做判断*/}
|
<Col span={8}>
|
<div className="title"><div className="title-text">事项等级</div></div>
|
<div style={{ display: 'flex' }}><div style={{ backgroundColor: '#00B42A', marginRight: '4px', borderRadius: '4px' }}><div style={{ color: '#FFFFFF', padding: '0px 6px' }}>{infoData.caseLevel || '-'}</div></div>级</div>
|
</Col>
|
<Col span={8}>
|
<div><div className="title-text">来访时间</div></div>
|
<div>{infoData.visitTime || '-'}</div>
|
</Col>
|
<Col span={8}>
|
<div ><div className="title-text">来访人数（人）</div></div>
|
<div>{infoData.visitPeopleNum || '-'}</div>
|
</Col>
|
<Col span={8}>
|
<div ><div className="title-text">纠纷类型</div></div>
|
<div>{infoData.caseType || '-'}</div>
|
</Col>
|
<Col span={8}>
|
<div ><div className="title-text">纠纷发生时间</div></div>
|
<div>{infoData.occurTime || '-'}</div>
|
</Col>
|
<Col span={8}>
|
<div ><div className="title-text">纠纷发生地点</div></div>
|
<div>{infoData.addr || '-'}</div>
|
</Col>
|
<Col span={8}>
|
<div ><div className="title-text">问题属地</div></div>
|
<div>{infoData.questionName || '-'}</div>
|
</Col>
|
<Col span={8}>
|
<div ><div className="title-text">涉及人数（人）</div></div>
|
<div>{infoData.peopleNum || '-'}</div>
|
</Col>
|
<Col span={8}>
|
<div ><div className="title-text">涉及金额（元）</div></div>
|
<div>{$$.thousands(infoData.amount) || '-'}</div>
|
</Col>
|
<Col span={8}>
|
<div ><div className="title-text">事项来源</div></div>
|
<div>{infoData.canalName || '-'}</div>
|
</Col>
|
<Col span={16}>
|
<div ><div className="title-text">来访形式</div></div>
|
<div>{infoData.visitWayName || '-'}</div>
|
</Col>
|
<Col span={24}>
|
<div className="title"><div className="title-text">事项概况</div></div>
|
<div>{infoData.caseDes || '-'}</div>
|
</Col>
|
<Col span={24}>
|
<div className="title"><div className="title-text">事项申请</div></div>
|
<div>{infoData.caseClaim || '-'}</div>
|
</Col>
|
<Col span={16}>
|
<div className="title"><div className="title-text">是否重大矛盾纠纷</div></div>
|
<div>{infoData.majorStatus === '0' ? '否' : infoData.majorStatus === '1' ? '是' : '-'}</div>
|
</Col>
|
</Row>
|
<Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px', marginTop: '20px' }}>
|
<Space size='small'>
|
<div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>事件材料</h5>
|
</Space>
|
</Col>
|
<FileTable mainId={props.caseId} fileInfoList={infoData.fileInfoList} isReview={true} />
|
{infoData?.canalName === '大厅来访' &&
|
<>
|
<Col span={24} style={{ marginTop: '12px' }}>
|
<Space size='small'>
|
<div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>登记信息</h5>
|
</Space>
|
</Col>
|
<Row gutter={[16, 16]}>
|
{/*事项等级分为三级，颜色需要做判断*/}
|
<Col span={8}>
|
<div className="title"><div className="title-text">登记机构</div><img src={question} alt="" style={{ width: '14px', height: '14px', marginTop: '4px', marginLeft: '4px' }} /></div>
|
<div>{infoData.inputUnitName || '-'}</div>
|
</Col>
|
<Col span={8}>
|
<div><div className="title-text">登记人</div></div>
|
<div style={{ display: 'flex' }}>
|
<div>{infoData.inputUserName || '-'}</div>
|
<img src={register} alt='' style={{ width: '14px', height: '14px', marginLeft: '8px', marginTop: '4px' }} />
|
</div>
|
</Col>
|
<Col span={8}>
|
<div ><div className="title-text">登记时间</div></div>
|
<div>{infoData.createTime || '-'}</div>
|
</Col>
|
</Row>
|
</>
|
}
|
{/* {props.hasEditBtn && <Button type='primary' style={{ marginTop: '20px' }}>修改</Button>} */}
|
</div>
|
|
</Typography.Paragraph>
|
</div>
|
)
|
}
|
