This is an automated email from the ASF dual-hosted git repository.
pingsutw pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/submarine.git
The following commit(s) were added to refs/heads/master by this push:
new c3595f2a SUBMARINE-1326. Model card list refresh automatically after
created and deleted
c3595f2a is described below
commit c3595f2a4da42eca19fcca20010e489f09e6769e
Author: cdmikechen <[email protected]>
AuthorDate: Tue Oct 4 19:40:41 2022 +0800
SUBMARINE-1326. Model card list refresh automatically after created and
deleted
### What is this PR for?
Currently models are not automatically refresh with the card list after
created or deleted and it need to be refreshed manually to see the new results.
### What type of PR is it?
Bug Fix
### Todos
* [x] - Automatic refresh card list after created a new model
* [x] - Automatic refresh card list after deleted a new model
### What is the Jira issue?
https://issues.apache.org/jira/browse/SUBMARINE-1326
### How should this be tested?
No
### Screenshots (if appropriate)
No
### Questions:
* Do the license files need updating? No
* Are there breaking changes for older versions? No
* Does this need new documentation? No
Author: cdmikechen <[email protected]>
Author: cdmikechen <[email protected]>
Signed-off-by: Kevin <[email protected]>
Closes #997 from cdmikechen/SUBMARINE-1326 and squashes the following
commits:
285afe8e [cdmikechen] rename outer to refreshCards for better understanding
f97ff393 [cdmikechen] Model refresh automatically
---
.../model-cards/model-card/model-card.component.ts | 9 +++++---
.../model-cards/model-cards.component.html | 2 +-
.../model-cards/model-cards.component.ts | 6 +++++
.../model-home/model-form/model-form.component.ts | 27 ++++++++++++----------
.../model/model-home/model-home.component.html | 7 +++---
.../model/model-home/model-home.component.ts | 6 ++---
6 files changed, 34 insertions(+), 23 deletions(-)
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-card/model-card.component.ts
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-card/model-card.component.ts
index b95ff3ea..7b1999bf 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-card/model-card.component.ts
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-card/model-card.component.ts
@@ -18,7 +18,7 @@
*/
import { HttpErrorResponse } from '@angular/common/http';
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { ModelInfo } from '@submarine/interfaces/model-info';
import { ModelVersionService } from
'@submarine/services/model-version.service';
import { ModelService } from '@submarine/services/model.service';
@@ -31,6 +31,8 @@ import { NzMessageService } from 'ng-zorro-antd';
})
export class ModelCardComponent implements OnInit {
@Input() card: ModelInfo;
+ // tslint:disable-next-line:prefer-output-readonly
+ @Output() private refreshCards = new EventEmitter<boolean>();
description: string;
constructor(private modelService: ModelService, private modelVersionService:
ModelVersionService,
@@ -49,9 +51,10 @@ export class ModelCardComponent implements OnInit {
this.modelService.deleteModel(modelName).subscribe({
next: (result) => {
this.nzMessageService.success('Delete registered model success!');
+ // send EventEmitter true to refresh cards
+ this.refreshCards.emit(true)
},
- error: (err: HttpErrorResponse ) => {
- console.log(err)
+ error: (err: HttpErrorResponse) => {
this.nzMessageService.error(`${err.error.message}`, {
nzPauseOnHover: true,
});
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.html
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.html
index 0293b5e7..6a258b1f 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.html
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.html
@@ -20,7 +20,7 @@
<nz-list nzGrid [nzPagination]="pagination" [nzLoading]="isLoading">
<div nz-row [nzGutter]="16">
<div nz-col [nzSpan]="6" *ngFor="let card of onPageModelCards; let i =
index">
- <submarine-model-card [card]="card"></submarine-model-card>
+ <submarine-model-card [card]="card"
(refreshCards)="refreshCards($event)"></submarine-model-card>
</div>
</div>
<ng-template #pagination>
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.ts
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.ts
index 95a470ea..469a4a10 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.ts
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.ts
@@ -27,6 +27,8 @@ import { ModelInfo } from '@submarine/interfaces/model-info';
export class ModelCardsComponent implements OnInit {
@Input() modelCards: Array<ModelInfo>;
@Input() isLoading: boolean;
+ @Input() fetchModelCards;
+
nowPage: number;
totalPages: number;
onPageModelCards: Array<ModelInfo>;
@@ -48,4 +50,8 @@ export class ModelCardsComponent implements OnInit {
let start = this.pageUnit * (newPage - 1);
this.onPageModelCards = this.modelCards.filter((_, index) => index < start
+ this.pageUnit && index >= start);
}
+
+ refreshCards(refresh: boolean) {
+ if (refresh) { this.fetchModelCards(); }
+ }
}
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-form/model-form.component.ts
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-form/model-form.component.ts
index 2c39afcd..0090a53c 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-form/model-form.component.ts
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-form/model-form.component.ts
@@ -29,6 +29,9 @@ import { NzMessageService } from 'ng-zorro-antd';
styleUrls: ['./model-form.component.scss']
})
export class ModelFormComponent implements OnInit {
+
+ @Input() fetchModelCards;
+
isVisible: boolean;
modelForm: FormGroup;
@@ -37,14 +40,14 @@ export class ModelFormComponent implements OnInit {
constructor(
private fb: FormBuilder,
private modelService: ModelService,
- private nzMessageService: NzMessageService,
+ private nzMessageService: NzMessageService
) {}
ngOnInit(): void {
this.modelForm = this.fb.group({
modelName: [null, Validators.required],
description: [null],
- tags: this.fb.array([]),
+ tags: this.fb.array([])
});
this.fetchRegisteredModelList();
}
@@ -57,7 +60,7 @@ export class ModelFormComponent implements OnInit {
return this.modelForm.get("description");
}
- get tags(){
+ get tags() {
return this.modelForm.get("tags");
}
@@ -65,12 +68,12 @@ export class ModelFormComponent implements OnInit {
this.isVisible = true;
}
- closeModal(){
+ closeModal() {
this.modelForm.reset();
this.isVisible = false;
}
- fetchRegisteredModelList(){
+ fetchRegisteredModelList() {
this.modelService.fetchModelList().subscribe(list => {
list.forEach(e => {
this.registeredModelList.push(e.name);
@@ -83,25 +86,25 @@ export class ModelFormComponent implements OnInit {
}
submitForm() {
- const modelInfo : ModelInfo = {
+ const modelInfo: ModelInfo = {
name: this.modelName.value,
creationTime: null,
lastUpdatedTime: null,
description: this.description.value,
- tags: this.tags.value,
+ tags: this.tags.value
}
this.modelService.createModel(modelInfo).subscribe({
next: (result) => {
- console.log(result)
this.nzMessageService.success('Create Model Registry Success!');
this.closeModal();
+ // refresh model card list
+ this.fetchModelCards();
},
error: (msg) => {
- console.log(msg)
this.nzMessageService.error(`Model registry with name:
${modelInfo.name} is exist.`, {
- nzPauseOnHover: true,
+ nzPauseOnHover: true
});
- },
+ }
})
}
-}
\ No newline at end of file
+}
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.html
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.html
index a9199d7c..b1c23f01 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.html
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.html
@@ -36,7 +36,7 @@
<submarine-model-tag [tag]="selected.nzLabel"
[type]="'selection'"></submarine-model-tag>
</ng-template>
</nz-select>
-
+
</div>
<div nz-col [nzOffset]="12" align="right">
<button
@@ -49,8 +49,7 @@
</button>
</div>
</div>
- <model-form #form></model-form>
+ <model-form #form [fetchModelCards]="fetchModelCards"></model-form>
<nz-divider></nz-divider>
- <submarine-model-cards [modelCards]="onDisplayModelCards"
[isLoading]="isModelCardsLoading"></submarine-model-cards>
+ <submarine-model-cards [modelCards]="onDisplayModelCards"
[isLoading]="isModelCardsLoading"
[fetchModelCards]="fetchModelCards"></submarine-model-cards>
</div>
-
\ No newline at end of file
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.ts
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.ts
index 7f615598..0461c068 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.ts
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.ts
@@ -36,7 +36,7 @@ export class ModelHomeComponent implements OnInit {
modelCards: ModelInfo[];
onDisplayModelCards = [];
-
+
nameForFilter = "";
listOfTagsOption: Array<{ label: string; value: string }> = [];
listOfChosenTags = [];
@@ -45,7 +45,7 @@ export class ModelHomeComponent implements OnInit {
this.fetchModelCards();
this.modelService.emitInfo(null);
}
-
+
fetchModelCards = () => {
this.modelService.fetchModelList().subscribe((res) => {
this.modelCards = res;
@@ -64,7 +64,7 @@ export class ModelHomeComponent implements OnInit {
this.nameForFilter = event.target.value;
this.changeDisplayModelCards();
}
-
+
filterByTags() {
this.changeDisplayModelCards();
}
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
