AdressSelect.tsx
2.18 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
import React, { useEffect, useState } from "react";
import { Modal, Form, Select, Input, Radio } from "antd";
import PositionSelector from "@/components/PositionSelector";
import ShopSelect from "@/components/ShopSelect";
import * as API from "@/common/api";
import useInitial from "@/hooks/useInitail";
import { FormInstance } from "antd/es/form/Form";
const FormItem = Form.Item;
interface Props {
form: FormInstance;
}
function AdressSelect(props: Props) {
const {form } = props;
const [hiddern, setHidden] = useState(true); //控制地图选择
const [own, setOwn] = useState(1); //配置控制
const _onChange = (e: any) => {
form.setFieldsValue({
addrslng: undefined,
addrslat: undefined,
});
if (e.target.value === 1) {
setHidden(true);
setOwn(e.target.value);
} else {
setHidden(false);
setOwn(e.target.value);
}
};
const onAd = (e: any) => {
form.setFieldsValue({
addrslng: e.point.lng,
addrslat: e.point.lat,
});
};
return (
<>
<FormItem label="地理位置" rules={[{ required: true, message: "请配置地址" }]}>
<Radio.Group onChange={(e: any) => _onChange(e)} value={own}>
<Radio value={1}>地图配置</Radio>
<Radio value={2}>自定义配置</Radio>
</Radio.Group>
</FormItem>
{hiddern && (
<FormItem name="location" label="地址" rules={[{ required: true, message: "必填" }]}>
<PositionSelector style={{ width: "100%" }} onChange={(e: any) => onAd(e)} />
</FormItem>
)}
<div
style={{
display: "flex",
justifyContent: "space-between",
width: "80%",
marginLeft: "15%",
}}
>
<FormItem name="longitude" label="经度" style={{ width: "45%" }} rules={[{ required: true, message: "必填" }]}>
<Input style={{ width: "100%" }} disabled={own === 1} />
</FormItem>
<FormItem name="latitude" label="纬度" style={{ width: "45%" }} rules={[{ required: true, message: "必填" }]}>
<Input style={{ width: "100%" }} disabled={own === 1} />
</FormItem>
</div>
</>
);
}
export default AdressSelect;