Merge pull request '详情页刷新状态以及GPU队列显示排队个数' (#2504) from gpu-inference into V20220718

Reviewed-on: https://git.openi.org.cn/OpenI/aiforge/pulls/2504
Reviewed-by: chenshihai <chenshh@pcl.ac.cn>

templates/custom/wait_count.tmpl

@@ -3,13 +3,12 @@
 	{{$gpuQueue := 0}}
 	{{range $k,$v :=.gpu_types}}
 	{{if eq $k 0}}
-	{{ $queue := $v.Queue }}
+	{{ $queue = $v.Queue }}
 	{{ end }}
 	{{ end }}
-
 	{{ range $k,$v :=.QueuesDetail }}
 	{{if eq $k $queue}}
-	{{$gpuQueue :=$v}}
+	{{$gpuQueue =$v}}
 	{{ end }}
 	{{ end }}
 	<i

templates/repo/grampus/trainjob/show.tmpl

@@ -236,7 +236,7 @@
         </h4>
         {{range $k ,$v := .version_list_task}}
         <div class="ui accordion border-according" id="accordion{{.VersionName}}"
-            data-repopath="{{$.RepoRelPath}}/modelarts/train-job" data-jobid="{{.JobID}}"
+            data-repopath="{{$.RepoRelPath}}/grampus/train-job" data-jobid="{{.JobID}}"
             data-version="{{.VersionName}}">
             <div class="{{if eq $k 0}}active{{end}} title padding0">
                 <div class="according-panel-heading">
@@ -270,9 +270,9 @@
                                         class="cti-mgRight-sm">{{$.i18n.Tr "repo.modelarts.train_job.dura_time"}}：</span>
                                     <span class="cti-mgRight-sm uc-accordionTitle-black"
                                         id="{{.VersionName}}-duration-span">{{.TrainJobDuration}}</span>
-                                    <span data-tooltip="刷新" style="cursor: pointer;" data-inverted=""
-                                        onclick="refreshStatus({{.VersionName}})"><i
-                                            class="redo icon redo-color"></i></span>
+                                    <span id="refresh-status" data-tooltip="刷新" style="cursor: pointer;" data-inverted="" data-version="{{.VersionName}}">
+                                        <i class="redo icon redo-color"></i>
+                                    </span>
 
                                 </div>
                                  <div style="float: right;">
@@ -871,64 +871,7 @@
         size = size.toFixed(0);//保留的小数位数
         return size + unitArr[index];
     }
-    function refreshStatus(version_name) {
-        $.get(`/api/v1/repos/${userName}/${repoPath}/grampus/train-job/${jobID}?version_name=${version_name}`, (data) => {
-            // header status and duration
-            $(`#${version_name}-duration-span`).text(data.JobDuration)
-            $(`#${version_name}-status-span span`).text(data.JobStatus)
-            $(`#${version_name}-status-span i`).attr("class", data.JobStatus)
-            // detail status and duration
-            $('#' + version_name + '-duration').text(data.JobDuration)
-            $('#' + version_name + '-status').text(data.JobStatus)
-            $('#' + version_name + '-ai_center').text(data.AiCenter)
-            loadLog(version_name)
-
-
-        }).fail(function (err) {
-            console.log(err);
-        });
-        stopBubbling(arguments.callee.caller.arguments[0])
-    }
-    function deleteVersion(version_name) {
-        stopBubbling(arguments.callee.caller.arguments[0])
-        let flag = 1;
-        $('.ui.basic.modal').modal({
-            onDeny: function () {
-                flag = false
-            },
-            onApprove: function () {
-                $.post(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/del_version`, { version_name: version_name }, (data) => {
-                    if (data.VersionListCount === 0) {
-                        location.href = `/${userName}/${repoPath}/modelarts/train-job`
-                    } else {
-                        $('#accordion' + version_name).remove()
-                    }
-
-                }).fail(function (err) {
-                    console.log(err);
-                });
-                flag = true
-            },
-            onHidden: function () {
-                if (flag == false) {
-                    $('.alert').html('您已取消操作').removeClass('alert-success').addClass('alert-danger').show().delay(1500).fadeOut();
-                }
-            }
-        })
-            .modal('show')
 
-    }
-    function stopVersion(version_name) {
-        stopBubbling(arguments.callee.caller.arguments[0])
-        $.post(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/stop_version`, { version_name: version_name }, (data) => {
-            if (data.StatusOK === 0) {
-                $('#' + version_name + '-stop').addClass('disabled')
-                refreshStatus(version_name)
-            }
-        }).fail(function (err) {
-            console.log(err);
-        });
-    }
     function loadLog(version_name) {
         document.getElementById("mask").style.display = "block"
         $.get(`/api/v1/repos/${userName}/${repoPath}/grampus/train-job/${jobID}/log?version_name=${version_name}&lines=50&order=asc`, (data) => {

templates/repo/modelarts/trainjob/show.tmpl

@@ -270,12 +270,14 @@
                                     {{end}}
 
                                     {{if .CanDel}}
-                                    <a class="ti-action-menu-item {{if eq .Status "KILLED" "FAILED" "START_FAILED" "KILLING" "COMPLETED"}}disabled {{end}}"
+                                    <a class="ti-action-menu-item stop-show-version {{if eq .Status "KILLED" "FAILED" "START_FAILED" "KILLING" "COMPLETED"}}disabled {{end}}"
                                         id="{{.VersionName}}-stop"
-                                        onclick="stopVersion({{.VersionName}})">{{$.i18n.Tr "repo.stop"}}</a>
+                                        data-jobid="{{.JobID}}"
+                                        data-repopath="{{$.RepoRelPath}}/modelarts/train-job"
+                                        data-version = "{{.VersionName}}"
+                                        >{{$.i18n.Tr "repo.stop"}}</a>
                                     {{else}}
-                                    <a class="ti-action-menu-item disabled" id="{{.VersionName}}-stop"
-                                        onclick="stopVersion({{.VersionName}})">{{$.i18n.Tr "repo.stop"}}</a>
+                                    <a class="ti-action-menu-item disabled" id="{{.VersionName}}-stop">{{$.i18n.Tr "repo.stop"}}</a>
                                     {{end}}
 
 
@@ -308,10 +310,9 @@
                                         class="cti-mgRight-sm">{{$.i18n.Tr "repo.modelarts.train_job.dura_time"}}：</span>
                                     <span class="cti-mgRight-sm uc-accordionTitle-black"
                                         id="{{.VersionName}}-duration-span">{{.TrainJobDuration}}</span>
-                                    <span data-tooltip="刷新" style="cursor: pointer;" data-inverted=""
-                                        onclick="refreshStatus({{.VersionName}})"><i
-                                            class="redo icon redo-color"></i></span>
-
+                                    <span id="refresh-status" data-tooltip="刷新" style="cursor: pointer;" data-inverted="" data-version="{{.VersionName}}">
+                                        <i class="redo icon redo-color"></i>
+                                    </span>
                                 </div>
                             </span>
                         </span>
@@ -877,28 +878,6 @@
         $('#name').val(modelName)
         $('#version').val("0.0.1")
     }
-    function refreshStatus(version_name) {
-        $.get(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}?version_name=${version_name}`, (data) => {
-            // header status and duration
-            $(`#${version_name}-duration-span`).text(data.JobDuration)
-            $(`#${version_name}-status-span span`).text(data.JobStatus)
-            $(`#${version_name}-status-span i`).attr("class", data.JobStatus)
-            // detail status and duration
-            $('#' + version_name + '-duration').text(data.JobDuration)
-            $('#' + version_name + '-status').text(data.JobStatus)
-            console.log(data)
-            if (["KILLED", "FAILED", "START_FAILED", "STOPPED", "COMPLETED"].includes(data.JobStatus)) {
-                $('#' + version_name + '-stop').addClass('disabled')
-            }
-
-            loadLog(version_name)
-
-
-        }).fail(function (err) {
-            console.log(err);
-        });
-        stopBubbling(arguments.callee.caller.arguments[0])
-    }
     function deleteVersion(version_name) {
         stopBubbling(arguments.callee.caller.arguments[0])
         let flag = 1;
@@ -928,17 +907,7 @@
             .modal('show')
 
     }
-    function stopVersion(version_name) {
-        stopBubbling(arguments.callee.caller.arguments[0])
-        $.post(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/stop_version`, { version_name: version_name }, (data) => {
-            if (data.StatusOK === 0) {
-                $('#' + version_name + '-stop').addClass('disabled')
-                refreshStatus(version_name)
-            }
-        }).fail(function (err) {
-            console.log(err);
-        });
-    }
+
     function loadLog(version_name) {
         $.get(`/api/v1/repos/${userName}/${repoPath}/modelarts/train-job/${jobID}/log?version_name=${version_name}&lines=50&order=asc`, (data) => {
             $('input[name=end_line]').val(data.EndLine)

web_src/js/features/cloudrbanin.js

@@ -327,6 +327,23 @@ export default async function initCloudrain() {
     });
   }
 
+  $(".stop-show-version").click(function (e) {
+    const ID = this.dataset.jobid;
+    const repoPath = this.dataset.repopath;
+    const version_name = this.dataset.version;
+    const url = `/api/v1/repos/${repoPath}/${ID}/stop_version`;
+    $.post(url, { version_name: version_name }, (data) => {
+      if (data.StatusOK === 0) {
+        $(`#${version_name}-stop`).removeClass("blue");
+        $(`#${version_name}-stop`).addClass("disabled");
+        refreshStatusShow(version_name, ID, repoPath);
+      }
+    }).fail(function (err) {
+      console.log(err);
+    });
+    e.stopPropagation();
+  });
+
   $("#refresh-status").click(function (e) {
     let version_name = $(this).data("version");
     let ID = $(`#accordion${version_name}`).data("jobid");
@@ -339,11 +356,16 @@ export default async function initCloudrain() {
     $.get(
       `/api/v1/repos/${repoPath}/${ID}?version_name=${version_name}`,
       (data) => {
+        //accroding下的状态
         $(`#${version_name}-status-span span`).text(data.JobStatus);
+        //accroding下的状态图标
         $(`#${version_name}-status-span i`).attr("class", data.JobStatus);
+        //accroding下的运行时长
         $(`#${version_name}-duration-span`).text(data.JobDuration);
-        $("#" + versionname + "-duration").text(data.JobDuration);
-        $("#" + versionname + "-status").text(data.JobStatus);
+        //配置信息详情页的状态
+        $(`#${version_name}-status`).text(data.JobStatus);
+        //配置信息详情页的状态
+        $(`#${version_name}-duration`).text(data.JobDuration);
       }
     ).fail(function (err) {
       console.log(err);