You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@submarine.apache.org by pi...@apache.org on 2021/10/15 18:34:14 UTC
[submarine] branch master updated: SUBMARINE-1048. Static model
registry overview page
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 0bca1ff SUBMARINE-1048. Static model registry overview page
0bca1ff is described below
commit 0bca1ff4fdcaad459ea87f39e2f8ee9e3cacf416
Author: andybi7676 <an...@gmail.com>
AuthorDate: Sat Oct 16 00:20:07 2021 +0800
SUBMARINE-1048. Static model registry overview page
### What is this PR for?
Add static model page overview UI.
### What type of PR is it?
[Improvement]
### Todos
* [x] - model overview UI
* [x] - search by name
* [x] - filter by tags
* [x] - shorten description if it is too long
* [x] - link model card
### What is the Jira issue?
https://issues.apache.org/jira/projects/SUBMARINE/issues/SUBMARINE-1048
### How should this be tested?
checkout the model page.
### Screenshots (if appropriate)
### Questions:
* Do the license files need updating? No
* Are there breaking changes for older versions? No
* Does this need new documentation? No
Author: andybi7676 <an...@gmail.com>
Signed-off-by: Kevin <pi...@apache.org>
Closes #779 from andybi7676/SUBMARINE-1048 and squashes the following commits:
916ba309 [andybi7676] SUBMARINE-1048. remove unnecessary
2c5c3065 [andybi7676] SUBMARINE-1048. remove unnecessary
27e14823 [andybi7676] SUBMARINE-1048. shorten description and link model card
7e6707fc [andybi7676] SUBMARINE-1048. add static model page overview
04c5468b [andybi7676] remove log
90a10fcc [andybi7676] add search function for model UI
862855a4 [andybi7676] model page UI
---
.../model-info.ts} | 30 ++-----
.../model-card/model-card.component.html} | 35 +++-----
.../model-card/model-card.component.scss} | 29 +------
.../model-card/model-card.component.ts} | 41 +++++-----
.../model-cards/model-cards.component.html} | 27 ++-----
.../model-cards/model-cards.component.scss} | 27 +------
.../model-cards/model-cards.component.ts} | 34 +++-----
.../model/model-home/model-home.component.html | 45 +++++++++++
.../model-home.component.scss} | 27 +------
.../model/model-home/model-home.component.ts | 93 ++++++++++++++++++++++
.../pages/workbench/model/model-routing.module.ts | 6 ++
.../app/pages/workbench/model/model.component.html | 38 ++++-----
.../src/app/pages/workbench/model/model.module.ts | 6 ++
13 files changed, 235 insertions(+), 203 deletions(-)
diff --git a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts b/submarine-workbench/workbench-web/src/app/interfaces/model-info.ts
similarity index 59%
copy from submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
copy to submarine-workbench/workbench-web/src/app/interfaces/model-info.ts
index a98f32c..01b9f59 100644
--- a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
+++ b/submarine-workbench/workbench-web/src/app/interfaces/model-info.ts
@@ -17,26 +17,10 @@
* under the License.
*/
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
-import { ModelComponent } from './model.component';
-import { ModelVersionComponent } from './model-version/model-version.component';
-
-const routes: Routes = [
- {
- path: '',
- component: ModelComponent,
- children: [
- {
- path: ':name/:version',
- component: ModelVersionComponent,
- },
- ],
- },
-];
-
-@NgModule({
- imports: [RouterModule.forChild(routes)],
- exports: [RouterModule],
-})
-export class ModelRoutingModule {}
+export interface ModelInfo {
+ name: string;
+ createTime: string,
+ updatedTime: string,
+ tags: string[],
+ description: string,
+}
\ No newline at end of file
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-home/model-cards/model-card/model-card.component.html
similarity index 54%
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-home/model-cards/model-card/model-card.component.html
index 8343648..9b5f464 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-home/model-cards/model-card/model-card.component.html
@@ -16,26 +16,15 @@
~ specific language governing permissions and limitations
~ under the License.
-->
-
- <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
+<a [routerLink]="[card.name]">
+ <nz-list-item >
+ <nz-card style="width:300px;" nzTitle={{card.name}} [nzExtra]="extraTemplate">
+ <p>Created: {{card.createTime}}</p>
+ <p>Updated: {{card.updatedTime}}</p>
+ <p>Tags:
+ <nz-tag *ngFor="let tag of card.tags">{{tag}}</nz-tag>
+ </p>
+ <p>Description: {{description}}</p>
+ </nz-card>
+ </nz-list-item>
+</a>
diff --git a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-card/model-card.component.scss
similarity index 59%
copy from submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
copy to submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-card/model-card.component.scss
index a98f32c..af9019f 100644
--- a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
+++ b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-card/model-card.component.scss
@@ -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
@@ -16,27 +16,6 @@
* specific language governing permissions and limitations
* under the License.
*/
-
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
-import { ModelComponent } from './model.component';
-import { ModelVersionComponent } from './model-version/model-version.component';
-
-const routes: Routes = [
- {
- path: '',
- component: ModelComponent,
- children: [
- {
- path: ':name/:version',
- component: ModelVersionComponent,
- },
- ],
- },
-];
-
-@NgModule({
- imports: [RouterModule.forChild(routes)],
- exports: [RouterModule],
-})
-export class ModelRoutingModule {}
+p {
+ margin: 0;
+}
\ No newline at end of file
diff --git a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-card/model-card.component.ts
similarity index 57%
copy from submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
copy to submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-card/model-card.component.ts
index a98f32c..8a23c81 100644
--- a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
+++ b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-card/model-card.component.ts
@@ -17,26 +17,25 @@
* under the License.
*/
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
-import { ModelComponent } from './model.component';
-import { ModelVersionComponent } from './model-version/model-version.component';
+import { Component, Input, OnInit } from '@angular/core';
+import { ModelInfo } from '@submarine/interfaces/model-info';
+@Component({
+ selector: 'submarine-model-card',
+ templateUrl: './model-card.component.html',
+ styleUrls: ['./model-card.component.scss'],
+})
+export class ModelCardComponent implements OnInit {
+ @Input() card: ModelInfo;
+ description: string;
-const routes: Routes = [
- {
- path: '',
- component: ModelComponent,
- children: [
- {
- path: ':name/:version',
- component: ModelVersionComponent,
- },
- ],
- },
-];
+ constructor() {}
-@NgModule({
- imports: [RouterModule.forChild(routes)],
- exports: [RouterModule],
-})
-export class ModelRoutingModule {}
+ ngOnInit() {
+ if (this.card.description.length > 15) {
+ this.description = this.card.description.substring(0,15) + "...";
+ }
+ else {
+ this.description = this.card.description;
+ }
+ }
+}
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-home/model-cards/model-cards.component.html
similarity index 55%
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-home/model-cards/model-cards.component.html
index 8343648..28958d9 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-home/model-cards/model-cards.component.html
@@ -17,25 +17,10 @@
~ under the License.
-->
- <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 />
+<nz-list nzGrid>
+ <div nz-row [nzGutter]="16">
+ <div nz-col [nzSpan]="6" *ngFor="let card of modelCards; let i = index">
+ <submarine-model-card [card]="card"></submarine-model-card>
</div>
- <router-outlet></router-outlet>
- </nz-layout>
-
\ No newline at end of file
+ </div>
+</nz-list>
diff --git a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.scss
similarity index 59%
copy from submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
copy to submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.scss
index a98f32c..61d2115 100644
--- a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
+++ b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.scss
@@ -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
@@ -16,27 +16,4 @@
* specific language governing permissions and limitations
* under the License.
*/
-
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
-import { ModelComponent } from './model.component';
-import { ModelVersionComponent } from './model-version/model-version.component';
-
-const routes: Routes = [
- {
- path: '',
- component: ModelComponent,
- children: [
- {
- path: ':name/:version',
- component: ModelVersionComponent,
- },
- ],
- },
-];
-
-@NgModule({
- imports: [RouterModule.forChild(routes)],
- exports: [RouterModule],
-})
-export class ModelRoutingModule {}
+
\ No newline at end of file
diff --git a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.ts
similarity index 59%
copy from submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
copy to submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.ts
index a98f32c..3c33a63 100644
--- a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
+++ b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-cards/model-cards.component.ts
@@ -17,26 +17,18 @@
* under the License.
*/
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
-import { ModelComponent } from './model.component';
-import { ModelVersionComponent } from './model-version/model-version.component';
+import { Component, Input, OnInit } from '@angular/core';
+import { ModelInfo } from '@submarine/interfaces/model-info';
+@Component({
+ selector: 'submarine-model-cards',
+ templateUrl: './model-cards.component.html',
+ styleUrls: ['./model-cards.component.scss'],
+})
+export class ModelCardsComponent implements OnInit {
+ @Input() modelCards: ModelInfo[];
-const routes: Routes = [
- {
- path: '',
- component: ModelComponent,
- children: [
- {
- path: ':name/:version',
- component: ModelVersionComponent,
- },
- ],
- },
-];
+ constructor() {}
-@NgModule({
- imports: [RouterModule.forChild(routes)],
- exports: [RouterModule],
-})
-export class ModelRoutingModule {}
+ ngOnInit() {
+ }
+}
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
new file mode 100644
index 0000000..c5dae9f
--- /dev/null
+++ b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.html
@@ -0,0 +1,45 @@
+<!--
+ ~ 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
+ ~ regarding copyright ownership. The ASF licenses this file
+ ~ to you under the Apache License, Version 2.0 (the
+ ~ "License"); you may not use this file except in compliance
+ ~ with the License. You may obtain a copy of the License at
+ ~
+ ~ http://www.apache.org/licenses/LICENSE-2.0
+ ~
+ ~ Unless required by applicable law or agreed to in writing,
+ ~ software distributed under the License is distributed on an
+ ~ "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ ~ KIND, either express or implied. See the License for the
+ ~ specific language governing permissions and limitations
+ ~ under the License.
+ -->
+
+<div style="margin: 15px; padding: 15px; background-color: white">
+ <div align="right">
+ <button
+ nz-button
+ id="btn-newModel"
+ nzType="primary"
+ style="margin: 10px 4px 10px 4px"
+ >
+ <i nz-icon nzType="plus"></i>
+ New Model
+ </button>
+ </div>
+ <div align='left'>
+ <nz-input-group nzSearch style="width: 265px; margin: 10px 4px 10px 4px" [nzAddOnAfter]="suffixIconButton">
+ <input type="text" nz-input placeholder="Search by model name..." (keyup)="searchModel($event)" />
+ </nz-input-group>
+ <ng-template #suffixIconButton>
+ <button nz-button nzType="primary" nzSearch><i nz-icon nzType="search"></i></button>
+ </ng-template>
+ <nz-select nzMode="tags" style="width: 265px; margin: 10px 4px 10px 12px" nzPlaceHolder="Search by tags" [(ngModel)]="listOfChosenTags" (ngModelChange)="filterByTags()">
+ <nz-option *ngFor="let option of listOfTagsOption" [nzLabel]="option.label" [nzValue]="option.value"></nz-option>
+ </nz-select>
+ </div>
+ <submarine-model-cards [modelCards]="onDisplayModelCards"></submarine-model-cards>
+</div>
+
\ No newline at end of file
diff --git a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.scss
similarity index 59%
copy from submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
copy to submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.scss
index a98f32c..61d2115 100644
--- a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
+++ b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.scss
@@ -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
@@ -16,27 +16,4 @@
* specific language governing permissions and limitations
* under the License.
*/
-
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
-import { ModelComponent } from './model.component';
-import { ModelVersionComponent } from './model-version/model-version.component';
-
-const routes: Routes = [
- {
- path: '',
- component: ModelComponent,
- children: [
- {
- path: ':name/:version',
- component: ModelVersionComponent,
- },
- ],
- },
-];
-
-@NgModule({
- imports: [RouterModule.forChild(routes)],
- exports: [RouterModule],
-})
-export class ModelRoutingModule {}
+
\ 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
new file mode 100644
index 0000000..63429eb
--- /dev/null
+++ b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-home/model-home.component.ts
@@ -0,0 +1,93 @@
+/*
+ * 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
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { Component, OnInit } from '@angular/core';
+import { ModelInfo } from '@submarine/interfaces/model-info';
+import { ExperimentService } from '@submarine/services/experiment.service';
+
+@Component({
+ selector: 'submarine-model-home',
+ templateUrl: './model-home.component.html',
+ styleUrls: ['./model-home.component.scss'],
+})
+export class ModelHomeComponent implements OnInit {
+ constructor(private experimentService: ExperimentService) {}
+
+ modelCards: ModelInfo[];
+
+ onDisplayModelCards = [];
+
+ nameForFilter = "";
+ listOfTagsOption: Array<{ label: string; value: string }> = [];
+ listOfChosenTags = [];
+
+ ngOnInit() {
+ this.modelCards = [
+ {
+ 'name': "Model One",
+ 'createTime': "2021-10-12",
+ 'updatedTime': "2021-10-13",
+ 'tags': ["image", 'text'],
+ 'description': "first model",
+ },
+ {
+ 'name': "Model Two",
+ 'createTime': "2021-10-12",
+ 'updatedTime': "2021-10-13",
+ 'tags': ["speech"],
+ 'description': "second model",
+ },
+ {
+ 'name': "Model Three",
+ 'createTime': "2021-10-12",
+ 'updatedTime': "2021-10-13",
+ 'tags': ["speech"],
+ 'description': "The third model has very long description for description shorten testing, 1234567890 A recurrent neural network (RNN) is a class of artificial neural networks where connections between nodes form a directed graph along a temporal sequence. This allows it to exhibit temporal dynamic behavior. Derived from feedforward neural networks, RNNs can use their internal state (memory) to process variable length sequences of inputs",
+ },
+ ];
+
+ this.onDisplayModelCards = this.modelCards.map(card => card);
+ let tags = [];
+ this.modelCards.map((card) => {
+ Array.prototype.push.apply(tags, card.tags);
+ });
+ let tags_set = new Set(tags);
+ tags = Array.from(tags_set);
+ this.listOfTagsOption = tags.map((tag) => ({ "label": String(tag), "value": String(tag)}));
+ }
+
+ searchModel(event: any) {
+ this.nameForFilter = event.target.value;
+ this.changeDisplayModelCards();
+ }
+
+ filterByTags() {
+ this.changeDisplayModelCards();
+ }
+
+ changeDisplayModelCards() {
+ this.onDisplayModelCards = this.modelCards.filter((card) => card.name.toLowerCase().includes(this.nameForFilter.toLowerCase()));
+ this.onDisplayModelCards = this.onDisplayModelCards.filter((card) => {
+ for (let chosenTag of this.listOfChosenTags) {
+ if (!card.tags.includes(chosenTag)) return false;
+ }
+ return true;
+ });
+ }
+}
diff --git a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
index a98f32c..5ee877c 100644
--- a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
+++ b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model-routing.module.ts
@@ -21,6 +21,7 @@ import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { ModelComponent } from './model.component';
import { ModelVersionComponent } from './model-version/model-version.component';
+import { ModelHomeComponent } from './model-home/model-home.component';
const routes: Routes = [
{
@@ -28,6 +29,11 @@ const routes: Routes = [
component: ModelComponent,
children: [
{
+ path: '',
+ pathMatch: 'full',
+ component: ModelHomeComponent,
+ },
+ {
path: ':name/:version',
component: ModelVersionComponent,
},
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 8343648..98c447a 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,25 +17,25 @@
~ under the License.
-->
- <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>
+<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>
- <router-outlet></router-outlet>
- </nz-layout>
+ <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.module.ts b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.module.ts
index dbfe533..258ce1c 100644
--- a/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.module.ts
+++ b/submarine-workbench/workbench-web/src/app/pages/workbench/model/model.module.ts
@@ -26,11 +26,17 @@ import { RouterModule } from '@angular/router';
import { ModelComponent } from './model.component';
import { ModelVersionComponent } from './model-version/model-version.component';
import { PipeSharedModule } from '@submarine/pipe/pipe-shared.module';
+import { ModelHomeComponent } from './model-home/model-home.component';
+import { ModelCardsComponent } from './model-home/model-cards/model-cards.component';
+import { ModelCardComponent } from './model-home/model-cards/model-card/model-card.component';
@NgModule({
declarations: [
ModelComponent,
+ ModelHomeComponent,
ModelVersionComponent,
+ ModelCardsComponent,
+ ModelCardComponent,
],
imports: [
CommonModule,
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@submarine.apache.org
For additional commands, e-mail: dev-help@submarine.apache.org