apache · nvazquez · Jul 19, 2021 · Mar 10, 2021 · Mar 10, 2021 · Mar 10, 2021
diff --git a/ui/src/components/header/HeaderNotice.vue b/ui/src/components/header/HeaderNotice.vue
@@ -32,24 +32,23 @@
               <a-button size="small" slot="description" @click="clearJobs">{{ $t('label.clear.list') }}</a-button>
             </a-list-item-meta>
           </a-list-item>
-          <a-list-item v-for="(job, index) in jobs" :key="index">
-            <a-list-item-meta :title="job.title" :description="job.description">
-              <a-avatar :style="notificationAvatar[job.status].style" :icon="notificationAvatar[job.status].icon" slot="avatar"/>
+          <a-list-item v-for="(notice, index) in notices" :key="index">
+            <a-list-item-meta :title="notice.title" :description="notice.description">
+              <a-avatar :style="notificationAvatar[notice.status].style" :icon="notificationAvatar[notice.status].icon" slot="avatar"/>
             </a-list-item-meta>
           </a-list-item>
         </a-list>
       </a-spin>
     </template>
     <span @click="showNotifications" class="header-notice-opener">
-      <a-badge :count="jobs.length">
+      <a-badge :count="notices.length">
         <a-icon class="header-notice-icon" type="bell" />
       </a-badge>
     </span>
   </a-popover>
 </template>
 
 <script>
-import { api } from '@/api'
 import store from '@/store'
 
 export default {
@@ -58,7 +57,7 @@ export default {
     return {
       loading: false,
       visible: false,
-      jobs: [],
+      notices: [],
       poller: null,
       notificationAvatar: {
         done: { icon: 'check-circle', style: 'backgroundColor:#87d068' },
@@ -72,66 +71,17 @@ export default {
       this.visible = !this.visible
     },
     clearJobs () {
-      this.jobs = this.jobs.filter(x => x.status === 'progress')
-      this.$store.commit('SET_ASYNC_JOB_IDS', this.jobs)
-    },
-    startPolling () {
-      this.poller = setInterval(() => {
-        this.pollJobs()
-      }, 4000)
-    },
-    async pollJobs () {
-      var hasUpdated = false
-      for (var i in this.jobs) {
-        if (this.jobs[i].status === 'progress') {
-          await api('queryAsyncJobResult', { jobid: this.jobs[i].jobid }).then(json => {
-            var result = json.queryasyncjobresultresponse
-            if (result.jobstatus === 1 && this.jobs[i].status !== 'done') {
-              hasUpdated = true
-              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') {
-              hasUpdated = true
-              this.jobs[i].status = 'failed'
-              if (result.jobresult.errortext !== null) {
-                this.jobs[i].description = '(' + this.jobs[i].description + ') ' + result.jobresult.errortext
-              }
-              this.$notification.error({
-                message: this.jobs[i].title,
-                description: this.jobs[i].description,
-                key: this.jobs[i].jobid,
-                duration: 0
-              })
-            }
-          }).catch(function (e) {
-            console.log(this.$t('error.fetching.async.job.result') + e)
-          })
-        }
-      }
-      if (hasUpdated) {
-        this.$store.commit('SET_ASYNC_JOB_IDS', this.jobs.reverse())
-      }
+      this.notices = this.notices.filter(x => x.status === 'progress')
+      this.$store.commit('SET_HEADER_NOTICES', this.notices)
     }
   },
-  beforeDestroy () {
-    clearInterval(this.poller)
-  },
-  created () {
-    this.startPolling()
-  },
   mounted () {
-    this.jobs = (store.getters.asyncJobIds || []).reverse()
+    this.notices = (store.getters.headerNotices || []).reverse()
     this.$store.watch(
-      (state, getters) => getters.asyncJobIds,
+      (state, getters) => getters.headerNotices,
       (newValue, oldValue) => {
         if (oldValue !== newValue && newValue !== undefined) {
-          this.jobs = newValue.reverse()
+          this.notices = newValue.reverse()
         }
       }
     )

diff --git a/ui/src/components/view/ActionButton.vue b/ui/src/components/view/ActionButton.vue
@@ -143,6 +143,7 @@ export default {
       this.actionBadge = {}
       const arrAsync = []
       const actionBadge = this.actions.filter(action => action.showBadge === true)
+      if ((actionBadge.dataView ? actionBadge.dataView : false) !== this.dataView) return
 
       if (actionBadge && actionBadge.length > 0) {
         const dataLength = actionBadge.length

diff --git a/ui/src/components/view/DedicateData.vue b/ui/src/components/view/DedicateData.vue
@@ -175,20 +175,13 @@ export default {
       }).then(response => {
         this.$pollJob({
           jobId: response.releasededicatedzoneresponse.jobid,
+          title: this.$t('label.release.dedicated.zone'),
+          description: this.resource.id,
           successMessage: this.$t('message.dedicated.zone.released'),
           successMethod: () => {
-            this.parentFetchData()
             this.dedicatedDomainId = null
-            this.$store.dispatch('AddAsyncJob', {
-              title: this.$t('message.dedicated.zone.released'),
-              jobid: response.releasededicatedzoneresponse.jobid,
-              status: 'progress'
-            })
           },
           errorMessage: this.$t('error.release.dedicate.zone'),
-          errorMethod: () => {
-            this.parentFetchData()
-          },
           loadingMessage: this.$t('message.releasing.dedicated.zone'),
           catchMessage: this.$t('error.fetching.async.job.result'),
           catchMethod: () => {
@@ -205,20 +198,13 @@ export default {
       }).then(response => {
         this.$pollJob({
           jobId: response.releasededicatedpodresponse.jobid,
+          title: this.$t('label.release.dedicated.pod'),
+          description: this.resource.id,
           successMessage: this.$t('message.pod.dedication.released'),
           successMethod: () => {
-            this.parentFetchData()
             this.dedicatedDomainId = null
-            this.$store.dispatch('AddAsyncJob', {
-              title: this.$t('message.pod.dedication.released'),
-              jobid: response.releasededicatedpodresponse.jobid,
-              status: 'progress'
-            })
           },
           errorMessage: this.$t('error.release.dedicate.pod'),
-          errorMethod: () => {
-            this.parentFetchData()
-          },
           loadingMessage: this.$t('message.releasing.dedicated.pod'),
           catchMessage: this.$t('error.fetching.async.job.result'),
           catchMethod: () => {
@@ -235,20 +221,13 @@ export default {
       }).then(response => {
         this.$pollJob({
           jobId: response.releasededicatedclusterresponse.jobid,
+          title: this.$t('label.release.dedicated.cluster'),
+          description: this.resource.id,
           successMessage: this.$t('message.cluster.dedication.released'),
           successMethod: () => {
-            this.parentFetchData()
             this.dedicatedDomainId = null
-            this.$store.dispatch('AddAsyncJob', {
-              title: this.$t('message.cluster.dedication.released'),
-              jobid: response.releasededicatedclusterresponse.jobid,
-              status: 'progress'
-            })
           },
           errorMessage: this.$t('error.release.dedicate.cluster'),
-          errorMethod: () => {
-            this.parentFetchData()
-          },
           loadingMessage: this.$t('message.releasing.dedicated.cluster'),
           catchMessage: this.$t('error.fetching.async.job.result'),
           catchMethod: () => {
@@ -265,20 +244,13 @@ export default {
       }).then(response => {
         this.$pollJob({
           jobId: response.releasededicatedhostresponse.jobid,
+          title: this.$t('label.release.dedicated.host'),
+          description: this.resource.id,
           successMessage: this.$t('message.host.dedication.released'),
           successMethod: () => {
-            this.parentFetchData()
             this.dedicatedDomainId = null
-            this.$store.dispatch('AddAsyncJob', {
-              title: this.$t('message.host.dedication.released'),
-              jobid: response.releasededicatedhostresponse.jobid,
-              status: 'progress'
-            })
           },
           errorMessage: this.$t('error.release.dedicate.host'),
-          errorMethod: () => {
-            this.parentFetchData()
-          },
           loadingMessage: this.$t('message.releasing.dedicated.host'),
           catchMessage: this.$t('error.fetching.async.job.result'),
           catchMethod: () => {

diff --git a/ui/src/components/view/DedicateModal.vue b/ui/src/components/view/DedicateModal.vue
@@ -93,22 +93,16 @@ export default {
       }).then(response => {
         this.$pollJob({
           jobId: response.dedicatezoneresponse.jobid,
-          successMessage: this.$t('label.zone.dedicated'),
+          title: this.$t('label.dedicate.zone'),
+          description: `${this.$t('label.domain.id')} : ${this.domainId}`,
+          successMessage: `${this.$t('label.zone.dedicated')}`,
           successMethod: () => {
-            this.parentFetchData()
             this.fetchParentData()
             this.dedicatedDomainId = this.domainId
             this.dedicatedDomainModal = false
-            this.$store.dispatch('AddAsyncJob', {
-              title: this.$t('label.zone.dedicated'),
-              jobid: response.dedicatezoneresponse.jobid,
-              description: `${this.$t('label.domain.id')} : ${this.dedicatedDomainId}`,
-              status: 'progress'
-            })
           },
           errorMessage: this.$t('error.dedicate.zone.failed'),
           errorMethod: () => {
-            this.parentFetchData()
             this.fetchParentData()
             this.dedicatedDomainModal = false
           },
@@ -137,22 +131,16 @@ export default {
       }).then(response => {
         this.$pollJob({
           jobId: response.dedicatepodresponse.jobid,
+          title: this.$t('label.dedicate.pod'),
+          description: `${this.$t('label.domain.id')} : ${this.domainId}`,
           successMessage: this.$t('label.pod.dedicated'),
           successMethod: () => {
-            this.parentFetchData()
             this.fetchParentData()
             this.dedicatedDomainId = this.domainId
             this.dedicatedDomainModal = false
-            this.$store.dispatch('AddAsyncJob', {
-              title: this.$t('label.pod.dedicated'),
-              jobid: response.dedicatepodresponse.jobid,
-              description: `${this.$t('label.domainid')}: ${this.dedicatedDomainId}`,
-              status: 'progress'
-            })
           },
           errorMessage: this.$t('error.dedicate.pod.failed'),
           errorMethod: () => {
-            this.parentFetchData()
             this.fetchParentData()
             this.dedicatedDomainModal = false
           },
@@ -181,22 +169,16 @@ export default {
       }).then(response => {
         this.$pollJob({
           jobId: response.dedicateclusterresponse.jobid,
+          title: this.$t('label.dedicate.cluster'),
+          description: `${this.$t('label.domain.id')} : ${this.domainId}`,
           successMessage: this.$t('message.cluster.dedicated'),
           successMethod: () => {
-            this.parentFetchData()
             this.fetchParentData()
             this.dedicatedDomainId = this.domainId
             this.dedicatedDomainModal = false
-            this.$store.dispatch('AddAsyncJob', {
-              title: this.$t('message.cluster.dedicated'),
-              jobid: response.dedicateclusterresponse.jobid,
-              description: `${this.$t('label.domainid')}: ${this.dedicatedDomainId}`,
-              status: 'progress'
-            })
           },
           errorMessage: this.$t('error.dedicate.cluster.failed'),
           errorMethod: () => {
-            this.parentFetchData()
             this.fetchParentData()
             this.dedicatedDomainModal = false
           },
@@ -225,22 +207,16 @@ export default {
       }).then(response => {
         this.$pollJob({
           jobId: response.dedicatehostresponse.jobid,
+          title: this.$t('label.dedicate.host'),
+          description: `${this.$t('label.domain.id')} : ${this.domainId}`,
           successMessage: this.$t('message.host.dedicated'),
           successMethod: () => {
-            this.parentFetchData()
             this.fetchParentData()
             this.dedicatedDomainId = this.domainId
             this.dedicatedDomainModal = false
-            this.$store.dispatch('AddAsyncJob', {
-              title: this.$t('message.host.dedicated'),
-              jobid: response.dedicatehostresponse.jobid,
-              description: `${this.$t('label.domainid')}: ${this.dedicatedDomainId}`,
-              status: 'progress'
-            })
           },
           errorMessage: this.$t('error.dedicate.host.failed'),
           errorMethod: () => {
-            this.parentFetchData()
             this.fetchParentData()
             this.dedicatedDomainModal = false
           },

diff --git a/ui/src/core/bootstrap.js b/ui/src/core/bootstrap.js
@@ -31,7 +31,7 @@ import {
   DEFAULT_FIXED_SIDEMENU,
   DEFAULT_CONTENT_WIDTH_TYPE,
   DEFAULT_MULTI_TAB,
-  ASYNC_JOB_IDS
+  HEADER_NOTICES
 } from '@/store/mutation-types'
 
 export default function Initializer () {
@@ -47,5 +47,5 @@ export default function Initializer () {
   store.commit('TOGGLE_MULTI_TAB', Vue.ls.get(DEFAULT_MULTI_TAB, config.multiTab))
   store.commit('SET_TOKEN', Vue.ls.get(ACCESS_TOKEN))
   store.commit('SET_PROJECT', Vue.ls.get(CURRENT_PROJECT))
-  store.commit('SET_ASYNC_JOB_IDS', Vue.ls.get(ASYNC_JOB_IDS) || [])
+  store.commit('SET_HEADER_NOTICES', Vue.ls.get(HEADER_NOTICES) || [])
 }
diff --git a/ui/src/store/getters.js b/ui/src/store/getters.js
@@ -30,7 +30,7 @@ const getters = {
   userInfo: state => state.user.info,
   addRouters: state => state.permission.addRouters,
   multiTab: state => state.app.multiTab,
-  asyncJobIds: state => state.user.asyncJobIds,
+  headerNotices: state => state.user.headerNotices,
   isLdapEnabled: state => state.user.isLdapEnabled,
   cloudian: state => state.user.cloudian,
   zones: state => state.user.zones,