Commit bf3c4533 authored by 皮倩雯's avatar 皮倩雯

fix: '修改新增节点辅助视图交互'

parent 722a0c30
Pipeline #65596 passed with stages
import React, { useEffect } from 'react'; import React, { useEffect, useState } from 'react';
import { Modal, Form, Button, Input, Space } from 'antd'; import { Modal, Form, Button, Input, Space, Select, Switch, Radio } from 'antd';
import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons'; import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
import { LoadLedgers } from '@/services/tablemanager/tablemanager';
const ParmarModal = props => { const ParmarModal = props => {
const { pageUrl, visible, handleCancel, parmarCallBack } = props; const { pageUrl, visible, handleCancel, parmarCallBack } = props;
const [form] = Form.useForm(); const [form] = Form.useForm();
const [keepStandingBook, setKeepStandingBook] = useState([]);
const [visibleChecked, setVisibleChecked] = useState(true);
const [shineFieldsData, setShineFieldsData] = useState(['事件编号', '工单编号', 'GIS编号']);
const { Option } = Select;
useEffect(() => { useEffect(() => {
if (visible) { if (visible) {
LoadLedgers().then(res => {
if (res.code === 0) {
let data = [];
res.data.root.map(i => {
data.push(i.name);
});
setKeepStandingBook(res.data.root);
}
});
// 给url通过字符串分割成表单需要的数据形式 // 给url通过字符串分割成表单需要的数据形式
console.log(pageUrl); console.log(pageUrl);
if (pageUrl) { if (pageUrl) {
if (pageUrl.indexOf('[') !== -1) { if (pageUrl.indexOf('[') !== -1) {
form.setFieldsValue({ parmars: JSON.parse(pageUrl) }); let data = JSON.parse(pageUrl);
console.log(data.shineFields);
console.log(data.shineFields.formField);
form.setFieldsValue({
accountName: data.accountName,
editable: data.editable,
shineFields: data.shineFields[0].formField,
});
} }
} }
} else { } else {
...@@ -23,21 +45,28 @@ const ParmarModal = props => { ...@@ -23,21 +45,28 @@ const ParmarModal = props => {
const onFinish = () => { const onFinish = () => {
form.validateFields().then(validate => { form.validateFields().then(validate => {
if (validate) { if (validate) {
let parma = form.getFieldsValue().parmars; let obj = form.getFieldsValue();
console.log(parma, 'parma'); // let parma = obj.parmars;
if (parma) { let data = {};
parmarCallBack(JSON.stringify(parma)); data.accountName = obj.accountName;
} else { data.editable = visibleChecked;
parmarCallBack(); data.shineFields = [{ formField: obj.shineFields, toField: obj.shineFields }];
} // data.shineFields = parma;
parmarCallBack(JSON.stringify(data));
} }
}); });
}; };
const change = e => {
setVisibleChecked(e);
};
return ( return (
<div> <div>
<Modal <Modal
title="参数配置" title="参数配置"
visible={visible} visible={visible}
width="500px"
onOk={onFinish} onOk={onFinish}
onCancel={handleCancel} onCancel={handleCancel}
maskClosable={false} maskClosable={false}
...@@ -45,70 +74,104 @@ const ParmarModal = props => { ...@@ -45,70 +74,104 @@ const ParmarModal = props => {
centered centered
> >
<div style={{ maxHeight: '400px', overflowY: 'scroll', marginBottom: '10px' }}> <div style={{ maxHeight: '400px', overflowY: 'scroll', marginBottom: '10px' }}>
<Form name="form" form={form} labelCol={{ span: 7 }}> <Form name="form" form={form} labelCol={{ span: 4 }}>
<Form.List name="parmars"> <Form.Item
{(fields, { add, remove }) => ( label="台账名"
<> name="accountName"
{fields.map(({ key, name, fieldKey, ...restField }) => ( rules={[{ required: true, message: '请选择台账名' }]}
<Space >
key={key} <Select placeholder="请选择台账名" showSearch>
style={{ display: 'flex', marginBottom: '5px', justifyContent: 'center' }} {keepStandingBook
align="baseline" ? keepStandingBook.map((item, index) => (
> <Option key={index} value={item.name}>
<Form.Item {item.name}
{...restField} </Option>
style={{ marginBottom: '5px' }} ))
name={[name, 'webParamKey']} : ''}
fieldKey={[fieldKey, 'key']} </Select>
validateTrigger={['onChange', 'onBlur']} </Form.Item>
rules={[ <Form.Item label="可编辑" name="editable">
{ required: true, message: '请填写参数名' }, <Switch
{ checkedChildren="是"
validator: () => { unCheckedChildren="否"
// 验证参数名不能重复 checked={visibleChecked}
const allKey = form onChange={change}
.getFieldsValue() />
.parmars.map(item => (item ? item.webParamKey : '')); </Form.Item>
const repeatKey = new Set(allKey); <Form.Item label="映射字段" name="shineFields">
if (repeatKey.size !== allKey.length) { <Select placeholder="请选择映射字段" showSearch>
return Promise.reject(new Error('参数名重复')); {shineFieldsData.map((item, index) => (
} <Option key={index} value={item}>
return Promise.resolve(); {item}
}, </Option>
}, ))}
]} </Select>
{/* <Form.List name="parmars">
{(fields, { add, remove }) => (
<>
{fields.map(({ key, name, fieldKey, ...restField }) => (
<Space
key={key}
style={{ display: 'flex', marginBottom: '5px', justifyContent: 'center' }}
align="baseline"
> >
<Input placeholder="请填写参数名" /> <Form.Item
</Form.Item> {...restField}
<Form.Item style={{ marginBottom: '5px' }}
{...restField} name={[name, 'formField']}
style={{ marginBottom: '5px' }} fieldKey={[fieldKey, 'key']}
name={[name, 'webParamValue']} validateTrigger={['onChange', 'onBlur']}
fieldKey={[fieldKey, 'value']} rules={[
rules={[{ required: true, message: '请填写参数' }]} { required: true, message: '请选择字段名' },
{
validator: () => {
// 验证参数名不能重复
const allKey = form
.getFieldsValue()
.parmars.map(item => (item ? item.formField : ''));
const repeatKey = new Set(allKey);
if (repeatKey.size !== allKey.length) {
return Promise.reject(new Error('参数名重复'));
}
return Promise.resolve();
},
},
]}
>
<Input placeholder="请选择字段名" />
</Form.Item>
<Form.Item
{...restField}
style={{ marginBottom: '5px' }}
name={[name, 'toField']}
fieldKey={[fieldKey, 'value']}
rules={[{ required: true, message: '请选择映射字段名' }]}
>
<Input placeholder="请选择映射字段名" />
</Form.Item>
<MinusCircleOutlined
onClick={() => remove(name)}
style={{ marginLeft: '10px', fontSize: '20px' }}
/>
</Space>
))}
<Form.Item>
<Button
style={{ width: '372px' }}
type="dashed"
onClick={() => add()}
block
icon={<PlusOutlined />}
> >
<Input placeholder="请填写参数" /> 添加参数
</Form.Item> </Button>
<MinusCircleOutlined </Form.Item>
onClick={() => remove(name)} </>
style={{ marginLeft: '10px', fontSize: '20px' }} )}
/> </Form.List> */}
</Space> </Form.Item>
))}
<Form.Item>
<Button
style={{ width: '375px', marginLeft: '30px' }}
type="dashed"
onClick={() => add()}
block
icon={<PlusOutlined />}
>
添加参数
</Button>
</Form.Item>
</>
)}
</Form.List>
</Form> </Form>
</div> </div>
</Modal> </Modal>
......
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