| @@ -1,139 +1,269 @@ | |||
| {{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"> | |||
| {{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 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> | |||
| </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> | |||
| <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> | |||
| <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> | |||
| </tbody> | |||
| </table> | |||
| </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 class="ui attached segment log" style="height: 300px !important; overflow: auto;"> | |||
| <pre>{{.log.Content}}</pre> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <div class="ui tab" data-tab="third"> | |||
| <div class="content-pad"> | |||
| asdasd | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| @@ -143,8 +273,15 @@ | |||
| <script> | |||
| $('.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 repoPath | |||
| var jobID | |||