chenshihai
2 years ago
2 changed files with 82 additions and 141 deletions
Split View
Diff Options
+ 2
- 2
templates/repo/modelsafety/new.tmpl
View File
| @@ -71,7 +71,7 @@ | |||
| href="{{.Link}}">模型安全评测</a> | |||
| </div> | |||
| </div> | |||
| <div class="required unite min_title inline field"> | |||
| <!-- <div class="required unite 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="item {{if not $Grampus}}active{{end}}" href="{{.RepoLink}}/modelsafety/create_gpu"> | |||
| @@ -83,7 +83,7 @@ | |||
| {{.i18n.Tr "cloudbrain.resource_cluster_c2net"}}(Beta) | |||
| </a> | |||
| </div> | |||
| </div> | |||
| </div> --> | |||
| <div class="inline min_title required field"> | |||
| <label class="label-fix-width" style="font-weight: normal;">{{.i18n.Tr "cloudbrain.compute_resource"}}</label> | |||
| <div class="ui blue mini menu compact selectcloudbrain"> | |||
+ 80
- 139
templates/repo/modelsafety/show.tmpl
View File
| @@ -220,7 +220,7 @@ | |||
| <div class="active section" vfield="DisplayJobName"></div> | |||
| </div> | |||
| </h4> | |||
| <div class="ui accordion border-according" id="accordion" data-repopath="{{$.RepoRelPath}}/cloudbrain" data-jobid="" vdatajobid="ID" data-version=""> | |||
| <div class="ui accordion border-according" id="accordion" data-repopath="{{$.RepoRelPath}}/modelsafety" data-jobid="" vdatajobid="ID" data-version=""> | |||
| <input type="hidden" id="jobId_input" name="jobId_input" value="" vvalue="JobID"> | |||
| <div class="active title padding0"> | |||
| <div class="according-panel-heading"> | |||
| @@ -251,7 +251,7 @@ | |||
| <div class="ui pointing secondary menu" style="border-bottom: 1px solid rgba(34,36,38,.15);"> | |||
| <a class="active item" data-tab="first0">{{$.i18n.Tr "repo.modelarts.train_job.config"}}</a> | |||
| <a class="item log_bottom" data-tab="second0" data-version="">{{$.i18n.Tr "repo.modelarts.log"}}</a> | |||
| <a class="item log_bottom" data-tab="third0" data-version="">评测结果</a> | |||
| <a class="item" data-tab="third0" data-version="">评测结果</a> | |||
| </div> | |||
| <div class="ui tab active" data-tab="first0"> | |||
| <div style="padding-top: 10px;"> | |||
| @@ -446,7 +446,7 @@ | |||
| {{$.i18n.Tr "repo.modelarts.train_job.start_file"}} | |||
| </td> | |||
| <td class="ti-text-form-content"> | |||
| <div class="text-span text-span-w v-field" vfield="BootFile"></div> | |||
| <div class="text-span text-span-w" vfield="BootFile"></div> | |||
| </td> | |||
| </tr> | |||
| <tr class="ti-no-ng-animate"> | |||
| @@ -454,7 +454,7 @@ | |||
| 评测指标 | |||
| </td> | |||
| <td class="ti-text-form-content"> | |||
| <div class="text-span text-span-w v-field">--</div> | |||
| <div class="text-span text-span-w" vfield="LabelName"></div> | |||
| </td> | |||
| </tr> | |||
| </tbody> | |||
| @@ -469,7 +469,7 @@ | |||
| <div> | |||
| <a id="-log-down" | |||
| class='{{if $.canDownload}}ti-download-file{{else}}disabled{{end}}' | |||
| href="/api/v1/repos/{{$.RepoRelPath}}/cloudbrain/{{.ID}}/download_log_file"> | |||
| href="/api/v1/repos/{{$.RepoRelPath}}"> | |||
| <i class="ri-download-cloud-2-line"></i> | |||
| <span style="margin-left: 0.3rem;">{{$.i18n.Tr "repo.modelarts.download_log"}}</span> | |||
| </a> | |||
| @@ -513,9 +513,14 @@ | |||
| .__res_title_icon { | |||
| height: 48px; | |||
| width: 48px; | |||
| background-color: rgb(105, 192, 255); | |||
| margin-right: 8px; | |||
| } | |||
| .bNIWIE.fill:not([stroke]) { | |||
| fill: rgb(105, 192, 255); | |||
| } | |||
| .bNIWIE.fill:not([fill]) { | |||
| fill: rgb(105, 192, 255); | |||
| } | |||
| .__res_title_txt { | |||
| font-family: SourceHanSansSC; | |||
| font-size: 14px; | |||
| @@ -548,11 +553,19 @@ | |||
| border-bottom-left-radius: .28571429rem; | |||
| border-bottom-right-radius: .28571429rem; | |||
| } | |||
| .__res_no_data { | |||
| height: 200px; | |||
| display: flex; | |||
| justify-content: center; | |||
| align-items: center; | |||
| } | |||
| </style> | |||
| <div style="display:none;"> | |||
| {{template "repo/modelsafety/indicators_descr".}} | |||
| </div> | |||
| <div class="__res_container"></div> | |||
| <div class="__res_container"> | |||
| <div class="__res_no_data">无数据</div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| @@ -599,8 +612,7 @@ | |||
| SPEC && $('td.ti-text-form-content.resorce_type div').text(getListValueWithKey(ACC_CARD_TYPE, SPEC.AccCardType)); | |||
| })(); | |||
| </script> | |||
| <script> | |||
| // 配置信息页签 | |||
| <script> | |||
| ;(function() { | |||
| function paddingZeros(str, len) { | |||
| str = str.toString(); | |||
| @@ -609,35 +621,11 @@ | |||
| } | |||
| return str; | |||
| } | |||
| function timeFormat(date) { | |||
| return `${date.getFullYear()}-${paddingZeros(date.getMonth() + 1, 2)}-${paddingZeros(date.getDate(), 2)} ${paddingZeros(date.getHours(), 2)}:${paddingZeros(date.getMinutes(), 2)}:${paddingZeros(date.getSeconds(), 2)}`; | |||
| } | |||
| $.ajax({ | |||
| url: window.location.href.replace('/show', ''), | |||
| type: "get", | |||
| data: {}, | |||
| contentType: "application/json; charset=utf-8", | |||
| success(res) { | |||
| for (var key in res) { | |||
| $(`[vfield="${key}"]`).text(res[key]); | |||
| $(`[vclass="${key}"]`).addClass(res[key]); | |||
| $(`[vtime="${key}"]`).text(res[key] ? timeFormat(new Date(res[key] * 1000)) : '--'); | |||
| $(`[vtitle="${key}"]`).attr('title', res[key]); | |||
| $(`[vdataset0="${key}"]`).text(res[key] ? res[key].toString().split(';')[0] : ''); | |||
| $(`[vdataset1="${key}"]`).text(res[key] ? res[key].toString().split(';')[1] : ''); | |||
| $(`[vdataclipboardtext="${key}"]`).attr('data-clipboard-text', res[key]); | |||
| $(`[vvalue="${key}"]`).val(res[key]); | |||
| $(`[vdatajobid="${key}"]`).attr('data-jobid', res[key]); | |||
| } | |||
| }, | |||
| error(err) { | |||
| console.log(err); | |||
| }, | |||
| }); | |||
| })(); | |||
| // 评测结果页签 | |||
| ;(function() { | |||
| function initTable(tableEl, data) { | |||
| tableEl.empty(); | |||
| tableEl.append(` | |||
| @@ -719,7 +707,9 @@ | |||
| var descr = $(`[indicator="${indicator}"]`).text(); | |||
| var resItemContainer = $(`<div class="__res_item"> | |||
| <div class="__res_title"> | |||
| <div class="__res_title_icon"></div> | |||
| <div class="__res_title_icon"> | |||
| <svg xmlns="http://www.w3.org/2000/svg" class="styles__StyledSVGIconPathComponent-sc-16fsqc8-0 bNIWIE svg-icon-path-icon fill" viewBox="0 0 32 32" width="48" height="48"><defs data-reactroot=""></defs><g><path d="M8.155 26.783c-3.342-2.449-5.488-6.36-5.488-10.771 0-0.004 0-0.008 0-0.012v0.001c0-7.364 5.969-13.333 13.333-13.333s13.333 5.969 13.333 13.333c0 0.003 0 0.007 0 0.011 0 4.412-2.146 8.323-5.451 10.745l-0.037 0.026-1.353-2.319c2.549-1.969 4.175-5.026 4.175-8.464 0-5.891-4.776-10.667-10.667-10.667s-10.667 4.776-10.667 10.667c0 3.437 1.626 6.494 4.15 8.445l0.025 0.018-1.353 2.319zM10.867 22.136c-1.758-1.477-2.867-3.677-2.867-6.136 0-4.418 3.582-8 8-8s8 3.582 8 8c0 2.459-1.109 4.658-2.854 6.126l-0.012 0.010-1.373-2.355c0.972-0.966 1.573-2.304 1.573-3.782 0-2.946-2.388-5.333-5.333-5.333s-5.333 2.388-5.333 5.333c0 1.478 0.601 2.816 1.573 3.782l0 0-1.373 2.355zM14.667 17.333h2.667v12h-2.667v-12z"></path></g></svg> | |||
| </div> | |||
| <div class="__res_title_txt"> | |||
| <div class="__res_title_txt1">${indicator}-${item.name}</div> | |||
| <div class="__res_title_txt2">${descr}</div> | |||
| @@ -734,78 +724,7 @@ | |||
| } | |||
| }; | |||
| function initData() { | |||
| var data = { | |||
| "eType": "static", | |||
| "name": "fgsm_cifar10_1000", | |||
| "params": [ | |||
| [ | |||
| "0.1" | |||
| ], | |||
| [ | |||
| "0.15" | |||
| ], | |||
| [ | |||
| "0.2" | |||
| ], | |||
| [ | |||
| "0.25" | |||
| ], | |||
| [ | |||
| "0.3" | |||
| ], | |||
| [ | |||
| "0.35" | |||
| ], | |||
| [ | |||
| "0.4" | |||
| ] | |||
| ], | |||
| "untargetted": { | |||
| "ACC": [ | |||
| 0.169, | |||
| 0.128, | |||
| 0.122, | |||
| 0.115, | |||
| 0.113, | |||
| 0.104, | |||
| 0.1 | |||
| ], | |||
| "ASS": [ | |||
| 0.6525109174194562, | |||
| 0.5128998893711293, | |||
| 0.4012456987633366, | |||
| 0.31603768362214135, | |||
| 0.2522637372349447, | |||
| 0.20173695879100786, | |||
| 0.15927145111766017 | |||
| ] | |||
| }, | |||
| "targetted": { | |||
| "ACC": { | |||
| "targets": [ | |||
| 0.127, | |||
| 0.129, | |||
| 0.125, | |||
| 0.131, | |||
| 0.127, | |||
| 0.125, | |||
| 0.115 | |||
| ] | |||
| }, | |||
| "ASS": { | |||
| "targets": [ | |||
| 0.6529545699941741, | |||
| 0.5101767310061309, | |||
| 0.3905316332202089, | |||
| 0.30660659401929724, | |||
| 0.24579538237865656, | |||
| 0.19831695120705345, | |||
| 0.15426212417026997 | |||
| ] | |||
| } | |||
| } | |||
| }; | |||
| function initResTab(data) { | |||
| var name = data.name; | |||
| var params = data.params; | |||
| var indicators = Object.keys(data.targetted); | |||
| @@ -824,42 +743,64 @@ | |||
| initResItems(list); | |||
| } | |||
| $('.pointing.secondary.menu .item').tab({ | |||
| onVisible: function(tabPath) { | |||
| if (tabPath === 'third0') { | |||
| initData(); | |||
| var resultData; | |||
| function initData() { | |||
| $.ajax({ | |||
| url: window.location.href.replace('/show', ''), | |||
| type: "get", | |||
| data: {}, | |||
| contentType: "application/json; charset=utf-8", | |||
| success(res) { | |||
| for (var key in res) { | |||
| $(`[vfield="${key}"]`).text(res[key]); | |||
| $(`[vclass="${key}"]`).addClass(res[key]); | |||
| $(`[vtime="${key}"]`).text(res[key] ? timeFormat(new Date(res[key] * 1000)) : '--'); | |||
| $(`[vtitle="${key}"]`).attr('title', res[key]); | |||
| $(`[vdataset0="${key}"]`).text(res[key] ? res[key].toString().split(';')[0] : ''); | |||
| $(`[vdataset1="${key}"]`).text(res[key] ? res[key].toString().split(';')[1] : ''); | |||
| $(`[vdataclipboardtext="${key}"]`).attr('data-clipboard-text', res[key]); | |||
| $(`[vvalue="${key}"]`).val(res[key]); | |||
| $(`[vdatajobid="${key}"]`).attr('data-jobid', res[key]); | |||
| } | |||
| if (res.Spec) { | |||
| var SPEC = res.Spec; | |||
| var showPoint = false; | |||
| var specStr = window.renderSpecStr(SPEC, showPoint, { | |||
| gpu_memory: {{$.i18n.Tr "cloudbrain.gpu_memory"}}, | |||
| free: {{$.i18n.Tr "cloudbrain.free"}}, | |||
| point_hr: {{$.i18n.Tr "cloudbrain.point_hr"}}, | |||
| memory: {{$.i18n.Tr "cloudbrain.memory"}}, | |||
| shared_memory: {{$.i18n.Tr "cloudbrain.shared_memory"}}, | |||
| }); | |||
| $('td.ti-text-form-content.spec div').text(specStr); | |||
| SPEC && $('td.ti-text-form-content.resorce_type div').text(getListValueWithKey(ACC_CARD_TYPE, SPEC.AccCardType)); | |||
| } | |||
| if (res.ResultJson) { | |||
| resultData = JSON.parse(res.ResultJson); | |||
| } | |||
| }, | |||
| error(err) { | |||
| console.log(err); | |||
| }, | |||
| }); | |||
| })(); | |||
| </script> | |||
| <script> | |||
| } | |||
| initData(); | |||
| $(document).ready(function () { | |||
| $('.ui.accordion').accordion({ selector: { trigger: '.icon' } }); | |||
| }); | |||
| let userName | |||
| let repoPath | |||
| let jobName | |||
| $(document).ready(function () { | |||
| let url = window.location.href; | |||
| let urlArr = url.split('/') | |||
| userName = urlArr.slice(-5)[0] | |||
| repoPath = urlArr.slice(-4)[0] | |||
| jobName = urlArr.slice(-1)[0] | |||
| }) | |||
| function loadLog(version_name) { | |||
| console.log('loadLog'); | |||
| document.getElementById("mask").style.display = "block" | |||
| $.get(`/api/v1/repos/${userName}/${repoPath}/cloudbrain/${jobName}/log?version_name=${version_name}&lines=50&order=asc`, (data) => { | |||
| $('input[name=end_line]').val(data.EndLine) | |||
| $('input[name=start_line]').val(data.StartLine) | |||
| $(`#log_file${version_name}`).text(data.Content) | |||
| document.getElementById("mask").style.display = "none" | |||
| }).fail(function (err) { | |||
| console.log(err); | |||
| document.getElementById("mask").style.display = "none" | |||
| }); | |||
| } | |||
| </script> | |||
| $('.pointing.secondary.menu .item').tab({ | |||
| onVisible: function(tabPath) { | |||
| if (tabPath === 'first0') { | |||
| initData(); | |||
| } | |||
| if (tabPath === 'third0') { | |||
| resultData && initResTab(resultData); | |||
| } | |||
| }, | |||
| }); | |||
| })(); | |||
| </script> | |||