diff --git a/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.css b/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.css
index 6b5f5f66..7c7bd6f9 100644
--- a/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.css
+++ b/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.css
@@ -4,8 +4,8 @@
.Status__readiness {
display: flex;
align-items: center;
- width: 579px;
- height: 31px;
+ width: 600px;
+ height: 300px;
background: #FFFFFF;
border: 1px solid #CCCCCC;
box-sizing: border-box;
@@ -18,8 +18,21 @@
padding-left: 9px;
}
+.runtime-chart {
+ width: 800px;
+}
+
.Status__finished-scenario {
}
.Status__finished-scenario-logfile-link {
+ background-color: #007AC9;
+ display: inline;
+ color: white;
+ width: 8rem;
+}
+
+.Status__finished-scenario-logfile-link:hover {
+ background-color: #0068ab !important;
+ color: white !important;
}
diff --git a/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.jsx b/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.jsx
index 82563666..6f484a53 100644
--- a/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.jsx
+++ b/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.jsx
@@ -1,51 +1,102 @@
import React from 'react';
+import { Chart as ChartJS, LinearScale, LineElement, PointElement, CategoryScale, Tooltip, Legend, Title } from "chart.js";
+import { Line } from 'react-chartjs-2';
+import dayjs from 'dayjs';
+const { shell } = require('electron');
+var duration = require('dayjs/plugin/duration');
+var relativeTime = require('dayjs/plugin/relativeTime');
+dayjs.extend(duration);
+dayjs.extend(relativeTime);
+ChartJS.register(LinearScale, LineElement, CategoryScale, PointElement, Tooltip, Legend, Title);
-const RunStatus = ({isScenarioRunning, statusIterationsTotal, statusIterationsCompleted, statusReadyScenariosLogfiles}) => {
+
+const RunStatus = ({isScenarioRunning, statusIterationsTotal, statusIterationsCompleted, statusReadyScenariosLogfiles, statusRunStartTime, statusRunFinishTime, statusState, demandConvergenceArray }) => {
+
+ const graphConfig = {
+ options: {
+ plugins: {
+ title: {
+ display: true,
+ text: 'Convergence',
+ align: 'Center'
+ },
+ legend: {
+ display: false
+ }
+ },
+ scales: {
+ y: {
+ title: {
+ display: true,
+ text: 'Rel_Gap [ % ]',
+ font: {
+ size: 16
+ }
+ }
+ },
+ x: {
+ title: {
+ display: true,
+ text: 'Iteration [ # ]',
+ font: {
+ size: 16
+ }
+ }
+ }
+ }
+ },
+ }
+
+ const graphData = {
+ labels: demandConvergenceArray.map(listing => listing.iteration),
+ datasets: [{
+ label: 'Rel_Gap (%)',
+ data: demandConvergenceArray.map(listing => (listing.value * 100).toFixed(4)),
+ backgroundColor: '#007AC9',
+ borderColor: '#007AC9'
+ }
+ ],
+ }
return (
- {isScenarioRunning ?
- statusIterationsTotal ?
+ {
+ (statusState === SCENARIO_STATUS_STATE.RUNNING || statusState === SCENARIO_STATUS_STATE.FINISHED) &&
-
- Valmiina
-
-
{statusIterationsCompleted}
+
+
- /
-
- {statusIterationsTotal}
-
- ({Math.round(statusIterationsCompleted / statusIterationsTotal * 100)}%)
- :
-
Setting up python-shell . . .
- :
- ""
+ }
+ { (statusState === SCENARIO_STATUS_STATE.PREPARING || statusState === SCENARIO_STATUS_STATE.STARTING) &&
+ (
+
+
Starting python shell...
+
+ )
}
{statusReadyScenariosLogfiles.map((readyScenario) => {
- return
- {readyScenario.name} valmis
-
-
- lokit
-
-
+ return (
+
+
+ {readyScenario.name} valmis
+
+
+
+
+
+ Ajoaika: { dayjs.duration(dayjs(statusRunFinishTime).diff(dayjs(statusRunStartTime))).format('HH[h]:mm[m]:ss[s]') }
+
+
)
})}
);
diff --git a/src/renderer/components/HelmetProject/Runtime/Runtime.jsx b/src/renderer/components/HelmetProject/Runtime/Runtime.jsx
index 2178b181..d7dd2a42 100644
--- a/src/renderer/components/HelmetProject/Runtime/Runtime.jsx
+++ b/src/renderer/components/HelmetProject/Runtime/Runtime.jsx
@@ -6,7 +6,7 @@ const Runtime = ({
reloadScenarios,
handleClickScenarioToActive, handleClickNewScenario,
statusIterationsTotal, statusIterationsCompleted, statusReadyScenariosLogfiles,
- handleClickStartStop, duplicateScenario
+ handleClickStartStop, statusRunStartTime, statusRunFinishTime, statusState, demandConvergenceArray, duplicateScenario
}) => {
return (
@@ -94,6 +94,10 @@ const Runtime = ({
statusIterationsTotal={statusIterationsTotal}
statusIterationsCompleted={statusIterationsCompleted}
statusReadyScenariosLogfiles={statusReadyScenariosLogfiles}
+ statusRunStartTime={statusRunStartTime}
+ statusRunFinishTime={statusRunFinishTime}
+ statusState={statusState}
+ demandConvergenceArray={demandConvergenceArray}
/>