提交 5f7ecbdf 编写于 作者: 潘慧 提交者: Gitee

!1 optimized ui exception scenarios according to error code

Merge pull request !1 from 潘慧/phdev
......@@ -43,7 +43,6 @@
"lossFunc": "损失函数",
"learningRate": "学习率",
"modelSize": "模型大小",
"50540002": "Json数据解析失败",
"dataProcess": "数据处理"
},
"dataTraceback": {
......@@ -123,21 +122,9 @@
"queryLoading": "正在加载图,请稍候。",
"fullScreen": "全屏",
"tooManyNodes": "节点太多,打开失败",
"inputNodeName": "请输入节点名称",
"50540002": "当前训练作业已不存在,请选择其他训练作业进行查看。"
"inputNodeName": "请输入节点名称"
},
"error": {
"200": "请求成功。",
"202": "接受请求。",
"400": "请求错误。",
"401": "鉴权失败。",
"403": "没有操作权限。",
"404": "找不到资源。",
"408": "请求超时。",
"409": "请求冲突。",
"429": "请求数太多。",
"500": "服务器内部错误。",
"503": "服务不可用。",
"50540000": "系统错误",
"50540001": "参数类型错误,请检查请求参数类型是否都符合要求",
"50540002": "参数值错误,请检查请求参数值是否都符合要求",
......@@ -145,15 +132,20 @@
"50545001": "API 路由资源不存在",
"50545002": "请求API的HTTP方法错误",
"50545005": "训练作业不存在",
"50545006": "Summary日志路径无效",
"50545007": "Summary数据正在被加载,请等待Summary数据加载结束",
"50545009": "查询的节点不在图中",
"5054500A": "训练作业ID进行URL解码失败",
"5054500C": "计算图不存在,请刷新",
"5054500D": "图片数据不存在,请刷新",
"5054500E": "标量数据不存在,请刷新",
"50542082": "模型名称缺失",
"50542085": "模型名称不合法",
"50542215": "查询参数错误",
"50542216": "Summary log文件未找到",
"50542217": "Summary log路径错误",
"50542216": "Summary日志文件未找到",
"50542217": "Summary日志路径错误",
"50542218": "筛选参数错误"
}
}
......@@ -35,7 +35,6 @@ export default new Router({
component: () => import('./views/train-manage/summary-manage.vue'),
},
{
name: 'training-dashboard',
path: '/train-manage/training-dashboard',
component: () => import('./views/train-manage/training-dashboard.vue'),
},
......
......@@ -49,41 +49,21 @@ axios.interceptors.response.use(
const errorData = i18n.messages[i18n.locale].error;
// error returned by backend
if (error.response && error.response.data) {
if (error.response.data.error_code) {
// error code judgment
if (error.response.data.error_code.toString() === '50540002') {
if (router.currentRoute.path === '/train-manage/graph') {
const errorMsg = i18n.messages[i18n.locale].graph;
Vue.prototype.$message.error(errorMsg[error.response.data.error_code]);
} else if (error.config.headers.ignoreError
|| router.currentRoute.path === '/train-manage/training-dashboard') {
return Promise.reject(error);
} else if (router.currentRoute.path === '/model-traceback') {
const errorMsg = i18n.messages[i18n.locale].modelTraceback;
Vue.prototype.$message.error(errorMsg[error.response.data.error_code]);
} else if (errorData[error.response.data.error_code]) {
Vue.prototype.$message.error(errorData[error.response.data.error_code]);
}
} else if (error.response.data.error_code.toString() === '50545006') {
if (error.response && error.response.data && error.response.data.error_code) {
if (error.response.data.error_code.toString() === '50540005' ||
error.response.data.error_code.toString() === '50545006') {
if (error.config.headers.ignoreError ||
router.currentRoute.path === '/train-manage/training-dashboard') {
return Promise.reject(error);
} else if (error.response.data.error_code.toString() === '50542216' &&
router.currentRoute.path === '/train-manage/training-dashboard'
) {
return Promise.reject(error);
} else if (errorData[error.response.data.error_code]) {
Vue.prototype.$message.error(errorData[error.response.data.error_code]);
}
// return error data
} else if ( error.response.data.error_code.toString() === '50542216' &&
router.currentRoute.path === '/train-manage/training-dashboard') {
return Promise.reject(error);
} else {
if (error.response.data.status) {
if (errorData[error.response.data.status]) {
Vue.prototype.$message.error(errorData[error.response.data.status]);
}
return Promise.reject(error);
}
}
if (errorData[error.response.data.error_code]) {
Vue.prototype.$message.error(errorData[error.response.data.error_code]);
}
return Promise.reject(error);
} else {
// error returned by browser
if (error.code === 'ECONNABORTED' && /^timeout/.test(error.message)) {
......@@ -98,7 +78,9 @@ axios.interceptors.response.use(
return false;
} else {
// show network error
Vue.prototype.$message.error(i18n.messages[i18n.locale].public.netWorkError);
Vue.prototype.$message.error(
i18n.messages[i18n.locale].public.netWorkError,
);
return Promise.reject(error);
}
}
......
......@@ -91,11 +91,14 @@ export default {
},
// query single train job list(image/scalar/graph)
getSingleTrainJob(params) {
getSingleTrainJob(params, isIgnoreError) {
return axios({
method: 'get',
url: 'v1/mindinsight/datavisual/single-job',
params: params,
headers: {
ignoreError: isIgnoreError,
},
});
},
......
......@@ -70,7 +70,7 @@ limitations under the License.
<el-select @change="fileChange"
@visible-change="getSelectList"
:popper-append-to-body="false"
class='search file-search'
class='search'
v-model="fileSearchBox.value">
<el-option v-for="item in fileSearchBox.suggestions"
:key="item.value"
......@@ -82,6 +82,7 @@ limitations under the License.
<!-- Search box -->
<Autocomplete class='search'
v-model="searchBox.value"
:disabled="!fileSearchBox.value"
:fetch-suggestions="searchNodesNames"
:placeholder="$t('graph.inputNodeName')"
:popper-append-to-body="false"
......@@ -373,6 +374,7 @@ export default {
totalMemory: 16777216 * 2, // Memory size of the graph plug-in
graphviz: null,
graphvizTemp: null,
initOver: false,
};
},
computed: {},
......@@ -385,7 +387,7 @@ export default {
return;
}
this.trainJobID = this.$route.query.train_id;
this.getDatavisualPlugins(this.queryGraphData);
this.getDatavisualPlugins();
window.onresize = () => {
if (this.graphDom.el) {
this.initGraphRectData();
......@@ -813,14 +815,14 @@ export default {
},
/**
* To obtain datavisual plugins
* @param {Function} callback Call after get data visual plugins.
*/
getDatavisualPlugins(callback) {
getDatavisualPlugins() {
const params = {
train_id: this.trainJobID,
};
RequestService.getDatavisualPlugins(params)
.then((res) => {
this.fileSearchBox.suggestions = [];
if (
!res ||
!res.data ||
......@@ -828,21 +830,27 @@ export default {
!res.data.plugins.graph ||
!res.data.plugins.graph.length
) {
this.initOver = true;
return;
}
this.fileSearchBox.suggestions = [];
const tags = res.data.plugins.graph;
let hasFileSearchValue = false;
tags.forEach((k) => {
this.fileSearchBox.suggestions.push({
value: k,
});
hasFileSearchValue = k === this.fileSearchBox.value || hasFileSearchValue;
});
this.fileSearchBox.value = this.fileSearchBox.value || tags[0];
if (callback) {
callback();
if (!this.initOver) {
this.initOver = true;
this.fileSearchBox.value = tags.length ? tags[0] : '';
this.queryGraphData();
} else if (!hasFileSearchValue) {
this.fileSearchBox.value = '';
}
})
.catch(() => {
this.initOver = true;
this.loading.show = false;
});
},
......
......@@ -257,7 +257,7 @@ export default {
if (this.isTimeReload) {
this.autoUpdateSamples();
}
this.updateAllData();
this.updateAllData(false);
}
},
/**
......@@ -274,7 +274,10 @@ export default {
this.stopUpdateSamples();
}
},
timeReloadValue(newVal) {
/**
*The refresh time is changed
*/
timeReloadValue() {
this.autoUpdateSamples();
},
},
......@@ -295,6 +298,10 @@ export default {
mounted() {
this.getCharMainContentwidth();
this.getTagAndRunList();
// Automatic refresh
if (this.isTimeReload) {
this.autoUpdateSamples();
}
},
methods: {
......@@ -306,7 +313,7 @@ export default {
plugin_name: 'image',
train_id: this.trainingJobId,
};
RequestService.getSingleTrainJob(params)
RequestService.getSingleTrainJob(params, false)
.then((res) => {
if (!res || !res.data || !res.data.train_jobs) {
this.initOver = true;
......@@ -371,11 +378,6 @@ export default {
// Obtains data on the current page
this.getCurPageDataArr();
// Automatic refresh
if (this.isTimeReload) {
this.autoUpdateSamples();
}
}, this.requestErrorCallback)
.catch((e) => {
this.$message.error(this.$t('public.dataError'));
......@@ -445,8 +447,13 @@ export default {
];
}
this.$forceUpdate();
})
.catch((e) => {});
}, (e) => {
sampleItem.totalStepNum = 0;
sampleItem.sliderValue = 0;
sampleItem.curStep = '';
sampleItem.curImgUrl = '';
sampleItem.curTime = '';
}).catch((e) => {});
});
},
/**
......@@ -880,13 +887,14 @@ export default {
},
/**
* Update all data.
* @param {Boolean} ignoreError whether ignore error tip
*/
updateAllData() {
updateAllData(ignoreError) {
const params = {
plugin_name: 'image',
train_id: this.trainingJobId,
};
RequestService.getSingleTrainJob(params)
RequestService.getSingleTrainJob(params, ignoreError)
.then((res) => {
if (this.isReloading) {
this.$store.commit('setIsReload', false);
......@@ -927,7 +935,7 @@ export default {
}
this.autoUpdateTimer = setInterval(() => {
this.$store.commit('clearToken');
this.updateAllData();
this.updateAllData(true);
}, this.timeReloadValue * 1000);
},
/**
......
......@@ -509,7 +509,7 @@ export default {
backgroundColor: 'white',
parallelAxis: parallelAxis,
parallel: {
top: 20,
top: 25,
left: 50,
right: 80,
bottom: 10,
......
......@@ -564,7 +564,11 @@ export default {
ajaxArr.push(this.addAjax(params, yIndex));
});
Promise.all(ajaxArr)
Promise.all(ajaxArr.map(function(promiseItem) {
return promiseItem.catch(function(err) {
return err;
});
}))
.then((res) => {
if (!res) {
return;
......@@ -701,7 +705,7 @@ export default {
formatter(value) {
const symbol = Math.abs(value);
if (symbol.toString().length > 6) {
return value.toExponential(0);
return value.toExponential(4);
} else if (value >= 1000 || value <= -1000) {
return parseFloat((value / 1000).toFixed(2)) + 'k';
} else if (value > 0) {
......@@ -752,8 +756,8 @@ export default {
show: false,
},
grid: {
left: 60,
right: 60,
left: 80,
right: 80,
},
xAxis: [
{
......@@ -953,7 +957,7 @@ export default {
}
const symbol = Math.abs(value);
if (symbol.toString().length > 6) {
return value.toExponential(2);
return value.toExponential(4);
} else if (value > 0) {
return value;
} else {
......
......@@ -268,7 +268,7 @@ export default {
if (this.isTimeReload) {
this.autoUpdateSamples();
}
this.updateAllData();
this.updateAllData(false);
}
},
/**
......@@ -285,15 +285,8 @@ export default {
}
},
timeReloadValue(newVal) {
if (this.autoUpdateTimer) {
clearInterval(this.autoUpdateTimer);
this.autoUpdateTimer = null;
}
this.autoUpdateTimer = setInterval(() => {
this.$store.commit('clearToken');
this.updateAllData();
}, newVal * 1000);
timeReloadValue() {
this.autoUpdateSamples();
},
},
destroyed() {
......@@ -343,6 +336,11 @@ export default {
this.getScalarsList();
this.firstNum = 1;
// auto refresh
if (this.isTimeReload) {
this.autoUpdateSamples();
}
});
},
methods: {
......@@ -354,7 +352,7 @@ export default {
plugin_name: 'scalar',
train_id: this.trainingJobId,
};
RequestService.getSingleTrainJob(params)
RequestService.getSingleTrainJob(params, false)
.then((res) => {
// error;
if (
......@@ -436,11 +434,6 @@ export default {
// Refresh the chart data on the current page
this.freshCurPageData();
}
// auto refresh
if (this.isTimeReload) {
this.autoUpdateSamples();
}
}, this.requestErrorCallback)
.catch((e) => {
this.$message.error(this.$t('public.dataError'));
......@@ -506,22 +499,28 @@ export default {
promiseArr.push(this.addPromise(params));
Promise.all(promiseArr)
Promise.all(promiseArr.map(function(promiseItem) {
return promiseItem.catch(function(err) {
return err;
});
}))
.then((res) => {
// error
if (!res || !res.length) {
return;
}
if (sampleObject.charObj) {
sampleObject.charObj.showLoading();
}
let scalarIndex = 0;
let hasInvalidData = false;
for (let i = 0; i < res.length; i++) {
if (!res[i] || !res[i].data) {
sampleObject.charObj.clear();
return;
}
if (sampleObject.charObj) {
sampleObject.charObj.showLoading();
}
const resData = res[i].data;
const tempObject = {
......@@ -764,7 +763,7 @@ export default {
}
const symbol = Math.abs(value);
if (symbol.toString().length > 6) {
return value.toExponential(0);
return value.toExponential(4);
} else if (value >= 1000 || value <= -1000) {
return parseFloat((value / 1000).toFixed(2)) + 'k';
} else if (value > 0) {
......@@ -776,7 +775,8 @@ export default {
},
},
grid: {
left: 60,
left: 80,
right: 10,
},
animation: true,
dataZoom: [
......@@ -910,7 +910,6 @@ export default {
},
toolbox: {
top: 20,
right: '10%',
emphasis: {
iconStyle: {
......@@ -1519,14 +1518,15 @@ export default {
/**
* Updating Sliding Block Data
* @param {Boolean} ignoreError whether ignore error tip
*/
updateAllData() {
updateAllData(ignoreError) {
const params = {
plugin_name: 'scalar',
train_id: this.trainingJobId,
};
RequestService.getSingleTrainJob(params)
RequestService.getSingleTrainJob(params, ignoreError)
.then((res) => {
if (this.isReloading) {
this.$store.commit('setIsReload', false);
......@@ -1600,7 +1600,7 @@ export default {
}
this.autoUpdateTimer = setInterval(() => {
this.$store.commit('clearToken');
this.updateAllData();
this.updateAllData(true);
}, this.timeReloadValue * 1000);
},
......@@ -1728,7 +1728,7 @@ export default {
}
const symbol = Math.abs(value);
if (symbol.toString().length > 6) {
return value.toExponential(2);
return value.toExponential(4);
} else if (value > 0) {
return value;
} else {
......@@ -2022,6 +2022,7 @@ export default {
overflow-y: auto;
display: flex;
flex-wrap: wrap;
padding-right: 10px;
.data-content {
display: flex;
......
......@@ -24,12 +24,12 @@ limitations under the License.
</div>
<div class="cl-dashboard-center">
<div class="cl-dashboard-con-up"
:class="curPageArr.length ? '' : 'no-data-hover'"
:class="curPageArr.length && !wrongPlugin ? '' : 'no-data-hover'"
@click="viewMoreScalars">
<div class="cl-dashboard-title"> {{$t("trainingDashboard.trainingScalar")}}</div>
<div class="cl-module">
<div class="cl-scalar-tagName"
v-if="curPageArr.length">
v-if="curPageArr.length && !wrongPlugin">
<div v-for="(sampleItem,index) in curPageArr"
:key="index"
:class="['tagNameLeft',index==1? 'tagNameRight':'']">
......@@ -37,10 +37,10 @@ limitations under the License.
</div>
</div>
<div id="module-chart"
v-if="curPageArr.length"
v-if="curPageArr.length && !wrongPlugin"
key="chart-data"></div>
<div class="no-data-img"
v-if="!curPageArr.length"
v-if="!curPageArr.length || wrongPlugin"
key="no-chart-data">
<img :src="require('@/assets/images/nodata.png')"
alt="" />
......@@ -51,7 +51,7 @@ limitations under the License.
</div>
</div>
<div class="cl-dashboard-con-up"
:class="firstFloorNodes.length ? '' : 'no-data-hover'"
:class="firstFloorNodes.length && !wrongPlugin ? '' : 'no-data-hover'"
@click="jumpToGraph">
<div class="cl-dashboard-title">
{{$t("trainingDashboard.calculationChart")}}
......@@ -59,9 +59,9 @@ limitations under the License.
<div class="cl-module">
<div id="graph"
class="graph"
v-show="firstFloorNodes.length"></div>
v-show="firstFloorNodes.length && !wrongPlugin"></div>
<div class="no-data-img"
v-show="!firstFloorNodes.length">
v-show="!firstFloorNodes.length || wrongPlugin">
<img :src="require('@/assets/images/nodata.png')"
alt="" />
<p class='no-data-text'>
......@@ -71,16 +71,16 @@ limitations under the License.
</div>
</div>
<div class="cl-dashboard-con-up"
:class="showDatasetGraph ? '' : 'no-data-hover'"
:class="showDatasetGraph && !wrongPlugin ? '' : 'no-data-hover'"
@click="jumpToDataMap">
<div class="cl-dashboard-title"> {{$t("trainingDashboard.dataMap")}}</div>
<div class="cl-module">
<div id="dataMapGraph"
class="graph"
v-show="showDatasetGraph"></div>
v-show="showDatasetGraph && !wrongPlugin"></div>
<div class="no-data-img"
key="no-chart-data"
v-show="!showDatasetGraph">
v-show="!showDatasetGraph || wrongPlugin">
<img :src="require('@/assets/images/nodata.png')"
alt="" />
<p class='no-data-text'>
......@@ -90,7 +90,7 @@ limitations under the License.
</div>
</div>
<div class="cl-dashboard-con-up"
:class="originImageDataArr.length ? '' : 'no-data-hover'"
:class="originImageDataArr.length && !wrongPlugin ? '' : 'no-data-hover'"
@click="linkToImage($event)">
<div class="cl-dashboard-title">
<div class="cl-dashboard-title-left"> {{$t("trainingDashboard.samplingData")}}</div>
......@@ -104,15 +104,15 @@ limitations under the License.
</div>
<div class="cl-module">
<div class="image-container"
:class="originImageDataArr.length ? '' : 'no-data-img'">
:class="originImageDataArr.length && !wrongPlugin ? '' : 'no-data-img'">
<img class="sample-img select-disable"
:src="curImageShowSample.curImgUrl"
v-if="originImageDataArr.length">
v-if="originImageDataArr.length && !wrongPlugin">
<img :src="require('@/assets/images/nodata.png')"
alt=""
v-if=" !originImageDataArr.length">
v-if="!originImageDataArr.length || wrongPlugin">
<p class='no-data-text'
v-if=" !originImageDataArr.length">
v-if=" !originImageDataArr.length || wrongPlugin">
{{$t("public.noData")}}
</p>
</div>
......@@ -157,6 +157,7 @@ export default {
showDatasetGraph: false,
datasetGraphviz: {},
reloadStopTime: 1000,
wrongPlugin: false,
};
},
computed: {
......@@ -268,20 +269,30 @@ export default {
train_id: this.trainingJobId,
manual_update: fromInit || false,
};
RequestService.getDatavisualPlugins(params).then((res) => {
if (!res || !res.data || !res.data.plugins) {
return;
}
const data = res.data.plugins;
const imageTags = data.image || [];
const scalarTags = data.scalar || [];
const graphIds = data.graph || [];
this.dealImageData(imageTags);
this.getScalarList(scalarTags);
if (!this.firstFloorNodes.length && graphIds.length) {
this.queryGraphData();
}
});
RequestService.getDatavisualPlugins(params)
.then((res) => {
this.wrongPlugin = false;
if (!res || !res.data || !res.data.plugins) {
return;
}
const data = res.data.plugins;
const imageTags = data.image || [];
const scalarTags = data.scalar || [];
const graphIds = data.graph || [];
this.dealImageData(imageTags);
this.getScalarList(scalarTags);
if (!this.firstFloorNodes.length && graphIds.length) {
this.queryGraphData();
}
})
.catch((error)=>{
if (!error.response || !error.response.data || !error.response.data.error_code) {
return;
}
if (error.response.data.error_code.toString() === '50545005') {
this.wrongPlugin = true;
}
});
},
/**
......@@ -369,7 +380,7 @@ export default {
plugin_name: 'scalar',
train_id: this.trainingJobId,
};
RequestService.getSingleTrainJob(params)
RequestService.getSingleTrainJob(params, true)
.then((res) => {
if (
!res ||
......@@ -598,13 +609,14 @@ export default {
const tempOption = {
legend: {
data: legendData,
selectedMode: false,
icon: 'circle',
bottom: 0,
},
grid: {
top: 20,
bottom: 50,
left: 60,
left: 66,
right: 60,
},
xAxis: [
......@@ -1448,7 +1460,6 @@ export default {
z-index: 999;
line-height: 22px;
display: flex;
margin-top: 18px;
font-weight: 600;
.tagNameLeft {
text-align: left;
......@@ -1533,7 +1544,7 @@ export default {
// Public Style End
#module-chart {
height: calc(100% - 60px);
height: calc(100% - 22px);
canvas {
cursor: pointer;
}
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册