This is an automated email from the ASF dual-hosted git repository.
lfrolov pushed a commit to branch DATALAB-2637
in repository https://gitbox.apache.org/repos/asf/incubator-datalab.git
The following commit(s) were added to refs/heads/DATALAB-2637 by this push:
new 53715f7 [DATALAB-2637] fixed spot instance bid checkbox
new 4899cc4 Merge pull request #1386 from
GennadiyShpak/fix/DATALAB-2637/spot-instance-checkbox
53715f7 is described below
commit 53715f794bd447081ef8071c801f6b63acf3df0a
Author: Hennadii_Shpak <[email protected]>
AuthorDate: Mon Jan 10 13:10:49 2022 +0200
[DATALAB-2637] fixed spot instance bid checkbox
---
...utational-resource-create-dialog.component.html | 124 ++++++++++-----------
...mputational-resource-create-dialog.component.ts | 22 ++--
.../computational-resource-create.model.ts | 4 +-
3 files changed, 79 insertions(+), 71 deletions(-)
diff --git
a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.html
b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.html
index 5e9095c..5599234 100644
---
a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.html
+++
b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.html
@@ -31,14 +31,14 @@
<label class="label">Select cluster type</label>
<div class="control selector-wrapper">
<mat-form-field>
- <mat-select
- formControlName="template_name"
+ <mat-select
+ formControlName="template_name"
disableOptionCentering
panelClass="scrolling"
placeholder="Select cluster type"
>
- <mat-option
- *ngFor="let type of clusterTypes"
+ <mat-option
+ *ngFor="let type of clusterTypes"
[value]="type.template_name"
(click)="selectImage(type)"
>
@@ -60,12 +60,12 @@
<div class="control">
<input
[class.danger_field]="!resourceForm?.controls['cluster_alias_name'].valid
- && resourceForm?.controls['cluster_alias_name'].dirty
+ && resourceForm?.controls['cluster_alias_name'].dirty
&&
resourceForm?.controls['cluster_alias_name'].hasError('duplication')"
- type="text"
- class="form-control"
+ type="text"
+ class="form-control"
placeholder="Enter cluster alias"
- formControlName="cluster_alias_name"
+ formControlName="cluster_alias_name"
/>
<span class="error"
*ngIf="resourceForm?.controls['cluster_alias_name'].hasError('user-duplication')">
You have cluster with this name in current project.
@@ -73,9 +73,9 @@
<span class="error"
*ngIf="resourceForm?.controls['cluster_alias_name'].hasError('other-user-duplication')">
Other user has cluster with this name in current project.
</span>
- <span
- class="error"
-
*ngIf="resourceForm?.controls['cluster_alias_name'].hasError('maxlength')
+ <span
+ class="error"
+
*ngIf="resourceForm?.controls['cluster_alias_name'].hasError('maxlength')
&&
!resourceForm?.controls['cluster_alias_name'].hasError('pattern')"
>
Cluster name cannot be longer than {{maxClusterNameLength}}
characters.
@@ -93,7 +93,7 @@
<mat-form-field>
<mat-label>Select instance size</mat-label>
<mat-select panelClass="scrolling"
formControlName="shape_master" disableOptionCentering>
- <mat-optgroup
+ <mat-optgroup
*ngFor="let item of
(selectedImage.computation_resources_shapes | keys)"
[label]="item.key | underscoreless"
>
@@ -114,12 +114,12 @@
<div class="control-group" *ngIf="selectedImage?.image">
<label class="label">Total instance number</label>
<div class="control">
- <input
- type="number"
- class="form-control"
- min="{{minInstanceNumber}}"
+ <input
+ type="number"
+ class="form-control"
+ min="{{minInstanceNumber}}"
max="{{maxInstanceNumber}}"
- formControlName="instance_number"
(keypress)="CheckUtils.isNumberKey($event)"
+ formControlName="instance_number"
(keypress)="CheckUtils.isNumberKey($event)"
/>
<span class="error"
*ngIf="!resourceForm?.controls.instance_number.valid">
<span>Only integer values greater than or equal to {{
minInstanceNumber }} and less than
@@ -153,13 +153,13 @@
<mat-form-field>
<mat-label>Select instance size</mat-label>
<mat-select panelClass="scrolling"
formControlName="shape_slave" disableOptionCentering>
- <mat-optgroup
+ <mat-optgroup
*ngFor="let item of
(selectedImage.computation_resources_shapes | keys)"
[label]="item.key | underscoreless"
>
- <mat-option
- *ngFor="let list_item of item.value"
- [value]="list_item.Type"
+ <mat-option
+ *ngFor="let list_item of item.value"
+ [value]="list_item.Type"
(click)="clearGpuType('slave')"
>
<strong class="highlight icon-label">{{ list_item.Size
}}</strong> {{
@@ -186,7 +186,7 @@
<div class="col">
<div class="control-group">
<label class="label">Master GPU type</label>
- <div
+ <div
class="control selector-wrapper"
[ngClass]="{ 'not-active' :
!resourceForm.controls['shape_master'].value}"
[matTooltip]="'Please, select master instance size.'"
@@ -195,7 +195,7 @@
[matTooltipDisabled]="!!resourceForm.controls['shape_master'].value.length"
>
<mat-form-field>
- <mat-select
+ <mat-select
formControlName="master_GPU_type" disableOptionCentering
placeholder="Select master GPU type"
[disabled]="!resourceForm.controls['shape_master'].value"
@@ -215,7 +215,7 @@
</div>
<div class="control-group">
<label class="label">Master GPU сount</label>
- <div
+ <div
class="control selector-wrapper"
[ngClass]="{'not-active':
!resourceForm.controls['master_GPU_type'].value}"
[matTooltip]="'Please, select master GPU type.'"
@@ -242,7 +242,7 @@
<div class="col">
<div class="control-group">
<label class="label">Slave GPU type</label>
- <div
+ <div
class="control selector-wrapper"
[ngClass]="{ 'not-active':
!resourceForm.controls['shape_slave'].value}"
[matTooltip]="'Please, select slave instance size.'"
@@ -271,7 +271,7 @@
<div class="control-group">
<label class="label">Slave GPU сount</label>
- <div
+ <div
class="control selector-wrapper"
[ngClass]="{'not-active':
!resourceForm.controls['slave_GPU_type'].value}"
[matTooltip]="'Please, select slave GPU type.'"
@@ -298,7 +298,7 @@
</div>
</div>
</div>
- <div
+ <div
class="preemptible checkbox-group control-group"
*ngIf="PROVIDER === 'gcp' && selectedImage?.image ===
'docker.datalab-dataengine-service'"
>
@@ -308,14 +308,14 @@
</div>
<span class="pl-5">Preemptible node</span>
</div>
- <div
- *ngIf="isSelected.preemptible"
+ <div
+ *ngIf="isSelected.preemptible"
class="preemptible-details control"
[ngClass]="{ show: isSelected.preemptible}"
>
- <input
- type="text"
- class="form-control"
+ <input
+ type="text"
+ class="form-control"
formControlName="preemptible_instance_number"
(keypress)="CheckUtils.isNumberKey($event)"
(keydown.arrowup)="preemptibleCounter($event, 'increment')"
@@ -333,35 +333,35 @@
<div class="checkbox-group control-group m-top-15" *ngIf="PROVIDER ===
'aws'" [hidden]="!selectedImage.templates.length">
<div class="d-flex cursor-pointer label"
(click)="addAdditionalParams('spotInstances')">
- <div class="empty-checkbox ml-10" [ngClass]="{'checked':
isSelected.spotInstances}" (click)="selectSpotInstances()">
- <span class="checked-checkbox"
*ngIf="isSelected.spotInstances"></span>
+ <div class="empty-checkbox ml-10" [ngClass]="{'checked':
instanceSpot}" (click)="selectSpotInstances()">
+ <span class="checked-checkbox" *ngIf="instanceSpot"></span>
</div>
- <span class="pl-5">Spot instance</span><span
[hidden]="!isSelected.spotInstances"> bid, %</span>
+ <span class="pl-5">Spot instance</span><span
[hidden]="!instanceSpot"> bid, %</span>
</div>
- <div
- class="control spot-details"
- [ngClass]="{ show: isSelected.spotInstances }"
- *ngIf="isSelected.spotInstances"
+ <div
+ class="control spot-details"
+ [ngClass]="{ show: instanceSpot }"
+ *ngIf="instanceSpot"
>
- <input
- type="number"
- class="form-control"
- step="5"
- min="{{minSpotPrice}}"
+ <input
+ type="number"
+ class="form-control"
+ step="5"
+ min="{{minSpotPrice}}"
max="{{maxSpotPrice}}"
- formControlName="instance_price"
+ formControlName="instance_price"
(keypress)="CheckUtils.isNumberKey($event)"
/>
<span class="error error-bottom"
*ngIf="!resourceForm?.controls.instance_price.valid">
Only integer values greater than or equal to {{minSpotPrice}}
and less than {{maxSpotPrice}} are allowed.
</span>
</div>
- <span class="info ml-10" *ngIf="isSelected.spotInstances">When the
current Spot price
+ <span class="info ml-10" *ngIf="instanceSpot">When the current Spot
price
rises above your bid price, the Spot instance is reclaimed by AWS
so that it can be given to another
customer. Make sure to backup your data on periodic basis.
</span>
</div>
- <div
+ <div
class="checkbox-group control-group m-top-10"
[hidden]="PROVIDER === 'gcp' && selectedImage?.image ===
'docker.datalab-dataengine-service'"
*ngIf="notebook_instance?.image !== 'docker.datalab-zeppelin'"
@@ -372,9 +372,9 @@
</div>
<span class="pl-5">Cluster configurations</span>
</div>
- <div
- class="config-link"
- *ngIf="(isSelected.configuration)
+ <div
+ class="config-link"
+ *ngIf="(isSelected.configuration)
&& selectedImage?.image === 'docker.datalab-dataengine-service'
&& PROVIDER === 'aws'"
>
@@ -386,14 +386,14 @@
</div>
<div class="checkbox-group ml-10">
<div class="config-details" [ngClass]="{ show:
isSelected.configuration }">
- <textarea
- formControlName="configuration_parameters"
+ <textarea
+ formControlName="configuration_parameters"
placeholder="Cluster configuration template, JSON"
data-gramm_editor="false">
</textarea>
- <span
+ <span
class="error"
- *ngIf="!resourceForm?.controls.configuration_parameters.valid
+ *ngIf="!resourceForm?.controls.configuration_parameters.valid
&& resourceForm?.controls['configuration_parameters'].dirty"
>
Configuration parameters is not in a valid format.
@@ -410,21 +410,21 @@
</small>
</div>
<div class="text-center m-top-30">
- <button
- mat-raised-button
- type="button"
- (click)="dialogRef.close()"
+ <button
+ mat-raised-button
+ type="button"
+ (click)="dialogRef.close()"
class="butt action"
>
Cancel
</button>
- <button
- mat-raised-button
- type="button"
+ <button
+ mat-raised-button
+ type="button"
[disabled]="!resourceForm?.valid
|| (!resourceForm.value.shape_slave)
|| (selectedImage?.image === 'docker.datalab-dataengine-service'
&& !resourceForm.value.version)"
- (click)="createComputationalResource(resourceForm.value)"
+ (click)="createComputationalResource(resourceForm.value)"
class="butt butt-success action"
[ngClass]="{'not-allowed': !resourceForm?.valid
|| (selectedImage?.image === 'docker.datalab-dataengine-service'
&& !resourceForm.value.shape_slave)
diff --git
a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.ts
b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.ts
index 6fd9991..1d5514c 100644
---
a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.ts
+++
b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.ts
@@ -97,12 +97,14 @@ export class ComputationalResourceCreateDialogComponent
implements OnInit {
}
public selectSpotInstances(): void {
- if (this.isSelected.spotInstances) {
+ if (!this.instanceSpot) {
this.spotInstance = true;
- this.resourceForm.controls['instance_price'].setValue(50);
+ this.resourceForm.controls['emr_slave_instance_spot'].patchValue(true);
+ this.resourceForm.controls['instance_price'].patchValue(50);
} else {
this.spotInstance = false;
- this.resourceForm.controls['instance_price'].setValue(0);
+ this.resourceForm.controls['emr_slave_instance_spot'].patchValue(false);
+ this.resourceForm.controls['instance_price'].patchValue(0);
}
}
@@ -141,11 +143,11 @@ export class ComputationalResourceCreateDialogComponent
implements OnInit {
public createComputationalResource(data) {
this.model.createComputationalResource(data, this.selectedImage,
this.notebook_instance,
- this.spotInstance, this.PROVIDER.toLowerCase(), this.isSelected.gpu)
+ this.PROVIDER.toLowerCase(), this.isSelected.gpu)
.subscribe(
(response: any) => {
if (response.status === HTTP_STATUS_CODES.OK)
this.dialogRef.close(true);
- },
+ },
error => this.toastr.error(error.message, 'Oops!')
);
}
@@ -155,6 +157,7 @@ export class ComputationalResourceCreateDialogComponent
implements OnInit {
template_name: ['', [Validators.required]],
version: [''],
shape_master: ['', Validators.required],
+ emr_slave_instance_spot: '',
shape_slave: [''],
cluster_alias_name: ['', [
Validators.required, Validators.pattern(PATTERNS.namePattern),
@@ -196,7 +199,8 @@ export class ComputationalResourceCreateDialogComponent
implements OnInit {
this.maxSpotPrice =
this.selectedImage.limits.max_emr_spot_instance_bid_pct;
this.isSelected.spotInstances = true;
- this.selectSpotInstances();
+ this.resourceForm.controls['emr_slave_instance_spot'].setValue(true);
+ this.resourceForm.controls['instance_price'].setValue(50);
}
this.resourceForm.controls['instance_number'].setValue(this.minInstanceNumber);
@@ -249,7 +253,7 @@ export class ComputationalResourceCreateDialogComponent
implements OnInit {
private validConfiguration(control) {
if (this.isSelected.configuration) {
- return this.isSelected.configuration
+ return this.isSelected.configuration
? (control.value && control.value !== null &&
CheckUtils.isJSON(control.value) ? null : { valid: false })
: null;
}
@@ -373,4 +377,8 @@ export class ComputationalResourceCreateDialogComponent
implements OnInit {
this.resourceForm.controls['slave_GPU_count'].setValue('');
}
}
+
+ get instanceSpot() {
+ return this.resourceForm.controls['emr_slave_instance_spot'].value
+ }
}
diff --git
a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create.model.ts
b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create.model.ts
index 596f8ea..59b1d36 100644
---
a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create.model.ts
+++
b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create.model.ts
@@ -28,7 +28,7 @@ export class ComputationalResourceModel {
constructor(private userResourceService: UserResourceService) { }
- public createComputationalResource(parameters, image, env, spot, provider,
gpu?): Observable<{}> {
+ public createComputationalResource(parameters, image, env, provider, gpu?):
Observable<{}> {
const config = parameters.configuration_parameters ?
JSON.parse(parameters.configuration_parameters) : null;
if (provider === 'aws' && image.image ===
'docker.datalab-dataengine-service') {
@@ -41,7 +41,7 @@ export class ComputationalResourceModel {
notebook_name: env.name,
image: image.image,
template_name: image.template_name,
- emr_slave_instance_spot: spot,
+ emr_slave_instance_spot: parameters.emr_slave_instance_spot,
emr_slave_instance_spot_pct_price: parameters.instance_price,
config: config,
project: env.project,
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]