/*
|
* @Company: hugeInfo
|
* @Author: ldh
|
* @Date: 2022-03-15 16:07:25
|
* @LastEditTime: 2023-05-14 11:03:09
|
* @LastEditors: lwh
|
* @Version: 1.0.0
|
* @Description: 案件签收查看已经编辑的组件
|
*/
|
import React, { useEffect, useState } from 'react';
|
import { useNavigate } from 'react-router-dom';
|
import PropTypes from 'prop-types';
|
import { Row, Col, Radio, Button, Descriptions, Input, Typography, Space } from 'antd';
|
import { ProfileOutlined, ScheduleOutlined, CheckCircleFilled, ExclamationCircleOutlined } from '@ant-design/icons';
|
import * as $$ from '../../../utils/utility';
|
import NameCard from '../../../components/NameCard';
|
import MyUpload from '../../../components/MyUpload';
|
import FilesDrawer from '../../../components/FilesDrawer';
|
import ProgressStep from '../../../components/ProgressStep';
|
|
const { TextArea } = Input;
|
|
const { Text } = Typography;
|
|
// 获取签收的详情
|
function getSignForDetailDataApi(submitData) {
|
return $$.ax.request({ url: 'caseSign/getBySignId', type: 'get', data: { id: submitData }, service: 'mediate' });
|
}
|
|
// 获取派单信息
|
function getDispatchDataApi(submitData) {
|
return $$.ax.request({ url: `caseSign/selectDisp?id=${submitData}`, type: 'get', service: 'mediate' });
|
}
|
|
// 签收
|
function signForApi(submitData) {
|
return $$.ax.request({ url: 'caseSign/updateResult', type: 'post', data: submitData, service: 'mediate' });
|
}
|
|
/**
|
* type, // 'check'：查看, 'edit'：编辑
|
* signForId, // 签收id
|
* handleReturn, // 返回
|
*/
|
const SignFor = ({ type, signForId, caseId, handleReturn, sleepTab }) => {
|
const navigate = useNavigate();
|
|
// 签收数据
|
const [data, setData] = useState({});
|
|
// 判断查看 or 编辑
|
const [signForType, setSignForType] = useState();
|
|
// 签收提交的表单数据
|
const [formData, setFormData] = useState({});
|
|
// 派单信息
|
const [dispatchData, setDispatchData] = useState({});
|
|
// 是否登记成功, 1.签收成功 2.结案归档 成功 3.结案归档 返回上一层
|
const [isRegisterSuccess, setIsRegisterSuccess] = useState(false);
|
|
// form修改
|
function handleChangeInput(key, value) {
|
if (key === 'handleResult') {
|
formData.handleResult = value[0];
|
formData.handleResultName = value[1];
|
} else if (key === 'notsignReason') {
|
formData.notsignReason = value[0];
|
formData.notsignReasonName = value[1];
|
} else {
|
formData[key] = value;
|
}
|
if (key === 'handleResult' && formData.handleResult === '22_00010-2') {
|
formData.notsignReason = $$.options.refuseSign[0].value;
|
formData.notsignReasonName = $$.options.refuseSign[0].label;
|
}
|
setFormData({ ...formData });
|
}
|
|
// 提交
|
function handleSubmit() {
|
if (!$$.verifyEmpty(formData.handleContent)) {
|
$$.info({ type: 'warning', content: '请输入签收说明' });
|
return;
|
}
|
signFor({ id: signForId, ...formData });
|
}
|
|
// 获取派单信息
|
async function getDispatchData(signForId) {
|
global.setSpinning(true);
|
const res = await getDispatchDataApi(signForId);
|
global.setSpinning(false);
|
if (res.type) {
|
setDispatchData(res.data || {});
|
}
|
}
|
|
// 获取签收详情
|
async function getSignForDetailData(signForId) {
|
global.setSpinning(true);
|
const res = await getSignForDetailDataApi(signForId);
|
global.setSpinning(false);
|
if (res.type) {
|
setData(res.data || {});
|
}
|
}
|
|
// 签收
|
async function signFor(submitData) {
|
$$.modalInfo({
|
title: '提交确认',
|
content: (
|
<>
|
确定<span className="public-color">同意/拒绝签收</span>当前案件吗？
|
</>
|
),
|
okText: '确定提交',
|
cancelText: '我再想想',
|
onOk: async () => {
|
global.setSpinning(true);
|
const res = await signForApi(submitData);
|
global.setSpinning(false);
|
if (res.type) {
|
// 调解员同意签收，下一节点为纠纷调解
|
setIsRegisterSuccess('1');
|
// 拒绝
|
submitData.handleResult === '22_00010-2' && setIsRegisterSuccess('2');
|
// 同意
|
submitData.handleResult !== '22_00010-2' && setIsRegisterSuccess('1');
|
|
}
|
},
|
});
|
|
|
}
|
|
useEffect(() => {
|
getSignForDetailData(signForId);
|
getDispatchData(signForId);
|
}, [signForId]);
|
|
useEffect(() => {
|
if (type === 'edit') {
|
setFormData({ handleResult: $$.options.signResult[0].value, handleResultName: $$.options.signResult[0].label });
|
}
|
setSignForType(type);
|
}, [type]);
|
|
// 处理时限
|
const expireHours = $$.getHours(dispatchData.expireTime);
|
|
console.log('formData', formData);
|
|
return (
|
<>
|
{!!isRegisterSuccess ? (
|
<div className="register-over">
|
<div className="register-over-success">
|
{isRegisterSuccess == '2' ? <ExclamationCircleOutlined className="register-over-icon" /> : <CheckCircleFilled className="register-over-icon" />}
|
<div className="h6">{isRegisterSuccess === '2' ? '拒绝签收' : '同意签收'}</div>
|
<div className="register-over-subtitle">
|
{isRegisterSuccess === '2' ? (
|
<>
|
案件已退回上一环节处理人
|
</>
|
) : (
|
<>
|
可通过<span className="public-color">调解总览（一本账）</span>进行查看
|
</>
|
)}
|
</div>
|
<Space size="large" style={{ marginBottom: '24px' }}>
|
<Button type='primary' onClick={() => {
|
handleReturn();
|
}}>我的待办</Button>
|
</Space>
|
</div>
|
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
<div className="caseDetail-cardMain" style={{}}>
|
<ProgressStep caseId={caseId} pageFrom="dispatchRecord" />
|
</div>
|
</div>
|
</div>
|
) : (
|
<div className="signFor">
|
<div className="caseDetail-headerCard">
|
<div className="caseDetail-cardTitle">
|
<Space size="small">
|
<div className="caseDetail-cardTitle-icon caseDetail-cardTitle-iconGreen">
|
<ProfileOutlined />
|
</div>
|
<h5>派单信息</h5>
|
</Space>
|
</div>
|
<div className="caseDetail-descriptions">
|
<Descriptions size="small">
|
<Descriptions.Item label="派单组织">{dispatchData.dispUnitName || '系统调度'}</Descriptions.Item>
|
<Descriptions.Item label="派单时间">{$$.timeFormat(dispatchData.dispTime)}</Descriptions.Item>
|
<Descriptions.Item label="处理时限">
|
<span className={expireHours.isNegativeNum ? 'public-danger' : ''}>{expireHours.hours}小时</span>
|
</Descriptions.Item>
|
<Descriptions.Item label="派单人">
|
<NameCard name={dispatchData.dispUserName} userId={dispatchData.dispUserId} />
|
</Descriptions.Item>
|
<Descriptions.Item label="派单意见">
|
<Text ellipsis={{ tooltip: dispatchData.dispContent }}>{dispatchData.dispContent || '-'}</Text>
|
</Descriptions.Item>
|
<Descriptions.Item label="附件信息">
|
<FilesDrawer filesData={dispatchData.fileInfoList} />
|
</Descriptions.Item>
|
</Descriptions>
|
</div>
|
</div>
|
<div className="signFor-main">
|
<div className="caseDetail-cardTitle">
|
<Space size="small">
|
<div className="caseDetail-cardTitle-icon caseDetail-cardTitle-iconBlue">
|
<ScheduleOutlined />
|
</div>
|
<h5>{signForType === 'check' ? '签收信息' : '签收操作'}</h5>
|
</Space>
|
</div>
|
<div className="caseDetail-cardMain">
|
<Row gutter={[16, 16]}>
|
{signForType === 'check' ? (
|
data.status === '2' || data.status === '99' ? (
|
<Col span={24}>
|
<Descriptions bordered>
|
<Descriptions.Item label="签收状态">{data.status === '2' ? '已签收' : '拒绝签收'}</Descriptions.Item>
|
<Descriptions.Item label={data.status === '2' ? '签收时间' : '经办时间'}>{$$.timeFormat(data.signTime)}</Descriptions.Item>
|
<Descriptions.Item label={data.status === '2' ? '签收人' : '经办人'}>
|
<NameCard name={data.handlerUserName} userId={data.handlerUserId} />
|
</Descriptions.Item>
|
{data.status === '2' ? (
|
<Descriptions.Item label="签收说明" span={2}>
|
<Text ellipsis={{ tooltip: data.handleContent }}>{data.handleContent || '-'}</Text>
|
</Descriptions.Item>
|
) : (
|
<>
|
<Descriptions.Item label="拒绝原因">
|
<Text ellipsis={{ tooltip: data.notsignReason }}>{data.notsignReason || '-'}</Text>
|
</Descriptions.Item>
|
<Descriptions.Item label="相关说明">
|
<Text ellipsis={{ tooltip: data.handleContent }}>{data.handleContent || '-'}</Text>
|
</Descriptions.Item>
|
</>
|
)}
|
<Descriptions.Item label="附件信息">
|
<FilesDrawer filesData={data.fileInfoList} />
|
</Descriptions.Item>
|
</Descriptions>
|
</Col>
|
) : data.status === '3' ? (
|
<Col span={24}>
|
<Descriptions bordered>
|
<Descriptions.Item label="签收状态">超时未签收</Descriptions.Item>
|
<Descriptions.Item label="未签收时间">{$$.timeFormat(data.signTime)}</Descriptions.Item>
|
</Descriptions>
|
</Col>
|
) : null
|
) : (
|
<>
|
<Col span={24}>
|
<h5>签收意见</h5>
|
<Radio.Group value={formData.handleResult} onChange={(e) => handleChangeInput('handleResult', [e.target.value, e.target.label])}>
|
<Space direction="vertical">
|
{$$.options.signResult.map((x, t) => (
|
<Radio value={x.value} label={x.label} key={x.value}>
|
{x.label}
|
{formData.handleResult === '22_00010-2' && x.value === '22_00010-2' && '（拒绝后案件将回到调度中心）'}
|
</Radio>
|
))}
|
</Space>
|
</Radio.Group>
|
</Col>
|
{formData.handleResult === '22_00010-2' && (
|
<Col span={24}>
|
<h5>
|
<span>拒绝原因</span>
|
<span className="leftRequired">*</span>
|
</h5>
|
<Radio.Group
|
value={formData.notsignReason}
|
onChange={(e) => handleChangeInput('notsignReason', [e.target.value, e.target.label])}
|
>
|
<Space direction="vertical">
|
{$$.options.refuseSign.map((x, t) => (
|
<Radio value={x.value} label={x.label} key={x.value}>
|
{x.label}
|
{formData.notsignReason === '22_00009-5' && x.value === '22_00009-5' && (
|
<span>（申请人在补充材料后，将重新提交至您名下处理）</span>
|
)}
|
</Radio>
|
))}
|
</Space>
|
</Radio.Group>
|
</Col>
|
)}
|
{
|
formData.notsignReason === '22_00009-9' &&
|
<Col span={24}>
|
<TextArea
|
value={formData.handleContent}
|
placeholder="输入拒绝签收的具体原因"
|
allowClear
|
rows={2}
|
onChange={(e) => handleChangeInput('handleContent', e.target.value)}
|
/>
|
</Col>
|
}
|
<Col span={24}>
|
<h5>
|
签收说明<span className="leftRequired">*</span>
|
</h5>
|
<TextArea
|
value={formData.handleContent}
|
onChange={(e) => handleChangeInput('handleContent', e.target.value)}
|
rows={2}
|
placeholder="简要说明当前环节工作总结和下一环节的注意事项"
|
allowClear
|
/>
|
</Col>
|
<Col span={24}>
|
<h5>上传附件</h5>
|
<MyUpload fileId={signForId} fileType="22_00018-501" fileList={data.fileInfoList} />
|
</Col>
|
</>
|
)}
|
</Row>
|
</div>
|
{signForType !== 'check' && (
|
<div style={{ marginTop: '16px' }}>
|
<Button type="primary" onClick={handleSubmit}>
|
提交
|
</Button>
|
</div>
|
)}
|
</div>
|
</div>
|
)
|
}
|
</>
|
|
);
|
};
|
|
SignFor.propTypes = {
|
type: PropTypes.string,
|
signForApi: PropTypes.string,
|
handleReturn: PropTypes.func,
|
};
|
|
export default SignFor;
|
