Commit 48a09804 authored by 邓超's avatar 邓超

fix: 优化外部字段展示,web配置添加动态添加参数模块,重构台账管理台账配置界面

parent 6de1043a
Pipeline #41966 passed with stages
in 8 minutes 10 seconds
...@@ -6,18 +6,12 @@ import styles from './ItemCard.less'; ...@@ -6,18 +6,12 @@ import styles from './ItemCard.less';
const tip = 'loading...'; const tip = 'loading...';
export const getId = item => export const getId = item => item.userID || item.roleID || item.stationID || item.id;
item.userID || item.roleID || item.stationID || item.id;
export const checkIsGroup = node => export const checkIsGroup = node =>
['widgetGroup'].includes(node?.type || node) && node.children?.length > 0; ['widgetGroup'].includes(node?.type || node) && node.children?.length > 0;
// 递归遍历节点的方法 // 递归遍历节点的方法
export const checkChildrenByCondition = ( export const checkChildrenByCondition = (item, fn, withGroup = true, method = 'every') => {
item,
fn,
withGroup = true,
method = 'every',
) => {
if (!checkIsGroup(item)) { if (!checkIsGroup(item)) {
return fn(item); return fn(item);
} }
...@@ -75,8 +69,7 @@ const ListCard = props => { ...@@ -75,8 +69,7 @@ const ListCard = props => {
const getAllID = item => { const getAllID = item => {
let result = []; let result = [];
const haveChildren = const haveChildren = Array.isArray(item.children) && item.children.length > 0;
Array.isArray(item.children) && item.children.length > 0;
// 统一使用 getId // 统一使用 getId
result.push(getId(item)); result.push(getId(item));
if (haveChildren) { if (haveChildren) {
......
...@@ -30,8 +30,7 @@ const DraggableBodyRow = ({ ...@@ -30,8 +30,7 @@ const DraggableBodyRow = ({
return { return {
isOver: monitor.isOver(), isOver: monitor.isOver(),
canDrop: monitor.canDrop(), canDrop: monitor.canDrop(),
dropClassName: dropClassName: dragIndex < index ? 'drop-over-downward' : 'drop-over-upward',
dragIndex < index ? 'drop-over-downward' : 'drop-over-upward',
}; };
}, },
drop: item => { drop: item => {
......
...@@ -37,11 +37,7 @@ const PictureWallProvider = props => { ...@@ -37,11 +37,7 @@ const PictureWallProvider = props => {
useEffect(() => { useEffect(() => {
update(); update();
}, []); }, []);
return ( return <UploadContext.Provider value={{ imgBed, update }}>{children}</UploadContext.Provider>;
<UploadContext.Provider value={{ imgBed, update }}>
{children}
</UploadContext.Provider>
);
}; };
export { UploadContext as default, PictureWallProvider }; export { UploadContext as default, PictureWallProvider };
...@@ -442,7 +442,7 @@ class PicturesWall extends React.Component<PicturesWallType> { ...@@ -442,7 +442,7 @@ class PicturesWall extends React.Component<PicturesWallType> {
onOk={this.handleModalOk} onOk={this.handleModalOk}
className={styles.modal} className={styles.modal}
> >
<Search onSearch={onSearch} /> {/* <Search onSearch={onSearch} /> */}
<Tabs defaultActiveKey={imgBed[0]?.moduleName} tabPosition="left" style={{ height: 520 }}> <Tabs defaultActiveKey={imgBed[0]?.moduleName} tabPosition="left" style={{ height: 520 }}>
{imgBed.map((item, i) => { {imgBed.map((item, i) => {
if (item.moduleName == picType || item.moduleName == 'CityTemp') { if (item.moduleName == picType || item.moduleName == 'CityTemp') {
......
import React, { useEffect } from 'react';
import { Modal, Form, Button, Input, Space } from 'antd';
import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
const ParmarModal = props => {
const { pageUrl, visible, handleCancel, parmarCallBack } = props;
const [form] = Form.useForm();
useEffect(() => {
if (visible) {
// 给url通过字符串分割成表单需要的数据形式
console.log(pageUrl, 'pageUrl');
let parma = pageUrl
.split('?')[1]
?.split('&')
?.map(item => ({ key: item.split('=')[0], value: item.split('=')[1] }));
form.setFieldsValue({ parmars: parma });
} else {
// 关闭弹窗清除表单数据
form.resetFields();
}
}, [visible]);
// 保存
const onFinish = () => {
form.validateFields().then(validate => {
if (validate) {
let parma = form
.getFieldValue('parmars')
.map(item => `${item.key}=${item.value}`)
.join('&');
console.log(parma, 'parma');
parmarCallBack(`${pageUrl.split('?')[0]}?${parma}`);
}
});
};
return (
<div>
<Modal
title="参数配置"
visible={visible}
onOk={onFinish}
onCancel={handleCancel}
maskClosable={false}
destroyOnClose
centered
>
<div style={{ maxHeight: '400px', overflowY: 'scroll', marginBottom: '10px' }}>
<Form name="form" form={form} labelCol={{ span: 7 }}>
<Form.List name="parmars">
{(fields, { add, remove }) => (
<>
{fields.map(({ key, name, fieldKey, ...restField }) => (
<Space
key={key}
style={{ display: 'flex', marginBottom: 8, justifyContent: 'center' }}
align="baseline"
>
<Form.Item
{...restField}
name={[name, 'key']}
fieldKey={[fieldKey, 'key']}
validateTrigger={['onChange', 'onBlur']}
rules={[
{ required: true, message: '请填写参数名' },
{
validator: () => {
// 验证参数名不能重复
const allKey = form
.getFieldsValue()
.parmars.map(item => (item ? item.key : ''));
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}
name={[name, 'value']}
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: '375px', marginLeft: '30px' }}
type="dashed"
onClick={() => add()}
block
icon={<PlusOutlined />}
>
添加参数
</Button>
</Form.Item>
</>
)}
</Form.List>
</Form>
</div>
</Modal>
</div>
);
};
export default ParmarModal;
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Form, Input, Button, Row, Col } from 'antd'; import { Form, Input, Button, Row, Col, notification } from 'antd';
import classnames from 'classnames'; import classnames from 'classnames';
import styles from './addForm.less'; import styles from './addForm.less';
import PicturesWall from '@/components/Upload/index'; import PicturesWall from '@/components/Upload/index';
import ParmarModal from './ParmarModal';
import CheckList from './checkBox'; import CheckList from './checkBox';
const { Item } = Form; const { Item } = Form;
...@@ -10,6 +11,7 @@ const EditForm = props => { ...@@ -10,6 +11,7 @@ const EditForm = props => {
const { submitCallback, nodeType, info, valueCallback = () => {} } = props; const { submitCallback, nodeType, info, valueCallback = () => {} } = props;
const [form] = Form.useForm(); const [form] = Form.useForm();
const [otherForm] = Form.useForm(); const [otherForm] = Form.useForm();
const [showParmarModal, setShowParmarModal] = useState(false);
const layout = { const layout = {
layout: 'horizontal', layout: 'horizontal',
labelCol: { span: 2, offset: 0 }, labelCol: { span: 2, offset: 0 },
...@@ -57,6 +59,15 @@ const EditForm = props => { ...@@ -57,6 +59,15 @@ const EditForm = props => {
const onFinish = () => { const onFinish = () => {
submit(); submit();
}; };
// 添加功能路劲参数
const addParama = () => {
console.log(otherForm.getFieldValue('pageUrl'));
if (!otherForm.getFieldValue('pageUrl')) {
notification.error({ message: '提示', duration: 3, description: '请先填写功能路径' });
return;
}
setShowParmarModal(true);
};
return ( return (
<div className={classnames({ [styles.divbox]: true })}> <div className={classnames({ [styles.divbox]: true })}>
{(nodeType === 1 || nodeType === 2) && ( {(nodeType === 1 || nodeType === 2) && (
...@@ -190,8 +201,8 @@ const EditForm = props => { ...@@ -190,8 +201,8 @@ const EditForm = props => {
</Item> </Item>
)} )}
<Item <Item
label="功能路径"
name="pageUrl" name="pageUrl"
label="功能路径"
rules={[ rules={[
{ {
required: true, required: true,
...@@ -199,7 +210,12 @@ const EditForm = props => { ...@@ -199,7 +210,12 @@ const EditForm = props => {
}, },
]} ]}
> >
<Input /> <div style={{ display: 'flex' }}>
<Item name="pageUrl" style={{ marginBottom: 0, width: '100%' }}>
<Input placeholder="请输入功能路径" />
</Item>
<Button onClick={addParama}>添加参数</Button>
</div>
</Item> </Item>
<Item label="功能参数" name="funParam"> <Item label="功能参数" name="funParam">
<Input /> <Input />
...@@ -216,6 +232,15 @@ const EditForm = props => { ...@@ -216,6 +232,15 @@ const EditForm = props => {
</Item> </Item>
</Form> </Form>
)} )}
<ParmarModal
pageUrl={otherForm.getFieldValue('pageUrl')}
handleCancel={() => setShowParmarModal(false)}
visible={showParmarModal}
parmarCallBack={url => {
otherForm.setFieldsValue({ pageUrl: url });
setShowParmarModal(false);
}}
/>
</div> </div>
); );
}; };
......
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { useHistory } from 'react-router-dom'; import { useHistory } from 'react-router-dom';
import { reloadFlows, removeFlowExtend } from '@/services/platform/flow'; import { reloadFlows, removeFlowExtend } from '@/services/platform/flow';
import { import { Card, Space, Table, Popconfirm, Spin, Tooltip, notification, message, Button } from 'antd';
Card,
Space,
Table,
Popconfirm,
Spin,
Tooltip,
notification,
message,
Button,
} from 'antd';
import { import {
RightOutlined, RightOutlined,
DoubleLeftOutlined, DoubleLeftOutlined,
...@@ -136,9 +126,7 @@ const Flow = () => { ...@@ -136,9 +126,7 @@ const Flow = () => {
dataIndex: 'extendWebPage', dataIndex: 'extendWebPage',
align: 'center', align: 'center',
render: text => ( render: text => (
<span style={{ color: text === '(默认)' ? 'grey' : '000000D9' }}> <span style={{ color: text === '(默认)' ? 'grey' : '000000D9' }}>{text}</span>
{text}
</span>
), ),
}, },
{ {
...@@ -146,9 +134,7 @@ const Flow = () => { ...@@ -146,9 +134,7 @@ const Flow = () => {
dataIndex: 'extendMobilePage', dataIndex: 'extendMobilePage',
align: 'center', align: 'center',
render: text => ( render: text => (
<span style={{ color: text === '(默认)' ? 'grey' : '000000D9' }}> <span style={{ color: text === '(默认)' ? 'grey' : '000000D9' }}>{text}</span>
{text}
</span>
), ),
}, },
{ {
...@@ -156,20 +142,14 @@ const Flow = () => { ...@@ -156,20 +142,14 @@ const Flow = () => {
dataIndex: 'extendPageCount', dataIndex: 'extendPageCount',
align: 'center', align: 'center',
width: 80, width: 80,
render: text => ( render: text => <span style={{ color: text === '(无)' ? 'grey' : '000000D9' }}>{text}</span>,
<span style={{ color: text === '(无)' ? 'grey' : '000000D9' }}>
{text}
</span>
),
}, },
{ {
title: '流程结束后', title: '流程结束后',
dataIndex: 'flowEndBehavior', dataIndex: 'flowEndBehavior',
align: 'center', align: 'center',
render: text => ( render: text => (
<span style={{ color: text === '(不做处理)' ? 'grey' : '000000D9' }}> <span style={{ color: text === '(不做处理)' ? 'grey' : '000000D9' }}>{text}</span>
{text}
</span>
), ),
}, },
{ {
...@@ -182,19 +162,13 @@ const Flow = () => { ...@@ -182,19 +162,13 @@ const Flow = () => {
title: '异常节点', title: '异常节点',
dataIndex: 'errorNodes', dataIndex: 'errorNodes',
align: 'center', align: 'center',
render: text => ( render: text => <span style={{ color: text === '(无)' ? 'grey' : 'red' }}>{text}</span>,
<span style={{ color: text === '(无)' ? 'grey' : 'red' }}>{text}</span>
),
}, },
{ {
title: '接口配置', title: '接口配置',
dataIndex: 'interfaceConfig', dataIndex: 'interfaceConfig',
align: 'center', align: 'center',
render: text => ( render: text => <span style={{ color: text === '(无)' ? 'grey' : '000000D9' }}>{text}</span>,
<span style={{ color: text === '(无)' ? 'grey' : '000000D9' }}>
{text}
</span>
),
}, },
{ {
title: '操作', title: '操作',
...@@ -235,9 +209,7 @@ const Flow = () => { ...@@ -235,9 +209,7 @@ const Flow = () => {
okText="是" okText="是"
cancelText="否" cancelText="否"
> >
<DeleteOutlined <DeleteOutlined style={{ fontSize: '16px', color: '#e86060' }} />
style={{ fontSize: '16px', color: '#e86060' }}
/>
</Popconfirm> </Popconfirm>
</Tooltip> </Tooltip>
</Space> </Space>
...@@ -260,9 +232,7 @@ const Flow = () => { ...@@ -260,9 +232,7 @@ const Flow = () => {
<span className={styles.processTitle}>流程列表</span> <span className={styles.processTitle}>流程列表</span>
<hr className={styles.splitLine} /> <hr className={styles.splitLine} />
{/* 流程列表 */} {/* 流程列表 */}
<div <div style={{ overflowY: 'scroll', height: 'calc(100vh - 150px)' }}>
style={{ overflowY: 'scroll', height: 'calc(100vh - 150px)' }}
>
{processData.length > 0 && {processData.length > 0 &&
processData.map((item, index) => ( processData.map((item, index) => (
<div <div
...@@ -322,8 +292,7 @@ const Flow = () => { ...@@ -322,8 +292,7 @@ const Flow = () => {
}, },
})} })}
pagination={{ pagination={{
showTotal: (total, range) => showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条`,
`第${range[0]}-${range[1]} 条/共 ${total} 条`,
pageSizeOptions: [10, 20, 50, 100], pageSizeOptions: [10, 20, 50, 100],
defaultPageSize: 10, defaultPageSize: 10,
showQuickJumper: true, showQuickJumper: true,
......
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { useHistory } from 'react-router-dom'; import { useHistory } from 'react-router-dom';
import { import { reloadFlowNodes, removeFlowNodeExtend } from '@/services/platform/flow';
reloadFlowNodes, import { Space, Table, Popconfirm, Tooltip, notification, message, Button, Spin } from 'antd';
removeFlowNodeExtend, import { RollbackOutlined, EditTwoTone, ControlOutlined, DeleteOutlined } from '@ant-design/icons';
} from '@/services/platform/flow';
import {
Space,
Table,
Popconfirm,
Tooltip,
notification,
message,
Button,
Spin,
} from 'antd';
import {
RollbackOutlined,
EditTwoTone,
ControlOutlined,
DeleteOutlined,
} from '@ant-design/icons';
import PageContainer from '@/components/BasePageContainer'; import PageContainer from '@/components/BasePageContainer';
import NodeEdit from './flowNodeComponents/NodeEdit'; import NodeEdit from './flowNodeComponents/NodeEdit';
import AuxiliaryView from './flowNodeComponents/AuxiliaryView'; import AuxiliaryView from './flowNodeComponents/AuxiliaryView';
...@@ -135,18 +118,14 @@ const FlowNode = () => { ...@@ -135,18 +118,14 @@ const FlowNode = () => {
dataIndex: 'extendHandover', dataIndex: 'extendHandover',
align: 'center', align: 'center',
width: 80, width: 80,
render: (text, record) => ( render: (text, record) => <span style={{ color: textStyleOne(text, record) }}>{text}</span>,
<span style={{ color: textStyleOne(text, record) }}>{text}</span>
),
}, },
{ {
title: '节点类型', title: '节点类型',
dataIndex: 'extendNodeType', dataIndex: 'extendNodeType',
align: 'center', align: 'center',
width: 80, width: 80,
render: (text, record) => ( render: (text, record) => <span style={{ color: textStyleOne(text, record) }}>{text}</span>,
<span style={{ color: textStyleOne(text, record) }}>{text}</span>
),
}, },
{ {
title: '工单主表', title: '工单主表',
...@@ -168,9 +147,7 @@ const FlowNode = () => { ...@@ -168,9 +147,7 @@ const FlowNode = () => {
align: 'center', align: 'center',
width: 80, width: 80,
render: (text, record) => ( render: (text, record) => (
<span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}> <span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}>{text}</span>
{text}
</span>
), ),
}, },
{ {
...@@ -179,11 +156,17 @@ const FlowNode = () => { ...@@ -179,11 +156,17 @@ const FlowNode = () => {
align: 'center', align: 'center',
width: 80, width: 80,
render: (text, record) => ( render: (text, record) => (
<span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}> <span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}>{text}</span>
{text}
</span>
), ),
}, },
{
title: '外部字段',
dataIndex: 'outFields',
key: 'outFields',
align: 'center',
width: 100,
render: text => <span style={{ color: Number(text) > 0 ? 'red' : '' }}>{text}</span>,
},
{ {
title: '补正', title: '补正',
...@@ -191,9 +174,7 @@ const FlowNode = () => { ...@@ -191,9 +174,7 @@ const FlowNode = () => {
align: 'center', align: 'center',
width: 80, width: 80,
render: (text, record) => ( render: (text, record) => (
<span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}> <span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}>{text}</span>
{text}
</span>
), ),
}, },
{ {
...@@ -202,9 +183,7 @@ const FlowNode = () => { ...@@ -202,9 +183,7 @@ const FlowNode = () => {
align: 'center', align: 'center',
width: 80, width: 80,
render: (text, record) => ( render: (text, record) => (
<span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}> <span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}>{text}</span>
{text}
</span>
), ),
}, },
{ {
...@@ -213,9 +192,7 @@ const FlowNode = () => { ...@@ -213,9 +192,7 @@ const FlowNode = () => {
align: 'center', align: 'center',
width: 80, width: 80,
render: (text, record) => ( render: (text, record) => (
<span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}> <span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}>{text}</span>
{text}
</span>
), ),
}, },
{ {
...@@ -224,9 +201,7 @@ const FlowNode = () => { ...@@ -224,9 +201,7 @@ const FlowNode = () => {
align: 'center', align: 'center',
width: 80, width: 80,
render: (text, record) => ( render: (text, record) => (
<span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}> <span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}>{text}</span>
{text}
</span>
), ),
}, },
{ {
...@@ -235,9 +210,7 @@ const FlowNode = () => { ...@@ -235,9 +210,7 @@ const FlowNode = () => {
align: 'center', align: 'center',
width: 80, width: 80,
render: (text, record) => ( render: (text, record) => (
<span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}> <span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}>{text}</span>
{text}
</span>
), ),
}, },
{ {
...@@ -278,9 +251,7 @@ const FlowNode = () => { ...@@ -278,9 +251,7 @@ const FlowNode = () => {
okText="是" okText="是"
cancelText="否" cancelText="否"
> >
<DeleteOutlined <DeleteOutlined style={{ fontSize: '16px', color: '#e86060' }} />
style={{ fontSize: '16px', color: '#e86060' }}
/>
</Popconfirm> </Popconfirm>
</Tooltip> </Tooltip>
</Space> </Space>
...@@ -359,6 +330,13 @@ const FlowNode = () => { ...@@ -359,6 +330,13 @@ const FlowNode = () => {
align: 'center', align: 'center',
width: 80, width: 80,
}, },
{
title: '外部字段',
dataIndex: 'outFields',
key: 'outFields',
align: 'center',
width: 100,
},
{ {
title: '补正', title: '补正',
align: 'center', align: 'center',
......
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { import { reloadFlowNodeExtendPages, removeFlowNodeExtendPage } from '@/services/platform/flow';
reloadFlowNodeExtendPages,
removeFlowNodeExtendPage,
} from '@/services/platform/flow';
import { import {
Table, Table,
Modal, Modal,
...@@ -168,9 +165,7 @@ const AuxiliaryView = props => { ...@@ -168,9 +165,7 @@ const AuxiliaryView = props => {
okText="是" okText="是"
cancelText="否" cancelText="否"
> >
<DeleteOutlined <DeleteOutlined style={{ fontSize: '16px', color: '#e86060' }} />
style={{ fontSize: '16px', color: '#e86060' }}
/>
</Popconfirm> </Popconfirm>
</Tooltip> </Tooltip>
</Space> </Space>
...@@ -214,8 +209,7 @@ const AuxiliaryView = props => { ...@@ -214,8 +209,7 @@ const AuxiliaryView = props => {
}, },
})} })}
pagination={{ pagination={{
showTotal: (total, range) => showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条`,
`第${range[0]}-${range[1]} 条/共 ${total} 条`,
pageSizeOptions: [10, 20, 50, 100], pageSizeOptions: [10, 20, 50, 100],
defaultPageSize: 10, defaultPageSize: 10,
showQuickJumper: true, showQuickJumper: true,
......
...@@ -19,8 +19,9 @@ import { ...@@ -19,8 +19,9 @@ import {
message, message,
Drawer, Drawer,
Space, Space,
Tooltip,
} from 'antd'; } from 'antd';
import { PlusOutlined } from '@ant-design/icons'; import { PlusOutlined, InfoCircleOutlined } from '@ant-design/icons';
import Fieldselection from './nodeEditComponents/Fieldselection'; import Fieldselection from './nodeEditComponents/Fieldselection';
import styles from '../flowNode.less'; import styles from '../flowNode.less';
const { Option } = Select; const { Option } = Select;
...@@ -37,7 +38,6 @@ const NodeEdit = props => { ...@@ -37,7 +38,6 @@ const NodeEdit = props => {
const [filedData, setFiledData] = useState([]); // 已选字段列表 const [filedData, setFiledData] = useState([]); // 已选字段列表
const [form] = Form.useForm(); const [form] = Form.useForm();
useEffect(() => { useEffect(() => {
form.resetFields();
if (visible) { if (visible) {
// 获取表单回显 // 获取表单回显
getFormData(); getFormData();
...@@ -47,6 +47,8 @@ const NodeEdit = props => { ...@@ -47,6 +47,8 @@ const NodeEdit = props => {
getTableName(); getTableName();
// 获取反馈类型 // 获取反馈类型
getFeedbackName(); getFeedbackName();
} else {
form.resetFields();
} }
}, [visible]); }, [visible]);
// 获取表单回显 // 获取表单回显
...@@ -136,9 +138,7 @@ const NodeEdit = props => { ...@@ -136,9 +138,7 @@ const NodeEdit = props => {
} }
checkList.forEach(element => { checkList.forEach(element => {
// 当前得模块是否有当前字段 // 当前得模块是否有当前字段
let indeterminate = element.plainOptions.some( let indeterminate = element.plainOptions.some(checkName => checkName === item);
checkName => checkName === item,
);
// 处理已选中的字段 // 处理已选中的字段
if (indeterminate) { if (indeterminate) {
element.defaultCheckedList.push(item); element.defaultCheckedList.push(item);
...@@ -152,9 +152,7 @@ const NodeEdit = props => { ...@@ -152,9 +152,7 @@ const NodeEdit = props => {
element.indeterminate = false; element.indeterminate = false;
} }
// 处理是否全选字段 // 处理是否全选字段
if ( if (element.defaultCheckedList.length === element.plainOptions.length) {
element.defaultCheckedList.length === element.plainOptions.length
) {
element.checkAll = true; element.checkAll = true;
} else { } else {
element.checkAll = false; element.checkAll = false;
...@@ -233,6 +231,7 @@ const NodeEdit = props => { ...@@ -233,6 +231,7 @@ const NodeEdit = props => {
title="流程节点配置" title="流程节点配置"
width="500px" width="500px"
onClose={handleCancel} onClose={handleCancel}
destroyOnClose
visible={visible} visible={visible}
footer={ footer={
<Space> <Space>
...@@ -267,11 +266,7 @@ const NodeEdit = props => { ...@@ -267,11 +266,7 @@ const NodeEdit = props => {
<Option value="办理关单">办理关单</Option> <Option value="办理关单">办理关单</Option>
</Select> </Select>
</Form.Item> </Form.Item>
<Form.Item <Form.Item name="EditableLater" valuePropName="checked" style={{ marginBottom: 0 }}>
name="EditableLater"
valuePropName="checked"
style={{ marginBottom: 0 }}
>
<Checkbox>允许补正(事后修改)</Checkbox> <Checkbox>允许补正(事后修改)</Checkbox>
</Form.Item> </Form.Item>
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
...@@ -309,17 +304,13 @@ const NodeEdit = props => { ...@@ -309,17 +304,13 @@ const NodeEdit = props => {
<Option value="移交上报人">移交上报人</Option> <Option value="移交上报人">移交上报人</Option>
</Select> </Select>
</Form.Item> </Form.Item>
<Form.Item label="平级移交" name="Transferable" initialValue="0"> <Form.Item label="平级移交" name="Transferable">
<Radio.Group> <Radio.Group>
<Radio value="0"></Radio> <Radio value="0"></Radio>
<Radio value="1"></Radio> <Radio value="1"></Radio>
</Radio.Group> </Radio.Group>
</Form.Item> </Form.Item>
<Form.Item <Form.Item label="显示事件信息" name="EventsInformation">
label="显示事件信息"
name="EventsInformation"
initialValue="0"
>
<Radio.Group> <Radio.Group>
<Radio value="0"></Radio> <Radio value="0"></Radio>
<Radio value="1"></Radio> <Radio value="1"></Radio>
...@@ -334,7 +325,20 @@ const NodeEdit = props => { ...@@ -334,7 +325,20 @@ const NodeEdit = props => {
))} ))}
</Select> </Select>
</Form.Item> </Form.Item>
<Form.Item label="字段编辑"> <Form.Item
label={
<div className={styles.formData_label}>
{form.getFieldValue('OutFields') > 0 ? (
<Tooltip title={`外部字段${form.getFieldValue('OutFields')}个`}>
<InfoCircleOutlined style={{ color: 'red', padding: '0.2rem 0.2rem 0 0' }} />
</Tooltip>
) : (
''
)}
<span>字段编辑</span>
</div>
}
>
<div className={styles.filedListItem}> <div className={styles.filedListItem}>
<Form.Item name="Fields" style={{ marginBottom: 0, width: '100%' }}> <Form.Item name="Fields" style={{ marginBottom: 0, width: '100%' }}>
<Input placeholder="请选编辑字段" allowClear /> <Input placeholder="请选编辑字段" allowClear />
...@@ -348,12 +352,22 @@ const NodeEdit = props => { ...@@ -348,12 +352,22 @@ const NodeEdit = props => {
/> />
</div> </div>
</Form.Item> </Form.Item>
<Form.Item label="查看字段">
<div className={styles.filedListItem}>
<Form.Item <Form.Item
name="SeeFields" label={
style={{ marginBottom: 0, width: '100%' }} <div className={styles.formData_label}>
{form.getFieldValue('OutSearchFields') > 0 ? (
<Tooltip title={`外部字段${form.getFieldValue('OutSearchFields')}个`}>
<InfoCircleOutlined style={{ color: 'red', padding: '0.2rem 0.2rem 0 0' }} />
</Tooltip>
) : (
''
)}
<span>查看字段</span>
</div>
}
> >
<div className={styles.filedListItem}>
<Form.Item name="SeeFields" style={{ marginBottom: 0, width: '100%' }}>
<Input placeholder="请选择查看字段(工程模型)" allowClear /> <Input placeholder="请选择查看字段(工程模型)" allowClear />
</Form.Item> </Form.Item>
<Button <Button
......
...@@ -105,8 +105,7 @@ const Fieldselection = props => { ...@@ -105,8 +105,7 @@ const Fieldselection = props => {
chooseList[index].defaultCheckedList = list; chooseList[index].defaultCheckedList = list;
chooseList[index].indeterminate = chooseList[index].indeterminate =
!!list.length && list.length < chooseList[index].plainOptions.length; !!list.length && list.length < chooseList[index].plainOptions.length;
chooseList[index].checkAll = chooseList[index].checkAll = list.length === chooseList[index].plainOptions.length;
list.length === chooseList[index].plainOptions.length;
return chooseList; return chooseList;
}); });
}; };
...@@ -114,9 +113,7 @@ const Fieldselection = props => { ...@@ -114,9 +113,7 @@ const Fieldselection = props => {
const onCheckAllChange = (e, index) => { const onCheckAllChange = (e, index) => {
setCheckList(value => { setCheckList(value => {
const chooseList = JSON.parse(JSON.stringify(value)); const chooseList = JSON.parse(JSON.stringify(value));
chooseList[index].defaultCheckedList = e.target.checked chooseList[index].defaultCheckedList = e.target.checked ? chooseList[index].plainOptions : [];
? chooseList[index].plainOptions
: [];
chooseList[index].indeterminate = false; chooseList[index].indeterminate = false;
chooseList[index].checkAll = e.target.checked; chooseList[index].checkAll = e.target.checked;
return chooseList; return chooseList;
......
...@@ -196,6 +196,14 @@ const incident = () => { ...@@ -196,6 +196,14 @@ const incident = () => {
/> />
), ),
}, },
{
title: '外部字段',
dataIndex: 'outFields',
key: 'outFields',
align: 'center',
width: 100,
render: text => <span style={{ color: Number(text) > 0 ? 'red' : '' }}>{text}</span>,
},
{ {
title: '上报方式', title: '上报方式',
dataIndex: 'createMode', dataIndex: 'createMode',
...@@ -210,10 +218,7 @@ const incident = () => { ...@@ -210,10 +218,7 @@ const incident = () => {
render: record => ( render: record => (
<Space size="middle"> <Space size="middle">
<Tooltip title="编辑事件类型"> <Tooltip title="编辑事件类型">
<EditTwoTone <EditTwoTone onClick={() => editEventType(record)} style={{ fontSize: '16px' }} />
onClick={() => editEventType(record)}
style={{ fontSize: '16px' }}
/>
</Tooltip> </Tooltip>
<Tooltip title="删除事件类型"> <Tooltip title="删除事件类型">
<Popconfirm <Popconfirm
...@@ -558,8 +563,7 @@ const incident = () => { ...@@ -558,8 +563,7 @@ const incident = () => {
dataSource={tableData[pickItem]} dataSource={tableData[pickItem]}
scroll={{ y: 'calc(100vh - 155px)', x: 'max-content' }} scroll={{ y: 'calc(100vh - 155px)', x: 'max-content' }}
pagination={{ pagination={{
showTotal: (total, range) => showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条`,
`第${range[0]}-${range[1]} 条/共 ${total} 条`,
pageSizeOptions: [10, 20, 50, 100], pageSizeOptions: [10, 20, 50, 100],
defaultPageSize: 20, defaultPageSize: 20,
showQuickJumper: true, showQuickJumper: true,
......
/* eslint-disable camelcase */
import React, { useState, useEffect } from 'react';
import { Form, Input, Select, Tooltip, Button, notification, Drawer, Space } from 'antd';
import { PlusOutlined, InfoCircleOutlined } from '@ant-design/icons';
import { LoadEventFields } from '@/services/platform/bs';
import {
GetCM_Ledger_LoadLedgerTable,
GetCMLedger_QueryLedgers,
GetCMLedger_OperateLedger,
} from '@/services/standingBook/api';
import ChangeAdd from './changeAdd';
const { Option } = Select;
const { TextArea } = Input;
const BookConfig = props => {
const { callBackSubmit, type, formObj, visible, tableData, onCancel, maxLength } = props;
const [standingTable, setStandingTable] = useState([]);
const [isVisible, setIsVisible] = useState(false); // 弹窗
const [pickItem, setPickItem] = useState(''); // 选择的字段
const [Order, setOrder] = useState(''); // 当前编辑序号
const [filed, setFiled] = useState({}); // 传给子组件列表数据
const [checkedList, setCheckedList] = useState([]);
const [allFileds, setAllFileds] = useState([]); // 当前表所有的字段
const [form] = Form.useForm();
const layout = {
layout: 'horizontal',
labelCol: {
span: 5,
},
wrapperCol: {
span: 19,
},
};
const { Item } = Form;
// 提交
const onSubmit = () => {
form.validateFields().then(validate => {
if (validate) {
let obj =
type === 'add'
? { ...validate, Order: maxLength }
: { ...validate, Order, ID: formObj.ID };
GetCMLedger_OperateLedger(obj)
.then(res => {
if (res.code === 0) {
form.resetFields();
callBackSubmit();
notification.success({
message: '提示',
duration: 3,
description: type === 'add' ? '新增成功' : '编辑成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.msg,
});
}
})
.catch(() => {
notification.error({
message: '提示',
duration: 3,
description: '网络异常请稍后再试',
});
});
}
});
};
useEffect(() => {
if (visible) {
// 获取台账表
getTableData();
if (type === 'edit') {
GetCMLedger_QueryLedgers({ ledgerId: formObj.ID }).then(res => {
if (res.code === 0) {
form.setFieldsValue(res.data.root);
setOrder(res.data.root.Order);
changTable(res.data.root.TableName);
}
});
}
} else {
setFiled({});
form.resetFields();
form.setFieldsValue({ AccountType: '台账' });
}
}, [visible]);
// 获取台账表
const getTableData = () => {
GetCM_Ledger_LoadLedgerTable().then(res => {
if (res.code === 0) {
setStandingTable(res.data.root);
}
});
};
// 切换表后数据处理为对应格式
const changTable = value => {
LoadEventFields({ eventTableName: value, distinctFields: '' }).then(res => {
if (res.data.root) {
let fileMap = new Map();
let initList = [];
// 处理为子组件需要的格式
res.data.root.forEach(item => {
initList.push(item.fieldName);
if (fileMap.has(item.group)) {
let list = [...fileMap.get(item.group)];
list.push(item.fieldName);
fileMap.set(item.group, list);
} else {
fileMap.set(item.group, [item.fieldName]);
}
});
// 给Map格式转为对象
fileMap = Object.fromEntries(fileMap.entries());
// 处理外部字段
Object.keys(form.getFieldsValue()).forEach(key => {
saveOutFieldsLength(key, initList);
});
setAllFileds(initList);
setFiled(fileMap);
}
});
};
// 保存外部字段个数
const saveOutFieldsLength = (key, initList) => {
switch (key) {
case 'Fields':
form.setFieldsValue({ outListFileds: dealExternal(key, initList) });
break;
case 'SearchFields':
form.setFieldsValue({ outSearchFields: dealExternal(key, initList) });
break;
case 'AddFields':
form.setFieldsValue({ outAddFields: dealExternal(key, initList) });
break;
case 'EditFields':
form.setFieldsValue({ outEditFields: dealExternal(key, initList) });
break;
case 'WebFields':
form.setFieldsValue({ outWebFields: dealExternal(key, initList) });
break;
case 'MobileFields':
form.setFieldsValue({ outMobileFields: dealExternal(key, initList) });
break;
default:
break;
}
};
// 选择字段回调函数
const onOK = prop => {
setIsVisible(false);
let obj = {};
obj[prop.pickItem] = prop.str;
form.setFieldsValue(obj);
saveOutFieldsLength(prop.pickItem, allFileds);
};
// 处理外部字段
const dealExternal = (fileds, list) => {
let isExternal;
let externalLength = 0;
if (form.getFieldValue(fileds)) {
form
.getFieldValue(fileds)
.split(',')
.forEach(item => {
isExternal = list.some(val => val === item);
if (!isExternal && item !== '') {
// eslint-disable-next-line no-plusplus
externalLength++;
}
});
}
return externalLength;
};
// 勾选字段
const pickFiled = fileds => {
if (!form.getFieldValue('TableName')) {
notification.error({ message: '提示', duration: 3, description: '请选择台账表' });
return;
}
// 添加外部字段
if (type === 'edit') {
let fil = { ...filed };
fil['外部字段'] = [];
let isExternal;
form
.getFieldValue(fileds)
.split(',')
.forEach(item => {
isExternal = allFileds.some(val => val === item);
if (!isExternal && item !== '') {
fil['外部字段'].push(item);
}
});
if (fil['外部字段'].length === 0) {
delete fil['外部字段'];
}
setFiled(fil);
setCheckedList(form.getFieldValue(fileds).split(','));
}
setPickItem(fileds);
setIsVisible(true);
};
// 搜索框监听
const onSearch = value => {
if (value) {
form.setFieldsValue({ Type: value });
}
};
return (
<Drawer
title={`${type === 'add' ? '台账配置' : '台账编辑'}`}
width="500px"
visible={visible}
onClose={onCancel}
destroyOnClose
footer={
<Space>
<Button onClick={onCancel}>取消</Button>
<Button onClick={onSubmit} type="primary">
确定
</Button>
</Space>
}
>
<Form form={form} {...layout}>
<Item label="分组" name="Type" rules={[{ required: true, message: '请选择分组' }]}>
<Select
showSearch
filterOption={false}
onSearch={onSearch}
placeholder="请输入分组名称"
allowClear
>
{tableData.map((item, index) => (
<Option value={item} key={index}>
{item}
</Option>
))}
</Select>
</Item>
<Item label="台账类型" name="AccountType">
<Select placeholder="请选择台账类型">
<Option value="台账">台账</Option>
<Option value="反馈">反馈</Option>
<Option value="设备">设备</Option>
</Select>
</Item>
<Item label="台账名称" name="Name" rules={[{ required: true, message: '请输入台账名称' }]}>
<Input placeholder="台账名称不可重复" allowClear />
</Item>
<Item label="台账表" name="TableName" rules={[{ required: true, message: '请选择台账表' }]}>
<Select placeholder="" optionFilterProp="children" onChange={changTable}>
{standingTable.map((item, index) => (
<Option key={index} value={item.value}>
{item.text}
</Option>
))}
</Select>
</Item>
<Item
label={
<>
{form.getFieldValue('outListFileds') > 0 ? (
<Tooltip title={`外部字段${form.getFieldValue('outListFileds')}个`}>
<InfoCircleOutlined style={{ color: 'red', margin: '2px 3px 0 3px' }} />
</Tooltip>
) : (
''
)}
<span>台账字段</span>
</>
}
name="Fields"
>
<div style={{ display: 'flex' }}>
<Form.Item name="Fields" style={{ marginBottom: 0, width: '100%' }}>
<TextArea placeholder="前端详情查看字段" allowClear />
</Form.Item>
<Button
type="dashed"
style={{ height: '54px', width: '50px', marginLeft: '10px' }}
icon={<PlusOutlined />}
onClick={() => {
pickFiled('Fields');
}}
/>
</div>
</Item>
<Item
label={
<>
{form.getFieldValue('outSearchFields') > 0 ? (
<Tooltip title={`外部字段${form.getFieldValue('outSearchFields')}个`}>
<InfoCircleOutlined style={{ color: 'red', margin: '2px 3px 0 3px' }} />
</Tooltip>
) : (
''
)}
<span>检索字段</span>
</>
}
name="SearchFields"
>
<div style={{ display: 'flex' }}>
<Form.Item name="SearchFields" style={{ marginBottom: 0, width: '100%' }}>
<TextArea placeholder="前端列表检索字段" allowClear />
</Form.Item>
<Button
type="dashed"
style={{ height: '54px', width: '50px', marginLeft: '10px' }}
icon={<PlusOutlined />}
onClick={() => {
pickFiled('SearchFields');
}}
/>
</div>
</Item>
<Item
label={
<>
{form.getFieldValue('outAddFields') > 0 ? (
<Tooltip title={`外部字段${form.getFieldValue('outAddFields')}个`}>
<InfoCircleOutlined style={{ color: 'red', margin: '2px 3px 0 3px' }} />
</Tooltip>
) : (
''
)}
<span>添加字段</span>
</>
}
name="AddFields"
>
<div style={{ display: 'flex' }}>
<Form.Item name="AddFields" style={{ marginBottom: 0, width: '100%' }}>
<TextArea placeholder="前端数据添加字段" allowClear />
</Form.Item>
<Button
type="dashed"
style={{ height: '54px', width: '50px', marginLeft: '10px' }}
icon={<PlusOutlined />}
onClick={() => {
pickFiled('AddFields');
}}
/>
</div>
</Item>
<Item
label={
<>
{form.getFieldValue('outEditFields') > 0 ? (
<Tooltip title={`外部字段${form.getFieldValue('outEditFields')}个`}>
<InfoCircleOutlined style={{ color: 'red', margin: '2px 3px 0 3px' }} />
</Tooltip>
) : (
''
)}
<span>编辑字段</span>
</>
}
name="EditFields"
>
<div style={{ display: 'flex' }}>
<Form.Item name="EditFields" style={{ marginBottom: 0, width: '100%' }}>
<TextArea placeholder="前端可编辑字段" allowClear />
</Form.Item>
<Button
type="dashed"
style={{ height: '54px', width: '50px', marginLeft: '10px' }}
icon={<PlusOutlined />}
onClick={() => {
pickFiled('EditFields');
}}
/>
</div>
</Item>
<Item
label={
<>
{form.getFieldValue('outWebFields') > 0 ? (
<Tooltip title={`外部字段${form.getFieldValue('outWebFields')}个`}>
<InfoCircleOutlined style={{ color: 'red', margin: '2px 3px 0 3px' }} />
</Tooltip>
) : (
''
)}
<span>前端字段</span>
</>
}
name="WebFields"
>
<div style={{ display: 'flex' }}>
<Form.Item name="WebFields" style={{ marginBottom: 0, width: '100%' }}>
<TextArea placeholder="前端列表展示字段" allowClear />
</Form.Item>
<Button
type="dashed"
style={{ height: '54px', width: '50px', marginLeft: '10px' }}
icon={<PlusOutlined />}
onClick={() => {
pickFiled('WebFields');
}}
/>
</div>
</Item>
<Item
label={
<>
{form.getFieldValue('outMobileFields') > 0 ? (
<Tooltip title={`外部字段${form.getFieldValue('outMobileFields')}个`}>
<InfoCircleOutlined style={{ color: 'red', margin: '2px 3px 0 3px' }} />
</Tooltip>
) : (
''
)}
<span>手持字段</span>
</>
}
name="MobileFields"
>
<div style={{ display: 'flex' }}>
<Form.Item name="MobileFields" style={{ marginBottom: 0, width: '100%' }}>
<TextArea placeholder="手持展示字段" allowClear />
</Form.Item>
<Button
type="dashed"
style={{ height: '54px', width: '50px', marginLeft: '10px' }}
icon={<PlusOutlined />}
onClick={() => {
pickFiled('MobileFields');
}}
/>
</div>
</Item>
<Item label="接口配置" name="Interface">
<Input placeholder="服务项目dll库" allowClear />
</Item>
</Form>
<ChangeAdd
visible={isVisible}
onCancel={() => setIsVisible(false)}
callBackSubmit={onOK}
newCheckedList={checkedList}
filed={filed}
pickItem={pickItem}
formObj={formObj}
/>
</Drawer>
);
};
export default BookConfig;
...@@ -19,15 +19,7 @@ const AddModal = props => { ...@@ -19,15 +19,7 @@ const AddModal = props => {
}); });
return ref.current; return ref.current;
}; };
const { const { callBackSubmit, pickItem, visible, filed, newCheckedList } = props;
callBackSubmit = () => {},
isType,
pickItem,
visible,
filed,
characterValue,
newCheckedList,
} = props;
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [value, setValue] = useState(''); const [value, setValue] = useState('');
const [checkValue, setCheckValue] = useState([]); const [checkValue, setCheckValue] = useState([]);
...@@ -47,8 +39,7 @@ const AddModal = props => { ...@@ -47,8 +39,7 @@ const AddModal = props => {
setCheckedList(checkedListArr); setCheckedList(checkedListArr);
const indeterminateArr = [...indeterminate]; const indeterminateArr = [...indeterminate];
const checkAllArr = [...checkAll]; const checkAllArr = [...checkAll];
indeterminateArr[index] = indeterminateArr[index] = !!list.length && list.length < filed[title].length;
!!list.length && list.length < filed[title].length;
checkAllArr[index] = list.length === filed[title].length; checkAllArr[index] = list.length === filed[title].length;
setIndeterminate(indeterminateArr); setIndeterminate(indeterminateArr);
setCheckAll(checkAllArr); setCheckAll(checkAllArr);
...@@ -132,6 +123,7 @@ const AddModal = props => { ...@@ -132,6 +123,7 @@ const AddModal = props => {
dataIndex: 'name', dataIndex: 'name',
width: 150, width: 150,
key: 'name', key: 'name',
ellipsis: true,
}, },
]; ];
useEffect(() => { useEffect(() => {
...@@ -149,8 +141,7 @@ const AddModal = props => { ...@@ -149,8 +141,7 @@ const AddModal = props => {
} }
}); });
indeterminateArr.push( indeterminateArr.push(
!!checkArr[index].length && !!checkArr[index].length && checkArr[index].length < filed[item].length,
checkArr[index].length < filed[item].length,
); );
checkAllArr.push(checkArr[index].length === filed[item].length); checkAllArr.push(checkArr[index].length === filed[item].length);
}); });
...@@ -184,7 +175,7 @@ const AddModal = props => { ...@@ -184,7 +175,7 @@ const AddModal = props => {
}; };
return ( return (
<Modal <Modal
title={isType === 'rule' ? '选择验证规则' : '字段集选择'} title="字段集选择"
bodyStyle={{ width: '100%', minHeight: '100px' }} bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '10px' }} style={{ top: '10px' }}
width="750px" width="750px"
...@@ -201,10 +192,7 @@ const AddModal = props => { ...@@ -201,10 +192,7 @@ const AddModal = props => {
> >
{visible && ( {visible && (
<div className={styles.listCard}> <div className={styles.listCard}>
<div <div className={styles.cardItem} style={{ borderRight: '1px solid #99bbe8' }}>
className={styles.cardItem}
style={{ borderRight: '1px solid #99bbe8' }}
>
<Divider <Divider
orientation="left" orientation="left"
style={{ margin: '0 0 10px 0', backgroundColor: '#dfe8f6' }} style={{ margin: '0 0 10px 0', backgroundColor: '#dfe8f6' }}
......
/* eslint-disable guard-for-in */
/* eslint-disable no-restricted-syntax */
import React, { useState, useEffect } from 'react';
import {
Form,
Modal,
Input,
Select,
Tooltip,
Button,
notification,
Image,
Menu,
Dropdown,
Drawer,
Space,
} from 'antd';
import {
PlusOutlined,
InfoCircleOutlined,
DownOutlined,
} from '@ant-design/icons';
import { LoadEventFields } from '@/services/platform/bs';
import add from '@/assets/images/thumbnail/add.jpg';
import editor from '@/assets/images/thumbnail/editor.jpg';
import hand from '@/assets/images/thumbnail/hand.png';
import search from '@/assets/images/thumbnail/search.jpg';
import taizhang from '@/assets/images/thumbnail/taizhang.jpg';
import web from '@/assets/images/thumbnail/web.jpg';
import {
GetCM_Ledger_LoadLedgerTable,
GetCMLedger_QueryLedgers,
GetCMLedger_OperateLedger,
} from '@/services/standingBook/api';
import styles from './standingBook.less';
import ChangeAdd from './changeAdd';
import { orderBy } from 'lodash';
const { Option } = Select;
const { TextArea } = Input;
const AddModal = props => {
const {
callBackSubmit = () => {},
type,
formObj,
visible,
tableData,
maxLength,
onCancel,
} = props;
const [standingTable, setStandingTable] = useState([]);
const [inputValue, setInputVaule] = useState({
Fields: '',
EditFields: '',
AddFields: '',
MobileFields: '',
SearchFields: '',
WebFields: '',
});
const [isVisible, setIsVisible] = useState(false); // 弹窗
const [loading, setLoading] = useState(false);
const [pickItem, setPickItem] = useState('');
const [filed, setFiled] = useState({}); // 传给子组件列表数据
const [types, setTypes] = useState(''); // 弹窗类型
const [Order, setOrder] = useState(''); // 弹窗类型
const [checkedList, setCheckedList] = useState([]);
const [Type, setType] = useState('');
const [characterValue, setCharacterValue] = useState('');
const [standingType, setStandingType] = useState(['台账', '反馈', '设备']);
const [allFileds, setAllFileds] = useState([]); // 当前表所有的字段
const [form] = Form.useForm();
const { Item } = Form;
// 提交
const onSubmit = () => {
form.validateFields().then(validate => {
if (validate) {
setLoading(true);
let obj = form.getFieldsValue();
console.log(obj, 'obj');
console.log(inputValue, 'inputValue');
const {
AddFields,
EditFields,
Fields,
MobileFields,
SearchFields,
WebFields,
} = inputValue;
let fieldsObj = {
AddFields,
EditFields,
Fields,
MobileFields,
SearchFields,
WebFields,
};
let data =
type == 'add'
? { ...obj, ...inputValue, Order: maxLength }
: { ...obj, Order, ...fieldsObj, ID: formObj.ID };
GetCMLedger_OperateLedger(data)
.then(res => {
setLoading(false);
if (res.msg === '') {
form.resetFields();
callBackSubmit();
notification.success({
message: '提示',
duration: 3,
description: type == 'add' ? '新增成功' : '编辑成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.msg,
});
}
})
.catch(err => {
notification.error({
message: '提示',
duration: 3,
description: '新增失败',
});
setLoading(false);
});
}
});
};
const onFinish = value => {};
useEffect(() => {
getTableData();
if (type === 'edit') {
GetCMLedger_QueryLedgers({ ledgerId: formObj.ID }).then(res => {
res.data.root && form.setFieldsValue({ ...res.data.root });
setInputVaule({ ...res.data.root });
setOrder(res.data.root.Order);
setType(res.data.root.Type);
changTable(res.data.root.TableName);
});
} else if (type === 'add') {
setInputVaule({
Fields: '',
EditFields: '',
AddFields: '',
MobileFields: '',
SearchFields: '',
WebFields: '',
});
setFiled({});
form.resetFields();
form.setFieldsValue({ AccountType: '台账' });
}
}, [visible]);
const layout = {
layout: 'horizontal',
labelCol: {
span: 5,
},
wrapperCol: {
span: 19,
},
};
const getTableData = () => {
setType('');
GetCM_Ledger_LoadLedgerTable().then(res => {
if (res.msg === 'Ok') {
setStandingTable(res.data.root);
}
});
};
const changTable = value => {
LoadEventFields({ eventTableName: value, distinctFields: '' }).then(res => {
if (res.data.root && res.data.root.length) {
setFiled(formateArrDataA(res.data.root, 'group'));
}
});
};
const formateArrDataA = (initialArr, name) => {
// 判定传参是否符合规则
if (!(initialArr instanceof Array)) {
return '请传入正确格式的数组';
}
if (!name) {
return '请传入对象属性';
}
// 先获取一下这个数组中有多少个"name"
let nameArr = [];
let allFile = [];
for (let i in initialArr) {
allFile.push(initialArr[i].fieldName);
if (nameArr.indexOf(initialArr[i][`${name}`]) === -1) {
nameArr.push(initialArr[i][`${name}`]);
}
}
// 保存所有的字段用来比较是否有外部字段
setAllFileds(allFile);
// 新建一个包含多个list的结果对象
let tempObj = {};
// 根据不同的"name"生成多个数组
console.log(initialArr);
for (let k in nameArr) {
for (let j in initialArr) {
if (initialArr[j][`${name}`] == nameArr[k]) {
// 每次外循环时新建一个对应"name"的数组, 内循环时当前数组不变
tempObj[nameArr[k]] = tempObj[nameArr[k]] || [];
tempObj[nameArr[k]].push(initialArr[j]);
}
}
}
console.log(tempObj);
for (let key in tempObj) {
let arr = [];
tempObj[key].map(item => {
tempObj[key] = arr;
arr.push(item.fieldName);
});
}
return tempObj;
};
const onOK = prop => {
setIsVisible(false);
let inputText = { ...inputValue };
inputText[prop.pickItem] = prop.str;
setCheckedList(prop.checkedList);
setInputVaule(inputText);
};
const pickFiled = fileds => {
// 添加外部字段
let fil = { ...filed };
fil['外部字段'] = [];
let isExternal;
inputValue[fileds].split(',').forEach(item => {
isExternal = allFileds.some(val => val === item);
if (!isExternal && item !== '') {
fil['外部字段'].push(item);
}
});
if (fil['外部字段'].length === 0) {
delete fil['外部字段'];
}
setFiled(fil);
setTypes('add');
setCharacterValue(inputValue[fileds]);
setCheckedList(inputValue[fileds].split(','));
setPickItem(fileds);
setIsVisible(true);
};
const changeText = (e, type) => {
let inputText = { ...inputValue };
inputText[type] = e.target.value;
console.log(inputText, '32555');
setInputVaule(inputText);
};
const inputType = e => {
e.persist();
console.log(e.target.value, 'value');
setType(e.target.value);
form.setFieldsValue({ Type: e.target.value });
};
return (
<Drawer
title={`${type === 'add' ? '台账配置' : '台账编辑'}`}
width="500px"
visible={visible}
onClose={onCancel}
footer={
<Space>
<Button onClick={onCancel}>取消</Button>
<Button onClick={onSubmit} type="primary">
确定
</Button>
</Space>
}
>
{visible && (
<div className={styles.formData}>
<Form form={form} {...layout} onFinish={onFinish}>
<Item
label="分组"
name="Type"
rules={[{ required: true, message: '请选择分组' }]}
>
<div>
<Input
className="ue-editable-select-input"
onChange={e => inputType(e)}
value={Type}
/>
<Dropdown
placement="bottomRight"
style={{ width: '20rem' }}
overlay={
<Menu>
{tableData.length
? tableData.map((item, index) => {
return (
<Menu.Item
onClick={() => {
setType(item);
form.setFieldsValue({ Type: item });
}}
style={{ width: '26.6rem' }}
key={index}
>
{item}
</Menu.Item>
);
})
: ''}
</Menu>
}
>
<div
className={styles.linkDrowp}
onClick={e => e.preventDefault()}
>
<DownOutlined
style={{ fontSize: '12px', color: 'rgba(0, 0, 0, 0.25)' }}
/>
</div>
</Dropdown>
{/* {tableData.length ? tableData.map((item, index) => { return <Option key={index} value={item}>{item}</Option> }) : ''} */}
</div>
</Item>
<Item label="台账类型" name="AccountType">
<Select placeholder="选择台账类型">
{standingType.length
? standingType.map((item, index) => {
return (
<Option key={index} value={item}>
{item}
</Option>
);
})
: ''}
</Select>
</Item>
<Item
label="台账名称"
name="Name"
rules={[{ required: true, message: '请输入台账名称' }]}
>
<Input placeholder="台账名称不可重复" allowClear />
</Item>
<Item
label="台账表"
name="TableName"
rules={[{ required: true, message: '请选择台账表' }]}
>
<Select
placeholder=""
optionFilterProp="children"
onChange={changTable}
>
{standingTable.length
? standingTable.map((item, index) => {
return (
<Option key={index} value={item.value}>
{item.text}
</Option>
);
})
: ''}
</Select>
</Item>
<Item
label={
<div className={styles.formData_label}>
<Tooltip title={<Image width={200} src={taizhang} />}>
<InfoCircleOutlined
style={{ color: '#1890FF', padding: '0.2rem 0.2rem 0 0' }}
/>
</Tooltip>
<span>台账字段</span>{' '}
</div>
}
name="Fields"
>
<div className={styles.filed_listItem}>
<TextArea
placeholder="前端详情查看字段"
onChange={e => changeText(e, 'Fields')}
value={inputValue.Fields}
allowClear
/>
<Button
type="dashed"
onClick={() => pickFiled('Fields')}
icon={<PlusOutlined />}
style={{
marginLeft: '0.5rem',
height: '100%',
width: '3.5rem',
}}
/>
</div>
</Item>
<Item
label={
<div className={styles.formData_label}>
{' '}
<Tooltip title={<Image width={200} src={search} />}>
<InfoCircleOutlined
style={{ color: '#1890FF', padding: '0.2rem 0.2rem 0 0' }}
/>
</Tooltip>
<span>检索字段</span>{' '}
</div>
}
name="SearchFields"
>
<div className={styles.filed_listItem}>
<TextArea
placeholder="前端列表检索字段"
onChange={e => changeText(e, 'SearchFields')}
value={inputValue.SearchFields}
allowClear
/>
<Button
type="dashed"
onClick={() => pickFiled('SearchFields')}
icon={<PlusOutlined />}
style={{
marginLeft: '0.5rem',
height: '100%',
width: '3.5rem',
}}
/>
</div>
</Item>
<Item
label={
<div className={styles.formData_label}>
{' '}
<Tooltip title={<Image width={200} src={add} />}>
<InfoCircleOutlined
style={{ color: '#1890FF', padding: '0.2rem 0.2rem 0 0' }}
/>
</Tooltip>
<span>添加字段</span>{' '}
</div>
}
name="AddFields"
>
<div className={styles.filed_listItem}>
<TextArea
placeholder="前端数据添加字段"
onChange={e => changeText(e, 'AddFields')}
value={inputValue.AddFields}
allowClear
/>
<Button
type="dashed"
onClick={() => pickFiled('AddFields')}
icon={<PlusOutlined />}
style={{
marginLeft: '0.5rem',
height: '100%',
width: '3.5rem',
}}
/>
</div>
</Item>
<Item
label={
<div className={styles.formData_label}>
<Tooltip title={<Image width={200} src={editor} />}>
<InfoCircleOutlined
style={{ color: '#1890FF', padding: '0.2rem 0.2rem 0 0' }}
/>
</Tooltip>
<span>编辑字段</span>{' '}
</div>
}
name="EditFields"
>
<div className={styles.filed_listItem}>
<TextArea
placeholder="前端可编辑字段"
onChange={e => changeText(e, 'EditFields')}
value={inputValue.EditFields}
allowClear
/>
<Button
type="dashed"
onClick={() => pickFiled('EditFields')}
icon={<PlusOutlined />}
style={{
marginLeft: '0.5rem',
height: '100%',
width: '3.5rem',
}}
/>
</div>
</Item>
<Item
label={
<div className={styles.formData_label}>
<Tooltip title={<Image width={200} src={web} />}>
<InfoCircleOutlined
style={{ color: '#1890FF', padding: '0.2rem 0.2rem 0 0' }}
/>
</Tooltip>
<span>前端字段</span>{' '}
</div>
}
name="WebFields"
>
<div className={styles.filed_listItem}>
<TextArea
placeholder="前端列表展示字段"
onChange={e => changeText(e, 'WebFields')}
value={inputValue.WebFields}
allowClear
/>
<Button
type="dashed"
onClick={() => pickFiled('WebFields')}
icon={<PlusOutlined />}
style={{
marginLeft: '0.5rem',
height: '100%',
width: '3.5rem',
}}
/>
</div>
</Item>
<Item
label={
<div className={styles.formData_label}>
<Tooltip title={<Image width={100} src={hand} />}>
<InfoCircleOutlined
style={{ color: '#1890FF', padding: '0.2rem 0.2rem 0 0' }}
/>
</Tooltip>
<span>手持字段</span>{' '}
</div>
}
name="MobileFields"
>
<div className={styles.filed_listItem}>
<TextArea
placeholder="手持展示字段"
onChange={e => changeText(e, 'MobileFields')}
value={inputValue.MobileFields}
allowClear
/>
<Button
type="dashed"
onClick={() => pickFiled('MobileFields')}
icon={<PlusOutlined />}
style={{
marginLeft: '0.5rem',
height: '100%',
width: '3.5rem',
}}
/>
</div>
</Item>
<Item label="接口配置" name="Interface">
{/* <div className={styles.filed_listItem}> */}
<TextArea placeholder="服务项目dll库" allowClear />
{/* </div> */}
</Item>
</Form>
<ChangeAdd
visible={isVisible}
onCancel={() => setIsVisible(false)}
callBackSubmit={onOK}
newCheckedList={checkedList}
isType={types}
filed={filed}
pickItem={pickItem}
characterValue={characterValue}
formObj={formObj}
/>
</div>
)}
</Drawer>
);
};
export default AddModal;
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { import { Form, Card, Space, Table, Popconfirm, Spin, Tooltip, notification } from 'antd';
Form,
Card,
Space,
Table,
Popconfirm,
Spin,
Tooltip,
notification,
} from 'antd';
import { import {
DoubleLeftOutlined, DoubleLeftOutlined,
...@@ -20,11 +11,8 @@ import { ...@@ -20,11 +11,8 @@ import {
} from '@ant-design/icons'; } from '@ant-design/icons';
import classnames from 'classnames'; import classnames from 'classnames';
import PageContainer from '@/components/BasePageContainer'; import PageContainer from '@/components/BasePageContainer';
import { import { GetCM_Ledger_LoadLedgers, CM_Ledger_RmoveLedger } from '@/services/standingBook/api';
GetCM_Ledger_LoadLedgers, import AddModal from './BookConfig';
CM_Ledger_RmoveLedger,
} from '@/services/standingBook/api';
import AddModal from './editorModal';
import styles from './standingBook.less'; import styles from './standingBook.less';
const standingBook = props => { const standingBook = props => {
const [allData, setAllData] = useState([]); const [allData, setAllData] = useState([]);
...@@ -110,6 +98,14 @@ const standingBook = props => { ...@@ -110,6 +98,14 @@ const standingBook = props => {
align: 'center', align: 'center',
width: 100, width: 100,
}, },
{
title: '外部字段',
dataIndex: 'outFields',
key: 'outFields',
align: 'center',
width: 100,
render: text => <span style={{ color: Number(text) > 0 ? 'red' : '' }}>{text}</span>,
},
{ {
title: '操作', title: '操作',
ellipsis: true, ellipsis: true,
...@@ -117,10 +113,7 @@ const standingBook = props => { ...@@ -117,10 +113,7 @@ const standingBook = props => {
render: (text, record) => ( render: (text, record) => (
<Space> <Space>
<Tooltip title="编辑此表"> <Tooltip title="编辑此表">
<EditTwoTone <EditTwoTone onClick={() => editor(record)} style={{ fontSize: '16px' }} />
onClick={() => editor(record)}
style={{ fontSize: '16px' }}
/>
</Tooltip> </Tooltip>
<Tooltip title="删除此表"> <Tooltip title="删除此表">
...@@ -281,8 +274,8 @@ const standingBook = props => { ...@@ -281,8 +274,8 @@ const standingBook = props => {
onClick={e => setPickItem(item)} onClick={e => setPickItem(item)}
key={index} key={index}
> >
{item}{allData[item] ? allData[item].length : ''} {item}{allData[item] ? allData[item].length : ''}
{item === pickItem ? <RightOutlined /> : ''}{' '} {item === pickItem ? <RightOutlined /> : ''}
</div> </div>
); );
})} })}
...@@ -331,8 +324,7 @@ const standingBook = props => { ...@@ -331,8 +324,7 @@ const standingBook = props => {
scroll={{ x: 'max-content', y: 'calc(100vh - 150px)' }} scroll={{ x: 'max-content', y: 'calc(100vh - 150px)' }}
// scroll={{ x: 'max-content' }} // scroll={{ x: 'max-content' }}
pagination={{ pagination={{
showTotal: (total, range) => showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条`,
`第${range[0]}-${range[1]} 条/共 ${total} 条`,
pageSizeOptions: [10, 20, 50, 100], pageSizeOptions: [10, 20, 50, 100],
defaultPageSize: 20, defaultPageSize: 20,
showQuickJumper: true, showQuickJumper: true,
......
...@@ -4,16 +4,7 @@ import WebConfigForm from './webConfigForm'; ...@@ -4,16 +4,7 @@ import WebConfigForm from './webConfigForm';
import { postEditWebConfig } from '@/services/webConfig/api'; import { postEditWebConfig } from '@/services/webConfig/api';
export default props => { export default props => {
const { const { visible, onClose, config, hasIntegerate, isEdit, onOk, submitting, productList } = props;
visible,
onClose,
config,
hasIntegerate,
isEdit,
onOk,
submitting,
productList,
} = props;
return ( return (
<Drawer <Drawer
......
import BaseForm from '@/components/BaseForm'; import BaseForm from '@/components/BaseForm';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { import { getLoginPage, getMapCofigs, getWebThemes, getProductList } from '@/services/webConfig/api';
getLoginPage,
getMapCofigs,
getWebThemes,
getProductList,
} from '@/services/webConfig/api';
import { Row, Col } from 'antd'; import { Row, Col } from 'antd';
import { getDefaultGetWebconfig, singleStyleData, webMode } from '../utils'; import { getDefaultGetWebconfig, singleStyleData, webMode } from '../utils';
......
...@@ -38,8 +38,7 @@ const WebConfigPage = props => { ...@@ -38,8 +38,7 @@ const WebConfigPage = props => {
const [configFiles, setConfigFiles] = useState([]); const [configFiles, setConfigFiles] = useState([]);
const [productList, setProductList] = useState([]); // 产品列表 const [productList, setProductList] = useState([]); // 产品列表
const hasIntegerate = () => const hasIntegerate = () => webs.some(w => w.id.startsWith(webMode.integration));
webs.some(w => w.id.startsWith(webMode.integration));
useEffect(() => { useEffect(() => {
let canceled = { cancel: false }; let canceled = { cancel: false };
...@@ -141,9 +140,7 @@ const WebConfigPage = props => { ...@@ -141,9 +140,7 @@ const WebConfigPage = props => {
const handleDeleteWeb = (webToOperate, closeModal) => { const handleDeleteWeb = (webToOperate, closeModal) => {
// eslint-disable-next-line prefer-destructuring // eslint-disable-next-line prefer-destructuring
const client = webToOperate?.id?.split( const client = webToOperate?.id?.split(
webToOperate.id.startsWith(webMode.single) webToOperate.id.startsWith(webMode.single) ? webMode.single : webMode.integration,
? webMode.single
: webMode.integration,
)[1]; )[1];
if (client) { if (client) {
deleteWebsite(client) deleteWebsite(client)
...@@ -191,9 +188,7 @@ const WebConfigPage = props => { ...@@ -191,9 +188,7 @@ const WebConfigPage = props => {
content: ( content: (
<span> <span>
删除网站{' '} 删除网站{' '}
<span style={{ fontWeight: 800, color: '#1890ff' }}> <span style={{ fontWeight: 800, color: '#1890ff' }}>{webToOperate.text}</span>{' '}
{webToOperate.text}
</span>{' '}
后将无法恢复, 确认删除? 后将无法恢复, 确认删除?
</span> </span>
), ),
...@@ -221,21 +216,12 @@ const WebConfigPage = props => { ...@@ -221,21 +216,12 @@ const WebConfigPage = props => {
if (isSite) { if (isSite) {
url = val; url = val;
} else { } else {
url = localStorage.getItem('pd2-baseUrl') url = localStorage.getItem('pd2-baseUrl') ? localStorage.getItem('pd2-baseUrl') + val : val;
? localStorage.getItem('pd2-baseUrl') + val
: val;
} }
return url; return url;
}; };
const handleSubmit = val => { const handleSubmit = val => {
let { let { bannerLogo, logo, shortcutIcon, baseBannerUrl, baseIconUrl, baseLogoUrl } = val;
bannerLogo,
logo,
shortcutIcon,
baseBannerUrl,
baseIconUrl,
baseLogoUrl,
} = val;
baseBannerUrl = handleGeturl(bannerLogo); baseBannerUrl = handleGeturl(bannerLogo);
baseIconUrl = handleGeturl(shortcutIcon); baseIconUrl = handleGeturl(shortcutIcon);
baseLogoUrl = handleGeturl(logo); baseLogoUrl = handleGeturl(logo);
...@@ -318,9 +304,7 @@ const WebConfigPage = props => { ...@@ -318,9 +304,7 @@ const WebConfigPage = props => {
<EditTwoTone /> 查看/编辑网站配置 <EditTwoTone /> 查看/编辑网站配置
</span> </span>
<MenuConfig <MenuConfig
menu={tabPaneItem?.children.find( menu={tabPaneItem?.children.find(w => w.menuType === 'Web4MenuRoot')}
w => w.menuType === 'Web4MenuRoot',
)}
onUpdate={handleUpdateOnMenuChange} onUpdate={handleUpdateOnMenuChange}
configFiles={configFiles} configFiles={configFiles}
updateMenuTree={updateMenuTree} updateMenuTree={updateMenuTree}
......
import React, { useEffect } from 'react';
import { Modal, Form, Button, Input, Space } from 'antd';
import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
const ParmarModal = props => {
const { pageUrl, visible, handleCancel, parmarCallBack } = props;
const [form] = Form.useForm();
useEffect(() => {
if (visible) {
// 给url通过字符串分割成表单需要的数据形式
let parma = pageUrl
.split('|')[1]
?.split('&')
?.map(item => ({ key: item.split('=')[0], value: item.split('=')[1] }));
form.setFieldsValue({ parmars: parma });
} else {
// 关闭弹窗清除表单数据
form.resetFields();
}
}, [visible]);
// 保存
const onFinish = () => {
form.validateFields().then(validate => {
if (validate) {
console.log(validate, 'validate');
let parma = form
.getFieldValue('parmars')
.map(item => `${item.key}=${item.value}`)
.join('&');
console.log(parma, 'parma');
parmarCallBack(`${pageUrl.split('|')[0]}|${parma}`);
}
});
};
return (
<div>
<Modal
title="参数配置"
visible={visible}
onOk={onFinish}
onCancel={handleCancel}
maskClosable={false}
destroyOnClose
centered
>
<div style={{ maxHeight: '400px', overflowY: 'scroll', marginBottom: '10px' }}>
<Form name="form" form={form} labelCol={{ span: 7 }}>
<Form.List name="parmars">
{(fields, { add, remove }) => (
<>
{fields.map(({ key, name, fieldKey, ...restField }) => (
<Space
key={key}
style={{ display: 'flex', marginBottom: 8, justifyContent: 'center' }}
align="baseline"
>
<Form.Item
{...restField}
name={[name, 'key']}
fieldKey={[fieldKey, 'key']}
validateTrigger={['onChange', 'onBlur']}
rules={[
{ required: true, message: '请填写参数名' },
{
validator: () => {
// 验证参数名不能重复
const allKey = form
.getFieldsValue()
.parmars.map(item => (item ? item.key : ''));
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}
name={[name, 'value']}
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: '375px', marginLeft: '30px' }}
type="dashed"
onClick={() => add()}
block
icon={<PlusOutlined />}
>
添加参数
</Button>
</Form.Item>
</>
)}
</Form.List>
</Form>
</div>
</Modal>
</div>
);
};
export default ParmarModal;
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Form, Input, Button, Row, Col, Select, Radio, Checkbox } from 'antd'; import {
Form,
Input,
Button,
Row,
Col,
Select,
Radio,
Checkbox,
message,
notification,
} from 'antd';
import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
import styles from './addForm.less'; import styles from './addForm.less';
import PicturesWall from '@/components/Upload/index'; import PicturesWall from '@/components/Upload/index';
import EditeConfigWrapper from './editConfigFileWrapper'; import EditeConfigWrapper from './editConfigFileWrapper';
import CheckList from './checkBox'; import CheckList from './checkBox';
import ParmarModal from './ParmarModal';
const { Item } = Form; const { Item } = Form;
const { Option } = Select; const { Option } = Select;
...@@ -18,10 +31,11 @@ const EditForm = props => { ...@@ -18,10 +31,11 @@ const EditForm = props => {
} = props; } = props;
const [form] = Form.useForm(); const [form] = Form.useForm();
const [otherForm] = Form.useForm(); const [otherForm] = Form.useForm();
const [showParmarModal, setShowParmarModal] = useState(false);
const layout = { const layout = {
layout: 'horizontal', layout: 'horizontal',
labelCol: { span: 2 }, labelCol: { span: 3 },
wrapperCol: { span: 21, offset: 0 }, wrapperCol: { span: 21 },
}; };
// 回显表单 // 回显表单
useEffect(() => { useEffect(() => {
...@@ -47,6 +61,15 @@ const EditForm = props => { ...@@ -47,6 +61,15 @@ const EditForm = props => {
const onFinish = val => { const onFinish = val => {
submit(); submit();
}; };
// 添加功能路劲参数
const addParama = () => {
console.log(form.getFieldValue('pageUrl'));
if (!form.getFieldValue('pageUrl')) {
notification.error({ message: '提示', duration: 3, description: '请先填写功能路径' });
return;
}
setShowParmarModal(true);
};
const radioChange = e => {}; const radioChange = e => {};
return ( return (
<div style={{ marginTop: '10px' }}> <div style={{ marginTop: '10px' }}>
...@@ -97,8 +120,8 @@ const EditForm = props => { ...@@ -97,8 +120,8 @@ const EditForm = props => {
</Radio.Group> </Radio.Group>
</Item> </Item>
<Item <Item
label="功能路径"
name="pageUrl" name="pageUrl"
label="功能路径"
rules={[ rules={[
{ {
required: true, required: true,
...@@ -106,16 +129,20 @@ const EditForm = props => { ...@@ -106,16 +129,20 @@ const EditForm = props => {
}, },
]} ]}
> >
<div style={{ display: 'flex' }}>
<Item name="pageUrl" style={{ marginBottom: 0, width: '100%' }}>
<Input placeholder="请输入功能路径" /> <Input placeholder="请输入功能路径" />
</Item> </Item>
<Button onClick={addParama}>添加参数</Button>
</div>
</Item>
<Item label="配置文件" name="config"> <Item label="配置文件" name="config">
<EditeConfigWrapper> <EditeConfigWrapper>
<Select <Select
allowClear allowClear
showSearch showSearch
filterOption={(input, option) => filterOption={(input, option) =>
option.children.toLowerCase().indexOf(input.toLowerCase()) >= option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
0
} }
> >
{configFiles.map(c => ( {configFiles.map(c => (
...@@ -126,11 +153,7 @@ const EditForm = props => { ...@@ -126,11 +153,7 @@ const EditForm = props => {
</Select> </Select>
</EditeConfigWrapper> </EditeConfigWrapper>
</Item> </Item>
<CheckList <CheckList info={info} nodeType={nodeType} valueCallback={valueCallback} />
info={info}
nodeType={nodeType}
valueCallback={valueCallback}
/>
<Item wrapperCol={{ offset: 10 }} style={{ marginTop: '20px' }}> <Item wrapperCol={{ offset: 10 }} style={{ marginTop: '20px' }}>
<Button type="primary" htmlType="submit"> <Button type="primary" htmlType="submit">
提交 提交
...@@ -175,6 +198,15 @@ const EditForm = props => { ...@@ -175,6 +198,15 @@ const EditForm = props => {
</Item> </Item>
</Form> </Form>
)} )}
<ParmarModal
pageUrl={form.getFieldValue('pageUrl')}
handleCancel={() => setShowParmarModal(false)}
visible={showParmarModal}
parmarCallBack={url => {
form.setFieldsValue({ pageUrl: url });
setShowParmarModal(false);
}}
/>
</div> </div>
); );
}; };
......
...@@ -29,15 +29,7 @@ import { ...@@ -29,15 +29,7 @@ import {
} from '@/services/webConfig/api'; } from '@/services/webConfig/api';
const MiniMenu = props => { const MiniMenu = props => {
const { const { menu, configFiles, subSystemValue, updateMenuTree, userMode, webid, productList } = props;
menu,
configFiles,
subSystemValue,
updateMenuTree,
userMode,
webid,
productList,
} = props;
const [flag, setFlag] = useState(1); // 刷新标志 const [flag, setFlag] = useState(1); // 刷新标志
const [loading, setLoading] = useState(false); // 加载 const [loading, setLoading] = useState(false); // 加载
const [menuID, setMenuID] = useState(''); // 选中的树ID const [menuID, setMenuID] = useState(''); // 选中的树ID
...@@ -109,8 +101,7 @@ const MiniMenu = props => { ...@@ -109,8 +101,7 @@ const MiniMenu = props => {
</div> </div>
), ),
key: obj.menuID, key: obj.menuID,
icon: icon: obj.menuType === 'Web4MenuGroup' ? <FolderFilled /> : <FileOutlined />,
obj.menuType === 'Web4MenuGroup' ? <FolderFilled /> : <FileOutlined />,
menuType: obj.menuType, menuType: obj.menuType,
children: hasChild ? obj.children.map(i => mapTree(i)) : [], children: hasChild ? obj.children.map(i => mapTree(i)) : [],
}; };
...@@ -244,9 +235,7 @@ const MiniMenu = props => { ...@@ -244,9 +235,7 @@ const MiniMenu = props => {
if (isSite) { if (isSite) {
url = val; url = val;
} else { } else {
url = localStorage.getItem('pd2-baseUrl') url = localStorage.getItem('pd2-baseUrl') ? localStorage.getItem('pd2-baseUrl') + val : val;
? localStorage.getItem('pd2-baseUrl') + val
: val;
} }
return url; return url;
}; };
...@@ -398,9 +387,7 @@ const MiniMenu = props => { ...@@ -398,9 +387,7 @@ const MiniMenu = props => {
.filter(item => item.id === 'Web4SingleStation') .filter(item => item.id === 'Web4SingleStation')
.map(r => r.children.filter(i => i.id === webid)) .map(r => r.children.filter(i => i.id === webid))
.flat(2); .flat(2);
let arr2 = let arr2 = arr[0].children.find(item => item.text === '菜单管理').children || [];
arr[0].children.find(item => item.text === '菜单管理').children ||
[];
setMenuList(arr2 || []); setMenuList(arr2 || []);
} }
}) })
...@@ -413,8 +400,7 @@ const MiniMenu = props => { ...@@ -413,8 +400,7 @@ const MiniMenu = props => {
const dropKey = infos.node.key; const dropKey = infos.node.key;
const dragKey = infos.dragNode.key; const dragKey = infos.dragNode.key;
const dropPos = infos.node.pos.split('-'); const dropPos = infos.node.pos.split('-');
const dropPosition = const dropPosition = infos.dropPosition - Number(dropPos[dropPos.length - 1]);
infos.dropPosition - Number(dropPos[dropPos.length - 1]);
const data = [...menuList]; const data = [...menuList];
// 找到拖拽的元素 // 找到拖拽的元素
...@@ -632,10 +618,7 @@ const MiniMenu = props => { ...@@ -632,10 +618,7 @@ const MiniMenu = props => {
valueCallback={valueCallback} valueCallback={valueCallback}
/> />
) : ( ) : (
<Empty <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="当前未选中菜单" />
image={Empty.PRESENTED_IMAGE_SIMPLE}
description="当前未选中菜单"
/>
)} )}
</div> </div>
<ImportOrExport <ImportOrExport
......
...@@ -180,9 +180,11 @@ export const getDefaultGetWebconfig = ({ ...@@ -180,9 +180,11 @@ export const getDefaultGetWebconfig = ({
formType: ITEM_TYPE.SELECT, formType: ITEM_TYPE.SELECT,
placeholder: '请选择产品类型', placeholder: '请选择产品类型',
options: products.map(t => ({ options: products.map(t => ({
value: t.ProductName, value: t.PackageName,
key: t.PackageName,
title: t.ProductName,
label: t.ProductName,
children: t.ProductName, children: t.ProductName,
key: t.ID,
})), })),
onDropdownVisibleChange: onGetProduct, onDropdownVisibleChange: onGetProduct,
showSearch: false, showSearch: false,
...@@ -354,8 +356,7 @@ export const getDefaultGetWebconfig = ({ ...@@ -354,8 +356,7 @@ export const getDefaultGetWebconfig = ({
}; };
if (initialValues) { if (initialValues) {
Object.keys(config).forEach(k => { Object.keys(config).forEach(k => {
config[k].initialValue = config[k].initialValue = typeof initialValues[k] !== 'undefined' ? initialValues[k] : '';
typeof initialValues[k] !== 'undefined' ? initialValues[k] : '';
// if (k === 'alarmWays') { // if (k === 'alarmWays') {
// config[k].initialValue = config[k].initialValue.split(','); // config[k].initialValue = config[k].initialValue.split(',');
// } // }
......
...@@ -263,8 +263,7 @@ export default { ...@@ -263,8 +263,7 @@ export default {
{ {
path: '/platformCenter/emq', path: '/platformCenter/emq',
name: '宿主管理', name: '宿主管理',
url: url: '/web4/?widget=product/oms/MqttConfig/MqttConfig.js|hideMap=true',
'/web4/?widget=product/oms/MqttConfig/MqttConfig.js|hideMap=true',
component: HostManager, component: HostManager,
}, },
......
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