/* eslint-disable no-else-return */
/* eslint-disable prefer-promise-reject-errors */
/* eslint-disable prefer-template */
/* eslint-disable react/jsx-boolean-value */
import React, { useState, useEffect } from 'react';
import ReactQuill from 'react-quill';
import 'react-quill/dist/quill.snow.css';
import { CM_Event_LoadDepartmentAndRoles } from '@/services/standingBook/api';
import {
  Form,
  Modal,
  Input,
  notification,
  Radio,
  Button,
  message,
  Upload,
  Row,
  Col,
  Image,
  Select,
  AutoComplete,
  Cascader,
  Switch,
} from 'antd';
import {
  AddIntegratedLogin,
  EditIntegratedLogin,
  GetIntegratedloginSetting,
} from '@/services/integratedLogin/api';
import RMSComponents from '@/components/RolePmSite/index';
import { DownLoadFiles } from '@/services/common/api';
import { PlusOutlined, LoadingOutlined } from '@ant-design/icons';
import { get, PUBLISH_SERVICE } from '@/services';
import PreviewModal from './PreviewModal';
import CryptoJS from 'crypto-js';
const { Item } = Form;
const modules = {
  toolbar: [
    [{ header: [1, 2, 3, 4, 5, 6, false] }],
    [{ color: [] }, { background: [] }],
    [{ font: [] }],
    [{ align: [] }],
    ['bold', 'italic', 'underline', 'strike', 'blockquote'],
    [{ list: 'ordered' }, { list: 'bullet' }, { indent: '-1' }, { indent: '+1' }],
    ['clean'], // 清空
  ],
};

const AddModal = props => {
  const {
    callBackSubmit = () => {},
    type,
    pickItem,
    visible,
    onCancel,
    keepSystemName,
    groupList,
  } = props;
  const [loading, setLoading] = useState(false);
  const [radio, setRadio] = useState();
  const [radio1, setRadio1] = useState();
  const [identity, setIdentity] = useState(0);
  const [flag, setFlag] = useState(1);
  const [form] = Form.useForm();
  const [imageUrl, setImageUrl] = useState();
  const [im, setIm] = useState();
  const [previewModal, setPreviewModal] = useState(false);
  const [keepImgeUrl, setKeepImgeUrl] = useState('');
  const [show, setShow] = useState(0);
  const [optionslist, setOptionsList] = useState([]);
  const [keepLength, setKeeplength] = useState('');
  const [fileList, setFileList] = useState([]);
  const [isVisibleRoles, setIsVisibleRoles] = useState(false);
  const [groupName, setGroupName] = useState('角色');
  const [chooseGroupName, setChooseGroupName] = useState(['角色']);
  const [checkedList1, setCheckedList1] = useState([]); // 最新选择数据
  const [keepFiled, setKeepFiled] = useState([]);
  const [pick, setPick] = useState(''); // 复选框数据填入项
  const [keepIds, setKeepIds] = useState(null);
  const [account, setAccount] = useState(0);
  const [isFromLocal, setIsFromLocal] = useState(false);
  const key = CryptoJS.enc.Utf8.parse('1p2a3n4d5a6o7m8s9a10n1e2t3c4o5re'); // 十六位十六进制数作为密钥
  const iv = CryptoJS.enc.Utf8.parse('1234567890000000');

  const { Option } = Select;

  useEffect(() => {
    if (visible) {
      getRole();
      getMap();
      if (type === 'edit') {
        setRadio(pickItem.target != 0);
        setRadio1(pickItem.isMaster);
        setIdentity(pickItem.siteType);
        setAccount(pickItem.accountType);
        form.setFieldsValue({
          GroupName: pickItem.GroupName,
          accountParamKey: pickItem.AccountParamKey,
          accountParamValue: pickItem.AccountParamValue === 1 ? '熊猫ticket' : '熊猫token',
          internetAddress: pickItem.InternetAddress,
          intranetAddress: pickItem.IntranetAddress,
          systemClient: pickItem.SystemClient,
          systemName: pickItem.SystemName,
          iconUrl: pickItem.iconUrl,
          siteType: pickItem.siteType,
          subtitle: pickItem.Subtitle,
          accountType: pickItem.accountType,
          target: pickItem.target != 0,
          isMaster: pickItem.isMaster,
          images: pickItem.images,
          siteDescription: pickItem.siteDescription,
          serviceUrl: pickItem.serviceUrl,
          fixedPssword: pickItem.fixedPssword && Decrypt(pickItem.fixedPssword),
          fixedUserName: pickItem.fixedUserName,
        });
        if (pickItem.images && pickItem.images.length > 0) {
          let arr = [];
          pickItem.images.map((i, j) => {
            let aa = {};
            aa.uid = j;
            aa.name = 'image.png';
            aa.status = 'done';
            aa.url = window.location.origin + `/${i}`;
            aa.submitUrl = i;
            arr.push(aa);
          });
          setFileList(arr);
        }
        if (pickItem.iconUrl) {
          // if (
          //   pickItem.iconUrl.startsWith('CityTemp') ||
          //   pickItem.iconUrl.startsWith('civ_integratedlogin')
          // ) {
          //   setImageUrl(`http://192.168.12.116:8017/${pickItem.iconUrl}`);
          // } else {
          // setImageUrl(window.location.origin + `/${pickItem.iconUrl}`);
          if (!pickItem.iconUrl.includes('images')) {
            setImageUrl(getImg(pickItem.iconUrl));
            setIm(pickItem.iconUrl);
          } else {
            if (
              pickItem.iconUrl.startsWith('CityTemp') ||
              pickItem.iconUrl.startsWith('civ_integratedlogin')
            ) {
              setImageUrl(`http://192.168.12.116:8017/${pickItem.iconUrl}`);
            } else {
              setImageUrl(window.location.origin + `/${pickItem.iconUrl}`);
            }
            setIm(pickItem.iconUrl);
          }
          // }
        } else {
          form.setFieldsValue({
            iconUrl: '',
          });
          setImageUrl('');
          setIm('');
        }
      } else {
        setRadio(0);
        setRadio1(false);
        setIdentity(0);
        setAccount(0);
        form.setFieldsValue({
          accountParamValue: '熊猫ticket',
          target: 0,
          isMaster: false,
          mapSetting: '',
          coordinate: '',
          siteType: 0,
          accountType: 0,
        });
      }
    } else {
      setRadio('');
      setFileList([]);
      setRadio1('');
      setImageUrl('');
      setIm('');
      setKeepImgeUrl('');
      form.resetFields();
    }
  }, [visible]);

  // 解密
  const Decrypt = word => {
    let encryptedHexStr = CryptoJS.enc.Hex.parse(word);
    let srcs = CryptoJS.enc.Base64.stringify(encryptedHexStr);
    let decrypt = CryptoJS.AES.decrypt(srcs, key, {
      iv,
      mode: CryptoJS.mode.CBC,
      padding: CryptoJS.pad.Pkcs7,
    });
    let decryptedStr = decrypt.toString(CryptoJS.enc.Utf8);
    return decryptedStr.toString();
  };

  // 加密
  const Encrypt = word => {
    let srcs = CryptoJS.enc.Utf8.parse(word);
    let encrypted = CryptoJS.AES.encrypt(srcs, key, {
      iv,
      mode: CryptoJS.mode.CBC,
      padding: CryptoJS.pad.Pkcs7,
    });
    return encrypted.ciphertext.toString().toUpperCase();
  };

  const getRole = () => {
    CM_Event_LoadDepartmentAndRoles().then(res => {
      if (res.msg === 'Ok') {
        setKeepFiled(groupArr(res.data, 'groupType'));
        let aa = groupArr(res.data, 'groupType');
        if (type === 'edit' && pickItem.roles) {
          let data = pickItem.roles;
          let newData = [];
          data.forEach(item => {
            newData.push(aa.角色.find(i => i.value == item).label);
          });
          form.setFieldsValue({ roles: newData.toString() });
        }
      }
    });
  };

  const pickFiled1 = fileds => {
    if (form.getFieldValue(fileds)) {
      setCheckedList1(form.getFieldValue(fileds).split(','));
      setPick(fileds);
      setIsVisibleRoles(true);
    } else {
      setCheckedList1([]);
      setPick(fileds);
      setIsVisibleRoles(true);
    }
  };

  const groupArr = (initialArr, name) => {
    let list = {};
    initialArr.data.map(i => {
      let ar = [];
      i.root.map(j => {
        let ss = {};
        ss.label = j.Name;
        ss.value = j.ID.toString();
        ar.push(ss);
        // console.log(ss);
      });
      list[i.groupType] = ar;
    });
    return list;
  };

  const getMap = () => {
    GetIntegratedloginSetting().then(res => {
      if (res.data.displayMode == '地图') {
        let list = []; // 存省数据
        let listSecord = []; // 存市数据
        let aa = [];
        let fff = 0;
        res.data.mapSettings.map(i => {
          aa.push(i);
          list.push(i[0]);
          if (i[1]) {
            listSecord.push(i[1]);
          }
        });
        setKeeplength(aa);
        if (list.indexOf('100000') != -1) {
          fff = 1;
        }
        setShow(1);
        // 获取城市选择器列表
        window.AMap.plugin('AMap.DistrictSearch', () => {
          let districtSearch = new AMap.DistrictSearch({
            // 关键字对应的行政区级别，country表示国家
            level: 'country',
            //  显示下级行政区级数，1表示返回下一级行政区
            subdistrict: 3,
          });

          // 搜索所有省/直辖市信息
          districtSearch.search('中国', (status, result) => {
            // 查询成功时，result即为对应的行政区信息
            console.log(result, '行政区划信息');
            result.districtList[0].districtList.push({
              adcode: '100000',
              name: '中华人民共和国',
              center: {
                pos: [11330151.428933946, 4386623.239690046],
                lat: '39.915085',
                lng: '116.3683244',
              },
            });
            console.log(result.districtList[0].districtList);
            let data = [];
            result.districtList[0].districtList.map(i => {
              let aa = `${i.center.lng},${i.center.lat}`;
              i.lastpos = aa;
              if (list.indexOf(i.adcode) != -1) {
                data.push(i);
              }
              if (i.districtList) {
                i.districtList.map(j => {
                  let bb = `${j.center.lng},${j.center.lat}`;
                  j.lastpos = bb;
                  if (list.indexOf(j.adcode) != -1) {
                    data.push(j);
                  }
                  if (j.districtList) {
                    j.districtList.map(k => {
                      let cc = `${k.center.lng},${k.center.lat}`;
                      k.lastpos = cc;
                    });
                  }
                });
              }
            });
            if (fff == 0) {
              data.map(i => {
                let aa = [];
                i.districtList.map(j => {
                  if (listSecord.indexOf(j.adcode) != -1) {
                    aa.push(j);
                    i.districtList = aa;
                  }
                });
              });
              setOptionsList(data);
            } else {
              setOptionsList(result.districtList[0].districtList);
            }

            if (type == 'edit') {
              if (pickItem.Coordinate && pickItem.Coordinate.length > 0) {
                form.setFieldsValue({
                  mapSetting: pickItem.MapSetting,
                  coordinate: pickItem.Coordinate.toString(),
                });
              }
            } else {
              form.setFieldsValue({ mapSetting: '', coordinate: '' });
            }
          });
        });
      } else {
        setShow(0);
      }
    });
  };
  // 提交
  const onSubmit = () => {
    form.validateFields().then(validate => {
      if (validate) {
        setLoading(true);
        let obj = form.getFieldsValue();
        if (identity === 0) {
          if (!obj.internetAddress && !obj.intranetAddress) {
            notification.warning({
              message: '提示',
              duration: 3,
              description: '内网地址或外网地址必须填写一项',
            });
            return;
          }
        }
        if (obj.accountParamValue == '熊猫ticket') {
          obj.accountParamValue = 1;
        } else if (obj.accountParamValue == '熊猫token') {
          obj.accountParamValue = 2;
        }
        let aa = { key: obj.accountParamKey, value: obj.accountParamValue };
        let bb = [];
        bb.push(aa);
        if (obj.iconUrl.file) {
          obj.iconUrl = obj.iconUrl.file.response.data;
        }
        let data = [];
        if (obj.coordinate) {
          data = obj.coordinate.split(',');
        }
        let dataList = [];
        if (fileList.length > 0) {
          fileList.map(i => {
            if (i.submitUrl) {
              dataList.push(i.submitUrl);
            } else {
              dataList.push(i.response.data);
            }
          });
        }
        console.log(obj.isMaster);
        if (!obj.iconUrl) {
          message.error('请选择图标！');
          return;
        }
        if (!isFromLocal) {
          if (obj.iconUrl.includes('CityTemp') && obj.iconUrl.includes('图库')) {
            obj.iconUrl = obj.iconUrl;
          } else {
            obj.iconUrl = 'CityTemp\\图库\\' + obj.iconUrl;
          }
        }
        if (type === 'add') {
          AddIntegratedLogin({
            GroupName: obj.GroupName,
            systemName: obj.systemName,
            subtitle: obj.subtitle,
            internetAddress: obj.internetAddress,
            intranetAddress: obj.intranetAddress,
            accountParam: bb,
            iconUrl: obj.iconUrl,
            accountType: account,
            isHide: false,
            target: radio ? 1 : 0,
            isMaster: obj.isMaster,
            images: dataList,
            mapSetting: obj.mapSetting,
            siteType: obj.siteType,
            coordinate: data,
            serviceUrl: obj.serviceUrl,
            siteDescription: obj.siteDescription,
            fixedUserName: obj.fixedUserName,
            fixedPssword: Encrypt(obj.fixedPssword),
            roles: keepIds,
          })
            .then(res => {
              if (res.code === 0) {
                onCancel();
                setLoading(false);
                callBackSubmit();
                notification.success({
                  message: '提示',
                  duration: 3,
                  description: res.msg || '新增成功',
                });
              } else {
                setLoading(false);
                notification.error({
                  message: '提示',
                  duration: 3,
                  description: res.msg || '新增失败',
                });
              }
            })
            .catch(err => {
              setLoading(false);
            });
        } else {
          EditIntegratedLogin({
            GroupName: obj.GroupName,
            systemName: obj.systemName,
            subtitle: obj.subtitle,
            internetAddress: obj.internetAddress,
            intranetAddress: obj.intranetAddress,
            accountParam: bb,
            iconUrl: obj.iconUrl,
            accountType: account,
            target: radio ? 1 : 0,
            isMaster: obj.isMaster,
            images: dataList,
            siteType: obj.siteType,
            clients: pickItem.clients,
            isHide: pickItem.isHide,
            mapSetting: obj.mapSetting,
            coordinate: data,
            serviceUrl: obj.serviceUrl,
            siteDescription: obj.siteDescription,
            fixedUserName: obj.fixedUserName,
            fixedPssword: Encrypt(obj.fixedPssword),
            roles: keepIds === null ? pickItem.roles : keepIds,
          })
            .then(res => {
              if (res.code === 0) {
                onCancel();
                setLoading(false);
                callBackSubmit();
                notification.success({
                  message: '提示',
                  duration: 3,
                  description: res.msg || '编辑成功',
                });
              } else {
                setLoading(false);
                notification.error({
                  message: '提示',
                  duration: 3,
                  description: res.msg || '编辑失败',
                });
              }
            })
            .catch(err => {
              setLoading(false);
            });
        }
      }
    });
  };

  const layout = {
    layout: 'horizontal',
    labelCol: { span: 4 },
    wrapperCol: { span: 18 },
  };

  const onChange = e => {
    setRadio(e);
  };

  const onChange1 = e => {
    setRadio1(e);
  };

  const beforeUpload = file => {
    const isJpgOrPng =
      file.type === 'image/jpeg' ||
      file.type === 'image/png' ||
      file.type === 'image/jpg' ||
      file.type === 'image/gif';
    if (!isJpgOrPng) {
      message.error('只能上传格式为jpeg/png/gif的图片!');
    }
    const isLt2M = file.size / 1024 / 1024 < 2;
    if (!isLt2M) {
      message.error('图片必须小于2MB!');
    }
    return isJpgOrPng && isLt2M;
  };

  const handleChange1 = ({ fileList: newFileList }) => {
    setFileList(newFileList);
  };

  const getImg = img => {
    console.log(img, 'img');
    return `/PandaOMS/OMS/FileCenter/DownLoadFiles?module=图库&filePath=${img}`;
  };

  const handleChange = info => {
    setKeepImgeUrl('');
    setIm('');
    if (info.file.status === 'uploading') {
      setLoading(true);
      return;
    }

    if (info.file.status === 'done') {
      // DownLoadFiles({ module: '图库\\第三方图标', filePath: info.file.response.data }).then(res => {
      //   let reader = new FileReader();
      //   reader.readAsDataURL(res);
      //   reader.onload = function() {
      //     setImageUrl(reader.result);
      //   };
      // });
      if (info.file.response.code === 0) {
        setIsFromLocal(false);
        console.log('触发咯');
        if (
          info.file.response.data.includes('CityTemp') &&
          info.file.response.data.includes('图库')
        ) {
          setImageUrl(getImg(info.file.response.data));
        } else {
          setImageUrl(getImg(info.file.response.data));
        }
        setLoading(false);
      } else {
        message.error(info.file.response.msg);
        setImageUrl('');
        setLoading(false);
      }
      // getBase64(info.file.originFileObj, url => {
      // setLoading(false);
      //   setImageUrl(url);
      // });
    }
  };

  const getBase64 = (img, callback) => {
    const reader = new FileReader();
    reader.addEventListener('load', () => callback(reader.result));
    reader.readAsDataURL(img);
  };

  const uploadButton = (
    <div>
      {loading ? <LoadingOutlined /> : <PlusOutlined />}
      <div
        style={{
          marginTop: 8,
        }}
      >
        上传
      </div>
    </div>
  );

  const uploadButton1 = (
    <div>
      <PlusOutlined />
      <div
        style={{
          marginTop: 8,
        }}
      >
        上传
      </div>
    </div>
  );

  const pictruePreview = () => {
    setPreviewModal(true);
  };

  const onOk = props => {
    if (props) {
      if (!props.path.includes('images')) {
        setImageUrl(getImg(props.path));
        setIm(props.path);
        setKeepImgeUrl(props.path);
      } else {
        setImageUrl(window.location.origin + `/${props.path}`);
        setIm(props.path);
        setKeepImgeUrl(props.path);
      }
      // setImageUrl(window.location.origin + `/${props.path}`);
      // setIm(props.path);
      // setKeepImgeUrl(props.path);
      setIsFromLocal(true);
      form.setFieldsValue({ iconUrl: `${props.path}` });
    }
  };

  const inputType = value => {
    if (value) {
      form.setFieldsValue({ internetAddress: value });
    }
  };

  const options = [
    {
      value: 'http://{IP:端口}/civbase/user/noscret/?client={client}',
    },
    {
      value: 'http://{IP:端口}/web4/?client={client}',
    },
  ];

  const onChangeField = (value, selectedOptions) => {
    let aa = selectedOptions[selectedOptions.length - 1].lastpos;
    form.setFieldsValue({ coordinate: aa });
  };

  const onQuillChange = (content, delta, source, editor) => {
    console.log(content);
    console.log(delta);
    console.log(source);
    console.log(editor);
    // content 是真实的DOM节点
    // delta 记录了修改的对象，下篇文章详述
    // source 值为user或api
    // editor 文本框对象，可以调用函数获取content, delta值
  };

  const onChangeIdentity = e => {
    setIdentity(e.target.value);
  };

  const onChangeAccount = e => {
    setAccount(e.target.value);
  };

  const onOK = prop => {
    setIsVisibleRoles(false);
    let inputText = {};
    inputText[prop.pickItem] = prop.str;
    setCheckedList1(prop.stt);
    setKeepIds(prop.ids);
    form.setFieldsValue(inputText);
  };

  return (
    <Modal
      title={type === 'add' ? '新增子站' : '编辑子站'}
      bodyStyle={{ width: '100%', maxHeight: '600px', overflow: 'scroll' }}
      width="700px"
      destroyOnClose
      maskClosable={false}
      cancelText="取消"
      okText="确认"
      {...props}
      onOk={() => onSubmit()}
      forceRender={true}
      getContainer={false}
    >
      <Form form={form} {...layout}>
        {type === 'edit' ? (
          <Item
            label="名称"
            name="systemName"
            rules={[
              { required: true, message: '请输入名称' },
              {
                validator: (rule, value) => {
                  let aa = form.getFieldValue().systemName;
                  let regEn = /[`~!@#$%^&*()_+<>?:"{},.\/;'[\]]/im;
                  let regCn = /[·！#￥（——）：；“”‘、，|《。》？、【】[\]]/im;
                  if (keepSystemName.indexOf(aa) != -1 && pickItem.SystemName != aa) {
                    return Promise.reject('名称已存在');
                  } else if (regEn.test(aa) || regCn.test(aa)) {
                    return Promise.reject('名称不能包含特殊字符');
                  }
                  return Promise.resolve();
                },
              },
            ]}
          >
            <Input allowClear style={{ width: '100%' }} placeholder="请输入名称" />
          </Item>
        ) : (
          <Item
            label="名称"
            name="systemName"
            rules={[
              { required: true, message: '请输入名称' },
              {
                validator: (rule, value) => {
                  let aa = form.getFieldValue().systemName;
                  let regEn = /[`~!@#$%^&*()_+<>?:"{},.\/;'[\]]/im;
                  let regCn = /[·！#￥（——）：；“”‘、，|《。》？、【】[\]]/im;
                  if (keepSystemName.indexOf(aa) != -1) {
                    return Promise.reject('名称已存在');
                  } else if (regEn.test(aa) || regCn.test(aa)) {
                    return Promise.reject('名称不能包含特殊字符');
                  }
                  return Promise.resolve();
                },
              },
            ]}
          >
            <Input allowClear style={{ width: '100%' }} placeholder="请输入名称" />
          </Item>
        )}
        <Item label="分组" name="GroupName">
          <AutoComplete placeholder="请输入分组名称" options={groupList} allowClear />
        </Item>
        <Item label="角色选择" name="roles">
          <div style={{ display: 'flex' }}>
            <Item name="roles" style={{ marginBottom: 0, width: '100%' }}>
              <Input placeholder="请选择执行角色" />
            </Item>
            <Button
              type="dashed"
              onClick={() => pickFiled1('roles')}
              icon={<PlusOutlined style={{ marginTop: '5px' }} />}
              style={{ marginLeft: '10px', width: '70px' }}
            />
          </div>
        </Item>
        <Item label="新标签" name="target">
          <Switch checkedChildren="是" unCheckedChildren="否" checked={radio} onChange={onChange} />
        </Item>
        <Row>
          <Col span={10}>
            <Item
              label="图标"
              name="iconUrl"
              style={{ height: '112px' }}
              labelCol={{ span: 10 }}
              rules={[
                {
                  required: true,
                  message: '请选择图标',
                },
              ]}
            >
              <Upload
                name="singleFile"
                listType="picture-card"
                showUploadList={false}
                beforeUpload={beforeUpload}
                action={`${window.location.origin}${PUBLISH_SERVICE}/UploadSingleFile`}
                onChange={handleChange}
              >
                {imageUrl ? (
                  <img
                    src={imageUrl}
                    alt="singleFile"
                    style={{
                      width: '90%',
                      backgroundColor: '#2881a1',
                    }}
                  />
                ) : (
                  uploadButton
                )}
              </Upload>
            </Item>
          </Col>
          <Col span={12}>
            <Item>
              <Button type="primary" onClick={pictruePreview} style={{ marginTop: '33px' }}>
                从图片库中选择
              </Button>
            </Item>
          </Col>
        </Row>
        <Item label="站点类型" name="siteType">
          <Radio.Group onChange={onChangeIdentity} value={identity}>
            <Radio value={0}>第三方接入</Radio>
            <Radio value={1}>集成SaaS平台</Radio>
          </Radio.Group>
        </Item>

        {identity === 1 && (
          <>
            <Item
              label="运维服务地址"
              name="serviceUrl"
              rules={[{ required: true, message: '请输入参数' }]}
            >
              <Input placeholder="请输入运维服务地址" allowClear />
            </Item>
            <Item label="登陆账号" name="accountType">
              <Radio.Group onChange={onChangeAccount} value={account}>
                <Radio value={0}>当前帐号</Radio>
                <Radio value={1}>固定账号</Radio>
              </Radio.Group>
            </Item>
          </>
        )}
        {account === 1 && identity === 1 && (
          <Row>
            <Col span={12}>
              <Item
                labelCol={{ span: 8 }}
                label="账号"
                name="fixedUserName"
                rules={[{ required: true, message: '请输入账号' }]}
              >
                <Input allowClear placeholder="请输入账号名" />
              </Item>
            </Col>
            <Col span={10}>
              <Item label="密码" labelCol={{ span: 7 }} name="fixedPssword">
                <Input allowClear placeholder="请输入密码" type="password" />
              </Item>
            </Col>
          </Row>
        )}
        {identity === 1 ? (
          <></>
        ) : (
          <>
            <Item
              label="内网地址"
              name="intranetAddress"
              rules={[
                {
                  validator: (rule, value) => {
                    let aa = form.getFieldValue().intranetAddress;
                    if (aa) {
                      let bb = aa.split('//');
                      let cc = [];
                      if (bb[1]) {
                        cc = bb[1].split(':');
                      }

                      let regEn = /^10\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])$/;
                      let regFn = /^172\.(1[6789]|2[0-9]|3[01])\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])$/;
                      let regCn = /^192\.168\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])$/;
                      let ss = [];
                      let url = /^http(s)?/;
                      ss.push(regEn.test(cc[0]));
                      ss.push(regFn.test(cc[0]));
                      ss.push(regCn.test(cc[0]));
                      if (!url.test(aa)) {
                        return Promise.reject('url格式不正确');
                      }
                      // else if (ss.indexOf(true) == -1) {
                      //   return Promise.reject('局域网IP不正确');
                      // }
                    }
                    return Promise.resolve();
                  },
                },
              ]}
            >
              <AutoComplete placeholder="建议使用局域网IP" options={options} allowClear />
            </Item>
            <Item
              label="外网地址"
              name="internetAddress"
              rules={[
                {
                  validator: (rule, value) => {
                    let aa = form.getFieldValue().internetAddress;
                    if (aa) {
                      let bb = aa.split('//');
                      let cc = [];
                      if (bb[1]) {
                        cc = bb[1].split(':');
                      }
                      let url = /^http(s)?/;
                      // let regEn = /^10\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])$/;
                      let regFn = /^172\.(1[6789]|2[0-9]|3[01])\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])$/;
                      let regCn = /^192\.168\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])\.(1\d{2}|2[0-4]\d|25[0-5]|[1-9]\d|[0-9])$/;
                      let reg = /^(127\.0\.0\.1)|(localhost)/;
                      let ss = [];
                      // ss.push(regEn.test(cc[0]));
                      ss.push(regFn.test(cc[0]));
                      ss.push(regCn.test(cc[0]));
                      ss.push(reg.test(cc[0]));
                      console.log(ss);
                      if (!url.test(aa)) {
                        return Promise.reject('url格式不正确');
                      } else if (ss.indexOf(true) !== -1) {
                        return Promise.reject('请勿输入内网ip');
                      }
                    }

                    return Promise.resolve();
                  },
                },
              ]}
            >
              <AutoComplete placeholder="建议使用公网IP或域名" options={options} allowClear />
            </Item>
            <Row>
              <Col span={12}>
                <Item
                  labelCol={{ span: 8 }}
                  label="账号参数"
                  name="accountParamKey"
                  rules={[{ required: true, message: '请输入参数' }]}
                >
                  <Input allowClear placeholder="请填写账号参数" />
                </Item>
              </Col>
              <Col span={10}>
                <Item label="账号值" labelCol={{ span: 7 }} name="accountParamValue">
                  <Select placeholder="请选择值">
                    <Option value="1">熊猫ticket</Option>
                    <Option value="2">熊猫token</Option>
                  </Select>
                </Item>
              </Col>
            </Row>
          </>
        )}

        {show == 1 ? (
          <>
            <Item
              label="地区选择"
              name="mapSetting"
              rules={[
                {
                  required: true,
                  message: '地区选择为必填项',
                },
                {
                  validator: (rule, value) => {
                    let aa = form.getFieldValue().mapSetting;
                    if (aa) {
                      let list = keepLength.find(i => i[0] == aa[0]);
                      console.log(list);
                      console.log(aa);

                      if (list) {
                        if (aa.length <= list.length) {
                          return Promise.reject('请选择下级');
                        }
                      }
                    }

                    return Promise.resolve();
                  },
                },
              ]}
            >
              <Cascader
                fieldNames={{
                  label: 'name',
                  value: 'adcode',
                  children: 'districtList',
                }}
                showSearch
                options={optionslist}
                placeholder="请选择行政区"
                changeOnSelect
                allowClear={false}
                onChange={onChangeField}
              />
            </Item>
            <Item label="经纬度" name="coordinate">
              <Input disabled />
            </Item>
            <Item label="特殊站点" name="isMaster">
              <Switch
                checkedChildren="是"
                unCheckedChildren="否"
                onChange={onChange1}
                checked={radio1}
              />
              {/* <Radio.Group onChange={onChange1} value={radio1}>
                <Radio value={false}>否</Radio>
                <Radio value={true}>是</Radio>
              </Radio.Group> */}
            </Item>
            <Item label="详情图片" name="images" style={{ height: '112px' }}>
              <Upload
                name="singleFile"
                action={`${window.location.origin}${PUBLISH_SERVICE}/UploadSingleFile`}
                listType="picture-card"
                fileList={fileList}
                beforeUpload={beforeUpload}
                onChange={handleChange1}
                showUploadList={{ showPreviewIcon: false }}
                onPreview={false}
              >
                {fileList.length >= 3 ? null : uploadButton1}
              </Upload>
            </Item>
            <Item label="站点简介" name="siteDescription">
              <ReactQuill
                style={{ height: '150px' }}
                placeholder="请输入内容"
                theme="snow" // 主题
                modules={modules}
                onChange={onQuillChange}
              />
            </Item>
          </>
        ) : (
          <></>
        )}
      </Form>
      <PreviewModal
        visible={previewModal}
        onCancel={() => {
          setPreviewModal(false);
        }}
        imageUrl={im}
        keepImgeUrl={keepImgeUrl}
        type={type}
        callBackSubmit={onOk}
      />
      <RMSComponents
        visible={isVisibleRoles}
        onCancel={() => setIsVisibleRoles(false)}
        callBackSubmit={onOK}
        newCheckedList={checkedList1} // 单选框中的值
        pickItem={pick}
        groupName={groupName} // 打开组件展示的分组名，用来首次获取数据
        chooseGroupName={chooseGroupName} // 可选分组名
        keepFiled={keepFiled}
        dataType="name"
      />
    </Modal>
  );
};
export default AddModal;
