fix #2370 【镜像管理】提交镜像后页面没有刷新镜像状态

templates/repo/debugjob/index.tmpl

@@ -427,6 +427,7 @@
                                                     {{if .CanDebug}}
                                                     <a id="model-image-{{.Cloudbrain.ID}}"
                                                         class='imageBtn ui basic {{if ne .Status "RUNNING"}}disabled {{else}}blue {{end}}button'
+                                                        target="_blank"
                                                         href="{{$.RepoLink}}/cloudbrain/{{.Cloudbrain.ID}}/commit_image">{{$.i18n.Tr "repo.submit_image"}}</a>
                                                     {{else}}
                                                     <a

web_src/js/components/images/Images.vue

@@ -215,16 +215,16 @@
                                 <div style="display:flex;align-items: center;justify-content: center;">
                                     <span v-if="scope.row.isPrivate" style="color: rgb(250, 140, 22);">私有</span>
                                     <span v-else style="color: rgb(19, 194, 141);">公开</span>
-                                    <el-tooltip class="item" effect="dark" content="镜像提交中..." placement="top">
-                                        <i v-if="scope.row.status===0" class="CREATING" style="margin-left:0.3rem"></i>
+                                    <el-tooltip v-if="scope.row.status===0" class="item" effect="dark" content="镜像提交中..." placement="top">
+                                        <i class="CREATING" style="margin-left:0.3rem"></i>
                                     </el-tooltip>
                                     
-                                    <el-tooltip class="item" effect="dark" content="检测提交镜像是否大小超过20G!" placement="top">
-                                        <i v-if="scope.row.status===2" class="FAILED" style="margin-left:0.3rem"></i>
+                                    <el-tooltip v-if="scope.row.status===2" class="item" effect="dark" content="检测提交镜像是否大小超过20G!" placement="top">
+                                        <i class="FAILED" style="margin-left:0.3rem"></i>
                                     </el-tooltip>
                                     
-                                    <el-tooltip class="item" effect="dark" content="镜像提交成功" placement="top">
-                                        <i v-if="scope.row.status===1" class="SUCCEEDED" style="margin-left:0.3rem"></i>
+                                    <el-tooltip v-if="scope.row.status===1" class="item" effect="dark" content="镜像提交成功" placement="top">
+                                        <i class="SUCCEEDED" style="margin-left:0.3rem"></i>
                                     </el-tooltip>
                                     
                                 </div>
@@ -473,6 +473,7 @@ export default {
       tableDataCustom: [],
       starCustom:[],
       loadingCustom:false,
+      refreshCustomTimer: null,
 
       currentPageStar:1,
       pageSizeStar:10,
@@ -485,6 +486,7 @@ export default {
   methods: {
     handleClick(tab, event) {
         this.search = ''
+        this.stopImageListCustomRefresh();
         if(tab.name=="first"){
             this.paramsPublic.q = ''
             this.getImageListPublic()
@@ -560,9 +562,31 @@ export default {
                 
             });
             this.loadingCustom = false
+            this.getImageListCustomRefresh()
         })
     },
 
+    getImageListCustomRefresh() {
+        this.stopImageListCustomRefresh();
+        this.refreshCustomTimer = setInterval(() => {
+            this.tableDataCustom.forEach(item => {
+                if (item.status === 0) {
+                    this.$axios.get(`/image/${item.id}`, {}).then((res) => {
+                        const newData = res.data;
+                        this.tableDataCustom.forEach(it => {                    
+                            if (it.id === newData.id) {
+                                it.status = newData.status;                                
+                            }                            
+                        });
+                    })
+                }
+            });            
+        }, 5000);
+    },
+
+    stopImageListCustomRefresh() {
+        this.refreshCustomTimer && clearInterval(this.refreshCustomTimer);
+    },
     getImageListStar(){
         this.loadingStar = true
         this.$axios.get('/explore/images/star',{
@@ -715,8 +739,10 @@ export default {
       else{
         this.getImageListPublic()
       }
+  },  
+  beforeDestroy() {
+    this.stopImageListCustomRefresh();
   }
-
 };
 </script>