ManagementDataBase.jsx 7.81 KB
Newer Older
张烨's avatar
张烨 committed
1
import React, { useEffect, useState } from 'react';
Maofei94's avatar
Maofei94 committed
2 3 4 5 6 7 8 9
import {
  Card,
  Button,
  Table,
  Space,
  Modal,
  Popconfirm,
  notification,
Maofei94's avatar
Maofei94 committed
10
  Spin,
Maofei94's avatar
Maofei94 committed
11
} from 'antd';
12
import PageContainer from '@/components/BasePageContainer';
Maofei94's avatar
Maofei94 committed
13
import styles from './ManagementDataBase.less';
Maofei94's avatar
Maofei94 committed
14 15 16 17 18
import {
  tableCheck,
  updateDateBase,
  databaseStandardGetLog,
} from '@/services/database/api';
19 20

const ManagementDataBase = () => {
21 22 23
  const [autoCheckList, setAutoCheckList] = useState([]); // 自动列表
  const [checkList, setCheckList] = useState([]); // 手动列表
  const [logList, setLogList] = useState([]); // 日志列表
Maofei94's avatar
Maofei94 committed
24
  const [checkFlag, setCheckFlag] = useState(1);
25 26
  const [upFlag, setUpFlag] = useState(1); //
  const [checkLoading, setCheckLoading] = useState(false); // 按钮loading
张烨's avatar
张烨 committed
27
  const [logLoading, setLogLoading] = useState(false);
张烨's avatar
张烨 committed
28
  const [modalVisible, setModalVisible] = useState(false); // 弹窗
张烨's avatar
张烨 committed
29
  const [content, setContent] = useState(null);
Maofei94's avatar
Maofei94 committed
30
  const [modalTitle, setModalTitle] = useState('详细信息');
张烨's avatar
张烨 committed
31
  // 检查数据库表
张烨's avatar
张烨 committed
32 33
  useEffect(() => {
    setCheckLoading(true);
Maofei94's avatar
Maofei94 committed
34
    tableCheck({
张烨's avatar
张烨 committed
35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61
      _version: 9999,
      _dc: new Date().getTime(),
    })
      .then(res => {
        setCheckLoading(false);
        console.log(res);
        if (res.sucess) {
          const { list, messageList } = res;
          // 自动检测列表
          let arr = list.map((item, index) => {
            item.key = index;
            return item;
          });
          // 手动检查列表
          let arr2 = messageList.map((item, index) => {
            item.key = index;
            return item;
          });
          console.log(arr);
          setAutoCheckList(arr);
          setCheckList(arr2);
        }
      })
      .catch(err => {
        setCheckLoading(false);
        console.error(err);
      });
62
  }, [checkFlag]);
Maofei94's avatar
Maofei94 committed
63
  // 获取数据库升级记录
张烨's avatar
张烨 committed
64 65
  useEffect(() => {
    setLogLoading(true);
Maofei94's avatar
Maofei94 committed
66
    databaseStandardGetLog({
张烨's avatar
张烨 committed
67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84
      _version: 9999,
      _dc: new Date().getTime(),
    })
      .then(res => {
        setLogLoading(false);
        if (res) {
          let arr = [];
          res.map((item, index) => {
            item.key = index;
            arr.push(item);
          });
          setLogList(res);
        }
      })
      .catch(err => {
        setLogLoading(false);
        console.error(err);
      });
85 86
  }, [upFlag]);
  // 检查功能
张烨's avatar
张烨 committed
87
  const handleCheck = () => {
Maofei94's avatar
Maofei94 committed
88
    setCheckFlag(checkFlag + 1);
张烨's avatar
张烨 committed
89
  };
90
  // 升级功能
张烨's avatar
张烨 committed
91
  const handleUpdate = () => {
92
    setCheckLoading(true);
Maofei94's avatar
Maofei94 committed
93 94 95 96 97
    updateDateBase({
      _version: 9999,
      _dc: Date.now(),
    })
      .then(res => {
98
        setCheckLoading(false);
Maofei94's avatar
Maofei94 committed
99
        setCheckFlag(checkFlag + 1);
100 101
        setUpFlag(upFlag + 1);
        if (res.success) {
Maofei94's avatar
Maofei94 committed
102 103 104 105 106 107 108 109
          notification.success({
            message: '通知',
            duration: 3,
            description: res.message,
          });
        } else {
          notification.error({
            message: '通知',
Maofei94's avatar
Maofei94 committed
110
            duration: 15,
Maofei94's avatar
Maofei94 committed
111 112 113 114 115
            description: res.message,
          });
        }
      })
      .catch(err => {
116
        setCheckLoading(false);
Maofei94's avatar
Maofei94 committed
117 118
        console.error(err);
      });
张烨's avatar
张烨 committed
119
  };
Maofei94's avatar
Maofei94 committed
120
  const handleLog = (text, val) => {
Maofei94's avatar
Maofei94 committed
121
    console.log(text);
Maofei94's avatar
Maofei94 committed
122
    setModalTitle(val);
Maofei94's avatar
Maofei94 committed
123
    let arr = [];
Maofei94's avatar
Maofei94 committed
124 125 126
    arr.push(
      text.split(/(\r\n)|(\n)/).map((item, index) => <p key={index}>{item}</p>),
    );
张烨's avatar
张烨 committed
127
    setModalVisible(true);
Maofei94's avatar
Maofei94 committed
128 129
    // setContent(text);
    setContent(arr);
张烨's avatar
张烨 committed
130 131 132 133 134 135
  };
  const autoCheckColumns = [
    {
      title: '表名称',
      dataIndex: 'tableName',
      key: 'tableName',
Maofei94's avatar
Maofei94 committed
136 137
      width: 200,
      ellipsis: true,
张烨's avatar
张烨 committed
138 139 140 141 142
    },
    {
      title: '类型',
      dataIndex: 'type',
      key: 'type',
Maofei94's avatar
Maofei94 committed
143 144
      width: 180,
      ellipsis: true,
张烨's avatar
张烨 committed
145 146 147 148 149 150 151 152 153 154 155 156 157
    },
    {
      title: '差异比较',
      dataIndex: 'message',
      key: 'message',
    },
  ];
  const checkColumns = [
    {
      title: '表名称',
      dataIndex: 'tableName',
      key: 'tableName',
      width: 200,
Maofei94's avatar
Maofei94 committed
158
      ellipsis: true,
张烨's avatar
张烨 committed
159 160 161 162 163 164 165 166 167 168 169 170 171
    },
    {
      title: '差异比较',
      dataIndex: 'message',
      key: 'message',
      ellipsis: true,
    },
  ];
  const logColumns = [
    {
      title: '登录名',
      dataIndex: 'updateBy',
      key: 'updateBy',
Maofei94's avatar
Maofei94 committed
172 173
      width: 200,
      ellipsis: true,
张烨's avatar
张烨 committed
174 175 176 177 178
    },
    {
      title: '数据库名称',
      dataIndex: 'name',
      key: 'name',
Maofei94's avatar
Maofei94 committed
179 180
      width: 200,
      ellipsis: true,
张烨's avatar
张烨 committed
181
    },
Maofei94's avatar
Maofei94 committed
182 183 184 185 186 187 188
    {
      title: '解决方案',
      dataIndex: 'solutionName',
      key: 'solutionName',
      width: 200,
      ellipsis: true,
    },
张烨's avatar
张烨 committed
189 190 191 192
    {
      title: '数据库版本',
      dataIndex: 'version',
      key: 'version',
Maofei94's avatar
Maofei94 committed
193 194
      width: 200,
      ellipsis: true,
张烨's avatar
张烨 committed
195 196 197 198 199
    },
    {
      title: '升级时间',
      dataIndex: 'updateTime',
      key: 'updateTime',
Maofei94's avatar
Maofei94 committed
200 201
      width: 200,
      ellipsis: true,
张烨's avatar
张烨 committed
202 203 204 205 206
    },
    {
      title: '版本日志',
      dataIndex: 'despersion',
      key: 'despersion',
Maofei94's avatar
Maofei94 committed
207 208 209 210
      render: text => (
        <Button
          size="small"
          onClick={() => {
Maofei94's avatar
Maofei94 committed
211
            handleLog(text, '版本日志');
Maofei94's avatar
Maofei94 committed
212 213 214 215 216
          }}
        >
          日志
        </Button>
      ),
张烨's avatar
张烨 committed
217 218 219 220 221 222
    },
    {
      title: '升级内容',
      dataIndex: 'content',
      key: 'content',
      ellipsis: true,
Maofei94's avatar
Maofei94 committed
223 224 225 226 227
      render: text => (
        <Button
          size="small"
          type="primary"
          onClick={() => {
Maofei94's avatar
Maofei94 committed
228
            handleLog(text, '详细信息');
Maofei94's avatar
Maofei94 committed
229 230 231 232 233
          }}
        >
          升级内容
        </Button>
      ),
张烨's avatar
张烨 committed
234 235
    },
  ];
236

张烨's avatar
张烨 committed
237 238 239 240
  return (
    <>
      <PageContainer>
        <Card>
241
          <div className={styles.tableTitle}>表结构自动化修复</div>
Maofei94's avatar
Maofei94 committed
242 243 244 245 246 247 248 249 250 251 252 253
          <Spin tip="loading..." spinning={checkLoading}>
            <Table
              className={styles.mgTop20}
              columns={autoCheckColumns}
              dataSource={autoCheckList}
              bordered
              size="small"
            />
            <div className={styles.btnBox}>
              <Space>
                <Button type="primary" onClick={handleCheck}>
                  检查
Maofei94's avatar
Maofei94 committed
254
                </Button>
Maofei94's avatar
Maofei94 committed
255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270
                <Popconfirm
                  title="
                是否升级当前连接数据库?"
                  okText="确认"
                  cancelText="取消"
                  onConfirm={() => {
                    handleUpdate();
                  }}
                >
                  <Button danger type="primary">
                    升级
                  </Button>
                </Popconfirm>
              </Space>
            </div>
          </Spin>
张烨's avatar
张烨 committed
271
        </Card>
272
        <Card className={styles.mgTop20}>
Maofei94's avatar
Maofei94 committed
273
          <div className={styles.tableTitle}>数据库版本记录</div>
张烨's avatar
张烨 committed
274
          <Table
275
            className={styles.mgTop20}
276 277
            columns={logColumns}
            dataSource={logList}
张烨's avatar
张烨 committed
278
            bordered
279
            loading={logLoading}
Maofei94's avatar
Maofei94 committed
280
            size="small"
张烨's avatar
张烨 committed
281 282
          />
        </Card>
283
        <Card className={styles.mgTop20}>
284
          <div className={styles.tableTitle}>
Maofei94's avatar
Maofei94 committed
285
            手动修复
286 287
            (字段长度不统一,请手动修改差异,数据可能会截断,请谨慎操作)
          </div>
张烨's avatar
张烨 committed
288
          <Table
289
            className={styles.mgTop20}
290 291
            columns={checkColumns}
            dataSource={checkList}
张烨's avatar
张烨 committed
292
            bordered
293
            loading={checkLoading}
Maofei94's avatar
Maofei94 committed
294
            size="small"
张烨's avatar
张烨 committed
295 296 297
          />
        </Card>
      </PageContainer>
赵吉's avatar
赵吉 committed
298

张烨's avatar
张烨 committed
299
      <Modal
Maofei94's avatar
Maofei94 committed
300
        title={modalTitle}
张烨's avatar
张烨 committed
301 302 303 304 305
        visible={modalVisible}
        keyboard={false}
        maskClosable
        onOk={() => setModalVisible(false)}
        onCancel={() => setModalVisible(false)}
306 307
        width="1000px"
        bodyStyle={{
Maofei94's avatar
Maofei94 committed
308 309 310
          minHeight: '100px',
          maxHeight: '600px',
          overflowY: 'scroll',
311
        }}
Maofei94's avatar
Maofei94 committed
312
        style={{ top: '40px' }}
张烨's avatar
张烨 committed
313
        footer={[
Maofei94's avatar
Maofei94 committed
314 315 316
          <Button type="primary" onClick={() => setModalVisible(false)}>
            关闭窗口
          </Button>,
张烨's avatar
张烨 committed
317 318 319 320 321 322 323
        ]}
      >
        {content}
      </Modal>
    </>
  );
};
赵吉's avatar
赵吉 committed
324

张烨's avatar
张烨 committed
325
export default ManagementDataBase;