/*
|
* @Company: hugeInfo
|
* @Author: ldh
|
* @Date: 2022-03-24 10:59:20
|
* @LastEditTime: 2022-12-02 10:11:03
|
* @LastEditors: ldh
|
* @Version: 1.0.0
|
* @Description: 文书制作
|
*/
|
import React, { useState, useRef, useEffect } from 'react';
|
import PropTypes from 'prop-types';
|
import { useSearchParams } from 'react-router-dom';
|
import { Row, Col, Space, Button, Typography, Tooltip } from 'antd';
|
import { CloseCircleFilled, PlusOutlined } from '@ant-design/icons';
|
import MyUpload from '../../../components/MyUpload';
|
import * as $$ from '../../../utils/utility';
|
import TableView from '../../../components/TableView';
|
import MyModal from '../../../components/MyModal';
|
|
const { Link } = Typography;
|
|
// 获取文书数据
|
function getFilesDataApi(submitData) {
|
return $$.ax.request({
|
url: `judicInfo/pcWindowGetDocInfo?caseId=${submitData.caseId}&ownerType=${submitData.ownerType}`,
|
type: 'get',
|
service: 'mediate',
|
});
|
}
|
|
// 获取文书模板
|
function getTemplateDataApi(submitData) {
|
return $$.ax.request({ url: `judicInfo/pcWindowDocMode?ownerType=${submitData}`, type: 'get', service: 'mediate' });
|
}
|
|
// 生成文书草稿
|
function setDraftDocApi(submitData) {
|
return $$.ax.request({
|
url: `judicInfo/pcWindowInDocDraft?caseId=${submitData.caseId}&modeId=${submitData.modeId}`,
|
type: 'get',
|
service: 'mediate',
|
});
|
}
|
|
// 生成结果文书
|
function setResultDocApi(submitData) {
|
return $$.ax.request({ url: `judicInfo/pcWindowInResultDoc`, type: 'get', service: 'mediate', data: submitData });
|
}
|
|
// 签名结果查询
|
function getSignDataApi(submitData) {
|
return $$.ax.request({ url: `judicInfo/pcWindowDocAut?docId=${submitData}`, type: 'get', service: 'mediate' });
|
}
|
|
// 发送签名
|
function sendAutographApi(submitData) {
|
return $$.ax.request({ url: `judicInfo/pcWindowSendDocAut?docId=${submitData}`, type: 'get', service: 'mediate' });
|
}
|
|
const DocumentMaking = ({ tabActive }) => {
|
const myUploadRef = useRef();
|
|
const [searchParams] = useSearchParams();
|
|
const caseId = searchParams.get('caseId');
|
|
// 签名结果
|
const [signData, setSignData] = useState({});
|
|
// 文书数据
|
const [data, setData] = useState({});
|
|
// modal
|
const [modalData, setModalData] = useState({ visible: false });
|
|
// 表头
|
const autographColumns = [
|
{ title: '签名人', dataIndex: 'tenantName' },
|
{
|
title: '签名结果',
|
dataIndex: 'status',
|
render: (text) => (
|
<div className={`public-tag ${text === 'COMPLETE' ? 'public-tag-tagBlue2' : 'public-tag-tagRed'}`}>
|
{text === 'COMPLETE' ? '已签名' : '未签名'}
|
</div>
|
),
|
},
|
{ title: '签名时间', dataIndex: 'createTime' },
|
{ title: '联系电话', dataIndex: 'mobile' },
|
];
|
|
const templateColumns = [
|
{ title: '模板名称', dataIndex: 'modeName' },
|
{ title: '模板描述', dataIndex: 'modeDes' },
|
{
|
title: '操作',
|
dataIndex: 'action',
|
width: 50,
|
render: (text, record) => <Link onClick={() => setDraftDoc(record.id)}>选择</Link>,
|
},
|
];
|
|
// 点击制作
|
function handleMake(x) {
|
// eslint-disable-next-line no-undef
|
POBrowser.openWindowModeless(
|
`${$$.appUrl.baseUrl}${$$.appUrl.fileDocx}?docDraftId=${x.id}&ownerType=${x.ownerType}`,
|
'width=1200px;height=800px'
|
);
|
}
|
|
// 删除文书
|
function handleChangeFile(file) {
|
$$.modalInfo({
|
content: '确定删除该文书吗？',
|
onOk: () => {
|
myUploadRef.current.handleDeleteFiles(file.id, file.ownerType).then((res) => {
|
if (res) getFilesData();
|
});
|
},
|
});
|
}
|
|
// 获取文件数据
|
async function getFilesData(type) {
|
global.setSpinning(true);
|
const res = await getFilesDataApi({ caseId, ownerType: tabActive });
|
global.setSpinning(false);
|
if (res.type) {
|
setData(res.data || {});
|
if (type === 'resultDoc' && data.resultFile?.autStatus === '2') {
|
$$.info({ type: 'error', content: '文书中不包含签名内容，转签名文书操作失败' });
|
}
|
}
|
}
|
|
// 获取文书模板
|
async function getTemplateData() {
|
global.setSpinning(true);
|
const res = await getTemplateDataApi(tabActive);
|
global.setSpinning(false);
|
if (res.type) {
|
setModalData({ visible: true, title: '模板选择', type: 'template', data: res.data || [] });
|
}
|
}
|
|
// 根据文书模板生成文书草稿
|
async function setDraftDoc(modeId) {
|
global.setSpinning(true);
|
const res = await setDraftDocApi({ caseId, modeId });
|
global.setSpinning(false);
|
if (res.type) {
|
$$.infoSuccess({ content: '文书草稿生成成功' });
|
setModalData({ visible: false });
|
getFilesData();
|
}
|
}
|
|
// 选择文书草稿生成结果文书
|
async function setResultDoc(docDraftId) {
|
global.setSpinning(true);
|
const res = await setResultDocApi({ caseId, ownerType: tabActive, docDraftId });
|
global.setSpinning(false);
|
if (res.type) {
|
$$.infoSuccess({ content: '结果文书生成成功' });
|
getFilesData('resultDoc');
|
}
|
}
|
|
// 发送签名
|
async function sendAutograph(docId) {
|
global.setSpinning(true);
|
const res = await sendAutographApi(docId);
|
global.setSpinning(false);
|
if (res.type) {
|
$$.infoSuccess({ content: '发送成功' });
|
getSignData(docId);
|
}
|
}
|
|
// 获取签名结果
|
async function getSignData(docId, isOpenModal) {
|
if (!docId) return;
|
global.setSpinning(true);
|
const res = await getSignDataApi(docId);
|
global.setSpinning(false);
|
if (res.type) {
|
setSignData(res.data || {});
|
if (isOpenModal) {
|
setModalData({ visible: true, title: '签名详情', type: 'sign', data: res.data?.signatories || [] });
|
}
|
}
|
}
|
|
// 初始化
|
useEffect(() => {
|
if (tabActive) {
|
getFilesData();
|
setSignData({});
|
}
|
}, [tabActive]);
|
|
// 文件dom
|
const documentDom = (x, t, type) => {
|
return (
|
<Col span={12} key={t + 1}>
|
<div className="public-fileCard">
|
<img src={$$.fileType(x.cat)} alt="" />
|
<div className="public-fileCard-main">
|
<Typography.Text ellipsis={{ tooltip: x.name }}>{x.name}</Typography.Text>
|
<Space size="middle" className="public-fileCard-action">
|
{/* {type === '1' && x.uploadType === '1' && <Link onClick={() => handleMake(x)}>制作</Link>} */}
|
{(type === '2' || x.uploadType === '2') && <Link onClick={() => myUploadRef.current.handleOpenFiles(x)}>预览</Link>}
|
<Link onClick={() => myUploadRef.current.handleDownloadFiles(x)}>下载</Link>
|
{type === '1' && <Link onClick={() => setResultDoc(x.id)}>转正式文书</Link>}
|
</Space>
|
</div>
|
<div className="public-fileCard-del" onClick={() => handleChangeFile(x)}>
|
<CloseCircleFilled />
|
</div>
|
</div>
|
<div className="public-fileCard-text">
|
<div>制作人：{x.uploaderName || '-'}</div>
|
<div>制作时间：{$$.timeFormat(x.createTime)}</div>
|
{signData.autNum && (
|
<div>
|
签名进度：
|
<Space>
|
<span>
|
{signData.autNumIs} / {signData.autNum}
|
</span>
|
<Link onClick={() => getSignData(x.docId, 'openModal')}>查看</Link>
|
<Link onClick={() => getSignData(x.docId)}>刷新</Link>
|
</Space>
|
</div>
|
)}
|
{x.autStatus === '1' && (
|
<div style={{ marginTop: '8px' }}>
|
<Button type="primary" disabled={signData.status === 'DRAFT' ? false : true} onClick={() => sendAutograph(data.resultFile?.docId)}>
|
{signData.status === 'DRAFT' ? '发送签名' : '已发送签名'}
|
</Button>
|
</div>
|
)}
|
</div>
|
</Col>
|
);
|
};
|
|
return (
|
<>
|
{/* 为了获取myUploadRef实例调用方法 */}
|
<MyUpload type="diy" showFileList={false} myUploadRef={myUploadRef} />
|
<div className="mediationWindow-modal-main">
|
<Row gutter={[16, 16]}>
|
{/* TODO:草稿文书暂无 */}
|
{/* <Col span={24}>
|
<h5>草稿文书</h5>
|
<Row gutter={[24, 16]}>
|
{data.docDraftList?.map((x, t) => documentDom(x, t, '1'))}
|
<Col span={12}>
|
<Tooltip
|
title={
|
<Space size={0}>
|
<span className="public-a" onClick={getTemplateData}>
|
选择模板
|
</span>
|
<MyUpload
|
type="diy"
|
fileId={caseId}
|
fileType={tabActive}
|
fileList={data.docDraftList || []}
|
showFileList={false}
|
handleChangeFile={() => getFilesData()}
|
>
|
<span style={{ color: '#ffffff' }} className="public-a public-rightBorder">
|
本地上传
|
</span>
|
</MyUpload>
|
</Space>
|
}
|
>
|
<MyUpload
|
type="diy"
|
fileId={caseId}
|
fileType={tabActive}
|
fileList={data.docDraftList || []}
|
showFileList={false}
|
handleChangeFile={() => getFilesData()}
|
>
|
<div className="mediationWindow-document-plus">
|
<PlusOutlined style={{ fontSize: '24px', color: 'rgba(0,0,0,0.5)' }} />
|
</div>
|
</MyUpload>
|
</Tooltip>
|
</Col>
|
</Row>
|
</Col> */}
|
<Col span={24}>
|
{/* <h5>正式文书</h5> */}
|
{!data.resultFile ? (
|
// <div style={{ float: 'left' }}>{$$.MyEmpty({ description: '请先制作草稿文书' })}</div>
|
<MyUpload
|
type="diy"
|
fileId={caseId}
|
fileType={tabActive}
|
fileList={data.docDraftList || []}
|
showFileList={false}
|
handleChangeFile={() => getFilesData()}
|
>
|
<Tooltip title="点击上传">
|
<div className="mediationWindow-document-plus">
|
<PlusOutlined style={{ fontSize: '24px', color: 'rgba(0,0,0,0.5)' }} />
|
</div>
|
</Tooltip>
|
</MyUpload>
|
) : (
|
<Row gutter={[24, 16]}>{documentDom(data.resultFile, 0, '2')}</Row>
|
)}
|
</Col>
|
</Row>
|
</div>
|
<MyModal visible={modalData.visible} onCancel={() => setModalData({ visible: false })}>
|
<h4>{modalData.title}</h4>
|
<TableView columns={modalData.type === 'template' ? templateColumns : autographColumns} dataSource={modalData.data} />
|
</MyModal>
|
</>
|
);
|
};
|
|
DocumentMaking.propTypes = {
|
tabActive: PropTypes.string,
|
};
|
|
export default DocumentMaking;
|
