From cbf48935568b188e4d56c1d9dd8ec65237590e03 Mon Sep 17 00:00:00 2001
From: Kai Reinhard <K.Reinhard@micromata.de>
Date: Sat, 05 Jan 2019 09:03:02 +0000
Subject: [PATCH] Job monitor...
---
borgbutler-webapp/src/components/views/jobs/JobMonitorPanel.jsx | 14 +++++-
borgbutler-webapp/src/components/views/jobs/Job.jsx | 47 +++++++++++++++++------
borgbutler-server/src/main/java/de/micromata/borgbutler/server/rest/JobsRest.java | 2
borgbutler-webapp/src/components/views/jobs/JobQueue.jsx | 2
4 files changed, 47 insertions(+), 18 deletions(-)
diff --git a/borgbutler-server/src/main/java/de/micromata/borgbutler/server/rest/JobsRest.java b/borgbutler-server/src/main/java/de/micromata/borgbutler/server/rest/JobsRest.java
index 1a10f17..3555258 100644
--- a/borgbutler-server/src/main/java/de/micromata/borgbutler/server/rest/JobsRest.java
+++ b/borgbutler-server/src/main/java/de/micromata/borgbutler/server/rest/JobsRest.java
@@ -109,7 +109,7 @@
.setProgressInfo(msg)
.setDescription(description)
.setStatus(AbstractJob.Status.QUEUED)
- .setCommandLineAsString(description);
+ .setCommandLineAsString("borg info --json --log-json --progress ssh://...:23/./backups/my-computer::my-computer-2018-12-05T23:10:33");
job.buildProgressText();
if (message != null) {
job.setStatus(AbstractJob.Status.RUNNING);
diff --git a/borgbutler-webapp/src/components/views/jobs/Job.jsx b/borgbutler-webapp/src/components/views/jobs/Job.jsx
index 37b55ac..5fac658 100644
--- a/borgbutler-webapp/src/components/views/jobs/Job.jsx
+++ b/borgbutler-webapp/src/components/views/jobs/Job.jsx
@@ -1,20 +1,41 @@
import React from 'react';
-import {Progress} from 'reactstrap';
+import {Button, Card, CardBody, Collapse, Progress} from 'reactstrap';
import {IconCancelJob} from '../../general/IconComponents'
-function Job({job}) {
- let content = undefined;
- if (job.status === 'RUNNING') {
- content = <Progress animated color={'success'} value="100">{job.progressText}</Progress>;
- } else {
- content = <Progress color={'info'} value="100">{job.status}</Progress>
+class Job extends React.Component {
+ constructor(props) {
+ super(props);
+ this.toggle = this.toggle.bind(this);
+ this.state = {collapse: false};
}
- return (
- <div>
- <div>{job.description}</div>
- <div>{content}<IconCancelJob /></div>
- </div>
- )
+
+ toggle() {
+ this.setState({collapse: !this.state.collapse});
+ }
+
+ render() {
+ let content = undefined;
+ let job = this.props.job;
+ if (job.status === 'RUNNING') {
+ content = <Progress animated color={'success'} value="100">{job.progressText}</Progress>;
+ } else {
+ content = <Progress color={'info'} value="100">{job.status}</Progress>
+ }
+ return (
+ <div>
+ <Button color="link" onClick={this.toggle}>{job.description}</Button>
+ <div>{content}<IconCancelJob/></div>
+ <Collapse isOpen={this.state.collapse}>
+ <Card>
+ <CardBody>
+ <table><tr><th>Status</th><td>{job.status}</td></tr>
+ <tr><th>Command line</th><td>{job.commandLineAsString}</td></tr></table>
+ </CardBody>
+ </Card>
+ </Collapse>
+ </div>
+ )
+ }
}
export default Job;
diff --git a/borgbutler-webapp/src/components/views/jobs/JobMonitorPanel.jsx b/borgbutler-webapp/src/components/views/jobs/JobMonitorPanel.jsx
index 4726660..9ba856e 100644
--- a/borgbutler-webapp/src/components/views/jobs/JobMonitorPanel.jsx
+++ b/borgbutler-webapp/src/components/views/jobs/JobMonitorPanel.jsx
@@ -89,9 +89,17 @@
<h2>To-do</h2>
Zum Testen den Button "Test-Mode" drücken.
<ol>
- <li>Kein Geflackere: Nach einem fetch (alle 2 Sekunden) wird der das ganze DOM neu gerendert, obwohl sich eigentlich nix
- geändert hat. Schön wäre, wenn sich nur die Komponenten neu rendern, die auch in den REST-Daten von fetch sich geändert haben.</li>
- <li>Toggle-Status z. B. von My Computer merken (zum Reproduzieren: Klick auf "My Computer"..</li>
+ <li>Kein Geflackere: Nach einem fetch (alle 2 Sekunden) wird der das ganze DOM neu gerendert,
+ obwohl sich eigentlich nix
+ geändert hat. Schön wäre, wenn sich nur die Komponenten neu rendern, die auch in den
+ REST-Daten von fetch sich geändert haben.
+ </li>
+ <li>Toggle-Status z. B. von My Computer und von einem einzelnen Job merken (zum Reproduzieren:
+ Klick auf "My Computer" bzw. "Loading info of ...".
+ <br/>Es wäre
+ auch OK, wenn genau nur ein Job aufgeklappt wäre. Auf das Auf- und Zuklappen von "My
+ Computer" kann ich verzichten, wenn es einfacher werden würde.
+ </li>
<li>Cancel-Button soll rechts neben die Progressbar.</li>
</ol>
</code></React.Fragment>
diff --git a/borgbutler-webapp/src/components/views/jobs/JobQueue.jsx b/borgbutler-webapp/src/components/views/jobs/JobQueue.jsx
index 58e7711..a847c3a 100644
--- a/borgbutler-webapp/src/components/views/jobs/JobQueue.jsx
+++ b/borgbutler-webapp/src/components/views/jobs/JobQueue.jsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { Collapse, Button, CardBody, Card } from 'reactstrap';
+import {Button, Card, CardBody, Collapse} from 'reactstrap';
import Job from "./Job";
class JobQueue extends React.Component {
--
Gitblit v1.10.0