diff --git a/services/webapp/code/rosetta/core_app/templates/components/task.html b/services/webapp/code/rosetta/core_app/templates/components/task.html
index 1c48ca10bc6f6449a1c5e23175e776b899c118d1..572d5afbc62f8bcf5a5dc1334627cf23c563f2d8 100644
--- a/services/webapp/code/rosetta/core_app/templates/components/task.html
+++ b/services/webapp/code/rosetta/core_app/templates/components/task.html
@@ -1,9 +1,90 @@
+ {% if data.task %}
+ <div style="width:350px; float:left; border: #e0e0e0 solid 1px; margin:10px; background:#f8f8f8; margin-bottom:20px">
+ <div style="margin-top:5px; padding:10px; text-align:center; border-bottom: #f8f8f8 solid 1px; ">
+ <b>Summary</b>
+ </div>
+ {% else %}
+ <div style="width:350px; float:left; border: #e0e0e0 solid 1px; margin:10px; background:#f8f8f8; margin-bottom:20px">
+
+ <div style="margin-top:5px; padding:10px; text-align:center; border-bottom: #e0e0e0 solid 1px; ">
+ <a href="?uuid={{ task.uuid }}"><b>{{ task.name }}</b></a>
+ </div>
+
+
+ {% endif %}
+
+
+
+ <!-- <div style="background:{{task.color}}; height:24px;"></div> -->
+
+ <!-- <div style="background:{{ task.container.color }}; height:14px;"></div> -->
+
+ <!-- <div style="margin-bottom:15px; margin-top:0px">
+ <div style="background:{{task.container.color}}; height:14px; width:149px; float:left"></div>
+ <div style="background:{{task.computing.color}}; height:14px; width:149px; float:left"></div>
+ </div> -->
+
+
+ <div style="padding:10px;">
+ <!-- <b>Container:</b> {{ task.container.name }} <span style="font-size:14px; background-color:{{task.container.color}}"> </span> <br/>
+ <b>Computing:</b> {{ task.computing.name }} <span style="font-size:14px; background-color:{{task.computing.color}}"> </span><br/> -->
+
+ <b>Container:</b>
+ <a href="/containers/?uuid={{ task.container.uuid }}" style="color:{{task.container.color}}">{{ task.container.name }}</a>
+ {% if task.container.type == 'docker' %}<img src="/static/img/docker-logo.svg" style="height:18px; width:18px; margin-bottom:4px" />{% endif %}
+ {% if task.container.type == 'singularity' %}<img src="/static/img/singularity-logo.svg" style="height:18px; width:18px; margin-bottom:4px" />{% endif %}
+
+ <br/>
+
+ <b>Computing:</b> <a href="/computings/?uuid={{ task.computing.uuid }}">{{ task.computing.name }}</a>
+ <!-- <a href="/computings/?uuid={{ task.computing.uuid }}" no_style="color:{{task.computing.color}}"><i class="fa fa-external-link" ></i></a><br/> -->
+
+ <div style="margin-top:2px">
+ {% if task.status == "running" %}
+ <b>Status:</b> <font color="green">running</font>
+ {% else %}
+ <b>Status:</b> {{ task.status }}
+ {% endif %}
+ </div>
+ </div>
+
+ <div style="margin-bottom:10px; text-align:center; padding:5px">
+
+ <!-- Stop / Delete / Cancel -->
+ {% if task.status == "stopped" or task.status == "created" %}
+ <a href="?uuid={{task.uuid}}&action=delete&fromlist=True" class="btn btn-action">Delete</a>
+ {% else %}
+ <a href="?uuid={{task.uuid}}&action=stop&fromlist=True" class="btn btn-action">Stop</a>
+ {% endif %}
+
+ <!-- Connect -->
+ {% if task.port %}
+ {% if task.status == "running" %}
+ <a href="?uuid={{task.uuid}}&action=connect" class="btn btn-connect">Connect</a>
+ {% else %}
+ <a href="" class="btn btn-disabled">Connect</a>
+ {% endif %}
+ {% endif %}
+
+ <!-- View log -->
+ {% if task.status == "created" %}
+ <a href="" class="btn btn-disabled">Logs</a>
+ {% else %}
+ <a href="/task_log/?uuid={{task.uuid}}&action=viewlog" class="btn btn-action">Logs</a>
+ {% endif %}
+ </div>
+
+
+
+ </div>
+
+
{% if data.task %}
- <table class="dashboard">
+ <table class="dashboard" style="margin:10px">
<!-- <tr>
<td colspan="2">
@@ -16,9 +97,13 @@
-->
<tr>
+ <td colspan="2" align="center" style="padding:15px"><b>Details</b></td>
+ </tr>
+
+ <!-- <tr>
<td><b>Name</b></td>
<td>{{ task.name }}</td>
- </tr>
+ </tr> -->
<tr>
<td><b>ID</b></td>
@@ -26,33 +111,27 @@
</tr>
<tr>
- <td><b>Container</b></td>
+ <td><b>Image</b></td>
<td><a href="/containers/?uuid={{ task.container.uuid }}">{{ task.container.image }}</a></td>
</tr>
- <tr>
+ <!-- <tr>
<td><b>Status</b></td>
<td>{{ task.status }}</td>
- </tr>
+ </tr> -->
<tr>
<td><b>Created at</b></td>
<td>{{ task.created }}</td>
</tr>
-
- <tr>
- <td><b>Running on</b></td>
- <td>{{ task.computing }}</td>
- </tr>
-
<tr>
<td><b>Extra binds</b></td>
<td>{{ task.extra_binds }}</td>
</tr>
<tr>
- <td><b>IP</b></td>
+ <td><b>Host</b></td>
<td>{{ task.ip }}</td>
</tr>
@@ -62,29 +141,26 @@
</tr>
<tr>
- <td><b>Task tunnel port</b></td>
+ <td><b>Tunnel port</b></td>
<td>{{ task.tunnel_port }}</td>
</tr>
{% if task.auth_pass %}
<tr>
- <td><b>Task Auth pass</b></td>
+ <td><b>Auth pass</b></td>
<td>******</td>
</tr>
{% endif %}
-
-
-
- <tr>
+ <!-- <tr>
<td><b>Operations</b></td>
<td>
{% if task.status == "running" %}
<a href="?uuid={{task.uuid}}&action=stop&details={{details}}">Stop</a> |
- {% else %}
+ {% else %}-->
<!-- <a href=?uuid={{task.uuid}}&action=start>Start</a> | -->
- <font color="#c0c0c0">Stop</font> |
+ <!-- <font color="#c0c0c0">Stop</font> |
{% endif %}
<a href="?uuid={{task.uuid}}&action=delete&details=False">Delete</a>
@@ -102,83 +178,29 @@
| <a href="/task_log/?uuid={{task.uuid}}&action=viewlog">View Log</a>
{% endif %}
-
</td>
</tr>
+ -->
</table>
-
- {% else %}
- <div style="width:350px; float:left; border: #e0e0e0 solid 1px; margin:10px; background:#f8f8f8; margin-bottom:20px">
-
-
- <!-- <div style="background:{{task.color}}; height:24px;"></div> -->
-
- <div style="margin-top:5px; padding:10px; text-align:center; border-bottom: #e0e0e0 solid 1px; ">
- <a href="?uuid={{ task.uuid }}"><b>{{ task.name }}</b></a>
- </div>
- <!-- <div style="background:{{ task.container.color }}; height:14px;"></div> -->
-
- <!-- <div style="margin-bottom:15px; margin-top:0px">
- <div style="background:{{task.container.color}}; height:14px; width:149px; float:left"></div>
- <div style="background:{{task.computing.color}}; height:14px; width:149px; float:left"></div>
- </div> -->
-
- <div style="padding:10px;">
- <!-- <b>Container:</b> {{ task.container.name }} <span style="font-size:14px; background-color:{{task.container.color}}"> </span> <br/>
- <b>Computing:</b> {{ task.computing.name }} <span style="font-size:14px; background-color:{{task.computing.color}}"> </span><br/> -->
- <b>Container:</b>
- <a href="/containers/?uuid={{ task.container.uuid }}" style="color:{{task.container.color}}">{{ task.container.name }}</a>
- {% if task.container.type == 'docker' %}<img src="/static/img/docker-logo.svg" style="height:18px; width:18px; margin-bottom:4px" />{% endif %}
- {% if task.container.type == 'singularity' %}<img src="/static/img/singularity-logo.svg" style="height:18px; width:18px; margin-bottom:4px" />{% endif %}
- <br/>
-
- <b>Computing:</b> <a href="/computings/?uuid={{ task.computing.uuid }}">{{ task.computing.name }}</a>
- <!-- <a href="/computings/?uuid={{ task.computing.uuid }}" no_style="color:{{task.computing.color}}"><i class="fa fa-external-link" ></i></a><br/> -->
-
- <div style="margin-top:2px">
- {% if task.status == "running" %}
- <b>Status:</b> <font color="green">running</font>
- {% else %}
- <b>Status:</b> {{ task.status }}
- {% endif %}
- </div>
- </div>
-
- <div style="margin-bottom:10px; text-align:center; padding:5px">
-
- <!-- Stop / Delete / Cancel -->
- {% if task.status == "stopped" or task.status == "created" %}
- <a href="?uuid={{task.uuid}}&action=delete&fromlist=True" class="btn btn-action">Delete</a>
- {% else %}
- <a href="?uuid={{task.uuid}}&action=stop&fromlist=True" class="btn btn-action">Stop</a>
- {% endif %}
-
- <!-- Connect -->
- {% if task.port %}
- {% if task.status == "running" %}
- <a href="?uuid={{task.uuid}}&action=connect" class="btn btn-connect">Connect</a>
- {% else %}
- <a href="" class="btn btn-disabled">Connect</a>
- {% endif %}
- {% endif %}
-
- <!-- View log -->
- {% if task.status == "created" %}
- <a href="" class="btn btn-disabled">Logs</a>
- {% else %}
- <a href="/task_log/?uuid={{task.uuid}}&action=viewlog" class="btn btn-action">Logs</a>
- {% endif %}
- </div>
-
-
-
- </div>
+
+
+
+
+
+
+
+
+
+
+
+
+
{% endif %}
\ No newline at end of file