底图方案增加最大级别配置

src/pages/platformCenter/gis/schemeConfig/TileConfig/AddProjectModal.jsx

 /* eslint-disable prefer-promise-reject-errors */
 /* eslint-disable indent */
 import React, { useState, useEffect } from 'react';
-import { Form, Modal, Input, Select, notification, InputNumber, Tooltip } from 'antd';
+import { Form, Modal, Input, Select, notification, InputNumber, Tooltip, Row, Col } from 'antd';
 import {
   GettMaplayer,
   GetVectorService,
@@ -59,6 +59,7 @@ const AddProjectModal = props => {
             schemename: formObj.schemename,
             servicename: obj.serverName,
             zoom: obj.zoom,
+            maxZoom: obj.maxzoom,
           };
           SetBaseMapschemeName(data)
             .then(res => {
@@ -175,8 +176,8 @@ const AddProjectModal = props => {
     form.resetFields();
     let req1 = GettMaplayer({ terminalType: 'base', isBaseMap: true });
     let req2 = GetVectorService();
-    let pipeArr = [],
-      baseMap = [];
+    let pipeArr = [];
+    let baseMap = [];
     Promise.all([req1, req2]).then(res => {
       if (res[0].code == '0') {
         (res[0].data.general.baseMap.layers || []).map(item => {
@@ -223,7 +224,7 @@ const AddProjectModal = props => {
       title={`${type === 'add' ? '添加基础底图' : '添加分级底图'}`}
       bodyStyle={{ width: '100%', minHeight: '100px' }}
       style={{ top: '150px' }}
-      width="700px"
+      width="600px"
       destroyOnClose
       maskClosable={false}
       cancelText="取消"
@@ -231,14 +232,17 @@ const AddProjectModal = props => {
       {...props}
       onOk={() => onSubmit()}
       confirmLoading={loading}
-      forceRender={true}
+      forceRender
       getContainer={false}
     >
       {visible && (
         <Form form={form} {...layout} onFinish={onFinish}>
           {type === 'add' ? (
             <>
+              <Row>
+                <Col span={14}>
                   <Item
+                    labelCol={{ span: 7 }}
                     label={
                       <div>
                         <Tooltip title="同一分级底图中的不同基础底图级别不能相同">
@@ -250,27 +254,50 @@ const AddProjectModal = props => {
                             }}
                           />
                         </Tooltip>
-                    <span>级别</span>
+                        <span>最小级别</span>
                       </div>
                     }
                     name="zoom"
                     rules={[
-                  { required: true, message: '请输入级别' },
+                      { required: true, message: '请输入最小级别' },
+                      // {
+                      //   validator: (rule, value) => {
+                      //     const obj = form.getFieldsValue().zoom;
+                      //     console.log(obj);
+                      //     if (arr.indexOf(obj) != -1) {
+                      //       console.log(111);
+                      //       return Promise.reject('已存在该级别的基础底图');
+                      //     }
+                      //     return Promise.resolve();
+                      //   },
+                      // },
+                    ]}
+                  >
+                    <InputNumber min={0} max={99} />
+                  </Item>
+                </Col>
+                <Col span={10}>
+                  <Item
+                    labelCol={{ span: 10 }}
+                    label="最大级别"
+                    name="maxzoom"
+                    rules={[
                       {
                         validator: (rule, value) => {
                           const obj = form.getFieldsValue().zoom;
-                      console.log(obj);
-                      if (arr.indexOf(obj) != -1) {
-                        console.log(111);
-                        return Promise.reject('已存在该级别的基础底图');
+                          const objmax = form.getFieldsValue().maxzoom;
+                          if (objmax < obj) {
+                            return Promise.reject('最大级别不能小于最小级别');
                           }
                           return Promise.resolve();
                         },
                       },
                     ]}
                   >
-                <InputNumber min={0} />
+                    <InputNumber min={0} max={99} />
                   </Item>
+                </Col>
+              </Row>
               <Item
                 label="基础底图"
                 name="serverName"
@@ -278,13 +305,11 @@ const AddProjectModal = props => {
               >
                 <Select onChange={handleChange}>
                   {serviceList.length
-                    ? serviceList.map((item, index) => {
-                        return (
+                    ? serviceList.map((item, index) => (
                         <Option key={index} value={item}>
                           {item}
                         </Option>
-                        );
-                      })
+                      ))
                     : ''}
                 </Select>
               </Item>
@@ -305,13 +330,11 @@ const AddProjectModal = props => {
               >
                 <Select onChange={handleBaseMap}>
                   {baseMap.length
-                    ? baseMap.map((item, index) => {
-                        return (
+                    ? baseMap.map((item, index) => (
                         <Option key={index} value={item}>
                           {item}
                         </Option>
-                        );
-                      })
+                      ))
                     : ''}
                 </Select>
               </Item>

src/pages/platformCenter/gis/schemeConfig/TileConfig/BaseMap.jsx

@@ -7,7 +7,7 @@
  * @LastEditors: leizhe
  */
 import React, { useState, useEffect } from 'react';
-import { Form, Modal, Input, Select, notification, InputNumber, Tooltip } from 'antd';
+import { Form, Modal, Input, Select, notification, InputNumber, Tooltip, Row, Col } from 'antd';
 import {
   GettMaplayer,
   GetVectorService,
@@ -34,7 +34,7 @@ const BaseMap = props => {
       });
       setArr(list);
       let aa = keepItem.baseMapDetail.find(i => i.servicename == keepProject);
-      form.setFieldsValue({ zoom: aa.zoom });
+      form.setFieldsValue({ zoom: aa.zoom, maxzoom: aa.maxzoom });
     } else {
       form.resetFields();
     }
@@ -71,6 +71,7 @@ const BaseMap = props => {
           schemename: keepItem.schemename,
           servicename: keepProject,
           zoom: obj.zoom,
+          maxZoom: obj.maxzoom,
         };
         SetBaseMapschemeName(data).then(res => {
           if (res.code == '0') {
@@ -121,18 +122,21 @@ const BaseMap = props => {
       title={title}
       bodyStyle={{ width: '100%', minHeight: '100px' }}
       style={{ top: '150px' }}
-      width="400px"
+      width="600px"
       destroyOnClose
       maskClosable={false}
       cancelText="取消"
       okText="确认"
       {...props}
       onOk={() => onSubmit()}
-      forceRender={true}
+      forceRender
       getContainer={false}
     >
       <Form form={form} {...layout} onFinish={onSubmit}>
+        <Row>
+          <Col span={12}>
             <Item
+              labelCol={{ span: 8 }}
               label={
                 <div>
                   <Tooltip title="同一分级底图中的不同基础底图级别不能相同">
@@ -144,28 +148,52 @@ const BaseMap = props => {
                       }}
                     />
                   </Tooltip>
-              <span>级别</span>
+                  <span>最小级别</span>
                 </div>
               }
               style={{ marginTop: '20px' }}
               name="zoom"
               rules={[
                 { required: true, message: '请输入级别' },
+                // {
+                //   validator: (rule, value) => {
+                //     const obj = form.getFieldsValue().zoom;
+                //     console.log(obj);
+                //     if (arr.indexOf(obj) != -1) {
+                //       console.log(111);
+                //       return Promise.reject('已存在该级别的基础底图');
+                //     }
+                //     return Promise.resolve();
+                //   },
+                // },
+              ]}
+            >
+              <InputNumber min={0} />
+            </Item>
+          </Col>
+          <Col span={12}>
+            <Item
+              labelCol={{ span: 6 }}
+              label="最大级别"
+              name="maxzoom"
+              style={{ marginTop: '20px' }}
+              rules={[
                 {
                   validator: (rule, value) => {
                     const obj = form.getFieldsValue().zoom;
-                console.log(obj);
-                if (arr.indexOf(obj) != -1) {
-                  console.log(111);
-                  return Promise.reject('已存在该级别的基础底图');
+                    const objmax = form.getFieldsValue().maxzoom;
+                    if (objmax < obj) {
+                      return Promise.reject('最大级别不能小于最小级别');
                     }
                     return Promise.resolve();
                   },
                 },
               ]}
             >
-          <InputNumber min={0} style={{ width: '150px' }} />
+              <InputNumber min={0} max={99} />
             </Item>
+          </Col>
+        </Row>
       </Form>
     </Modal>
   );

src/pages/platformCenter/gis/schemeConfig/TileConfig/card.jsx

@@ -205,8 +205,7 @@ const CardData = props => {
         </div>
         <div style={{ overflowY: 'scroll', height: '11.4rem' }}>
           {props.item.baseMapDetail && props.item.baseMapDetail.length
-            ? props.item.baseMapDetail.map((baseMapItem, baseindex) => {
-                return (
+            ? props.item.baseMapDetail.map((baseMapItem, baseindex) => (
                 <div className={styles.mapItem1} key={baseindex}>
                   <div
                     // onClick={() => pick(props.item.schemename, baseindex)}
@@ -216,7 +215,9 @@ const CardData = props => {
                     // })}
                     className={styles.defaultTile1}
                   >
-                      {baseMapItem.zoom}
+                    {baseMapItem.maxzoom === 0
+                      ? baseMapItem.zoom
+                      : `${baseMapItem.zoom}~${baseMapItem.maxzoom}`}
                   </div>
                   <div className={styles.mapText1}>
                     <Tooltip title={baseMapItem.servicename}>{baseMapItem.servicename}</Tooltip>
@@ -243,8 +244,7 @@ const CardData = props => {
                     </Popconfirm>{' '}
                   </div>
                 </div>
-                );
-              })
+              ))
             : ''}
         </div>
       </Card>