对接三维瓦片数据接口

src/pages/platformCenter/dimensionsConfig/TileConfig/AddModal.jsx

@@ -6,8 +6,9 @@ import thumbnail_2 from '@/assets/images/thumbnail/thumbnail_2.jpg';
 import thumbnail_3 from '@/assets/images/thumbnail/thumbnail_3.jpg';
 import thumbnail_4 from '@/assets/images/thumbnail/thumbnail_4.jpg';
 import {
-  SetServiceConfig
+  AddBaseMap,EditBaseMap
 } from '@/services/webConfig/api';
+import { number } from 'prop-types';
 const { Item } = Form;
 const { Option } = Select;
 const AddModal = props => {
@@ -23,23 +24,19 @@ const AddModal = props => {
   const onSubmit = () => {
     form.validateFields().then(validate => {
       if (validate) {
+        let str = type ==='add'?AddBaseMap:EditBaseMap
         let obj = form.getFieldsValue();
         let arr = {
-          servicename: obj.servicename,
-          terminalType: 'base',
-          isBaseMap: true,
-          jsonCfg: JSON.stringify({
-            alpha: alpha,
-            label: obj.label,
-            url: obj.url,
-            icon: obj.icon,
-            type: obj.type,
-          })
+          name: obj.name,
+          type: obj.type,
+          opacity: Number(alpha) ,
+          icon: obj.icon,
+          url: obj.url
         }
-        SetServiceConfig(arr)
+        str(arr)
           .then(res => {
             setLoading(false);
-            if (res.msg === "Ok") {
+            if (res.msg === "Ok" ||res.msg === "") {
               form.resetFields();
               callBackSubmit();
               notification.success({
@@ -66,24 +63,26 @@ const AddModal = props => {
     switch (type) {
       case 'add':
           setRadio('')
+          setAlpha(1)
           form.resetFields();
           form.setFieldsValue({
-            servicename: baseMap[0],
-            label: baseMap[0],
+            name: baseMap[0],
             type: servicenameToType(baseMap[0])
           })
         
         break;
       case 'edit':
         form.setFieldsValue({ ...formObj });
+        setAlpha(formObj.opacity)
         let index = formObj.icon.lastIndexOf("/")
         let str = formObj.icon.substring(index + 1, formObj.icon.length);
-        let defaultIndex = arr.filter((item, index) => {
+        let flag = ''
+        let defaultIndex = arr.filter((item, index1) => {
           if (item.indexOf(str) !== -1) {
-            return index
+            flag = index1
           }
-        })
-        setRadio(defaultIndex[0])
+        });
+        setRadio(arr[flag])
         break;
       default:
         break;
@@ -150,27 +149,18 @@ const AddModal = props => {
     // if (servicename.indexOf('自定义底图') > -1)
     //   servicename = '自定义底图'
     switch (servicename) {
-      case "谷歌地形":
-        return 'google-v';
-      case "谷歌影像(注记)":
-        return 'google-i-a';
-      case "谷歌影像":
-        return 'google-i';
+      case "高德街道":
+        return 'amap-v';
       case "高德影像":
         return 'amap-i';
-      case "高德地形":
-        return 'amap-v';
+      case "天地图街道":
+        return 'amap-i';
+      case "天地图影像":
+        return 'tianditu-v';
       case "天地图影像":
-        return 'tianditu-i-ia';
-      case "天地图地形":
-        return 'tianditu-v-va';
-      case "自定义底图":
-        return 'google-user';
-      case "地形图":
-      case "瓦片图":
-        return "pipenet-tile";
+        return 'tianditu-i';
       default:
-        return 'arcgis-tilelayer';
+        return 'amap-v';
     }
   }
   //选择坐标系
@@ -199,22 +189,14 @@ const AddModal = props => {
       {visible && (
         <Form form={form} {...layout} onFinish={onFinish}>
           <Item
-            label="服务名"
-            name="servicename"
+            label="名称"
+            name="name"
             rules={[{ required: true, message: '请选择服务名' }]}
           >
             <Select onChange={handleChange}>
               {type === 'add' ? baseMap.map((item, index) => { return <Option value={item} key={index}>{item}</Option> }) : ''}
             </Select>
           </Item>
-          <Item
-            label="标签"
-            name="label"
-            rules={[{ required: true, message: '请输入标签' }]}
-          >
-            <Input placeholder="请输入IP" allowClear />
-          </Item>
-
           <Item
             label="类型"
             name="type"
@@ -238,7 +220,7 @@ const AddModal = props => {
                   onChange={onChange}
                   step={0.1}
                   tipFormatter={tipFormatter}
-                  defaultValue={type === 'add' ? 100 : formObj.alpha * 100}
+                  defaultValue={type === 'add' ? 100 : formObj.opacity * 100}
                 />
               </Col>
               <Col span={4}>
@@ -247,7 +229,7 @@ const AddModal = props => {
                   max={1}
                   disabled
                   style={{ margin: '0 16px' }}
-                  defaultValue={type === 'add' ? 1 : formObj.alpha}
+                  defaultValue={type === 'add' ? 1 : formObj.opacity}
                   value={alpha}
                   onChange={onChange}
                 />

src/pages/platformCenter/dimensionsConfig/TileConfig/TileConfig.jsx

@@ -2,8 +2,8 @@ import { Space, Table, Button, Popconfirm, notification, Spin } from 'antd';
 import React, { useState, useEffect } from 'react';
 import styles from '../dimensionsConfig.less'
 import {
-    GettMaplayer,
-    deleteConfig
+    GetBaseMapList,
+    DeleteBaseMap
 } from '@/services/webConfig/api';
 import AddModal from './AddModal'
 const TileData = props => {
@@ -16,15 +16,9 @@ const TileData = props => {
     const [baseMap, setBaseMap] = useState([]); //底图数据
     const columns = [
         {
-            title: '服务名',
-            dataIndex: 'servicename',
-            key: 'servicename',
-            align: 'center'
-        },
-        {
-            title: '标签',
-            dataIndex: 'label',
-            key: 'label',
+            title: '名称',
+            dataIndex: 'name',
+            key: 'name',
             align: 'center'
         },
         {
@@ -35,10 +29,17 @@ const TileData = props => {
         },
         {
             title: '透明度',
-            dataIndex: 'alpha',
-            key: 'alpha',
+            dataIndex: 'opacity',
+            key: 'opacity',
             align: 'center'
         },
+        {
+            title: 'url',
+            dataIndex: 'url',
+            key: 'url',
+            align: 'center',
+            with: 400
+        },
         {
             title: '编辑',
             align: 'center',
@@ -52,7 +53,7 @@ const TileData = props => {
                         }}
                     >
                         编辑
-                </Button>
+                    </Button>
                     <div onClick={e => e.stopPropagation()}>
                         <Popconfirm
                             title="是否删除该底图？"
@@ -85,14 +86,12 @@ const TileData = props => {
     const delConfirm = (record) => {
         const { servicename = '' } = record;
         setTreeLoading(true);
-        deleteConfig({
-            servicename: servicename,
-            terminalType: 'base',
-            isBaseMap: true
+        DeleteBaseMap({
+            type: record.type
         }).then(res => {
             setFlag(flag + 1)
             setTreeLoading(false);
-            if (res.msg === 'Ok') {
+            if (res.msg === '') {
                 // form.resetFields();
                 // callBackSubmit();
                 notification.success({
@@ -113,6 +112,7 @@ const TileData = props => {
         })
     }
     const handleAdd = () => {
+
         if (baseMap.length) {
             setType('add');
             setVisible(true);
@@ -132,17 +132,15 @@ const TileData = props => {
     // 获取瓦片数据配置数据
     const renderTile = () => {
         setTreeLoading(true);
-        const baseMapData = ['高德地形', '高德影像', '天地图地形', '天地图影像']
-        GettMaplayer({
-            terminalType: 'base',
-            isBaseMap: true
-        }).then(
+        const baseMapData = ['高德街道', '高德影像', '天地图街道', '天地图影像']
+        GetBaseMapList().then(
             res => {
                 if (res.msg === "Ok") {
+                    console.log('res', res.data);
                     setTreeLoading(false);
-                    setTileData(res.data.general.baseMap.layers);
-                    res.data.general.baseMap.layers.map((item) => {
-                        let index = baseMapData.indexOf(item.servicename);
+                    setTileData(res.data);
+                    res.data.map((item) => {
+                        let index = baseMapData.indexOf(item.name);
                         if (index != -1) {
                             baseMapData.splice(index, 1);
                         }
@@ -167,7 +165,7 @@ const TileData = props => {
                         handleAdd();
                     }} >
                         新增
-                </Button>
+                    </Button>
                 </div>
                 <Table
                     columns={columns}

src/pages/platformCenter/dimensionsConfig/VectorData/AddModal.jsx

 import React, { useState, useEffect } from 'react';
-import { Form, Modal, Input, Select, AutoComplete, Button, notification } from 'antd';
+import { Form, Modal, Input, Select, AutoComplete, Button, notification, message, Card } from 'antd';
 import styles from '../dimensionsConfig.less'
 
 import {
   GetGISServerMapList,
-  publisService
+  publisService, GetProjectNames
 } from '@/services/webConfig/api';
-
+import {
+  PlusCircleOutlined,CloseCircleOutlined 
+} from '@ant-design/icons';
 
 const { Option } = Select;
 const AddModal = props => {
   const { callBackSubmit = () => { }, type, formObj, visible, solutionNames } = props;
   const [loading, setLoading] = useState(false);
-
+  const [attributes, setAttributes] = useState([{ key: '', value: '' }])
   const [workList, setWorkList] = useState([]);
+  const [allData, setAllData] = useState([]);
   const [gsIp, setGsIp] = useState([]);
+  const [projectNmme, setProjectNmme] = useState([]);
   const [form] = Form.useForm();
   const { Item } = Form;
   // 提交
@@ -86,7 +90,7 @@ const AddModal = props => {
         setGsIp(gsIp)
         let localIps = ['192.168.12.7', '192.168.19.100']
         let port = localIps.includes(gsIp) ? 8080 : 8088
-        form.setFieldsValue({  ...formObj });
+        form.setFieldsValue({ ...formObj, ip: '192.168.12.97' });
         break;
       case 'edit':
         form.setFieldsValue({ ...formObj });
@@ -140,6 +144,56 @@ const AddModal = props => {
     let port = localIps.includes(value) ? 8080 : 8088
     form.setFieldsValue({ port, serviceadress: value });
 
+  }
+  // 获取项目名
+  const getProject = () => {
+    const obj = form.getFieldsValue();
+    if (obj.ip && obj.port) {
+      GetProjectNames({ ip: obj.ip, port: obj.port }).then(res => {
+        if (res.msg === 'Ok') {
+          notification.success({
+            message: '提示',
+            duration: 3,
+            description: '获取成功',
+          });
+          let data = Object.values(JSON.parse(res.data))
+          setProjectNmme(data)
+          if (data.length) {
+            form.setFieldsValue({ projectName: data[0] });
+            selectProject(data[0])
+          }
+        } else {
+          notification.error({
+            message: '提示',
+            duration: 3,
+            description: '获取失败',
+          });
+        }
+      }).catch(e => {
+        console.log('e', e);
+      })
+    } else {
+      message.warning("未输入ip或port")
+    }
+  }
+  const selectProject = (value) => {
+    const obj = form.getFieldsValue();
+    GetProjectNames({ ip: obj.ip, port: obj.port, projectname: value }).then(response => {
+      let newArr = JSON.parse(response.data)
+      let workArr = Object.keys(newArr.data)
+      setAllData(newArr.data)
+      if (workArr.length) {
+        setWorkList(workArr)
+        form.setFieldsValue({ name: workArr[0], type: newArr.data[workArr[0]].type });
+      }
+
+    })
+  }
+  const selectName = (value) => {
+    form.setFieldsValue({ type: allData[value].type });
+  }
+  const addExtra = () => {
+
   }
   return (
     <Modal
@@ -161,13 +215,14 @@ const AddModal = props => {
         <Form form={form} {...layout} onFinish={onFinish}>
           <Item
             label="IP"
-            name="serviceadress"
-            rules={[{ required: true, message: '请选择服务名' }]}
+            name="ip"
+            rules={[{ required: true, message: '请选择ip地址' }]}
           >
             <AutoComplete
               placeholder="请输入IP"
               options={gsIp}
               onSelect={selectIp}
+
             />
           </Item>
           <Item
@@ -175,39 +230,73 @@ const AddModal = props => {
             name="port"
             rules={[{ required: true, message: '请输入端口' }]}
           >
-            <Input placeholder="请输入GIS服务器端口" allowClear />
+            <div className={styles.imgList}>
+              <Input placeholder="请输入GIS服务器端口" allowClear />
+              <Button style={{ marginLeft: '0.5rem' }} onClick={getProject}>获取项目名</Button>
+            </div>
           </Item>
           <Item
             label="项目名"
             name="projectName"
             rules={[{ required: true, message: '请选择项目名' }]}
           >
-            <Select>
-              {workList.length ? workList.map((item, index) => { return <Option key={index} value={item}>{item}</Option> }) : ''}
+            <Select onChange={selectProject}>
+              {projectNmme.length ? projectNmme.map((item, index) => { return <Option key={index} value={item}>{item}</Option> }) : ''}
             </Select>
           </Item>
           <Item
             label="数据源名"
-            name="origin"
+            name="name"
             rules={[{ required: true, message: '请选择数据源名' }]}
           >
-            <Select>
+            <Select onChange={selectName}>
               {workList.length ? workList.map((item, index) => { return <Option key={index} value={item}>{item}</Option> }) : ''}
             </Select>
           </Item>
           <Item
             label="数据类型"
-            name="name"
+            name="type"
             rules={[{ required: true, message: '请输入数据类型' }]}
           >
-            <Input placeholder="请输入数据类型" allowClear />
+            <Input placeholder="请输入数据类型" allowClear disabled />
           </Item>
           <Item
             label="额外属性"
-            name="name"
             rules={[{ required: true, message: '请输入额外属性' }]}
           >
-            <Input placeholder="请输入额外属性" allowClear />
+            <Card style={{ maxHeight: '8rem', overflowY: 'scroll', padding: '0.1rem' }}>
+              {attributes.length ? attributes.map((item, index) => {
+                return <div className={styles.containerFileds}>
+                  <Item
+                    label="键"
+                    name={`key${index}`}
+                    style={{ width: '45%' }}
+                  >
+                    <Input placeholder="" allowClear />
+                  </Item>
+                  <Item
+                    label="值"
+                    name={`value${index}`}
+                    style={{ width: '45%' }}
+                  >
+                    <Input placeholder="" allowClear />
+                  </Item>
+                  <CloseCircleOutlined 
+                    style={{
+                      fontSize: '16px', color: 'red', 
+                      cursor: 'pointer',
+                      lineHeight: '1.5rem'
+                    }} />
+                </div>
+              }) : ''}
+              <PlusCircleOutlined style={{
+                fontSize: '16px', color: '#1890FF', position: 'absolute',
+                right: '0',
+                top: '0.2rem',
+                cursor: 'pointer'
+              }}
+                onClick={addExtra} />
+            </Card>
           </Item>
         </Form>
       )}

src/pages/platformCenter/dimensionsConfig/VectorData/VectorData.jsx

@@ -2,10 +2,10 @@ import { Space, Table, Button, Popconfirm, notification, Spin } from 'antd';
 import React, { useState, useEffect } from 'react';
 import styles from '../dimensionsConfig.less'
 import {
-    GetVectorService, deleteVectorService, getSolutionList, updatePublishedMetaData
+    GetVectorDataList, deleteVectorService, getSolutionList, updatePublishedMetaData
 } from '@/services/webConfig/api';
 import AddModal from './AddModal'
-import PreviewModal from './VectorPreviewModal'
+// import PreviewModal from './VectorPreviewModal'
 const VectorData = props => {
     const [treeLoading, setTreeLoading] = useState(false);// 弹窗显示
     const [tileData, setTileData] = useState([]); // table表格数据
@@ -53,12 +53,10 @@ const VectorData = props => {
             align: 'center',
             render: (text, record, index) => (
                 <Space>
-                    <Button type="primary" size="small" onClick={() => previewMetaData(record, index)}>
-                        预览
-                  </Button>
+
                     <Button type="primary" size="small" loading={loading[index]} onClick={() => enterLoading(record, index)}>
                         更新
-                  </Button>
+                    </Button>
                     <div onClick={e => e.stopPropagation()}>
                         <Popconfirm
                             title="是否删除该矢量数据？"
@@ -119,10 +117,10 @@ const VectorData = props => {
         })
 
     }
-    const previewMetaData = (record) => {
-        setCurrentMetaData(record)
-        setPreviewVisible(true)
-    }
+    // const previewMetaData = (record) => {
+    //     setCurrentMetaData(record)
+    //     setPreviewVisible(true)
+    // }
 
     const solutionName = () => {
         getSolutionList({
@@ -170,16 +168,16 @@ const VectorData = props => {
     const renderTile = () => {
         setTreeLoading(true);
         solutionName();
-        GetVectorService().then(
+        GetVectorDataList().then(
             res => {
-                if (res.msg==='Ok') {
+                if (res.msg === 'Ok') {
                     let arr = []
-                    res.data.VectorList.map(item => {
+                    res.data.map(item => {
                         arr.push(false)
                     })
                     setLoading(arr)
                     setTreeLoading(false);
-                    setTileData(res.data.VectorList);
+                    setTileData(res.data);
                 } else {
                     setTreeLoading(false);
                     notification.error({
@@ -201,7 +199,7 @@ const VectorData = props => {
                         handleAdd();
                     }} >
                         新增
-                </Button>
+                    </Button>
                 </div>
                 <Table
                     columns={columns}
@@ -224,11 +222,7 @@ const VectorData = props => {
                     formObj={formObj}
                     solutionNames={solutionNames}
                 />
-                <PreviewModal
-                    visible={previewVisible}
-                    onCancel={() => setPreviewVisible(false)}
-                    metaData={currentMetaData}
-                />
+
             </Spin>
         </>
     )

src/pages/platformCenter/dimensionsConfig/dimensionsConfig.jsx

@@ -17,7 +17,7 @@ const SchemeConfig = () => {
 
     return (
         <PageContainer>
-            <div className={styles.container}>
+            <div className={styles.container3d}>
                 <Tabs onChange={callback} type="card">
                     <TabPane tab="瓦片数据配置" key="1">
                         <TileConfig />

src/pages/platformCenter/dimensionsConfig/dimensionsConfig.less

-.container{
+.container3d{
     width: 100%;
 
     background-color: #ffffff;
@@ -14,6 +14,9 @@
           background-color: #ffffff;
           color: #000000;
       }
+      .ant-card-body{
+          padding: 1.5rem 0.2rem 0 0.2rem;
+      }
 }
 .imgList{
     display: flex;
@@ -106,6 +109,9 @@
     height: 26rem;
     margin: 0 2rem;
   }
-.solutionConfig{
-  
+.containerFileds{
+    display: flex;
+    justify-content: space-between;
+    width: 98%;
+
 }
\ No newline at end of file

src/services/webConfig/api.js

@@ -161,14 +161,14 @@ export const omsDeleteWebsite = client =>
 export const GetMaplayerByTerminalType = query =>
   get(`${PUBLISH_SERVICE}/Maplayer/GetMaplayerByTerminalType`, query);
 
-  // 获取全部
+// 获取全部
 export const GettMaplayer = query =>
-get(`${PUBLISH_SERVICE}/Maplayer/GetMaplayer`, query);
+  get(`${PUBLISH_SERVICE}/Maplayer/GetMaplayer`, query);
 
 
 //设置底图数据
 export const SetServiceConfig = query =>
-get(`${PUBLISH_SERVICE}/Maplayer/SetServiceConfig`, query);
+  get(`${PUBLISH_SERVICE}/Maplayer/SetServiceConfig`, query);
 
 // 获取方矢量数据列表
 export const GetVectorService = () =>
@@ -218,6 +218,34 @@ export const setServiceType = (query) =>
 export const getUserRelationList = (query) =>
   get(`${CITY_SERVICE}/OMS.svc/WebGIS_GetUserRelationList`, query);
 
+//获取瓦片数据列表
+export const GetBaseMapList = (query) =>
+  get(`${PUBLISH_SERVICE}/Maplayer/GetBaseMapList`, query);
+
+//新增瓦片服务
+export const AddBaseMap = (data) =>
+  post(`${PUBLISH_SERVICE}/Maplayer/AddBaseMap`, data);
+
+//编辑瓦片数据
+export const EditBaseMap = (data) =>
+  post(`${PUBLISH_SERVICE}/Maplayer/EditBaseMap`, data);
+
+//根据瓦片类型删除瓦片数据
+export const DeleteBaseMap = (query) =>
+  get(`${PUBLISH_SERVICE}/Maplayer/DeleteBaseMap`, query);
+
+//获取矢量列表服务
+export const GetVectorDataList = (query) =>
+  get(`${PUBLISH_SERVICE}/Maplayer/GetVectorDataList`, query);
 
+//删除矢量数据
+export const DeleteVectorData = (query) =>
+  get(`${PUBLISH_SERVICE}/Maplayer/DeleteVectorData`, query);
 
+//添加矢量数据配置服务
+export const AddVectorData = (query) =>
+  get(`${PUBLISH_SERVICE}/Maplayer/AddVectorData`, query);
 
+//根据IP地址和端口号获取
+export const GetProjectNames = (query) =>
+  get(`${PUBLISH_SERVICE}/Maplayer/GetProjectNames`, query);
\ No newline at end of file