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 <atosys...@hotmail.com> 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 ![image](https://user-images.githubusercontent.com/32225867/136485610-88a9e3d7-eaee-413a-9e88-511cc32341c5.png) ### Questions: * Do the license files need updating? No * Are there breaking changes for older versions? No * Does this need new documentation? Yes Author: atosystem <atosys...@hotmail.com> Signed-off-by: Kevin <pings...@apache.org> 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: dev-unsubscr...@submarine.apache.org For additional commands, e-mail: dev-h...@submarine.apache.org