kevin85421 commented on a change in pull request #488:
URL: https://github.com/apache/submarine/pull/488#discussion_r555484214



##########
File path: 
submarine-workbench/workbench-web/src/app/pages/workbench/experiment/experiment-home/experiment-home.component.html
##########
@@ -17,5 +17,54 @@
  under the License.
 -->
 
-<!-- <p>experiment-home works!</p> -->
-<!-- TODO: should split home page from experiment root components -->
+<div style="margin: 15px; padding: 15px; background-color: white">
+  <div align="right">
+    <nz-radio-group>
+      <label nz-radio-button nzValue="All">All</label>
+      <label nz-radio-button nzValue="Own">Owned By Me</label>
+      <label nz-radio-button nzValue="Access">Accessible By Me</label>
+    </nz-radio-group>
+    <nz-input-group
+      nzSearch
+      style="width: 300px; margin-top: 15px; margin-left: 10px; margin-right: 
5px"

Review comment:
       Is there any other method to avoid hard-coded width?

##########
File path: 
submarine-workbench/workbench-web/src/app/pages/workbench/experiment/experiment-home/experiment-home.component.html
##########
@@ -7,7 +7,7 @@
  "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
+ http: //www.apache.org/licenses/LICENSE-2.0

Review comment:
       Why we add a space after "http:"?

##########
File path: 
submarine-workbench/workbench-web/src/app/pages/workbench/experiment/experiment-home/experiment-home.component.ts
##########
@@ -7,7 +7,7 @@
  * "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
+ * http: //www.apache.org/licenses/LICENSE-2.0

Review comment:
       Why we add a space after "http:"?

##########
File path: 
submarine-workbench/workbench-web/src/app/pages/workbench/experiment/experiment-home/experiment-home.component.scss
##########
@@ -7,7 +7,7 @@
  * "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
+ * http: //www.apache.org/licenses/LICENSE-2.0

Review comment:
       Why we add a space after "http:"?

##########
File path: 
submarine-workbench/workbench-web/src/app/pages/workbench/experiment/experiment-info/experiment-info.component.html
##########
@@ -17,107 +17,109 @@
   ~ under the License.
   -->
 
-<nz-table
-  *ngIf="!isLoading"
-  style="margin-top: 10px;"
-  id="experimentTable"
-  #basicTable
-  [nzData]="[experimentInfo]"
-  [nzShowPagination]="false"
-  nzSize="small"
->
-  <thead>
-    <tr>
-      <th>Experiment Name</th>
-      <th>Experiment ID</th>
-      <th>Created Time</th>
-      <th>Running Time</th>
-      <th>Finished Time</th>
-      <th>Duration</th>
-      <th>Status</th>
-      <th>Action</th>
-    </tr>
-  </thead>
-  <tbody>
-    <tr>
-      <td>{{ experimentInfo.name }}</td>
-      <td>{{ experimentInfo.experimentId }}</td>
-      <td>{{ experimentInfo.createdTime | date: 'M/d/yyyy, h:mm a' }}</td>
-      <td>{{ experimentInfo.runningTime | date: 'M/d/yyyy, h:mm a' }}</td>
-      <td>{{ experimentInfo.finishedTime | date: 'M/d/yyyy, h:mm a' }}</td>
-      <td>{{ experimentInfo.duration }}</td>
-      <td>
-        <nz-tag [nzColor]="statusColor[experimentInfo.status]">{{ 
experimentInfo.status }}</nz-tag>
-      </td>
-      <td class="td-action">
-        <a (click)="startExperiment()">Start</a>
-        <nz-divider nzType="vertical"></nz-divider>
-        <a nz-dropdown [nzDropdownMenu]="more">
-          More
-          <i nz-icon nzType="down"></i>
-        </a>
-        <nz-dropdown-menu #more="nzDropdownMenu">
-          <ul nz-menu nzSelectable>
-            <li nz-menu-item (click)="editExperiment()">Edit</li>
-            <li
-              nz-menu-item
-              nz-popconfirm
-              nzPlacement="left"
-              nzTitle="Confirm to delete?"
-              nzCancelText="Cancel"
-              nzOkText="Ok"
-              (nzOnConfirm)="onDeleteExperiment()"
-            >
-              Delete
-            </li>
-          </ul>
-        </nz-dropdown-menu>
-      </td>
-    </tr>
-  </tbody>
-</nz-table>
-<nz-spin *ngIf="isLoading"></nz-spin>
-<div style="background-color: white;">
-  <nz-select id="nzSelect_selectPod" [(ngModel)]="selectedPod">
-    <nz-option *ngFor="let pod of podNameArr" [nzValue]="pod" 
[nzLabel]="pod"></nz-option>
-  </nz-select>
-</div>
-<nz-layout>
-  <nz-sider id="experimentInfo_sider">
-    <ul nz-menu>
-      <li nz-menu-item nzSelected (click)="currentState = 0">
-        <i nz-icon nzType="bar-chart" nzTheme="outline"></i>
-        Charts
-      </li>
-      <li nz-menu-item (click)="currentState = 1">
-        <i nz-icon nzType="bars" nzTheme="outline"></i>
-        Parameters
-      </li>
-      <li nz-menu-item (click)="currentState = 2">
-        <i nz-icon nzType="appstore" nzTheme="outline"></i>
-        Metrics
-      </li>
-      <li nz-menu-item (click)="currentState = 3">
-        <i nz-icon nzType="desktop" nzTheme="outline"></i>
-        Outputs
-      </li>
-    </ul>
-  </nz-sider>
+<div style="margin: 15px; padding: 15px; background-color: white">
+  <nz-table
+    *ngIf="!isLoading"
+    style="margin-top: 10px"
+    id="experimentTable"
+    #basicTable
+    [nzData]="[experimentInfo]"
+    [nzShowPagination]="false"
+    nzSize="small"
+  >
+    <thead>
+      <tr>
+        <th>Experiment Name</th>
+        <th>Experiment ID</th>
+        <th>Created Time</th>
+        <th>Running Time</th>
+        <th>Finished Time</th>
+        <th>Duration</th>
+        <th>Status</th>
+        <th>Action</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr>
+        <td>{{ experimentInfo.name }}</td>
+        <td>{{ experimentInfo.experimentId }}</td>
+        <td>{{ experimentInfo.createdTime | date: 'M/d/yyyy, h:mm a' }}</td>
+        <td>{{ experimentInfo.runningTime | date: 'M/d/yyyy, h:mm a' }}</td>
+        <td>{{ experimentInfo.finishedTime | date: 'M/d/yyyy, h:mm a' }}</td>
+        <td>{{ experimentInfo.duration }}</td>
+        <td>
+          <nz-tag [nzColor]="statusColor[experimentInfo.status]">{{ 
experimentInfo.status }}</nz-tag>
+        </td>
+        <td class="td-action">
+          <a (click)="startExperiment()">Start</a>
+          <nz-divider nzType="vertical"></nz-divider>
+          <a nz-dropdown [nzDropdownMenu]="more">
+            More
+            <i nz-icon nzType="down"></i>
+          </a>
+          <nz-dropdown-menu #more="nzDropdownMenu">
+            <ul nz-menu nzSelectable>
+              <li nz-menu-item (click)="editExperiment()">Edit</li>
+              <li
+                nz-menu-item
+                nz-popconfirm
+                nzPlacement="left"
+                nzTitle="Confirm to delete?"

Review comment:
       "Are you sure you want to delete?"

##########
File path: 
submarine-workbench/workbench-web/src/app/pages/workbench/experiment/experiment-home/experiment-list/experiment-list.component.html
##########
@@ -0,0 +1,88 @@
+<!--
+ 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.
+-->
+
+<nz-table
+  id="releaseTable"
+  nzBordered
+  #basicTable
+  [nzData]="experimentList"
+  [nzNoResult]="'No data'"
+  [nzLoading]="isLoading"
+  nzSize="small"
+>
+  <thead>
+    <tr>
+      <th>
+        <label nz-checkbox [ngModel]="selectAllChecked" 
(ngModelChange)="onSelectAllClick($event)"></label>
+      </th>
+      <th>Experiment Name</th>
+      <th>Experiment ID</th>
+      <th>Status</th>
+      <th>Finished Time</th>
+      <th>Created Time</th>
+      <th>Running Time</th>
+      <th>Duration</th>
+      <th>Action</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr *ngFor="let data of basicTable.data; let i = index">
+      <td>
+        <label nz-checkbox [(ngModel)]="checkedList[i]"></label>
+      </td>
+      <td>{{ data.name }}</td>
+      <td>
+        <a [routerLink]="['info', data.experimentId]">
+          {{ data.experimentId }}
+        </a>
+      </td>
+      <td>
+        <nz-tag [nzColor]="statusColor[data.status]">{{ data.status }}</nz-tag>
+      </td>
+      <td>{{ data.finishedTime | date: 'M/d/yyyy, h:mm a' }}</td>
+      <td>{{ data.createdTime | date: 'M/d/yyyy, h:mm a' }}</td>
+      <td>{{ data.runningTime | date: 'M/d/yyyy, h:mm a' }}</td>
+      <td>{{ data.duration }}</td>
+      <td class="td-action">
+        <a (click)="initModal.emit({ initMode: 'clone', initFormType: 
'customized', id: null, spec: data.spec })">
+          Clone
+        </a>
+        <nz-divider nzType="vertical"></nz-divider>
+        <a
+          (click)="
+            initModal.emit({ initMode: 'update', initFormType: 'customized', 
id: data.experimentId, spec: data.spec })
+          "
+        >
+          Update
+        </a>
+        <nz-divider nzType="vertical"></nz-divider>
+        <a
+          nz-popconfirm
+          nzPlacement="left"
+          nzTitle="Confirm to delete?"

Review comment:
       "Are you sure you want to delete?"




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[email protected]


Reply via email to