From 769b450e43b566a42b83321328c8fe81505b1b9f Mon Sep 17 00:00:00 2001 From: zhoupzh Date: Mon, 1 Nov 2021 12:17:14 +0800 Subject: [PATCH] update --- templates/repo/cloudbrain/index.tmpl | 40 +++++------ templates/repo/modelarts/notebook/index.tmpl | 44 ++++++------- templates/repo/modelarts/trainjob/index.tmpl | 42 ++++++------ templates/repo/modelarts/trainjob/new.tmpl | 99 ++++++++++++++++++++++++++-- web_src/less/openi.less | 4 +- 5 files changed, 160 insertions(+), 69 deletions(-) diff --git a/templates/repo/cloudbrain/index.tmpl b/templates/repo/cloudbrain/index.tmpl index ff9bb24c4..d776dba99 100755 --- a/templates/repo/cloudbrain/index.tmpl +++ b/templates/repo/cloudbrain/index.tmpl @@ -357,13 +357,13 @@ {{end}} - + 调试
{{$.CsrfTokenHtml}} - + 停止
@@ -376,14 +376,14 @@ - 提交镜像 + 提交镜像
{{$.CsrfTokenHtml}} - + 删除
@@ -532,31 +532,31 @@ //} } if(status==="RUNNING"){ - $('#model-debug').removeClass('disabled') - $('#model-debug').addClass('blue') - $('#model-image').removeClass('disabled') - $('#model-image').addClass('blue') + $('#model-debug-'+jobID).removeClass('disabled') + $('#model-debug-'+jobID).addClass('blue') + $('#model-image-'+jobID).removeClass('disabled') + $('#model-image-'+jobID).addClass('blue') } if(status!=="RUNNING"){ - $('#model-debug').removeClass('blue') - $('#model-debug').addClass('disabled') - $('#model-image').removeClass('blue') - $('#model-image').addClass('disabled') + $('#model-debug-'+jobID).removeClass('blue') + $('#model-debug-'+jobID).addClass('disabled') + $('#model-image-'+jobID).removeClass('blue') + $('#model-image-'+jobID).addClass('disabled') } if(status!=="STOPPED" || status!=="FAILED"){ - $('#stop-model-debug').removeClass('disabled') - $('#stop-model-debug').addClass('blue') - $('#model-delete').removeClass('red') - $('#model-delete').addClass('disabled') + $('#stop-model-debug-'+jobID).removeClass('disabled') + $('#stop-model-debug-'+jobID).addClass('blue') + $('#model-delete-'+jobID).removeClass('red') + $('#model-delete-'+jobID).addClass('disabled') } if(status=="STOPPED" || status=="FAILED"){ - $('#stop-model-debug').removeClass('blue') - $('#stop-model-debug').addClass('disabled') - $('#model-delete').removeClass('disabled') - $('#model-delete').addClass('red') + $('#stop-model-debug-'+jobID).removeClass('blue') + $('#stop-model-debug-'+jobID).addClass('disabled') + $('#model-delete-'+jobID).removeClass('disabled') + $('#model-delete-'+jobID).addClass('red') } }).fail(function(err) { console.log(err); diff --git a/templates/repo/modelarts/notebook/index.tmpl b/templates/repo/modelarts/notebook/index.tmpl index bb2a9d154..86d9a7243 100755 --- a/templates/repo/modelarts/notebook/index.tmpl +++ b/templates/repo/modelarts/notebook/index.tmpl @@ -254,17 +254,17 @@
-
+
{{$.i18n.Tr "repo.cloudbrain_task"}}
{{$.i18n.Tr "repo.cloudbrain_status_createtime"}}
-
+
{{$.i18n.Tr "repo.cloudbrain_creator"}}
-
- {{$.i18n.Tr "repo.cloudbrain_operate"}} +
+ {{$.i18n.Tr "repo.cloudbrain_operate"}}
@@ -278,7 +278,7 @@
-
+
{{svg "octicon-tasklist" 16}} {{.JobName}} @@ -297,7 +297,7 @@ {{TimeSinceUnix .Cloudbrain.CreatedUnix $.Lang}}
-
+
{{if .User.Name}} {{else}} @@ -305,17 +305,17 @@ {{end}}
-
+
- + 调试
{{$.CsrfTokenHtml}} - + 停止
@@ -336,7 +336,7 @@
{{$.CsrfTokenHtml}} - + 删除
@@ -445,27 +445,27 @@ //} } if(status==="RUNNING"){ - $('#model-debug').removeClass('disabled') - $('#model-debug').addClass('blue') + $('#model-debug-'+jobID).removeClass('disabled') + $('#model-debug-'+jobID).addClass('blue') } if(status!=="RUNNING"){ - $('#model-debug').removeClass('blue') - $('#model-debug').addClass('disabled') + $('#model-debug-'+jobID).removeClass('blue') + $('#model-debug-'+jobID).addClass('disabled') } if(status!=="STOPPED" || status!=="FAILED"){ - $('#stop-model-debug').removeClass('disabled') - $('#stop-model-debug').addClass('blue') - $('#model-delete').removeClass('red') - $('#model-delete').addClass('disabled') + $('#stop-model-debug-'+jobID).removeClass('disabled') + $('#stop-model-debug-'+jobID).addClass('blue') + $('#model-delete-'+jobID).removeClass('red') + $('#model-delete-'+jobID).addClass('disabled') } if(status=="STOPPED" || status=="FAILED"){ - $('#stop-model-debug').removeClass('blue') - $('#stop-model-debug').addClass('disabled') - $('#model-delete').removeClass('disabled') - $('#model-delete').addClass('red') + $('#stop-model-debug-'+jobID).removeClass('blue') + $('#stop-model-debug-'+jobID).addClass('disabled') + $('#model-delete-'+jobID).removeClass('disabled') + $('#model-delete-'+jobID).addClass('red') } }).fail(function(err) { console.log(err); diff --git a/templates/repo/modelarts/trainjob/index.tmpl b/templates/repo/modelarts/trainjob/index.tmpl index f332f9a6a..19e2615c9 100755 --- a/templates/repo/modelarts/trainjob/index.tmpl +++ b/templates/repo/modelarts/trainjob/index.tmpl @@ -286,11 +286,11 @@
{{$.i18n.Tr "repo.cloudbrain_status_runtime"}}
-
+
{{$.i18n.Tr "repo.cloudbrain_creator"}}
- {{$.i18n.Tr "repo.cloudbrain_operate"}} + {{$.i18n.Tr "repo.cloudbrain_operate"}}
@@ -329,13 +329,13 @@ {{.Status}} --> - {{.TrainJobDuration}} + {{.TrainJobDuration}}
-
+
{{if .User.Name}} {{else}} @@ -353,14 +353,14 @@ -->
{{$.CsrfTokenHtml}} - + 停止
- + 模型下载 @@ -372,7 +372,7 @@
{{$.CsrfTokenHtml}} - + 删除
@@ -493,8 +493,8 @@ //} } if(status==="RUNNING"){ - $('#model-debug').removeClass('disabled') - $('#model-debug').addClass('blue') + $('#model-debug-'+jobID).removeClass('disabled') + $('#model-debug-'+jobID).addClass('blue') // let TrainDuration = runtime(time) // $('#model-duration').text(TrainDuration) @@ -502,21 +502,21 @@ } if(status!=="RUNNING"){ - $('#model-debug').removeClass('blue') - $('#model-debug').addClass('disabled') + $('#model-debug-'+jobID).removeClass('blue') + $('#model-debug-'+jobID).addClass('disabled') } - if(status!=="STOPPED" || status!=="FAILED"){ - $('#stop-model-debug').removeClass('disabled') - $('#stop-model-debug').addClass('blue') - $('#model-delete').removeClass('red') - $('#model-delete').addClass('disabled') + if(status!=="KILLED" || status!=="FAILED"){ + $('#stop-model-debug-'+jobID).removeClass('disabled') + $('#stop-model-debug-'+jobID).addClass('blue') + $('#model-delete-'+jobID).removeClass('red') + $('#model-delete-'+jobID).addClass('disabled') } - if(status=="STOPPED" || status=="FAILED"){ - $('#stop-model-debug').removeClass('blue') - $('#stop-model-debug').addClass('disabled') - $('#model-delete').removeClass('disabled') - $('#model-delete').addClass('red') + if(status=="KILLED" || status=="FAILED"){ + $('#stop-model-debug-'+jobID).removeClass('blue') + $('#stop-model-debug-'+jobID).addClass('disabled') + $('#model-delete-'+jobID).removeClass('disabled') + $('#model-delete-'+jobID).addClass('red') } }).fail(function(err) { console.log(err); diff --git a/templates/repo/modelarts/trainjob/new.tmpl b/templates/repo/modelarts/trainjob/new.tmpl index 310ee56b2..3e852c619 100755 --- a/templates/repo/modelarts/trainjob/new.tmpl +++ b/templates/repo/modelarts/trainjob/new.tmpl @@ -49,12 +49,98 @@ text-align: center; color: #C2C7CC;" } +#mask { + position: fixed; + top: 0px; + left: 0px; + right: 0px; + bottom: 0px; + filter: alpha(opacity=60); + background-color: #777; + z-index: 1000; + display: none; + opacity: 0.8; + -moz-opacity: 0.5; + padding-top: 100px; + color: #000000 + } + /* 加载圈css效果图 */ + +#loadingPage { + margin: 200px auto; + width: 50px; + height: 40px; + text-align: center; + font-size: 10px; + display: block; +} + +#loadingPage>div { + background-color: green; + height: 100%; + width: 6px; + display: inline-block; + -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out; + animation: sk-stretchdelay 1.2s infinite ease-in-out; + } + + #loadingPage .rect2 { + -webkit-animation-delay: -1.1s; + animation-delay: -1.1s; + } + + #loadingPage .rect3 { + -webkit-animation-delay: -1.0s; + animation-delay: -1.0s; + } + + #loadingPage .rect4 { + -webkit-animation-delay: -0.9s; + animation-delay: -0.9s; + } + + #loadingPage .rect5 { + -webkit-animation-delay: -0.8s; + animation-delay: -0.8s; + } + + @-webkit-keyframes sk-stretchdelay { + 0%, + 40%, + 100% { + -webkit-transform: scaleY(0.4) + } + 20% { + -webkit-transform: scaleY(1.0) + } + } + + @keyframes sk-stretchdelay { + 0%, + 40%, + 100% { + transform: scaleY(0.4); + -webkit-transform: scaleY(0.4); + } + 20% { + transform: scaleY(1.0); + -webkit-transform: scaleY(1.0); + } +} -
+ +
+
+
+
+
+
+
+
-
{{template "repo/header" .}}
@@ -412,14 +498,19 @@ } }, onSuccess: function(){ - $('.ui.page.dimmer').dimmer('show') + // $('.ui.page.dimmer').dimmer('show') + document.getElementById("mask").style.display = "block" }, onFailure: function(e){ return false; } }) } - + document.onreadystatechange = function() { + if (document.readyState === "complete") { + document.getElementById("mask").style.display = "none" + } + } function send_run_para(){ var run_parameters = [] var msg = {} diff --git a/web_src/less/openi.less b/web_src/less/openi.less index aa9d31d76..56234586e 100644 --- a/web_src/less/openi.less +++ b/web_src/less/openi.less @@ -227,12 +227,12 @@ footer .column{margin-bottom:0!important; padding-bottom:0!important;} .STOPPED, .KILLED{display:inline-block;width:18px;height:18px;background:url("/img/icons.svg");background-position: -496px -52px;background-position: -459px -52px;} .RUNNING{display:inline-block;width:18px;height:18px;background:url("/img/icons.svg");background-position: -496px -52px;background-position: -478px -52px;} .i-bg-orange{background-position: -495px -51px;} -.FAILED{display:inline-block;width:18px;height:18px;background:url("/img/icons.svg");background-position: -496px -52px;background-position: -532px -52px;} +.FAILED,.START_FAILED{display:inline-block;width:18px;height:18px;background:url("/img/icons.svg");background-position: -496px -52px;background-position: -532px -52px;} .i-bg-green{background-position: -441px -52px;} .i-bg-used{background-position: -514px -52px;} .icon-bind{background-position: -550px -52px;} .icon-unbind{background-position: -568px -52px;} -.CREATING, .STOPPING, .DELETING, .STARTING, .WAITING{display:inline-block;background-image:url('/img/loading.gif');background-repeat:no-repeat;width:16px;height:16px;background-size:16px 16px;margin-right:5px;} +.CREATING, .STOPPING, .DELETING, .STARTING, .WAITING ,.INIT,.KILLING{display:inline-block;background-image:url('/img/loading.gif');background-repeat:no-repeat;width:16px;height:16px;background-size:16px 16px;margin-right:5px;} .COMPLETED{display:inline-block;width:18px;height:18px;background:url("/img/icons.svg");background-position: -496px -52px;background-position: -441px -52px;} .text_over{