forked from p15670423/monkey
Add print button, improve printability
This commit is contained in:
parent
e3bd980a12
commit
5690ddc5d7
|
@ -1,5 +1,5 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {Col} from 'react-bootstrap';
|
import {Button, Col} from 'react-bootstrap';
|
||||||
import BreachedServers from 'components/report-components/BreachedServers';
|
import BreachedServers from 'components/report-components/BreachedServers';
|
||||||
import ScannedServers from 'components/report-components/ScannedServers';
|
import ScannedServers from 'components/report-components/ScannedServers';
|
||||||
import {ReactiveGraph} from 'components/reactive-graph/ReactiveGraph';
|
import {ReactiveGraph} from 'components/reactive-graph/ReactiveGraph';
|
||||||
|
@ -343,8 +343,11 @@ class ReportPageComponent extends React.Component {
|
||||||
(
|
(
|
||||||
<div className="report-page">
|
<div className="report-page">
|
||||||
<div id="overview">
|
<div id="overview">
|
||||||
|
<div className="text-center no-print">
|
||||||
|
<Button bsSize="large" onClick={() => {print();}}><i className="glyphicon glyphicon-print"/> Print Report</Button>
|
||||||
|
</div>
|
||||||
<h1>
|
<h1>
|
||||||
Executive Summary
|
Overview
|
||||||
</h1>
|
</h1>
|
||||||
<p>
|
<p>
|
||||||
The first monkey run was started on <span
|
The first monkey run was started on <span
|
||||||
|
@ -430,10 +433,11 @@ class ReportPageComponent extends React.Component {
|
||||||
<br/>
|
<br/>
|
||||||
Detailed recommendations in the <a href="#recommendations">next part of the report</a>.
|
Detailed recommendations in the <a href="#recommendations">next part of the report</a>.
|
||||||
</p>
|
</p>
|
||||||
<div className="center-block text-center" style={{margin: '10px'}}>
|
<div className="text-center" style={{margin: '10px'}}>
|
||||||
<Line style={{width: '300px', marginRight: '5px'}} percent={exploitPercentage} strokeWidth="4" trailWidth="4"
|
<Line style={{width: '300px', marginRight: '5px'}} percent={exploitPercentage} strokeWidth="4"
|
||||||
|
trailWidth="4"
|
||||||
strokeColor="#d9534f" trailColor="#f0ad4e"/>
|
strokeColor="#d9534f" trailColor="#f0ad4e"/>
|
||||||
<b>{Math.round(exploitPercentage)}% of machines exploited</b>
|
<b>{Math.round(exploitPercentage)}% of scanned machines exploited</b>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<p>
|
<p>
|
||||||
|
|
|
@ -10,19 +10,29 @@ class CollapsibleWellComponent extends React.Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
let well =
|
||||||
|
(
|
||||||
|
<Well style={{margin: '10px'}}>
|
||||||
|
{this.props.children}
|
||||||
|
</Well>
|
||||||
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
|
<div className="no-print">
|
||||||
<a onClick={() => this.setState({open: !this.state.open})}>
|
<a onClick={() => this.setState({open: !this.state.open})}>
|
||||||
Read More...
|
Read More...
|
||||||
</a>
|
</a>
|
||||||
<Collapse in={this.state.open}>
|
<Collapse in={this.state.open}>
|
||||||
<div>
|
<div>
|
||||||
<Well style={{margin: '10px'}}>
|
{well}
|
||||||
{this.props.children}
|
|
||||||
</Well>
|
|
||||||
</div>
|
</div>
|
||||||
</Collapse>
|
</Collapse>
|
||||||
</div>
|
</div>
|
||||||
|
<div className="force-print" style={{display: 'none'}}>
|
||||||
|
{well}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -409,6 +409,14 @@ body {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.no-print {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.force-print {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
|
||||||
.pie-chart {
|
.pie-chart {
|
||||||
width: 100px;
|
width: 100px;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue