Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
hpc-team
strudelv2_spa
Commits
9b40ac54
Commit
9b40ac54
authored
Dec 11, 2019
by
Melvin Luong
Browse files
Updated job, joblist and launch-dialog formatting.
parent
2eb172fd
Pipeline
#8468
passed with stage
in 3 minutes and 33 seconds
Changes
6
Pipelines
1
Hide whitespace changes
Inline
Side-by-side
src/app/job/job.component.css
View file @
9b40ac54
.mat-button
,
.mat-list-item
{
font-family
:
Raleway
;
font-size
:
14px
;
}
\ No newline at end of file
src/app/job/job.component.html
View file @
9b40ac54
...
...
@@ -5,8 +5,13 @@
<div
fxFlex=
"10%"
>
{{ jobdata.state }}
</div>
<div
fxFlex=
"10%"
>
{{ jobdata.jobid }}
</div>
<div
*ngIf=
"jobdata.batch_host != 'localhost'"
fxFlex=
"10%"
>
{{ jobdata.batch_host }}
</div>
<div
fxFlex=
"20%"
fxLayout=
"column"
fxLayoutAlign=
"start start"
>
<div>
{{ cpu_resources }}
</div>
<div>
{{ mem_resources }}
</div>
</div>
<div
fxFlex=
"20%"
fxLayout=
"column"
>
<div>
{{ resources }}
</div>
<div>
{{ timeremaining }}
</div>
</div>
<div
fxFlex
></div>
...
...
src/app/job/job.component.ts
View file @
9b40ac54
...
...
@@ -17,6 +17,8 @@ export class JobComponent implements OnInit, OnDestroy {
public
available
:
Boolean
;
public
nocancel
:
Boolean
;
public
resources
:
string
;
public
cpu_resources
:
string
;
public
mem_resources
:
string
;
public
timeremaining
:
string
;
private
updatesub
:
Subscription
;
constructor
(
private
tesService
:
TesService
,
private
strudelAppsService
:
StrudelappsService
)
{
...
...
@@ -61,16 +63,18 @@ export class JobComponent implements OnInit, OnDestroy {
this
.
nocancel
=
true
;
}
this
.
resources
=
""
;
this
.
cpu_resources
=
""
;
this
.
mem_resources
=
""
;
if
(
this
.
jobdata
.
cpus
!=
undefined
)
{
this
.
resources
=
this
.
resources
+
"
CPUs:
"
+
this
.
jobdata
.
cpus
;
this
.
cpu_
resources
=
this
.
cpu_
resources
+
"
CPUs:
"
+
this
.
jobdata
.
cpus
;
}
if
(
this
.
jobdata
.
mem
!=
undefined
)
{
this
.
resources
=
this
.
resources
+
"
Mem:
"
+
this
.
jobdata
.
mem
;
this
.
mem_
resources
=
this
.
mem_
resources
+
"
Mem:
"
+
this
.
jobdata
.
mem
;
}
if
(
this
.
jobdata
.
endtime
!=
undefined
)
{
let
end
=
this
.
parseDate
(
this
.
jobdata
.
endtime
);
let
remaining
=
end
.
valueOf
()
-
Date
.
now
().
valueOf
();
this
.
timeremaining
=
"
Time remaining:
"
+
this
.
secondsToHms
(
remaining
/
1000
);
this
.
timeremaining
=
this
.
secondsToHms
(
remaining
/
1000
);
}
}
...
...
@@ -79,8 +83,8 @@ export class JobComponent implements OnInit, OnDestroy {
var
m
:
number
=
Math
.
floor
(
d
%
3600
/
60
);
var
s
:
number
=
Math
.
floor
(
d
%
3600
%
60
);
var
hDisplay
=
h
>
0
?
h
+
(
h
==
1
?
"
hour
,
"
:
"
hours
,
"
)
:
""
;
var
mDisplay
=
m
>
0
?
m
+
(
m
==
1
?
"
minute
,
"
:
"
minutes
"
)
:
""
;
var
hDisplay
=
h
>
0
?
h
+
(
h
==
1
?
"
hour
"
:
"
hours
"
)
:
""
;
var
mDisplay
=
m
>
0
?
m
+
(
m
==
1
?
"
minute
"
:
"
minutes
"
)
:
""
;
return
hDisplay
+
mDisplay
;
}
...
...
src/app/joblist/joblist.component.html
View file @
9b40ac54
...
...
@@ -16,16 +16,41 @@
<div
fxFlex=
"10%"
>
JobID
</div>
<div
fxFlex=
"10%"
>
Host
</div>
<div
fxFlex=
"20%"
fxLayout=
"column"
>
Resources
</div>
<div
fxFlex=
"20%"
fxLayout=
"column"
>
Time
</div>
<div
fxFlex
></div>
<div
fxFlex=
"15%"
fxLayout=
"row"
></div>
</div>
</mat-list-item>
<mat-divider
style=
"background-color: #a2bae1"
></mat-divider>
<div
*ngFor=
"let job of ((identitySubject | async).joblist | async) ; let lastItem = last"
>
<div
*ngIf=
"(appSubject | async).name == job.appname && job.state != 'Finished'"
>
<app-job
[jobdata]=
job
></app-job>
<mat-divider></mat-divider>
</div>
</div>
</mat-list>
<!--<button mat-button (click)="refreshJobs()" style="width: 100%; text-align: right">Refresh Job list</button>-->
</mat-expansion-panel>
</mat-accordion>
<mat-accordion
style=
"width: 100%"
[displayMode]=
"flat"
[togglePosition]=
"'after'"
>
<mat-expansion-panel
style=
"width: 100%"
[expanded]=
"true"
>
<mat-expansion-panel-header>
<mat-panel-title>
<span>
COMPLETED {{ getAppName() }}
</span>
</mat-panel-title>
</mat-expansion-panel-header>
<mat-list>
<mat-list-item>
<div
fxLayout=
"row"
fxLayoutAlign=
"space-between"
style=
"width: 100%"
>
<div
fxFlex=
"10%"
>
State
</div>
<div
fxFlex=
"10%"
>
JobID
</div>
<div
fxFlex=
"10%"
>
Host
</div>
<div
fxFlex=
"20%"
fxLayout=
"column"
>
Resources
</div>
<div
fxFlex
></div>
<div
fxFlex=
"15%"
fxLayout=
"row"
></div>
</div>
</mat-list-item>
<mat-divider
style=
"background-color: #a2bae1"
></mat-divider>
<div
*ngFor=
"let job of ((identitySubject | async).joblist | async) ; let lastItem = last"
>
<div
*ngIf=
"job.app !== null && (appSubject | async).name == job.app.name && job.state == 'Finished'"
>
...
...
src/app/launch-dialog/launch-dialog.component.css
View file @
9b40ac54
...
...
@@ -23,4 +23,9 @@
color
:
#1a50a5
;
font-family
:
Raleway
;
font-size
:
22px
;
}
.mat-list-item
button
{
width
:
200px
;
font-family
:
Raleway
;
}
\ No newline at end of file
src/app/launch-dialog/launch-dialog.component.html
View file @
9b40ac54
...
...
@@ -13,16 +13,18 @@
<iframe *ngIf="appconfigurl != null" [src]="batchcmdsafeurl" style="height: 1px; min-height: 0px; border: none" #batchbuilderiframe></iframe>-->
<div
*ngIf=
"appSubject | async as app"
style=
"width: 100%"
>
<iframe
*ngIf=
"app.startscript !== null"
[src]=
"batchcmdsafeurl"
style=
"border: none; border-style: none; border-width: 0px; width: 100%; overflow: auto"
[style.height]=
"height+'px'"
#batchbuilderiframe
></iframe>
<!--<div *ngIf="appconfigsafeurl !== null && configtoggle">
<iframe [src]="appconfigsafeurl" style="border: none; border-style: none; border-width: 0px; width: 100%" [style.height]="appconfigheight+'px'" #batchbuilderiframe></iframe>
</div>-->
<div
fxLayout=
"row"
fxLayoutAlign=
"start center"
>
<iframe
*ngIf=
"app.startscript !== null"
[src]=
"batchcmdsafeurl"
style=
"border: none; border-style: none; border-width: 0px; overflow: auto"
[style.height]=
"height+'px'"
#batchbuilderiframe
></iframe>
<!--<div *ngIf="appconfigsafeurl !== null && configtoggle">
<iframe [src]="appconfigsafeurl" style="border: none; border-style: none; border-width: 0px; width: 100%" [style.height]="appconfigheight+'px'" #batchbuilderiframe></iframe>
</div>-->
<div
*ngIf=
"appSubject | async as app"
>
<div
fxLayout=
"row"
fxLayoutAlign=
"space-around"
>
<button
*ngIf=
"appconfigsafeurl !== null"
mat-flat-button
(click)=
"configdialog()"
color=
"primary"
>
Configure
</button>
<button
*ngIf=
"app.startscript !== null"
mat-flat-button
(click)=
"launch()"
color=
"primary"
#launchbtn
[disabled]=
"!readyToLaunch"
>
Launch
</button>
<button
*ngFor=
"let action of app.appactions"
mat-flat-button
(click)=
"runaction(action)"
color=
"primary"
>
{{ action.name }}
</button>
<div
*ngIf=
"appSubject | async as app"
style=
"padding-left: 60px"
>
<mat-list>
<mat-list-item
*ngIf=
"appconfigsafeurl !== null"
><button
mat-flat-button
(click)=
"configdialog()"
color=
"primary"
>
Configure
</button></mat-list-item>
<mat-list-item
*ngIf=
"app.startscript !== null"
><button
mat-flat-button
(click)=
"launch()"
color=
"primary"
#launchbtn
[disabled]=
"!readyToLaunch"
>
Launch
</button></mat-list-item>
<mat-list-item
*ngFor=
"let action of app.appactions"
><button
mat-flat-button
(click)=
"runaction(action)"
color=
"primary"
>
{{ action.name }}
</button></mat-list-item>
</mat-list>
</div>
</div>
</div>
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment