Commit 0d3803c1 authored by Maxym Borodenko's avatar Maxym Borodenko Committed by Matija Obreza
Browse files

Copy KPI observations to clipboard

parent a8e4c839
......@@ -37,7 +37,8 @@
"unpublish": "Unpublish",
"view": "View",
"write": "Write",
"acceptAndPublish": "ACCEPT AND PUBLISH"
"acceptAndPublish": "ACCEPT AND PUBLISH",
"copyToClipboard": "Copy to clipboard"
},
"csv": {
"autoDetect": "Auto-detect ",
......
......@@ -21,6 +21,7 @@ import Grid from '@material-ui/core/Grid/Grid';
import Button from '@material-ui/core/Button';
import RunTable from './c/RunTable';
import ExecutionDialog from './ExecutionDialog';
import FileCopyIcon from '@material-ui/icons/FileCopy';
// import { parse } from 'query-string';
......@@ -60,6 +61,22 @@ class ExecutionDisplay extends React.Component<IExecutionProps, any> {
console.log(`Loading execution ${shortName}`);
getExecution(shortName);
}
// Bind event listener
document.addEventListener('copy', this.copyRunTable, false);
}
// Unbind event listener
public componentWillUnmount() {
document.removeEventListener('copy', this.copyRunTable, false);
}
private copyRunTable = (e) => {
if (e.currentTarget.activeElement.id === 'copyBtn') {
e.clipboardData.setData('text/html', document.getElementById('runTable').innerHTML);
console.log('Table copied to clipboard.');
e.preventDefault();
}
}
private execute = () => {
......@@ -151,7 +168,14 @@ class ExecutionDisplay extends React.Component<IExecutionProps, any> {
</Grid>
<Grid item sm={ 12 } md={ 6 }>
<PageSection title={ currentRun === null ? t('kpi.admin.p.executionDisplay.lastRun') : <span>{ t('kpi.admin.p.executionDisplay.runFrom') }<PrettyDate value={ currentRun.timestamp }/></span> }>
<PageSection title={ currentRun === null ? t('kpi.admin.p.executionDisplay.lastRun') : <span>{ t('kpi.admin.p.executionDisplay.runFrom') }<PrettyDate value={ currentRun.timestamp }/></span> }
action={
<Button id="copyBtn" onClick={ () => document.execCommand('copy') }>
{ t('common:action.copyToClipboard') }&nbsp;&nbsp;
<FileCopyIcon fontSize="small"/>
</Button>
}
>
<RunTable execution={ execution } runInfo={ currentRun || lastRun } />
</PageSection>
</Grid>
......
......@@ -42,7 +42,7 @@ class RunTable extends React.Component<any> {
public render() {
const {execution, runInfo, classes} = this.props;
return (
<table className={ classes.root }>
<table className={ classes.root } id="runTable">
{ runInfo &&
<thead className={ `${classes.header} back-green` }>
<tr>
......
......@@ -49,6 +49,10 @@ const styles = (theme) => ({
fontSize: '1.3rem',
// color: 'Red',
},
sectionAction: {
margin: 0,
alignSelf: 'center' as 'center',
},
});
interface ILayoutProps extends React.Props<any> {
......@@ -84,9 +88,9 @@ const Section1 = ({classes, className = '', title, children = null}) => children
</Card>
);
const Section2 = ({classes, title, children = null}) => children && (
const Section2 = ({classes, title, action = null, children = null}) => children && (
<Card className={ classes.section }>
<CardHeader classes={ { title: classes.sectionTitle } } title={ title } />
<CardHeader classes={ { title: classes.sectionTitle, action: classes.sectionAction } } title={ title } action={ action } />
<CardContent>{ children }</CardContent>
</Card>
);
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment