diff options
| -rw-r--r-- | .gitignore | 1 | ||||
| -rw-r--r-- | ui-react/src/LoopUI.js | 2 | ||||
| -rw-r--r-- | ui-react/src/components/loop_viewer/logs/LoopLogs.js | 95 |
3 files changed, 96 insertions, 2 deletions
diff --git a/.gitignore b/.gitignore index b6d49c75b..fbdcf4af5 100644 --- a/.gitignore +++ b/.gitignore @@ -8,7 +8,6 @@ target ui-react/node_modules ui-react/build **/package-lock.json -**/logs/ **/.evosuite/ **/debug-logs/ *.log diff --git a/ui-react/src/LoopUI.js b/ui-react/src/LoopUI.js index dd4923e3e..1f79d39eb 100644 --- a/ui-react/src/LoopUI.js +++ b/ui-react/src/LoopUI.js @@ -147,7 +147,7 @@ export default class LoopUI extends React.Component { return ( <LoopViewBodyDivStyled> <LoopSvg loopCache={this.state.loopCache} /> - <LoopLogs /> + <LoopLogs loopCache={this.state.loopCache} /> <LoopStatus /> </LoopViewBodyDivStyled> ); diff --git a/ui-react/src/components/loop_viewer/logs/LoopLogs.js b/ui-react/src/components/loop_viewer/logs/LoopLogs.js new file mode 100644 index 000000000..d7d983d6f --- /dev/null +++ b/ui-react/src/components/loop_viewer/logs/LoopLogs.js @@ -0,0 +1,95 @@ +/*- + * ============LICENSE_START======================================================= + * ONAP CLAMP + * ================================================================================ + * Copyright (C) 2019 AT&T Intellectual Property. All rights + * reserved. + * ================================================================================ + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * ============LICENSE_END============================================ + * =================================================================== + * + */ +import React from 'react'; +import Table from 'react-bootstrap/Table'; +import LoopCache from '../../../api/LoopCache'; +import styled from 'styled-components'; + +const TableRow = ({ logRow }) => ( + <tr> + <td>{logRow.logInstant}</td> + <td>{logRow.logType}</td> + <td>{logRow.logComponent}</td> + <td>{logRow.message}</td> + </tr> + +) + +const LoopLogsHeaderDivStyled = styled.div` + background-color: ${props => props.theme.loopViewerHeaderBackgroundColor}; + padding: 10px 10px; + color: ${props => props.theme.loopViewerHeaderFontColor}; + overflow: auto; +` + +export default class LoopLogs extends React.Component { + + state = { + loopCache: new LoopCache({}), + } + constructor(props) { + super(props); + this.renderLogs = this.renderLogs.bind(this); + this.state.loopCache=props.loopCache; + } + + shouldComponentUpdate(nextProps, nextState) { + return this.state.loopCache !== nextState.loopCache; + } + + componentWillReceiveProps(newProps) { + this.setState({ + loopCache: newProps.loopCache, + }); + } + + renderLogs() { + if (this.state.loopCache.getLoopLogsArray() != null) { + return ( + this.state.loopCache.getLoopLogsArray().map(row => <TableRow logRow={row} />) + ) + } + } + + render() { + return ( + <LoopLogsHeaderDivStyled> + <label>Loop Logs</label> + <Table striped hover bordeless variant responsive> + <thead> + <tr> + <th><span align="left">Date</span></th> + <th><span align="left">Type</span></th> + <th><span align="left">Component</span></th> + <th><span align="right">Log</span></th> + </tr> + </thead> + <tbody> + {this.renderLogs()} + </tbody> + </Table> + </LoopLogsHeaderDivStyled> + + ); + } +} |