Browse Source

commit

pull/625/head
Gitea 3 years ago
parent
commit
d40f1d1489
3 changed files with 4 additions and 448 deletions
  1. +2
    -2
      templates/repo/modelarts/index.tmpl
  2. +1
    -221
      templates/repo/modelarts/notebook/index.tmpl
  3. +1
    -225
      templates/repo/modelarts/trainjob/index.tmpl

+ 2
- 2
templates/repo/modelarts/index.tmpl View File

@@ -231,8 +231,8 @@


<div class="column"> <div class="column">
<div class="ui blue small menu compact selectcloudbrain"> <div class="ui blue small menu compact selectcloudbrain">
<a class="active item" href="{{.RepoLink}}/modelarts">调试任务</a>
<a class="item" href="{{.RepoLink}}/modelarts/train_job">训练任务</a>
<a class="active item" href="{{.RepoLink}}/modelarts/notebook">调试任务</a>
<a class="item" href="{{.RepoLink}}/modelarts/train-job">训练任务</a>
</div> </div>
</div> </div>
<div class="column right aligned"> <div class="column right aligned">


+ 1
- 221
templates/repo/modelarts/notebook/index.tmpl View File

@@ -1,221 +1 @@
{{template "base/head" .}}
<style>
#deletemodel {
width: 100%;
height: 100%;
}
.alert {
display: none;
position: fixed;
width: 100%;
z-index: 1001;
padding: 15px;
border: 1px solid transparent;
border-radius: 4px;
text-align: center;
font-weight: bold;
}

.alert-success {
color: #3c763d;
background-color: #dff0d8;
border-color: #d6e9c6;
}

.alert-danger {
color: #a94442;
background-color: #f2dede;
border-color: #ebccd1;
}
</style>
<div class="modelarts">
<div class="repository release dataset-list view container">
<div class="alert"></div>
{{template "repo/header" .}}
<div class="ui container">
<div class="ui grid">
{{template "repo/modelarts/navbar" .}}
<!-- 右侧 -->
<div class="ui thirteen wide column">
<div class="ui three column stackable grid">
<div class="column">
<h2>{{.i18n.Tr "repo.modelarts.notebook"}}</h2>
</div>
<div class="column">
</div>
<div class="column right aligned">
{{if .Permission.CanWrite $.UnitTypeCloudBrain}}
<a class="ui green button" href="{{.RepoLink}}/modelarts/notebook/create">{{.i18n.Tr "repo.cloudbrain.new"}}</a> {{end}}
</div>
</div>
<div class="ui divider"></div>
<div class="ui grid">
<div class="row">
<div class="ui sixteen wide column">
<div class="ui sixteen wide column">
<div class="ui two column stackable grid">
<div class="column">
</div>
<div class="column right aligned">
<div class="ui right dropdown type jump item">
<span class="text">
{{.i18n.Tr "repo.issues.filter_sort"}}<i class="dropdown icon"></i>
</span>
</div>
</div>
</div>
</div>

<!-- 任务展示 -->
<div class="dataset list">
{{range .Tasks}}
<div class="ui grid stackable item">
<div class="row">
<!-- 任务名 -->
<div class="four wide center column">
<a class="title" href="{{$.Link}}/{{.JobID}}">
<!-- <span class="fitted">{{svg "octicon-tasklist" 16}}</span> -->
<span class="fitted">{{.JobName}}</span>
</a>
</div>

<!--任务状态 -->
<div class="two wide center column job-status" id="{{.JobID}}" data-repopath="{{$.RepoRelPath}}" data-jobid="{{.JobID}}">
{{.Status}}
</div>

<!-- 任务创建时间 -->
<div class="two wide center column">
<span class="ui text center">{{svg "octicon-flame" 16}} {{TimeSinceUnix .CreatedUnix $.Lang}}</span>
</div>

<!-- 查看 -->
<div class="two wide center column">
<span class="ui text clipboard">
<a class="title" href="{{$.Link}}/{{.JobID}}">
<span class="fitted">查看</span>
</a>
</span>
</div>

<!-- 删除任务 -->
<div class="two wide center column">
<div class="ui text center clipboard">
<form id="delForm-{{.JobID}}" action="{{if ne .Status "STOPPED"}}javascript:void(0){{else}}{{$.Link}}/{{.JobID}}/del{{end}}" method="post">
{{$.CsrfTokenHtml}}
<a class="fitted" onclick="assertDelete(this)" style="{{if ne .Status "STOPPED"}}color:#CCCCCC{{end}}; font-size:16px; font-weight:bold">删除</a>
</form>
</div>
</div>

<!-- 调试 -->
<div class="two wide center column">
<div class="ui text center clipboard">
<a class="title" onclick="stop(this)" href="{{if not .CanDebug}}javascript:void(0){{else}}{{$.Link}}/{{.JobID}}/debug{{end}}" style="{{if not .CanDebug}}color:#CCCCCC{{end}}">
<span class="fitted">调试</span>
</a>
</div>
</div>

<!-- 停止 -->
<div class="two wide center column">
<div class="ui text center clipboard">
<form id="stopForm-{{.JobID}}" action="{{if ne .Status "RUNNING"}}javascript:void(0){{else}}{{$.Link}}/{{.JobID}}/stop{{end}}" method="post">
{{$.CsrfTokenHtml}}
<a class="fitted" onclick="document.getElementById('stopForm-{{.JobID}}').submit();" style="{{if ne .Status "RUNNING"}}color:#CCCCCC{{end}}; font-size:16px; font-weight:bold">停止</a>
</form>
</div>
</div>
</div>
</div>
{{end}} {{template "base/paginate" .}}
</div>

</div>
</div>
</div>

</div>
</div>
</div>
</div>

<!-- 确认模态框 -->
<div id="deletemodel">
<div class="ui basic modal">
<div class="ui icon header">
<i class="trash icon"></i> 删除任务
</div>

<div class="content">
<p>你确认删除该任务么?此任务一旦删除不可恢复。</p>
</div>
<div class="actions">
<div class="ui red basic inverted cancel button">
<i class="remove icon"></i> 取消操作
</div>
<div class="ui green basic inverted ok button">
<i class="checkmark icon"></i> 确定操作
</div>
</div>
</div>
</div>
</div>
{{template "base/footer" .}}

<script>
// 调试新开窗口
function stop(obj) {
if (obj.style.color != "rgb(204, 204, 204)") {
obj.target = '_blank'
} else {
return
}
}

// 删除时用户确认
function assertDelete(obj) {
if (obj.style.color == "rgb(204, 204, 204)") {
return
} else {
var delId = obj.parentNode.id
flag = 1;
$('.ui.basic.modal')
.modal({
onDeny: function() {
flag = false
},
onApprove: function() {
document.getElementById(delId).submit()
flag = true
},
onHidden: function() {
if (flag == false) {
$('.alert').html('您已取消操作').removeClass('alert-success').addClass('alert-danger').show().delay(1500).fadeOut();
}
}
})
.modal('show')
}
}

// 加载任务状态
$(document).ready(function() {
$(".job-status").each((index, job) => {
const jobID = job.dataset.jobid;
const repoPath = job.dataset.repopath;
if (job.textContent.trim() == 'STOPPED') {
return
}

$.get(`/api/v1/repos/${repoPath}/modelarts/notebook/${jobID}`, (data) => {
const jobID = data.JobID
const status = data.JobStatus
$('#' + jobID).text(status)
// console.log(data)
}).fail(function(err) {
console.log(err);
});
});
});
</script>
<div>notebook</div>

+ 1
- 225
templates/repo/modelarts/trainjob/index.tmpl View File

@@ -1,225 +1 @@
{{template "base/head" .}}
<style>
#deletemodel {
width: 100%;
height: 100%;
}
.alert {
display: none;
position: fixed;
width: 100%;
z-index: 1001;
padding: 15px;
border: 1px solid transparent;
border-radius: 4px;
text-align: center;
font-weight: bold;
}

.alert-success {
color: #3c763d;
background-color: #dff0d8;
border-color: #d6e9c6;
}

.alert-danger {
color: #a94442;
background-color: #f2dede;
border-color: #ebccd1;
}

/*

.disabled {
cursor: pointer;
pointer-events: none;
}

.ui.segment.bottom.attached {
border: none;
}
.ui.secondary.vertical.pointing.menu{
border-right-width: 0px !important;
}

.vertical.menu .item {
border-right-color: white !important;
}

.vertical.menu .activate.item {
font-weight: 700;
} */
</style>
<div class="modelarts">
<div class="repository release modelarts train_job view container">
<div class="alert"></div>
{{template "repo/header" .}}
<div class="ui container">
{{template "base/alert" .}}
<div class="ui grid">
{{template "repo/modelarts/navbar" .}}
<!-- 右侧 -->
<div class="ui thirteen wide column">
<div class="ui three column stackable grid">
<div class="column">
<h2>{{.i18n.Tr "repo.modelarts.train_job"}}</h2>
</div>
<div class="column">
</div>
<div class="column right aligned">
{{if .CanCreate}}
<a class="ui green button" href="{{.RepoLink}}/modelarts/train-job/create">{{.i18n.Tr "repo.modelarts.train_job.new"}}</a>
{{end}}
</div>
</div>
<div class="ui divider"></div>
<div class="ui grid">
<div class="row">
<div class="ui sixteen wide column">
<div class="ui sixteen wide column">
<div class="ui two column stackable grid">
<div class="column">
</div>
<div class="column right aligned">
<div class="ui right dropdown type jump item">
<span class="text">
{{.i18n.Tr "repo.issues.filter_sort"}}<i class="dropdown icon"></i>
</span>
</div>
</div>
</div>
</div>
<!-- 任务展示 -->
<div class="dataset list">
{{range .Tasks}}
<div class="ui grid stackable item">
<div class="row">
<!-- 任务名 -->
<div class="four wide center column">
<a class="title" href="{{$.Link}}/{{.JobID}}">
<!-- <span class="fitted">{{svg "octicon-tasklist" 16}}</span> -->
<span class="fitted">{{.JobName}}</span>
</a>
</div>
<!--任务状态 -->
<div class="five wide center column job-status" id="{{.JobID}}" data-repopath="{{$.RepoRelPath}}" data-jobid="{{.JobID}}">
{{.Status}}
</div>

<!-- 运行时长 -->
<div class="three wide center column">
<span class="ui text center">{{svg "octicon-flame" 16}} {{TimeSinceUnix .CreatedUnix $.Lang}}</span>
</div>
<!-- 删除 -->
<div class="two wide center column">
<div class="ui text center clipboard">
<form id="delForm-{{.JobID}}" action="{{$.Link}}/{{.JobID}}/del" method="post">
{{$.CsrfTokenHtml}}
<a class="fitted" onclick="assertDelete(this)" style="font-size:16px; font-weight:bold">删除</a>
</form>
</div>
</div>
<!-- 停止 -->
<div class="two wide column">
<div class="ui text center clipboard">
<form id="stopForm-{{.JobID}}" action="{{if ne .Status "RUNNING"}}javascript:void(0){{else}}{{$.Link}}/{{.JobID}}/stop{{end}}" method="post">
{{$.CsrfTokenHtml}}
<a class="fitted" onclick="document.getElementById('stopForm-{{.JobID}}').submit();" style="{{if ne .Status "RUNNING"}}color:#CCCCCC{{end}};font-size:16px; font-weight:bold">停止</a>
</form>
</div>
</div>
</div>
</div>
{{end}} {{template "base/paginate" .}}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<!-- 确认模态框 -->
<div id="deletemodel">
<div class="ui basic modal">
<div class="ui icon header">
<i class="trash icon"></i> 删除任务
</div>

<div class="content">
<p>你确认删除该任务么?此任务一旦删除不可恢复。</p>
</div>
<div class="actions">
<div class="ui red basic inverted cancel button">
<i class="remove icon"></i> 取消操作
</div>
<div class="ui green basic inverted ok button">
<i class="checkmark icon"></i> 确定操作
</div>
</div>
</div>
</div>
</div>
{{template "base/footer" .}}

<script>
$(".vertical.menu a").click(function(){
$(this).siblings().removeClass("activate")
$(this).addClass("activate")
})

// 删除时用户确认
function assertDelete(obj) {
if (obj.style.color == "rgb(204, 204, 204)") {
return
} else {
var delId = obj.parentNode.id
flag = 1;
$('.ui.basic.modal')
.modal({
onDeny: function() {
flag = false
},
onApprove: function() {
document.getElementById(delId).submit()
flag = true
},
onHidden: function() {
if (flag == false) {
$('.alert').html('您已取消操作').removeClass('alert-success').addClass('alert-danger').show().delay(1500).fadeOut();
}
}
})
.modal('show')
}
}

// 加载任务状态
$(document).ready(function() {
$(".job-status").each((index, job) => {
const jobID = job.dataset.jobid;
const repoPath = job.dataset.repopath;
if (job.textContent.trim() == 'STOPPED') {
return
}

$.get(`/api/v1/repos/${repoPath}/modelarts/train-job/${jobID}`, (data) => {
const jobID = data.JobID
const status = data.JobStatus
$('#' + jobID).text(status)
// console.log(data)
}).fail(function(err) {
console.log(err);
});
});
});
</script>
<div>aaaa</div>

Loading…
Cancel
Save