使用type="cesium"地图
parent
b61ac2d2e0
commit
722c4771e6
|
|
@ -85,7 +85,7 @@ function Add(props) {
|
|||
const deviceList = data.devices.map((item, index) => ({ ...item, key: item.id || index }));
|
||||
setDevices(deviceList);
|
||||
// 同步设置Form的设备数据
|
||||
form.setFieldValue('devicesForm', deviceList.map(d => ({
|
||||
form.setFieldValue("devicesForm", deviceList.map(d => ({
|
||||
deviceName: d.deviceName,
|
||||
deviceModel: d.deviceModel,
|
||||
deviceQty: d.deviceQty,
|
||||
|
|
@ -101,7 +101,7 @@ function Add(props) {
|
|||
const personList = data.persons.map((item, index) => ({ ...item, key: item.id || index }));
|
||||
setPersons(personList);
|
||||
// 同步设置Form的人员数据
|
||||
form.setFieldValue('personsForm', personList.map(p => ({
|
||||
form.setFieldValue("personsForm", personList.map(p => ({
|
||||
personName: p.personName,
|
||||
personPhone: p.personPhone,
|
||||
dutyDesc: p.dutyDesc,
|
||||
|
|
@ -141,8 +141,8 @@ function Add(props) {
|
|||
const newDevices = [...devices, createEmptyDevice()];
|
||||
setDevices(newDevices);
|
||||
// 同步更新Form
|
||||
const formDevices = form.getFieldValue('devicesForm') || [];
|
||||
form.setFieldValue('devicesForm', [...formDevices, { deviceName: '', deviceModel: '', deviceQty: undefined, deviceLocation: '' }]);
|
||||
const formDevices = form.getFieldValue("devicesForm") || [];
|
||||
form.setFieldValue("devicesForm", [...formDevices, { deviceName: "", deviceModel: "", deviceQty: undefined, deviceLocation: "" }]);
|
||||
};
|
||||
|
||||
const removeDevice = (key) => {
|
||||
|
|
@ -154,9 +154,9 @@ function Add(props) {
|
|||
const newDevices = devices.filter(item => item.key !== key);
|
||||
setDevices(newDevices);
|
||||
// 同步更新Form
|
||||
const formDevices = form.getFieldValue('devicesForm') || [];
|
||||
const formDevices = form.getFieldValue("devicesForm") || [];
|
||||
formDevices.splice(index, 1);
|
||||
form.setFieldValue('devicesForm', [...formDevices]);
|
||||
form.setFieldValue("devicesForm", [...formDevices]);
|
||||
};
|
||||
|
||||
const updateDevice = (key, field, value) => {
|
||||
|
|
@ -165,7 +165,7 @@ function Add(props) {
|
|||
devices.map(item => (item.key === key ? { ...item, [field]: value } : item)),
|
||||
);
|
||||
// 同步更新Form并触发校验
|
||||
form.setFieldValue(['devicesForm', index, field], value);
|
||||
form.setFieldValue(["devicesForm", index, field], value);
|
||||
};
|
||||
|
||||
// 人员相关操作
|
||||
|
|
@ -173,8 +173,8 @@ function Add(props) {
|
|||
const newPersons = [...persons, createEmptyPerson()];
|
||||
setPersons(newPersons);
|
||||
// 同步更新Form
|
||||
const formPersons = form.getFieldValue('personsForm') || [];
|
||||
form.setFieldValue('personsForm', [...formPersons, { personName: '', personPhone: '', dutyDesc: '' }]);
|
||||
const formPersons = form.getFieldValue("personsForm") || [];
|
||||
form.setFieldValue("personsForm", [...formPersons, { personName: "", personPhone: "", dutyDesc: "" }]);
|
||||
};
|
||||
|
||||
const removePerson = (key) => {
|
||||
|
|
@ -186,9 +186,9 @@ function Add(props) {
|
|||
const newPersons = persons.filter(item => item.key !== key);
|
||||
setPersons(newPersons);
|
||||
// 同步更新Form
|
||||
const formPersons = form.getFieldValue('personsForm') || [];
|
||||
const formPersons = form.getFieldValue("personsForm") || [];
|
||||
formPersons.splice(index, 1);
|
||||
form.setFieldValue('personsForm', [...formPersons]);
|
||||
form.setFieldValue("personsForm", [...formPersons]);
|
||||
};
|
||||
|
||||
const updatePerson = (key, field, value) => {
|
||||
|
|
@ -197,7 +197,7 @@ function Add(props) {
|
|||
persons.map(item => (item.key === key ? { ...item, [field]: value } : item)),
|
||||
);
|
||||
// 同步更新Form并触发校验
|
||||
form.setFieldValue(['personsForm', index, field], value);
|
||||
form.setFieldValue(["personsForm", index, field], value);
|
||||
};
|
||||
|
||||
const onFinish = async (values) => {
|
||||
|
|
@ -299,7 +299,7 @@ function Add(props) {
|
|||
wrapperCol={{ span: 18 }}
|
||||
onFinish={onFinish}
|
||||
>
|
||||
<Card title="基本信息" bordered={false} style={{ boxShadow: 'none' }}>
|
||||
<Card title="基本信息" bordered={false} style={{ boxShadow: "none" }}>
|
||||
{/* 添加隐藏字段保存 roomId */}
|
||||
<Form.Item name="roomId" hidden>
|
||||
<Input />
|
||||
|
|
@ -359,9 +359,9 @@ function Add(props) {
|
|||
<Input
|
||||
placeholder="请输入负责人手机号"
|
||||
maxLength={11}
|
||||
onChange={e => {
|
||||
const value = e.target.value.replace(/\D/g, '');
|
||||
form.setFieldValue('principalPhone', value);
|
||||
onChange={(e) => {
|
||||
const value = e.target.value.replace(/\D/g, "");
|
||||
form.setFieldValue("principalPhone", value);
|
||||
}}
|
||||
/>
|
||||
</Form.Item>
|
||||
|
|
@ -435,7 +435,7 @@ function Add(props) {
|
|||
|
||||
<Card
|
||||
title="设备信息"
|
||||
style={{ marginTop: 24, boxShadow: 'none' }}
|
||||
style={{ marginTop: 24, boxShadow: "none" }}
|
||||
bordered={false}
|
||||
extra={(
|
||||
<Button type="primary" onClick={addDevice}>
|
||||
|
|
@ -449,7 +449,7 @@ function Add(props) {
|
|||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="设备名称"
|
||||
name={['devicesForm', index, 'deviceName']}
|
||||
name={["devicesForm", index, "deviceName"]}
|
||||
rules={[
|
||||
{ required: true, message: "请输入设备名称" },
|
||||
{ max: 50, message: "设备名称不能超过50个字符" },
|
||||
|
|
@ -464,7 +464,7 @@ function Add(props) {
|
|||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="设备型号"
|
||||
name={['devicesForm', index, 'deviceModel']}
|
||||
name={["devicesForm", index, "deviceModel"]}
|
||||
rules={[
|
||||
{ required: true, message: "请输入设备型号" },
|
||||
{ max: 50, message: "设备型号不能超过50个字符" },
|
||||
|
|
@ -481,7 +481,7 @@ function Add(props) {
|
|||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="设备数量"
|
||||
name={['devicesForm', index, 'deviceQty']}
|
||||
name={["devicesForm", index, "deviceQty"]}
|
||||
rules={[{ required: true, message: "请输入设备数量" }]}
|
||||
>
|
||||
<InputNumber
|
||||
|
|
@ -500,7 +500,7 @@ function Add(props) {
|
|||
<div style={{ display: "flex", alignItems: "center", gap: 8, width: "100%" }}>
|
||||
<div style={{ flex: 1 }}>
|
||||
<Form.Item
|
||||
name={['devicesForm', index, 'deviceLocation']}
|
||||
name={["devicesForm", index, "deviceLocation"]}
|
||||
rules={[
|
||||
{ required: true, message: "请输入设备位置" },
|
||||
{ max: 50, message: "设备位置不能超过50个字符" },
|
||||
|
|
@ -528,7 +528,7 @@ function Add(props) {
|
|||
|
||||
<Card
|
||||
title="人员信息"
|
||||
style={{ marginTop: 24, boxShadow: 'none' }}
|
||||
style={{ marginTop: 24, boxShadow: "none" }}
|
||||
bordered={false}
|
||||
extra={(
|
||||
<Button type="primary" onClick={addPerson}>
|
||||
|
|
@ -542,7 +542,7 @@ function Add(props) {
|
|||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="人员姓名"
|
||||
name={['personsForm', index, 'personName']}
|
||||
name={["personsForm", index, "personName"]}
|
||||
rules={[
|
||||
{ required: true, message: "请输入人员姓名" },
|
||||
{ max: 50, message: "人员姓名不能超过50个字符" },
|
||||
|
|
@ -557,7 +557,7 @@ function Add(props) {
|
|||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="人员手机号"
|
||||
name={['personsForm', index, 'personPhone']}
|
||||
name={["personsForm", index, "personPhone"]}
|
||||
rules={[
|
||||
{ required: true, message: "请输入人员手机号" },
|
||||
{ validator: validatePhone },
|
||||
|
|
@ -566,10 +566,10 @@ function Add(props) {
|
|||
<Input
|
||||
placeholder="请输入人员手机号"
|
||||
maxLength={11}
|
||||
onChange={e => {
|
||||
const value = e.target.value.replace(/\D/g, '');
|
||||
onChange={(e) => {
|
||||
const value = e.target.value.replace(/\D/g, "");
|
||||
updatePerson(person.key, "personPhone", value);
|
||||
form.setFieldValue(['personsForm', index, 'personPhone'], value);
|
||||
form.setFieldValue(["personsForm", index, "personPhone"], value);
|
||||
}}
|
||||
/>
|
||||
</Form.Item>
|
||||
|
|
@ -579,7 +579,7 @@ function Add(props) {
|
|||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="人员值班情况"
|
||||
name={['personsForm', index, 'dutyDesc']}
|
||||
name={["personsForm", index, "dutyDesc"]}
|
||||
rules={[
|
||||
{ required: true, message: "请输入人员值班情况" },
|
||||
{ max: 50, message: "人员值班情况不能超过50个字符" },
|
||||
|
|
@ -592,7 +592,7 @@ function Add(props) {
|
|||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<div style={{ textAlign: 'right', paddingTop: 30 }}>
|
||||
<div style={{ textAlign: "right", paddingTop: 30 }}>
|
||||
{index !== 0 && (
|
||||
<Button type="primary" danger onClick={() => removePerson(person.key)}>
|
||||
删除
|
||||
|
|
@ -613,6 +613,7 @@ function Add(props) {
|
|||
longitude={mapLng}
|
||||
latitude={mapLat}
|
||||
onConfirm={handleMapConfirm}
|
||||
type="cesium"
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@ function Add(props) {
|
|||
const deviceList = data.devices.map((item, index) => ({ ...item, key: item.id || index }));
|
||||
setDeviceList(deviceList);
|
||||
// 同步设置Form的设备数据
|
||||
form.setFieldValue('devicesForm', deviceList.map(d => ({
|
||||
form.setFieldValue("devicesForm", deviceList.map(d => ({
|
||||
deviceCode: d.deviceCode,
|
||||
deviceName: d.deviceName,
|
||||
deviceCategory: d.deviceCategory,
|
||||
|
|
@ -82,7 +82,8 @@ function Add(props) {
|
|||
deviceLocation: d.deviceLocation,
|
||||
paramsSpec: d.paramsSpec,
|
||||
})));
|
||||
} else {
|
||||
}
|
||||
else {
|
||||
setDeviceList([createEmptyDevice()]);
|
||||
}
|
||||
}
|
||||
|
|
@ -134,8 +135,8 @@ function Add(props) {
|
|||
|
||||
// 过滤掉空的设备信息
|
||||
const validDevices = devices.filter(
|
||||
device => device.deviceCode || device.deviceName || device.deviceCategory ||
|
||||
device.chargeUnit || device.deviceLocation || device.paramsSpec,
|
||||
device => device.deviceCode || device.deviceName || device.deviceCategory
|
||||
|| device.chargeUnit || device.deviceLocation || device.paramsSpec,
|
||||
);
|
||||
|
||||
if (validDevices.length === 0) {
|
||||
|
|
@ -177,14 +178,14 @@ function Add(props) {
|
|||
const newDevices = [...devices, createEmptyDevice()];
|
||||
setDeviceList(newDevices);
|
||||
// 同步更新Form
|
||||
const formDevices = form.getFieldValue('devicesForm') || [];
|
||||
form.setFieldValue('devicesForm', [...formDevices, {
|
||||
deviceCode: '',
|
||||
deviceName: '',
|
||||
deviceCategory: '',
|
||||
chargeUnit: '',
|
||||
deviceLocation: '',
|
||||
paramsSpec: ''
|
||||
const formDevices = form.getFieldValue("devicesForm") || [];
|
||||
form.setFieldValue("devicesForm", [...formDevices, {
|
||||
deviceCode: "",
|
||||
deviceName: "",
|
||||
deviceCategory: "",
|
||||
chargeUnit: "",
|
||||
deviceLocation: "",
|
||||
paramsSpec: "",
|
||||
}]);
|
||||
};
|
||||
|
||||
|
|
@ -197,9 +198,9 @@ function Add(props) {
|
|||
const newDevices = devices.filter(item => item.key !== key);
|
||||
setDeviceList(newDevices);
|
||||
// 同步更新Form
|
||||
const formDevices = form.getFieldValue('devicesForm') || [];
|
||||
const formDevices = form.getFieldValue("devicesForm") || [];
|
||||
formDevices.splice(index, 1);
|
||||
form.setFieldValue('devicesForm', [...formDevices]);
|
||||
form.setFieldValue("devicesForm", [...formDevices]);
|
||||
};
|
||||
|
||||
const updateDevice = (key, field, value) => {
|
||||
|
|
@ -208,7 +209,7 @@ function Add(props) {
|
|||
devices.map(item => (item.key === key ? { ...item, [field]: value } : item)),
|
||||
);
|
||||
// 同步更新Form并触发校验
|
||||
form.setFieldValue(['devicesForm', index, field], value);
|
||||
form.setFieldValue(["devicesForm", index, field], value);
|
||||
};
|
||||
|
||||
return (
|
||||
|
|
@ -233,7 +234,7 @@ function Add(props) {
|
|||
wrapperCol={{ span: 18 }}
|
||||
onFinish={onFinish}
|
||||
>
|
||||
<Card title="基本信息" bordered={false} style={{ boxShadow: 'none' }}>
|
||||
<Card title="基本信息" bordered={false} style={{ boxShadow: "none" }}>
|
||||
<Form.Item name="pumpRoomId" hidden>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
|
|
@ -292,9 +293,9 @@ function Add(props) {
|
|||
<Input
|
||||
placeholder="请输入负责人手机号"
|
||||
maxLength={11}
|
||||
onChange={e => {
|
||||
const value = e.target.value.replace(/\D/g, '');
|
||||
form.setFieldValue('principalPhone', value);
|
||||
onChange={(e) => {
|
||||
const value = e.target.value.replace(/\D/g, "");
|
||||
form.setFieldValue("principalPhone", value);
|
||||
}}
|
||||
/>
|
||||
</Form.Item>
|
||||
|
|
@ -372,7 +373,7 @@ function Add(props) {
|
|||
新增
|
||||
</Button>
|
||||
)}
|
||||
style={{ marginTop: 24, boxShadow: 'none' }}
|
||||
style={{ marginTop: 24, boxShadow: "none" }}
|
||||
bordered={false}
|
||||
>
|
||||
{devices.map((device, index) => (
|
||||
|
|
@ -381,7 +382,7 @@ function Add(props) {
|
|||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="设备编号"
|
||||
name={['devicesForm', index, 'deviceCode']}
|
||||
name={["devicesForm", index, "deviceCode"]}
|
||||
rules={[
|
||||
{ required: true, message: "请输入设备编号" },
|
||||
{ max: 50, message: "设备编号不能超过50个字符" },
|
||||
|
|
@ -396,7 +397,7 @@ function Add(props) {
|
|||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="设备名称"
|
||||
name={['devicesForm', index, 'deviceName']}
|
||||
name={["devicesForm", index, "deviceName"]}
|
||||
rules={[
|
||||
{ required: true, message: "请输入设备名称" },
|
||||
{ max: 50, message: "设备名称不能超过50个字符" },
|
||||
|
|
@ -413,7 +414,7 @@ function Add(props) {
|
|||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="设备分类"
|
||||
name={['devicesForm', index, 'deviceCategory']}
|
||||
name={["devicesForm", index, "deviceCategory"]}
|
||||
rules={[
|
||||
{ required: true, message: "请输入设备分类" },
|
||||
{ max: 50, message: "设备分类不能超过50个字符" },
|
||||
|
|
@ -428,7 +429,7 @@ function Add(props) {
|
|||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="负责单位"
|
||||
name={['devicesForm', index, 'chargeUnit']}
|
||||
name={["devicesForm", index, "chargeUnit"]}
|
||||
rules={[
|
||||
{ required: true, message: "请输入负责单位" },
|
||||
{ max: 50, message: "负责单位不能超过50个字符" },
|
||||
|
|
@ -445,7 +446,7 @@ function Add(props) {
|
|||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="具体位置"
|
||||
name={['devicesForm', index, 'deviceLocation']}
|
||||
name={["devicesForm", index, "deviceLocation"]}
|
||||
rules={[
|
||||
{ required: true, message: "请输入具体位置" },
|
||||
{ max: 50, message: "具体位置不能超过50个字符" },
|
||||
|
|
@ -465,7 +466,7 @@ function Add(props) {
|
|||
<div style={{ display: "flex", alignItems: "center", gap: 8, width: "100%" }}>
|
||||
<div style={{ flex: 1 }}>
|
||||
<Form.Item
|
||||
name={['devicesForm', index, 'paramsSpec']}
|
||||
name={["devicesForm", index, "paramsSpec"]}
|
||||
rules={[
|
||||
{ required: true, message: "请输入设备参数和规格" },
|
||||
{ max: 50, message: "设备参数和规格不能超过50个字符" },
|
||||
|
|
@ -503,6 +504,7 @@ function Add(props) {
|
|||
longitude={mapLng}
|
||||
latitude={mapLat}
|
||||
onConfirm={handleMapConfirm}
|
||||
type="cesium"
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -88,7 +88,7 @@ function Add(props) {
|
|||
wrapperCol={{ span: 18 }}
|
||||
onFinish={onFinish}
|
||||
>
|
||||
<Card title="基本信息" bordered={false} style={{ boxShadow: 'none' }}>
|
||||
<Card title="基本信息" bordered={false} style={{ boxShadow: "none" }}>
|
||||
<Row gutter={24}>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
|
|
@ -290,6 +290,7 @@ function Add(props) {
|
|||
longitude={mapLng}
|
||||
latitude={mapLat}
|
||||
onConfirm={handleMapConfirm}
|
||||
type="cesium"
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
|
|
|
|||
Loading…
Reference in New Issue