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 4199e50 SUBMARINE-1050. Create static model version page
4199e50 is described below
commit 4199e5063fa76b9abf00507495f8a50f6e1e39b6
Author: atosystem <[email protected]>
AuthorDate: Fri Oct 8 09:35:11 2021 +0800
SUBMARINE-1050. Create static model version page
### What is this PR for?
1. Create static model version page at URL:`/workbench/model/${registered
model name}/${version}`
2. Enable the "Model" button on the sidebar.
3. Alter routing settings.
### What type of PR is it?
[Feature]
### Todos
### What is the Jira issue?
https://issues.apache.org/jira/projects/SUBMARINE/issues/SUBMARINE-1050
### How should this be tested?
Go to URL `/workbench/model/${registered model name}/${version}` and test.
### Screenshots
### Questions:
* Do the license files need updating? No
* Are there breaking changes for older versions? No
* Does this need new documentation? Yes
Author: atosystem <[email protected]>
Signed-off-by: Kevin <[email protected]>
Closes #769 from atosystem/SUBMARINE-1050 and squashes the following
commits:
36f6a4a1 [atosystem] SUBMARINE-1050. remove model-home & model-info
90bc08d5 [atosystem] SUBMARINE-1050. remove comments
74dbb772 [atosystem] SUBMARINE-1050. add static model version page & create
simple blank model information, overview page
---
...{model.component.ts => model-routing.module.ts} | 33 +++++++++++------
.../model-version.component.html} | 17 ++++++++-
.../model-version.component.scss} | 14 +-------
.../model-version.component.ts} | 26 +++++++++-----
.../app/pages/workbench/model/model.component.html | 23 +++++++++++-
.../app/pages/workbench/model/model.component.ts | 10 ++++--
.../{workbench.module.ts => model/model.module.ts} | 41 ++++++++--------------
.../pages/workbench/workbench-routing.module.ts | 5 ++-
.../src/app/pages/workbench/workbench.component.ts | 2 +-
.../src/app/pages/workbench/workbench.module.ts | 6 ++--
10 files changed, 109 insertions(+), 68 deletions(-)
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
similarity index 59%
copy from
submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
copy to
submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
index 1835f44..a98f32c 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
@@ -1,4 +1,4 @@
-/*!
+/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
@@ -17,15 +17,26 @@
* under the License.
*/
-import { Component, OnInit } from '@angular/core';
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { ModelComponent } from './model.component';
+import { ModelVersionComponent } from
'./model-version/model-version.component';
-@Component({
- selector: 'submarine-model',
- templateUrl: './model.component.html',
- styleUrls: ['./model.component.scss']
-})
-export class ModelComponent implements OnInit {
- constructor() {}
+const routes: Routes = [
+ {
+ path: '',
+ component: ModelComponent,
+ children: [
+ {
+ path: ':name/:version',
+ component: ModelVersionComponent,
+ },
+ ],
+ },
+];
- ngOnInit() {}
-}
+@NgModule({
+ imports: [RouterModule.forChild(routes)],
+ exports: [RouterModule],
+})
+export class ModelRoutingModule {}
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.html
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-version/model-version.component.html
similarity index 66%
copy from
submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.html
copy to
submarine-workbench/workbench-web/src/app/pages/workbench/model/model-version/model-version.component.html
index d07e9c1..e5bed30 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.html
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-version/model-version.component.html
@@ -17,4 +17,19 @@
~ under the License.
-->
-<p>model works!</p>
+<div style="margin: 15px; padding: 15px; background-color: white">
+ <p>Version: {{ modelVersion }}</p>
+ <p>Description: Resnet152</p>
+ <p>Tags:</p>
+ <p>Stage:</p>
+ <h3>Model version info</h3>
+ <p>User id: abcdef</p>
+ <p>
+ Experiment id:
+ <a href="#">123456789</a>
+ </p>
+ <p>Dataset: mnist</p>
+ <p>Created: 2021-09-01 07:57</p>
+ <p>Updated: 2021-09-21 03:00</p>
+ <p>Source: s3:/example/model</p>
+</div>
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-version/model-version.component.scss
similarity index 75%
copy from
submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
copy to
submarine-workbench/workbench-web/src/app/pages/workbench/model/model-version/model-version.component.scss
index 1835f44..61d2115 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-version/model-version.component.scss
@@ -16,16 +16,4 @@
* specific language governing permissions and limitations
* under the License.
*/
-
-import { Component, OnInit } from '@angular/core';
-
-@Component({
- selector: 'submarine-model',
- templateUrl: './model.component.html',
- styleUrls: ['./model.component.scss']
-})
-export class ModelComponent implements OnInit {
- constructor() {}
-
- ngOnInit() {}
-}
+
\ No newline at end of file
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-version/model-version.component.ts
similarity index 52%
copy from
submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
copy to
submarine-workbench/workbench-web/src/app/pages/workbench/model/model-version/model-version.component.ts
index 1835f44..04c8dfe 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-version/model-version.component.ts
@@ -1,4 +1,4 @@
-/*!
+/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
@@ -17,15 +17,25 @@
* under the License.
*/
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { ExperimentService } from '@submarine/services/experiment.service';
@Component({
- selector: 'submarine-model',
- templateUrl: './model.component.html',
- styleUrls: ['./model.component.scss']
+ selector: 'submarine-model-version',
+ templateUrl: './model-version.component.html',
+ styleUrls: ['./model-version.component.scss'],
})
-export class ModelComponent implements OnInit {
- constructor() {}
+export class ModelVersionComponent implements OnInit {
+ isLoading = true;
+ modelName;
+ modelVersion;
- ngOnInit() {}
+ constructor(private router: Router, private route: ActivatedRoute, private
experimentService: ExperimentService) {}
+
+ ngOnInit() {
+ this.modelName = this.route.snapshot.params.name;
+ this.modelVersion = this.route.snapshot.params.version;
+ this.experimentService.emitInfo(this.modelName);
+ }
}
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.html
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.html
index d07e9c1..8343648 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.html
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.html
@@ -17,4 +17,25 @@
~ under the License.
-->
-<p>model works!</p>
+ <nz-layout style="margin: -24px -24px 16px">
+ <div style="background-color: white; padding-left: 30px; padding-top:
20px">
+ <nz-breadcrumb>
+ <nz-breadcrumb-item>
+ <a>Home</a>
+ </nz-breadcrumb-item>
+ <nz-breadcrumb-item>
+ <a [routerLink]="['/', 'workbench', 'model']" (click)="modelName =
null">model</a>
+ </nz-breadcrumb-item>
+ <nz-breadcrumb-item *ngIf="modelName != null">
+ {{ modelName }}
+ </nz-breadcrumb-item>
+ </nz-breadcrumb>
+ <div *ngIf="modelName == null">
+ <br />
+ <h2>Model</h2>
+ </div>
+ <br />
+ </div>
+ <router-outlet></router-outlet>
+ </nz-layout>
+
\ No newline at end of file
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
index 1835f44..a6cbfa5 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.component.ts
@@ -18,6 +18,8 @@
*/
import { Component, OnInit } from '@angular/core';
+import { ExperimentService } from '@submarine/services/experiment.service';
+import { delay } from 'rxjs/operators';
@Component({
selector: 'submarine-model',
@@ -25,7 +27,11 @@ import { Component, OnInit } from '@angular/core';
styleUrls: ['./model.component.scss']
})
export class ModelComponent implements OnInit {
- constructor() {}
+ modelName: string = null;
- ngOnInit() {}
+ constructor(private experimentService: ExperimentService) {}
+
+ ngOnInit() {
+ this.experimentService.infoEmitted$.pipe(delay(0)).subscribe((name) =>
(this.modelName = name));
+ }
}
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/workbench.module.ts
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.module.ts
similarity index 54%
copy from
submarine-workbench/workbench-web/src/app/pages/workbench/workbench.module.ts
copy to
submarine-workbench/workbench-web/src/app/pages/workbench/model/model.module.ts
index 7ed7e21..dbfe533 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/workbench.module.ts
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.module.ts
@@ -17,42 +17,31 @@
* under the License.
*/
-import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { NgZorroAntdModule } from 'ng-zorro-antd';
+import { ModelRoutingModule } from './model-routing.module';
import { RouterModule } from '@angular/router';
-import { WorkbenchRoutingModule } from
'@submarine/pages/workbench/workbench-routing.module';
+import { ModelComponent } from './model.component';
+import { ModelVersionComponent } from
'./model-version/model-version.component';
import { PipeSharedModule } from '@submarine/pipe/pipe-shared.module';
-import { NgZorroAntdModule } from 'ng-zorro-antd';
-import { WorkspaceModule } from './workspace/workspace.module';
-import { ExperimentModule } from './experiment/experiment.module';
-import { InterpreterModule } from './interpreter/interpreter.module';
-import { NotebookModule } from './notebook/notebook.module';
-
-import { HomeComponent } from './home/home.component';
-import { ModelComponent } from './model/model.component';
-import { WorkbenchComponent } from './workbench.component';
-import { WorkspaceComponent } from './workspace/workspace.component';
-import { DataComponent } from './data/data.component';
-import { EnvironmentModule } from './environment/environment.module';
-import { TemplateModule } from './template/template.module';
@NgModule({
- declarations: [WorkbenchComponent, HomeComponent, WorkspaceComponent,
DataComponent, ModelComponent],
+ declarations: [
+ ModelComponent,
+ ModelVersionComponent,
+ ],
imports: [
CommonModule,
- WorkbenchRoutingModule,
- NgZorroAntdModule,
- RouterModule,
FormsModule,
ReactiveFormsModule,
- WorkspaceModule,
- ExperimentModule,
- InterpreterModule,
+ NgZorroAntdModule,
+ RouterModule,
+ ModelRoutingModule,
PipeSharedModule,
- NotebookModule,
- EnvironmentModule,
- TemplateModule,
],
+ providers: [],
+ exports: [ModelComponent],
})
-export class WorkbenchModule {}
+export class ModelModule {}
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/workbench-routing.module.ts
b/submarine-workbench/workbench-web/src/app/pages/workbench/workbench-routing.module.ts
index 393f75a..17ac75c 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/workbench-routing.module.ts
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/workbench-routing.module.ts
@@ -23,7 +23,6 @@ import { WorkbenchComponent } from
'@submarine/pages/workbench/workbench.compone
import { DataComponent } from './data/data.component';
import { HomeComponent } from './home/home.component';
import { InterpreterComponent } from './interpreter/interpreter.component';
-import { ModelComponent } from './model/model.component';
import { WorkspaceComponent } from './workspace/workspace.component';
const routes: Routes = [
@@ -73,7 +72,7 @@ const routes: Routes = [
},
{
path: 'model',
- component: ModelComponent,
+ loadChildren: () => import('./model/model.module').then((m) =>
m.ModelModule),
canActivate: ['canActivatePage'],
},
{
@@ -96,7 +95,7 @@ const routes: Routes = [
{
provide: 'canActivatePage',
useValue: (route: ActivatedRouteSnapshot, state: RouterStateSnapshot) =>
{
- const disablePaths = ['home', 'data', 'model', 'workspace',
'interpreter'];
+ const disablePaths = ['home', 'data', 'workspace', 'interpreter'];
let currentPage = state.url.split('/')[2];
console.log('currentPage', currentPage);
if (disablePaths.includes(currentPage)) return false;
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/workbench.component.ts
b/submarine-workbench/workbench-web/src/app/pages/workbench/workbench.component.ts
index e778f7f..026f794 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/workbench.component.ts
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/workbench.component.ts
@@ -108,7 +108,7 @@ export class WorkbenchComponent implements OnInit {
title: 'Model',
iconType: 'experiment',
routerLink: '/workbench/model',
- disabled: true,
+ disabled: false,
},
{
title: 'Workspace',
diff --git
a/submarine-workbench/workbench-web/src/app/pages/workbench/workbench.module.ts
b/submarine-workbench/workbench-web/src/app/pages/workbench/workbench.module.ts
index 7ed7e21..c364471 100644
---
a/submarine-workbench/workbench-web/src/app/pages/workbench/workbench.module.ts
+++
b/submarine-workbench/workbench-web/src/app/pages/workbench/workbench.module.ts
@@ -30,15 +30,16 @@ import { InterpreterModule } from
'./interpreter/interpreter.module';
import { NotebookModule } from './notebook/notebook.module';
import { HomeComponent } from './home/home.component';
-import { ModelComponent } from './model/model.component';
import { WorkbenchComponent } from './workbench.component';
import { WorkspaceComponent } from './workspace/workspace.component';
import { DataComponent } from './data/data.component';
import { EnvironmentModule } from './environment/environment.module';
import { TemplateModule } from './template/template.module';
+import { ModelModule } from './model/model.module';
+
@NgModule({
- declarations: [WorkbenchComponent, HomeComponent, WorkspaceComponent,
DataComponent, ModelComponent],
+ declarations: [WorkbenchComponent, HomeComponent, WorkspaceComponent,
DataComponent],
imports: [
CommonModule,
WorkbenchRoutingModule,
@@ -53,6 +54,7 @@ import { TemplateModule } from './template/template.module';
NotebookModule,
EnvironmentModule,
TemplateModule,
+ ModelModule,
],
})
export class WorkbenchModule {}
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
