diff --git a/ui/src/components/header/HeaderNotice.vue b/ui/src/components/header/HeaderNotice.vue index f59c7b8b736..e8a12890948 100644 --- a/ui/src/components/header/HeaderNotice.vue +++ b/ui/src/components/header/HeaderNotice.vue @@ -88,9 +88,12 @@ export default { var result = json.queryasyncjobresultresponse if (result.jobstatus === 1 && this.jobs[i].status !== 'done') { hasUpdated = true - this.$notification.success({ - message: this.jobs[i].title, - description: this.jobs[i].description + const title = this.jobs[i].title + const description = this.jobs[i].description + this.$message.success({ + content: title + (description ? ' - ' + description : ''), + key: this.jobs[i].jobid, + duration: 2 }) this.jobs[i].status = 'done' } else if (result.jobstatus === 2 && this.jobs[i].status !== 'failed') { @@ -101,7 +104,8 @@ export default { } this.$notification.error({ message: this.jobs[i].title, - description: this.jobs[i].description + description: this.jobs[i].description, + duration: 0 }) } }).catch(function (e) { diff --git a/ui/src/utils/plugins.js b/ui/src/utils/plugins.js index 1c2d1f8261c..be843939893 100644 --- a/ui/src/utils/plugins.js +++ b/ui/src/utils/plugins.js @@ -16,6 +16,7 @@ // under the License. import _ from 'lodash' +import i18n from '@/locales' import { api } from '@/api' import { message, notification } from 'ant-design-vue' @@ -25,6 +26,7 @@ export const pollJobPlugin = { Vue.prototype.$pollJob = function (options) { /** * @param {String} jobId + * @param {String} [name=''] * @param {String} [successMessage=Success] * @param {Function} [successMethod=() => {}] * @param {String} [errorMessage=Error] @@ -32,11 +34,11 @@ export const pollJobPlugin = { * @param {String} [loadingMessage=Loading...] * @param {String} [catchMessage=Error caught] * @param {Function} [catchMethod=() => {}] - * @param {Number} [loadingDuration=3] * @param {Object} [action=null] */ const { jobId, + name = '', successMessage = 'Success', successMethod = () => {}, errorMessage = 'Error', @@ -44,26 +46,41 @@ export const pollJobPlugin = { loadingMessage = 'Loading...', catchMessage = 'Error caught', catchMethod = () => {}, - loadingDuration = 3, action = null } = options api('queryAsyncJobResult', { jobId }).then(json => { const result = json.queryasyncjobresultresponse - if (result.jobstatus === 1) { - message.success(successMessage) + var content = successMessage + if (successMessage === 'Success' && action && action.label) { + content = i18n.t(action.label) + } + if (name) { + content = content + ' - ' + name + } + message.success({ + content: content, + key: jobId, + duration: 2 + }) successMethod(result) } else if (result.jobstatus === 2) { notification.error({ message: errorMessage, - description: result.jobresult.errortext + description: result.jobresult.errortext, + duration: 0 }) errorMethod(result) } else if (result.jobstatus === 0) { - message - .loading(loadingMessage, loadingDuration) - .then(() => this.$pollJob(options, action)) + message.loading({ + content: loadingMessage, + key: jobId, + duration: 0 + }) + setTimeout(() => { + this.$pollJob(options, action) + }, 3000) } }).catch(e => { console.error(`${catchMessage} - ${e}`) diff --git a/ui/src/utils/request.js b/ui/src/utils/request.js index d2abe4fa1e0..79f55a56368 100644 --- a/ui/src/utils/request.js +++ b/ui/src/utils/request.js @@ -17,8 +17,8 @@ import Vue from 'vue' import axios from 'axios' -import store from '@/store' import config from '@/config/settings' +import store from '@/store' import { VueAxios } from './axios' import notification from 'ant-design-vue/es/notification' import { ACCESS_TOKEN, CURRENT_PROJECT } from '@/store/mutation-types' diff --git a/ui/src/views/AutogenView.vue b/ui/src/views/AutogenView.vue index 21a75f09623..470cdf3115e 100644 --- a/ui/src/views/AutogenView.vue +++ b/ui/src/views/AutogenView.vue @@ -701,6 +701,7 @@ export default { pollActionCompletion (jobId, action, resourceName) { this.$pollJob({ jobId, + name: resourceName, successMethod: result => { this.fetchData() if (action.response) { @@ -715,7 +716,7 @@ export default { } }, errorMethod: () => this.fetchData(), - loadingMessage: `${this.$t(action.label)} in progress for ${resourceName}`, + loadingMessage: `${this.$t(action.label)} - ${resourceName}`, catchMessage: 'Error encountered while fetching async job result', action }) @@ -808,10 +809,7 @@ export default { hasJobId = true break } else { - this.$notification.success({ - message: this.$t(this.currentAction.label), - description: resourceName - }) + this.$message.success(this.$t(this.currentAction.label) + (resourceName ? ' - ' + resourceName : '')) } } break