| @@ -1,139 +1,269 @@ | |||||
| {{template "base/head" .}} | {{template "base/head" .}} | ||||
| <style> | |||||
| .according-panel-heading{ | |||||
| box-sizing: border-box; | |||||
| padding: 8px 16px; | |||||
| color: #252b3a; | |||||
| background-color: #f2f5fc; | |||||
| line-height: 1.5; | |||||
| cursor: pointer; | |||||
| -moz-user-select: none; | |||||
| -webkit-user-select: none; | |||||
| -ms-user-select: none; | |||||
| -khtml-user-select: none; | |||||
| user-select: none; | |||||
| } | |||||
| .accordion-panel-title { | |||||
| margin-top: 0; | |||||
| margin-bottom: 0; | |||||
| color: #252b3a; | |||||
| } | |||||
| .accordion-panel-title-content{ | |||||
| vertical-align: middle; | |||||
| display: inline-block; | |||||
| width: calc(100% - 32px); | |||||
| } | |||||
| .acc-margin-bottom { | |||||
| margin-bottom: 5px; | |||||
| } | |||||
| .title_text { | |||||
| font-size: 12px; | |||||
| } | |||||
| .ac-display-inblock { | |||||
| display: inline-block; | |||||
| } | |||||
| .cti-mgRight-sm { | |||||
| margin-right: 8px; | |||||
| } | |||||
| .ac-text-normal { | |||||
| font-size: 14px; | |||||
| color: #575d6c; | |||||
| } | |||||
| .uc-accordionTitle-black { | |||||
| color: #333; | |||||
| } | |||||
| .accordion-border{ | |||||
| border:1px solid #cce2ff; | |||||
| } | |||||
| .padding0{ | |||||
| padding: 0 !important; | |||||
| } | |||||
| .content-pad{ | |||||
| padding: 15px 35px; | |||||
| } | |||||
| .content-margin{ | |||||
| margin:10px 5px ; | |||||
| } | |||||
| .tab_2_content { | |||||
| min-height: 260px; | |||||
| margin-left: 10px; | |||||
| } | |||||
| .ac-grid { | |||||
| display: block; | |||||
| *zoom: 1; | |||||
| } | |||||
| .ac-grid-col { | |||||
| float: left; | |||||
| width: 100%; | |||||
| } | |||||
| .ac-grid-col2 .ac-grid-col { | |||||
| width: 50%; | |||||
| } | |||||
| .ti-form { | |||||
| text-align: left; | |||||
| max-width: 100%; | |||||
| vertical-align: middle; | |||||
| } | |||||
| .ti-form>tbody { | |||||
| font-size: 12px; | |||||
| } | |||||
| .ti-form>tbody, .ti-form>tbody>tr { | |||||
| vertical-align: inherit; | |||||
| } | |||||
| .ti-text-form-label { | |||||
| padding-bottom: 20px; | |||||
| color: #8a8e99; | |||||
| font-size: 12px; | |||||
| white-space: nowrap; | |||||
| width: 80px; | |||||
| line-height: 30px; | |||||
| } | |||||
| .ti-text-form-content{ | |||||
| line-height: 30px; | |||||
| padding-bottom: 20px; | |||||
| } | |||||
| .ti-form>tbody>tr>td { | |||||
| vertical-align: top; | |||||
| white-space: normal; | |||||
| } | |||||
| td, th { | |||||
| padding: 0; | |||||
| } | |||||
| .ac-grid-col .text-span { | |||||
| overflow: hidden; | |||||
| text-overflow: ellipsis; | |||||
| white-space: nowrap; | |||||
| } | |||||
| </style> | |||||
| <div class="repository"> | <div class="repository"> | ||||
| {{template "repo/header" .}} | {{template "repo/header" .}} | ||||
| <div class="repository new repo ui middle very relaxed page grid"> | |||||
| <div class="column"> | |||||
| {{template "base/alert" .}} | |||||
| <h4 class="ui top attached header"> | |||||
| <div class="ui two column grid"> | |||||
| <div class="column"> | |||||
| {{$.i18n.Tr "repo.modelarts.version_manage"}} | |||||
| <div class="ui container"> | |||||
| <h4 class="ui header" id="vertical-segment"> | |||||
| <a href="javascript:window.history.back();"><i class="arrow left icon"></i>返回</a> | |||||
| </h4> | |||||
| <div class="ui accordion"> | |||||
| <div class="title padding0"> | |||||
| <div class="according-panel-heading"> | |||||
| <div class="accordion-panel-title"> | |||||
| <i class="dropdown icon"></i> | |||||
| <span class="accordion-panel-title-content"> | |||||
| <span> | |||||
| <div style="float: right;"> | |||||
| <button>创建模型</button> | |||||
| <button>修改</button> | |||||
| <button>停止</button> | |||||
| <button>删除</button> | |||||
| </div> | |||||
| <div class="ac-display-inblock title_text acc-margin-bottom"> | |||||
| <span class="cti-mgRight-sm">2021/11/08 19:35:19</span> | |||||
| <span class="cti-mgRight-sm"> 当前版本:V0073</span> | |||||
| <span class="cti-mgRight-sm"> 父版本:V0070</span> | |||||
| <span class="cti-mgRight-sm ac-text-normal title_text">状态 | |||||
| <span><i id="icon" style="vertical-align: middle;" class=""></i><span id="text" style="margin-left: 0.4em;font-size: 12px;">运行成功</span></span> | |||||
| </span> | |||||
| <span class="ac-text-normal title_text">运行时间:</span> | |||||
| <span class="cti-mgRight-sm uc-accordionTitle-black">01:09:50</span> | |||||
| <span data-tooltip="刷新" data-inverted=""><i class="redo icon"></i></span> | |||||
| </div> | |||||
| </span> | |||||
| </span> | |||||
| </div> | </div> | ||||
| <div class="column right aligned"> | |||||
| <a href="javascript:window.history.back();">{{svg "octicon-reply" 16}}{{$.i18n.Tr "repo.modelarts.back"}}</a> | |||||
| </div> | |||||
| </div> | |||||
| <div class="content accordion-border"> | |||||
| <div class="content-pad"> | |||||
| <div class="ui pointing secondary menu"> | |||||
| <a class="active item" data-tab="first">配置信息</a> | |||||
| <a class="item" data-tab="second">日志文件</a> | |||||
| <a class="item" data-tab="third">模型下载</a> | |||||
| </div> | </div> | ||||
| </div> | |||||
| </h4> | |||||
| <div class="ui tab" data-tab="first"> | |||||
| <div style="padding-top: 10px;"> | |||||
| <div class="tab_2_content"> | |||||
| <div class="ac-grid ac-grid-col2"> | |||||
| <div class="ac-grid-col"> | |||||
| <table class="ti-form"> | |||||
| <tbody class="ti-text-form"> | |||||
| <tr class="ti-no-ng-animate"> | |||||
| <td class="ti-no-ng-animate ti-text-form-label"> | |||||
| 作业名称 | |||||
| </td> | |||||
| <div class="ui attached segment"> | |||||
| <div class="ui style accordion"> | |||||
| <div class="title active"> | |||||
| <i class="dropdown icon"></i> | |||||
| {{$.i18n.Tr "repo.modelarts.train_job.version"}} | |||||
| </div> | |||||
| <div class="content active"> | |||||
| <div class="ui container"> | |||||
| <div class="ui top attached tabular menu"> | |||||
| <a class="item active" data-tab="configs">{{$.i18n.Tr "repo.modelarts.train_job.config"}}</a> | |||||
| <a class="item logs" data-tab="logs">{{$.i18n.Tr "repo.modelarts.log"}}</a> | |||||
| <!-- <a class="item" data-tab="resources">资源占用情况</a> --> | |||||
| </div> | |||||
| <div class="ui bottom attached tab segment active" data-tab="configs"> | |||||
| <div> | |||||
| <div class="ui yellow segment"> | |||||
| <table class="ui celled striped table"> | |||||
| <thead> | |||||
| <tr> <th colspan="2"> {{.i18n.Tr "repo.modelarts.train_job.basic_info"}} </th> </tr> | |||||
| </thead> | |||||
| <tbody> | |||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.job_name"}} </td> | |||||
| <td>{{.result.JobName}}</td> | |||||
| </tr> | |||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.job_status"}} </td> | |||||
| <td>{{.result.Status}}</td> | |||||
| </tr> | |||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.version"}} </td> | |||||
| <td>{{.result.VersionName}}</td> | |||||
| </tr> | |||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.start_time"}} </td> | |||||
| <td>{{.result.CreateTime}}</td> | |||||
| </tr> | |||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.dura_time"}} </td> | |||||
| <td>{{.result.TrainJobDuration}}</td> | |||||
| </tr> | |||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.description"}} </td> | |||||
| <td>{{.result.Description}}</td> | |||||
| </tr> | |||||
| </tbody> | |||||
| </table> | |||||
| </div> | |||||
| <div class="ui green segment"> | |||||
| <table class="ui celled striped table"> | |||||
| <thead> | |||||
| <tr> <th colspan="2"> {{.i18n.Tr "repo.modelarts.train_job.parameter_setting_info"}} </th> </tr> | |||||
| </thead> | |||||
| <tbody> | |||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.AI_driver"}} </td> | |||||
| <td>{{.result.EngineName}} | {{.result.EngineVersion}}</td> | |||||
| </tr> | |||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.start_file"}}</td> | |||||
| <td>{{.result.BootFileUrl}}</td> | |||||
| </tr> | |||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.dataset"}} </td> | |||||
| <td>{{.result.DatasetName}}</td> | |||||
| </tr> | |||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.run_parameter"}} </td> | |||||
| <td>{{.result.Parameter}}</td> | |||||
| </tr> | |||||
| </tbody> | |||||
| </table> | |||||
| </div> | |||||
| <div class="ui blue segment"> | |||||
| <table class="ui celled striped table"> | |||||
| <thead> | |||||
| <tr> <th colspan="2"> {{.i18n.Tr "repo.modelarts.train_job.resource_setting_info"}} </th> </tr> | |||||
| </thead> | |||||
| <tbody> | |||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.resource_pool"}} </td> | |||||
| <td>{{.result.PoolName}}</td> | |||||
| <td class="ti-text-form-content"> | |||||
| <div class="text-span text-span-w"> | |||||
| trainjob-d672 | job15b681bc | |||||
| </div> | |||||
| </td> | |||||
| </tr> | |||||
| <tr class="ti-no-ng-animate"> | |||||
| <td class="ti-no-ng-animate ti-text-form-label"> | |||||
| 作业名称 | |||||
| </td> | |||||
| <td class="ti-text-form-content"> | |||||
| <div class="text-span text-span-w"> | |||||
| trainjob-d672 | job15b681bc | |||||
| </div> | |||||
| </td> | |||||
| </tr> | |||||
| <tr class="ti-no-ng-animate"> | |||||
| <td class="ti-no-ng-animate ti-text-form-label"> | |||||
| 作业名称 | |||||
| </td> | |||||
| <td class="ti-text-form-content"> | |||||
| <div class="text-span text-span-w"> | |||||
| trainjob-d672 | job15b681bc | |||||
| </div> | |||||
| </td> | |||||
| </tr> | |||||
| </tbody> | |||||
| </table> | |||||
| </div> | |||||
| <div class="ac-grid-col"> | |||||
| <table class="ti-form"> | |||||
| <tbody class="ti-text-form"> | |||||
| <tr class="ti-no-ng-animate"> | |||||
| <td class="ti-no-ng-animate ti-text-form-label"> | |||||
| 作业名称 | |||||
| </td> | |||||
| <td class="ti-text-form-content"> | |||||
| <div class="text-span text-span-w"> | |||||
| trainjob-d672 | job15b681bc | |||||
| </div> | |||||
| </td> | |||||
| </tr> | </tr> | ||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.amount_of_compute_node"}}</td> | |||||
| <td>{{.result.WorkServerNum}}</td> | |||||
| <tr class="ti-no-ng-animate"> | |||||
| <td class="ti-no-ng-animate ti-text-form-label"> | |||||
| 作业名称 | |||||
| </td> | |||||
| <td class="ti-text-form-content"> | |||||
| <div class="text-span text-span-w"> | |||||
| trainjob-d672 | job15b681bc | |||||
| </div> | |||||
| </td> | |||||
| </tr> | </tr> | ||||
| <tr> | |||||
| <td class="four wide"> {{.i18n.Tr "repo.modelarts.train_job.NAS_mount_path"}} </td> | |||||
| <td>{{.result.NasMountPath}}</td> | |||||
| <tr class="ti-no-ng-animate"> | |||||
| <td class="ti-no-ng-animate ti-text-form-label"> | |||||
| 作业名称 | |||||
| </td> | |||||
| <td class="ti-text-form-content"> | |||||
| <div class="text-span text-span-w"> | |||||
| trainjob-d672 | job15b681bc | |||||
| </div> | |||||
| </td> | |||||
| </tr> | </tr> | ||||
| </tbody> | </tbody> | ||||
| </table> | </table> | ||||
| </div> | </div> | ||||
| </div> | |||||
| </div> | </div> | ||||
| <div class="ui bottom attached tab segment" data-tab="logs"> | |||||
| <div class="ui message" style="display: none;"> | |||||
| <div class="header"> | |||||
| </div> | |||||
| </div> | |||||
| <div class="ui top attached segment" style="background: #f0f0f0;"> | |||||
| <div class="center aligned"> | |||||
| <label>{{$.i18n.Tr "repo.modelarts.log"}}:</label> | |||||
| <span class="fitted file_name">{{.log_file_name}}</span> | |||||
| <input type="hidden" name="file_name" value={{.log_file_name}}> | |||||
| <input type="hidden" name="start_line" value={{.log.StartLine}}> | |||||
| <input type="hidden" name="end_line" value={{.log.EndLine}}> | |||||
| </div> | |||||
| </div> | |||||
| <div class="ui attached segment log" style="height: 300px !important; overflow: auto;"> | |||||
| <pre>{{.log.Content}}</pre> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| <div class="ui tab" data-tab="second"> | |||||
| <div> | |||||
| <div class="ui message" style="display: none;"> | |||||
| <div class="header"></div> | |||||
| </div> | |||||
| <div class="ui top attached segment" style="background: #f0f0f0;"> | |||||
| <div class="center aligned"> | |||||
| <label>{{$.i18n.Tr "repo.modelarts.log"}}:</label> | |||||
| <span class="fitted file_name">{{.log_file_name}}</span> | |||||
| <input type="hidden" name="file_name" value={{.log_file_name}}> | |||||
| <input type="hidden" name="start_line" value={{.log.StartLine}}> | |||||
| <input type="hidden" name="end_line" value={{.log.EndLine}}> | |||||
| </div> | </div> | ||||
| </div> | |||||
| <div class="ui attached segment log" style="height: 300px !important; overflow: auto;"> | |||||
| <pre>{{.log.Content}}</pre> | |||||
| </div> | |||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| <div class="ui tab" data-tab="third"> | |||||
| <div class="content-pad"> | |||||
| asdasd | |||||
| </div> | |||||
| </div> | |||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| @@ -143,8 +273,15 @@ | |||||
| <script> | <script> | ||||
| $('.menu .item').tab() | $('.menu .item').tab() | ||||
| $('.ui.style.accordion').accordion(); | |||||
| // $('.ui.style.accordion').accordion(); | |||||
| // $(document).ready(function(){ | |||||
| // $('.ui.accordion').accordion({selector:{trigger:'.icon'}}); | |||||
| // }); | |||||
| $(document).ready(function(){ | |||||
| $('.secondary.menu .item').tab(); | |||||
| }); | |||||
| var userName | var userName | ||||
| var repoPath | var repoPath | ||||
| var jobID | var jobID | ||||