提交 eeb2bf51 authored 作者: 徐立's avatar 徐立

修改bug

上级 8f9abf3d
/**
* 徐立
* 2019年12月6日
* 电子签章多功能封装
*/
import React, { Component } from 'react'
import SignatureCanvas from 'react-signature-canvas'
// import Button from '@/components/NewButton';
import { message,Button } from 'antd';
import config from '../config/config';
import { queryApiActionPath } from "../utils/queryConfig";
import reqwest from 'reqwest';
function dataURLtoFile (dataurl, filename) {
var arr = dataurl.split(','),
mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]),
n = bstr.length,
u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new File([u8arr], filename, { type: mime });
}
export default class index extends Component {
constructor(props){
super(props);
const value = props.value;
this.state = {
url:value,
}
}
triggerChange = (changedValue) => {
// Should provide an event to pass value to Form.
const onChange = this.props.onChange;
if (onChange) {
onChange(changedValue);
}
}
componentWillReceiveProps(nextProps) {
// Should be a controlled component.
if ('value' in nextProps) {
const value = nextProps.value;
this.setState({url:value});
//
}
}
sigCanvas = {clear:()=>{},toDataURL:(param)=>{return ""}};
clear=()=>{
this.sigCanvas.clear();
}
delete=()=>{
if (!('value' in this.props)) {
this.setState({url:null});
}
this.triggerChange(null);
}
trim=()=>{
const formData = new FormData()
formData.append('file',dataURLtoFile(this.sigCanvas.toDataURL('image/png'),"sign.png"))
reqwest({
url: config.uploadUrl,
method: 'post',
processData: false,
data: formData,
success: (url) => {
if (!('value' in this.props)) {
this.setState({url:url});
}
this.triggerChange(url);
message.success('保存成功');
},
error: (e) => {
if(e.status==200){
message.success('保存成功');
if (!('value' in this.props)) {
this.setState({url:e.response});
}
this.triggerChange(e.response);
}else{
message.error('保存失败');
}
},
});
//let trimmedCanvas = this.sigCanvas.getTrimmedCanvas();
// this.setState({trimmedDataURL: this.sigCanvas.toDataURL('image/png')})
}
render() {
const { width,height } = this.props
const {url}=this.state
return (
<div id='canvas_signature' style={{width:'100%',height:'100%'}}>
<div style={{width: width,textAlign:'center', height: height,border:'1px dashed gray',position:'relative'}}>
{url?<img src={config.httpServer+url} style={{width:width,height:height}}/>: <SignatureCanvas penColor='black'
ref={(ref) => { this.sigCanvas = ref }}
canvasProps={{
width: width||400,
height: height||200,
className: 'sigCanvas'
}}
/>}
<div style={{position:'absolute',right:20,bottom:20}}>
{url?<Button style={{marginRight:12}} type='danger' onClick={this.delete}>重写签名</Button>:<>
<Button style={{marginRight:12}} type='danger' onClick={this.clear}>清除签名</Button>
<Button onClick={this.trim} type='primary'>保存签名</Button></>}
</div>
</div>
</div>
)
}
}
......@@ -58,7 +58,7 @@ import { queryApiActionPath } from "../utils/queryConfig";
import { extend } from 'umi-request';
import { date } from '../libs/formList/config';
import Highlighter from 'react-highlight-words';
import Signature from '@/components/Signature';
import Signature from '../Signature';
import baseX from 'base-x'
const Bs64 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/'
const base64 = baseX(Bs64)
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论