InitDataBase.jsx 31.2 KB
Newer Older
皮倩雯's avatar
皮倩雯 committed
1 2
/* eslint-disable spaced-comment */
/* eslint-disable eqeqeq */
3
import React, { useEffect, useRef, useState } from 'react';
张烨's avatar
张烨 committed
4 5 6 7 8 9 10 11 12
import {
  Card,
  Form,
  Input,
  Button,
  Select,
  Table,
  Space,
  notification,
13 14
  Modal,
  Row,
张烨's avatar
张烨 committed
15
  Col,
Maofei94's avatar
Maofei94 committed
16
  Popconfirm,
17
  Spin,
18 19
  Tabs,
  Radio,
张烨's avatar
张烨 committed
20
} from 'antd';
21
import PageContainer from '@/components/BasePageContainer';
22
import RadioBox from '@/components/RadioGroup';
23
import { connect } from 'react-redux';
Maofei94's avatar
Maofei94 committed
24 25
import {
  setTableSQLDirName,
26 27 28 29 30 31
  deleteConnNew,
  initDBv4new,
  getInitDBLogNew,
  getConnRecordNew,
  getDataBaseConfigNew,
  saveConnectionNew,
Maofei94's avatar
Maofei94 committed
32
  getDataBaseList,
33 34
  updateConnDescNew,
  deleteInitDBLogNew,
Maofei94's avatar
Maofei94 committed
35
  connectionTest,
36 37 38
  GetProductList, // 获取产品列表
  GetDbProduct, // 获取产品方案配置
  InitAddDataBase, // 数据库初始化
39
  InitEditDataBase, // 二次初始化
Maofei94's avatar
Maofei94 committed
40
} from '@/services/database/api';
皮倩雯's avatar
皮倩雯 committed
41
import CryptoJS from 'crypto-js';
张烨's avatar
张烨 committed
42
import styles from './InitDataBase.less';
皮倩雯's avatar
皮倩雯 committed
43
import InitModal from './initModal';
44

45
const { TabPane } = Tabs;
张烨's avatar
张烨 committed
46
const { Option } = Select;
赵吉's avatar
赵吉 committed
47
const formLables = {
张烨's avatar
张烨 committed
48 49 50 51 52
  ip: '服务器名或IP地址',
  userName: '数据库用户名称',
  password: '数据库用户密码',
  dbName: '数据库名称',
};
53
let time = null;
张烨's avatar
张烨 committed
54 55
const InitDataBase = props => {
  const [form] = Form.useForm();
张烨's avatar
张烨 committed
56
  const [tableLoading, setTableLoading] = useState(false); // 连接记录
张烨's avatar
张烨 committed
57 58 59 60 61 62 63
  const [dbForm, setDbForm] = useState({
    ip: '',
    dbName: '',
    password: '',
    userName: '',
    inUse: '',
  });
张烨's avatar
张烨 committed
64 65 66 67
  const [data, setData] = useState([]); // 数据库链接记录
  const [upData, setUpData] = useState(1); // 列表刷新标记
  const [option, setOption] = useState([]); // 下拉列表数据
  const [desc, setDesc] = useState(''); // 修改描述
Maofei94's avatar
Maofei94 committed
68 69
  const [allSqlDir, setAllSqulDir] = useState([]); // 修改产品方案
  const [defaultSqlDir, setDefaultSqlDir] = useState(''); // 修改产品方案默认值
70 71 72 73 74
  const [modalVisible, setModalVisible] = useState({
    describeVisible: false, // 描述弹窗
    versionVisible: false, // 检查版本弹窗
    initVisible: false, // 初始化选择产品弹窗
  }); // 修改弹窗
75 76 77
  const [initVisible, setInitVisible] = useState(false); // 数据库初始化弹窗
  const [initContent, setInitContent] = useState(''); // 数据库初始化内容
  const [cardLoading, setCardLoading] = useState(false); // 初始化card Loading
Maofei94's avatar
Maofei94 committed
78
  const [finish, setFinish] = useState(false);
79
  const [initLoading, setInitLoading] = useState(false);
80 81
  const [initList, setInitList] = useState([]); // 数据库初始化产品数据
  const [dbExists, setDbExists] = useState(false); // 数据库是否存在
皮倩雯's avatar
皮倩雯 committed
82 83 84
  const [visibleModel, setVisibleModel] = useState(false);
  const [keepDb, setKeepDb] = useState([]);
  const [keepProduct, setKeepProduct] = useState([]);
85
  const scroll = useRef(null);
皮倩雯's avatar
皮倩雯 committed
86 87 88
  const [keep, setKeep] = useState([]);
  const [flag, setFlag] = useState(0);
  const [keepData, setKeepData] = useState({});
89
  const chooseDb = useRef({});
皮倩雯's avatar
皮倩雯 committed
90 91
  const key = CryptoJS.enc.Utf8.parse('1p2a3n4d5a6o7m8s9a10n1e2t3c4o5re'); //十六位十六进制数作为密钥
  const iv = CryptoJS.enc.Utf8.parse('1234567890000000');
92 93

  // 获取数据库配置信息
张烨's avatar
张烨 committed
94
  useEffect(() => {
95 96 97 98 99 100
    setCardLoading(true);
    // 数据库连接记录初始化
    getConnRecordData();
    getDataBaseConfigNew().then(resnew => {
      setCardLoading(false);
      let res = resnew.data;
101
      if (resnew.code === 0) {
102 103 104 105 106
        const { inUse } = res;

        let obj = {};
        Object.keys(dbForm).forEach(k => {
          obj[k] = res[k];
107
        });
邓超's avatar
邓超 committed
108
        console.log(obj, 'objohjfaosdjf');
皮倩雯's avatar
皮倩雯 committed
109 110 111 112 113 114 115

        console.log(Decrypt(obj.password));
        let aa = Decrypt(obj.password);
        console.log(Encrypt(aa));

        form.setFieldsValue({ ...obj, password: Decrypt(obj.password) });
        setDbForm(val => ({ ...val, ...obj, password: Decrypt(obj.password) }));
116 117 118 119 120 121 122 123
        setAllSqulDir(res.allSqlDir);
        if (res.allSqlDir.some(item => item === inUse)) {
          setDefaultSqlDir(res.tableSQLDirName);
        } else {
          // 默认切换到第一个产品方案
          handeleChangeSQLDirName(res.allSqlDir[0]);
          setDefaultSqlDir(res.allSqlDir[0]);
        }
124 125
      }
    });
126 127
    return () => {
      if (time) {
128 129
        clearTimeout(time);
        time = null;
130
      }
131 132
    };
  }, []);
皮倩雯's avatar
皮倩雯 committed
133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157

  // 解密
  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();
  };

158 159 160 161
  // 弹出模态框
  const handleShowModal = (key, value) => {
    setModalVisible({ ...modalVisible, [key]: value });
  };
162 163 164 165 166 167
  // 获取数据库连接记录
  const getConnRecordData = () => {
    setTableLoading(true);
    getConnRecordNew()
      .then(resnew => {
        setTableLoading(false);
168
        if (resnew.code === 0) {
169 170 171 172
          let res = resnew.data;
          let arr = res.map((item, index) => {
            item.key = index;
            return item;
张烨's avatar
张烨 committed
173
          });
174
          setData(arr);
张烨's avatar
张烨 committed
175
        }
176 177 178 179 180 181
      })
      .catch(err => {
        setTableLoading(false);
        console.error(err);
      });
  };
Maofei94's avatar
Maofei94 committed
182 183
  // 获取日志
  const doInitLog = () => {
184
    setInitLoading(true);
185
    getInitDBLogNew()
Maofei94's avatar
Maofei94 committed
186
      .then(res => {
187
        if (res.code === 0) {
188
          if (res.data.content) {
189
            setInitLoading(false);
Maofei94's avatar
Maofei94 committed
190 191
            let arr = [];
            arr.push(
192 193 194 195
              res.data.content.split(/(\r\n)|(\n)/).map((item, index) => (
                // eslint-disable-next-line react/no-danger
                <p key={index} dangerouslySetInnerHTML={{ __html: item }} />
              )),
Maofei94's avatar
Maofei94 committed
196
            );
197
            console.log(arr);
Maofei94's avatar
Maofei94 committed
198 199 200
            setInitContent(arr);
            scroll.current.scrollTop = scroll.current.scrollHeight;
          }
201 202
          if (!res.data.finish) {
            time = setTimeout(() => {
203 204
              doInitLog();
            }, 600);
205 206
          } else {
            setInitLoading(false);
207
            if (time) {
208 209
              clearTimeout(time);
              time = null;
210 211
            }
          }
Maofei94's avatar
Maofei94 committed
212 213 214 215 216 217
        }
      })
      .catch(err => {
        setFinish(true);
      });
  };
张烨's avatar
张烨 committed
218
  // 数据库初始化
Maofei94's avatar
Maofei94 committed
219
  const initClick = () => {
Maofei94's avatar
Maofei94 committed
220 221 222
    setInitContent('');
    setCardLoading(true);
    setInitVisible(true);
Maofei94's avatar
Maofei94 committed
223
    let obj = form.getFieldsValue();
Maofei94's avatar
Maofei94 committed
224
    doInitLog();
225
    initDBv4new({
226
      ...obj,
227
    })
228 229 230 231 232 233 234 235 236 237 238 239
      .then(res => {
        setCardLoading(false);
        if (res.code == 0) {
          console.log(res);
        } else {
          notification.error({
            message: '提示',
            duration: 15,
            description: res.msg || '初始化失败',
          });
        }
      })
tianfen's avatar
tianfen committed
240 241 242 243
      .catch(err => {
        setCardLoading(false);
        console.log(err);
      });
Maofei94's avatar
Maofei94 committed
244
  };
张烨's avatar
张烨 committed
245 246 247 248
  const onValuesChange = (value, b) => {
    form.setFieldsValue(value);
  };
  const onChange = value => {
249
    const { length } = value;
张烨's avatar
张烨 committed
250
    form.setFieldsValue({
251
      dbName: value[length - 1],
张烨's avatar
张烨 committed
252 253
    });
  };
张烨's avatar
张烨 committed
254
  // 保存连接
255
  const onFinish = values => {
256
    setCardLoading(true);
张烨's avatar
张烨 committed
257
    const obj = values;
258
    console.log(chooseDb.current, 'obj');
259
    saveConnectionNew({
张烨's avatar
张烨 committed
260 261 262
      ip: obj.ip,
      dbName: obj.dbName,
      userName: obj.userName,
皮倩雯's avatar
皮倩雯 committed
263
      password: Encrypt(obj.password),
264
      desc: chooseDb.current.desc,
265 266
    })
      .then(resnew => {
267
        setCardLoading(false);
268
        if (resnew.code === 0) {
皮倩雯's avatar
皮倩雯 committed
269 270 271 272 273
          setFlag(flag + 1);
          setKeepData({
            ip: obj.ip,
            dbName: obj.dbName,
            userName: obj.userName,
皮倩雯's avatar
皮倩雯 committed
274
            password: Encrypt(obj.password),
皮倩雯's avatar
皮倩雯 committed
275
          });
276 277
          // setUpData(upData + 1);
          getConnRecordData();
张烨's avatar
张烨 committed
278
          notification.success({
Maofei94's avatar
Maofei94 committed
279
            message: '提示',
张烨's avatar
张烨 committed
280 281 282 283 284 285
            duration: 3,
            description: '保存成功',
          });
        } else {
          notification.error({
            message: '提示',
Maofei94's avatar
Maofei94 committed
286
            duration: 15,
287
            description: resnew.msg,
张烨's avatar
张烨 committed
288 289
          });
        }
290 291 292 293 294
      })
      .catch(err => {
        setCardLoading(false);
        console.log(err);
      });
295
  };
296
  // 测试连接
张烨's avatar
张烨 committed
297 298
  const onCheck = e => {
    console.log(dbForm);
299
    setCardLoading(true);
张烨's avatar
张烨 committed
300
    const obj = form.getFieldsValue();
301
    connectionTest({
皮倩雯's avatar
皮倩雯 committed
302 303
      // _version: 9999,
      // _dc: new Date().getTime(),
304 305 306
      ip: obj.ip,
      dbName: obj.dbName,
      userName: obj.userName,
皮倩雯's avatar
皮倩雯 committed
307
      password: Encrypt(obj.password),
308 309
      // Type:"SQLServer",
      // name:obj.dbName,
张烨's avatar
张烨 committed
310 311
    })
      .then(res => {
312
        setCardLoading(false);
皮倩雯's avatar
皮倩雯 committed
313
        if (res.code == 0 && res.data == true) {
张烨's avatar
张烨 committed
314
          notification.success({
Maofei94's avatar
Maofei94 committed
315
            message: '提示',
张烨's avatar
张烨 committed
316 317 318 319 320 321
            duration: 3,
            description: '连接成功',
          });
        } else {
          notification.error({
            message: '提示',
Maofei94's avatar
Maofei94 committed
322
            duration: 15,
皮倩雯's avatar
皮倩雯 committed
323
            description: res.msg,
张烨's avatar
张烨 committed
324 325 326 327
          });
        }
      })
      .catch(err => {
328
        setCardLoading(false);
张烨's avatar
张烨 committed
329
        console.log(err);
330
      });
张烨's avatar
张烨 committed
331
  };
Maofei94's avatar
Maofei94 committed
332
  // 获取数据库列表
张烨's avatar
张烨 committed
333
  const selectFocus = e => {
皮倩雯's avatar
皮倩雯 committed
334
    //setOption([]);
张烨's avatar
张烨 committed
335
    let params = form.getFieldsValue();
Maofei94's avatar
Maofei94 committed
336
    getDataBaseList({
皮倩雯's avatar
皮倩雯 committed
337 338
      // _version: 9999,
      // _dc: Date.now(),
张烨's avatar
张烨 committed
339
      userName: params.userName || '',
皮倩雯's avatar
皮倩雯 committed
340
      password: Encrypt(params.password) || '',
张烨's avatar
张烨 committed
341
      ip: params.ip || '',
张烨's avatar
张烨 committed
342 343
    })
      .then(res => {
皮倩雯's avatar
皮倩雯 committed
344
        if (res.code == 0) {
皮倩雯's avatar
皮倩雯 committed
345
          console.log(res.data.root);
皮倩雯's avatar
皮倩雯 committed
346
          setOption(res.data.root);
张烨's avatar
张烨 committed
347 348
        } else {
          notification.error({
Maofei94's avatar
Maofei94 committed
349
            message: '提示',
Maofei94's avatar
Maofei94 committed
350
            duration: 15,
皮倩雯's avatar
皮倩雯 committed
351
            description: res.msg,
张烨's avatar
张烨 committed
352 353 354 355 356 357 358 359
          });
          setOption([]);
        }
      })
      .catch(err => {
        console.error(err);
      });
  };
张烨's avatar
张烨 committed
360
  // 点击表格回显到表单
张烨's avatar
张烨 committed
361 362
  const tableClick = item => {
    let obj = { ...dbForm };
张烨's avatar
张烨 committed
363
    Object.keys(obj).forEach(k => {
张烨's avatar
张烨 committed
364
      obj[k] = item[k];
张烨's avatar
张烨 committed
365
    });
366
    chooseDb.current = item;
皮倩雯's avatar
皮倩雯 committed
367
    form.setFieldsValue({ ...obj, password: Decrypt(obj.password) });
张烨's avatar
张烨 committed
368
  };
369
  // 产品方案选择框回调
Maofei94's avatar
Maofei94 committed
370
  const handleSelect = value => {
Maofei94's avatar
Maofei94 committed
371 372 373
    handeleChangeSQLDirName(value);
  };
  const handeleChangeSQLDirName = val => {
374
    setTableSQLDirName({
Maofei94's avatar
Maofei94 committed
375
      dirName: val,
376
    })
Maofei94's avatar
Maofei94 committed
377
      .then(res => {
378
        if (res.code === 0) {
Maofei94's avatar
Maofei94 committed
379 380 381
          notification.success({
            message: '提示',
            duration: 3,
Maofei94's avatar
Maofei94 committed
382
            description: `已切换初始化脚本为:${val}`,
Maofei94's avatar
Maofei94 committed
383 384 385 386
          });
        } else {
          notification.error({
            message: '提示',
Maofei94's avatar
Maofei94 committed
387
            duration: 15,
Maofei94's avatar
Maofei94 committed
388 389 390 391 392 393 394 395
            description: res.message,
          });
        }
      })
      .catch(err => {
        console.error(err);
      });
  };
张烨's avatar
张烨 committed
396
  // 展示修改描述
Maofei94's avatar
Maofei94 committed
397 398
  const changeDesc = val => {
    setDesc(val);
399
    handleShowModal('describeVisible', true);
张烨's avatar
张烨 committed
400 401 402 403 404
  };
  const descChange = e => {
    const { value } = e.target;
    setDesc(value);
  };
Maofei94's avatar
Maofei94 committed
405 406 407 408 409
  // 关闭弹窗
  const handleClick = () => {
    setInitVisible(false);
    setInitContent('');
    setFinish(false);
410 411 412 413
    // deleteInitDBLog({
    //   _version: 9999,
    //   _dc: Date.now(),
    // });
414
    deleteInitDBLogNew();
Maofei94's avatar
Maofei94 committed
415
  };
张烨's avatar
张烨 committed
416 417 418 419
  // 弹窗确认回调
  const modalOkCallback = () => {
    const obj = form.getFieldsValue();
    // 更新描述
420
    updateConnDescNew({
张烨's avatar
张烨 committed
421 422 423
      ip: obj.ip,
      dbName: obj.dbName,
      userName: obj.userName,
皮倩雯's avatar
皮倩雯 committed
424
      password: Encrypt(obj.password),
张烨's avatar
张烨 committed
425
      desc,
426
    })
427
      .then(res => {
428
        handleShowModal('describeVisible', false);
429 430
        // setUpData(upData + 1);
        getConnRecordData();
431 432 433
      })
      .catch(err => {
        console.error(err);
434
        handleShowModal('describeVisible', false);
435
      });
张烨's avatar
张烨 committed
436
  };
Maofei94's avatar
Maofei94 committed
437
  // 删除数据库连接记录
Maofei94's avatar
Maofei94 committed
438
  const delConfirm = value => {
Maofei94's avatar
Maofei94 committed
439
    const { key = '' } = value;
Maofei94's avatar
Maofei94 committed
440
    setTableLoading(true);
441
    deleteConnNew({
Maofei94's avatar
Maofei94 committed
442 443 444 445
      rowIndex: key,
    })
      .then(res => {
        setTableLoading(false);
446
        if (res.code === 0) {
447 448
          // setUpData(upData + 1);
          getConnRecordData();
Maofei94's avatar
Maofei94 committed
449 450 451 452 453 454 455 456
          notification.success({
            message: '提示',
            duration: 3,
            description: '操作成功',
          });
        } else {
          notification.error({
            message: '提示',
Maofei94's avatar
Maofei94 committed
457
            duration: 15,
458
            description: res.msg,
Maofei94's avatar
Maofei94 committed
459 460 461 462 463 464 465 466
          });
        }
      })
      .catch(err => {
        setTableLoading(false);
        console.error(err);
      });
  };
皮倩雯's avatar
皮倩雯 committed
467 468 469

  const GetDb = () => {
    let obj = form.getFieldsValue();
皮倩雯's avatar
皮倩雯 committed
470
    GetDbProduct({ ...obj, password: Encrypt(obj.password) }).then(res => {
皮倩雯's avatar
皮倩雯 committed
471 472 473 474 475 476 477 478 479
      if (res.code === 0) {
        console.log(res.data);
        if (res.data.Product) {
          console.log(res.data.Product);
          let aa = [];
          res.data.Product.map(i => {
            aa.push(i.name);
          });
          console.log(aa);
480
          setKeep(res.data.IsAuthorize);
皮倩雯's avatar
皮倩雯 committed
481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504
          setKeepProduct(aa);
        }
        setDbExists(res.data.DBExists);
        setKeepDb(res.data);
        if (!res.data.DBExists) {
          setVisibleModel(true);
        } else if (res.data.DBExists && res.data.Product.length > 0) {
          setVisibleModel(true);
        } else {
          notification.warning({
            message: '提示',
            duration: 15,
            description: '当前数据库不可初始化',
          });
        }
      } else {
        notification.warning({
          message: '提示',
          duration: 15,
          description: res.msg,
        });
      }
    });
  };
505 506 507 508 509 510 511
  // 获取数据库初始化回显列表
  const getInitList = () => {
    setInitList([]);
    handleShowModal('initVisible', true);
    setInitLoading(true);
    let obj = form.getFieldsValue();
    let req1 = GetProductList();
皮倩雯's avatar
皮倩雯 committed
512
    let req2 = GetDbProduct({ ...obj, password: Encrypt(obj.password) });
513 514 515 516 517 518 519 520 521 522 523
    Promise.all([req1, req2])
      .then(res => {
        if (res[1].code !== 0 || res[0].code !== 0) {
          setInitLoading(false);
          notification.error({
            message: '提示',
            duration: 3,
            description: '连接失败',
          });
          return;
        }
524
        setDbExists(res[1].data.DBExists);
525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549
        let fileList = res[0].data ? res[0].data : [];
        let dataList = res[1].data.Product ? res[1].data.Product : [];
        // 没有库或者dataList为[]直接用fileList作为回显
        if (!res[1].data.DBExists || dataList.length === 0) {
          setInitList(fileList);
          setInitLoading(false);
          return;
        }
        let mapList = new Map();
        // 通过map给数据库中中的节点中的key的值当作key,checkVersion当作value进行存储
        dataList.forEach(element => {
          // 存入一级目录是否有选中项的key
          mapList.set(element.key, element.check);
          element.modularSolutions.forEach(item => {
            // 存入二级目录对应的选中的checkVersion跟check
            mapList.set(item.key, {
              checkVersion: item.checkVersion,
              check: item.check,
            });
            item.functionrSolutions.forEach(val => {
              // 存入三级目录对应的选中的checkVersion跟check
              mapList.set(val.key, val.isCheck);
            });
          });
        });
550
        console.log(mapList, 'mapList');
551 552 553 554 555 556
        fileList.forEach(element => {
          // 根据key来获取第一级目录tab的check
          let tabKey = mapList.get(element.key);
          element.check = tabKey === undefined ? null : tabKey;
          element.modularSolutions.forEach(item => {
            let mapCheckVersion = mapList.get(item.key);
557 558 559
            if (mapCheckVersion === undefined) {
              mapCheckVersion = { checkVersion: null, check: null };
            }
560 561
            // 根据key值去匹配对应的checkVersion
            item.checkVersion =
562
              mapCheckVersion.checkVersion === undefined ? null : mapCheckVersion.checkVersion;
563
            // 根据key值去匹配对应的二级目录的check
564
            item.check = mapCheckVersion.check === undefined ? null : mapCheckVersion.check;
565 566 567
            if (item.check) {
              item.hasCheck = true;
            }
568 569 570 571
            item.functionrSolutions.forEach(val => {
              // 根据三级目录对应的选中key匹配isCheck
              let isCheck = mapList.get(val.key);
              val.isCheck = isCheck === undefined ? null : isCheck;
572 573 574 575 576 577
              // 版本号低于当前版本号禁止选用
              if (item.checkVersion && val.version < item.checkVersion) {
                val.disabled = true;
              } else {
                val.disabled = false;
              }
578 579 580 581 582 583
            });
          });
        });
        setInitList(fileList);
        setInitLoading(false);
      })
584 585
      .catch(err => {
        console.log(err, 'err');
586 587 588 589 590 591 592 593 594 595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617
        notification.error({
          message: '提示',
          duration: 3,
          description: '连接失败',
        });
        setInitLoading(false);
      });
  };
  // 初始化产品列表渲染
  const renderInitListItem = (tabItem, index) => (
    <TabPane tab={tabItem.productName} key={index}>
      <div className={styles.tabContainer}>
        {tabItem.modularSolutions.map((item, num) => (
          <React.Fragment key={item.key}>
            {item.functionrSolutions.length > 0 ? (
              <RadioBox
                radioTitle={item.modularName}
                radioOptions={item.functionrSolutions}
                currentVal={item.checkVersion}
                currentIndex={{ tabIndex: index, radioIndex: num }}
                callBack={radioChange}
              />
            ) : null}
          </React.Fragment>
        ))}
      </div>
    </TabPane>
  );
  // 单选选后的回调,改变数据
  const radioChange = (index, value) => {
    setInitList(val => {
      const list = JSON.parse(JSON.stringify(val));
618
      const secondList = list[index.tabIndex].modularSolutions[index.radioIndex];
619 620 621 622 623 624 625 626 627 628 629
      // 取消功能 一开始未选中的才能取消
      if (value === secondList.checkVersion && !secondList.hasCheck) {
        secondList.checkVersion = null;
        value = null;
        secondList.check = false;
      } else {
        // 修改选中的checkVersion值
        secondList.checkVersion = value;
        // 修改二级菜单的check字段
        secondList.check = true;
      }
630
      // 修改一级菜单的check字段
631 632 633
      list[index.tabIndex].check = !list[index.tabIndex].modularSolutions.every(
        version => version.checkVersion === null,
      );
634
      // 修改单选isCheck字段
635
      secondList.functionrSolutions.forEach(item => {
636 637 638 639 640 641 642 643 644
        if (item.version === value) {
          item.isCheck = true;
        } else {
          item.isCheck = false;
        }
      });
      return list;
    });
  };
皮倩雯's avatar
皮倩雯 committed
645 646 647
  const onOK = (arr, code) => {
    initDatabasePro(arr, code);
  };
648
  // 数据库初始化
皮倩雯's avatar
皮倩雯 committed
649 650
  const initDatabasePro = (e, j) => {
    let productSetting = e;
651 652 653
    let obj = form.getFieldsValue();
    // 数据库存在调用编辑接口否则调用新增接口
    setInitLoading(true);
皮倩雯's avatar
皮倩雯 committed
654
    setVisibleModel(false);
655 656 657
    handleShowModal('initVisible', false);
    setInitVisible(true);
    doInitLog();
658
    if (dbExists) {
皮倩雯's avatar
皮倩雯 committed
659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679
      InitEditDataBase({
        ...obj,
        productSetting,
        license: j,
        password: Encrypt(obj.password),
      }).then(res => {
        setInitLoading(false);
        if (res.code === 0) {
          notification.success({
            message: '提示',
            duration: 3,
            description: '数据库初始化成功',
          });
        } else {
          notification.error({
            message: '提示',
            duration: 5,
            description: res.msg,
          });
        }
      });
680 681
      return;
    }
皮倩雯's avatar
皮倩雯 committed
682
    InitAddDataBase({ ...obj, productSetting, license: j }).then(res => {
683 684 685 686 687
      setInitLoading(false);
      if (res.code === 0) {
        notification.success({
          message: '提示',
          duration: 3,
688
          description: '数据库初始化成功',
689 690 691 692
        });
      } else {
        notification.error({
          message: '提示',
皮倩雯's avatar
皮倩雯 committed
693
          duration: 5,
694 695 696 697 698
          description: res.msg,
        });
      }
    });
  };
张烨's avatar
张烨 committed
699 700 701 702 703
  const columns = [
    {
      title: '服务器名或IP地址',
      dataIndex: 'ip',
      key: 'ip',
Maofei94's avatar
Maofei94 committed
704 705
      width: 180,
      ellipsis: true,
张烨's avatar
张烨 committed
706 707 708 709 710
    },
    {
      title: '数据库名称',
      dataIndex: 'dbName',
      key: 'dbName',
Maofei94's avatar
Maofei94 committed
711 712
      width: 180,
      ellipsis: true,
张烨's avatar
张烨 committed
713 714 715 716 717
    },
    {
      title: '数据库用户名称',
      dataIndex: 'userName',
      key: 'userName',
Maofei94's avatar
Maofei94 committed
718 719
      width: 180,
      ellipsis: true,
张烨's avatar
张烨 committed
720 721 722 723 724
    },
    {
      title: '保存时间',
      dataIndex: 'saveTime',
      key: 'saveTime',
Maofei94's avatar
Maofei94 committed
725 726
      width: 180,
      ellipsis: true,
张烨's avatar
张烨 committed
727 728 729 730 731
    },
    {
      title: '描述',
      dataIndex: 'desc',
      key: 'desc',
Maofei94's avatar
Maofei94 committed
732
      ellipsis: true,
张烨's avatar
张烨 committed
733 734
    },
    {
Maofei94's avatar
Maofei94 committed
735 736 737
      title: '操作',
      dataIndex: 'action',
      key: 'action',
Maofei94's avatar
Maofei94 committed
738 739
      width: 250,
      ellipsis: true,
Maofei94's avatar
Maofei94 committed
740 741 742 743 744 745
      render: (text, record) => (
        <Space>
          <Button
            type="primary"
            size="small"
            onClick={() => {
Maofei94's avatar
Maofei94 committed
746
              changeDesc(record.desc);
Maofei94's avatar
Maofei94 committed
747 748 749 750
            }}
          >
            修改描述
          </Button>
751
          {/* <div onClick={e => e.stopPropagation()}>
Maofei94's avatar
Maofei94 committed
752 753 754 755 756 757 758 759 760 761 762 763
            <Popconfirm
              title="是否删除该连接的历史记录?"
              okText="确认"
              cancelText="取消"
              onConfirm={() => {
                delConfirm(record);
              }}
            >
              <Button size="small" danger>
                删除
              </Button>
            </Popconfirm>
764
          </div> */}
Maofei94's avatar
Maofei94 committed
765
        </Space>
张烨's avatar
张烨 committed
766
      ),
张烨's avatar
张烨 committed
767 768
    },
  ];
皮倩雯's avatar
皮倩雯 committed
769 770 771 772 773 774 775 776 777 778 779 780 781 782 783 784 785 786 787 788 789

  const flagChange = () => {
    const obj = form.getFieldsValue();
    console.log(keepData);
    console.log(obj);
    if (
      keepData.ip == obj.ip &&
      keepData.dbName == obj.dbName &&
      keepData.userName == obj.userName &&
      keepData.password == obj.password
    ) {
      GetDb();
      deleteInitDBLogNew();
    } else {
      notification.warning({
        message: '提示',
        duration: 15,
        description: '请先保存连接',
      });
    }
  };
张烨's avatar
张烨 committed
790 791
  return (
    <>
792
      <PageContainer className={styles.InitDataBaseContainer}>
张烨's avatar
张烨 committed
793
        <Card>
794
          <Spin tip="loading..." spinning={cardLoading}>
795
            {/* <div className={styles.tableTitle}>数据库初始化</div> */}
796 797 798 799 800 801 802 803 804
            <Form
              className={styles.mgTop20}
              layout="horizontal"
              labelAlign="left"
              labelCol={{ span: 3 }}
              form={form}
              onFinish={onFinish}
              onValuesChange={onValuesChange}
            >
皮倩雯's avatar
皮倩雯 committed
805 806 807 808 809 810 811 812 813 814 815 816 817 818
              <Form.Item
                label={`${formLables.ip}:`}
                name="ip"
                rules={[
                  {
                    validator: (rule, value) => {
                      if (form.getFieldValue().ip == '') {
                        return Promise.reject('ip必填');
                      }
                      return Promise.resolve();
                    },
                  },
                ]}
              >
819 820
                <Input placeholder="请输入服务器名或IP地址" />
              </Form.Item>
皮倩雯's avatar
皮倩雯 committed
821 822 823 824 825 826 827 828 829 830 831 832 833 834
              <Form.Item
                label={`${formLables.userName}:`}
                name="userName"
                rules={[
                  {
                    validator: (rule, value) => {
                      if (form.getFieldValue().userName == '') {
                        return Promise.reject('用户名称必填');
                      }
                      return Promise.resolve();
                    },
                  },
                ]}
              >
835 836
                <Input placeholder="请输入用户名称" />
              </Form.Item>
皮倩雯's avatar
皮倩雯 committed
837 838 839 840 841 842 843 844 845 846 847 848 849 850 851
              <Form.Item
                label={`${formLables.password}:`}
                name="password"
                rules={[
                  {
                    validator: (rule, value) => {
                      console.log(form.getFieldValue().password);
                      if (form.getFieldValue().password == '') {
                        return Promise.reject('用户密码必填');
                      }
                      return Promise.resolve();
                    },
                  },
                ]}
              >
皮倩雯's avatar
皮倩雯 committed
852
                <Input placeholder="请输入用户密码" type="password" />
853
              </Form.Item>
皮倩雯's avatar
皮倩雯 committed
854 855 856 857 858 859 860 861 862 863 864 865 866 867 868 869 870 871
              <Form.Item
                label={`${formLables.dbName}:`}
                name="dbName"
                rules={[
                  {
                    validator: (rule, value) => {
                      console.log(form.getFieldValue().dbName);
                      if (
                        form.getFieldValue().dbName == '' ||
                        form.getFieldValue().dbName == undefined
                      ) {
                        return Promise.reject('数据库名称必填');
                      }
                      return Promise.resolve();
                    },
                  },
                ]}
              >
872 873 874 875 876 877 878 879 880 881 882 883 884 885 886 887
                <Select
                  showSearch
                  mode="tags"
                  placeholder="请选择数据库"
                  optionFilterProp="children"
                  onFocus={() => {
                    selectFocus();
                  }}
                  onChange={e => {
                    onChange(e);
                  }}
                  // eslint-disable-next-line no-shadow
                  filterOption={(input, option) => {
                    console.log(option);
                    return (
                      option.children &&
888
                      option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
889 890 891 892 893 894 895 896 897 898 899 900
                    );
                  }}
                >
                  {option &&
                    option.length > 0 &&
                    option.map((item, index) => (
                      <Option value={item.value} key={item.value + index}>
                        {item.value}
                      </Option>
                    ))}
                </Select>
              </Form.Item>
Maofei94's avatar
Maofei94 committed
901
              <Form.Item wrapperCol={{ offset: 3 }}>
902 903 904 905
                <div className={styles.tCenter}>
                  <Space size="large" className={styles.btnBox}>
                    <Space>
                      <Button onClick={onCheck}>测试连接</Button>
906
                      <Button type="primary" htmlType="submit" loading={tableLoading}>
907 908 909 910
                        保存连接
                      </Button>
                    </Space>
                    <Space>
911
                      {/* <Button
912
                        type="primary"
皮倩雯's avatar
皮倩雯 committed
913 914 915 916
                        // onClick={() => {
                        //   getInitList();
                        //   deleteInitDBLogNew();
                        // }}
917
                        onClick={() => {
皮倩雯's avatar
皮倩雯 committed
918
                          flagChange();
Maofei94's avatar
Maofei94 committed
919
                        }}
920
                      >
921
                        数据库初始化
922
                      </Button> */}
923
                    </Space>
Maofei94's avatar
Maofei94 committed
924
                  </Space>
925 926 927 928
                </div>
              </Form.Item>
            </Form>
          </Spin>
张烨's avatar
张烨 committed
929 930
        </Card>

931
        <Card className={styles.mgTop20}>
932 933 934 935 936 937 938 939 940 941 942 943 944 945 946 947 948 949 950
          <div className={styles.recordBox}>
            <div className={styles.tableTitle}>近期保存的数据库连接</div>
            <Table
              style={{ marginTop: '20px', marginBottom: '20px' }}
              scroll={{ x: 'max-content', y: 'calc(100vh - 550px)' }}
              columns={columns}
              dataSource={data}
              pagination={false}
              bordered
              loading={tableLoading}
              size="small"
              onRow={record => ({
                onClick: () => {
                  tableClick(record);
                  setFlag(0);
                }, // 点击行
              })}
            />
          </div>
张烨's avatar
张烨 committed
951
        </Card>
Maofei94's avatar
Maofei94 committed
952 953 954 955 956 957
        <Modal
          title="初始化数据库"
          visible={initVisible}
          onCancel={() => {
            setInitVisible(false);
            setInitContent('');
958 959 960 961
            // deleteInitDBLog({
            //   _version: 9999,
            //   _dc: Date.now(),
            // });
962
            deleteInitDBLogNew();
Maofei94's avatar
Maofei94 committed
963
          }}
964
          width={800}
Maofei94's avatar
Maofei94 committed
965
          maskClosable={false}
966
          bodyStyle={{
967
            height: '500px',
968
            // overflowY: 'auto',
969
          }}
Maofei94's avatar
Maofei94 committed
970 971 972
          footer={[
            <Button
              onClick={() => {
Maofei94's avatar
Maofei94 committed
973
                handleClick();
Maofei94's avatar
Maofei94 committed
974
              }}
975
              key="back"
Maofei94's avatar
Maofei94 committed
976 977 978 979 980 981
              type="primary"
            >
              关闭窗口
            </Button>,
          ]}
        >
tianfen's avatar
tianfen committed
982 983 984
          <div
            ref={scroll}
            style={{
985
              maxHeight: '470px',
tianfen's avatar
tianfen committed
986 987 988 989
              overflowY: 'auto',
              marginRight: ' -24px',
            }}
          >
Maofei94's avatar
Maofei94 committed
990
            {initContent || (
Maofei94's avatar
Maofei94 committed
991
              <Spin
992
                spinning={initLoading}
Maofei94's avatar
Maofei94 committed
993 994 995
                tip="loading..."
                style={{ width: '100%', marginTop: '40px' }}
              />
Maofei94's avatar
Maofei94 committed
996
            )}
997
          </div>
Maofei94's avatar
Maofei94 committed
998 999
        </Modal>

1000
        <Modal
张烨's avatar
张烨 committed
1001
          title="修改链接描述"
1002
          visible={modalVisible.describeVisible}
张烨's avatar
张烨 committed
1003
          onOk={() => modalOkCallback()}
1004
          onCancel={() => handleShowModal('describeVisible', false)}
1005
          width="800px"
1006
          bodyStyle={{
张烨's avatar
张烨 committed
1007
            minHeight: '100px',
1008
          }}
张烨's avatar
张烨 committed
1009
          cancelText="取消"
Maofei94's avatar
Maofei94 committed
1010
          okText="确认"
Maofei94's avatar
Maofei94 committed
1011
          destroyOnClose
1012
        >
张烨's avatar
张烨 committed
1013
          <Row>
1014
            <Col span={2} className={styles.decsBox}>
Maofei94's avatar
Maofei94 committed
1015
              描述:
张烨's avatar
张烨 committed
1016
            </Col>
Maofei94's avatar
Maofei94 committed
1017

1018
            <Col span={22}>
张烨's avatar
张烨 committed
1019 1020
              <Input
                placeholder="请输入描述"
Maofei94's avatar
Maofei94 committed
1021 1022
                allowClear
                defaultValue={desc}
张烨's avatar
张烨 committed
1023 1024 1025 1026 1027
                onChange={value => {
                  descChange(value);
                }}
              />
            </Col>
1028
          </Row>
1029
        </Modal>
皮倩雯's avatar
皮倩雯 committed
1030 1031 1032 1033 1034 1035 1036 1037
        <InitModal
          visible={visibleModel}
          onCancel={() => setVisibleModel(false)}
          keepDb={keepDb}
          callBackSubmit={onOK}
          keepProduct={keepProduct}
          keep={keep}
        />
1038 1039 1040 1041 1042 1043 1044
        {/* 初始化选择产品弹窗 */}
        <Modal
          title="初始化"
          maskClosable={false}
          visible={modalVisible.initVisible}
          onCancel={() => handleShowModal('initVisible', false)}
          footer={[
1045
            <Button key="back" onClick={() => handleShowModal('initVisible', false)}>
1046 1047 1048 1049 1050 1051 1052 1053 1054 1055 1056 1057 1058 1059 1060 1061 1062 1063 1064 1065 1066 1067 1068 1069 1070
              取消
            </Button>,
            <Popconfirm
              placement="topLeft"
              title="是否确认初始化"
              onConfirm={initDatabasePro}
              okText="确认"
              key="submit"
              cancelText="取消"
            >
              <Button type="primary" loading={initLoading}>
                确认
              </Button>
            </Popconfirm>,
          ]}
          width={900}
        >
          <Spin spinning={initLoading}>
            <div className={styles.cardContainer}>
              <Tabs defaultActiveKey="1" type="card" tabBarGutter={-1}>
                {initList.map((item, index) => renderInitListItem(item, index))}
              </Tabs>
            </div>
          </Spin>
        </Modal>
张烨's avatar
张烨 committed
1071 1072 1073 1074
      </PageContainer>
    </>
  );
};
1075

张烨's avatar
张烨 committed
1076
export default connect()(InitDataBase);