diff --git a/mindinsight/ui/src/locales/zh-cn.json b/mindinsight/ui/src/locales/zh-cn.json index 5c4eceaa..d1c07f77 100644 --- a/mindinsight/ui/src/locales/zh-cn.json +++ b/mindinsight/ui/src/locales/zh-cn.json @@ -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": "筛选参数错误" } } diff --git a/mindinsight/ui/src/router.js b/mindinsight/ui/src/router.js index 1539a688..4ffa43f8 100644 --- a/mindinsight/ui/src/router.js +++ b/mindinsight/ui/src/router.js @@ -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'), }, diff --git a/mindinsight/ui/src/services/fetcher.js b/mindinsight/ui/src/services/fetcher.js index c768efe6..ae095f76 100644 --- a/mindinsight/ui/src/services/fetcher.js +++ b/mindinsight/ui/src/services/fetcher.js @@ -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); } } diff --git a/mindinsight/ui/src/services/request-service.js b/mindinsight/ui/src/services/request-service.js index cca6ac99..652a84ef 100644 --- a/mindinsight/ui/src/services/request-service.js +++ b/mindinsight/ui/src/services/request-service.js @@ -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, + }, }); }, diff --git a/mindinsight/ui/src/views/train-manage/graph.vue b/mindinsight/ui/src/views/train-manage/graph.vue index 46c412c9..5356ab00 100644 --- a/mindinsight/ui/src/views/train-manage/graph.vue +++ b/mindinsight/ui/src/views/train-manage/graph.vue @@ -70,7 +70,7 @@ limitations under the License. { 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; }); }, diff --git a/mindinsight/ui/src/views/train-manage/image.vue b/mindinsight/ui/src/views/train-manage/image.vue index 9fdb29ac..1b6725f5 100644 --- a/mindinsight/ui/src/views/train-manage/image.vue +++ b/mindinsight/ui/src/views/train-manage/image.vue @@ -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); }, /** diff --git a/mindinsight/ui/src/views/train-manage/model-traceback.vue b/mindinsight/ui/src/views/train-manage/model-traceback.vue index fd2ed0d4..b6159c51 100644 --- a/mindinsight/ui/src/views/train-manage/model-traceback.vue +++ b/mindinsight/ui/src/views/train-manage/model-traceback.vue @@ -509,7 +509,7 @@ export default { backgroundColor: 'white', parallelAxis: parallelAxis, parallel: { - top: 20, + top: 25, left: 50, right: 80, bottom: 10, diff --git a/mindinsight/ui/src/views/train-manage/scalar-compare.vue b/mindinsight/ui/src/views/train-manage/scalar-compare.vue index 4b36d17a..7a9d33dd 100644 --- a/mindinsight/ui/src/views/train-manage/scalar-compare.vue +++ b/mindinsight/ui/src/views/train-manage/scalar-compare.vue @@ -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 { diff --git a/mindinsight/ui/src/views/train-manage/scalar.vue b/mindinsight/ui/src/views/train-manage/scalar.vue index 01a49469..7978874b 100644 --- a/mindinsight/ui/src/views/train-manage/scalar.vue +++ b/mindinsight/ui/src/views/train-manage/scalar.vue @@ -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; diff --git a/mindinsight/ui/src/views/train-manage/training-dashboard.vue b/mindinsight/ui/src/views/train-manage/training-dashboard.vue index e735762e..53952728 100644 --- a/mindinsight/ui/src/views/train-manage/training-dashboard.vue +++ b/mindinsight/ui/src/views/train-manage/training-dashboard.vue @@ -24,12 +24,12 @@ limitations under the License.
{{$t("trainingDashboard.trainingScalar")}}
+ v-if="curPageArr.length && !wrongPlugin">
@@ -37,10 +37,10 @@ limitations under the License.
@@ -51,7 +51,7 @@ limitations under the License.
{{$t("trainingDashboard.calculationChart")}} @@ -59,9 +59,9 @@ limitations under the License.
+ v-show="firstFloorNodes.length && !wrongPlugin">
+ v-show="!firstFloorNodes.length || wrongPlugin">

@@ -71,16 +71,16 @@ limitations under the License.

{{$t("trainingDashboard.dataMap")}}
+ v-show="showDatasetGraph && !wrongPlugin">
+ v-show="!showDatasetGraph || wrongPlugin">

@@ -90,7 +90,7 @@ limitations under the License.

{{$t("trainingDashboard.samplingData")}}
@@ -104,15 +104,15 @@ limitations under the License.
+ :class="originImageDataArr.length && !wrongPlugin ? '' : 'no-data-img'"> + v-if="originImageDataArr.length && !wrongPlugin"> + v-if="!originImageDataArr.length || wrongPlugin">

+ v-if=" !originImageDataArr.length || wrongPlugin"> {{$t("public.noData")}}

@@ -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; }