Skip to content
This repository has been archived by the owner on Sep 18, 2024. It is now read-only.

Commit

Permalink
[WebUI] Fix issue#458 about final result as dict (#563)
Browse files Browse the repository at this point in the history 
* [WebUI] Fix issue#458 about final result as dict

* Fix comments

* fix bug
  • Loading branch information
@lvybriage @yds05
lvybriage authored and yds05 committed Jan 8, 2019
1 parent 95d1947 commit f437107
Show file tree
Hide file tree
Showing 8 changed files with 462 additions and 179 deletions.
4 changes: 4 additions & 0 deletions src/webui/src/components/Overview.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -209,6 +209,10 @@ class Overview extends React.Component<{}, OverviewState> {
profile.failTrial += 1;
break;

case 'RUNNING':
profile.runTrial += 1;
break;

case 'USER_CANCELED':
case 'SYS_CANCELED':
profile.stopTrial += 1;
Expand Down
58 changes: 39 additions & 19 deletions src/webui/src/components/TrialsDetail.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import * as React from 'react';
import axios from 'axios';
import { MANAGER_IP } from '../static/const';
import { Row, Col, Tabs, Input, Select } from 'antd';
import { Row, Col, Tabs, Input, Select, Button } from 'antd';
const Option = Select.Option;
import { TableObj, Parameters, DetailAccurPoint, TooltipForAccuracy } from '../static/interface';
import { getFinalResult } from '../static/function';
import { TableObjFianl, Parameters, DetailAccurPoint, TooltipForAccuracy } from '../static/interface';
import { getFinalResult, getFinal } from '../static/function';
import Accuracy from './overview/Accuracy';
import Duration from './trial-detail/Duration';
import Title1 from './overview/Title1';
Expand All @@ -16,8 +16,8 @@ import '../static/style/trialsDetail.scss';
interface TrialDetailState {
accSource: object;
accNodata: string;
tableListSource: Array<TableObj>;
searchResultSource: Array<TableObj>;
tableListSource: Array<TableObjFianl>;
searchResultSource: Array<TableObjFianl>;
isHasSearch: boolean;
experimentStatus: string;
entriesTable: number;
Expand All @@ -30,6 +30,8 @@ class TrialsDetail extends React.Component<{}, TrialDetailState> {
public interTableList = 1;
public interAllTableList = 2;

public tableList: TableList | null;

constructor(props: {}) {
super(props);

Expand All @@ -40,7 +42,7 @@ class TrialsDetail extends React.Component<{}, TrialDetailState> {
searchResultSource: [],
experimentStatus: '',
entriesTable: 20,
isHasSearch: false
isHasSearch: false,
};
}
// trial accuracy graph
Expand Down Expand Up @@ -132,7 +134,7 @@ class TrialsDetail extends React.Component<{}, TrialDetailState> {
.then(res => {
if (res.status === 200) {
const trialJobs = res.data;
const trialTable: Array<TableObj> = [];
const trialTable: Array<TableObjFianl> = [];
Object.keys(trialJobs).map(item => {
// only succeeded trials have finalMetricData
let desc: Parameters = {
Expand Down Expand Up @@ -167,7 +169,7 @@ class TrialsDetail extends React.Component<{}, TrialDetailState> {
if (trialJobs[item].logPath !== undefined) {
desc.logPath = trialJobs[item].logPath;
}
const acc = getFinalResult(trialJobs[item].finalMetricData);
const acc = getFinal(trialJobs[item].finalMetricData);
trialTable.push({
key: trialTable.length,
sequenceId: trialJobs[item].sequenceId,
Expand All @@ -185,7 +187,7 @@ class TrialsDetail extends React.Component<{}, TrialDetailState> {
Object.keys(searchResultSource).map(index => {
temp.push(searchResultSource[index].id);
});
const searchResultList: Array<TableObj> = [];
const searchResultList: Array<TableObjFianl> = [];
for (let i = 0; i < temp.length; i++) {
Object.keys(trialTable).map(key => {
const item = trialTable[key];
Expand Down Expand Up @@ -217,7 +219,7 @@ class TrialsDetail extends React.Component<{}, TrialDetailState> {
.then(res => {
if (res.status === 200) {
const trialJobs = res.data;
const trialTable: Array<TableObj> = [];
const trialTable: Array<TableObjFianl> = [];
Object.keys(trialJobs).map(item => {
// only succeeded trials have finalMetricData
let desc: Parameters = {
Expand Down Expand Up @@ -252,7 +254,7 @@ class TrialsDetail extends React.Component<{}, TrialDetailState> {
if (trialJobs[item].logPath !== undefined) {
desc.logPath = trialJobs[item].logPath;
}
const acc = getFinalResult(trialJobs[item].finalMetricData);
const acc = getFinal(trialJobs[item].finalMetricData);
trialTable.push({
key: trialTable.length,
sequenceId: trialJobs[item].sequenceId,
Expand Down Expand Up @@ -308,7 +310,7 @@ class TrialsDetail extends React.Component<{}, TrialDetailState> {
} else {
window.clearInterval(this.interAllTableList);
const { tableListSource } = this.state;
const searchResultList: Array<TableObj> = [];
const searchResultList: Array<TableObjFianl> = [];
Object.keys(tableListSource).map(key => {
const item = tableListSource[key];
if (item.sequenceId.toString() === targetValue || item.id.includes(targetValue)) {
Expand Down Expand Up @@ -364,6 +366,10 @@ class TrialsDetail extends React.Component<{}, TrialDetailState> {
}
}

test = () => {
alert('TableList component was not properly initialized.');
}

componentDidMount() {

this._isMounted = true;
Expand Down Expand Up @@ -429,13 +435,26 @@ class TrialsDetail extends React.Component<{}, TrialDetailState> {
<span>entries</span>
</Col>
<Col span={12} className="right">
{/* <span>Search:</span> */}
<Input
type="text"
placeholder="search by Trial No. and id"
onChange={this.searchTrial}
style={{ width: 200, marginLeft: 6 }}
/>
<Row>
<Col span={12}>
<Button
type="primary"
className="tableButton editStyle"
onClick={this.tableList ? this.tableList.addColumn : this.test}
>
AddColumn
</Button>
</Col>
<Col span={12}>
{/* <span>Search:</span> */}
<Input
type="text"
placeholder="search by Trial No. and id"
onChange={this.searchTrial}
style={{ width: 200, marginLeft: 6 }}
/>
</Col>
</Row>
</Col>
</Row>
<TableList
Expand All @@ -444,6 +463,7 @@ class TrialsDetail extends React.Component<{}, TrialDetailState> {
updateList={this.drawTableList}
searchResult={searchResultSource}
isHasSearch={isHasSearch}
ref={(tabList) => this.tableList = tabList}
/>
</div>
);
Expand Down
16 changes: 8 additions & 8 deletions src/webui/src/components/overview/Progress.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -242,45 +242,45 @@ class Progressed extends React.Component<ProgressProps, ProgressState> {
maxString={`MaxTrialNumber: ${trialProfile.MaxTrialNum}`}
/>
<Row className="basic colorOfbasic mess">
<p>Best Default Metric</p>
<p>best metric</p>
<div>{bestAccuracy}</div>
</Row>
<Row className="mess">
<Col span={8}>
<Row className="basic colorOfbasic">
<p>Time Spent</p>
<p>spent</p>
<div>{convertTime(trialProfile.execDuration)}</div>
</Row>
</Col>
<Col span={9}>
<Row className="basic colorOfbasic">
<p>Remaining Time</p>
<p>remaining</p>
<div>{remaining}</div>
</Row>
</Col>
<Col span={7}>
<Row className="basic colorOfbasic">
<p>MaxDuration</p>
<div>{convertTime(trialProfile.maxDuration)}</div>
<p>running</p>
<div>{trialNumber.runTrial}</div>
</Row>
</Col>
</Row>
<Row className="mess">
<Col span={8}>
<Row className="basic colorOfbasic">
<p>Succeed Trial</p>
<p>succeed</p>
<div>{trialNumber.succTrial}</div>
</Row>
</Col>
<Col span={9}>
<Row className="basic">
<p>Stopped Trial</p>
<p>stopped</p>
<div>{trialNumber.stopTrial}</div>
</Row>
</Col>
<Col span={7}>
<Row className="basic">
<p>Failed Trial</p>
<p>failed</p>
<div>{trialNumber.failTrial}</div>
</Row>
</Col>
Expand Down
Loading

0 comments on commit f437107

Please sign in to comment.