소스 검색

调试接口

YaolongHan 4 년 전
부모
커밋
fda90e7e3f
23개의 변경된 파일17582개의 추가작업 그리고 2개의 파일을 삭제
  1. 23 0
      .gitignore
  2. 69 2
      README.md
  3. 16510 0
      package-lock.json
  4. 45 0
      package.json
  5. BIN
      public/favicon.ico
  6. 43 0
      public/index.html
  7. BIN
      public/logo192.png
  8. BIN
      public/logo512.png
  9. 25 0
      public/manifest.json
  10. BIN
      public/no-data.png
  11. 3 0
      public/robots.txt
  12. 3 0
      src/App.css
  13. 12 0
      src/App.js
  14. 8 0
      src/App.test.js
  15. 47 0
      src/api/dataLogApi.js
  16. 156 0
      src/api/httputils.js
  17. 13 0
      src/index.css
  18. 17 0
      src/index.js
  19. 81 0
      src/page-style/datalog.css
  20. 497 0
      src/page/datalog.js
  21. 13 0
      src/reportWebVitals.js
  22. 12 0
      src/setupProxy.js
  23. 5 0
      src/setupTests.js

+ 23 - 0
.gitignore

@@ -0,0 +1,23 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

+ 69 - 2
README.md

@@ -1,3 +1,70 @@
-# dataSyncLog
+# Getting Started with Create React App
 
-数据同步日志
+This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
+
+## Available Scripts
+
+In the project directory, you can run:
+
+### `npm start`
+
+Runs the app in the development mode.\
+Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+
+The page will reload if you make edits.\
+You will also see any lint errors in the console.
+
+### `npm test`
+
+Launches the test runner in the interactive watch mode.\
+See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
+
+### `npm run build`
+
+Builds the app for production to the `build` folder.\
+It correctly bundles React in production mode and optimizes the build for the best performance.
+
+The build is minified and the filenames include the hashes.\
+Your app is ready to be deployed!
+
+See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
+
+### `npm run eject`
+
+**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
+
+If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
+
+Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
+
+You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
+
+## Learn More
+
+You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
+
+To learn React, check out the [React documentation](https://reactjs.org/).
+
+### Code Splitting
+
+This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting)
+
+### Analyzing the Bundle Size
+
+This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size)
+
+### Making a Progressive Web App
+
+This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app)
+
+### Advanced Configuration
+
+This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration)
+
+### Deployment
+
+This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment)
+
+### `npm run build` fails to minify
+
+This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify)

파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
+ 16510 - 0
package-lock.json


+ 45 - 0
package.json

@@ -0,0 +1,45 @@
+{
+  "name": "data-sync-log",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "@testing-library/jest-dom": "^5.11.9",
+    "@testing-library/react": "^11.2.5",
+    "@testing-library/user-event": "^12.7.3",
+    "axios": "^0.21.1",
+    "element-react": "^1.4.34",
+    "element-theme-default": "^1.4.13",
+    "http-proxy-middleware": "^1.0.6",
+    "node-sass": "^5.0.0",
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1",
+    "react-hot-loader": "^4.5.3",
+    "react-scripts": "4.0.3",
+    "sass-loader": "^11.0.1",
+    "web-vitals": "^1.1.0"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

BIN
public/favicon.ico


+ 43 - 0
public/index.html

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta
+      name="description"
+      content="Web site created using create-react-app"
+    />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <!--
+      manifest.json provides metadata used when your web app is installed on a
+      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <title>React App</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  </body>
+</html>

BIN
public/logo192.png


BIN
public/logo512.png


+ 25 - 0
public/manifest.json

@@ -0,0 +1,25 @@
+{
+  "short_name": "React App",
+  "name": "Create React App Sample",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    },
+    {
+      "src": "logo512.png",
+      "type": "image/png",
+      "sizes": "512x512"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

BIN
public/no-data.png


+ 3 - 0
public/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

+ 3 - 0
src/App.css

@@ -0,0 +1,3 @@
+.App {
+
+}

+ 12 - 0
src/App.js

@@ -0,0 +1,12 @@
+import DataLog from "./page/datalog"
+import './App.css';
+
+function App() {
+  return (
+    <div className="App">
+      <DataLog></DataLog>
+    </div>
+  );
+}
+
+export default App;

+ 8 - 0
src/App.test.js

@@ -0,0 +1,8 @@
+import { render, screen } from '@testing-library/react';
+import App from './App';
+
+test('renders learn react link', () => {
+  render(<App />);
+  const linkElement = screen.getByText(/learn react/i);
+  expect(linkElement).toBeInTheDocument();
+});

+ 47 - 0
src/api/dataLogApi.js

@@ -0,0 +1,47 @@
+import httputils from './httputils'
+
+
+/**
+ * 查询项目id对应得集团id
+ * @param { 接口参数 } getParams
+ */
+export function queryGroupCode(getParams) {
+    return httputils.getJson('/datasyn/record/query/project', getParams)
+}
+
+/**
+ * 查询项目下得日志
+ * @param { 接口参数 } postParams
+ */
+export function queryTableList(postParams) {
+    return httputils.postJson('/datasyn/record/query', postParams)
+}
+
+/**
+ * 查询对象类型
+ * @param { 接口参数 } getParams
+ */
+export function queryobjType(getParams) {
+    return httputils.getJson('/datasyn/record/query/type', getParams)
+}
+
+/**
+ * 查询中台是否在线
+ * @param { 接口参数 } getParams
+ */
+export function queryIsOnline(getParams) {
+    return httputils.getJson('/datasyn/record/query/online', getParams)
+}
+
+/**
+ * 重新同步消息
+ */
+export function queryRecordSyn(postParams) {
+    return httputils.postJson('/datasyn/record/syn/data', postParams)
+}
+/**
+ * 更新日志信息
+ */
+export function queryRecordUpdata(postParams) {
+    return httputils.postJson('/datasyn/record/update', postParams)
+}

+ 156 - 0
src/api/httputils.js

@@ -0,0 +1,156 @@
+import axios from "axios"
+
+const CancelToken = axios.CancelToken
+let cancel
+
+// 创建axios实例
+const axiosservice = axios.create({
+    timeout: 30000, // 请求超时时间
+    retry: 4, //重新请求次数
+    retryDelay: 1000, //重新请求的间隔
+    credentials: true, // 接口每次请求会跨域携带cookie
+    cancelToken: new CancelToken(function executor(c) {
+        // executor 函数接收一个 cancel 函数作为参数
+        cancel = c
+    }),
+})
+
+axiosservice.interceptors.request.use(
+    (config) => {
+        config.withCredentials = true // 允许携带token ,这个是解决跨域产生的相关问题
+        // config.headers = {
+        //     projectId: store.state.projectId,//项目id
+        // }
+        return config
+    },
+    (error) => {
+        return Promise.reject(error)
+    }
+)
+
+axiosservice.interceptors.response.use(
+    function (res) {
+        const resp = res.data
+        return res
+    },
+    function (err) {
+        //Do something with response error
+        console.log("axios interceptors err = ", err)
+        return Promise.reject(err)
+    }
+)
+
+/* 下载方法 */
+function downFile(blob, fileName) {
+    // 非IE下载
+    if ("download" in document.createElement("a")) {
+        const link = document.createElement("a")
+        link.href = window.URL.createObjectURL(blob) // 创建下载的链接
+        link.download = fileName // 下载后文件名
+        link.style.display = "none"
+        document.body.appendChild(link)
+        link.click() // 点击下载
+        window.URL.revokeObjectURL(link.href) // 释放掉blob对象
+        document.body.removeChild(link) // 下载完成移除元素
+    } else {
+        // IE10+下载
+        window.navigator.msSaveBlob(blob, fileName)
+    }
+}
+
+export default {
+    //获取cookie
+    getCookie(name) {
+        let arr,
+            reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)")
+        if ((arr = document.cookie.match(reg))) {
+            return unescape(arr[2])
+        } else {
+            /* 如果没有参数,那么就获取本域下的所有cookie */
+            return document.cookie
+        }
+    },
+
+    async getJson(url, params) {
+        try {
+            const response = await axiosservice({
+                url,
+                params,
+                method: "get",
+            })
+            return response.data
+        } catch (err) {
+            throw err
+        }
+    },
+    async postJson(url, data) {
+        try {
+            const response = await axiosservice({
+                url,
+                data,
+                method: "post",
+            })
+            return response.data
+        } catch (err) {
+            throw err
+        }
+    },
+    async fetchJson(url, params, data) {
+        try {
+            const response = await axiosservice({
+                url,
+                params,
+                data,
+                method: "post",
+            })
+            return response
+        } catch (err) {
+            throw err
+        }
+    },
+    async postupload(url, data) {
+        try {
+            const response = await axiosservice({
+                url,
+                data,
+                method: "post",
+                headers: {
+                    "Content-Type": "multipart/form-data",
+                },
+            })
+            return response.data
+        } catch (err) {
+            throw err
+        }
+    },
+    download(url, requestData) {
+        // 响应类型:arraybuffer, blob
+        axiosservice
+            .post(url, requestData, { responseType: "blob" })
+            .then((resp) => {
+                const headers = resp.headers
+                const contentType = headers["content-type"]
+
+                console.log("响应头信息", headers)
+                if (!resp.data) {
+                    console.error("响应异常:", resp)
+                    return false
+                } else {
+                    console.log("下载文件:", resp)
+                    const blob = new Blob([resp.data], { type: contentType })
+
+                    const contentDisposition = resp.headers["content-disposition"]
+                    let fileName = "unknown"
+                    if (contentDisposition) {
+                        fileName = window.decodeURI(resp.headers["content-disposition"].split("=")[1])
+                    }
+                    console.log("文件名称:", fileName)
+                    downFile(blob, fileName)
+                }
+            })
+            .catch(function (error) {
+                console.log(error)
+            })
+    },
+    axios: axiosservice,
+}

+ 13 - 0
src/index.css

@@ -0,0 +1,13 @@
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+    monospace;
+}

+ 17 - 0
src/index.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import './index.css';
+import App from './App';
+import reportWebVitals from './reportWebVitals';
+import 'element-theme-default';
+ReactDOM.render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>,
+  document.getElementById('root')
+);
+
+// If you want to start measuring performance in your app, pass a function
+// to log results (for example: reportWebVitals(console.log))
+// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
+reportWebVitals();

+ 81 - 0
src/page-style/datalog.css

@@ -0,0 +1,81 @@
+ul,li,p{
+   list-style-type:none;
+   margin:0;
+   padding:0;
+}
+#DataLog{
+   padding: 20px 20px;
+   box-sizing: border-box
+
+}
+.pages{
+   float: right;
+   margin-top: 12px;
+   margin-right: 24px;
+}
+
+.top{
+   display: flex;
+   align-items: center;
+   justify-content: space-between;
+}
+
+.top .serve-updata{
+   display: flex;
+   align-items: center;
+   margin-right: 12px;
+}
+.top .serve-updata .state {
+   width: 20px;
+   height: 20px;
+   /* background: ; */
+   border-radius: 50% 50%;
+   margin-left: 6px;
+   margin-right: 6px;
+}
+.status-1 {
+ background: #19F704;
+ border-radius: 50% 50%;
+ width: 12px;
+ height: 12px;
+ display: inline-block;
+}
+.status-2 {
+   display: inline-block;
+   width: 12px;
+   height: 12px;
+   background: #4a4a4a;
+   border-radius: 50% 50%;
+}
+
+.project{
+   display: flex;
+   width: 300px;
+   align-items: center;
+   justify-content: space-between;
+   margin-bottom: 24px;
+}
+.project p {
+   width: 90px;
+}
+.screen{
+  margin-bottom: 12px;
+}
+.screen .screen-list {
+   display: flex;
+   align-items: center;
+   padding:12px
+}
+.screen ul li{
+   margin-left: 12px;
+}
+.infomations{
+   cursor: pointer;
+}
+.no-data{
+   width: 100%;
+   min-height: 600px;
+   display: flex;
+   justify-content: center;
+   align-items: center;
+}

+ 497 - 0
src/page/datalog.js

@@ -0,0 +1,497 @@
+import React, { Component } from 'react';
+import "./../page-style/datalog.css"
+import { Table, Button, Input, Select, Message, Loading, Pagination, Popover } from 'element-react';
+import { queryGroupCode, queryTableList, queryobjType, queryIsOnline, queryRecordSyn, queryRecordUpdata } from "./../api/dataLogApi"
+class DataLog extends Component {
+    constructor(props) {
+        super(props);
+        // 操作符类型
+        const tyleObj = {
+            create: '创建',
+            update: '修改',
+            delete: '删除',
+        }
+        this.state = {
+            projectId: 'Pj1101051029', // 项目id
+            groupCode: '',        //集团id
+            isShowTable: false, //是否显示table
+            columns: [
+                {
+                    label: "对象id",
+                    prop: "objId",
+                    width: 370
+                },
+                {
+                    label: "名称",
+                    prop: "name",
+                    width: 120,
+                    render: (obj, a) => {
+                        return obj.name ? obj.name : '--'
+                    }
+                },
+                {
+                    label: "本地名称",
+                    prop: "localName",
+                    width: 120,
+                    render: (obj) => {
+                        return obj.localName ? obj.localName : '--'
+                    }
+                },
+
+                {
+                    label: "本地编码",
+                    prop: "localId",
+                    width: 120,
+                    render: (obj) => {
+                        return obj.localId ? obj.localId : '--'
+                    }
+                },
+                {
+                    label: "对象类型",
+                    prop: "objName",
+                    render: (obj) => {
+                        return obj.objName ? obj.objName : '--'
+                    }
+                },
+                {
+                    label: "操作类型",
+                    prop: "type",
+                    render: (obj, a) => {
+                        return tyleObj[obj.type]
+                    }
+                },
+                {
+                    label: "对象分类",
+                    prop: "classCode",
+                    render: (obj) => {
+                        return obj.classCode && obj.classCodeName ? obj.classCodeName + '-' + obj.classCode : obj.classCode ? obj.classCode : '--'
+                    }
+                },
+                {
+                    label: "报错信息",
+                    prop: "error",
+                    render: (obj) => {
+                        return obj.error ? obj.error : '--'
+                    }
+                },
+                {
+                    label: "操作",
+                    prop: "zip",
+                    fixed: 'right',
+                    width: 160,
+                    render: (obj) => {
+                        return <span><Button type="text" onClick={this.queryRecordSyn.bind(this, obj)} size="small">重新同步</Button><Button type="text" size="small" onClick={this.hideMsg.bind(this, obj)} >隐藏</Button></span>
+                    }
+                }
+            ],
+            data: [],
+            objClassify: [],
+            //对象类型
+            objType: [{
+                value: 'building',
+                label: '建筑'
+            }, {
+                value: 'floor',
+                label: '楼层'
+            }, {
+                value: 'equipment',
+                label: '设备'
+            },
+            {
+                value: 'component',
+                label: '部件'
+            }, {
+                value: 'space',
+                label: '空间'
+            },
+            {
+                value: 'system',
+                label: '系统'
+            },
+            {
+                value: 'shaft',
+                label: '竖井'
+            }
+            ],
+            //操作下拉框
+            operation: [{
+                value: 'create',
+                label: '创建'
+            }, {
+                value: 'update',
+                label: '修改'
+            }, {
+                value: 'delete',
+                label: '删除'
+            }],
+            objClassifyValue: '', //对象分类状态
+            operationValue: '', //操作符状态
+            objTypeValue: '', //对象类型状态
+            loading: false,   //是否加载
+            pageObj: {
+                total: 0,  //总计
+                pageSize: 15,//每页数量
+                pageNumber: 1 //第几页
+            }
+        }
+    }
+
+    // 项目id回车请求接口
+    enter(e) {
+        if (e.keyCode === 13 || e.type === "blur") {
+            // 判断项目id是否为真
+            this.setState({
+                loading: true,
+                groupCode: ''
+            });
+            queryGroupCode({
+                projectId: this.state.projectId
+            }).then(res => {
+                if (res.content.length) {
+                    // 允许显示table
+                    this.setState({
+                        isShowTable: true,
+                        groupCode: res.content[0].groupCode
+                    })
+                    console.log('groupcode', this.state.groupCode)
+                    this.getTable();
+                    this.queryIsOnline();
+                } else {
+                    this.setState({
+                        isShowTable: false,
+                        projectId: '',
+                        loading: false,
+                    })
+                    Message({
+                        showClose: true,
+                        message: '项目id不存在!请重新输入',
+                        type: 'error',
+                        duration: 3000
+                    });
+                }
+            }).catch(() => {
+                this.setState({
+                    loading: false,
+                    isShowTable: false,
+                    projectId: ''
+                });
+                Message({
+                    showClose: true,
+                    message: '接口报错;请联系运维人员',
+                    type: 'error',
+                    duration: 3000
+                });
+            })
+        }
+    }
+    // 中台是否在线
+    queryIsOnline() {
+        const data = {
+            projectId: this.state.projectId,
+            groupCode: this.state.groupCode
+        }
+        this.setState({
+            loading: true
+        })
+        queryIsOnline(data).then(res => {
+            Message({
+                showClose: true,
+                message: res.message,
+                type: res.result,
+                duration: 3000
+            });
+            this.setState({
+                loading: false
+            })
+            if (res.result == "success") {
+                this.refs.status.style.background = '#19F704'
+            } else {
+                this.refs.status.style.background = '#4a4a4a'
+            }
+        }).catch(error => {
+            this.setState({
+                loading: false
+            })
+            Message({
+                showClose: true,
+                message: error,
+                type: 'error',
+                duration: 3000
+            });
+        })
+    }
+    // 获取对象类型下拉框
+    getObjTypeList() {
+        let data = {
+            projectId: this.state.projectId,
+            objType: this.state.objTypeValue
+        }
+        queryobjType(data).then(res => {
+            const objClassify = res.content.map((item) => {
+                return {
+                    value: item.code,
+                    label: item.name
+                }
+            });
+            this.setState({
+                objClassify: objClassify
+            })
+        })
+    }
+    // 对象类型发生变化
+    objTypeChange(val) {
+        this.state.objTypeValue = val;
+        if (val == "equipment" || val == "space" || val == "system") {
+            this.getObjTypeList()
+        } else {
+            this.setState({
+                objClassify: []
+            })
+        }
+        this.getTable()
+    }
+    // change变化触发获取tablelist
+    operationChange(val) {
+        this.state.operationValue = val;
+        this.getTable()
+    }
+    // 对象类型编号
+    objClassChange(val) {
+        this.state.objClassifyValue = val;
+        this.getTable()
+    }
+    // 请求table
+    getTable() {
+        this.setState({
+            loading: true
+        });
+        if (this.state.projectId) {
+            // 请求table以及中台状态接口
+            //对象类型
+            const objectType = this.state.objTypeValue ? `;objectType='${this.state.objTypeValue}'` : '';
+            // 对象分类
+            const classCodeName = this.state.objClassifyValue ? `;classCode='${this.state.objClassifyValue}'` : '';
+            // 操作符状态
+            const type = this.state.operationValue ? `;type='${this.state.operationValue}'` : '';
+
+            const postParam = {
+                pageNumber: this.state.pageObj.pageNumber,
+                pageSize: this.state.pageObj.pageSize,
+                filters: `projectId='${this.state.projectId}';sign=2${type}${classCodeName}${objectType}`
+            }
+
+            queryTableList(postParam).then(res => {
+                this.setState({
+                    isShowTable: true,
+                    data: res.content,
+                    loading: false,
+                    pageObj: Object.assign(this.state.pageObj, {
+                        total: res.total,
+                        pageNumber: res.pageNumber,
+                        pageSize: res.pageSize
+                    })
+                })
+            }).catch((res) => {
+                console.log('error', res)
+                this.setState({
+                    isShowTable: false,
+                    loading: false,
+                    data: []
+                })
+            })
+        } else {
+            this.state.isShowTable = false;
+        }
+    }
+    // 输入改变输入参数
+    onChange(key, value) {
+        this.state[key] = value;
+        this.forceUpdate();
+    }
+    // 隐藏该条信息
+    hideMsg(res) {
+        const data = {
+
+            content: [{
+                ...Object.assign(res, {
+                    sign: 3
+                })
+            }]
+        }
+        this.setState({
+            loading: true
+        });
+        queryRecordUpdata(data).then((res) => {
+            if (res.result == "success")
+                Message({
+                    showClose: true,
+                    message: '隐藏完成',
+                    type: 'success',
+                    duration: 3000
+                });
+            this.getTable()
+        }).catch(res => {
+            Message({
+                showClose: true,
+                message: '隐藏失败,请重新同步或联系管理人员!',
+                type: 'error',
+                duration: 3000
+            });
+            this.setState({
+                loading: false
+            });
+        })
+    }
+    // 同步信息
+    queryRecordSyn(res) {
+        const data = {
+            content: [{
+                ...res
+            }]
+        }
+        this.setState({
+            loading: true
+        });
+        queryRecordSyn(data).then((res) => {
+            if (res.result == "success")
+                Message({
+                    showClose: true,
+                    message: '同步完成!',
+                    type: 'success',
+                    duration: 3000
+                });
+            this.getTable()
+        }).catch(res => {
+            Message({
+                showClose: true,
+                message: '同步失败,请重新同步或联系管理人员!',
+                type: 'error',
+                duration: 3000
+            });
+            this.setState({
+                loading: false
+            });
+        })
+    }
+    // 改变pageSize
+    onSizeChange(val) {
+        this.setState({
+            pageObj: Object.assign(this.state.pageObj, {
+                pageSize: val
+            })
+        });
+        this.getTable()
+    }
+    // 改变当前页
+    onCurrentChange(val) {
+        this.setState({
+            pageObj: Object.assign(this.state.pageObj, {
+                pageNumber: val
+            })
+        });
+        this.getTable()
+    }
+    render() {
+        let showTable = null;
+        let showObjClass = null;
+        let CenterStatus = null; //数据中台状态
+        if (this.state.objClassify.length) {
+            showObjClass = <li>
+                <span>对象分类:</span>
+                <Select clearable={true} onChange={this.objClassChange.bind(this)} value={this.state.objClassifyValue} placeholder="请选择">
+                    {
+                        this.state.objClassify.map(el => {
+                            return <Select.Option key={el.value} label={el.label} value={el.value} />
+                        })
+                    }
+                </Select>
+            </li>
+        }
+        if (this.state.isShowTable) {
+            showTable = <div>
+                <div class="screen">
+                    <p>
+                        筛选条件
+                </p>
+                    <ul class="screen-list">
+                        <li>
+                            <span>操作符:</span>
+                            <Select clearable={true} onChange={this.operationChange.bind(this,)} value={this.state.operationValue} placeholder="请选择">
+                                {
+                                    this.state.operation.map(el => {
+                                        return <Select.Option key={el.value} label={el.label} value={el.value} />
+                                    })
+                                }
+                            </Select>
+                        </li>
+                        <li>
+                            <span>对象类型:</span>
+                            <Select clearable={true} onChange={this.objTypeChange.bind(this)} value={this.state.objTypeValue} placeholder="请选择">
+                                {
+                                    this.state.objType.map(el => {
+                                        return <Select.Option key={el.value} label={el.label} value={el.value} />
+                                    })
+                                }
+                            </Select>
+                        </li>
+                        {showObjClass}
+                    </ul>
+                </div>
+                <Loading loading={this.state.loading} text="拼命加载中">
+                    <Table
+                        style={{ width: '100%' }}
+                        columns={this.state.columns}
+                        data={this.state.data}
+                        stripe={true}
+                        maxHeight={600}
+                    />
+                </Loading>
+                {/* 分页 */}
+                <div class="pages">
+                    <Pagination layout="total, sizes, prev, pager, next, jumper" total={this.state.pageObj.total} pageSizes={[15, 30, 50, 100]} onSizeChange={this.onSizeChange.bind(this)} onCurrentChange={this.onCurrentChange.bind(this)} pageSize={this.state.pageObj.pageSize} currentPage={this.state.pageObj.pageNumber} />
+                </div>
+
+            </div>
+        } else {
+            showTable = <div class="no-data">
+                <img src='/no-data.png' />
+            </div>
+        }
+        // 是否显示中台状态
+        if (this.state.groupCode) {
+            CenterStatus = <div class="serve-updata">
+
+                <span>
+                    中台状态
+            </span>
+                <Popover placement="bottom" width="200" trigger="hover" content={(
+                    <div>
+                        <div>
+                            <span class="status-1"></span><span>:正常</span>
+                        </div>
+                        <div>
+                            <span class="status-2"></span><span>:异常</span>
+                        </div>
+                    </div>
+                )}>
+                    <i className="infomations el-icon-information"></i>
+                </Popover>:
+                <div ref="status" class="state" ></div>
+                <Button onClick={this.queryIsOnline.bind(this)} type="text">刷新</Button>
+            </div>
+        }
+        return <div id="DataLog">
+            <div class="top">
+                <h2>数据同步日志</h2>
+                {CenterStatus}
+            </div>
+            <div class="project">
+                <p>项目id:</p>
+                <Input onBlur={this.enter.bind(this)} onChange={this.onChange.bind(this, 'projectId')} onKeyUp={this.enter.bind(this)} value={this.state.projectId} placeholder="请输入项目id,回车键搜索" />
+            </div>
+            {showTable}
+        </div>
+    }
+}
+
+export default DataLog;

+ 13 - 0
src/reportWebVitals.js

@@ -0,0 +1,13 @@
+const reportWebVitals = onPerfEntry => {
+  if (onPerfEntry && onPerfEntry instanceof Function) {
+    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
+      getCLS(onPerfEntry);
+      getFID(onPerfEntry);
+      getFCP(onPerfEntry);
+      getLCP(onPerfEntry);
+      getTTFB(onPerfEntry);
+    });
+  }
+};
+
+export default reportWebVitals;

+ 12 - 0
src/setupProxy.js

@@ -0,0 +1,12 @@
+const { createProxyMiddleware } = require('http-proxy-middleware');
+
+module.exports = function (app) {
+    app.use(
+        '/datasyn',
+        createProxyMiddleware({
+            target: 'http://39.102.40.239:8080',
+            changeOrigin: true,
+            secure: false,
+        })
+    );
+};

+ 5 - 0
src/setupTests.js

@@ -0,0 +1,5 @@
+// jest-dom adds custom jest matchers for asserting on DOM nodes.
+// allows you to do things like:
+// expect(element).toHaveTextContent(/react/i)
+// learn more: https://github.com/testing-library/jest-dom
+import '@testing-library/jest-dom';