fix: '数据库初始化'

src/pages/database/InitDataBase/InitDataBase.jsx

@@ -39,6 +39,7 @@ import {
   InitEditDataBase, // 二次初始化
 } from '@/services/database/api';
 import styles from './InitDataBase.less';
+import InitModal from './initModal';
 
 const { TabPane } = Tabs;
 const { Option } = Select;
@@ -77,7 +78,13 @@ const InitDataBase = props => {
   const [initLoading, setInitLoading] = useState(false);
   const [initList, setInitList] = useState([]); // 数据库初始化产品数据
   const [dbExists, setDbExists] = useState(false); // 数据库是否存在
+  const [visibleModel, setVisibleModel] = useState(false);
+  const [keepDb, setKeepDb] = useState([]);
+  const [keepProduct, setKeepProduct] = useState([]);
   const scroll = useRef(null);
+  const [keep, setKeep] = useState([]);
+  const [flag, setFlag] = useState(0);
+  const [keepData, setKeepData] = useState({});
 
   // 获取数据库配置信息
   useEffect(() => {
@@ -223,6 +230,13 @@ const InitDataBase = props => {
       .then(resnew => {
         setCardLoading(false);
         if (resnew.code === 0) {
+          setFlag(flag + 1);
+          setKeepData({
+            ip: obj.ip,
+            dbName: obj.dbName,
+            userName: obj.userName,
+            password: obj.password,
+          });
           // setUpData(upData + 1);
           getConnRecordData();
           notification.success({
@@ -413,6 +427,44 @@ const InitDataBase = props => {
         console.error(err);
       });
   };
+
+  const GetDb = () => {
+    let obj = form.getFieldsValue();
+    GetDbProduct({ ...obj }).then(res => {
+      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);
+          setKeep(res.data.Product);
+          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,
+        });
+      }
+    });
+  };
   // 获取数据库初始化回显列表
   const getInitList = () => {
     setInitList([]);
@@ -553,17 +605,21 @@ const InitDataBase = props => {
       return list;
     });
   };
+  const onOK = (arr, code) => {
+    initDatabasePro(arr, code);
+  };
   // 数据库初始化
-  const initDatabasePro = () => {
-    let productSetting = initList;
+  const initDatabasePro = (e, j) => {
+    let productSetting = e;
     let obj = form.getFieldsValue();
     // 数据库存在调用编辑接口否则调用新增接口
     setInitLoading(true);
+    setVisibleModel(false);
     handleShowModal('initVisible', false);
     setInitVisible(true);
     doInitLog();
     if (dbExists) {
-      InitEditDataBase({ ...obj, productSetting }).then(res => {
+      InitEditDataBase({ ...obj, productSetting, license: j }).then(res => {
         setInitLoading(false);
         if (res.code === 0) {
           notification.success({
@@ -574,14 +630,14 @@ const InitDataBase = props => {
         } else {
           notification.error({
             message: '提示',
-            duration: 15,
+            duration: 5,
             description: res.msg,
           });
         }
       });
       return;
     }
-    InitAddDataBase({ ...obj, productSetting }).then(res => {
+    InitAddDataBase({ ...obj, productSetting, license: j }).then(res => {
       setInitLoading(false);
       if (res.code === 0) {
         notification.success({
@@ -592,7 +648,7 @@ const InitDataBase = props => {
       } else {
         notification.error({
           message: '提示',
-          duration: 15,
+          duration: 5,
           description: res.msg,
         });
       }
@@ -668,6 +724,27 @@ const InitDataBase = props => {
       ),
     },
   ];
+
+  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: '请先保存连接',
+      });
+    }
+  };
   return (
     <>
       <PageContainer className={styles.InitDataBaseContainer}>
@@ -683,16 +760,73 @@ const InitDataBase = props => {
               onFinish={onFinish}
               onValuesChange={onValuesChange}
             >
-              <Form.Item label={`${formLables.ip}：`} name="ip">
+              <Form.Item
+                label={`${formLables.ip}：`}
+                name="ip"
+                rules={[
+                  {
+                    validator: (rule, value) => {
+                      if (form.getFieldValue().ip == '') {
+                        return Promise.reject('ip必填');
+                      }
+                      return Promise.resolve();
+                    },
+                  },
+                ]}
+              >
                 <Input placeholder="请输入服务器名或IP地址" />
               </Form.Item>
-              <Form.Item label={`${formLables.userName}：`} name="userName">
+              <Form.Item
+                label={`${formLables.userName}：`}
+                name="userName"
+                rules={[
+                  {
+                    validator: (rule, value) => {
+                      if (form.getFieldValue().userName == '') {
+                        return Promise.reject('用户名称必填');
+                      }
+                      return Promise.resolve();
+                    },
+                  },
+                ]}
+              >
                 <Input placeholder="请输入用户名称" />
               </Form.Item>
-              <Form.Item label={`${formLables.password}：`} name="password">
+              <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();
+                    },
+                  },
+                ]}
+              >
                 <Input placeholder="请输入用户密码" type="password" />
               </Form.Item>
-              <Form.Item label={`${formLables.dbName}：`} name="dbName">
+              <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();
+                    },
+                  },
+                ]}
+              >
                 <Select
                   showSearch
                   mode="tags"
@@ -734,9 +868,12 @@ const InitDataBase = props => {
                     <Space>
                       <Button
                         type="primary"
+                        // onClick={() => {
+                        //   getInitList();
+                        //   deleteInitDBLogNew();
+                        // }}
                         onClick={() => {
-                          getInitList();
-                          deleteInitDBLogNew();
+                          flagChange();
                         }}
                       >
                         数据库初始化
@@ -763,6 +900,7 @@ const InitDataBase = props => {
             onRow={record => ({
               onClick: () => {
                 tableClick(record);
+                setFlag(0);
               }, // 点击行
             })}
           />
@@ -845,6 +983,14 @@ const InitDataBase = props => {
             </Col>
           </Row>
         </Modal>
+        <InitModal
+          visible={visibleModel}
+          onCancel={() => setVisibleModel(false)}
+          keepDb={keepDb}
+          callBackSubmit={onOK}
+          keepProduct={keepProduct}
+          keep={keep}
+        />
         {/* 初始化选择产品弹窗 */}
         <Modal
           title="初始化"

src/pages/database/InitDataBase/InitDataBase.less

@@ -18,13 +18,12 @@
 .ant-modal-header {
   height: 70px;
 }
-InitDataBaseContainer{
+InitDataBaseContainer {
   .ant-card-body {
     padding-bottom: 0px !important;
   }
 }
 
-
 .cardContainer {
   margin-top: 10px;
   border: 1px solid #ecf0fa;
@@ -47,5 +46,15 @@ InitDataBaseContainer{
     padding-left: 20px;
     box-sizing: border-box;
   }
-  
+}
+
+.initItemData {
+  .ant-checkbox-wrapper {
+    width: 300px;
+    margin-bottom: 10px;
+    margin-left: 8px;
+  }
+  .view:hover {
+    cursor: not-allowed;
+  }
 }

src/pages/database/InitDataBase/initModal.jsx

+/* eslint-disable no-else-return */
+/* eslint-disable react/jsx-boolean-value */
+/* eslint-disable no-lonely-if */
+/* eslint-disable guard-for-in */
+/* eslint-disable no-restricted-syntax */
+/*
+ * @Description:
+ * @Author: leizhe
+ * @Date: 2022-07-13 16:13:03
+ * @LastEditTime: 2022-07-19 17:53:15
+ * @LastEditors: leizhe
+ */
+import React, { useState, useEffect } from 'react';
+import { Form, Modal, Divider, Checkbox, Button, Input, notification, Row, Col } from 'antd';
+import {
+  GetProductList,
+  GetProductListByLicense,
+  InitAddDataBase,
+  InitEditDataBase,
+  GetLicenseStatus,
+} from '@/services/database/api';
+import styles from './InitDataBase.less';
+
+const CheckboxGroup = Checkbox.Group;
+
+const InitModal = props => {
+  const [form] = Form.useForm();
+  const { callBackSubmit = () => {}, keepDb, visible, onCancel, keepProduct, keep } = props;
+  const [data, setData] = useState([]);
+  const [title, setTitle] = useState([]);
+  const [listVisible, setListVisible] = useState(false);
+  const [keepCode, setKeepCode] = useState([]);
+  const [keepData, setKeepData] = useState([]);
+  const [flag, setFlag] = useState(0);
+  const [mag, setMag] = useState('');
+  const [code, setCode] = useState('');
+  const [loadings, setLoadings] = useState(false);
+  const [checkboxFlag, setCheckboxFlag] = useState(0);
+  const [keepValue, setKeepValue] = useState([]);
+  const [value, setValue] = useState([]);
+  const [product, setProduct] = useState([]);
+
+  useEffect(() => {
+    setFlag(0);
+    setCheckboxFlag(0);
+    setMag('');
+    if (visible) {
+      getProductList();
+      setKeepCode(keepProduct);
+    } else {
+      setCode('');
+      setKeepCode([]);
+      setValue([]);
+      setKeepValue([]);
+    }
+  }, [visible]);
+
+  useEffect(() => {
+    form.resetFields();
+  }, [listVisible]);
+
+  const getProductList = () => {
+    GetProductList().then(res => {
+      if (res.code === 0) {
+        setKeepData(res.data);
+        if (keepProduct.length > 0) {
+          let dd = [];
+          keepProduct.map(i => {
+            res.data.map(j => {
+              if (j.name === i) {
+                dd.push(j);
+              }
+            });
+          });
+          let arr = formateArrDataA(dd, 'productName');
+          let aa = Object.keys(arr);
+          aa.map(i => {
+            let list = [];
+            arr[i].map(j => {
+              list.push(j.name);
+            });
+            arr[i] = list;
+          });
+          console.log(arr);
+          setProduct(arr);
+          setValue(keepProduct);
+          setKeepValue(arr);
+        }
+        let arr = formateArrDataA(res.data, 'productName');
+        let aa = Object.keys(arr);
+        aa.map(i => {
+          let list = [];
+          arr[i].map(j => {
+            list.push(j.name);
+          });
+          arr[i] = list;
+        });
+        console.log(aa);
+        console.log(arr);
+        console.log(keepProduct);
+        setTitle(aa);
+        setData(arr);
+      }
+    });
+  };
+
+  const formateArrDataA = (initialArr, name) => {
+    // 判定传参是否符合规则
+    if (!(initialArr instanceof Array)) {
+      return '请传入正确格式的数组';
+    }
+    if (!name) {
+      return '请传入对象属性';
+    }
+    // 先获取一下这个数组中有多少个"name"
+    let nameArr = [];
+    for (let i in initialArr) {
+      if (nameArr.indexOf(initialArr[i][`${name}`]) === -1) {
+        nameArr.push(initialArr[i][`${name}`]);
+      }
+    }
+    // 新建一个包含多个list的结果对象
+    let tempObj = {};
+    // 根据不同的"name"生成多个数组
+    for (let k in nameArr) {
+      for (let j in initialArr) {
+        if (initialArr[j][`${name}`] == nameArr[k]) {
+          // 每次外循环时新建一个对应"name"的数组, 内循环时当前数组不变
+          tempObj[nameArr[k]] = tempObj[nameArr[k]] || [];
+          tempObj[nameArr[k]].push(initialArr[j]);
+        }
+      }
+    }
+    for (let keys in tempObj) {
+      let arr = [];
+      tempObj[keys].map((item, index) => {
+        tempObj[keys] = arr;
+        item.key = index;
+        arr.push(item);
+      });
+    }
+    return tempObj;
+  };
+
+  const codeSubmit = () => {
+    let obj = form.getFieldsValue();
+    console.log(obj);
+    let str = `${obj.License1}${obj.License2}${obj.License3}${obj.License4}${obj.License5}`;
+    GetProductListByLicense({ License: str }).then(res => {
+      if (res.code === 0) {
+        if (res.data.length > 0) {
+          let aa = [];
+          res.data.map(i => {
+            aa.push(i.name);
+          });
+          console.log(aa);
+          let bb = keepProduct;
+          let cc = aa.concat(bb);
+          let dd = Array.from(new Set(cc));
+          console.log(dd);
+          GetLicenseStatus({ license: str }).then(res => {
+            if (res.code === 0) {
+              if (res.data == 1) {
+                notification.error({
+                  message: '提示',
+                  duration: 5,
+                  description: '激活码已被使用',
+                });
+              } else {
+                setCheckboxFlag(checkboxFlag + 1);
+                setKeepCode(dd);
+                setCode(str);
+                setListVisible(false);
+                setFlag(flag + 1);
+                setMag('');
+              }
+            } else {
+              notification.error({
+                message: '提示',
+                duration: 5,
+                description: res.msg,
+              });
+            }
+          });
+        } else {
+          notification.error({
+            message: '提示',
+            duration: 5,
+            description: '激活码未购买任何产品',
+          });
+          setMag('激活码未购买任何产品');
+        }
+      } else {
+        notification.error({
+          message: '提示',
+          duration: 5,
+          description: res.msg,
+        });
+        setMag(res.msg);
+      }
+    });
+  };
+
+  const onSubmit = () => {
+    console.log(mag);
+    if (mag != '' && keepProduct == keepCode && checkboxFlag != 0) {
+      notification.error({
+        message: '提示',
+        duration: 5,
+        description: '请先输入激活码激活产品',
+      });
+    } else {
+      if (flag !== 0 || checkboxFlag == 0) {
+        setLoadings(true);
+        let arr = [];
+        if (checkboxFlag == 0) {
+          keepData.map(i => {
+            if (value.indexOf(i.name) != -1) {
+              arr.push(i);
+            }
+          });
+        } else {
+          keepData.map(i => {
+            if (keepCode.indexOf(i.name) != -1) {
+              arr.push(i);
+            }
+          });
+        }
+        console.log(arr);
+        callBackSubmit(arr, code);
+        onCancel();
+      } else {
+        notification.warning({
+          message: '提示',
+          duration: 5,
+          description: '请先输入激活码激活产品',
+        });
+      }
+    }
+  };
+
+  const onChange = (e, item) => {
+    console.log(e);
+    console.log(product);
+    console.log(keepProduct);
+    console.log(product[item]);
+    console.log(item);
+    console.log(data[item]);
+    console.log(keepValue);
+    // let aa = keepValue;
+    // aa[item] = e;
+    // let a = Object.keys(aa);
+    // let list = [];
+    // a.map(i => {
+    //   aa[i].map(j => {
+    //     list.push(j);
+    //   });
+    // });
+    // setKeepValue(aa);
+    // setValue(list);
+
+    if (product[item]) {
+      // 过滤已初始化的产品但不存在于产品列表中的数据，避免组件出错
+      product[item].map(i => {
+        if (data[item].indexOf(i) == -1) {
+          product[item].splice(product[item].findIndex(j => j === i), 1);
+        }
+      });
+
+      let arr = product[item].find(i => e.indexOf(i) == -1);
+      let bb = keepProduct.indexOf(arr);
+      // 已经被初始化的产品不允许取消勾选
+      if (arr && bb != -1) {
+        console.log(arr);
+      } else {
+        let aa = keepValue;
+        aa[item] = e;
+        let a = Object.keys(aa);
+        let list = [];
+        a.map(i => {
+          aa[i].map(j => {
+            list.push(j);
+          });
+        });
+        setKeepValue(aa);
+        console.log(list);
+        setValue(list);
+      }
+    } else {
+      let aa = keepValue;
+      aa[item] = e;
+      let a = Object.keys(aa);
+      let list = [];
+      a.map(i => {
+        aa[i].map(j => {
+          list.push(j);
+        });
+      });
+      setKeepValue(aa);
+      setValue(list);
+    }
+  };
+
+  return (
+    <Modal
+      title="初始化"
+      bodyStyle={{ width: '100%', minHeight: '100px', maxHeight: '600px', overflow: 'scroll' }}
+      width="980px"
+      destroyOnClose
+      centered
+      {...props}
+      forceRender
+      getContainer={false}
+      footer={[
+        <Button onClick={() => setListVisible(true)}>产品激活</Button>,
+        <Button type="primary" onClick={() => onSubmit()}>
+          确认
+        </Button>,
+      ]}
+    >
+      <div className={styles.initItemData}>
+        {visible && (
+          <div>
+            {title &&
+              title.map((item, index) => (
+                <div className={styles.cardItemData} key={index}>
+                  <Divider
+                    orientation="center"
+                    style={{
+                      margin: '0 0 20px 0',
+                      color: '#15428b',
+                      borderTopColor: '#99bbe8',
+                    }}
+                  >
+                    {item}
+                  </Divider>
+                  {checkboxFlag == 0 ? (
+                    <CheckboxGroup
+                      options={data[item]}
+                      value={value}
+                      onChange={e => onChange(e, item)}
+                    />
+                  ) : (
+                    <>
+                      {data[item] &&
+                        data[item].map((i, j) => {
+                          if (keepCode.indexOf(i) != -1) {
+                            return <Checkbox checked={true}>{i}</Checkbox>;
+                          } else {
+                            return (
+                              <Checkbox checked={false} disabled>
+                                {i}
+                              </Checkbox>
+                            );
+                          }
+                        })}
+                    </>
+                  )}
+                </div>
+              ))}
+          </div>
+        )}
+      </div>
+      <Modal
+        title="产品激活"
+        visible={listVisible}
+        onCancel={() => setListVisible(false)}
+        onOk={() => codeSubmit()}
+        width="700px"
+      >
+        <Form form={form}>
+          <Row span={24}>
+            <Col span={6}>
+              <Form.Item label="产品激活码" name="License1">
+                <Input
+                  maxLength={5}
+                  onPaste={e => {
+                    let aa = e.clipboardData
+                      .getData('Text')
+                      .split('-')
+                      .join('');
+                    let a1 = aa.substring(0, 5);
+                    let a2 = aa.substring(5, 10);
+                    let a3 = aa.substring(10, 15);
+                    let a4 = aa.substring(15, 20);
+                    let a5 = aa.substring(20, 25);
+                    form.resetFields();
+                    form.setFieldsValue({
+                      License1: a1,
+                      License2: a2,
+                      License3: a3,
+                      License4: a4,
+                      License5: a5,
+                    });
+                  }}
+                />
+              </Form.Item>
+            </Col>
+            <Col span={1}>
+              <Form.Item>
+                <span style={{ marginLeft: '10px' }}>-</span>
+              </Form.Item>
+            </Col>
+            <Col span={3}>
+              <Form.Item name="License2">
+                <Input
+                  maxLength={5}
+                  onPaste={e => {
+                    let aa = e.clipboardData
+                      .getData('Text')
+                      .split('-')
+                      .join('');
+                    let a1 = aa.substring(0, 5);
+                    let a2 = aa.substring(5, 10);
+                    let a3 = aa.substring(10, 15);
+                    let a4 = aa.substring(15, 20);
+                    let a5 = aa.substring(20, 25);
+                    form.resetFields();
+                    form.setFieldsValue({
+                      License1: a1,
+                      License2: a2,
+                      License3: a3,
+                      License4: a4,
+                      License5: a5,
+                    });
+                  }}
+                />
+              </Form.Item>
+            </Col>
+            <Col span={1}>
+              <Form.Item>
+                <span style={{ marginLeft: '10px' }}>-</span>
+              </Form.Item>
+            </Col>
+            <Col span={3}>
+              <Form.Item name="License3">
+                <Input
+                  maxLength={5}
+                  onPaste={e => {
+                    let aa = e.clipboardData
+                      .getData('Text')
+                      .split('-')
+                      .join('');
+                    let a1 = aa.substring(0, 5);
+                    let a2 = aa.substring(5, 10);
+                    let a3 = aa.substring(10, 15);
+                    let a4 = aa.substring(15, 20);
+                    let a5 = aa.substring(20, 25);
+                    form.resetFields();
+                    form.setFieldsValue({
+                      License1: a1,
+                      License2: a2,
+                      License3: a3,
+                      License4: a4,
+                      License5: a5,
+                    });
+                  }}
+                />
+              </Form.Item>
+            </Col>
+            <Col span={1}>
+              <Form.Item>
+                <span style={{ marginLeft: '10px' }}>-</span>
+              </Form.Item>
+            </Col>
+            <Col span={3}>
+              <Form.Item name="License4">
+                <Input
+                  maxLength={5}
+                  onPaste={e => {
+                    let aa = e.clipboardData
+                      .getData('Text')
+                      .split('-')
+                      .join('');
+                    let a1 = aa.substring(0, 5);
+                    let a2 = aa.substring(5, 10);
+                    let a3 = aa.substring(10, 15);
+                    let a4 = aa.substring(15, 20);
+                    let a5 = aa.substring(20, 25);
+                    form.resetFields();
+                    form.setFieldsValue({
+                      License1: a1,
+                      License2: a2,
+                      License3: a3,
+                      License4: a4,
+                      License5: a5,
+                    });
+                  }}
+                />
+              </Form.Item>
+            </Col>
+            <Col span={1}>
+              <Form.Item>
+                <span style={{ marginLeft: '10px' }}>-</span>
+              </Form.Item>
+            </Col>
+            <Col span={3}>
+              <Form.Item name="License5">
+                <Input
+                  maxLength={5}
+                  onPaste={e => {
+                    let aa = e.clipboardData
+                      .getData('Text')
+                      .split('-')
+                      .join('');
+                    let a1 = aa.substring(0, 5);
+                    let a2 = aa.substring(5, 10);
+                    let a3 = aa.substring(10, 15);
+                    let a4 = aa.substring(15, 20);
+                    let a5 = aa.substring(20, 25);
+                    form.resetFields();
+                    form.setFieldsValue({
+                      License1: a1,
+                      License2: a2,
+                      License3: a3,
+                      License4: a4,
+                      License5: a5,
+                    });
+                  }}
+                />
+              </Form.Item>
+            </Col>
+          </Row>
+        </Form>
+      </Modal>
+    </Modal>
+  );
+};
+export default InitModal;

src/services/database/api.js

@@ -191,6 +191,12 @@ export const GetUserAuthSet = params => get(`${PUBLISH_SERVICE}/WebSite/GetUserA
 
 // 获取产品列表
 export const GetProductList = params => get(`${PUBLISH_SERVICE}/DBManager/GetProductList`, params);
+// 获取产品列表清单
+export const GetProductListByLicense = params =>
+  get(`${PUBLISH_SERVICE}/DBManager/GetProductListByLicense`, params);
+// 判断License是否已使用
+export const GetLicenseStatus = params =>
+  get(`${PUBLISH_SERVICE}/DBManager/GetLicenseStatus`, params);
 // 获取产品方案配置
 export const GetDbProduct = params => post(`${PUBLISH_SERVICE}/DBManager/GetDbProduct`, params);
 // 数据库初始化