Skip to content

X
xform
Commit 86030319 authored by 田翔's avatar 田翔
Browse files
Options

fix: 增加手写签名

parent d569240d
Show whitespace changes
Inline Side-by-side
Showing with 224 additions and 91 deletions
package.json
View file @ 86030319
{ {
"name": "panda-xform", "name": "panda-xform",
"version": "4.7.8", "version": "4.7.9",
"description": "4.7.8 坐标写死问题", "description": "4.7.9 增加手写签名控件",
"keywords": [ "keywords": [
"panda-xform" "panda-xform"
], ],
...@@ -41,7 +41,7 @@ ...@@ -41,7 +41,7 @@
"react-dnd-html5-backend": "^16.0.1", "react-dnd-html5-backend": "^16.0.1",
"react-file-viewer": "^1.2.1", "react-file-viewer": "^1.2.1",
"react-resizable": "^3.0.5", "react-resizable": "^3.0.5",
"react-sign2": "^0.0.3", "react-signature-canvas": "^1.0.6",
"react-svg": "15.1.9", "react-svg": "15.1.9",
"viewerjs": "^1.11.3", "viewerjs": "^1.11.3",
"viewerjs-react": "^1.0.2", "viewerjs-react": "^1.0.2",
...@@ -54,7 +54,7 @@ ...@@ -54,7 +54,7 @@
"@babel/plugin-transform-modules-amd": "^7.14.5", "@babel/plugin-transform-modules-amd": "^7.14.5",
"@umijs/fabric": "^2.0.7", "@umijs/fabric": "^2.0.7",
"@wisdom-map/amap": "1.1.0-beta.56", "@wisdom-map/amap": "1.1.0-beta.56",
"@wisdom-map/arcgismap": "1.4.0-177", "@wisdom-map/arcgismap": "1.4.0-178",
"@wisdom-map/basemap": "1.1.0-27", "@wisdom-map/basemap": "1.1.0-27",
"babel-loader": "^8.2.2", "babel-loader": "^8.2.2",
"babel-plugin-import": "^1.13.3", "babel-plugin-import": "^1.13.3",
......
src/constant/index.js
View file @ 86030319
...@@ -181,6 +181,10 @@ const widgetData = { ...@@ -181,6 +181,10 @@ const widgetData = {
name: '自动计算', name: '自动计算',
type: '高级控件', type: '高级控件',
}, },
'Signature': {
name: '手写签名',
type: '高级控件',
},
} }
const getStyles = (type) => { const getStyles = (type) => {
......
src/core/FormDesigner/config/settings.js
View file @ 86030319
...@@ -2599,6 +2599,75 @@ const advancedWidgets = [ ...@@ -2599,6 +2599,75 @@ const advancedWidgets = [
}, },
}, },
}, },
{
text: '手写签名',
name: '手写签名',
icon: <IconPack.RelationForm />,
schema: {
title: '手写签名',
type: 'string',
widget: 'Signature',
},
setting: {
widget: {
title: '控件类型',
type: 'string',
widget: 'WidgetType',
displayType: 'row',
labelWidth: 80,
},
$id: {
title: '数据源',
type: 'string',
widget: 'FieldNames',
required: true,
},
title: {
title: '展示名称',
type: 'string',
widget: 'htmlInput',
default: '关联表单',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
description: {
title: '字段说明',
type: 'string',
widget: 'htmlInput',
},
disabled: {
title: '只读',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '33%',
},
groupStyle: {
title: '控件样式',
type: 'object',
properties: {}
},
width: {
title: '元素宽度',
type: 'string',
widget: 'percentSlider',
},
labelWidth: {
title: '标签宽度',
default: 120,
type: 'number',
widget: 'slider',
max: 400,
props: {
hideNumber: true,
},
},
},
},
] ]
const settings = [ const settings = [
......
src/core/widgets/advanced/Signature/index.js
View file @ 86030319
import React from 'react' import React, { useRef, useState } from 'react'
import Sign from 'react-sign2' import ReactSignatureCanvas from 'react-signature-canvas'
import Drag from '../../../components/Drag'
import { UploadFileReturnUrl } from '../../../../apis/process'
import styles from './index.less'
const Signature = (props) => { const Signature = (props) => {
const { value } = props const { addons, value, onChange, schema } = props
const { disabled } = schema
const [visible, setVisible] = useState(false)
const canvasRef = useRef(null)
const open = () => {
if (addons && !disabled) {
setVisible(true)
}
}
const onOk = async () => {
if (addons) {
const dataUrl = canvasRef.current.toDataURL(); // 获取 Base64 编码的字符串
const byteString = atob(dataUrl.split(',')[1]); // 将 Base64 编码的字符串转换为字节数组
const mimeString = dataUrl.split(',')[0].split(':')[1].split(';')[0]; // 获取 MIME 类型
const ab = new ArrayBuffer(byteString.length);
const ia = new Uint8Array(ab);
for (let i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i);
}
const file = new Blob([ab], { type: mimeString }); // 将字节数组转换为文件流
const formData = new FormData(); // 创建表单数据对象
formData.append('file', file, 'signature.png'); // 添加文件流到表
const { code, data } = await UploadFileReturnUrl(formData)
if (code === 0) {
onChange(data)
setVisible(false)
} else {
message.error('生成图片失败!')
}
}
}
return ( return (
<div> <div className={styles.signature}>
<Sign /> <div className={styles.content} onClick={open}>
{
value ? <img src={`${window.origin}/PandaWorkFlow/WorkFlow/AccountManage/DownloadFiles?filePath=${value}`}></img> : <div className={styles.text}>点击签名</div>
}
</div>
<Drag
title={'手写签名'}
visible={visible}
onOk={onOk}
onCancel={() => setVisible(false)}
destroyOnClose
>
<div style={{ background: '#aaa', borderRadius: '5px' }}>
<ReactSignatureCanvas
ref={canvasRef}
canvasProps={{ width: 500, height: 300 }}
/>
</div>
</Drag>
</div> </div>
) )
......
src/core/widgets/advanced/Signature/index.less 0 → 100644
View file @ 86030319
.signature {
width: 100%;
.content {
&:hover {
cursor: pointer;
}
img {
width: 100px;
height: 60px;
}
.text {
width: 100px;
height: 60px;
text-align: center;
line-height: 60px;
border-radius: 5px;
background: #efefef;
color: #a8a8a8;
&:hover {
font-weight: bold;
}
}
}
}
\ No newline at end of file
src/core/widgets/coord/Coordinate/index.js
View file @ 86030319
...@@ -163,6 +163,19 @@ const Coordinate = (props) => { ...@@ -163,6 +163,19 @@ const Coordinate = (props) => {
return cityName; return cityName;
} }
if (screenShot && disabled) {
return (
<div style={{ width: '100%', height: '150px' }}>
<ArcGISSceneMap
getMapInfo={getView}
widgets={[]}
token={token}
client={token ? client : 'sandbox'}
/>
</div>
)
}
return ( return (
<div> <div>
{ {
...@@ -176,7 +189,6 @@ const Coordinate = (props) => { ...@@ -176,7 +189,6 @@ const Coordinate = (props) => {
onClick={showMap} onClick={showMap}
/> />
: :
!screenShot ? (
<Button <Button
icon={<CompassOutlined style={{ color: value ? '#0092fe' : 'rgba(0, 0, 0, 0.25)' }} />} icon={<CompassOutlined style={{ color: value ? '#0092fe' : 'rgba(0, 0, 0, 0.25)' }} />}
onClick={() => { onClick={() => {
...@@ -187,19 +199,7 @@ const Coordinate = (props) => { ...@@ -187,19 +199,7 @@ const Coordinate = (props) => {
> >
{value ? '查看位置' : '无位置信息'} {value ? '查看位置' : '无位置信息'}
</Button> </Button>
) : null
} }
{
screenShot && disabled ? (
<div style={{ width: '100%', height: '150px' }}>
<ArcGISSceneMap
getMapInfo={getView}
widgets={[]}
token={token}
client={token ? client : 'sandbox'}
/>
</div>
) : (
<Drag <Drag
width={'80%'} width={'80%'}
title="选取坐标" title="选取坐标"
...@@ -226,9 +226,7 @@ const Coordinate = (props) => { ...@@ -226,9 +226,7 @@ const Coordinate = (props) => {
} }
</div> </div>
</Drag> </Drag>
) </div >
}
</div>
) )
} }
......
src/core/widgets/coord/Device/index.js
View file @ 86030319
...@@ -25,7 +25,8 @@ const Device = (props) => { ...@@ -25,7 +25,8 @@ const Device = (props) => {
let clickref = useRef(null) let clickref = useRef(null)
let view = useRef(null) let view = useRef(null)
const getMapInfo = (mapObj, Map) => { const getMapInfo = (mapObj, Map, disabled) => {
console.log('disabled', disabled)
setTimeout(() => { setTimeout(() => {
if (mapObj) { if (mapObj) {
view.current = mapObj view.current = mapObj
...@@ -122,6 +123,19 @@ const Device = (props) => { ...@@ -122,6 +123,19 @@ const Device = (props) => {
} }
}, [presetValue]) }, [presetValue])
if (screenShot && disabled) {
return (
<div style={{ width: '100%', height: '120px' }}>
<ArcGISSceneMap
getMapInfo={(mapObj, Map) => getMapInfo(mapObj, Map, true)}
widgets={[]}
token={token}
client={token ? client : 'sandbox'}
/>
</div>
)
}
return ( return (
<div> <div>
{ {
...@@ -134,7 +148,7 @@ const Device = (props) => { ...@@ -134,7 +148,7 @@ const Device = (props) => {
addonAfter={disabled ? null : <CompassOutlined style={{ color: 'rgba(0, 0, 0, 0.25)' }} onClick={iconClick} />} addonAfter={disabled ? null : <CompassOutlined style={{ color: 'rgba(0, 0, 0, 0.25)' }} onClick={iconClick} />}
style={{ width: '100%' }} style={{ width: '100%' }}
/> : /> :
!screenShot ? <Button <Button
icon={<CompassOutlined style={{ color: value ? '#0092fe' : 'rgba(0, 0, 0, 0.25)' }} />} icon={<CompassOutlined style={{ color: value ? '#0092fe' : 'rgba(0, 0, 0, 0.25)' }} />}
onClick={() => { onClick={() => {
if (value) { if (value) {
...@@ -143,19 +157,8 @@ const Device = (props) => { ...@@ -143,19 +157,8 @@ const Device = (props) => {
}} }}
> >
{value ? '查看设备' : '无设备信息'} {value ? '查看设备' : '无设备信息'}
</Button> : null </Button>
} }
{
screenShot && disabled ? (
<div style={{ width: '100%', height: '120px' }}>
<ArcGISSceneMap
getMapInfo={getMapInfo}
widgets={[]}
token={token}
client={token ? client : 'sandbox'}
/>
</div>
) : (
<Drag <Drag
visible={visible} visible={visible}
title='设备选择' title='设备选择'
...@@ -169,14 +172,12 @@ const Device = (props) => { ...@@ -169,14 +172,12 @@ const Device = (props) => {
{...disabled ? { footer: null } : {}} {...disabled ? { footer: null } : {}}
> >
<ArcGISSceneMap <ArcGISSceneMap
getMapInfo={getMapInfo} getMapInfo={(mapObj, Map) => getMapInfo(mapObj, Map, disabled)}
widgets={[]} widgets={[]}
token={token} token={token}
client={token ? client : 'sandbox'} client={token ? client : 'sandbox'}
/> />
</Drag> </Drag>
)
}
</div > </div >
) )
} }
......
src/core/widgets/coord/DrawArea/index.js
View file @ 86030319
...@@ -99,6 +99,19 @@ const DrawArea = (props) => { ...@@ -99,6 +99,19 @@ const DrawArea = (props) => {
} }
}, [presetValue]) }, [presetValue])
if (screenShot && disabled) {
return (
<div style={{ width: '100%', height: '150px' }}>
<ArcGISSceneMap
getMapInfo={getView}
widgets={[]}
token={token}
client={token ? client : 'sandbox'}
/>
</div>
)
}
return ( return (
<div> <div>
{ {
...@@ -112,7 +125,7 @@ const DrawArea = (props) => { ...@@ -112,7 +125,7 @@ const DrawArea = (props) => {
onClick={showMap} onClick={showMap}
/> />
: :
!screenShot ? <Button <Button
icon={<CompassOutlined style={{ color: value ? '#0092fe' : 'rgba(0, 0, 0, 0.25)' }} />} icon={<CompassOutlined style={{ color: value ? '#0092fe' : 'rgba(0, 0, 0, 0.25)' }} />}
onClick={() => { onClick={() => {
if (value) { if (value) {
...@@ -121,19 +134,8 @@ const DrawArea = (props) => { ...@@ -121,19 +134,8 @@ const DrawArea = (props) => {
}} }}
> >
{value ? '查看位置' : '无位置信息'} {value ? '查看位置' : '无位置信息'}
</Button> : null </Button>
} }
{
screenShot && disabled ? (
<div style={{ width: '100%', height: '150px' }}>
<ArcGISSceneMap
getMapInfo={getView}
widgets={[]}
token={token}
client={token ? client : 'sandbox'}
/>
</div>
) : (
<Drag <Drag
width={'80%'} width={'80%'}
title="选取坐标" title="选取坐标"
...@@ -161,9 +163,7 @@ const DrawArea = (props) => { ...@@ -161,9 +163,7 @@ const DrawArea = (props) => {
client={token ? client : 'sandbox'} client={token ? client : 'sandbox'}
/> />
</div> </div>
</Drag > </Drag>
)
}
</div > </div >
) )
......
src/core/widgets/coord/DrawPath/index.js
View file @ 86030319
...@@ -98,6 +98,19 @@ const DrawPath = (props) => { ...@@ -98,6 +98,19 @@ const DrawPath = (props) => {
} }
}, [presetValue]) }, [presetValue])
if (screenShot && disabled) {
return (
<div style={{ width: '100%', height: '150px' }}>
<ArcGISSceneMap
getMapInfo={getView}
widgets={[]}
token={token}
client={token ? client : 'sandbox'}
/>
</div>
)
}
return ( return (
<div> <div>
{ {
...@@ -111,7 +124,7 @@ const DrawPath = (props) => { ...@@ -111,7 +124,7 @@ const DrawPath = (props) => {
onClick={showMap} onClick={showMap}
/> />
: :
!screenShot ? <Button <Button
icon={<CompassOutlined style={{ color: value ? '#0092fe' : 'rgba(0, 0, 0, 0.25)' }} />} icon={<CompassOutlined style={{ color: value ? '#0092fe' : 'rgba(0, 0, 0, 0.25)' }} />}
onClick={() => { onClick={() => {
if (value) { if (value) {
...@@ -120,19 +133,8 @@ const DrawPath = (props) => { ...@@ -120,19 +133,8 @@ const DrawPath = (props) => {
}} }}
> >
{value ? '查看位置' : '无位置信息'} {value ? '查看位置' : '无位置信息'}
</Button> : null </Button>
} }
{
screenShot && disabled ? (
<div style={{ width: '100%', height: '150px' }}>
<ArcGISSceneMap
getMapInfo={getView}
widgets={[]}
token={token}
client={token ? client : 'sandbox'}
/>
</div>
) : (
<Drag <Drag
width={'80%'} width={'80%'}
title="选取坐标" title="选取坐标"
...@@ -160,9 +162,7 @@ const DrawPath = (props) => { ...@@ -160,9 +162,7 @@ const DrawPath = (props) => {
client={token ? client : 'sandbox'} client={token ? client : 'sandbox'}
/> />
</div> </div>
</Drag > </Drag>
)
}
</div > </div >
) )
......
src/core/widgets/settings/groupBase/WidgetType/index.js
View file @ 86030319
...@@ -6,10 +6,6 @@ const WidgetType = (props) => { ...@@ -6,10 +6,6 @@ const WidgetType = (props) => {
const { value, onChange } = props const { value, onChange } = props
// const options = useMemo(() => {
// }, [])
return ( return (
<span <span
style={{ style={{
...@@ -21,19 +17,6 @@ const WidgetType = (props) => { ...@@ -21,19 +17,6 @@ const WidgetType = (props) => {
{widgetData[value]?.name} {widgetData[value]?.name}
</span> </span>
) )
// return (
// <Select
// showArrow
// tagRender={tagRender}
// defaultValue={['gold', 'cyan']}
// style={{
// width: '100%',
// }}
// options={options}
// >
// </Select>
// )
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment