/*
|
* @Company: hugeInfo
|
* @Author: ldh
|
* @Date: 2022-07-20 17:44:04
|
* @LastEditTime: 2022-11-30 14:31:44
|
* @LastEditors: ldh
|
* @Version: 1.0.0
|
* @Description: 调解邀请码
|
*/
|
import React, { useState, useEffect, useRef } from 'react';
|
import PropTypes from 'prop-types';
|
import { Row, Col, Image, Typography, Space } from 'antd';
|
import * as $$ from '../../../utils/utility';
|
import { yunVideo, qrCodeImg } from '../../../assets/images/icon';
|
|
const { Link, Paragraph } = Typography;
|
|
// 获取邀请码
|
function handleGetScanApi(submitData) {
|
return $$.ax.request({ url: 'caseInfo/getInviteCode?caseId=' + submitData, type: 'get', service: 'mediate' });
|
}
|
|
const MediationCode = ({ caseId, disputeData }) => {
|
const [data, setData] = useState({});
|
|
const qrCodeRef = useRef();
|
|
// 下载二维码
|
function handleUpload() {
|
if (!data.inviteCode) {
|
$$.info({ type: 'error', content: '暂无二维码' });
|
return;
|
}
|
let raw = window.atob(data.inviteCode);
|
let rawLength = raw.length;
|
let uInt8Array = new Uint8Array(rawLength);
|
for (let i = 0; i < rawLength; ++i) {
|
uInt8Array[i] = raw.charCodeAt(i);
|
}
|
let url = URL.createObjectURL(new Blob([uInt8Array], { type: 'image/jpeg' }));
|
qrCodeRef.current.download = '二维码.png';
|
qrCodeRef.current.href = url;
|
}
|
|
useEffect(() => {
|
// 获取邀请码
|
async function handleGetScan() {
|
global.setSpinning(true);
|
const res = await handleGetScanApi(caseId);
|
global.setSpinning(false);
|
if (res.type) {
|
setData(res.data || {});
|
}
|
}
|
handleGetScan();
|
}, [caseId]);
|
|
return (
|
<div className="mediationWindow-modal-main">
|
<Row gutter={[16, 16]}>
|
<Col span={6}>
|
<h5>调解案号</h5>
|
<div>{data.caseNo}</div>
|
</Col>
|
<Col span={6}>
|
<h5>在线视频调解房间号</h5>
|
<Space>
|
<img src={yunVideo} alt="" />
|
{disputeData.meetCloud?.roomNo ? (
|
<Paragraph style={{ margin: 0 }} copyable>
|
{disputeData.meetCloud.roomNo}
|
</Paragraph>
|
) : (
|
<div>-</div>
|
)}
|
</Space>
|
</Col>
|
{/* TODO:小程序的协助调解功能暂未开启 */}
|
{/* <Col span={12}>
|
<h5>调解邀请码</h5>
|
<div className="mediationWindow-modal-subtitle">使用小程序“协助调解”功能输入「调解邀请码」开展协同办案</div>
|
<Paragraph style={{ margin: '8px 0 0' }} copyable>
|
{data.inviteNum}
|
</Paragraph>
|
</Col>
|
<Col span={24}>
|
<h5>调解邀请二维码</h5>
|
<p style={{ marginBottom: '8px', color: 'rgba(0,0,0,0.65)' }}>使用小程序“协助调解”功能扫描「调解邀二维请码」开展协同办案</p>
|
<div style={{ marginBottom: '8px' }}>
|
<Link onClick={handleUpload} ref={qrCodeRef}>
|
下载二维码
|
</Link>
|
</div>
|
<div style={{ position: 'relative' }}>
|
<img src={qrCodeImg} alt="" />
|
<div style={{ position: 'absolute', top: 40, left: 16 }}>
|
<Image width={76} src={`data:image/jpeg;base64,${data.inviteCode}`} />
|
</div>
|
</div>
|
</Col> */}
|
</Row>
|
</div>
|
);
|
};
|
|
MediationCode.propTypes = {
|
disputeData: PropTypes.object,
|
};
|
|
export default MediationCode;
|
