|
|
|
@ -1,5 +1,6 @@ |
|
|
|
import React, { useState } from 'react'; |
|
|
|
import { Button, Form, Input, Modal, Select, DatePicker } from 'antd'; |
|
|
|
import { EnvironmentTwoTone } from '@ant-design/icons'; |
|
|
|
const { TextArea } = Input; |
|
|
|
import { connect } from 'react-redux'; |
|
|
|
import Uploads from '$components/Uploads'; |
|
|
|
@ -9,10 +10,46 @@ import moment from 'moment'; |
|
|
|
const ProjectAddModel = ({ dispatch, actions, user, modelData, close, success, qrCodeId }) => { |
|
|
|
|
|
|
|
const { projectRegime } = actions |
|
|
|
const [showBaiduMap, setShowBaiduMap] = useState(false) |
|
|
|
const [form] = Form.useForm(); |
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
// console.log(modelData);
|
|
|
|
if (modelData?.longitude && modelData?.latitude) { |
|
|
|
form.setFieldValue('longitude', modelData?.longitude) |
|
|
|
form.setFieldValue('latitude', modelData?.latitude) |
|
|
|
} |
|
|
|
var map = new AMap.Map('container', { |
|
|
|
resizeEnable: true, //是否监控地图容器尺寸变化
|
|
|
|
zoom: 11, //初始化地图层级
|
|
|
|
center: [116.397428, 39.90923] //初始化地图中心点
|
|
|
|
}); |
|
|
|
|
|
|
|
var autoOptions = { |
|
|
|
input: "tipinput" |
|
|
|
}; |
|
|
|
|
|
|
|
AMap.plugin(['AMap.PlaceSearch', 'AMap.AutoComplete', 'AMap.Geocoder'], () => { |
|
|
|
var auto = new AMap.AutoComplete(autoOptions); |
|
|
|
var placeSearch = new AMap.PlaceSearch({ |
|
|
|
map: map |
|
|
|
}); //构造地点查询类
|
|
|
|
|
|
|
|
function select (e) { |
|
|
|
if (e) { |
|
|
|
placeSearch.setCity(e.poi.adcode); |
|
|
|
placeSearch.search(e.poi.name, function (status, result) { |
|
|
|
form.setFieldValue('longitude', result.poiList.pois[0].location.lat) |
|
|
|
form.setFieldValue('latitude', result.poiList.pois[0].location.lng) |
|
|
|
}) //关键字查询查询
|
|
|
|
} |
|
|
|
} |
|
|
|
auto.on("select", select);//注册监听，当选中某条记录时会触发
|
|
|
|
map.on('click', function (e) { //点击地图获取经纬度
|
|
|
|
form.setFieldValue('longitude', e.lnglat.lat) |
|
|
|
form.setFieldValue('latitude', e.lnglat.lng) |
|
|
|
}); |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
}, []) |
|
|
|
|
|
|
|
@ -54,9 +91,9 @@ const ProjectAddModel = ({ dispatch, actions, user, modelData, close, success, q |
|
|
|
> |
|
|
|
<Input placeholder="请输入点位名称" allowClear /> |
|
|
|
</Form.Item> |
|
|
|
<div style={{}}> |
|
|
|
<div style={{position: 'relative'}}> |
|
|
|
{/* /^\d+$|^\d*\.\d+$/g */} |
|
|
|
<Form.Item label="所在地区:" labelCol={{ span: 11 }} labelAlign='right' name="longitude" initialValue={modelData?.longitude} style={{ display: 'inline-block', width: 'calc(60% - 30px)', }} |
|
|
|
<Form.Item label="所在地区:" labelCol={{ span: 11 }} labelAlign='right' name="longitude" style={{ display: 'inline-block', width: 'calc(60% - 30px)', }} |
|
|
|
rules={[{ required: true, message: '', },{ |
|
|
|
validator: (rule, value, callback) => { |
|
|
|
const sjh = /^\d+$|^\d*\.\d+$/g; |
|
|
|
@ -74,7 +111,7 @@ const ProjectAddModel = ({ dispatch, actions, user, modelData, close, success, q |
|
|
|
<Input placeholder="经度支持数字" /> |
|
|
|
</Form.Item> |
|
|
|
~ |
|
|
|
<Form.Item name="latitude" initialValue={modelData?.latitude} style={{ display: 'inline-block', width: 'calc(40% + 15px)', }} |
|
|
|
<Form.Item name="latitude" style={{ display: 'inline-block', width: 'calc(40% + 15px)', }} |
|
|
|
rules={[{ required: true, message: '', },{ |
|
|
|
validator: (rule, value, callback) => { |
|
|
|
const sjh = /^\d+$|^\d*\.\d+$/g; |
|
|
|
@ -91,7 +128,25 @@ const ProjectAddModel = ({ dispatch, actions, user, modelData, close, success, q |
|
|
|
> |
|
|
|
<Input placeholder="维度支持数字" /> |
|
|
|
</Form.Item> |
|
|
|
<EnvironmentTwoTone style={{ position: 'absolute', top: 5, right: 27, fontSize: 22 }} onClick={() => { |
|
|
|
setShowBaiduMap(true) |
|
|
|
}} /> |
|
|
|
</div> |
|
|
|
<Form.Item |
|
|
|
label={"地址"} |
|
|
|
name='location' |
|
|
|
style={showBaiduMap ? { display: 'block' } : { display: 'none' }} |
|
|
|
> |
|
|
|
<Input id="tipinput" /> |
|
|
|
</Form.Item> |
|
|
|
<Form.Item |
|
|
|
|
|
|
|
label="地图" |
|
|
|
name='map' |
|
|
|
style={showBaiduMap ? { display: 'block' } : { display: 'none' }} |
|
|
|
> |
|
|
|
<div id="container" style={{ width: '100%', height: '425px', marginBottom: '15px' }}></div> |
|
|
|
</Form.Item> |
|
|
|
<Form.Item name='describe' label="描述" |
|
|
|
initialValue={modelData?.describe} |
|
|
|
rules={[{ required: true, message: '请输入描述内容', },]}> |
|
|
|
|
