Commit 621d0181 authored by 邓超's avatar 邓超

Merge branch 'master' of https://g.civnet.cn:8443/ReactWeb5/maintenance

# Conflicts: # src/pages/bsmanager/workOrder/incident/incident.jsx # src/pages/bsmanager/workOrder/incident/incident.less
parents c7b316cc 29a0ec69
Pipeline #43631 skipped with stages
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, Checkbox, Divider, notification, Row } from 'antd'; import { Form, Modal, Input, Select, Checkbox, Divider, notification, Row } from 'antd';
import { import { createTable, loadTableFields, addFields } from '@/services/tablemanager/tablemanager';
createTable, loadTableFields, addFields
} from '@/services/tablemanager/tablemanager'
import styles from './index.less' import styles from './index.less';
const { Option } = Select; const { Option } = Select;
const CheckboxGroup = Checkbox.Group; const CheckboxGroup = Checkbox.Group;
const editor = props => { const editor = props => {
const { callBackSubmit = () => { }, type, visible } = props; const { callBackSubmit = () => {}, type, visible } = props;
const [reminder, setReminder] = useState(' 事件表会默认创建如下字段:事件编号、事件状态、事件名称上报站点、处理站点、上报人名称、上报人部分、上报时间、现场图片、现场录音、坐标位置、更新时间、更新状态、是否置顶') const [reminder, setReminder] = useState(
const [loading, setLoading] = useState(false); ' 事件表会默认创建如下字段:事件编号、事件状态、事件名称上报站点、处理站点、上报人名称、上报人部分、上报时间、现场图片、现场录音、坐标位置、更新时间、更新状态、是否置顶',
const [isModalVisible, setIsModalVisible] = useState(false); );
const [form] = Form.useForm(); const [loading, setLoading] = useState(false);
const { Item } = Form; const [isModalVisible, setIsModalVisible] = useState(false);
const [checkedList, setCheckedList] = useState([]);//选中的复选框内容 const [form] = Form.useForm();
const [plainOptions, setPlainOptions] = useState([]);//复选框所有内容 const { Item } = Form;
const [indeterminate, setIndeterminate] = useState(true); const [checkedList, setCheckedList] = useState([]); // 选中的复选框内容
const [isVisible, setIsVisible] = useState(true); const [plainOptions, setPlainOptions] = useState([]); // 复选框所有内容
const [checkAll, setCheckAll] = useState(false); const [indeterminate, setIndeterminate] = useState(true);
const [chartName, setChartName] = useState('');//附加表名称 const [isVisible, setIsVisible] = useState(true);
const [checkAll, setCheckAll] = useState(false);
const [chartName, setChartName] = useState(''); // 附加表名称
const onChange = list => { const onChange = list => {
setCheckedList(list); setCheckedList(list);
setIndeterminate(!!list.length && list.length < plainOptions.length); setIndeterminate(!!list.length && list.length < plainOptions.length);
setCheckAll(list.length === plainOptions.length); setCheckAll(list.length === plainOptions.length);
}; };
const onCheckAllChange = e => { const onCheckAllChange = e => {
setCheckedList(e.target.checked ? plainOptions : []); setCheckedList(e.target.checked ? plainOptions : []);
setIndeterminate(false); setIndeterminate(false);
setCheckAll(e.target.checked); setCheckAll(e.target.checked);
}; };
// 提交 // 提交
const onSubmit = () => { const onSubmit = () => {
form.validateFields().then(validate => { form.validateFields().then(validate => {
if (validate) { if (validate) {
setLoading(true); setLoading(true);
let obj = form.getFieldsValue(); let obj = form.getFieldsValue();
obj.tableName = obj.tableType.substr(0, obj.tableType.length - 1) + '_' + obj.tableName; obj.tableName = obj.tableType.substr(0, obj.tableType.length - 1) + '_' + obj.tableName;
createTable({ createTable({
...obj ...obj,
}).then(res => { })
setLoading(false); .then(res => {
if (res.msg === "Ok") { setLoading(false);
notification.success({ if (res.msg === 'Ok') {
message: '提示', notification.success({
duration: 1, message: '提示',
description: '建表成功', duration: 1,
}); description: '建表成功',
setIsVisible(false) });
setChartName(res.data.tableInfo.Name) setIsVisible(false);
loadTableFields({ tableName: res.data.tableInfo.Name }).then(response => { setChartName(res.data.tableInfo.Name);
if (response.data.root.length) { loadTableFields({ tableName: res.data.tableInfo.Name }).then(response => {
let arr = [], newArr = [] if (response.data.root.length) {
response.data.root.map(item => { let arr = [],
newArr.push(item.fieldName) newArr = [];
if (item.isCheck) { response.data.root.map(item => {
arr.push(item.fieldName) newArr.push(item.fieldName);
} if (item.isCheck) {
}) arr.push(item.fieldName);
setPlainOptions(newArr)
setCheckedList(arr)
}
setIsModalVisible(true)
})
} else {
form.resetFields();
callBackSubmit();
notification.error({
message: '提示',
duration: 3,
description: res.msg,
});
} }
}).catch(err => { });
console.log('err', err); setPlainOptions(newArr);
notification.error({ setCheckedList(arr);
message: '提示',
duration: 3,
description: '新增失败',
});
setLoading(false);
});
}
});
};
useEffect(() => {
if (type != '') {
form.setFieldsValue({ tableType: '事件表' });
}
}, [visible]);
const handleOk = () => {
if (chartName != '') {
addFields({
tableName: chartName,
fieldNames: checkedList.join(',')
}).then(res => {
if (res.msg === "Ok" || res.msg === "") {
notification.success({
message: '提示',
duration: 1,
description: '附加字段添加成功',
});
setIsModalVisible(false)
form.resetFields();
callBackSubmit();
}
else {
notification.error({
message: '提示',
duration: 3,
description: res.msg,
});
} }
}).catch(err => { setIsModalVisible(true);
console.log('err', err); });
}) } else {
} form.resetFields();
else { callBackSubmit();
notification.success({ notification.error({
message: '提示', message: '提示',
duration: 1, duration: 3,
description: '表名称没添加', description: res.msg,
});
}
})
.catch(err => {
console.log('err', err);
notification.error({
message: '提示',
duration: 3,
description: '新增失败',
}); });
} setLoading(false);
});
}
});
};
useEffect(() => {
if (type != '') {
form.setFieldsValue({ tableType: '事件表' });
} }
const handleCancel = () => { }, [visible]);
setIsModalVisible(false) const handleOk = () => {
if (chartName != '') {
addFields({
tableName: chartName,
fieldNames: checkedList.join(','),
})
.then(res => {
if (res.msg === 'Ok' || res.msg === '') {
notification.success({
message: '提示',
duration: 1,
description: '附加字段添加成功',
});
setIsModalVisible(false);
form.resetFields();
callBackSubmit();
} else {
notification.error({
message: '提示',
duration: 3,
description: res.msg,
});
}
})
.catch(err => {
console.log('err', err);
});
} else {
notification.success({
message: '提示',
duration: 1,
description: '表名称没添加',
});
} }
const changeChart = (value) => { };
let str = '' const handleCancel = () => {
switch (value) { setIsModalVisible(false);
case '事件表': };
str = ' 事件表默认创建如下字段:事件编号、事件状态、事件名称、上报站点、处理站点、上报人名称、上报人部分、上报时间、现场图片、现场录音、坐标位置、更新时间、更新状态、是否置顶'; const changeChart = value => {
break; let str = '';
case '工单表': switch (value) {
str = '工单表默认创建如下字段:工单编号'; case '事件表':
break; str =
case '台账表': ' 事件表默认创建如下字段:事件编号、事件状态、事件名称、上报站点、处理站点、上报人名称、上报人部分、上报时间、现场图片、现场录音、坐标位置、更新时间、更新状态、是否置顶';
str = '台账表默认创建如下字段:所属站点、录入时间、是否删除'; break;
break; case '工单表':
case '设备表': str = '工单表默认创建如下字段:工单编号';
str = '设备表默认创建如下字段:编码、父设备编码、GIS编号、设备名称、所属站点、坐标位置、风貌图、视频缩略图、第三方编码、录入时间、是否删除'; break;
break; case '台账表':
case '反馈表': str = '台账表默认创建如下字段:所属站点、录入时间、是否删除';
str ='反馈表默认创建如下字段:编码、设备编码、录入时间、是否删除'; break;
break; case '设备表':
default : str =
str = ' 事件表默认创建如下字段:事件编号、事件状态、事件名称、上报站点、处理站点、上报人名称、上报人部分、上报时间、现场图片、现场录音、坐标位置、更新时间、更新状态、是否置顶'; '设备表默认创建如下字段:编码、父设备编码、GIS编号、设备名称、所属站点、坐标位置、风貌图、视频缩略图、第三方编码、录入时间、是否删除';
} break;
setReminder(str) case '反馈表':
str = '反馈表默认创建如下字段:编码、设备编码、录入时间、是否删除';
break;
default:
str =
' 事件表默认创建如下字段:事件编号、事件状态、事件名称、上报站点、处理站点、上报人名称、上报人部分、上报时间、现场图片、现场录音、坐标位置、更新时间、更新状态、是否置顶';
} }
const layout = { setReminder(str);
layout: 'horizontal', };
labelCol: { const layout = {
span: 4, layout: 'horizontal',
}, labelCol: {
wrapperCol: { span: 4,
span: 16, },
}, wrapperCol: {
}; span: 19,
},
};
return (
<>
<Modal
title='建表'
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '150px' }}
width="700px"
destroyOnClose
maskClosable={false}
cancelText="取消"
okText="确认"
visible={isVisible}
{...props}
onOk={() => onSubmit()}
confirmLoading={loading}
forceRender={true}
getContainer={false}
>
<Form form={form} {...layout} >
<Item
label="【特别提示】"
>
<span>此处仅建立基础表和必要字段,额外字段需通过其他方式进行添加,比如使用Navicat工具等。</span>
</Item>
<Item
label="建表类型"
name="tableType"
rules={[{ required: true, message: '请输入表名' }]}
>
<Select onChange={changeChart}>
<Select.Option value='事件表'>事件表</Select.Option>
<Select.Option value='工单表'>工单表</Select.Option>
<Select.Option value='台账表'>台账表</Select.Option>
<Select.Option value='设备表'>设备表</Select.Option>
<Select.Option value='反馈表'>反馈表</Select.Option>
</Select>
</Item>
<Item
label="表名"
name="tableName"
rules={[{ required: true, message: '请以"模块_表名"的个数输入' }]}
>
<Input placeholder='请以"模块_表名"的个数输入' allowClear />
</Item>
<Item
label="别名"
name="alias"
>
<Input placeholder="请输入别名,通常用作该表的备注" allowClear />
</Item>
<Item
label=" "
colon={false}
>
<span>{reminder}</span>
</Item>
</Form>
</Modal>
<Modal title="附加字段" visible={isModalVisible} onOk={handleOk} onCancel={handleCancel}>
<Checkbox indeterminate={indeterminate} onChange={onCheckAllChange} checked={checkAll}>
选择所有
</Checkbox>
<Divider />
<div className={styles.field}>
<Row>
{
plainOptions.length ? <CheckboxGroup options={plainOptions} value={checkedList} onChange={onChange} /> : ''
}
</Row>
</div>
</Modal> return (
</> <>
); <Modal
title="建表"
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '150px' }}
width="700px"
destroyOnClose
maskClosable={false}
cancelText="取消"
okText="确认"
visible={isVisible}
{...props}
onOk={() => onSubmit()}
confirmLoading={loading}
forceRender={true}
getContainer={false}
>
<Form form={form} {...layout}>
<Item label="【特别提示】">
<span>
此处仅建立基础表和必要字段,额外字段需通过其他方式进行添加,比如使用Navicat工具等。
</span>
</Item>
<Item
label="建表类型"
name="tableType"
rules={[{ required: true, message: '请输入表名' }]}
>
<Select onChange={changeChart}>
<Select.Option value="事件表">事件表</Select.Option>
<Select.Option value="工单表">工单表</Select.Option>
<Select.Option value="台账表">台账表</Select.Option>
<Select.Option value="设备表">设备表</Select.Option>
<Select.Option value="反馈表">反馈表</Select.Option>
</Select>
</Item>
<Item
label="表名"
name="tableName"
rules={[{ required: true, message: '请以"模块_表名"的个数输入' }]}
>
<Input placeholder='请以"模块_表名"的个数输入' allowClear />
</Item>
<Item label="别名" name="alias">
<Input placeholder="请输入别名,通常用作该表的备注" allowClear />
</Item>
<Item label=" " colon={false}>
<span>{reminder}</span>
</Item>
</Form>
</Modal>
<Modal title="附加字段" visible={isModalVisible} onOk={handleOk} onCancel={handleCancel}>
<Checkbox indeterminate={indeterminate} onChange={onCheckAllChange} checked={checkAll}>
选择所有
</Checkbox>
<Divider />
<div className={styles.field}>
<Row>
{plainOptions.length ? (
<CheckboxGroup options={plainOptions} value={checkedList} onChange={onChange} />
) : (
''
)}
</Row>
</div>
</Modal>
</>
);
}; };
export default editor; export default editor;
...@@ -11,8 +11,8 @@ const AddModal = props => { ...@@ -11,8 +11,8 @@ const AddModal = props => {
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [form] = Form.useForm(); const [form] = Form.useForm();
const { Item } = Form; const { Item } = Form;
const [plainOptions, setPlainOptions] = useState([]); //复选框所有内容 const [plainOptions, setPlainOptions] = useState([]); // 复选框所有内容
const [checkedList, setCheckedList] = useState([]); //选中的复选框内容 const [checkedList, setCheckedList] = useState([]); // 选中的复选框内容
const [indeterminate, setIndeterminate] = useState(true); const [indeterminate, setIndeterminate] = useState(true);
const [checkAll, setCheckAll] = useState(false); const [checkAll, setCheckAll] = useState(false);
...@@ -115,10 +115,10 @@ const AddModal = props => { ...@@ -115,10 +115,10 @@ const AddModal = props => {
const layout = { const layout = {
layout: 'horizontal', layout: 'horizontal',
labelCol: { labelCol: {
span: 4, span: 3,
}, },
wrapperCol: { wrapperCol: {
span: 18, span: 20,
}, },
}; };
......
...@@ -49,10 +49,7 @@ const AddModal = props => { ...@@ -49,10 +49,7 @@ const AddModal = props => {
if (res.data.root && res.data.root.length) { if (res.data.root && res.data.root.length) {
form.setFieldsValue({ form.setFieldsValue({
...res.data.root[0], ...res.data.root[0],
tableStyle: tableStyle: res.data.root[0].tableStyle === '' ? '大' : res.data.root[0].tableStyle,
res.data.root[0].tableStyle === ''
? '大'
: res.data.root[0].tableStyle,
}); });
setTableID(res.data.root[0].tableID); setTableID(res.data.root[0].tableID);
} }
...@@ -67,10 +64,10 @@ const AddModal = props => { ...@@ -67,10 +64,10 @@ const AddModal = props => {
const layout = { const layout = {
layout: 'horizontal', layout: 'horizontal',
labelCol: { labelCol: {
span: 4, span: 3,
}, },
wrapperCol: { wrapperCol: {
span: 17, span: 20,
}, },
}; };
...@@ -82,7 +79,7 @@ const AddModal = props => { ...@@ -82,7 +79,7 @@ const AddModal = props => {
width="700px" width="700px"
destroyOnClose destroyOnClose
maskClosable={false} maskClosable={false}
centered ={true} centered={true}
cancelText="取消" cancelText="取消"
okText="确认" okText="确认"
{...props} {...props}
...@@ -93,21 +90,13 @@ const AddModal = props => { ...@@ -93,21 +90,13 @@ const AddModal = props => {
> >
{visible && ( {visible && (
<Form form={form} {...layout}> <Form form={form} {...layout}>
<Item <Item label="表名" name="tableName" rules={[{ required: true, message: '请输入表名' }]}>
label="表名"
name="tableName"
rules={[{ required: true, message: '请输入表名' }]}
>
<Input placeholder="请输入表名" allowClear /> <Input placeholder="请输入表名" allowClear />
</Item> </Item>
<Item label="别名" name="tableAlias"> <Item label="别名" name="tableAlias">
<Input placeholder="请输入别名" allowClear /> <Input placeholder="请输入别名" allowClear />
</Item> </Item>
<Item <Item label="样式" name="tableStyle" rules={[{ required: true, message: '请选择样式' }]}>
label="样式"
name="tableStyle"
rules={[{ required: true, message: '请选择样式' }]}
>
<Radio.Group> <Radio.Group>
<Radio value="大">大(3)</Radio> <Radio value="大">大(3)</Radio>
<Radio value="中">中(4)</Radio> <Radio value="中">中(4)</Radio>
......
.field{ .field {
width:100%; width: 100%;
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
flex-wrap: wrap; flex-wrap: wrap;
max-height: 20rem; max-height: 20rem;
overflow-y: scroll;
.ant-card {
width: 90.5%;
margin-left: 40px;
}
.ant-card-head-title {
flex: none;
}
.ant-card-extra {
margin-left: 0.2rem;
}
.ant-card-body {
// padding: 0 ;
height: 15rem;
overflow-y: scroll; overflow-y: scroll;
.ant-card{ }
width: 83%;
margin-left: 4rem;
}
.ant-card-head-title{
flex: none;
}
.ant-card-extra{
margin-left: 0.2rem;
}
.ant-card-body{
// padding: 0 ;
height: 15rem;
overflow-y: scroll;
}
} }
.paneTitle{ .paneTitle {
font-weight: bold; font-weight: bold;
font-size: 18px; font-size: 18px;
margin: 0 0 0.5rem 4rem; margin: 0 0 0.5rem 38px;
} }
.listEvent{ .listEvent {
display: flex; display: flex;
} }
.cardList{ .cardList {
.ant-card-body{ .ant-card-body {
overflow-y:none !important; overflow-y: none !important;
} }
} }
.unit{ .unit {
display: flex; display: flex;
margin-left: 1.1rem; margin-left: 1.1rem;
align-items: center; align-items: center;
} }
.listCard{ .listCard {
display: flex; display: flex;
.cardItem{ .cardItem {
width: 50%; width: 50%;
padding: 0.5rem; padding: 0.5rem;
} }
.cardContent{ .cardContent {
height:35rem; height: 35rem;
overflow-y: scroll; overflow-y: scroll;
width: 22rem; width: 22rem;
} }
.cardItemData{ .cardItemData {
padding: 1rem; padding: 1rem;
border: 1px solid #b5b8c8; border: 1px solid #b5b8c8;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
} }
.sortable-ghost { .sortable-ghost {
border-bottom: 2px dashed #1890ff; border-bottom: 2px dashed #1890ff;
} }
.doctorTable { .doctorTable {
margin-bottom: 16px; margin-bottom: 16px;
table { table {
width: 100%; width: 100%;
td { td {
padding: 6px; padding: 6px;
border: 1px solid #e8e8e8; border: 1px solid #e8e8e8;
}
thead {
tr {
font-weight: 600;
background: #fafafa;
} }
thead { td {
tr { width: 12rem;
font-weight: 600;
background: #FAFAFA;
}
td{
width: 12rem;
}
} }
tbody{ }
tr:hover{ tbody {
background-color:#ededed ; tr:hover {
} background-color: #ededed;
} }
} }
} }
.defaultTile{
background-color:transparent ;
} }
.activeTile{ .defaultTile {
background-color:#dfe8f6 ; background-color: transparent;
} }
.activeTile {
background-color: #dfe8f6;
}
tr.drop-over-downward td { tr.drop-over-downward td {
border-bottom: 2px dashed #1890ff; border-bottom: 2px dashed #1890ff;
} }
tr.drop-over-upward td { tr.drop-over-upward td {
border-top: 2px dashed #1890ff; border-top: 2px dashed #1890ff;
} }
.clickRowStyle{ .clickRowStyle {
background: #cfe7fd; background: #cfe7fd;
} }
\ No newline at end of file
...@@ -120,7 +120,7 @@ const incident = () => { ...@@ -120,7 +120,7 @@ const incident = () => {
title: '权限', title: '权限',
dataIndex: 'roles', dataIndex: 'roles',
key: 'roles', key: 'roles',
width: 50, width: 80,
render: record => ( render: record => (
<Tooltip placement="topLeft" title={record}> <Tooltip placement="topLeft" title={record}>
{record} {record}
...@@ -131,7 +131,7 @@ const incident = () => { ...@@ -131,7 +131,7 @@ const incident = () => {
title: '流程', title: '流程',
dataIndex: 'flowCount', dataIndex: 'flowCount',
key: 'flowCount', key: 'flowCount',
width: 50, width: 80,
render: record => ( render: record => (
<Tooltip placement="topLeft" title={record}> <Tooltip placement="topLeft" title={record}>
{record} {record}
...@@ -188,17 +188,17 @@ const incident = () => { ...@@ -188,17 +188,17 @@ const incident = () => {
dataIndex: 'outFields', dataIndex: 'outFields',
key: 'outFields', key: 'outFields',
align: 'center', align: 'center',
width: 100, width: 80,
render: text => ( render: text => (
<span <span
style={{ style={{
display: 'inline-block', display: 'inline-block',
width: '80px', width: '60px',
color: Number(text) > 0 ? 'red' : '', color: Number(text) > 0 ? 'red' : '',
backgroundColor: Number(text) > 0 ? 'yellow' : '', backgroundColor: Number(text) > 0 ? 'yellow' : '',
}} }}
> >
{text} {text == 0 ? '(无)' : text}
</span> </span>
), ),
}, },
......
...@@ -39,8 +39,6 @@ import { ...@@ -39,8 +39,6 @@ import {
DataDictionaryChangeOrder, DataDictionaryChangeOrder,
} from '@/services/dataCenter/api'; } from '@/services/dataCenter/api';
import styles from './WebDic.less'; import styles from './WebDic.less';
import { useHistory, Link } from 'react-router-dom';
import map from '@/pages/user/login/components/Login/map';
import { GetMetaData } from '@/services/gis/gis'; import { GetMetaData } from '@/services/gis/gis';
import DragTable from '@/components/DragTable/DragTable'; import DragTable from '@/components/DragTable/DragTable';
...@@ -62,14 +60,12 @@ const WebDic = () => { ...@@ -62,14 +60,12 @@ const WebDic = () => {
const [editVisible, setEditVisible] = useState(false); // 编辑二级条目 const [editVisible, setEditVisible] = useState(false); // 编辑二级条目
const [editVisible1, setEditVisible1] = useState(false); // 编辑一级条目 const [editVisible1, setEditVisible1] = useState(false); // 编辑一级条目
const [editForm] = Form.useForm(); const [editForm] = Form.useForm();
const [searchVisible, setSearchVisible] = useState(false);
const [searchWord, setSearchWord] = useState(''); // 关键字 const [searchWord, setSearchWord] = useState(''); // 关键字
const { Search } = Input; const { Search } = Input;
const [files, setFiles] = useState(''); const [files, setFiles] = useState('');
const [flag, setFlag] = useState(0); const [flag, setFlag] = useState(0);
const [flag1, setFlag1] = useState(0); // 搜索框数据是否刷新 const [flag1, setFlag1] = useState(0); // 搜索框数据是否刷新
const [isloading, setIsloading] = useState(false); const [isloading, setIsloading] = useState(false);
const history = useHistory();
const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式 const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式
const [InPutVisible, setInPutVisible] = useState(false); const [InPutVisible, setInPutVisible] = useState(false);
...@@ -269,7 +265,6 @@ const WebDic = () => { ...@@ -269,7 +265,6 @@ const WebDic = () => {
// 根据orderTable值改变flowIDs // 根据orderTable值改变flowIDs
useEffect(() => { useEffect(() => {
let ids = ''; let ids = '';
console.log(data);
data.forEach((item, index) => { data.forEach((item, index) => {
if (index === data.length - 1) { if (index === data.length - 1) {
ids += `${item.nodeID}`; ids += `${item.nodeID}`;
...@@ -277,9 +272,7 @@ const WebDic = () => { ...@@ -277,9 +272,7 @@ const WebDic = () => {
ids += `${item.nodeID},`; ids += `${item.nodeID},`;
} }
}); });
console.log(ids);
let bb = ids.split(','); let bb = ids.split(',');
console.log(bb);
setLoading(true); setLoading(true);
DataDictionaryChangeOrder(bb).then(res => { DataDictionaryChangeOrder(bb).then(res => {
setLoading(false); setLoading(false);
...@@ -287,7 +280,6 @@ const WebDic = () => { ...@@ -287,7 +280,6 @@ const WebDic = () => {
}, [data]); }, [data]);
useEffect(() => { useEffect(() => {
let ids = ''; let ids = '';
console.log(subData);
if (subData !== '') { if (subData !== '') {
subData.forEach((item, index) => { subData.forEach((item, index) => {
if (index === subData.length - 1) { if (index === subData.length - 1) {
...@@ -297,9 +289,7 @@ const WebDic = () => { ...@@ -297,9 +289,7 @@ const WebDic = () => {
} }
}); });
} }
console.log(ids);
let bb = ids.split(','); let bb = ids.split(',');
console.log(bb);
setIsloading(true); setIsloading(true);
DataDictionaryChangeOrder(bb).then(res => { DataDictionaryChangeOrder(bb).then(res => {
setIsloading(false); setIsloading(false);
...@@ -307,7 +297,6 @@ const WebDic = () => { ...@@ -307,7 +297,6 @@ const WebDic = () => {
}, [subData]); }, [subData]);
// 根据父节点nodeID(即parentID)获取子节点数据,一级条目parentID = -1 // 根据父节点nodeID(即parentID)获取子节点数据,一级条目parentID = -1
const getData = value => { const getData = value => {
console.log(value);
isLoadingShow(value, true); isLoadingShow(value, true);
GetDataDictionaryList({ nodeID: value }).then(resnew => { GetDataDictionaryList({ nodeID: value }).then(resnew => {
if (resnew.code === 0) { if (resnew.code === 0) {
...@@ -322,10 +311,6 @@ const WebDic = () => { ...@@ -322,10 +311,6 @@ const WebDic = () => {
// 是否首次加载 // 是否首次加载
if (value === null || value === '-1') { if (value === null || value === '-1') {
setData(res); setData(res);
// setOd(res)
console.log(res);
console.log(first);
if (first) { if (first) {
setSelect(res[0]); // 默认当前选中一级条目第一条 setSelect(res[0]); // 默认当前选中一级条目第一条
setSelectColor(res[0]); setSelectColor(res[0]);
...@@ -334,7 +319,6 @@ const WebDic = () => { ...@@ -334,7 +319,6 @@ const WebDic = () => {
getData(res[0].nodeID); // 拿到nodeID再次调用接口就回直接进入下面的循环,靠nodeID获取子节点二级条目 getData(res[0].nodeID); // 拿到nodeID再次调用接口就回直接进入下面的循环,靠nodeID获取子节点二级条目
} }
} else if (value) { } else if (value) {
console.log(res);
setSubData(res); // 设置二级条目,res为空[]时也要设置 setSubData(res); // 设置二级条目,res为空[]时也要设置
// setOd1(res) // setOd1(res)
} }
...@@ -584,9 +568,6 @@ const WebDic = () => { ...@@ -584,9 +568,6 @@ const WebDic = () => {
submitSearchUser(); submitSearchUser();
} }
if (select.parentID === '-1') { if (select.parentID === '-1') {
// setSubData([]);
console.log(select);
console.log(selectID);
if (select.nodeID === selectID) { if (select.nodeID === selectID) {
setSelectID(''); setSelectID('');
setSubData([]); setSubData([]);
...@@ -623,18 +604,15 @@ const WebDic = () => { ...@@ -623,18 +604,15 @@ const WebDic = () => {
}, },
accept: 'application/vnd.ms-excel', accept: 'application/vnd.ms-excel',
beforeUpload: file => { beforeUpload: file => {
console.log('filee', file);
setFiles(file.file); setFiles(file.file);
}, },
onChange(info) { onChange(info) {
let data; let data;
let mse; let mse;
console.log(info, 'info');
setFiles(info.file); setFiles(info.file);
if (info.file.status !== 'uploading') { if (info.file.status !== 'uploading') {
// eslint-disable-next-line array-callback-return // eslint-disable-next-line array-callback-return
info.fileList.map(item => { info.fileList.map(item => {
console.log(item.response);
data = item.response.code; data = item.response.code;
mse = item.response.msg; mse = item.response.msg;
}); });
...@@ -712,15 +690,11 @@ const WebDic = () => { ...@@ -712,15 +690,11 @@ const WebDic = () => {
// 拖拽回调函数 // 拖拽回调函数
const dragCallBack = value => { const dragCallBack = value => {
console.log(data);
console.log(value);
if (value) { if (value) {
setData(value); setData(value);
} }
}; };
const dragCallBack1 = e => { const dragCallBack1 = e => {
console.log(e);
console.log(subData);
if (e) { if (e) {
setSubData(e); setSubData(e);
} }
...@@ -919,7 +893,6 @@ const WebDic = () => { ...@@ -919,7 +893,6 @@ const WebDic = () => {
}); });
} }
arr.unshift(nodeName); arr.unshift(nodeName);
console.log(arr);
if (new Set(arr).size !== arr.length) { if (new Set(arr).size !== arr.length) {
// eslint-disable-next-line prefer-promise-reject-errors // eslint-disable-next-line prefer-promise-reject-errors
return Promise.reject('用户名重复'); return Promise.reject('用户名重复');
...@@ -956,7 +929,6 @@ const WebDic = () => { ...@@ -956,7 +929,6 @@ const WebDic = () => {
validator: (rule, value, callback) => { validator: (rule, value, callback) => {
const nodeName = addForm.getFieldsValue().nodeName1; // 第一项的nodeName const nodeName = addForm.getFieldsValue().nodeName1; // 第一项的nodeName
const nodeName1 = addForm.getFieldsValue(); const nodeName1 = addForm.getFieldsValue();
console.log(nodeName);
let result = nodeName1.users; let result = nodeName1.users;
let arr = []; let arr = [];
// eslint-disable-next-line array-callback-return // eslint-disable-next-line array-callback-return
...@@ -971,11 +943,8 @@ const WebDic = () => { ...@@ -971,11 +943,8 @@ const WebDic = () => {
if (nodeName !== undefined) { if (nodeName !== undefined) {
arr.unshift(nodeName); arr.unshift(nodeName);
} }
console.log(arr);
if (new Set(arr).size !== arr.length) { if (new Set(arr).size !== arr.length) {
arr = [...new Set(arr)]; arr = [...new Set(arr)];
console.log(arr);
callback('用户名重复'); callback('用户名重复');
} }
}, },
......
...@@ -50,13 +50,10 @@ const DatabaseConnectConfig = props => { ...@@ -50,13 +50,10 @@ const DatabaseConnectConfig = props => {
</Tabs> */} </Tabs> */}
<SQLServerTable /> <SQLServerTable />
<br />
<OracleTable /> <OracleTable />
<br />
<MongDBTable /> <MongDBTable />
<br />
<MySQLTable /> <MySQLTable />
</Card> </Card>
......
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, notification } from 'antd'; import { Form, Modal, Input, Select, notification } from 'antd';
import { import { AddConnString, EditConnString } from '@/services/database/api';
AddConnString,
EditConnString
} from '@/services/database/api';
const { Item } = Form; const { Item } = Form;
const { Option } = Select; const { Option } = Select;
...@@ -20,7 +17,7 @@ const AddModal = props => { ...@@ -20,7 +17,7 @@ const AddModal = props => {
let obj = form.getFieldsValue(); let obj = form.getFieldsValue();
if (type === 'add') { if (type === 'add') {
AddConnString({ AddConnString({
Type:'mongodb', Type: 'mongodb',
...obj, ...obj,
}) })
.then(res => { .then(res => {
...@@ -54,8 +51,8 @@ const AddModal = props => { ...@@ -54,8 +51,8 @@ const AddModal = props => {
const handleEdit = () => { const handleEdit = () => {
let obj = form.getFieldsValue(); let obj = form.getFieldsValue();
EditConnString({ EditConnString({
Type:'mongodb', Type: 'mongodb',
MongoDbType:'mongodb', MongoDbType: 'mongodb',
...obj, ...obj,
oldName: formObj.name, oldName: formObj.name,
}) })
...@@ -81,12 +78,12 @@ const AddModal = props => { ...@@ -81,12 +78,12 @@ const AddModal = props => {
}; };
const onFinish = value => {}; const onFinish = value => {};
const handleSelect = e => { const handleSelect = e => {
console.log(e) console.log(e);
if(e == '单实例'){ if (e == '单实例') {
form.setFieldsValue({port:27017}) form.setFieldsValue({ port: 27017 });
} }
if(e == '分片群'){ if (e == '分片群') {
form.setFieldsValue({port:30000}) form.setFieldsValue({ port: 30000 });
} }
e === '复制集' ? setShowReplicaSet(true) : setShowReplicaSet(false); e === '复制集' ? setShowReplicaSet(true) : setShowReplicaSet(false);
}; };
...@@ -96,20 +93,16 @@ const AddModal = props => { ...@@ -96,20 +93,16 @@ const AddModal = props => {
form.resetFields(); form.resetFields();
break; break;
case 'edit': case 'edit':
console.log(formObj.type) console.log(formObj.type);
formObj.type === '复制集' formObj.type === '复制集' ? setShowReplicaSet(true) : setShowReplicaSet(false);
? setShowReplicaSet(true)
: setShowReplicaSet(false);
form.setFieldsValue({ ...formObj }); form.setFieldsValue({ ...formObj });
form.setFieldsValue({MongoDbType:formObj.type}); form.setFieldsValue({ MongoDbType: formObj.type });
break; break;
default: default:
break; break;
} }
return () => { return () => {
form.getFieldsValue().type === '复制集' form.getFieldsValue().type === '复制集' ? setShowReplicaSet(true) : setShowReplicaSet(false);
? setShowReplicaSet(true)
: setShowReplicaSet(false);
}; };
}, [visible]); }, [visible]);
useEffect(() => {}, [type === 'edit']); useEffect(() => {}, [type === 'edit']);
...@@ -119,7 +112,7 @@ const AddModal = props => { ...@@ -119,7 +112,7 @@ const AddModal = props => {
span: 4, span: 4,
}, },
wrapperCol: { wrapperCol: {
span: 16, span: 19,
}, },
}; };
const selectArr = [ const selectArr = [
...@@ -169,25 +162,13 @@ const AddModal = props => { ...@@ -169,25 +162,13 @@ const AddModal = props => {
))} ))}
</Select> </Select>
</Item> </Item>
<Item <Item label="标签" name="name" rules={[{ required: true, message: '请输入标签' }]}>
label="标签"
name="name"
rules={[{ required: true, message: '请输入标签' }]}
>
<Input placeholder="请输入标签" allowClear /> <Input placeholder="请输入标签" allowClear />
</Item> </Item>
<Item <Item label="IP" name="ip" rules={[{ required: true, message: '请输入IP' }]}>
label="IP"
name="ip"
rules={[{ required: true, message: '请输入IP' }]}
>
<Input placeholder="请输入IP" allowClear /> <Input placeholder="请输入IP" allowClear />
</Item> </Item>
<Item <Item label="端口" name="port" rules={[{ required: true, message: '请输入端口号' }]}>
label="端口"
name="port"
rules={[{ required: true, message: '请输入端口号' }]}
>
<Input placeholder="请输入端口号" allowClear /> <Input placeholder="请输入端口号" allowClear />
</Item> </Item>
<Item <Item
......
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import ProTable from '@ant-design/pro-table'; // import ProTable from '@ant-design/pro-table';
import { Button, Tag, Popconfirm, notification } from 'antd'; import { Button, Tag, Popconfirm, notification, Table } from 'antd';
import { import {
getMongoDBConnString, getMongoDBConnString,
deleteConnString, deleteConnString,
...@@ -254,50 +254,53 @@ const MongDBTable = props => { ...@@ -254,50 +254,53 @@ const MongDBTable = props => {
]; ];
return ( return (
<> <>
<ProTable <div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: '10px' }}>
headerTitle="MongDB数据库" <div
style={{ fontWeight: 'bold', fontSize: '16px', marginLeft: '30x', marginBottom: '10px' }}
>
MongDB数据库
</div>
<Button
type="primary"
onClick={() => {
handleAdd();
}}
>
添加连接
</Button>
</div>
<Table
rowKey="key" rowKey="key"
search={false}
columns={columns} columns={columns}
bordered bordered
loading={tableLoading} loading={tableLoading}
dataSource={dataList} dataSource={dataList}
options={false} scroll={{ y: 400 }}
toolBarRender={() => [ // <Popconfirm
<Button // title={
type="primary" // <div>
onClick={() => { // <p>
handleAdd(); // 是否将confcenter、citytemp、buffile、log文件内容迁移至
}} // Mongodb数据库中(会覆盖重名文件)?
> // </p>
添加连接 // <p>(连接配置取标签mongodb)</p>
</Button>, // </div>
// <Popconfirm // }
// title={ // cancelText="取消"
// <div> // okText="确认"
// <p> // onConfirm={handleConfirm}
// 是否将confcenter、citytemp、buffile、log文件内容迁移至 // placement="rightTop"
// Mongodb数据库中(会覆盖重名文件)? // >
// </p> // <Button
// <p>(连接配置取标签mongodb)</p> // style={{
// </div> // color: '#fff',
// } // background: '#e6a23c',
// cancelText="取消" // borderColor: '#f5dab1',
// okText="确认" // }}
// onConfirm={handleConfirm} // >
// placement="rightTop" // 文件迁移
// > // </Button>
// <Button // </Popconfirm>,
// style={{
// color: '#fff',
// background: '#e6a23c',
// borderColor: '#f5dab1',
// }}
// >
// 文件迁移
// </Button>
// </Popconfirm>,
]}
/> />
<AddModal <AddModal
visible={visible} visible={visible}
......
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, notification } from 'antd'; import { Form, Modal, Input, Select, notification } from 'antd';
import { import { AddConnString, EditConnString } from '@/services/database/api';
AddConnString,
EditConnString
} from '@/services/database/api';
const { Item } = Form; const { Item } = Form;
const { Option } = Select; const { Option } = Select;
...@@ -19,7 +16,7 @@ const AddModal = props => { ...@@ -19,7 +16,7 @@ const AddModal = props => {
let obj = form.getFieldsValue(); let obj = form.getFieldsValue();
if (type === 'add') { if (type === 'add') {
AddConnString({ AddConnString({
type:'mysql', type: 'mysql',
...obj, ...obj,
}) })
.then(res => { .then(res => {
...@@ -53,7 +50,7 @@ const AddModal = props => { ...@@ -53,7 +50,7 @@ const AddModal = props => {
const handleEdit = () => { const handleEdit = () => {
let obj = form.getFieldsValue(); let obj = form.getFieldsValue();
EditConnString({ EditConnString({
type:'mysql', type: 'mysql',
...obj, ...obj,
oldName: formObj.name, oldName: formObj.name,
}) })
...@@ -96,7 +93,7 @@ const AddModal = props => { ...@@ -96,7 +93,7 @@ const AddModal = props => {
span: 4, span: 4,
}, },
wrapperCol: { wrapperCol: {
span: 16, span: 19,
}, },
}; };
return ( return (
...@@ -115,18 +112,10 @@ const AddModal = props => { ...@@ -115,18 +112,10 @@ const AddModal = props => {
> >
{visible && ( {visible && (
<Form form={form} {...layout} onFinish={onFinish}> <Form form={form} {...layout} onFinish={onFinish}>
<Item <Item label="标签" name="name" rules={[{ required: true, message: '请输入标签' }]}>
label="标签"
name="name"
rules={[{ required: true, message: '请输入标签' }]}
>
<Input placeholder="请输入标签" allowClear /> <Input placeholder="请输入标签" allowClear />
</Item> </Item>
<Item <Item label="IP" name="ip" rules={[{ required: true, message: '请输入IP' }]}>
label="IP"
name="ip"
rules={[{ required: true, message: '请输入IP' }]}
>
<Input placeholder="请输入IP" allowClear /> <Input placeholder="请输入IP" allowClear />
</Item> </Item>
<Item <Item
...@@ -143,11 +132,7 @@ const AddModal = props => { ...@@ -143,11 +132,7 @@ const AddModal = props => {
> >
<Input placeholder="请输入用户名" allowClear /> <Input placeholder="请输入用户名" allowClear />
</Item> </Item>
<Item <Item label="密码" name="password" rules={[{ required: true, message: '请输入密码' }]}>
label="密码"
name="password"
rules={[{ required: true, message: '请输入密码' }]}
>
<Input placeholder="请输入密码" allowClear /> <Input placeholder="请输入密码" allowClear />
</Item> </Item>
</Form> </Form>
......
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import ProTable from '@ant-design/pro-table'; // import ProTable from '@ant-design/pro-table';
import { Button, Tag, Popconfirm, notification } from 'antd'; import { Button, Tag, Popconfirm, notification, Table } from 'antd';
import { import {
getMySQLConnString, getMySQLConnString,
getMySQLConnectionTest, getMySQLConnectionTest,
...@@ -172,28 +172,29 @@ const MySQLTable = props => { ...@@ -172,28 +172,29 @@ const MySQLTable = props => {
title: 'IP', title: 'IP',
dataIndex: 'ip', dataIndex: 'ip',
key: 'ip', key: 'ip',
width: 150, width: 300,
ellipsis: true, ellipsis: true,
}, },
{ {
title: '数据库名', title: '数据库名',
dataIndex: 'dbName', dataIndex: 'dbName',
key: 'dbName', key: 'dbName',
width: 200, width: 300,
ellipsis: true, ellipsis: true,
}, },
{ {
title: '用户名', title: '用户名',
dataIndex: 'userName', dataIndex: 'userName',
key: 'userName', key: 'userName',
width: 300,
ellipsis: true, ellipsis: true,
}, },
{ // {
title: '密码', // title: '密码',
dataIndex: 'password', // dataIndex: 'password',
key: 'password', // key: 'password',
ellipsis: true, // ellipsis: true,
}, // },
{ {
title: '操作', title: '操作',
dataIndex: 'options', dataIndex: 'options',
...@@ -231,25 +232,29 @@ const MySQLTable = props => { ...@@ -231,25 +232,29 @@ const MySQLTable = props => {
]; ];
return ( return (
<> <>
<ProTable <div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: '10px' }}>
<div
style={{ fontWeight: 'bold', fontSize: '16px', marginLeft: '30x', marginBottom: '10px' }}
>
MySQL数据库
</div>
<Button
type="primary"
onClick={() => {
handleAdd();
}}
>
添加连接
</Button>
</div>
<Table
headerTitle="MySQL数据库" headerTitle="MySQL数据库"
rowKey="key" rowKey="key"
search={false}
columns={columns} columns={columns}
bordered bordered
loading={tableLoading} loading={tableLoading}
dataSource={dataList} dataSource={dataList}
options={false} scroll={{ y: 400 }}
toolBarRender={() => [
<Button
type="primary"
onClick={() => {
handleAdd();
}}
>
添加连接
</Button>,
]}
/> />
<AddModal <AddModal
visible={visible} visible={visible}
......
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, notification } from 'antd'; import { Form, Modal, Input, Select, notification } from 'antd';
import { import { AddConnString, EditConnString } from '@/services/database/api';
AddConnString,
EditConnString
} from '@/services/database/api';
const { Item } = Form; const { Item } = Form;
const { Option } = Select; const { Option } = Select;
...@@ -20,7 +17,7 @@ const AddModal = props => { ...@@ -20,7 +17,7 @@ const AddModal = props => {
if (type === 'add') { if (type === 'add') {
AddConnString({ AddConnString({
...obj, ...obj,
type:'oracle' type: 'oracle',
}) })
.then(res => { .then(res => {
setLoading(false); setLoading(false);
...@@ -53,7 +50,7 @@ const AddModal = props => { ...@@ -53,7 +50,7 @@ const AddModal = props => {
const handleEdit = () => { const handleEdit = () => {
let obj = form.getFieldsValue(); let obj = form.getFieldsValue();
EditConnString({ EditConnString({
type:'oracle', type: 'oracle',
...obj, ...obj,
oldName: formObj.name, oldName: formObj.name,
}) })
...@@ -96,7 +93,7 @@ const AddModal = props => { ...@@ -96,7 +93,7 @@ const AddModal = props => {
span: 4, span: 4,
}, },
wrapperCol: { wrapperCol: {
span: 16, span: 19,
}, },
}; };
return ( return (
...@@ -115,11 +112,7 @@ const AddModal = props => { ...@@ -115,11 +112,7 @@ const AddModal = props => {
> >
{visible && ( {visible && (
<Form form={form} {...layout} onFinish={onFinish}> <Form form={form} {...layout} onFinish={onFinish}>
<Item <Item label="标签" name="name" rules={[{ required: true, message: '请输入标签' }]}>
label="标签"
name="name"
rules={[{ required: true, message: '请输入标签' }]}
>
{/* <Select> {/* <Select>
<Option value={item.value}>{item.title}</Option> <Option value={item.value}>{item.title}</Option>
</Select> */} </Select> */}
...@@ -139,11 +132,7 @@ const AddModal = props => { ...@@ -139,11 +132,7 @@ const AddModal = props => {
> >
<Input placeholder="请输入用户名" allowClear /> <Input placeholder="请输入用户名" allowClear />
</Item> </Item>
<Item <Item label="密码" name="password" rules={[{ required: true, message: '请输入密码' }]}>
label="密码"
name="password"
rules={[{ required: true, message: '请输入密码' }]}
>
<Input placeholder="请输入密码" allowClear /> <Input placeholder="请输入密码" allowClear />
</Item> </Item>
</Form> </Form>
......
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import ProTable from '@ant-design/pro-table'; // import ProTable from '@ant-design/pro-table';
import { Button, Tag, Popconfirm, notification } from 'antd'; import { Button, Tag, Popconfirm, notification, Table } from 'antd';
import { import {
getOracleConnString, getOracleConnString,
getOracleConnectionTest, getOracleConnectionTest,
...@@ -172,7 +172,7 @@ const OracleTable = props => { ...@@ -172,7 +172,7 @@ const OracleTable = props => {
title: '网络服务名/(ip:port/实例名)', title: '网络服务名/(ip:port/实例名)',
dataIndex: 'dbName', dataIndex: 'dbName',
key: 'dbName', key: 'dbName',
width: 300, width: 400,
ellipsis: true, ellipsis: true,
}, },
{ {
...@@ -181,12 +181,12 @@ const OracleTable = props => { ...@@ -181,12 +181,12 @@ const OracleTable = props => {
key: 'userName', key: 'userName',
ellipsis: true, ellipsis: true,
}, },
{ // {
title: '密码', // title: '密码',
dataIndex: 'password', // dataIndex: 'password',
key: 'password', // key: 'password',
ellipsis: true, // ellipsis: true,
}, // },
{ {
title: '操作', title: '操作',
dataIndex: 'options', dataIndex: 'options',
...@@ -224,25 +224,28 @@ const OracleTable = props => { ...@@ -224,25 +224,28 @@ const OracleTable = props => {
]; ];
return ( return (
<> <>
<ProTable <div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: '10px' }}>
headerTitle="Oracle数据库" <div
style={{ fontWeight: 'bold', fontSize: '16px', marginLeft: '30x', marginBottom: '10px' }}
>
Oracle数据库
</div>
<Button
type="primary"
onClick={() => {
handleAdd();
}}
>
添加连接
</Button>
</div>
<Table
rowKey="key" rowKey="key"
search={false}
columns={columns} columns={columns}
bordered bordered
loading={tableLoading} loading={tableLoading}
dataSource={dataList} dataSource={dataList}
options={false} scroll={{ y: 400 }}
toolBarRender={() => [
<Button
type="primary"
onClick={() => {
handleAdd();
}}
>
添加连接
</Button>,
]}
/> />
<AddModal <AddModal
visible={visible} visible={visible}
......
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, notification } from 'antd'; import { Form, Modal, Input, Select, notification } from 'antd';
import { import { AddConnString, EditConnString } from '@/services/database/api';
AddConnString,
EditConnString
} from '@/services/database/api';
const { Item } = Form; const { Item } = Form;
const { Option } = Select; const { Option } = Select;
...@@ -20,11 +17,11 @@ const AddModal = props => { ...@@ -20,11 +17,11 @@ const AddModal = props => {
if (type === 'add') { if (type === 'add') {
AddConnString({ AddConnString({
...obj, ...obj,
type:'sqlserver' type: 'sqlserver',
}) })
.then(res => { .then(res => {
setLoading(false); setLoading(false);
if (res.code ==0) { if (res.code == 0) {
form.resetFields(); form.resetFields();
callBackSubmit(); callBackSubmit();
notification.success({ notification.success({
...@@ -36,7 +33,7 @@ const AddModal = props => { ...@@ -36,7 +33,7 @@ const AddModal = props => {
notification.error({ notification.error({
message: '提示', message: '提示',
duration: 3, duration: 3,
description: res.msg , description: res.msg,
}); });
} }
}) })
...@@ -55,11 +52,11 @@ const AddModal = props => { ...@@ -55,11 +52,11 @@ const AddModal = props => {
EditConnString({ EditConnString({
...obj, ...obj,
oldName: formObj.name, oldName: formObj.name,
type:'sqlserver' type: 'sqlserver',
}) })
.then(res => { .then(res => {
setLoading(false); setLoading(false);
if (res.code ==0) { if (res.code == 0) {
form.resetFields(); form.resetFields();
callBackSubmit(); callBackSubmit();
notification.success({ notification.success({
...@@ -96,7 +93,7 @@ const AddModal = props => { ...@@ -96,7 +93,7 @@ const AddModal = props => {
span: 4, span: 4,
}, },
wrapperCol: { wrapperCol: {
span: 16, span: 19,
}, },
}; };
return ( return (
...@@ -115,21 +112,13 @@ const AddModal = props => { ...@@ -115,21 +112,13 @@ const AddModal = props => {
> >
{visible && ( {visible && (
<Form form={form} {...layout} onFinish={onFinish}> <Form form={form} {...layout} onFinish={onFinish}>
<Item <Item label="标签" name="name" rules={[{ required: true, message: '请输入标签' }]}>
label="标签"
name="name"
rules={[{ required: true, message: '请输入标签' }]}
>
{/* <Select> {/* <Select>
<Option value={item.value}>{item.title}</Option> <Option value={item.value}>{item.title}</Option>
</Select> */} </Select> */}
<Input placeholder="请输入标签" allowClear /> <Input placeholder="请输入标签" allowClear />
</Item> </Item>
<Item <Item label="IP" name="ip" rules={[{ required: true, message: '请输入IP' }]}>
label="IP"
name="ip"
rules={[{ required: true, message: '请输入IP' }]}
>
<Input placeholder="请输入IP" allowClear /> <Input placeholder="请输入IP" allowClear />
</Item> </Item>
<Item <Item
...@@ -146,11 +135,7 @@ const AddModal = props => { ...@@ -146,11 +135,7 @@ const AddModal = props => {
> >
<Input placeholder="请输入用户名" allowClear /> <Input placeholder="请输入用户名" allowClear />
</Item> </Item>
<Item <Item label="密码" name="password" rules={[{ required: true, message: '请输入密码' }]}>
label="密码"
name="password"
rules={[{ required: true, message: '请输入密码' }]}
>
<Input placeholder="请输入密码" allowClear /> <Input placeholder="请输入密码" allowClear />
</Item> </Item>
</Form> </Form>
......
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import ProTable from '@ant-design/pro-table'; // import ProTable from '@ant-design/pro-table';
import { Button, Popconfirm, notification } from 'antd'; import { Button, Popconfirm, notification, Table } from 'antd';
import { GetConnString, DeleteConnString, GetConnTest } from '@/services/database/api'; import { GetConnString, DeleteConnString, GetConnTest } from '@/services/database/api';
import AddModal from './AddModal'; import AddModal from './AddModal';
const SQLServerTable = props => { const SQLServerTable = props => {
...@@ -164,30 +164,30 @@ const SQLServerTable = props => { ...@@ -164,30 +164,30 @@ const SQLServerTable = props => {
title: 'ip', title: 'ip',
dataIndex: 'ip', dataIndex: 'ip',
key: 'ip', key: 'ip',
width: 150, width: 300,
ellipsis: true, ellipsis: true,
}, },
{ {
title: '数据库名', title: '数据库名',
dataIndex: 'dbName', dataIndex: 'dbName',
key: 'dbName', key: 'dbName',
width: 200, width: 400,
ellipsis: true, ellipsis: true,
}, },
{ {
title: '用户名', title: '用户名',
dataIndex: 'userName', dataIndex: 'userName',
key: 'userName', key: 'userName',
// width: 200, width: 200,
ellipsis: true,
},
{
title: '密码',
dataIndex: 'password',
key: 'password',
// width: 200,
ellipsis: true, ellipsis: true,
}, },
// {
// title: '密码',
// dataIndex: 'password',
// key: 'password',
// // width: 200,
// ellipsis: true,
// },
{ {
title: '操作', title: '操作',
dataIndex: 'options', dataIndex: 'options',
...@@ -227,25 +227,29 @@ const SQLServerTable = props => { ...@@ -227,25 +227,29 @@ const SQLServerTable = props => {
]; ];
return ( return (
<> <>
<ProTable <div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: '10px' }}>
headerTitle="SQL数据库" <div
style={{ fontWeight: 'bold', fontSize: '16px', marginLeft: '30x', marginBottom: '10px' }}
>
SQL数据库
</div>
<Button
type="primary"
onClick={() => {
handleAdd();
}}
>
添加连接
</Button>
</div>
<Table
// title="SQL数据库"
rowKey="name" rowKey="name"
search={false}
columns={columns} columns={columns}
bordered bordered
loading={tableLoading} loading={tableLoading}
dataSource={dataList} dataSource={dataList}
options={false} scroll={{ y: 400 }}
toolBarRender={() => [
<Button
type="primary"
onClick={() => {
handleAdd();
}}
>
添加连接
</Button>,
]}
/> />
<AddModal <AddModal
visible={visible} visible={visible}
......
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, notification, Slider, InputNumber, Row, Col, Image, Radio, Button } from 'antd'; import {
import styles from '../dimensionsConfig.less' Form,
Modal,
Input,
Select,
notification,
Slider,
InputNumber,
Row,
Col,
Image,
Radio,
Button,
} from 'antd';
import styles from '../dimensionsConfig.less';
import thumbnail_1 from '@/assets/images/thumbnail/thumbnail_1.jpg'; import thumbnail_1 from '@/assets/images/thumbnail/thumbnail_1.jpg';
import thumbnail_2 from '@/assets/images/thumbnail/thumbnail_2.jpg'; import thumbnail_2 from '@/assets/images/thumbnail/thumbnail_2.jpg';
import thumbnail_3 from '@/assets/images/thumbnail/thumbnail_3.jpg'; import thumbnail_3 from '@/assets/images/thumbnail/thumbnail_3.jpg';
import thumbnail_4 from '@/assets/images/thumbnail/thumbnail_4.jpg'; import thumbnail_4 from '@/assets/images/thumbnail/thumbnail_4.jpg';
import { import { AddBaseMap, EditBaseMap } from '@/services/webConfig/api';
AddBaseMap, EditBaseMap
} from '@/services/webConfig/api';
import { number } from 'prop-types'; import { number } from 'prop-types';
const { Item } = Form; const { Item } = Form;
const { Option } = Select; const { Option } = Select;
const AddModal = props => { const AddModal = props => {
const { callBackSubmit = () => { }, type, formObj, visible, baseMap } = props; const { callBackSubmit = () => {}, type, formObj, visible, baseMap } = props;
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [radio, setRadio] = useState(); const [radio, setRadio] = useState();
const [alpha, setAlpha] = useState(1); const [alpha, setAlpha] = useState(1);
const [mapType, setMapType] = useState(0); const [mapType, setMapType] = useState(0);
const [form] = Form.useForm(); const [form] = Form.useForm();
const arr = ['assets/images/thumbnail/thumbnail_1.jpg', 'assets/images/thumbnail/thumbnail_2.jpg', 'assets/images/thumbnail/thumbnail_3.jpg', 'assets/images/thumbnail/thumbnail_4.jpg'] const arr = [
'assets/images/thumbnail/thumbnail_1.jpg',
'assets/images/thumbnail/thumbnail_2.jpg',
'assets/images/thumbnail/thumbnail_3.jpg',
'assets/images/thumbnail/thumbnail_4.jpg',
];
// 提交 // 提交
const onSubmit = () => { const onSubmit = () => {
form.validateFields().then(validate => { form.validateFields().then(validate => {
if (validate) { if (validate) {
let str = type === 'add' ? AddBaseMap : EditBaseMap let str = type === 'add' ? AddBaseMap : EditBaseMap;
let obj = form.getFieldsValue(); let obj = form.getFieldsValue();
let arr = { let arr = {
name: obj.name, name: obj.name,
type: obj.type, type: obj.type,
opacity: Number(alpha), opacity: Number(alpha),
icon: obj.icon, icon: obj.icon,
url: obj.url url: obj.url,
} };
str(arr) str(arr)
.then(res => { .then(res => {
setLoading(false); setLoading(false);
if (res.msg === "Ok" || res.msg === "") { if (res.msg === 'Ok' || res.msg === '') {
form.resetFields(); form.resetFields();
callBackSubmit(); callBackSubmit();
notification.success({ notification.success({
message: '提示', message: '提示',
duration: 3, duration: 3,
description: res.message || type == 'add' ? '新增成功' : '编辑成功' description: res.message || type == 'add' ? '新增成功' : '编辑成功',
}); });
} else { } else {
notification.error({ notification.error({
message: '提示', message: '提示',
duration: 3, duration: 3,
description: res.message || type == 'add' ? '新增失败' : '编辑失败' description: res.message || type == 'add' ? '新增失败' : '编辑失败',
}); });
} }
}) })
.catch(err => { setLoading(false); }); .catch(err => {
setLoading(false);
});
} }
}); });
}; };
const onFinish = value => {};
const onFinish = value => { };
useEffect(() => { useEffect(() => {
switch (type) { switch (type) {
case 'add': case 'add':
setRadio('') setRadio('');
setAlpha(1) setAlpha(1);
form.resetFields(); form.resetFields();
form.setFieldsValue({ form.setFieldsValue({
name: baseMap[0], name: baseMap[0],
type: servicenameToType(baseMap[0]) type: servicenameToType(baseMap[0]),
}) });
break; break;
case 'edit': case 'edit':
form.setFieldsValue({ ...formObj }); form.setFieldsValue({ ...formObj });
setAlpha(formObj.opacity) setAlpha(formObj.opacity);
let index = formObj.icon.lastIndexOf("/") let index = formObj.icon.lastIndexOf('/');
let str = formObj.icon.substring(index + 1, formObj.icon.length); let str = formObj.icon.substring(index + 1, formObj.icon.length);
let flag = '' let flag = '';
let defaultIndex = arr.filter((item, index1) => { let defaultIndex = arr.filter((item, index1) => {
if (item.indexOf(str) !== -1) { if (item.indexOf(str) !== -1) {
flag = index1 flag = index1;
} }
}); });
setRadio(arr[flag]) setRadio(arr[flag]);
break; break;
default: default:
break; break;
...@@ -95,86 +112,85 @@ const AddModal = props => { ...@@ -95,86 +112,85 @@ const AddModal = props => {
// } // }
}, [visible]); }, [visible]);
const layout = { const layout = {
layout: 'horizontal', layout: 'horizontal',
labelCol: { labelCol: {
span: 4, span: 4,
}, },
wrapperCol: { wrapperCol: {
span: 16, span: 18,
}, },
}; };
const onChange = (value) => { const onChange = value => {
let silderData = value == 100 ? 1 : (value / 100).toFixed(1) let silderData = value == 100 ? 1 : (value / 100).toFixed(1);
setAlpha(silderData) setAlpha(silderData);
} };
const tipFormatter = (value) => { const tipFormatter = value => {
return (value / 100).toFixed(1) return (value / 100).toFixed(1);
} };
const imgURL = [ const imgURL = [
{ {
url: thumbnail_1 url: thumbnail_1,
}, },
{ {
url: thumbnail_2 url: thumbnail_2,
}, },
{ {
url: thumbnail_3 url: thumbnail_3,
}, },
{ {
url: thumbnail_4 url: thumbnail_4,
}, },
] ];
const radioChange = (e) => { const radioChange = e => {
setRadio(e.target.value) setRadio(e.target.value);
} };
const handleChange = (value) => { const handleChange = value => {
form.setFieldsValue({ form.setFieldsValue({
type: servicenameToType(value) type: servicenameToType(value),
}) });
// if (baseMap.indexOf(value) == 2 || baseMap.indexOf(value) == 3) { // if (baseMap.indexOf(value) == 2 || baseMap.indexOf(value) == 3) {
// setMapType(1) // setMapType(1)
// } // }
// else { // else {
// setMapType(0) // setMapType(0)
// } // }
} };
//添加地图类型 //添加地图类型
const servicenameToType = (servicename) => { const servicenameToType = servicename => {
// if (servicename.indexOf('地形图') > -1) // if (servicename.indexOf('地形图') > -1)
// servicename = '地形图' // servicename = '地形图'
// if (servicename.indexOf('自定义底图') > -1) // if (servicename.indexOf('自定义底图') > -1)
// servicename = '自定义底图' // servicename = '自定义底图'
switch (servicename) { switch (servicename) {
case "高德街道": case '高德街道':
return 'amap-v'; return 'amap-v';
case "高德影像": case '高德影像':
return 'amap-i'; return 'amap-i';
case "天地图街道": case '天地图街道':
return 'tianditu-v'; return 'tianditu-v';
case "天地图影像": case '天地图影像':
return 'tianditu-i'; return 'tianditu-i';
case "百度街道": case '百度街道':
return 'baiduMapStreet'; return 'baiduMapStreet';
case "百度影像": case '百度影像':
return 'baiduMapImage'; return 'baiduMapImage';
case "mapBox地图" : case 'mapBox地图':
return 'mapBoxImage'; return 'mapBoxImage';
case "arcgis地图" : case 'arcgis地图':
return "arcgisImage" return 'arcgisImage';
default: default:
return 'amap-v'; return 'amap-v';
} }
} };
//选择坐标系 //选择坐标系
const handleCoordinate = () => { } const handleCoordinate = () => {};
//选择图层 //选择图层
const handleLayer = () => { } const handleLayer = () => {};
//选择工作空间 //选择工作空间
const handleWorkSpance = () => { } const handleWorkSpance = () => {};
return ( return (
<Modal <Modal
...@@ -194,30 +210,26 @@ const AddModal = props => { ...@@ -194,30 +210,26 @@ const AddModal = props => {
> >
{visible && ( {visible && (
<Form form={form} {...layout} onFinish={onFinish}> <Form form={form} {...layout} onFinish={onFinish}>
<Item <Item label="名称" name="name" rules={[{ required: true, message: '请选择服务名' }]}>
label="名称"
name="name"
rules={[{ required: true, message: '请选择服务名' }]}
>
<Select onChange={handleChange}> <Select onChange={handleChange}>
{type === 'add' ? baseMap.map((item, index) => { return <Option value={item} key={index}>{item}</Option> }) : ''} {type === 'add'
? baseMap.map((item, index) => {
return (
<Option value={item} key={index}>
{item}
</Option>
);
})
: ''}
</Select> </Select>
</Item> </Item>
<Item <Item label="类型" name="type">
label="类型"
name="type"
>
<Input placeholder="请输入类型" allowClear disabled /> <Input placeholder="请输入类型" allowClear disabled />
</Item> </Item>
<Item <Item label="URL" name="url">
label="URL"
name="url"
>
<Input placeholder="请输入URL" allowClear /> <Input placeholder="请输入URL" allowClear />
</Item> </Item>
<Item <Item label="透明度">
label="透明度"
>
<Row> <Row>
<Col span={12}> <Col span={12}>
<Slider <Slider
...@@ -242,39 +254,26 @@ const AddModal = props => { ...@@ -242,39 +254,26 @@ const AddModal = props => {
</Col> </Col>
</Row> </Row>
</Item> </Item>
<Item <Item label="选择缩略图" name="icon">
label="选择缩略图"
name="icon"
>
<div className={styles.imgList}> <div className={styles.imgList}>
{imgURL.map((item, index) => { {imgURL.map((item, index) => {
return <div key={index} className={styles.imgItem}> return (
<Image <div key={index} className={styles.imgItem}>
width={100} <Image width={100} height={63} src={item.url} />
height={63} <Radio.Group options={item} onChange={radioChange} value={radio}>
src={item.url} <Radio value={arr[index]} />
/> </Radio.Group>
<Radio.Group options={item} onChange={radioChange} value={radio}> </div>
<Radio value={arr[index]}></Radio> );
</Radio.Group>
</div>
})} })}
</div> </div>
</Item> </Item>
<Item <Item label="缩略图" name="icon" rules={[{ required: true, message: '请选择缩略图' }]}>
label="缩略图"
name="icon"
rules={[{ required: true, message: '请选择缩略图' }]}
>
<Input placeholder="请输入URL" allowClear /> <Input placeholder="请输入URL" allowClear />
</Item> </Item>
{mapType === 1 ? {mapType === 1 ? (
<> <>
<Item <Item label="ip地址" name="IP" rules={[{ required: true, message: '请输入ip地址' }]}>
label="ip地址"
name="IP"
rules={[{ required: true, message: '请输入ip地址' }]}
>
<Input placeholder="请输入ip地址" allowClear /> <Input placeholder="请输入ip地址" allowClear />
</Item> </Item>
<Item <Item
...@@ -293,27 +292,21 @@ const AddModal = props => { ...@@ -293,27 +292,21 @@ const AddModal = props => {
name="workSpance" name="workSpance"
rules={[{ required: true, message: '请选择工作空间' }]} rules={[{ required: true, message: '请选择工作空间' }]}
> >
<Select onChange={handleWorkSpance}> <Select onChange={handleWorkSpance} />
</Select>
</Item> </Item>
<Item <Item
label="图层名" label="图层名"
name="layer" name="layer"
rules={[{ required: true, message: '请选择图层名' }]} rules={[{ required: true, message: '请选择图层名' }]}
> >
<Select onChange={handleLayer}> <Select onChange={handleLayer} />
</Select>
</Item> </Item>
<Item <Item
label="坐标系名" label="坐标系名"
name="coordinate" name="coordinate"
rules={[{ required: true, message: '请选择坐标系名' }]} rules={[{ required: true, message: '请选择坐标系名' }]}
> >
<Select onChange={handleCoordinate}> <Select onChange={handleCoordinate} />
</Select>
</Item> </Item>
<Item <Item
...@@ -345,7 +338,9 @@ const AddModal = props => { ...@@ -345,7 +338,9 @@ const AddModal = props => {
<Input placeholder="请输入URL" allowClear /> <Input placeholder="请输入URL" allowClear />
</Item> </Item>
</> </>
: ''} ) : (
''
)}
</Form> </Form>
)} )}
</Modal> </Modal>
......
/* eslint-disable eqeqeq */
/* eslint-disable import/order */
/* eslint-disable react/jsx-boolean-value */
/* eslint-disable indent */ /* eslint-disable indent */
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { import {
...@@ -11,16 +14,14 @@ import { ...@@ -11,16 +14,14 @@ import {
message, message,
Card, Card,
Space, Space,
Tooltip,
Row,
Col,
} from 'antd'; } from 'antd';
import styles from '../dimensionsConfig.less'; import styles from '../dimensionsConfig.less';
import { AddVectorData, publisService, GetProjectNames } from '@/services/webConfig/api'; import { AddVectorData, GetProjectNames } from '@/services/webConfig/api';
import { import { CloseCircleOutlined, MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
PlusCircleOutlined,
CloseCircleOutlined,
PlusOutlined,
MinusCircleOutlined,
} from '@ant-design/icons';
const { Option } = Select; const { Option } = Select;
const AddModal = props => { const AddModal = props => {
...@@ -42,10 +43,16 @@ const AddModal = props => { ...@@ -42,10 +43,16 @@ const AddModal = props => {
setLoading(true); setLoading(true);
let obj = form.getFieldsValue(); let obj = form.getFieldsValue();
let attributesObj = {}; let attributesObj = {};
attributes.map((item, index) => { if (obj.users) {
let key = obj[`key${index}`]; obj.users.map(item => {
attributesObj[`${key}`] = obj[`value${index}`]; attributesObj[item.nodeName] = item.nodeValue;
}); });
}
// attributes.map((item, index) => {
// let key = obj[`key${index}`];
// attributesObj[`${key}`] = obj[`value${index}`];
// });
if (type === 'add') { if (type === 'add') {
let url = allData[obj.name].fileName let url = allData[obj.name].fileName
? `http://${obj.ip}:${obj.port}/${obj.projectName}/${obj.name}/${ ? `http://${obj.ip}:${obj.port}/${obj.projectName}/${obj.name}/${
...@@ -123,7 +130,7 @@ const AddModal = props => { ...@@ -123,7 +130,7 @@ const AddModal = props => {
} }
}, [visible]); }, [visible]);
//存储到localstorage // 存储到localstorage
const handlelocalStorage = (type, gsIp, gisAppName) => { const handlelocalStorage = (type, gsIp, gisAppName) => {
if (!localStorage) return null; if (!localStorage) return null;
let result = JSON.parse(localStorage.getItem('metaData')); let result = JSON.parse(localStorage.getItem('metaData'));
...@@ -160,7 +167,7 @@ const AddModal = props => { ...@@ -160,7 +167,7 @@ const AddModal = props => {
span: 4, span: 4,
}, },
wrapperCol: { wrapperCol: {
span: 17, span: 18,
}, },
}; };
...@@ -218,8 +225,6 @@ const AddModal = props => { ...@@ -218,8 +225,6 @@ const AddModal = props => {
GetProjectNames({ ip: obj.ip, port: obj.port, projectname: value }).then(response => { GetProjectNames({ ip: obj.ip, port: obj.port, projectname: value }).then(response => {
let newArr = JSON.parse(response.data); let newArr = JSON.parse(response.data);
let workArr = Object.keys(newArr.data); let workArr = Object.keys(newArr.data);
console.log('newArr', newArr);
console.log('workArr', workArr);
setAllData(newArr.data); setAllData(newArr.data);
if (workArr.length) { if (workArr.length) {
setWorkList(workArr); setWorkList(workArr);
...@@ -230,16 +235,16 @@ const AddModal = props => { ...@@ -230,16 +235,16 @@ const AddModal = props => {
const selectName = value => { const selectName = value => {
form.setFieldsValue({ type: allData[value].type }); form.setFieldsValue({ type: allData[value].type });
}; };
const addExtra = () => { // const addExtra = () => {
let attributesArr = [...attributes]; // let attributesArr = [...attributes];
attributesArr.push({}); // attributesArr.push({});
setAttributes(attributesArr); // setAttributes(attributesArr);
}; // };
const deleteExtr = index => { // const deleteExtr = index => {
let attributesArr = [...attributes]; // let attributesArr = [...attributes];
attributesArr.splice(index, 1); // attributesArr.splice(index, 1);
setAttributes(attributesArr); // setAttributes(attributesArr);
}; // };
const inputPort = e => { const inputPort = e => {
setPorts(e.target.value); setPorts(e.target.value);
}; };
...@@ -279,7 +284,7 @@ const AddModal = props => { ...@@ -279,7 +284,7 @@ const AddModal = props => {
name="projectName" name="projectName"
rules={[{ required: true, message: '请选择项目名' }]} rules={[{ required: true, message: '请选择项目名' }]}
> >
<Select onChange={selectProject} style={{ width: '351px' }}> <Select onChange={selectProject} style={{ width: '379px' }}>
{projectNmme.length {projectNmme.length
? projectNmme.map((item, index) => { ? projectNmme.map((item, index) => {
return ( return (
...@@ -290,7 +295,7 @@ const AddModal = props => { ...@@ -290,7 +295,7 @@ const AddModal = props => {
}) })
: ''} : ''}
</Select> </Select>
<Button style={{ marginLeft: '0.5rem' }} onClick={getProject} loading={loadingProject}> <Button style={{ marginLeft: '0.5rem' }} onClick={getProject}>
获取项目名 获取项目名
</Button> </Button>
</Item> </Item>
...@@ -318,7 +323,7 @@ const AddModal = props => { ...@@ -318,7 +323,7 @@ const AddModal = props => {
> >
<Input placeholder="请输入数据类型" allowClear disabled /> <Input placeholder="请输入数据类型" allowClear disabled />
</Item> </Item>
<Button {/* <Button
size="small" size="small"
style={{ width: '71%', marginLeft: '109px', lineHeight: '32px', height: '32px' }} style={{ width: '71%', marginLeft: '109px', lineHeight: '32px', height: '32px' }}
onClick={() => { onClick={() => {
...@@ -326,17 +331,68 @@ const AddModal = props => { ...@@ -326,17 +331,68 @@ const AddModal = props => {
}} }}
> >
新增额外属性 新增额外属性
</Button> </Button> */}
<div <div
style={{ style={{
maxHeight: '14rem', maxHeight: '200px',
overflowY: 'scroll', overflowY: 'scroll',
marginTop: '0.2rem',
marginLeft: '66px', marginLeft: '66px',
width: '88%', width: '88%',
}} }}
> >
{attributes.length <Form.List name="users">
{(fields, { add, remove }) => (
<>
{fields.map(({ key, name, fieldKey, ...restField }) => (
<Space key={key} style={{ display: 'flex', marginBottom: 8 }}>
<div style={{ display: 'flex', alignItems: 'middle' }}>
<Form.Item
{...restField}
name={[name, 'nodeName']}
label="键"
fieldKey={[fieldKey, 'frist']}
>
<Input
placeholder="请输入名称"
style={{ marginLeft: '2px', width: '224px' }}
/>
</Form.Item>
<Form.Item
{...restField}
name={[name, 'nodeValue']}
label="值"
fieldKey={[fieldKey, 'last']}
style={{ marginLeft: '10px' }}
>
<Input
placeholder="请输入值"
style={{ marginLeft: '2px', width: '224px' }}
/>
</Form.Item>
<Tooltip title="移除额外属性">
<MinusCircleOutlined
onClick={() => remove(name)}
style={{ marginLeft: '20px', marginTop: '11px', fontSize: '20px' }}
/>
</Tooltip>
</div>
</Space>
))}
<Form.Item>
<Button
type="dashed"
onClick={() => add()}
block
icon={<PlusOutlined />}
style={{ width: '489px', marginLeft: '43px' }}
>
新增额外属性
</Button>
</Form.Item>
</>
)}
</Form.List>
{/* {attributes.length
? attributes.map((item, index) => { ? attributes.map((item, index) => {
return ( return (
<div key={index} className={styles.containerFileds}> <div key={index} className={styles.containerFileds}>
...@@ -367,7 +423,7 @@ const AddModal = props => { ...@@ -367,7 +423,7 @@ const AddModal = props => {
</div> </div>
); );
}) })
: ''} : ''} */}
</div> </div>
</Form> </Form>
)} )}
......
...@@ -5,31 +5,31 @@ import { ...@@ -5,31 +5,31 @@ import {
AddSchemaBaseMap, AddSchemaBaseMap,
bindSchemeBaseMap, bindSchemeBaseMap,
GetBaseMapList, GetBaseMapList,
GetVectorDataList GetVectorDataList,
} from '@/services/webConfig/api'; } from '@/services/webConfig/api';
import MapScope from '@/components/ThreeMapScope' import MapScope from '@/components/ThreeMapScope';
const { Item } = Form; const { Item } = Form;
const { Option } = Select; const { Option } = Select;
const AddModal = props => { const AddModal = props => {
const { callBackSubmit = () => { }, type, formObj, visible, serviceList } = props; const { callBackSubmit = () => {}, type, formObj, visible, serviceList } = props;
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [baseMap, setBaseMap] = useState([]); const [baseMap, setBaseMap] = useState([]);
const [pipeArr, setPipeArr] = useState([]); const [pipeArr, setPipeArr] = useState([]);
const [data, setData] = useState([]); const [data, setData] = useState([]);
const [mapSettings, setMapSettings] = useState({ areaName: '选择视角' }); const [mapSettings, setMapSettings] = useState({ areaName: '选择视角' });
const [mapScopeVisible, setMapScopeVisible] = useState(false) const [mapScopeVisible, setMapScopeVisible] = useState(false);
const [baseMapData, setBaseMapData] = useState([]) const [baseMapData, setBaseMapData] = useState([]);
const [form] = Form.useForm(); const [form] = Form.useForm();
const baseMapList = { const baseMapList = {
'amap-v': "高德街道", 'amap-v': '高德街道',
'amap-i': "高德影像", 'amap-i': '高德影像',
'tianditu-v': "天地图街道", 'tianditu-v': '天地图街道',
'tianditu-i': "天地图影像", 'tianditu-i': '天地图影像',
'baiduMapStreet': "百度街道", baiduMapStreet: '百度街道',
'baiduMapImage': "百度影像", baiduMapImage: '百度影像',
"mapBoxImage" : "mapBox地图", mapBoxImage: 'mapBox地图',
"arcgisImage" : "arcgis地图" arcgisImage: 'arcgis地图',
} };
const onSubmit = () => { const onSubmit = () => {
form.validateFields().then(validate => { form.validateFields().then(validate => {
if (validate) { if (validate) {
...@@ -38,18 +38,17 @@ const AddModal = props => { ...@@ -38,18 +38,17 @@ const AddModal = props => {
if (type === 'add') { if (type === 'add') {
AddSchemaBaseMap({ AddSchemaBaseMap({
schemename: formObj.schemename, schemename: formObj.schemename,
type: obj.serverName type: obj.serverName,
}).then(res => { }).then(res => {
setLoading(false); setLoading(false);
if (res.msg === '') { if (res.msg === '') {
form.resetFields(); form.resetFields();
callBackSubmit(); callBackSubmit();
prompt('success', '瓦片新增成功') prompt('success', '瓦片新增成功');
} } else {
else { prompt('fail', '瓦片新增失败');
prompt('fail', '瓦片新增失败')
} }
}) });
} else { } else {
handleEdit(); handleEdit();
} }
...@@ -63,31 +62,30 @@ const AddModal = props => { ...@@ -63,31 +62,30 @@ const AddModal = props => {
duration: 3, duration: 3,
description: content, description: content,
}); });
} } else {
else {
notification.error({ notification.error({
message: '提示', message: '提示',
duration: 3, duration: 3,
description: content, description: content,
}); });
} }
} };
const handleEdit = () => { const handleEdit = () => {
let obj = form.getFieldsValue(); let obj = form.getFieldsValue();
AddSchema({ AddSchema({
schemename: obj.schemename, schemename: obj.schemename,
data, data,
mapSettings: mapSettings.areaName === '选择视角' ? {} : mapSettings, mapSettings: mapSettings.areaName === '选择视角' ? {} : mapSettings,
baseMap: baseMapData baseMap: baseMapData,
}) })
.then(res => { .then(res => {
setLoading(false); setLoading(false);
if (res.msg === "") { if (res.msg === '') {
form.resetFields(); form.resetFields();
callBackSubmit(); callBackSubmit();
prompt('success', '方案新增成功') prompt('success', '方案新增成功');
} else { } else {
prompt('fail', res.msg) prompt('fail', res.msg);
} }
}) })
.catch(err => { .catch(err => {
...@@ -95,157 +93,171 @@ const AddModal = props => { ...@@ -95,157 +93,171 @@ const AddModal = props => {
}); });
}; };
const onFinish = value => { const onFinish = value => {};
};
useEffect(() => { useEffect(() => {
switch (type) { switch (type) {
case 'add': case 'add':
console.log('serviceList', serviceList); console.log('serviceList', serviceList);
addTile() addTile();
break; break;
case 'schemeAdd': case 'schemeAdd':
pipeNetwork() pipeNetwork();
break; break;
default: default:
break; break;
} }
}, [visible]); }, [visible]);
//添加瓦片 // 添加瓦片
const addTile = () => { const addTile = () => {
form.setFieldsValue({ form.setFieldsValue({
serverName: serviceList[0] serverName: serviceList[0],
}) });
} };
//获取管网及默认底图 // 获取管网及默认底图
const pipeNetwork = () => { const pipeNetwork = () => {
form.resetFields(); form.resetFields();
setMapSettings({ areaName: '选择视角' }) setMapSettings({ areaName: '选择视角' });
let req1 = GetBaseMapList() let req1 = GetBaseMapList();
let req2 = GetVectorDataList() let req2 = GetVectorDataList();
let pipeArr = [], baseMap = []; let pipeArr = [],
baseMap = [];
Promise.all([req1, req2]).then(res => { Promise.all([req1, req2]).then(res => {
if (res[0].msg === 'Ok') { if (res[0].msg === 'Ok') {
setBaseMap(res[0].data) setBaseMap(res[0].data);
} }
if (res[1].msg === 'Ok') { if (res[1].msg === 'Ok') {
(res[1].data || []).map(item => { (res[1].data || []).map(item => {
pipeArr.push(item.id) pipeArr.push(item.id);
}) });
} }
setPipeArr(pipeArr) setPipeArr(pipeArr);
form.setFieldsValue({ form.setFieldsValue({
baseMap: res[0].data[0].name baseMap: res[0].data[0].name,
}) });
}) });
} };
const layout = { const layout = {
layout: 'horizontal', layout: 'horizontal',
labelCol: { labelCol: {
span: 4, span: 4,
}, },
wrapperCol: { wrapperCol: {
span: 16, span: 18,
}, },
}; };
//选择服务名 // 选择服务名
const handleChange = (value) => { const handleChange = value => {};
// 选择管网
const handleService = value => {
} setData(value);
//选择管网 };
const handleService = (value) => {
setData(value)
}
//选择底图 // 选择底图
const handleBaseMap = (value, option) => { const handleBaseMap = (value, option) => {
let baseMapDataArr = [] let baseMapDataArr = [];
value.map((item, index) => { value.map((item, index) => {
baseMapDataArr.push({ type: item, status: index == 0 ? 'active' : 'notActive' }) baseMapDataArr.push({ type: item, status: index == 0 ? 'active' : 'notActive' });
}) });
setBaseMapData(baseMapDataArr) setBaseMapData(baseMapDataArr);
} };
const submitExtent = (mapSettings) => { const submitExtent = mapSettings => {
setMapScopeVisible(false) setMapScopeVisible(false);
if (JSON.stringify(mapSettings) != '{}') { if (JSON.stringify(mapSettings) != '{}') {
setMapSettings(mapSettings) setMapSettings(mapSettings);
form.setFieldsValue({ form.setFieldsValue({
camera: mapSettings.areaName camera: mapSettings.areaName,
}) });
} }
} };
return ( return (
<><Modal <>
title={`${type === 'add' ? '添加底图' : '添加方案'}`} <Modal
bodyStyle={{ width: '100%', minHeight: '100px' }} title={`${type === 'add' ? '添加底图' : '添加方案'}`}
style={{ top: '150px' }} bodyStyle={{ width: '100%', minHeight: '100px' }}
width="700px" style={{ top: '150px' }}
destroyOnClose width="700px"
maskClosable={false} destroyOnClose
cancelText="取消" maskClosable={false}
okText="确认" cancelText="取消"
{...props} okText="确认"
onOk={() => onSubmit()} {...props}
confirmLoading={loading} onOk={() => onSubmit()}
forceRender={true} confirmLoading={loading}
getContainer={false} forceRender={true}
> getContainer={false}
{visible && ( >
<Form form={form} {...layout} onFinish={onFinish}> {visible && (
{type === 'add' ? <Item <Form form={form} {...layout} onFinish={onFinish}>
label="服务名" {type === 'add' ? (
name="serverName" <Item label="服务名" name="serverName">
> <Select onChange={handleChange}>
<Select onChange={handleChange}> {serviceList.length
{serviceList.length ? serviceList.map((item, index) => { return <Option key={index} value={item}>{baseMapList[item]}</Option>; }) : ''} ? serviceList.map((item, index) => {
</Select> return (
</Item> : <Option key={index} value={item}>
<> {baseMapList[item]}
<Item </Option>
label="方案名" );
name="schemename" })
rules={[{ required: true, message: '请输入方案名' }]} : ''}
>
<Input placeholder="请输入方案名" allowClear />
</Item>
<Item
label="数据源"
>
<Select onChange={handleService} mode="multiple" >
{pipeArr.length ? pipeArr.map((item, index) => { return <Option key={index} value={item}>{item}</Option>; }) : ''}
</Select>
</Item>
<Item
label="瓦片"
name=''
rules={[{ required: true, message: '请选择瓦片' }]}
>
<Select onChange={handleBaseMap} mode="multiple">
{baseMap.length ? baseMap.map((item, index) => { return <Option key={index} value={item.type}>{item.name}</Option>; }) : ''}
</Select> </Select>
</Item> </Item>
<Item ) : (
label="视角" <>
name="camera" <Item
> label="方案名"
<Button style={{ width: '100%' }} onClick={() => setMapScopeVisible(true)}>{mapSettings.areaName}</Button> name="schemename"
</Item> rules={[{ required: true, message: '请输入方案名' }]}
</>} >
<Input placeholder="请输入方案名" allowClear />
</Item>
</Form> <Item label="数据源">
)} <Select onChange={handleService} mode="multiple">
</Modal> {pipeArr.length
? pipeArr.map((item, index) => {
return (
<Option key={index} value={item}>
{item}
</Option>
);
})
: ''}
</Select>
</Item>
<Item label="瓦片" name="" rules={[{ required: true, message: '请选择瓦片' }]}>
<Select onChange={handleBaseMap} mode="multiple">
{baseMap.length
? baseMap.map((item, index) => {
return (
<Option key={index} value={item.type}>
{item.name}
</Option>
);
})
: ''}
</Select>
</Item>
<Item label="视角" name="camera">
<Button style={{ width: '100%' }} onClick={() => setMapScopeVisible(true)}>
{mapSettings.areaName}
</Button>
</Item>
</>
)}
</Form>
)}
</Modal>
<MapScope <MapScope
visible={mapScopeVisible} visible={mapScopeVisible}
onCancel={() => setMapScopeVisible(false)} onCancel={() => setMapScopeVisible(false)}
baseMapData = {baseMapData} baseMapData={baseMapData}
baseMap = {baseMap} baseMap={baseMap}
handleType = 'add' handleType="add"
confirmModal={submitExtent} /></> confirmModal={submitExtent}
/>
</>
); );
}; };
export default AddModal; export default AddModal;
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, AutoComplete, Button, notification } from 'antd'; import { Form, Modal, Input, Select, AutoComplete, Button, notification } from 'antd';
import { import { SetServiceConfig, AddWebSchema } from '@/services/webConfig/api';
SetServiceConfig,AddWebSchema
} from '@/services/webConfig/api';
const { Option } = Select; const { Option } = Select;
const AddModal = props => { const AddModal = props => {
const { callBackSubmit = () => { }, type, formObj, visible, listData } = props; const { callBackSubmit = () => {}, type, formObj, visible, listData } = props;
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [form] = Form.useForm(); const [form] = Form.useForm();
const { Item } = Form; const { Item } = Form;
...@@ -18,11 +15,11 @@ const AddModal = props => { ...@@ -18,11 +15,11 @@ const AddModal = props => {
setLoading(true); setLoading(true);
let obj = form.getFieldsValue(); let obj = form.getFieldsValue();
AddWebSchema({ AddWebSchema({
schemename: obj.schemename schemename: obj.schemename,
}) })
.then(res => { .then(res => {
setLoading(false); setLoading(false);
if (res.msg === "") { if (res.msg === '') {
form.resetFields(); form.resetFields();
callBackSubmit(); callBackSubmit();
notification.success({ notification.success({
...@@ -30,12 +27,11 @@ const AddModal = props => { ...@@ -30,12 +27,11 @@ const AddModal = props => {
duration: 3, duration: 3,
description: '新增成功', description: '新增成功',
}); });
} else { } else {
notification.error({ notification.error({
message: '提示', message: '提示',
duration: 3, duration: 3,
description:res.msg, description: res.msg,
}); });
} }
}) })
...@@ -47,39 +43,35 @@ const AddModal = props => { ...@@ -47,39 +43,35 @@ const AddModal = props => {
}); });
setLoading(false); setLoading(false);
}); });
} }
}); });
}; };
const onFinish = value => {};
const onFinish = value => { };
useEffect(() => { useEffect(() => {
if(type!=''){ if (type != '') {
form.setFieldsValue({ schemename: listData[0] }); form.setFieldsValue({ schemename: listData[0] });
} }
}, [visible]); }, [visible]);
const layout = { const layout = {
layout: 'horizontal', layout: 'horizontal',
labelCol: { labelCol: {
span: 4, span: 3,
}, },
wrapperCol: { wrapperCol: {
span: 16, span: 20,
}, },
}; };
const handleChange = (value) => { const handleChange = value => {
form.setFieldsValue({ schemename: value}); form.setFieldsValue({ schemename: value });
} };
return ( return (
<Modal <Modal
title={`${type === 'add' ? '元数据发布' : '编辑'}`} title={`${type === 'add' ? '元数据发布' : '编辑'}`}
bodyStyle={{ width: '100%', minHeight: '100px' }} bodyStyle={{ width: '100%' }}
style={{ top: '150px' }} style={{ top: '150px' }}
width="700px" width="700px"
destroyOnClose destroyOnClose
...@@ -100,7 +92,13 @@ const AddModal = props => { ...@@ -100,7 +92,13 @@ const AddModal = props => {
rules={[{ required: true, message: '请选择服务名' }]} rules={[{ required: true, message: '请选择服务名' }]}
> >
<Select onChange={handleChange}> <Select onChange={handleChange}>
{listData.map((item, index) => { return <Option value={item} key={index}>{item}</Option> }) } {listData.map((item, index) => {
return (
<Option value={item} key={index}>
{item}
</Option>
);
})}
</Select> </Select>
</Item> </Item>
</Form> </Form>
......
...@@ -149,7 +149,7 @@ const VectorData = props => { ...@@ -149,7 +149,7 @@ const VectorData = props => {
// } // }
// ]; // ];
//获取选中的角色 // 获取选中的角色
const onPushSubmit = value => { const onPushSubmit = value => {
let id = []; let id = [];
if (value.length) { if (value.length) {
...@@ -174,11 +174,11 @@ const VectorData = props => { ...@@ -174,11 +174,11 @@ const VectorData = props => {
}); });
} }
}; };
//获取角色 // 获取角色
const pickRole = record => { const pickRole = record => {
setRecord(record); setRecord(record);
}; };
//设置web方案 // 设置web方案
const onChangeCheck = (e, record, index) => { const onChangeCheck = (e, record, index) => {
setCheckLoading(true); setCheckLoading(true);
IsActionWebSchema({ schemaname: record.scheme.schemename }).then(res => { IsActionWebSchema({ schemaname: record.scheme.schemename }).then(res => {
...@@ -192,7 +192,7 @@ const VectorData = props => { ...@@ -192,7 +192,7 @@ const VectorData = props => {
}); });
}; };
//选择手持方案 // 选择手持方案
const onChangeHand = (e, record, index) => { const onChangeHand = (e, record, index) => {
setCheckLoading(true); setCheckLoading(true);
const newLoadings = [...handStatus]; const newLoadings = [...handStatus];
...@@ -280,7 +280,7 @@ const VectorData = props => { ...@@ -280,7 +280,7 @@ const VectorData = props => {
setVisible(false); setVisible(false);
setFlag(flag + 1); setFlag(flag + 1);
}; };
//删除web配置方案 // 删除web配置方案
const delWebConfirm = record => { const delWebConfirm = record => {
DeleteWebSchema(record.scheme.schemename).then(res => { DeleteWebSchema(record.scheme.schemename).then(res => {
if (res.msg === '') { if (res.msg === '') {
...@@ -291,7 +291,7 @@ const VectorData = props => { ...@@ -291,7 +291,7 @@ const VectorData = props => {
} }
}); });
}; };
//删除手持配置方案 // 删除手持配置方案
const delhandConfirm = record => { const delhandConfirm = record => {
deleteConfig({ deleteConfig({
schemename: record['schemename'], schemename: record['schemename'],
...@@ -306,7 +306,7 @@ const VectorData = props => { ...@@ -306,7 +306,7 @@ const VectorData = props => {
} }
}); });
}; };
//添加方案 // 添加方案
const addType = type => { const addType = type => {
setType(type); setType(type);
let listData = []; let listData = [];
...@@ -349,12 +349,12 @@ const VectorData = props => { ...@@ -349,12 +349,12 @@ const VectorData = props => {
// 获取瓦片数据配置数据 // 获取瓦片数据配置数据
const renderTile = () => { const renderTile = () => {
setCheckLoading(true); setCheckLoading(true);
//查询手持方案 // 查询手持方案
// var schemeConfigQueryRequest = GetMaplayerByTerminalType({ // var schemeConfigQueryRequest = GetMaplayerByTerminalType({
// terminalType: 'phone', // terminalType: 'phone',
// isBaseMap: false // isBaseMap: false
// }) // })
//查询web方案 // 查询web方案
var webSchemeQueryRequest = GetWebSchemaList(); var webSchemeQueryRequest = GetWebSchemaList();
Promise.all([webSchemeQueryRequest]) Promise.all([webSchemeQueryRequest])
.then(res => { .then(res => {
......
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, notification, Slider, InputNumber, Row, Col, Image, Radio, Button } from 'antd'; import {
import styles from '../SchemeConfig.less' Form,
Modal,
Input,
Select,
notification,
Slider,
InputNumber,
Row,
Col,
Image,
Radio,
Button,
} from 'antd';
import styles from '../SchemeConfig.less';
import thumbnail_1 from '@/assets/images/thumbnail/thumbnail_1.jpg'; import thumbnail_1 from '@/assets/images/thumbnail/thumbnail_1.jpg';
import thumbnail_2 from '@/assets/images/thumbnail/thumbnail_2.jpg'; import thumbnail_2 from '@/assets/images/thumbnail/thumbnail_2.jpg';
import thumbnail_3 from '@/assets/images/thumbnail/thumbnail_3.jpg'; import thumbnail_3 from '@/assets/images/thumbnail/thumbnail_3.jpg';
import thumbnail_4 from '@/assets/images/thumbnail/thumbnail_4.jpg'; import thumbnail_4 from '@/assets/images/thumbnail/thumbnail_4.jpg';
import { import { SetServiceConfig } from '@/services/webConfig/api';
SetServiceConfig
} from '@/services/webConfig/api';
const { Item } = Form; const { Item } = Form;
const { Option } = Select; const { Option } = Select;
const AddModal = props => { const AddModal = props => {
const { callBackSubmit = () => { }, type, formObj, visible, baseMap } = props; const { callBackSubmit = () => {}, type, formObj, visible, baseMap } = props;
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [radio, setRadio] = useState(); const [radio, setRadio] = useState();
const [alpha, setAlpha] = useState(1); const [alpha, setAlpha] = useState(1);
const [mapType, setMapType] = useState(0); const [mapType, setMapType] = useState(0);
const [form] = Form.useForm(); const [form] = Form.useForm();
const arr = ['assets/images/thumbnail/thumbnail_1.jpg', 'assets/images/thumbnail/thumbnail_2.jpg', 'assets/images/thumbnail/thumbnail_3.jpg', 'assets/images/thumbnail/thumbnail_4.jpg'] const arr = [
'assets/images/thumbnail/thumbnail_1.jpg',
'assets/images/thumbnail/thumbnail_2.jpg',
'assets/images/thumbnail/thumbnail_3.jpg',
'assets/images/thumbnail/thumbnail_4.jpg',
];
// 提交 // 提交
const onSubmit = () => { const onSubmit = () => {
...@@ -34,56 +50,57 @@ const AddModal = props => { ...@@ -34,56 +50,57 @@ const AddModal = props => {
url: obj.url, url: obj.url,
icon: obj.icon, icon: obj.icon,
type: obj.type, type: obj.type,
}) }),
} };
SetServiceConfig(arr) SetServiceConfig(arr)
.then(res => { .then(res => {
setLoading(false); setLoading(false);
if (res.msg === "Ok") { if (res.msg === 'Ok') {
form.resetFields(); form.resetFields();
callBackSubmit(); callBackSubmit();
notification.success({ notification.success({
message: '提示', message: '提示',
duration: 3, duration: 3,
description: res.message || type == 'add' ? '新增成功' : '编辑成功' description: res.message || type == 'add' ? '新增成功' : '编辑成功',
}); });
} else { } else {
notification.error({ notification.error({
message: '提示', message: '提示',
duration: 3, duration: 3,
description: res.message || type == 'add' ? '新增失败' : '编辑失败' description: res.message || type == 'add' ? '新增失败' : '编辑失败',
}); });
} }
}) })
.catch(err => { setLoading(false); }); .catch(err => {
setLoading(false);
});
} }
}); });
}; };
const onFinish = value => {};
const onFinish = value => { };
useEffect(() => { useEffect(() => {
switch (type) { switch (type) {
case 'add': case 'add':
setRadio('') setRadio('');
form.resetFields(); form.resetFields();
form.setFieldsValue({ form.setFieldsValue({
servicename: baseMap[0], servicename: baseMap[0],
label: baseMap[0], label: baseMap[0],
type: servicenameToType(baseMap[0]) type: servicenameToType(baseMap[0]),
}) });
break; break;
case 'edit': case 'edit':
form.setFieldsValue({ ...formObj }); form.setFieldsValue({ ...formObj });
let index = formObj.icon.lastIndexOf("/") let index = formObj.icon.lastIndexOf('/');
let str = formObj.icon.substring(index + 1, formObj.icon.length); let str = formObj.icon.substring(index + 1, formObj.icon.length);
let defaultIndex = arr.filter((item, index) => { let defaultIndex = arr.filter((item, index) => {
if (item.indexOf(str) !== -1) { if (item.indexOf(str) !== -1) {
return index return index;
} }
}) });
setRadio(defaultIndex[0]) setRadio(defaultIndex[0]);
break; break;
default: default:
break; break;
...@@ -96,89 +113,88 @@ const AddModal = props => { ...@@ -96,89 +113,88 @@ const AddModal = props => {
// } // }
}, [visible]); }, [visible]);
const layout = { const layout = {
layout: 'horizontal', layout: 'horizontal',
labelCol: { labelCol: {
span: 4, span: 4,
}, },
wrapperCol: { wrapperCol: {
span: 16, span: 18,
}, },
}; };
const onChange = (value) => { const onChange = value => {
let silderData = value == 100 ? 1 : (value / 100).toFixed(1) let silderData = value == 100 ? 1 : (value / 100).toFixed(1);
setAlpha(silderData) setAlpha(silderData);
} };
const tipFormatter = (value) => { const tipFormatter = value => {
return (value / 100).toFixed(1) return (value / 100).toFixed(1);
} };
const imgURL = [ const imgURL = [
{ {
url: thumbnail_1 url: thumbnail_1,
}, },
{ {
url: thumbnail_2 url: thumbnail_2,
}, },
{ {
url: thumbnail_3 url: thumbnail_3,
}, },
{ {
url: thumbnail_4 url: thumbnail_4,
}, },
] ];
const radioChange = (e) => { const radioChange = e => {
setRadio(e.target.value) setRadio(e.target.value);
} };
const handleChange = (value) => { const handleChange = value => {
form.setFieldsValue({ form.setFieldsValue({
type: servicenameToType(value) type: servicenameToType(value),
}) });
// if (baseMap.indexOf(value) == 2 || baseMap.indexOf(value) == 3) { // if (baseMap.indexOf(value) == 2 || baseMap.indexOf(value) == 3) {
// setMapType(1) // setMapType(1)
// } // }
// else { // else {
// setMapType(0) // setMapType(0)
// } // }
} };
//添加地图类型 //添加地图类型
const servicenameToType = (servicename) => { const servicenameToType = servicename => {
// if (servicename.indexOf('地形图') > -1) // if (servicename.indexOf('地形图') > -1)
// servicename = '地形图' // servicename = '地形图'
// if (servicename.indexOf('自定义底图') > -1) // if (servicename.indexOf('自定义底图') > -1)
// servicename = '自定义底图' // servicename = '自定义底图'
switch (servicename) { switch (servicename) {
case "谷歌地形": case '谷歌地形':
return 'google-v'; return 'google-v';
case "谷歌影像(注记)": case '谷歌影像(注记)':
return 'google-i-a'; return 'google-i-a';
case "谷歌影像": case '谷歌影像':
return 'google-i'; return 'google-i';
case "高德影像": case '高德影像':
return 'amap-i'; return 'amap-i';
case "高德地形": case '高德地形':
return 'amap-v'; return 'amap-v';
case "天地图影像": case '天地图影像':
return 'tianditu-i-ia'; return 'tianditu-i-ia';
case "天地图地形": case '天地图地形':
return 'tianditu-v-va'; return 'tianditu-v-va';
case "自定义底图": case '自定义底图':
return 'google-user'; return 'google-user';
case "地形图": case '地形图':
case "瓦片图": case '瓦片图':
return "pipenet-tile"; return 'pipenet-tile';
default: default:
return 'arcgis-tilelayer'; return 'arcgis-tilelayer';
} }
} };
//选择坐标系 //选择坐标系
const handleCoordinate = () => { } const handleCoordinate = () => {};
//选择图层 //选择图层
const handleLayer = () => { } const handleLayer = () => {};
//选择工作空间 //选择工作空间
const handleWorkSpance = () => { } const handleWorkSpance = () => {};
return ( return (
<Modal <Modal
...@@ -204,32 +220,28 @@ const AddModal = props => { ...@@ -204,32 +220,28 @@ const AddModal = props => {
rules={[{ required: true, message: '请选择服务名' }]} rules={[{ required: true, message: '请选择服务名' }]}
> >
<Select onChange={handleChange}> <Select onChange={handleChange}>
{type === 'add' ? baseMap.map((item, index) => { return <Option value={item} key={index}>{item}</Option> }) : ''} {type === 'add'
? baseMap.map((item, index) => {
return (
<Option value={item} key={index}>
{item}
</Option>
);
})
: ''}
</Select> </Select>
</Item> </Item>
<Item <Item label="标签" name="label" rules={[{ required: true, message: '请输入标签' }]}>
label="标签"
name="label"
rules={[{ required: true, message: '请输入标签' }]}
>
<Input placeholder="请输入IP" allowClear /> <Input placeholder="请输入IP" allowClear />
</Item> </Item>
<Item <Item label="类型" name="type">
label="类型"
name="type"
>
<Input placeholder="请输入类型" allowClear disabled /> <Input placeholder="请输入类型" allowClear disabled />
</Item> </Item>
<Item <Item label="URL" name="url">
label="URL"
name="url"
>
<Input placeholder="请输入URL" allowClear /> <Input placeholder="请输入URL" allowClear />
</Item> </Item>
<Item <Item label="透明度">
label="透明度"
>
<Row> <Row>
<Col span={12}> <Col span={12}>
<Slider <Slider
...@@ -254,39 +266,26 @@ const AddModal = props => { ...@@ -254,39 +266,26 @@ const AddModal = props => {
</Col> </Col>
</Row> </Row>
</Item> </Item>
<Item <Item label="选择缩略图" name="icon">
label="选择缩略图"
name="icon"
>
<div className={styles.imgList}> <div className={styles.imgList}>
{imgURL.map((item, index) => { {imgURL.map((item, index) => {
return <div key={index} className={styles.imgItem}> return (
<Image <div key={index} className={styles.imgItem}>
width={100} <Image width={100} height={63} src={item.url} />
height={63} <Radio.Group options={item} onChange={radioChange} value={radio}>
src={item.url} <Radio value={arr[index]} />
/> </Radio.Group>
<Radio.Group options={item} onChange={radioChange} value={radio}> </div>
<Radio value={arr[index]}></Radio> );
</Radio.Group>
</div>
})} })}
</div> </div>
</Item> </Item>
<Item <Item label="缩略图" name="icon" rules={[{ required: true, message: '请选择缩略图' }]}>
label="缩略图"
name="icon"
rules={[{ required: true, message: '请选择缩略图' }]}
>
<Input placeholder="请输入URL" allowClear /> <Input placeholder="请输入URL" allowClear />
</Item> </Item>
{mapType === 1 ? {mapType === 1 ? (
<> <>
<Item <Item label="ip地址" name="IP" rules={[{ required: true, message: '请输入ip地址' }]}>
label="ip地址"
name="IP"
rules={[{ required: true, message: '请输入ip地址' }]}
>
<Input placeholder="请输入ip地址" allowClear /> <Input placeholder="请输入ip地址" allowClear />
</Item> </Item>
<Item <Item
...@@ -305,27 +304,21 @@ const AddModal = props => { ...@@ -305,27 +304,21 @@ const AddModal = props => {
name="workSpance" name="workSpance"
rules={[{ required: true, message: '请选择工作空间' }]} rules={[{ required: true, message: '请选择工作空间' }]}
> >
<Select onChange={handleWorkSpance}> <Select onChange={handleWorkSpance} />
</Select>
</Item> </Item>
<Item <Item
label="图层名" label="图层名"
name="layer" name="layer"
rules={[{ required: true, message: '请选择图层名' }]} rules={[{ required: true, message: '请选择图层名' }]}
> >
<Select onChange={handleLayer}> <Select onChange={handleLayer} />
</Select>
</Item> </Item>
<Item <Item
label="坐标系名" label="坐标系名"
name="coordinate" name="coordinate"
rules={[{ required: true, message: '请选择坐标系名' }]} rules={[{ required: true, message: '请选择坐标系名' }]}
> >
<Select onChange={handleCoordinate}> <Select onChange={handleCoordinate} />
</Select>
</Item> </Item>
<Item <Item
...@@ -357,7 +350,9 @@ const AddModal = props => { ...@@ -357,7 +350,9 @@ const AddModal = props => {
<Input placeholder="请输入URL" allowClear /> <Input placeholder="请输入URL" allowClear />
</Item> </Item>
</> </>
: ''} ) : (
''
)}
</Form> </Form>
)} )}
</Modal> </Modal>
......
...@@ -10,7 +10,7 @@ const TileData = props => { ...@@ -10,7 +10,7 @@ const TileData = props => {
const [type, setType] = useState(''); // 弹窗类型 const [type, setType] = useState(''); // 弹窗类型
const [formObj, setFormObj] = useState({}); const [formObj, setFormObj] = useState({});
const [flag, setFlag] = useState(0); // 弹窗类型 const [flag, setFlag] = useState(0); // 弹窗类型
const [baseMap, setBaseMap] = useState([]); //底图数据 const [baseMap, setBaseMap] = useState([]); // 底图数据
const columns = [ const columns = [
{ {
title: '服务名', title: '服务名',
......
...@@ -96,7 +96,7 @@ const AddModal = props => { ...@@ -96,7 +96,7 @@ const AddModal = props => {
} }
}, [visible]); }, [visible]);
//存储到localstorage // 存储到localstorage
const handlelocalStorage = (type, gsIp, gisAppName) => { const handlelocalStorage = (type, gsIp, gisAppName) => {
if (!localStorage) return null; if (!localStorage) return null;
let result = JSON.parse(localStorage.getItem('metaData')); let result = JSON.parse(localStorage.getItem('metaData'));
...@@ -133,11 +133,11 @@ const AddModal = props => { ...@@ -133,11 +133,11 @@ const AddModal = props => {
span: 5, span: 5,
}, },
wrapperCol: { wrapperCol: {
span: 16, span: 18,
}, },
}; };
//选择工作空间 // 选择工作空间
const selectWorkspace = () => { const selectWorkspace = () => {
let obj = form.getFieldsValue(); let obj = form.getFieldsValue();
form form
...@@ -170,7 +170,7 @@ const AddModal = props => { ...@@ -170,7 +170,7 @@ const AddModal = props => {
} }
}); });
}; };
//选择工作空间 // 选择工作空间
const handleWorkspace = value => { const handleWorkspace = value => {
form.setFieldsValue({ form.setFieldsValue({
workname: value, workname: value,
...@@ -243,7 +243,7 @@ const AddModal = props => { ...@@ -243,7 +243,7 @@ const AddModal = props => {
rules={[{ required: true, message: '请选择工作空间名称' }]} rules={[{ required: true, message: '请选择工作空间名称' }]}
> >
<div className={styles.imgList}> <div className={styles.imgList}>
<Select onChange={handleWorkspace} value={workSpace} style={{ width: '310px' }}> <Select onChange={handleWorkspace} value={workSpace} style={{ width: '365px' }}>
{workList.length {workList.length
? workList.map((item, index) => { ? workList.map((item, index) => {
return ( return (
......
...@@ -85,7 +85,7 @@ const VectorData = props => { ...@@ -85,7 +85,7 @@ const VectorData = props => {
), ),
}, },
]; ];
//更新 // 更新
const enterLoading = (record, index) => { const enterLoading = (record, index) => {
const newLoadings = [...loading]; const newLoadings = [...loading];
newLoadings[index] = true; newLoadings[index] = true;
......
...@@ -4,17 +4,16 @@ import { ...@@ -4,17 +4,16 @@ import {
GettMaplayer, GettMaplayer,
GetVectorService, GetVectorService,
SetServiceConfig, SetServiceConfig,
bindSchemeBaseMap bindSchemeBaseMap,
} from '@/services/webConfig/api'; } from '@/services/webConfig/api';
const { Item } = Form; const { Item } = Form;
const { Option } = Select; const { Option } = Select;
const AddModal = props => { const AddModal = props => {
const { callBackSubmit = () => { }, type, formObj, visible, serviceList } = props; const { callBackSubmit = () => {}, type, formObj, visible, serviceList } = props;
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [baseMap, setBaseMap] = useState([]); const [baseMap, setBaseMap] = useState([]);
const [pipeArr, setPipeArr] = useState([]); const [pipeArr, setPipeArr] = useState([]);
const [form] = Form.useForm(); const [form] = Form.useForm();
// 提交 // 提交
const onSubmit = () => { const onSubmit = () => {
...@@ -25,18 +24,17 @@ const AddModal = props => { ...@@ -25,18 +24,17 @@ const AddModal = props => {
if (type === 'add') { if (type === 'add') {
bindSchemeBaseMap({ bindSchemeBaseMap({
schemename: formObj.schemename, schemename: formObj.schemename,
basemapName: obj.serverName basemapName: obj.serverName,
}).then(res => { }).then(res => {
setLoading(false); setLoading(false);
if (res.code === 0) { if (res.code === 0) {
form.resetFields(); form.resetFields();
callBackSubmit(); callBackSubmit();
prompt('success', '瓦片新增成功') prompt('success', '瓦片新增成功');
} } else {
else { prompt('fail', '瓦片新增失败');
prompt('fail', '瓦片新增失败')
} }
}) });
} else { } else {
handleEdit(); handleEdit();
} }
...@@ -50,15 +48,14 @@ const AddModal = props => { ...@@ -50,15 +48,14 @@ const AddModal = props => {
duration: 3, duration: 3,
description: content, description: content,
}); });
} } else {
else {
notification.error({ notification.error({
message: '提示', message: '提示',
duration: 3, duration: 3,
description: content, description: content,
}); });
} }
} };
const handleEdit = () => { const handleEdit = () => {
let obj = form.getFieldsValue(); let obj = form.getFieldsValue();
let query = { let query = {
...@@ -71,17 +68,17 @@ const AddModal = props => { ...@@ -71,17 +68,17 @@ const AddModal = props => {
label: obj.label, label: obj.label,
url: obj.url, url: obj.url,
alpha: 1, alpha: 1,
}) }),
} };
SetServiceConfig(query) SetServiceConfig(query)
.then(res => { .then(res => {
setLoading(false); setLoading(false);
if (res.msg === "Ok") { if (res.msg === 'Ok') {
form.resetFields(); form.resetFields();
callBackSubmit(); callBackSubmit();
prompt('success', '方案新增成功') prompt('success', '方案新增成功');
} else { } else {
prompt('fail', '方案新增失败') prompt('fail', '方案新增失败');
} }
}) })
.catch(err => { .catch(err => {
...@@ -89,74 +86,73 @@ const AddModal = props => { ...@@ -89,74 +86,73 @@ const AddModal = props => {
}); });
}; };
const onFinish = value => { const onFinish = value => {};
};
useEffect(() => { useEffect(() => {
switch (type) { switch (type) {
case 'add': case 'add':
addTile() addTile();
break; break;
case 'schemeAdd': case 'schemeAdd':
pipeNetwork() pipeNetwork();
break; break;
default: default:
break; break;
} }
}, [visible]); }, [visible]);
//添加瓦片 // 添加瓦片
const addTile = () => { const addTile = () => {
form.setFieldsValue({ form.setFieldsValue({
serverName: serviceList[0] serverName: serviceList[0],
}) });
} };
//获取管网及默认底图 // 获取管网及默认底图
const pipeNetwork = () => { const pipeNetwork = () => {
form.resetFields(); form.resetFields();
let req1 = GettMaplayer({ terminalType: 'base', isBaseMap: true }) let req1 = GettMaplayer({ terminalType: 'base', isBaseMap: true });
let req2 = GetVectorService() let req2 = GetVectorService();
let pipeArr = [], baseMap = []; let pipeArr = [],
baseMap = [];
Promise.all([req1, req2]).then(res => { Promise.all([req1, req2]).then(res => {
if (res[0].msg === 'Ok') { if (res[0].msg === 'Ok') {
(res[0].data.general.baseMap.layers || []).map(item => { (res[0].data.general.baseMap.layers || []).map(item => {
baseMap.push(item.servicename) baseMap.push(item.servicename);
}) });
} }
if (res[1].msg === 'Ok') { if (res[1].msg === 'Ok') {
(res[1].data.VectorList || []).map(item => { (res[1].data.VectorList || []).map(item => {
pipeArr.push(item.ServiceName.split(".")[0]) pipeArr.push(item.ServiceName.split('.')[0]);
}) });
} }
setPipeArr(pipeArr) setPipeArr(pipeArr);
setBaseMap(baseMap) setBaseMap(baseMap);
form.setFieldsValue({ form.setFieldsValue({
baseMap: baseMap[0] baseMap: baseMap[0],
}) });
}) });
} };
const layout = { const layout = {
layout: 'horizontal', layout: 'horizontal',
labelCol: { labelCol: {
span: 4, span: 4,
}, },
wrapperCol: { wrapperCol: {
span: 16, span: 18,
}, },
}; };
//选择服务名 // 选择服务名
const handleChange = () => { } const handleChange = () => {};
//选择管网 // 选择管网
const handleService = (value) => { const handleService = value => {
form.setFieldsValue({ form.setFieldsValue({
label: value, label: value,
url: `http://{IP}/CityInterface/rest/services/MapServer.svc/${value}` url: `http://{IP}/CityInterface/rest/services/MapServer.svc/${value}`,
}) });
} };
//选择底图 // 选择底图
const handleBaseMap = () => { } const handleBaseMap = () => {};
return ( return (
<Modal <Modal
title={`${type === 'add' ? '添加底图' : '添加方案'}`} title={`${type === 'add' ? '添加底图' : '添加方案'}`}
...@@ -175,14 +171,21 @@ const AddModal = props => { ...@@ -175,14 +171,21 @@ const AddModal = props => {
> >
{visible && ( {visible && (
<Form form={form} {...layout} onFinish={onFinish}> <Form form={form} {...layout} onFinish={onFinish}>
{type === 'add' ? <Item {type === 'add' ? (
label="服务名" <Item label="服务名" name="serverName">
name="serverName" <Select onChange={handleChange}>
> {serviceList.length
<Select onChange={handleChange}> ? serviceList.map((item, index) => {
{serviceList.length ? serviceList.map((item, index) => { return <Option key={index} value={item}>{item}</Option> }) : ''} return (
</Select> <Option key={index} value={item}>
</Item> : {item}
</Option>
);
})
: ''}
</Select>
</Item>
) : (
<> <>
<Item <Item
label="方案名" label="方案名"
...@@ -191,24 +194,23 @@ const AddModal = props => { ...@@ -191,24 +194,23 @@ const AddModal = props => {
> >
<Input placeholder="请输入方案名" allowClear /> <Input placeholder="请输入方案名" allowClear />
</Item> </Item>
<Item <Item label="管网" name="servicename">
label="管网"
name="servicename"
>
<Select onChange={handleService}> <Select onChange={handleService}>
{pipeArr.length ? pipeArr.map((item, index) => { return <Option key={index} value={item}>{item}</Option> }) : ''} {pipeArr.length
? pipeArr.map((item, index) => {
return (
<Option key={index} value={item}>
{item}
</Option>
);
})
: ''}
</Select> </Select>
</Item> </Item>
<Item <Item label="标签" name="label">
label="标签"
name="label"
>
<Input placeholder="请输入标签" allowClear /> <Input placeholder="请输入标签" allowClear />
</Item> </Item>
<Item <Item label="url" name="url">
label="url"
name="url"
>
<Input placeholder="请输入url" allowClear /> <Input placeholder="请输入url" allowClear />
</Item> </Item>
<Item <Item
...@@ -217,13 +219,19 @@ const AddModal = props => { ...@@ -217,13 +219,19 @@ const AddModal = props => {
rules={[{ required: true, message: '请选择底图' }]} rules={[{ required: true, message: '请选择底图' }]}
> >
<Select onChange={handleBaseMap}> <Select onChange={handleBaseMap}>
{baseMap.length ? baseMap.map((item, index) => { return <Option key={index} value={item}>{item}</Option> }) : ''} {baseMap.length
? baseMap.map((item, index) => {
return (
<Option key={index} value={item}>
{item}
</Option>
);
})
: ''}
</Select> </Select>
</Item> </Item>
</> </>
} )}
</Form> </Form>
)} )}
</Modal> </Modal>
......
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, AutoComplete, Button, notification } from 'antd'; import { Form, Modal, Input, Select, AutoComplete, Button, notification } from 'antd';
import { import { SetServiceConfig } from '@/services/webConfig/api';
SetServiceConfig
} from '@/services/webConfig/api';
const { Option } = Select; const { Option } = Select;
const AddModal = props => { const AddModal = props => {
const { callBackSubmit = () => { }, type, formObj, visible, listData } = props; const { callBackSubmit = () => {}, type, formObj, visible, listData } = props;
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [form] = Form.useForm(); const [form] = Form.useForm();
const { Item } = Form; const { Item } = Form;
...@@ -21,11 +18,14 @@ const AddModal = props => { ...@@ -21,11 +18,14 @@ const AddModal = props => {
schemename: obj.schemename, schemename: obj.schemename,
terminalType: type === 'add' ? 'web' : 'phone', terminalType: type === 'add' ? 'web' : 'phone',
isBaseMap: 'false', isBaseMap: 'false',
jsonCfg: type === 'add' ? JSON.stringify({ type: 'dynamic' }) : JSON.stringify({ isDefault: false }) jsonCfg:
type === 'add'
? JSON.stringify({ type: 'dynamic' })
: JSON.stringify({ isDefault: false }),
}) })
.then(res => { .then(res => {
setLoading(false); setLoading(false);
if (res.msg === "Ok") { if (res.msg === 'Ok') {
form.resetFields(); form.resetFields();
callBackSubmit(); callBackSubmit();
notification.success({ notification.success({
...@@ -33,7 +33,6 @@ const AddModal = props => { ...@@ -33,7 +33,6 @@ const AddModal = props => {
duration: 3, duration: 3,
description: '新增成功', description: '新增成功',
}); });
} else { } else {
notification.error({ notification.error({
message: '提示', message: '提示',
...@@ -50,39 +49,35 @@ const AddModal = props => { ...@@ -50,39 +49,35 @@ const AddModal = props => {
}); });
setLoading(false); setLoading(false);
}); });
} }
}); });
}; };
const onFinish = value => {};
const onFinish = value => { };
useEffect(() => { useEffect(() => {
if(type!=''){ if (type != '') {
form.setFieldsValue({ schemename: listData[0] }); form.setFieldsValue({ schemename: listData[0] });
} }
}, [visible]); }, [visible]);
const layout = { const layout = {
layout: 'horizontal', layout: 'horizontal',
labelCol: { labelCol: {
span: 4, span: 3,
}, },
wrapperCol: { wrapperCol: {
span: 16, span: 20,
}, },
}; };
const handleChange = (value) => { const handleChange = value => {
form.setFieldsValue({ schemename: value}); form.setFieldsValue({ schemename: value });
} };
return ( return (
<Modal <Modal
title={`${type === 'add' ? '元数据发布' : '编辑'}`} title={`${type === 'add' ? '元数据发布' : '编辑'}`}
bodyStyle={{ width: '100%', minHeight: '100px' }} bodyStyle={{ width: '100%' }}
style={{ top: '150px' }} style={{ top: '150px' }}
width="700px" width="700px"
destroyOnClose destroyOnClose
...@@ -103,7 +98,13 @@ const AddModal = props => { ...@@ -103,7 +98,13 @@ const AddModal = props => {
rules={[{ required: true, message: '请选择服务名' }]} rules={[{ required: true, message: '请选择服务名' }]}
> >
<Select onChange={handleChange}> <Select onChange={handleChange}>
{listData.map((item, index) => { return <Option value={item} key={index}>{item}</Option> }) } {listData.map((item, index) => {
return (
<Option value={item} key={index}>
{item}
</Option>
);
})}
</Select> </Select>
</Item> </Item>
</Form> </Form>
......
/* eslint-disable no-return-assign */
import { Space, Table, Button, Popconfirm, notification, Divider, Checkbox, Spin } from 'antd'; import { Space, Table, Button, Popconfirm, notification, Divider, Checkbox, Spin } from 'antd';
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import styles from '../SchemeConfig.less'; import styles from '../SchemeConfig.less';
...@@ -14,11 +15,11 @@ import AddModal from './AddModal'; ...@@ -14,11 +15,11 @@ import AddModal from './AddModal';
const VectorData = props => { const VectorData = props => {
const [treeLoading, setTreeLoading] = useState(false); // 弹窗显示 const [treeLoading, setTreeLoading] = useState(false); // 弹窗显示
const [schemename, setSchemename] = useState([]); const [schemename, setSchemename] = useState([]);
const [record, setRecord] = useState({}); //选中关联角色的方案名 const [record, setRecord] = useState({}); // 选中关联角色的方案名
const [webCurrent, setWebCurrent] = useState(0); // web列表下标 const [webCurrent, setWebCurrent] = useState(0); // web列表下标
const [handCurrent, setHandCurrent] = useState(0); // hand列表下标 const [handCurrent, setHandCurrent] = useState(0); // hand列表下标
const [webData, setWebData] = useState([]); // web数据 const [webData, setWebData] = useState([]); // web数据
const [handData, setHandData] = useState([]); //手持数据 const [handData, setHandData] = useState([]); // 手持数据
const [visible, setVisible] = useState(false); // 弹窗 const [visible, setVisible] = useState(false); // 弹窗
const [flag, setFlag] = useState(0); // 更新list const [flag, setFlag] = useState(0); // 更新list
const [handStatus, setHandStatus] = useState([]); // 更新状态 const [handStatus, setHandStatus] = useState([]); // 更新状态
...@@ -155,7 +156,7 @@ const VectorData = props => { ...@@ -155,7 +156,7 @@ const VectorData = props => {
), ),
}, },
]; ];
//获取选中的角色 // 获取选中的角色
const onPushSubmit = value => { const onPushSubmit = value => {
let id = []; let id = [];
if (value.length) { if (value.length) {
...@@ -184,12 +185,12 @@ const VectorData = props => { ...@@ -184,12 +185,12 @@ const VectorData = props => {
}); });
} }
}; };
//获取角色 // 获取角色
const pickRole = record => { const pickRole = record => {
console.log('recird', record); console.log('recird', record);
setRecord(record); setRecord(record);
}; };
//设置web方案 // 设置web方案
const onChangeCheck = (e, record, index) => { const onChangeCheck = (e, record, index) => {
setCheckLoading(true); setCheckLoading(true);
const newLoadings = [...webStatus]; const newLoadings = [...webStatus];
...@@ -199,6 +200,7 @@ const VectorData = props => { ...@@ -199,6 +200,7 @@ const VectorData = props => {
: (newLoadings[loadIndex] = false); : (newLoadings[loadIndex] = false);
}); });
setWebStatus(newLoadings); setWebStatus(newLoadings);
console.log(newLoadings);
let query = { let query = {
schemename: record['schemename'], schemename: record['schemename'],
type: 'dynamic', type: 'dynamic',
...@@ -247,7 +249,7 @@ const VectorData = props => { ...@@ -247,7 +249,7 @@ const VectorData = props => {
}); });
}; };
//选择手持方案 // 选择手持方案
const onChangeHand = (e, record, index) => { const onChangeHand = (e, record, index) => {
setCheckLoading(true); setCheckLoading(true);
const newLoadings = [...handStatus]; const newLoadings = [...handStatus];
...@@ -350,7 +352,7 @@ const VectorData = props => { ...@@ -350,7 +352,7 @@ const VectorData = props => {
} }
}); });
}; };
//删除手持配置方案 // 删除手持配置方案
const delhandConfirm = record => { const delhandConfirm = record => {
deleteConfig({ deleteConfig({
schemename: record['schemename'], schemename: record['schemename'],
...@@ -365,7 +367,7 @@ const VectorData = props => { ...@@ -365,7 +367,7 @@ const VectorData = props => {
} }
}); });
}; };
//添加方案 // 添加方案
const addType = type => { const addType = type => {
setType(type); setType(type);
let listData = []; let listData = [];
...@@ -411,12 +413,12 @@ const VectorData = props => { ...@@ -411,12 +413,12 @@ const VectorData = props => {
// 获取瓦片数据配置数据 // 获取瓦片数据配置数据
const renderTile = () => { const renderTile = () => {
setCheckLoading(true); setCheckLoading(true);
//查询手持方案 // 查询手持方案
var schemeConfigQueryRequest = GetMaplayerByTerminalType({ var schemeConfigQueryRequest = GetMaplayerByTerminalType({
terminalType: 'phone', terminalType: 'phone',
isBaseMap: false, isBaseMap: false,
}); });
//查询web方案 // 查询web方案
var webSchemeQueryRequest = GetMaplayerByTerminalType({ var webSchemeQueryRequest = GetMaplayerByTerminalType({
terminalType: 'web', terminalType: 'web',
isBaseMap: false, isBaseMap: false,
...@@ -481,6 +483,7 @@ const VectorData = props => { ...@@ -481,6 +483,7 @@ const VectorData = props => {
columns={columns} columns={columns}
dataSource={webData} dataSource={webData}
bordered bordered
style={{ minHeight: '210px' }}
pagination={{ pagination={{
showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条`, showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条`,
defaultPageSize: 8, defaultPageSize: 8,
...@@ -489,7 +492,7 @@ const VectorData = props => { ...@@ -489,7 +492,7 @@ const VectorData = props => {
}, },
}} }}
rowKey="schemename" rowKey="schemename"
scroll={{ y: 400 }} scroll={{ y: 210 }}
/> />
</div> </div>
<Divider orientation="left"> <Divider orientation="left">
...@@ -508,7 +511,7 @@ const VectorData = props => { ...@@ -508,7 +511,7 @@ const VectorData = props => {
dataSource={handData} dataSource={handData}
bordered bordered
rowKey="schemename" rowKey="schemename"
scroll={{ y: 600 }} scroll={{ y: 210 }}
pagination={{ pagination={{
showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条`, showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条`,
defaultPageSize: 8, defaultPageSize: 8,
......
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