|
- {{template "base/head" .}}
- <style>
- .train-job-title {
- font-family: SourceHanSansSC-medium !important;
- color: rgba(16, 16, 16, 100) !important;
- font-size: 16px !important;
- padding-left: 3rem !important;
- }
- .min_title{
- font-size: 14px !important;
- margin-bottom: 2rem !important;
- }
- .width{
- width:100% !important;
- }
- .width48{
- width: 48.5% !important;
- }
- .width80{
- width: 80.7% !important;
- margin-left: 10px;
- }
- .width85{
- width: 85% !important;
- margin-left: 10.5rem !important;
- align-items: center;
- }
- .width81{
- margin-left: 1.5rem;
- width: 81% !important;
- }
-
- .add{font-size: 18px;
- padding: 0.5rem;
- border: 1px solid rgba(187, 187, 187, 100);
- border-radius: 0px 5px 5px 0px;
- line-height: 21px;
- text-align: center;
- color: #C2C7CC;
- }
- .min{
- font-size: 18px;
- padding: 0.5rem;
- border: 1px solid rgba(187, 187, 187, 100);
- border-radius: 5px 0px 0px 5px;
- line-height: 21px;
- text-align: center;
- color: #C2C7CC;
- }
- .label-fix-width{
- width: 140px !important;
- text-align: right;
- font-family: SourceHanSansSC-medium !important;
- color: rgba(16, 16, 16, 100) !important;
- font-size: 14px !important;
- }
- </style>
- <!-- <div class="ui page dimmer">
- <div class="ui text loader">{{.i18n.Tr "loading"}}</div>
- </div> -->
- {{template "custom/global_mask" .}}
- <div class="repository">
- {{template "repo/header" .}}
- <div class="ui container">
- <div class="cloudbrain-type" style="display: none;" data-cloudbrain-type="{{.datasetType}}" data-repo-link="{{.RepoLink}}"></div>
- {{template "base/alert" .}}
- <h4 class="ui top attached header">
- {{.i18n.Tr "repo.modelarts.train_job.new"}}
- </h4>
- <div class="ui attached segment">
- <!-- equal width -->
- <form class="ui form" action="{{.Link}}" method="post">
- {{.CsrfTokenHtml}}
- <input type="hidden" name="action" value="update">
- <input type="hidden" id="ai_engine_name" name="engine_names" value="">
- <input type="hidden" id="ai_flaver_name" name="flaver_names" value="">
- <h4 class="train-job-title ui header ">{{.i18n.Tr "repo.modelarts.train_job.basic_info"}}:</h4>
- <div class="required min_title inline field">
- <label class="label-fix-width" style="font-weight: normal;">{{.i18n.Tr "cloudbrain.resource_cluster"}}</label>
- <div class="ui blue mini menu compact selectcloudbrain">
- <a class="active item" href="{{.RepoLink}}/cloudbrain/train-job/create">
- <svg class="svg" sxmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16"><path fill="none" d="M0 0h24v24H0z"></path><path d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm-2.29-2.333A17.9 17.9 0 0 1 8.027 13H4.062a8.008 8.008 0 0 0 5.648 6.667zM10.03 13c.151 2.439.848 4.73 1.97 6.752A15.905 15.905 0 0 0 13.97 13h-3.94zm9.908 0h-3.965a17.9 17.9 0 0 1-1.683 6.667A8.008 8.008 0 0 0 19.938 13zM4.062 11h3.965A17.9 17.9 0 0 1 9.71 4.333 8.008 8.008 0 0 0 4.062 11zm5.969 0h3.938A15.905 15.905 0 0 0 12 4.248 15.905 15.905 0 0 0 10.03 11zm4.259-6.667A17.9 17.9 0 0 1 15.973 11h3.965a8.008 8.008 0 0 0-5.648-6.667z"></path></svg>
- {{.i18n.Tr "cloudbrain.resource_cluster_openi"}}
- </a>
- <a class="item" href="{{.RepoLink}}/grampus/train-job/npu/create">
- <svg class="svg" sxmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16"><path fill="none" d="M0 0h24v24H0z"></path><path d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm-2.29-2.333A17.9 17.9 0 0 1 8.027 13H4.062a8.008 8.008 0 0 0 5.648 6.667zM10.03 13c.151 2.439.848 4.73 1.97 6.752A15.905 15.905 0 0 0 13.97 13h-3.94zm9.908 0h-3.965a17.9 17.9 0 0 1-1.683 6.667A8.008 8.008 0 0 0 19.938 13zM4.062 11h3.965A17.9 17.9 0 0 1 9.71 4.333 8.008 8.008 0 0 0 4.062 11zm5.969 0h3.938A15.905 15.905 0 0 0 12 4.248 15.905 15.905 0 0 0 10.03 11zm4.259-6.667A17.9 17.9 0 0 1 15.973 11h3.965a8.008 8.008 0 0 0-5.648-6.667z"></path></svg>
- {{.i18n.Tr "cloudbrain.resource_cluster_c2net"}}(Beta)
- </a>
- </div>
- </div>
-
- <div class="required inline min_title field">
- <label class="label-fix-width" style="font-weight: normal;">{{.i18n.Tr "cloudbrain.compute_resource"}}</label>
- <div class="ui blue mini menu compact selectcloudbrain">
- <a class="item" href="{{.RepoLink}}/cloudbrain/train-job/create">
- <svg class="svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16"
- height="16">
- <path fill="none" d="M0 0h24v24H0z" />
- <path
- d="M3 2.992C3 2.444 3.445 2 3.993 2h16.014a1 1 0 0 1 .993.992v18.016a.993.993 0 0 1-.993.992H3.993A1 1 0 0 1 3 21.008V2.992zM19 11V4H5v7h14zm0 2H5v7h14v-7zM9 6h6v2H9V6zm0 9h6v2H9v-2z" />
- </svg>
- CPU/GPU
- </a>
- <a class="active item" href="{{.RepoLink}}/modelarts/train-job/create">
- <svg class="svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16"
- height="16">
- <path fill="none" d="M0 0h24v24H0z" />
- <path
- d="M3 2.992C3 2.444 3.445 2 3.993 2h16.014a1 1 0 0 1 .993.992v18.016a.993.993 0 0 1-.993.992H3.993A1 1 0 0 1 3 21.008V2.992zM19 11V4H5v7h14zm0 2H5v7h14v-7zM9 6h6v2H9V6zm0 9h6v2H9v-2z" />
- </svg>
- Ascend NPU</a>
- </div>
- {{template "custom/wait_count_train" Dict "ctx" $}}
- <div style="display: flex;align-items: center;margin-left: 155px;margin-top: 0.5rem;">
- <i class="ri-error-warning-line" style="color: #f2711c;margin-right: 0.5rem;"></i>
- <span style="color: #888;font-size: 12px;">{{.i18n.Tr "cloudbrain.dataset_path_rule" | Safe}}</span>
- </div>
- </div>
- <div class="required inline min_title field">
- <label class="label-fix-width" style="font-weight: normal;">{{.i18n.Tr "repo.modelarts.train_job.job_name"}}</label>
- <input style="width: 60%;" name="display_job_name" id="display_job_name" placeholder={{.i18n.Tr "repo.modelarts.train_job.job_name"}} value="{{.display_job_name}}" tabindex="3" onkeyup="this.value=this.value.replace(/[, ]/g,'')" autofocus required maxlength="36">
- </div>
-
- <div class="inline min_title field">
- <label class="label-fix-width" style="font-weight: normal;" for="description">{{.i18n.Tr "repo.modelarts.train_job.description"}}</label>
- {{if .description}}
- <textarea style="width: 80%;" id="description" name="description" rows="3" maxlength="255" placeholder={{.i18n.Tr "repo.modelarts.train_job.new_place"}}>{{.description}}</textarea>
- {{else}}
- <textarea style="width: 80%;" id="description" name="description" rows="3" maxlength="255" placeholder={{.i18n.Tr "repo.modelarts.train_job.new_place"}} onchange="this.value=this.value.substring(0, 255)" onkeydown="this.value=this.value.substring(0, 255)" onkeyup="this.value=this.value.substring(0, 255)"></textarea>
- {{end}}
- </div>
- <div class="ui divider"></div>
-
- <h4 class="train-job-title ui header ">{{.i18n.Tr "repo.modelarts.train_job.parameter_setting"}}:</h4>
-
-
- <div class="required inline min_title field">
- <label class="label-fix-width" style="font-weight: normal;">{{.i18n.Tr "repo.modelarts.code_version"}}</label>
- <select class="ui dropdown width80 left2" id="code_version" name="branch_name">
- {{if .branch_name}}
- <option name="branch_name" value="{{.branch_name}}">{{.branch_name}}</option>
- {{range $k, $v :=.Branches}}
- {{ if ne $v $.branch_name }}
- <option name="branch_name" value="{{$v}}">{{$v}}</option>
- {{end}}
- {{end}}
- {{else}}
- <option name="branch_name" value="{{.branchName}}">{{.branchName}}</option>
- {{range $k, $v :=.Branches}}
- {{ if ne $v $.branchName }}
- <option name="branch_name" value="{{$v}}">{{$v}}</option>
- {{end}}
- {{end}}
- {{end}}
- </select>
- </div>
-
-
-
- <div class="required inline min_title fields" style="width: 95%;">
- <label class="label-fix-width" style="font-weight: normal;">{{.i18n.Tr "repo.modelarts.train_job.AI_driver"}}</label>
- <div class="field" style="flex: 1.5;">
- <select class="ui dropdown width" id="trainjob_engines">
- {{range .engines}}
- <option value="{{.Value}}">{{.Value}}</option>
- {{end}}
- </select>
- </div>
-
- <div class="field" style="flex: 2;" id="engine_name">
- <select class="ui dropdown width" id="trainjob_engine_versions" name="engine_id">
- {{if .engine_id}}
- {{range .engine_versions}}
- {{if eq $.engine_id .ID}}
- <option value="{{.ID}}">{{.Value}}</option>
- {{end}}
- {{end}}
- {{range .engine_versions}}
- {{if ne $.engine_id .ID}}
- <option value="{{.ID}}">{{.Value}}</option>
- {{end}}
- {{end}}
- {{else}}
- {{range .engine_versions}}
- <option value="{{.ID}}">{{.Value}}</option>
- {{end}}
- {{end}}
- </select>
-
- </div>
-
- </div>
-
- <div class="inline field min_title required">
- <label class="label-fix-width" style="font-weight: normal;">{{.i18n.Tr "repo.modelarts.train_job.start_file"}}</label>
- {{if .bootFile}}
- <input style="width: 48.5%;" name="boot_file" id="trainjob_boot_file" value="{{.bootFile}}" tabindex="3" autofocus required maxlength="255" >
- {{else}}
- <input style="width: 48.5%;" name="boot_file" id="trainjob_boot_file" value="" tabindex="3" autofocus required maxlength="255" >
- {{end}}
- <span>
- <i class="question circle icon link" data-content={{.i18n.Tr "repo.modelarts.train_job.boot_file_helper"}} data-position="right center" data-variation="mini"></i>
- </span>
- <a href="https://git.openi.org.cn/OpenIOSSG/MINIST_Example" target="_blank">{{.i18n.Tr "cloudbrain.view_sample"}}</a>
- </div>
-
- <div id="select-multi-dataset">
-
- </div>
- <span class="tooltips" style="margin-left: 11.5rem;margin-bottom: 1rem;"></span>
- <div class="inline min_title field">
- <label class="label-fix-width" style="font-weight: normal;">{{.i18n.Tr "repo.modelarts.train_job.run_parameter"}}</label>
- <span id="add_run_para" style="margin-left: 0.5rem;cursor:pointer;color: rgba(3, 102, 214, 100);font-size: 14px;line-height: 26px;font-family: SourceHanSansSC-medium;"><i class="plus square outline icon"></i>{{.i18n.Tr "repo.modelarts.train_job.add_run_parameter"}}</span>
- <input id="store_run_para" type="hidden" name="run_para_list">
- <div class="dynamic field" style="margin-top: 1rem;">
- {{if ne 0 (len .params)}}
- {{range $k ,$v := .params}}
- <div class="two fields width85" id="para{{$k}}">
- <div class="field">
- <input type="text" name="shipping_first-name" value={{$v.Label}} required>
- </div>
- <div class="field">
- <input type="text" name="shipping_last-name" value={{$v.Value}} required>
- </div>
- <span>
- <i class="trash icon"></i>
- </span>
-
- </div>
- {{end}}
- {{end}}
- </div>
- </div>
-
- <div class="required min_title field " style="display: none;">
- <label style="font-weight: normal;">{{.i18n.Tr "repo.modelarts.train_job.resource_pool"}}</label>
- <select class="ui dropdown" id="trainjob_resource_pool" style='width:385px' name="pool_id">
- {{range .resource_pools}}
- <option value="{{.ID}}">{{.Value}}</option>
- {{end}}
- </select>
- </div>
-
- <div class="required grouped fields" style="display: none;">
- <label style="font-weight: normal;"
- for="resource_type">{{.i18n.Tr "repo.modelarts.train_job.resource_type"}}</label>
- <div class="field">
- <div class="ui grid">
- <div class="column">
- <div class="ui radio checkbox">
- <input type="radio" name="resource_type" checked="" tabindex="0">
- </div>
- </div>
- <div class="three wide column">train-private-1</div>
- <div class="three wide column">{{svg "octicon-verified" 16}} 运行中</div>
- <div class="three wide column"> CPU:192 核 2048GiB</div>
- </div>
- </div>
- </div>
- <div class="required inline min_title field" id="flaver_name">
- <label class="label-fix-width" style="font-weight: normal;">{{.i18n.Tr "repo.modelarts.train_job.standard"}}</label>
- <select class="ui dropdown width48" id="trainjob-flavor" name="flavor">
- {{if .flavor}}
- {{range .flavor_infos}}
- {{if eq $.flavor .Code}}
- <option value="{{.Code}}">{{.Value}}</option>
- {{end}}
- {{end}}
- {{range .flavor_infos}}
- {{if ne $.flavor .Code}}
- <option value="{{.Code}}">{{.Value}}</option>
- {{end}}
- {{end}}
- {{else}}
- {{range .flavor_infos}}
- <option name="flavor" value="{{.Code}}">{{.Value}}</option>
- {{end}}
- {{end}}
- </select>
- </div>
- <div class="inline required min_title field">
- <label class="label-fix-width" style="font-weight: normal;">{{.i18n.Tr "repo.modelarts.train_job.amount_of_compute_node"}}</label>
-
- <div class="ui labeled input" style="width: 5%;">
-
- <input style="border-radius: 0;text-align: center;" type="hidden" name="work_server_number"
- id="trainjob_work_server_num" tabindex="3" autofocus required maxlength="255" value="1"
- readonly>
- <div class="field" id="trainjob_work_server_num_select" name="work_server_number_select">
- <select class="ui dropdown width" style='width: 100%;' name="work_server_id">
- <option name="server_id" value="1">1</option>
- </select>
- </div>
-
- </div>
- </div>
-
- <div class="inline field" style="padding: 1rem 0;">
- <label class="label-fix-width"></label>
- <button class="ui create_train_job green button">
- {{.i18n.Tr "repo.cloudbrain.new"}}
- </button>
- <a class="ui button" href="/">{{.i18n.Tr "repo.cloudbrain.cancel"}}</a>
- </div>
-
- <!-- 模态框 -->
-
- </form>
- </div>
- </div>
- </div>
- {{template "base/footer" .}}
-
- <script>
- let url_href = window.location.pathname.split('create')[0]
- $(".ui.button").attr('href', url_href)
- $('select.dropdown')
- .dropdown();
-
- $('.menu .item')
- .tab();
- $(document).keydown(function(event){
- switch(event.keyCode){
- case 13:return false;
- }
- });
- // let sever_num = $("#trainjob_work_server_num_select .text").text() //$('#trainjob_work_server_num')
- // console.log("sever_num:",sever_num)
- // $('.add').click(function(){
- // sever_num.val(parseInt(sever_num.val())+1)
- // if(sever_num.val()>=26){
- // sever_num.val(parseInt(sever_num.val())-1)
- // }
- // })
- // $('.min').click(function(){
- // sever_num.val(parseInt(sever_num.val())-1)
- // if(sever_num.val()<=0){
- // sever_num.val(parseInt(sever_num.val())+1)
- // }
- // })
- // 参数增加、删除、修改、保存
- function Add_parameter(i) {
- value = '<div class="two fields width85" id= "para' + i + '">' +
- '<div class="field">' +
- '<input type="text" name="shipping_first-name" required placeholder={{.i18n.Tr "repo.modelarts.train_job.parameter_name"}}> ' +
- '</div> ' +
- '<div class="field"> ' +
- '<input type="text" name="shipping_last-name" required placeholder={{.i18n.Tr "repo.modelarts.train_job.parameter_value"}}>' +
- '</div>' +
- '<span>' +
- '<i class="trash icon">' +
- '</i>' +
- '</span>' +
- '</div>'
- $(".dynamic.field").append(value)
- }
-
- $('#add_run_para').click(function () {
- var len = $(".dynamic.field .two.fields").length
- Add_parameter(len)
- });
-
- $(".dynamic.field").on("click", ".trash.icon", function () {
- var index = $(this).parent().parent().index()
- $(this).parent().parent().remove()
- var len = $(".dynamic.field .two.fields").length
- $(".dynamic.field .two.fields").each(function () {
- var cur_index = $(this).index()
- $(this).attr('id', 'para' + cur_index)
- })
- });
-
- $('.ui.parameter.green.button').click(function () {
- var parameters = [];
- $('table tr').each(function () {
- $(this).find('td:eq(1)').each(function () {
- parameters.push($(this).text());
- })
- $(this).find('input').each(function () {
- parameters.push($(this).text())
- })
-
- });
- $('.ui.parameter.modal')
- .modal('hide');
- for (var i = 2; i < parameters.length; i++) {
- switch (i) {
- // 数据集uuid待完成
- // case (2):
- // console.log(1)
- // break;
- // $("#trainjob_datasets").val(parameters[i]);
- // console.log($("#trainjob_datasets").val())
- case (3):
- $("input[name='boot_file']").val(parameters[i]);
- break;
- case (4):
- var para = parameters[i].split(" ")
- for (var j = 0; j < para.length; j++) {
- var para_name = para[j].split('=')[0]
- var para_value = para[j].split('=')[1]
- var len = $(".dynamic.field .two.fields").length
- Add_parameter(len)
- var pid = 'para' + len
- $(".dynamic.field" + " #" + pid + "").find("input[name=shipping_first-name]").val(para_name)
- $(".dynamic.field" + " #" + pid + "").find("input[name=shipping_last-name]").val(para_value)
- }
- break;
- // 数据集pool_id待完成
- // case (5):
- // $("select[name='pool_id']").val(parameters[i]);
- // break;
- case (6):
- // $("input[name='work_server_number']").val(parameters[i]);
- break;
- }
- }
- })
-
- $('.ui.save.checkbox').click(function () {
- $(this).checkbox({
- onChange: function () {
- if ($('.ui.save.checkbox').checkbox('is checked')) {
- $('#save_para').removeClass("disabled")
-
- } else {
- $('#save_para').addClass("disabled")
- }
- }
- });
- })
-
- $('.question.circle.icon').hover(function () {
- $(this).popup('show')
- });
-
- $(".item.active.parameter_config").click(function () {
- $('.ui.parameter.modal')
- .modal('setting', 'closable', false)
- .modal('show');
- })
-
- $('.ui.deny.button').click(function () {
- $('.ui.parameter.modal')
- .modal('hide');
- })
- $('select.dropdown')
- .dropdown();
-
- function validate() {
- $('.ui.form')
- .form({
- on: 'blur',
- fields: {
- boot_file: {
- identifier: 'boot_file',
- rules: [
- {
- type: 'regExp[/.+\.py$/g]',
- }
- ]
- },
- display_job_name: {
- identifier: 'display_job_name',
- rules: [
- {
- type: 'regExp[/^[a-z0-9][a-z0-9-_]{1,34}[a-z0-9-]$/]',
- }
- ]
- },
- attachment: {
- identifier: 'attachment',
- rules: [
- {
- type: 'empty',
- }
- ]
-
- },
- work_server_number: {
- identifier: 'work_server_number',
- rules: [
- {
- type: 'integer[1..25]',
- }
- ]
- }
- },
- onSuccess: function () {
- // $('.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 = {}
- $(".dynamic.field .two.fields").each(function () {
- var para_name = $(this).find('input[name=shipping_first-name]').val()
- var para_value = $(this).find('input[name=shipping_last-name]').val()
- run_parameters.push({ "label": para_name, "value": para_value })
- })
- msg["parameter"] = run_parameters
- msg = JSON.stringify(msg)
- $('#store_run_para').val(msg)
- }
- function get_name() {
- let name1 = $("#engine_name .text").text()
- let name2 = $("#flaver_name .text").text()
- $("input#ai_engine_name").val(name1)
- $("input#ai_flaver_name").val(name2)
-
- let val_server_num_select = $("#trainjob_work_server_num_select .text").text()
- // console.log("val_server_num_select:",val_server_num_select)
- $("input#trainjob_work_server_num").val(val_server_num_select)
-
- }
- validate();
- $('.ui.create_train_job.green.button').click(function (e) {
- get_name()
- send_run_para();
- validate();
- })
- </script>
|