OpenI
/
aiforge
Not watched
1
0
Fork 0
Code
Releases 128 Wiki Activity
Issues 0 Pull Requests 0 Datasets Model Cloudbrain
You can not select more than 25 topics Topics must start with a chinese character,a letter or number, can include dashes ('-') and can be up to 35 characters long.
Tree: 60a0699875
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from '60a0699875'
${ noResults }
aiforge/templates/repo/modelmanage/convertshowinfo.tmpl

861 lines
40 kB
Raw Blame History 

  1. {{template "base/head" .}}

  2. <style>

  3. .according-panel-heading{

  4.     box-sizing: border-box;

  5.     padding: 8px 16px;

  6.     color: #252b3a;

  7.     background-color: #f2f5fc;

  8.     line-height: 1.5;

  9.     cursor: pointer;

  10.     -moz-user-select: none;

  11.     -webkit-user-select: none;

  12.     -ms-user-select: none;

  13.     -khtml-user-select: none;

  14.     user-select: none;

  15. }

  16. .accordion-panel-title {

  17.     margin-top: 0;

  18.     margin-bottom: 0;

  19.     color: #252b3a;

  20. }

  21. .accordion-panel-title-content{

  22.     vertical-align: middle;

  23.     display: inline-block;

  24.     width: calc(100% - 32px);

  25.     cursor: default;

  26. }

  27. .acc-margin-bottom {

  28.     margin-bottom: 5px;

  29. }

  30. .title_text {

  31.     font-size: 12px;

  32. }

  33. .ac-display-inblock {

  34.     display: inline-block;

  35. }

  36. .cti-mgRight-sm {

  37.     margin-right: 8px;

  38. }

  39. .ac-text-normal {

  40.     font-size: 14px;

  41.     color: #575d6c;

  42. }

  43. .uc-accordionTitle-black {

  44.     color: #333;

  45. }

  46. .accordion-border{

  47.     border:1px solid #cce2ff;

  48. }

  49. .padding0{

  50.     padding: 0 !important;

  51. }

  52. .content-pad{

  53.     padding: 15px 35px;

  54. }

  55. .content-margin{

  56.     margin:10px 5px ;

  57. }

  58. .tab_2_content {

  59.     min-height: 360px;

  60.     margin-left: 10px;

  61. }

  62. .ac-grid {

  63.     display: block;

  64.     *zoom: 1;

  65. }

  66. .ac-grid-col {

  67.     float: left;

  68.     width: 100%;

  69. }

  70. .ac-grid-col2 .ac-grid-col {

  71.     width: 50%;

  72. }

  73. .ti-form {

  74.     text-align: left;

  75.     max-width: 100%;

  76.     vertical-align: middle;

  77. }

  78. .ti-form>tbody {

  79.     font-size: 12px;

  80. }

  81. .ti-form>tbody, .ti-form>tbody>tr {

  82.     vertical-align: inherit;

  83. }

  84. .ti-text-form-label {

  85.     

  86.     padding-bottom: 20px;

  87.     padding-right: 20px;

  88.     color: #8a8e99;

  89.     font-size: 12px;

  90.     white-space: nowrap !important;

  91.     width: 80px;

  92.     line-height: 30px;

  93. }

  94. .ti-text-form-content{

  95.     line-height: 30px;

  96.     padding-bottom: 20px;

  97. }

  98. .ti-form>tbody>tr>td {

  99.     vertical-align: top;

  100.     white-space: normal;

  101. }

  102. td, th {

  103.     padding: 0;

  104. }

  105. .info_text {

  106.     padding-bottom: 20px;

  107.     padding-right: 20px;

  108.     font-size: 12px;

  109. }

  110. .ac-grid-col .text-span {

  111.     width: 450px;

  112.     overflow: hidden;

  113.     text-overflow: ellipsis;

  114.     white-space: nowrap;

  115. }

  116. .redo-color{

  117.     color: #3291F8;

  118. }

  119. .ti-action-menu-item:not(:last-child){

  120.     margin-right: 10px;

  121.     padding-right: 11px;

  122.     text-decoration: none!important;

  123.     color: #526ecc;

  124.     cursor: pointer;

  125.     display: inline-block;

  126.     -moz-user-select: none;

  127.     -webkit-user-select: none;

  128.     -ms-user-select: none;

  129.     -khtml-user-select: none;

  130.     user-select: none;

  131.     position: relative;

  132. }

  133. .ti-action-menu-item:not(:last-child):after {

  134.     content: "";

  135.     display: inline-block;

  136.     position: absolute;

  137.     height: 12px;

  138.     right: 0;

  139.     top: 50%;

  140.     -webkit-transform: translateY(-6px);

  141.     -ms-transform: translateY(-6px);

  142.     -o-transform: translateY(-6px);

  143.     transform: translateY(-6px);

  144.     border-right: 1px solid #dfe1e6;

  145. }

  146. .text-width80{

  147.     width: 100px;

  148.     line-height: 30px;

  149. }

  150. .border-according-model{

  151.     border: 1px solid #dfe1e6;

  152. }

  153. .disabled {

  154.         cursor: default;

  155.         pointer-events: none;

  156.         color: rgba(0,0,0,.6) !important;

  157.         opacity: .45 !important;

  158. }

  159. .pad20{

  160.     

  161.     border:0px !important;

  162. }

  163. .model_file_bread{

  164.     margin-bottom: -0.5rem !important;

  165.     padding-left: 1rem;

  166.     padding-top: 0.5rem ;

  167. }

  168. </style>

  169. {{template "custom/global_mask" .}}

  170. <div class="repository">

  171. {{template "repo/header" .}}

  172.     <div class="ui container">

  173.         <h4 class="ui header" id="vertical-segment">

  174.             <div class="ui breadcrumb">

  175.                 <a class="section" href="{{$.RepoLink}}/modelmanage/convert_model">

  176.                     {{.i18n.Tr "repo.modelconvert.taskurlname"}}

  177.                 </a>

  178.                 <div class="divider"> / </div>

  179. 				<div class="active section">{{.Name}}</div>

  180. 			</div>

  181.         </h4>

  182.     {{with .task}}

  183.         <div class="ui accordion border-according-model"  id="accordion" data-repopath="{{$.RepoRelPath}}" data-jobid="{{.CloudBrainTaskId}}" data-version="1">

  184.             <input type="hidden" id="jobId_input" name="jobId_input" value="{{.CloudBrainTaskId}}">

  185.             <div class="active title padding0">

  186.                 <div class="according-panel-heading">

  187.                     <div class="accordion-panel-title">

  188.                         <i class="dropdown icon"></i>

  189.                         <span class="accordion-panel-title-content">

  190.                             <span>

  191.                                 <div class="ac-display-inblock title_text acc-margin-bottom">

  192.                                     <span class="cti-mgRight-sm">{{TimeSinceUnix1 .CreatedUnix}}</span>   

  193.          

  194.                                     <span class="cti-mgRight-sm">{{$.i18n.Tr "repo.modelarts.status"}}：

  195.                                         <span id="status-span"><i id="icon" style="vertical-align: middle;" class="{{.Status}}"></i><span id="text" style="margin-left: 0.4em;font-size: 12px;">{{.Status}}</span></span>

  196.                                     </span>

  197.                                     <span class="cti-mgRight-sm">{{$.i18n.Tr "repo.modelarts.train_job.dura_time"}}：</span>

  198.                                     <span class="cti-mgRight-sm uc-accordionTitle-black" id="duration-span">{{.TrainJobDuration}}</span>

  199.                                     

  200.                                 </div>

  201.                             </span>

  202.                         </span>

  203.                     </div>

  204.                 </div>

  205.             </div>

  206.             <div class="active content">

  207.                 <div class="content-pad">

  208.                     <div class="ui pointing secondary menu" style="border-bottom: 1px solid rgba(34,36,38,.15);">

  209.                         <a class="active item" data-tab="first">{{$.i18n.Tr "repo.modelarts.train_job.config"}}</a>

  210.                         <a id="gpuruntimeinfo" style="display: {{$.gpu_display}};" class="item" data-tab="second" onclick="javascript:parseInfo()">{{$.i18n.Tr "repo.cloudbrain.runinfo"}}</a>

  211.                         <a id="gpulog" style="display: {{$.gpu_display}};" class="item" data-tab="third" onclick="loadLog()">{{$.i18n.Tr "repo.modelarts.log"}}</a>

  212.                         <a id="npulog" style="display: {{$.npu_display}};" class="item log_bottom" data-tab="five" data-version="">{{$.i18n.Tr "repo.modelarts.log"}}</a>

  213.                         <a class="item" data-tab="four" onclick="loadModelFile()">{{$.i18n.Tr "repo.model_download"}}</a>

  214.                     </div>

  215.                     <div class="ui tab active" data-tab="first">

  216.                         <div style="padding-top: 10px;">

  217.                             <div class="tab_2_content">

  218.                                 <div class="ac-grid ac-grid-col2">

  219.                                     <div class="ac-grid-col">

  220.                                         <table class="ti-form">

  221.                                             <tbody class="ti-text-form">

  222.                                                 <tr class="ti-no-ng-animate">

  223.                                                     <td class="ti-no-ng-animate ti-text-form-label text-width80">

  224.                                                         {{$.i18n.Tr "repo.cloudbrain_task"}}

  225.                                                     </td>

  226.                                                     <td class="ti-text-form-content">

  227.                                                         <div class="text-span text-span-w">

  228.                                                             {{.Name}}

  229.                                                         </div>

  230.                                                     </td>

  231.                                                 </tr>

  232.                                                 <tr class="ti-no-ng-animate">

  233.                                                     <td class="ti-no-ng-animate ti-text-form-label text-width80">

  234.                                                         {{$.i18n.Tr "repo.modelarts.status"}}

  235.                                                     </td>

  236. 

  237.                                                     <td class="ti-text-form-content">

  238.                                                         <div class="text-span text-span-w" id="status">

  239.                                                             {{.Status}}

  240.                                                         </div>

  241.                                                     </td>

  242.                                                 </tr>

  243. 

  244.                                                 <tr class="ti-no-ng-animate">

  245.                                                     <td class="ti-no-ng-animate ti-text-form-label text-width80">

  246.                                                         {{$.i18n.Tr "repo.modelconvert.inputshape"}}

  247.                                                     </td>

  248. 

  249.                                                     <td class="ti-text-form-content">

  250.                                                         <div class="text-span text-span-w" id="InputShape">

  251.                                                             {{.InputShape}}

  252.                                                         </div>

  253.                                                     </td>

  254.                                                 </tr>

  255.                                                 

  256.                                                 <tr class="ti-no-ng-animate">

  257.                                                     <td class="ti-no-ng-animate ti-text-form-label text-width80">

  258.                                                         {{$.i18n.Tr "repo.modelconvert.inputdataformat"}}

  259.                                                     </td>

  260. 

  261.                                                     <td class="ti-text-form-content">

  262.                                                         <div class="text-span text-span-w" id="InputDataFormat">

  263.                                                             {{.InputDataFormat}}

  264.                                                         </div>

  265.                                                     </td>

  266.                                                 </tr>

  267.                                                 

  268. 

  269.                                                 <tr class="ti-no-ng-animate">

  270.                                                     <td class="ti-no-ng-animate ti-text-form-label text-width80">

  271.                                                         {{$.i18n.Tr "repo.modelarts.train_job.start_time"}} 

  272.                                                     </td>

  273.         

  274.                                                     <td class="ti-text-form-content">

  275.                                                         <div class="text-span text-span-w">

  276.                                                             <span style="font-size: 12px;" class="">{{TimeSinceUnix1 .CreatedUnix}}</span>

  277.                                                         </div>

  278.                                                     </td>

  279.                                                 </tr>

  280.                                                 <tr class="ti-no-ng-animate">

  281.                                                     <td class="ti-no-ng-animate ti-text-form-label text-width80">

  282.                                                         {{$.i18n.Tr "repo.modelarts.train_job.dura_time"}} 

  283.                                                     </td>

  284.         

  285.                                                     <td class="ti-text-form-content">

  286.                                                         <div class="text-span text-span-w" id="duration">

  287.                                                             {{.TrainJobDuration}}

  288.                                                         </div>

  289.                                                     </td>

  290.                                                 </tr>

  291. 

  292.                                                 <tr class="ti-no-ng-animate">

  293.                                                     <td class="ti-no-ng-animate ti-text-form-label text-width80">

  294.                                                         {{$.i18n.Tr "repo.modelconvert.netoutputdata"}}

  295.                                                     </td>

  296.         

  297.                                                     <td class="ti-text-form-content">

  298.                                                         <div class="text-span text-span-w" id="duration">

  299.                                                             {{if eq .NetOutputFormat 0}}FP32 {{else if eq .NetOutputFormat 1}}FP16 {{end}}

  300.                                                         </div>

  301.                                                     </td>

  302.                                                 </tr>

  303.                                                                           

  304.                                                 

  305.                                             </tbody>

  306.                                         </table>

  307.                                     </div>

  308.                                     <div class="ac-grid-col">

  309.                                             <table class="ti-form">

  310.                                                 <tbody class="ti-text-form">

  311.                                                                    

  312.                                                     <tr class="ti-no-ng-animate">

  313.                                                         <td class="ti-no-ng-animate ti-text-form-label text-width80">

  314.                                                             {{$.i18n.Tr "repo.modelconvert.modelname"}}

  315.                                                         </td>

  316. 

  317.                                                         <td class="ti-text-form-content">

  318.                                                             <div class="text-span text-span-w">

  319.                                                                 {{.ModelName}}

  320.                                                             </div>

  321.                                                         </td>

  322.                                                     </tr>

  323. 

  324. 

  325.                                                     <tr class="ti-no-ng-animate">

  326.                                                         <td class="ti-no-ng-animate ti-text-form-label text-width80">

  327.                                                             {{$.i18n.Tr "repo.modelconvert.modelversion"}}

  328.                                                         </td>

  329. 

  330.                                                         <td class="ti-text-form-content">

  331.                                                             <div class="text-span text-span-w">

  332.                                                                 {{.ModelVersion}}

  333.                                                             </div>

  334.                                                         </td>

  335.                                                     </tr>

  336. 

  337. 

  338.                                                     <tr class="ti-no-ng-animate">

  339.                                                         <td class="ti-no-ng-animate ti-text-form-label text-width80">

  340.                                                             {{$.i18n.Tr "repo.model.manage.modelfile"}}

  341.                                                         </td>

  342. 

  343.                                                         <td class="ti-text-form-content">

  344.                                                             <div class="text-span text-span-w">

  345.                                                                 {{.ModelPath}}

  346.                                                             </div>

  347.                                                         </td>

  348.                                                     </tr>

  349.                                                    

  350. 

  351.                                                     <tr class="ti-no-ng-animate">

  352.                                                         <td class="ti-no-ng-animate ti-text-form-label text-width80">

  353.                                                             {{$.i18n.Tr "repo.modelconvert.srcengine"}}

  354.                                                         </td>

  355. 

  356.                                                         <td class="ti-text-form-content">

  357.                                                             <div class="text-span text-span-w">

  358.                                                                 {{if eq .SrcEngine 0}}PyTorch {{else if eq .SrcEngine 1}}Tensorflow{{else if eq .SrcEngine 2}}MindSpore {{else if eq .SrcEngine 4}}PaddlePaddle{{else if eq .SrcEngine 6}} MXNet{{end}}

  359.                                                             </div>

  360.                                                         </td>

  361.                                                     </tr>

  362. 

  363.                                                     <tr class="ti-no-ng-animate">

  364.                                                         <td class="ti-no-ng-animate ti-text-form-label text-width80">

  365.                                                             {{$.i18n.Tr "repo.modelconvert.outputformat"}}

  366.                                                         </td>

  367. 

  368.                                                         <td class="ti-text-form-content">

  369.                                                             <div class="text-span text-span-w">

  370.                                                                 {{if eq .DestFormat 0}}ONNX {{else if eq .DestFormat 1}}TensorRT {{end}}

  371.                                                             </div>

  372.                                                         </td>

  373.                                                     </tr>

  374.                                                     

  375.                                                     <tr class="ti-no-ng-animate">

  376.                                                         <td class="ti-no-ng-animate ti-text-form-label text-width80">

  377.                                                             {{$.i18n.Tr "repo.modelarts.train_job.description"}}  

  378.                                                         </td>

  379.                 

  380.                                                         <td class="ti-text-form-content">

  381.                                                             <div class="text-span text-span-w" title="{{.Description}}">

  382.                                                                 {{.Description}}

  383.                                                             </div>

  384.                                                         </td>

  385.                                                     </tr>

  386. 

  387.                                                     <tr class="ti-no-ng-animate">

  388.                                                         <td class="ti-no-ng-animate ti-text-form-label text-width80">

  389.                                                             {{$.i18n.Tr "repo.cloudbrain_creator"}}

  390.                                                         </td>

  391. 

  392.                                                         <td class="ti-text-form-content">

  393.                                                             <div class="text-span text-span-w" id="username">

  394.                                                                 {{.UserName}}

  395.                                                             </div>

  396.                                                         </td>

  397.                                                     </tr>

  398.                                                 </tbody>

  399.                                             </table>

  400.                                         </div>

  401.                                 </div>

  402.                             </div>

  403.                             <div style="clear: both;"></div>

  404.                         </div>

  405.                     </div>

  406. 

  407.                     <div class="ui tab" data-tab="second">

  408.                         <div>

  409.                             <div class="ui message message" style="display: none;">

  410.                                 <div id="header"></div>

  411.                             </div>

  412.                             <div class="ui attached  log"  id="log" style="height: 390px !important; overflow: auto;">

  413.                                 <input type="hidden" id="json_value" value="{{$.AppExitDiagnostics}}">

  414.                                 <input type="hidden" id="ExitDiagnostics" value="{{$.ExitDiagnostics}}">

  415.                                 <span id="info_display" class="info_text">

  416.                                         

  417.                                 </span>

  418.                             </div>

  419. 

  420.                         </div>

  421. 

  422.                     </div>

  423. 

  424.                     <div class="ui tab" data-tab="third">

  425.                         <div>

  426.                             <div class="ui message message" style="display: none;">

  427.                                 <div id="header"></div>

  428.                             </div>

  429.                             <div class="ui attached log"  id="log" style="height: 300px !important; overflow: auto;position: relative;">

  430.                                 <div class="ui inverted active dimmer">

  431.                                     <div class="ui loader"></div>

  432.                                 </div>

  433.                                 <input type="hidden"  name="end_line">

  434.                                 <input type="hidden"  name="start_line">

  435.                                 <pre id="log_file"></pre>

  436.                             </div>

  437.                                         

  438.                         </div>

  439.                         

  440.                     </div>

  441. 

  442.                     <div class="ui tab" data-tab="five">

  443.                         <div style="position: relative;">

  444.                             <span>

  445.                                 <a title="{{$.i18n.Tr "repo.log_scroll_start"}}" style="position: absolute; right: -32px;cursor: pointer;" class="log_top" data-version="V0001"><i class="icon-to-top"></i></a>

  446.                             </span>

  447.                             <span>

  448.                                 <a title="{{$.i18n.Tr "repo.log_scroll_end"}}" style="position: absolute; bottom: 10px;right: -32px;cursor: pointer;" class="log_bottom" data-version="V0001"><i class="icon-to-bottom"></i></a>

  449.                             </span>

  450.                             <div id="log_npu_message" class="ui message message" style="display: none;">

  451.                                 <div id="log_npu_header"></div>

  452.                             </div>

  453.                             <div class="ui attached  log" onscroll="fn()" id="log_npu" style="height: 300px !important; overflow: auto;">

  454.                                 <input type="hidden"  name="end_line" value>

  455.                                 <input type="hidden"  name="start_line" value>

  456.                                 <pre id="log_file_npu"></pre>

  457.                             </div>

  458.                         </div>

  459.                     </div>

  460. 

  461.                     <div class="ui tab" data-tab="four">

  462.                         <input type="hidden" name="model" value="-1">

  463.                         <input type="hidden" name="modelback" value="-1">

  464.                         <div class='ui breadcrumb model_file_bread' id='file_breadcrumb'>

  465.                             <div class="active section"></div>

  466.                             <div class="divider"> / </div>

  467. 

  468.                         </div>

  469.                         <div id="dir_list">

  470.                             

  471.                         </div>

  472.                     </div>

  473. 

  474.                     

  475.                     

  476.                 </div>

  477.             </div>

  478.         </div>

  479.         {{end}} {{template "base/paginate" .}}

  480.     </div>

  481.     <!-- 确认模态框 -->

  482.    

  483.     

  484.     

  485. </div>

  486. {{template "base/footer" .}}

  487. 

  488. <script>

  489.     $('.menu .item').tab()

  490. 

  491.     $(document).ready(function(){

  492.     $('.ui.accordion').accordion({selector:{trigger:'.icon'}});

  493.     });

  494.     $(document).ready(function(){

  495.         $('.secondary.menu .item').tab();

  496.     });

  497.     

  498.     let userName

  499.     let repoPath

  500.     let jobID = {{$.task.CloudBrainTaskId}}

  501.     let downlaodFlag = {{$.canDownload}}

  502.     let taskID = {{$.task.ID}}

  503.     let realJobName = {{$.task.ID}}

  504.     let lang_scrolled_logs_top = {{$.i18n.Tr "repo.scrolled_logs_top"}};

  505.     let lang_scrolled_logs_top_pls_retry = {{$.i18n.Tr "repo.scrolled_logs_top_pls_retry"}};

  506.     let lang_scrolled_logs_bottom = {{$.i18n.Tr "repo.scrolled_logs_bottom"}};

  507.     let lang_scrolled_logs_bottom_pls_retry = {{$.i18n.Tr "repo.scrolled_logs_bottom_pls_retry"}};

  508. 

  509.     $(document).ready(function(){

  510.         let url = window.location.href;

  511.         let urlArr = url.split('/')

  512.         userName = urlArr.slice(-4)[0]

  513.         repoPath = urlArr.slice(-3)[0]

  514.         console.log("userName=" + userName + " repoPath=" + repoPath);

  515.     })

  516.     function stopBubbling(e) {

  517.         e = window.event || e;

  518.         if (e.stopPropagation) {

  519.             e.stopPropagation();      //阻止事件 冒泡传播

  520.         } else {

  521.             e.cancelBubble = true;   //ie兼容

  522.         }

  523.     }

  524.     let timeid = window.setInterval(loadJobStatus, 30000);

  525.     $(document).ready(loadJobStatus);

  526. 

  527.     function loadLog(version_name){

  528.         $('.log .ui.inverted.active.dimmer').css({

  529.             "background-color": "#fff",

  530.             "display": "block",

  531.         });

  532.         $.get(`/api/v1/repos/${userName}/${repoPath}/modelmanage/${taskID}/log?version_name=${version_name}&lines=50&order=asc`, (data) => {

  533.             $('input[name=end_line]').val(data.EndLine)

  534.             $('input[name=start_line]').val(data.StartLine)

  535.             $(`#log_file`).text(data.Content)

  536.             $('.log .ui.inverted.active.dimmer').css({

  537.                 "display": "none",

  538.             });

  539.         }).fail(function(err) {

  540.             console.log(err);

  541.             $('.log .ui.inverted.active.dimmer').css({

  542.                 "display": "none",

  543.             });

  544.         });

  545.     }

  546.     function loadModelFile(version_name,parents,filename,init){

  547.         parents = parents || ''

  548.         filename = filename || ''

  549.         init = init || ''

  550.         console.log("start")

  551.         $.get(`/api/v1/repos/${userName}/${repoPath}/modelmanage/${taskID}/model_list?version_name=${version_name}&parentDir=${parents}`, (data) => {

  552.             $(`#dir_list`).empty() 

  553.             renderDir(data,version_name)

  554.             if(init==="init"){

  555.                 $(`input[name=model]`).val("")

  556.                 $(`input[name=modelback]`).val(version_name)

  557.                 $(`#file_breadcrumb`).empty()

  558.                 let htmlBread = "/"

  559.                 $(`#file_breadcrumb`).append(htmlBread)

  560.             }else{

  561.                 renderBrend(version_name,parents,filename,init)

  562.             }

  563.         }).fail(function(err) {

  564.             console.log(err,version_name);

  565.         });

  566.         

  567.     }

  568.     function renderBrend(version_name,parents,filename,init){

  569.         if(init=="folder"){

  570.             let htmlBrend = ""

  571.             let sectionName=$(`#file_breadcrumb .active.section`).text()

  572.             let parents1 = $(`input[name=model]`).val()

  573.             let filename1 = $(`input[name=modelback]`).val()

  574.             if(parents1===""){

  575.                 $(`#file_breadcrumb .active.section`).replaceWith(`<a class='section' onclick="loadModelFile('${version_name}','${parents1}','','init')">${sectionName}</a>`)

  576.             }else{

  577.                 $(`#file_breadcrumb .active.section`).replaceWith(`<a class='section' onclick="loadModelFile('${version_name}','${parents1}','${filename1}')">${sectionName}</a>`)

  578.             }

  579.             

  580.             htmlBrend += `<div class='active section'>${filename}</div>`

  581.             htmlBrend += "<div class='divider'> / </div>" 

  582.             $(`#file_breadcrumb`).append(htmlBrend)

  583.             $(`input[name=model]`).val(parents)

  584.             $(`input[name=modelback]`).val(filename)

  585.         }else{

  586.             $(`input[name=model]`).val(parents)

  587.             $(`input[name=modelback]`).val(filename)

  588.             $(`#file_breadcrumb a.section:contains(${filename})`).nextAll().remove()

  589.             $(`#file_breadcrumb a.section:contains(${filename})`).replaceWith(`<div class='active section'>${filename}</div>`)

  590.             //$(`#file_breadcrumb div.section:contains(${filename})`).append("<div class='divider'> / </div>")

  591.         }

  592.         

  593.     }

  594.     function renderDir(data,version_name){

  595.         let html=""

  596.             html += "<div class='ui grid' style='margin:0;'>"

  597.             html += "<div class='row' style='padding: 0;'>"

  598.             html += "<div class='ui sixteen wide column' style='padding:1rem;'>"

  599.             html += "<div class='dir list'>"

  600.             html += "<table id='repo-files-table' class='ui single line table pad20'>"

  601.             html += '<tbody>'

  602.             for(let i=0;i<data.Dirs.length;i++){

  603.                 let dirs_size = renderSize(data.Dirs[i].Size)

  604.                 html += "<tr>"

  605.                 html += "<td class='name six wid'>"

  606.                 html += "<span class='truncate'>"

  607.                 html += "<span class='octicon octicon-file-directory'>"

  608.                 html += "</span>"

  609.                 if(data.Dirs[i].IsDir){

  610.                     html += `<a  onclick="loadModelFile('${version_name}','${data.Dirs[i].ParenDir}','${data.Dirs[i].FileName}','folder')">`

  611.                     html += "<span class='fitted'><i class='folder icon' width='16' height='16' aria-hidden='true'></i>" + data.Dirs[i].FileName + "</span>"

  612.                 }else{

  613.                     if(downlaodFlag){

  614.                         html += `<a href="/${userName}/${repoPath}/modelmanage/download_model_convert/${taskID}?fileName=${data.Dirs[i].FileName}&parentDir=${data.Dirs[i].ParenDir}&jobName=${realJobName}">`

  615.                     }

  616.                     else{

  617.                         html += `<a class="disabled">`

  618.                     }

  619.                     html += "<span class='fitted'><i class='file icon' width='16' height='16' aria-hidden='true'></i>" + data.Dirs[i].FileName + "</span>"

  620.                 }

  621.                 html += '</a>'

  622.                 html += "</span>"

  623.                 html += "</td>"

  624.                 html += "<td class='message seven wide'>"

  625.                 if(data.Dirs[i].IsDir){

  626.                     html += "<span class='truncate has-emoji'></span>"

  627.                 }else{

  628.                     html += "<span class='truncate has-emoji'>"+ `${dirs_size}` + "</span>"

  629.                 }

  630.                 

  631.                 html += "</td>"

  632. 

  633.                 html += "<td class='text right age three wide'>"

  634.                 html += "<span class='truncate has-emoji'>" + data.Dirs[i].ModTime + "</span>"

  635.                 html += "</td>"

  636.                 html += "</tr>"

  637.                 

  638.             }

  639.             html += "</tbody>"

  640.             html += "</table>"

  641.             html += "</div>"

  642.             html += "</div>"

  643.             html += "</div>"

  644.             html += "</div>"

  645.             $(`#dir_list`).append(html)

  646.     }

  647.     function renderSize(value){

  648.         if(null==value||value==''){

  649.             return "0 Bytes";

  650.         }

  651.         var unitArr = new Array("Bytes","KB","MB","GB","TB","PB","EB","ZB","YB");

  652.         var index=0;

  653.         var srcsize = parseFloat(value);

  654.         index=Math.floor(Math.log(srcsize)/Math.log(1024));

  655.         var size =srcsize/Math.pow(1024,index);

  656.         size=size.toFixed(0);//保留的小数位数

  657.         return size+unitArr[index];

  658.     }

  659. 

  660.     function loadJobStatus() {

  661.         $(".ui.accordion.border-according-model").each((index, job) => {

  662.             const jobID = job.dataset.jobid;

  663.             const repoPath = job.dataset.repopath;

  664.             const versionname = job.dataset.version

  665. 

  666.             let status = $(`#status-span`).text()

  667.             

  668.             if(['IMAGE_FAILED','SUBMIT_FAILED','DELETE_FAILED','KILLED','COMPLETED','FAILED','CANCELED','LOST','START_FAILED','SUCCEEDED','STOPPED'].includes(status)){

  669.                 return 

  670.             }

  671.             let stopArray=["KILLED","FAILED","START_FAILED","KILLING","COMPLETED","SUCCEEDED","STOPPED"]

  672.             $.get(`/api/v1/repos/${repoPath}/modelmanage/${taskID}?version_name=${versionname}`, (data) => {

  673.                 

  674.                 $(`#status-span span`).text(data.JobStatus)

  675.                 $(`#status-span i`).attr("class",data.JobStatus)

  676.               

  677.                 $('#status').text(data.JobStatus)

  678.                

  679.             }).fail(function(err) {

  680.                 console.log(err);

  681.             });

  682.         });

  683.     };

  684. 

  685.  

  686.     function parseInfo(){

  687.         let jsonValue = document.getElementById("json_value").value;

  688.         let jsonObj = JSON.parse(jsonValue);

  689.         let podRoleName = jsonObj["podRoleName"];

  690.         let html = "";

  691.         if (podRoleName != null){

  692.             let task0 = podRoleName["task1-0"];

  693.             let podEvents = jsonObj["podEvents"];

  694.             let podEventArray = podEvents[task0];

  695.             if(podEventArray != null){

  696.                 for(var i=0; i < podEventArray.length;i++){

  697.                     if (podEventArray[i]["reason"]!="") {

  698.                         html +="<p><b>[" +podEventArray[i]["reason"] +  "]</b></p>";

  699.                         html +="<p>" +podEventArray[i]["message"] +  "</p>";

  700.                         html +="<p>" +podEventArray[i]["action"] +  "</p>";

  701.                     }

  702.                 }

  703.             }

  704.             let extras= jsonObj["extras"];

  705.             if(extras != null){

  706.                 for(var i=0; i < extras.length;i++){

  707.                     if (extras[i]["reason"]!="") {

  708.                         html +="<p><b>[" +extras[i]["reason"] +  "]</b></p>";

  709.                         html +="<p>" +extras[i]["message"] +  "</p>";

  710.                         html +="<p>" +extras[i]["action"] +  "</p>";

  711.                     }

  712.                 }

  713.             }

  714.         }

  715. 

  716.         let string = document.getElementById("ExitDiagnostics").value;

  717.         string = string.replace(/\r\n/g,"<br>")

  718.         string = string.replace(/\n/g,"<br>");

  719.         string = string.replace(/(\r\n)|(\n)/g,'<br>');

  720. 

  721.         if (string!=""){

  722.             html +="<p><b>[ExitDiagnostics]</b></p>";

  723.             html +="<p>" +string +  "</p>";

  724.         }

  725.     

  726.         document.getElementById("info_display").innerHTML=html;

  727.     }

  728.     

  729.     function debounce(fn,delay){

  730.         let timer;

  731.         return (...args) => {

  732.             // 判断定时器是否存在，清除定时器

  733.             if (timer) {

  734.             clearTimeout(timer);

  735.             }

  736. 

  737.             // 重新调用setTimeout

  738.             timer = setTimeout(() => {

  739.             fn.apply(this, args);

  740.             }, delay);

  741.         };

  742.     }

  743.     const fn = debounce(logScroll, 500)

  744.     function logScroll(version_name) {

  745.         let container = document.querySelector(`#log_npu`)

  746.         let scrollTop = container.scrollTop

  747.         let scrollHeight = container.scrollHeight

  748.         let clientHeight = container.clientHeight

  749.         let scrollLeft = container.scrollLeft

  750.         if(((parseInt(scrollTop)  + clientHeight == scrollHeight || parseInt(scrollTop)  + clientHeight +1 == scrollHeight || parseInt(scrollTop)  + clientHeight - 1 == scrollHeight)) && parseInt(scrollTop)!==0 && scrollLeft==0){

  751.             let end_line = $(`#log_npu input[name=end_line]`).val()

  752.             $.get(`/api/v1/repos/${userName}/${repoPath}/modelmanage/${taskID}/modelartlog?version_name=V0001&base_line=${end_line}&lines=50&order=desc`, (data) => {

  753.                 if (data.Lines == 0){

  754.                     $(`#log_npu_header`).text(lang_scrolled_logs_bottom)

  755.                     $(`#log_npu_message`).css('display', 'block')

  756.                     setTimeout(function(){

  757.                         $(`#log_npu_message`).css('display', 'none')

  758.                     }, 1000)

  759.                 }else{

  760.                     if(end_line===data.EndLine){

  761.                         return

  762.                     }

  763.                     else{

  764.                         $(`#log_npu input[name=end_line]`).val(data.EndLine)

  765.                         $(`#log_npu`).append('<pre>' + data.Content)

  766.                     }

  767. 

  768.                 }

  769.             }).fail(function(err) {

  770.                 console.log(err);

  771.             });

  772.         }

  773.         if([0,1,2,3,4,5,6,7,8,9,10].includes(scrollTop) && scrollLeft==0){

  774.             let start_line = $(`#log_npu input[name=start_line]`).val()

  775.             $.get(`/api/v1/repos/${userName}/${repoPath}/modelmanage/${taskID}/modelartlog?version_name=V0001&base_line=${start_line}&lines=50&order=asc`, (data) => {

  776.                 if (data.Lines == 0){

  777.                     $(`#log_npu_header`).text(lang_scrolled_logs_top)

  778.                     $(`#log_npu_message`).css('display', 'block')

  779.                     setTimeout(function(){

  780.                         $(`#log_npu_message`).css('display', 'none')

  781.                     }, 1000)

  782.                 }else{

  783.                     $(`#log_npu input[name=start_line]`).val(data.StartLine)   //如果变动就改变所对应的值

  784.                     $(`#log_npu`).prepend('<pre>' + data.Content)

  785.                 }

  786.             }).fail(function(err) {

  787.                 console.log(err);

  788.             });

  789.         }

  790.     }

  791.     function scrollAnimation(dom, currentY, targetY, currentX) {

  792.         let needScrollTop = targetY - currentY;

  793.         let _currentY = currentY;

  794.         setTimeout(() => {

  795.             // 一次调用滑动帧数，每次调用会不一样

  796.             //取总距离的十分之一

  797.             const dist = Math.ceil(needScrollTop / 10);

  798.             _currentY += dist;

  799.             //移动一个十分之一

  800.             dom.scrollTo(currentX || 0, _currentY,'smooth');

  801.             // 如果移动幅度小于十个像素，直接移动，否则递归调用，实现动画效果

  802.             if (needScrollTop > 10 || needScrollTop < -10) {

  803.                 scrollAnimation(dom, _currentY, targetY)

  804.             } else {

  805.                 dom.scrollTo(0, targetY,'smooth')

  806.             }

  807.         }, 1)

  808.     }

  809. 

  810.     $('.log_top').click(function(){

  811. 

  812.         let logContentDom = document.querySelector(`#log_npu`)

  813.         

  814.         $(`#log_file_npu`).siblings('pre').remove()

  815.         $.get(`/api/v1/repos/${userName}/${repoPath}/modelmanage/${taskID}/modelartlog?version_name=V0001&base_line=&lines=50&order=asc`, (data) => {

  816.             

  817.             $(`#log_npu input[name=end_line]`).val(data.EndLine)   //如果变动就改变所对应的值

  818.             $(`#log_npu input[name=start_line]`).val(data.StartLine)

  819.             $(`#log_npu`).prepend('<pre>' + data.Content)

  820.             $(`#log_npu_header`).text(lang_scrolled_logs_top)

  821.             $(`#log_npu_message`).css('display', 'block')

  822.             setTimeout(function(){

  823.                 $(`#log_npu_message`).css('display', 'none')

  824.             }, 1000)

  825.             scrollAnimation(logContentDom, logContentDom.scrollTop, 0);

  826.         })

  827. 

  828.     })

  829.     $('.log_bottom').click(function(e){

  830. 

  831.         let logContentDom = document.querySelector(`#log_npu`)

  832.         $(`#log_file_npu`).siblings('pre').remove()

  833.         $.get(`/api/v1/repos/${userName}/${repoPath}/modelmanage/${taskID}/modelartlog?version_name=V0001&base_line=&lines=50&order=desc`, (data) => {

  834.             

  835.             $(`#log_npu input[name=end_line]`).val(data.EndLine)   //如果变动就改变所对应的值

  836.             $(`#log_npu input[name=start_line]`).val(data.StartLine)

  837.             $(`#log_npu`).append('<pre>' + data.Content)

  838.             $.get(`/api/v1/repos/${userName}/${repoPath}/modelmanage/${taskID}/modelartlog?version_name=V0001&base_line=${data.EndLine}&lines=50&order=desc`, (data) => {

  839.                 if (data.Lines == 0){

  840.                     $(`#log_npu_header`).text(lang_scrolled_logs_bottom)

  841.                     $(`#log_npu_message`).css('display', 'block')

  842.                     setTimeout(function(){

  843.                         $(`#log_npu_message`).css('display', 'none')

  844.                     }, 1000)

  845.                 }else{

  846.                     if(end_line===data.EndLine){

  847.                         return

  848.                     }

  849.                     else{

  850.                         $(`#log_npu input[name=end_line]`).val(data.EndLine)

  851.                         $(`#log_npu`).append('<pre>' + data.Content)

  852.                     }

  853. 

  854.                 }

  855.             }).fail(function(err) {

  856.                 console.log(err);

  857.             });

  858.             scrollAnimation(logContentDom, logContentDom.scrollTop+1, logContentDom.scrollHeight - logContentDom.clientHeight);

  859.         })

  860.     })

  861. </script>