fix issue

options/locale/locale_en-US.ini

@@ -883,7 +883,19 @@ modelarts.train_job_para_admin=train_job_para_admin
 modelarts.train_job_para.edit=train_job_para.edit
 modelarts.train_job_para.connfirm=train_job_para.connfirm
 
+model.manage.import_new_model=Import New Model
 model.manage.create_error=Equal Name and Version has existed.
+model.manage.model_name = Model Name
+model.manage.version = Version
+model.manage.label = Label
+model.manage.size = Size
+model.manage.create_time = Create Time
+model.manage.Description = Description
+model.manage.Accuracy = Accuracy
+model.manage.F1 = F1
+model.manage.Precision = Precision
+model.manage.Recall = Recall
+
 
 template.items = Template Items
 template.git_content = Git Content (Default Branch)

options/locale/locale_zh-CN.ini

@@ -895,7 +895,18 @@ modelarts.train_job_para_admin=任务参数管理
 modelarts.train_job_para.edit=编辑
 modelarts.train_job_para.connfirm=确定
 
+model.manage.import_new_model=导入新模型
 model.manage.create_error=相同的名称和版本的模型已经存在。
+model.manage.model_name = 模型名称
+model.manage.version = 版本
+model.manage.label = 标签
+model.manage.size = 大小
+model.manage.create_time = 创建时间
+model.manage.description = 描述
+model.manage.Accuracy = 准确率
+model.manage.F1 = F1值
+model.manage.Precision = 精确率
+model.manage.Recall = 召回率
 
 template.items=模板选项
 template.git_content=Git数据(默认分支)

templates/repo/modelmanage/index.tmpl

@@ -28,112 +28,24 @@
 <div class="repository release dataset-list view">
     {{template "repo/header" .}}
     <!-- 列表容器 -->
-    <div class="ui container loading">
+    <div class="ui container">
         {{template "base/alert" .}}
         <div class="ui two column stackable grid ">
             <div class="column"></div>
             <div class="column right aligned">
-                {{if .Permission.CanWrite $.UnitTypeCloudBrain}}       
-                <a class="ui green button" onclick="showcreate(this)">{{$.i18n.Tr "repo.modelarts.train_job.new_train"}}</a>{{end}}
+                <!--  -->
+                <a class="ui button {{if .Permission.CanWrite $.UnitTypeCloudBrain}} green {{else}} disabled {{end}}" onclick="showcreate(this)">{{$.i18n.Tr "repo.model.manage.import_new_model"}}</a>
             </div>
         </div>
 
         <!-- 中下列表展示区 -->
         <div class="ui grid">
-            <div class="row">
+            <div class="row" style="padding-top: 0;">
                 <div class="ui sixteen wide column">
                     <!-- 任务展示 -->
                     <div class="dataset list" id="model_list">
                         <!-- 表头 -->
-                        <!-- <div class="ui grid stackable" style="background: #f0f0f0;;">
-                            <div class="row">
-                                <div class="three wide column padding0">
-                                    <span style="margin:0 6px">{{$.i18n.Tr "repo.modelarts.model_name"}}</span>
-                                </div>
-                                <div class="one wide column text center padding0">
-                                    <span style="margin:0 6px">{{$.i18n.Tr "repo.modelarts.version"}}</span>
-                                </div>
-                                <div class="one wide column text center padding0" style="width: 7.25%!important;">
-                                    <span style="margin:0 6px">{{$.i18n.Tr "repo.modelarts.version_nums"}}</span>
-                                </div>
-                                <div class="two wide column text center padding0" style="width: 11.5%!important;">
-                                        <span>{{$.i18n.Tr "repo.modelarts.model_size"}}</span>
-                                </div>
-                                <div class="two wide column text center padding0" style="width: 8.5%!important;">
-                                        <span>{{$.i18n.Tr "repo.modelarts.train_job.AI_driver"}}</span>
-                                </div>
-                                <div class="two wide column text center padding0" style="width: 11.5%!important;">
-                                        <span>{{$.i18n.Tr "repo.modelarts.computing_resources"}}</span> 
-                                </div>
-                                <div class="two wide column text center padding0">
-                                        <span>{{$.i18n.Tr "repo.modelarts.createtime"}}</span>
-                                </div>
-                                <div class="one wide column text center padding0">
-                                    <span>{{$.i18n.Tr "repo.cloudbrain_creator"}}</span> 
-                                </div>
-                                <div class="two wide column text center padding0" style="width: 17.5%!important;">
-                                    <span>{{$.i18n.Tr "repo.cloudbrain_operate"}}</span>
-                                </div>
-
-                            </div>
-                        
-                        </div>                      -->
-                    
-                        <!-- <div class="ui grid stackable item">
-                            <div class="row">
-                            
-                                
-                                <div class="three wide column padding0">
-                                    <a class="title" href="{{$.Link}}/{{.JobID}}" title="{{.JobName}}" style="font-size: 12px;">
-                                        <span class="fitted" style="vertical-align: middle;">{{svg "octicon-tasklist" 16}}</span>
-                                        <span class="fitted" style="width: 90%;vertical-align: middle;margin-left: 0.4rem;">Model-abcd</span>
-                                    </a>
-                                </div>
-                                
-                                <div class="one wide column text center padding0">   
-                                        <span>0.0.3</span>                                  
-                                </div>
-                                
-                                <div class="one wide column text center padding0" style="width: 7.25%!important;">   
-                                    <span>20</span>                                  
-                                </div>
-                                 
-                                 <div class="two wide column padding0 text center"  style="width: 11.5%!important;">
-                                    <span>20.28MB</span>   
-                                </div>
-                                
-                                <div class="two wide column padding0 text center" style="width: 8.5%!important;">
-                                    <span>Mindspore</span>
-                                </div>
-                                
-                                <div class="two wide column text center padding0" style="width: 11.5%!important;">
-                                    <span style="font-size: 12px;">CPU</span> 
-                                </div>
-                                
-                                <div class="two wide column text center padding0">
-                                    <span style="font-size: 12px;">2021/09/20 12:06:13</span> 
-                                </div>
-                                
-                                <div class="one wide column text center padding0">
-                                    {{if .User.Name}}
-                                        <a href="{{AppSubUrl}}/{{.User.Name}}" title="{{.User.Name}}"><img class="ui avatar image" src="{{.User.RelAvatarLink}}"></a>
-                                    {{else}}
-                                        <a title="Ghost"><img class="ui avatar image" src="{{AppSubUrl}}/user/avatar/Ghost/-1"></a>
-                                    {{end}}
-                                </div>
-
-                                <div class="two wide column text center padding0" style="width: 17.5%!important;">
-                                    <div style="display: flex;justify-content: space-between;">
-                                        <a>创建新版本</a>
-                                        <a>下载</a>
-                                        <a onclick="assertDelete(this)">删除</a>
-                                    </div>
-                                </div>
-                            </div>
-                        </div> -->
-                        
                     </div>
-
                 </div>
             </div>
         </div>
@@ -227,7 +139,7 @@
                 </div>
                 <div class="inline field">
                     <label for="description">模型描述</label>
-                    <textarea style="width: 83%;margin-left: 7px;" 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, 256)"></textarea>
+                    <textarea style="width: 83%;margin-left: 7px;" 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, 256)"></textarea>
                 </div>
 
                 <div class="inline field" style="margin-left: 75px;">

templates/repo/modelmanage/showinfo.tmpl

@@ -16,7 +16,7 @@
         padding-bottom: 20px;
         padding-right: 20px;
         color: #8a8e99;
-        font-size: 12px;
+        font-size: 14px;
         white-space: nowrap !important;
         width: 80px;
         line-height: 30px;
@@ -25,54 +25,154 @@
         line-height: 30px;
         padding-bottom: 20px;
     }
+    .change-version{
+        min-width: auto !important;
+        border: 1px solid rgba(187, 187, 187, 100) !important;
+        border-radius: .38571429rem !important;
+        margin-left: 1.5em;
+    }
+    .word-elipsis{
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+    }
+    .half-table{
+        width: 50%;
+        float: left;
+    }
+    .text-width80 {
+    width: 100px;
+    line-height: 30px;
+    }
+    .tableStyle{
+        width:100%;
+        table-layout: fixed;
+    }
     </style>
     <div class="ui container">
         <h4 class="ui header" id="vertical-segment">
                 <!-- <a href="javascript:window.history.back();"><i class="arrow left icon"></i>返回</a> -->
             <div class="ui breadcrumb">
                 <a class="section" href="{{$.RepoLink}}/modelmanage/show_model">
-                    模型管理
+                    模型管理 
                 </a>
                 <div class="divider"> / </div>
                 <div class="active section">{{.name}}</div>
             </div>
+            <select class="ui dropdown tiny change-version" id="dropdown" onchange="changeInfo(this.value)">
+            </select>
         </h4>
-        <div style="border:1px solid #e2e2e2;padding: 20px 60px;margin-top:24px">
-            <div style="width: 50%;float: left;">
-                <span class="model_header_text">基本信息</span>
-                <table style="margin-top:20px;">
-                    <tbody>
-                        <tr style="font-size: 12px;">
-                            <td class="ti-text-form-label">
-                                模型名称:
-                            </td>
-                            <td class="ti-text-form-content">
-                                Model_asasdas
-                            </td>
-                        </tr>
-                    </tbody>
-                </table>
-            </div>
-            <div style="width: 50%;float: left;">
-                <span class="model_header_text">模型精度</span>
-            </div>
-            <div style="clear: both;"></div>
+        <div id="showInfo" style="border:1px solid #e2e2e2;padding: 20px 60px;margin-top:24px">
         </div>
-        
     </div>
 </div>
-
+{{template "base/footer" .}}
 <script>
 let url = location.href.split('show_model')[0]
-let ID = location.search.slice(6,8)
+let ID = location.search.split('?name=').pop()
 console.log("-----------",ID)
 
 $(document).ready(loadInfo);
-function loadInfo(version){
-    $.get(`${url}show_model_info_api?ID=${ID}`,(data)=>{
-        console.log("data",data)
+function changeInfo(version){
+    $.get(`${url}show_model_info_api?name=${ID}`,(data)=>{
+        let versionData = data.filter((item)=>{
+            return item.Version === version
+        })
+        let initObj = transObj(versionData)[0]
+        let initModelAcc = transObj(versionData)[1]
+        console.log("=======",initObj,initModelAcc)
+        $('#showInfo').empty()
+        renderInfo(initObj,initModelAcc)
+    })
+}
+function loadInfo(){
+    $.get(`${url}show_model_info_api?name=${ID}`,(data)=>{
+        let html = ''
+        for (let i=0;i<data.length;i++){
+            html += `<option value="${data[i].Version}">${data[i].Version}</option>`
+        }
+        $('#dropdown').append(html)
+        let initObj = transObj(data)[0]
+        let initModelAcc = transObj(data)[1]
+        renderInfo(initObj,initModelAcc)
     })
 }
+function transObj(data){
+    let {Name,Version,Label,Size,Description,CreatedUnix,Accuracy} = data[0]
+    let modelAcc = JSON.parse(Accuracy)
+    let size = tranSize(Size) 
+    let time = transTime(CreatedUnix)
+    let initObj = {
+        ModelName:Name || '--',
+        Version:Version,
+        Label:Label || '--',
+        Size:size,
+        CreateTime:time,
+        Description:Description || '--',
+    }
+    let initModelAcc = {
+        Accuracy: modelAcc.Accuracy || '--',
+        F1: modelAcc.F1 || '--',
+        Precision:modelAcc.Precision || '--',
+        Recall: modelAcc.Recall || '--'
+    }
+    return [initObj,initModelAcc]
+        
+}
+function transTime(time){
+    let date = new Date(time * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
+    let Y = date.getFullYear() + '-';
+    let M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1):date.getMonth()+1) + '-';
+    let D = (date.getDate()< 10 ? '0'+date.getDate():date.getDate())+ ' ';
+    let h = (date.getHours() < 10 ? '0'+date.getHours():date.getHours())+ ':';
+    let m = (date.getMinutes() < 10 ? '0'+date.getMinutes():date.getMinutes()) + ':';
+    let s = date.getSeconds() < 10 ? '0'+date.getSeconds():date.getSeconds();
+    return Y+M+D+h+m+s;
+}
+function tranSize(value){
+    if(null==value||value==''){
+        return "0 Bytes";
+    }
+    var unitArr = new Array("Bytes","KB","MB","GB","TB","PB","EB","ZB","YB");
+    var index=0;
+    var srcsize = parseFloat(value);
+    index=Math.floor(Math.log(srcsize)/Math.log(1024));
+    var size =srcsize/Math.pow(1024,index);
+    size=size.toFixed(2);//保留的小数位数
+    return size+unitArr[index];
+}
+function renderInfo(obj,accObj){
+    let html = ''
+    html += '<div class="half-table">'
+    html += '<span class="model_header_text">基本信息</span>'
+    html += '<table class="tableStyle" style="margin-top:20px;">'
+    html += '<tbody>'
+    for(let key in obj){
+        html += '<tr style="font-size: 12px;">'
+        html += `<td class="ti-text-form-label text-width80">${key}</td>`
+        html += `<td class="ti-text-form-content word-elipsis">${obj[key]}</td>`
+        html += '</tr>'
+    }
 
+    html += '</tbody>'
+    html += '</table>'
+    html += '</div>'
+    html += '<div class="half-table">'
+    html += '<span class="model_header_text">模型精度</span>'
+    html += '<table class="tableStyle" style="margin-top:20px;">'
+    html += '<tbody>'
+    for(let key in accObj){
+        html += '<tr style="font-size: 12px;">'
+        html += `<td class="ti-text-form-label text-width80">${key}</td>`
+        html += `<td class="ti-text-form-content">${accObj[key]}</td>`
+        html += '</tr>'
+    }
+
+    html += '</tbody>'
+    html += '</table>'
+    html += '</div>'
+    html += '<div style="clear: both;"></div>'
+    $('#showInfo').append(html)
+}
 
 </script>

web_src/js/components/Model.vue

@@ -118,6 +118,7 @@
                             @size-change="handleSizeChange"
                             @current-change="handleCurrentChange"
                             :current-page="currentPage"
+                            :page-sizes="[10]"
                             :page-size="pageSize"
                             layout="total, sizes, prev, pager, next, jumper"
                             :total="totalNum">
@@ -164,7 +165,7 @@ export default {
             tableData= res.data
             console.log("-----tableData---",tableData)
             for(let i=0;i<tableData.length;i++){
-                TrainTaskInfo = JSON.parse(res.data[i].TrainTaskInfo)
+                TrainTaskInfo = JSON.parse(tableData[i].TrainTaskInfo)
                 tableData[i].EngineName = TrainTaskInfo.EngineName.split('-')[0]
                 tableData[i].ComputeResource = TrainTaskInfo.ComputeResource
                 tableData[i].Name=''
@@ -184,11 +185,11 @@ export default {
     },
     handleSizeChange(val){
         this.params.size = val
-        this.getImageList()
+        this.getModelList()
     },
     handleCurrentChange(val){
         this.params.page = val
-        this.getImageList()
+        this.getModelList()
     },
     showcreateVue(name,version){
         $('.ui.modal.second')
@@ -222,20 +223,22 @@ export default {
             })
     },
     getModelList(){
-        this.fullscreenLoading = true
+        this.fullscreenLoading = false
         
         this.$axios.get(location.href+'_api',{
             params:this.params
         }).then((res)=>{
+            console.log("res",res)
             let TrainTaskInfo
             this.tableData = res.data.data
-            for(let i=0;i<res.data.count;i++){
-                TrainTaskInfo = JSON.parse(res.data.data[i].TrainTaskInfo)
+            console.log("this.tableData",this.tableData)
+            for(let i=0;i<this.tableData.length;i++){
+                TrainTaskInfo = JSON.parse(this.tableData[i].TrainTaskInfo)
                 this.tableData[i].EngineName = TrainTaskInfo.EngineName.split('-')[0]
                 this.tableData[i].ComputeResource = TrainTaskInfo.ComputeResource
                 this.tableData[i].hasChildren = res.data.data[i].VersionCount===1 ? false : true
             }
-            this.totalNum = this.tableData.length
+            this.totalNum = res.data.count
             console.log("this.tableData.",this.tableData)
             this.fullscreenLoading = false
         })
@@ -359,6 +362,7 @@ export default {
     margin-right: 3px;
     font-size: 12px;
 }
+/deep/ .el-table_1_column_1.is-left  .cell {padding-right: 0px !important;}
 /deep/ .el-table__expand-icon .el-icon-arrow-right{
     font-family: element-icons!important;
     speak: none;