Commit ab875fa9 authored by 田翔's avatar 田翔

fix: 设备选择映射字段支持清空

parent 490ed9d4
{ {
"name": "panda-xform", "name": "panda-xform",
"version": "5.0.2", "version": "5.0.3",
"description": "5.0.2 手写签名", "description": "5.0.3 设备选择映射字段支持清空,缩略图优化",
"keywords": [ "keywords": [
"panda-xform" "panda-xform"
], ],
......
...@@ -2294,13 +2294,6 @@ const mapWidgets = [ ...@@ -2294,13 +2294,6 @@ const mapWidgets = [
description: '所有形态默认显示', description: '所有形态默认显示',
widget: 'HiddenCondition' widget: 'HiddenCondition'
}, },
screenShot: {
title: '是否显示缩略图',
type: 'boolean',
widget: 'BooleanSwitch',
default: false,
description: '只读情况下会显示缩略图'
},
fieldshine: { fieldshine: {
title: '映射字段', title: '映射字段',
name: '映射字段', name: '映射字段',
...@@ -2308,6 +2301,13 @@ const mapWidgets = [ ...@@ -2308,6 +2301,13 @@ const mapWidgets = [
widget: 'DeviceFieldshine', widget: 'DeviceFieldshine',
default: [], default: [],
}, },
screenShot: {
title: '是否显示缩略图',
type: 'boolean',
widget: 'BooleanSwitch',
default: false,
description: '只读情况下会显示缩略图'
},
required: { required: {
title: '必填', title: '必填',
type: 'boolean', type: 'boolean',
......
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import { Input, Button } from 'antd' import { Input, Button } from 'antd'
import { CompassOutlined } from '@ant-design/icons' import { CompassOutlined, DownOutlined, UpOutlined } from '@ant-design/icons'
import IconPack from '../../../components/IconPack'
import { import {
ArcGISSceneMap, ArcGISSceneMap,
AutoCompleteSearch, AutoCompleteSearch,
...@@ -14,10 +13,11 @@ import { ...@@ -14,10 +13,11 @@ import {
import Drag from '../../../components/Drag' import Drag from '../../../components/Drag'
import { isObject, mercatorToLngLat } from '../../../../utils' import { isObject, mercatorToLngLat } from '../../../../utils'
import { getLocation } from '../../../../apis/process' import { getLocation } from '../../../../apis/process'
import styles from './index.less'
const Coordinate = (props) => { const Coordinate = (props) => {
const { token, client } = window.globalConfig const { token, client, uiwidgets } = window.globalConfig
const { value, onChange, schema, addons } = props const { value, onChange, schema, addons } = props
const { disabled, placeholder, presetValue, addressSync, screenShot } = schema const { disabled, placeholder, presetValue, addressSync, screenShot } = schema
const [layersConifg, setLayersConifg] = useState(() => { const [layersConifg, setLayersConifg] = useState(() => {
...@@ -27,6 +27,8 @@ const Coordinate = (props) => { ...@@ -27,6 +27,8 @@ const Coordinate = (props) => {
const [visible, setVisible] = useState(false) const [visible, setVisible] = useState(false)
const [initCoordinate, setInitCoordinate] = useState([]) const [initCoordinate, setInitCoordinate] = useState([])
const [currentPointerCoordinate, setCurrentPointerCoordinate] = useState([]) const [currentPointerCoordinate, setCurrentPointerCoordinate] = useState([])
const [text, setText] = useState(presetValue ? '加载中...' : '(空)')
const [put, setPut] = useState(true)
const [view, setView] = useState(null) const [view, setView] = useState(null)
const getView = (viewObject) => { const getView = (viewObject) => {
...@@ -166,6 +168,17 @@ const Coordinate = (props) => { ...@@ -166,6 +168,17 @@ const Coordinate = (props) => {
onChange(currentPointerCoordinate.join(',')) onChange(currentPointerCoordinate.join(','))
} }
const getAddress = async (presetValue) => {
if (presetValue) {
const { code, data } = await getLocation(presetValue)
if (Array.isArray(data) && data.length) {
const { pname, adname, name, address } = data[0]
setText(`${pname}/${adname}/${name}`)
}
}
}
useEffect(() => { useEffect(() => {
if (value) { if (value) {
let _temp = value && value.split(',') || [] let _temp = value && value.split(',') || []
...@@ -180,8 +193,15 @@ const Coordinate = (props) => { ...@@ -180,8 +193,15 @@ const Coordinate = (props) => {
} else { } else {
onChange(presetValue) onChange(presetValue)
} }
getAddress(presetValue)
}, [presetValue]) }, [presetValue])
useEffect(() => {
if (disabled && screenShot) {
addons?.setSchemaByPath(addons.dataPath, { ...schema, width: '67%' })
}
}, [disabled, screenShot])
const getCityName = () => { const getCityName = () => {
let cityName = '中华人民共和国'; let cityName = '中华人民共和国';
if (layersConifg && layersConifg.layers) { if (layersConifg && layersConifg.layers) {
...@@ -196,21 +216,56 @@ const Coordinate = (props) => { ...@@ -196,21 +216,56 @@ const Coordinate = (props) => {
return cityName; return cityName;
} }
if (screenShot && disabled) { if (screenShot && disabled && addons) {
return ( return (
<div style={{ width: '100%', height: '150px' }}> <div className={styles.coordinateShot}>
<ArcGISSceneMap <div className={styles.content}>
getMapInfo={getMapInfo} <div className={styles.top}>
widgets={[]} <div className={styles.text}>{text}</div>
token={token} <div
client={token ? client : 'sandbox'} className={styles.icon}
/> onClick={() => setPut(!put)}
style={{ transform: `rotate(${put ? 0 : 180}deg)` }}
>
<DownOutlined />
</div>
</div>
<div className={styles.mapBox} style={{ height: put ? '208px' : '0px' }}>
<ArcGISSceneMap
getMapInfo={getMapInfo}
widgets={[
{
"label": "缩放",
"url": "mapgis/widgets/Zoom",
"top": "20",
// "bottom": "333",
"right": "20",
"config": "",
"widgetId": "widget_bpm_缩放",
"breadcrumbMap": "缩放"
},
{
"label": "比例尺",
"url": "mapgis/widgets/ScaleBar",
"left": "20",
"top": "180",
// "bottom": "20",
"config": "",
"widgetId": "widget_bpm_比例尺",
"breadcrumbMap": "比例尺"
},
]}
token={token}
client={token ? client : 'sandbox'}
/>
</div>
</div>
</div> </div>
) )
} }
return ( return (
<div> <div className={styles.coordinate}>
{ {
!disabled ? !disabled ?
<Input <Input
......
.coordinateShot {
width: 100%;
border: 1px solid #ccc;
.content {
width: 100%;
.top {
padding: 0 10px;
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
height: 40px;
color: #727272;
.icon {
transition: all 0.5s ease-in-out;
&:hover {
cursor: pointer;
}
}
}
.mapBox {
position: relative;
width: 100%;
height: 208px;
overflow: hidden;
transition: all 0.5s ease-in-out;
}
}
}
\ No newline at end of file
import React, { useState, useRef, useEffect, useContext } from 'react' import React, { useState, useRef, useEffect, useContext } from 'react'
import { Input, Button } from 'antd' import { Input, Button } from 'antd'
import { CompassOutlined, ExclamationCircleOutlined } from '@ant-design/icons' import { CompassOutlined, DownOutlined } from '@ant-design/icons'
import { import {
ArcGISSceneMap, ArcGISSceneMap,
ClickQuery, ClickQuery,
...@@ -11,6 +11,7 @@ import { ...@@ -11,6 +11,7 @@ import {
import point from './img/point.png' import point from './img/point.png'
import { isObject } from '../../../../utils' import { isObject } from '../../../../utils'
import Drag from '../../../components/Drag' import Drag from '../../../components/Drag'
import styles from './index.less'
let geometrystr = '' let geometrystr = ''
let gisInfo = {} let gisInfo = {}
...@@ -22,6 +23,8 @@ const Device = (props) => { ...@@ -22,6 +23,8 @@ const Device = (props) => {
const { addons, value, onChange, schema } = props const { addons, value, onChange, schema } = props
const { placeholder, disabled, parent, presetValue, screenShot, fieldshine } = schema const { placeholder, disabled, parent, presetValue, screenShot, fieldshine } = schema
const [visible, setVisible] = useState(false) const [visible, setVisible] = useState(false)
const [text, setText] = useState(presetValue ? presetValue : '(空)')
const [put, setPut] = useState(true)
let clickref = useRef(null) let clickref = useRef(null)
let view = useRef(null) let view = useRef(null)
...@@ -177,15 +180,35 @@ const Device = (props) => { ...@@ -177,15 +180,35 @@ const Device = (props) => {
} }
}, [presetValue]) }, [presetValue])
if (screenShot && disabled) { useEffect(() => {
if (disabled && screenShot) {
addons?.setSchemaByPath(addons.dataPath, { ...schema, width: '67%' })
}
}, [disabled, screenShot])
if (screenShot && disabled && addons) {
return ( return (
<div style={{ width: '100%', height: '120px' }}> <div className={styles.deviceShot}>
<ArcGISSceneMap <div className={styles.content}>
getMapInfo={getMapInfo} <div className={styles.top}>
widgets={[]} <div className={styles.text}>{text}</div>
token={token} <div
client={token ? client : 'sandbox'} className={styles.icon}
/> onClick={() => setPut(!put)}
style={{ transform: `rotate(${put ? 0 : 180}deg)` }}
>
<DownOutlined />
</div>
</div>
<div className={styles.mapBox} style={{ height: put ? '208px' : '0px' }}>
<ArcGISSceneMap
getMapInfo={getMapInfo}
widgets={[]}
token={token}
client={token ? client : 'sandbox'}
/>
</div>
</div>
</div> </div>
) )
} }
......
.tip { .deviceShot {
width: 300px; width: 100%;
background: white; border: 1px solid #ccc;
padding: 0; .content {
.tip-header { width: 100%;
background: #637cf7; .top {
height: 30px; padding: 0 10px;
line-height: 30px;
color: white;
padding-left: 20px;
position: relative;
.tip-close {
position: absolute;
right: 20px;
top: 0;
font-size: 16px;
&:hover {
cursor: pointer;
}
}
}
.tip-content {
height: 240px;
overflow-y: auto;
.tip-list {
display: flex; display: flex;
height: 25px; align-items: center;
line-height: 25px; justify-content: space-between;
&:nth-child(odd) { width: 100%;
background: rgba(76, 76, 76, .1); height: 40px;
} color: #727272;
.tip-list-left { .icon {
width: 50%; transition: all 0.5s ease-in-out;
text-align: center; &:hover {
font-weight: bold; cursor: pointer;
} }
.tip-list-right {
width: 50%;
} }
} }
} .mapBox {
.tip-footer { position: relative;
height: 40px; width: 100%;
position: relative; height: 208px;
.confirm { overflow: hidden;
position: absolute; transition: all 0.5s ease-in-out;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
padding: 2px 7px;
border-radius: 3px;
background: #637cf7;
color: white;
&:hover {
cursor: pointer;
}
}
.triangle {
position: absolute;
bottom: -15px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 15px solid white;
z-index: 16;
}
.angle {
position: absolute;
bottom: -20px;
left: 50%;
transform: translateX(-50%);
border-radius: 50%;
width: 10px;
height: 10px;
background: red;
z-index: 15;
} }
} }
} }
\ No newline at end of file
import React, { useState, useEffect, useRef } from 'react' import React, { useState, useEffect, useRef } from 'react'
import { Input, Button } from 'antd' import { Input, Button } from 'antd'
import { CompassOutlined } from '@ant-design/icons' import { CompassOutlined, DownOutlined } from '@ant-design/icons'
import IconPack from '../../../components/IconPack' import styles from './index.less'
import { import {
ArcGISSceneMap, ArcGISSceneMap,
AutoCompleteSearch, AutoCompleteSearch,
...@@ -24,6 +24,8 @@ const DrawArea = (props) => { ...@@ -24,6 +24,8 @@ const DrawArea = (props) => {
const { disabled, placeholder, presetValue, addressSync, screenShot } = schema const { disabled, placeholder, presetValue, addressSync, screenShot } = schema
const [visible, setVisible] = useState(false) const [visible, setVisible] = useState(false)
const [rings, setRings] = useState({}) const [rings, setRings] = useState({})
const [text, setText] = useState(presetValue ? '已绘制' : '(空)')
const [put, setPut] = useState(true)
const viewRef = useRef(null) const viewRef = useRef(null)
const layers = useRef(null) const layers = useRef(null)
...@@ -105,15 +107,36 @@ const DrawArea = (props) => { ...@@ -105,15 +107,36 @@ const DrawArea = (props) => {
} }
}, [presetValue]) }, [presetValue])
if (screenShot && disabled) { useEffect(() => {
if (disabled && screenShot) {
addons?.setSchemaByPath(addons.dataPath, { ...schema, width: '67%' })
}
}, [disabled, screenShot])
if (screenShot && disabled && addons) {
return ( return (
<div style={{ width: '100%', height: '150px' }}> <div className={styles.drawAreaShot}>
<ArcGISSceneMap <div className={styles.content}>
getMapInfo={getMapInfo} <div className={styles.top}>
widgets={[]} <div className={styles.text}>{text}</div>
token={token} <div
client={token ? client : 'sandbox'} className={styles.icon}
/> onClick={() => setPut(!put)}
style={{ transform: `rotate(${put ? 0 : 180}deg)` }}
>
<DownOutlined />
</div>
</div>
<div className={styles.mapBox} style={{ height: put ? '208px' : '0px' }}>
<ArcGISSceneMap
getMapInfo={getMapInfo}
widgets={[]}
token={token}
client={token ? client : 'sandbox'}
/>
</div>
</div>
</div> </div>
) )
} }
...@@ -139,7 +162,7 @@ const DrawArea = (props) => { ...@@ -139,7 +162,7 @@ const DrawArea = (props) => {
} }
}} }}
> >
{value ? '查看位置' : '无位置信息'} {value ? '查看区域' : '无区域信息'}
</Button> </Button>
} }
<Drag <Drag
......
.drawAreaShot {
width: 100%;
border: 1px solid #ccc;
.content {
width: 100%;
.top {
padding: 0 10px;
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
height: 40px;
color: #727272;
.icon {
transition: all 0.5s ease-in-out;
&:hover {
cursor: pointer;
}
}
}
.mapBox {
position: relative;
width: 100%;
height: 208px;
overflow: hidden;
transition: all 0.5s ease-in-out;
}
}
}
\ No newline at end of file
import React, { useState, useEffect, useRef } from 'react' import React, { useState, useEffect, useRef } from 'react'
import { Input, Button } from 'antd' import { Input, Button } from 'antd'
import { CompassOutlined } from '@ant-design/icons' import { CompassOutlined, DownOutlined } from '@ant-design/icons'
import IconPack from '../../../components/IconPack' import styles from './index.less'
import { import {
ArcGISSceneMap, ArcGISSceneMap,
AutoCompleteSearch, AutoCompleteSearch,
...@@ -23,6 +23,8 @@ const DrawPath = (props) => { ...@@ -23,6 +23,8 @@ const DrawPath = (props) => {
const { disabled, placeholder, presetValue, addressSync, screenShot } = schema const { disabled, placeholder, presetValue, addressSync, screenShot } = schema
const [visible, setVisible] = useState(false) const [visible, setVisible] = useState(false)
const [paths, setPaths] = useState({}) const [paths, setPaths] = useState({})
const [text, setText] = useState(presetValue ? '已绘制' : '(空)')
const [put, setPut] = useState(true)
const viewRef = useRef(null) const viewRef = useRef(null)
const layers = useRef(null) const layers = useRef(null)
...@@ -104,15 +106,35 @@ const DrawPath = (props) => { ...@@ -104,15 +106,35 @@ const DrawPath = (props) => {
} }
}, [presetValue]) }, [presetValue])
if (screenShot && disabled) { useEffect(() => {
if (disabled && screenShot) {
addons?.setSchemaByPath(addons.dataPath, { ...schema, width: '67%' })
}
}, [disabled, screenShot])
if (screenShot && disabled && addons) {
return ( return (
<div style={{ width: '100%', height: '150px' }}> <div className={styles.drawPathShot}>
<ArcGISSceneMap <div className={styles.content}>
getMapInfo={getMapInfo} <div className={styles.top}>
widgets={[]} <div className={styles.text}>{text}</div>
token={token} <div
client={token ? client : 'sandbox'} className={styles.icon}
/> onClick={() => setPut(!put)}
style={{ transform: `rotate(${put ? 0 : 180}deg)` }}
>
<DownOutlined />
</div>
</div>
<div className={styles.mapBox} style={{ height: put ? '208px' : '0px' }}>
<ArcGISSceneMap
getMapInfo={getMapInfo}
widgets={[]}
token={token}
client={token ? client : 'sandbox'}
/>
</div>
</div>
</div> </div>
) )
} }
...@@ -138,7 +160,7 @@ const DrawPath = (props) => { ...@@ -138,7 +160,7 @@ const DrawPath = (props) => {
} }
}} }}
> >
{value ? '查看位置' : '无位置信息'} {value ? '查看路径' : '无路径信息'}
</Button> </Button>
} }
<Drag <Drag
......
.drawPathShot {
width: 100%;
border: 1px solid #ccc;
.content {
width: 100%;
.top {
padding: 0 10px;
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
height: 40px;
color: #727272;
.icon {
transition: all 0.5s ease-in-out;
&:hover {
cursor: pointer;
}
}
}
.mapBox {
position: relative;
width: 100%;
height: 208px;
overflow: hidden;
transition: all 0.5s ease-in-out;
}
}
}
\ No newline at end of file
...@@ -80,6 +80,13 @@ const DeviceFieldshine = (props) => { ...@@ -80,6 +80,13 @@ const DeviceFieldshine = (props) => {
form.setFieldsValue({ field: values, service, layerName }) form.setFieldsValue({ field: values, service, layerName })
} }
const clear = () => {
addons.setValue('service', '')
addons.setValue('layerName', '')
onChange([])
setVisible(false)
}
return ( return (
<div className={styles.fieldshine}> <div className={styles.fieldshine}>
<Input <Input
...@@ -91,8 +98,14 @@ const DeviceFieldshine = (props) => { ...@@ -91,8 +98,14 @@ const DeviceFieldshine = (props) => {
width='450px' width='450px'
title='字段映射' title='字段映射'
visible={visible} visible={visible}
footer={
<div>
<Button onClick={() => setVisible(false)}>取消</Button>
<Button onClick={() => clear()}>清空</Button>
<Button type="primary" onClick={() => onOk()}>确定</Button>
</div>
}
onCancel={() => setVisible(false)} onCancel={() => setVisible(false)}
onOk={onOk}
> >
<Form name="dynamic_form_nest_item" form={form} autoComplete="off"> <Form name="dynamic_form_nest_item" form={form} autoComplete="off">
<Form.Item <Form.Item
......
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