Browse Source

update

tags/v1.22.11.2^2
chenshihai 2 years ago
parent
commit
9a07c96e53
13 changed files with 331 additions and 149 deletions
  1. +3
    -1
      options/locale/locale_en-US.ini
  2. +3
    -1
      options/locale/locale_zh-CN.ini
  3. +10
    -14
      templates/repo/modelmanage/create_online.tmpl
  4. +5
    -2
      templates/repo/modelmanage/index.tmpl
  5. +2
    -2
      web_src/js/components/Model.vue
  6. +1
    -1
      web_src/js/components/basic/editDialog.vue
  7. +6
    -0
      web_src/js/features/i18nVue.js
  8. +9
    -3
      web_src/js/index.js
  9. +60
    -0
      web_src/vuepages/langs/config/en-US.js
  10. +60
    -0
      web_src/vuepages/langs/config/zh-CN.js
  11. +53
    -37
      web_src/vuepages/pages/modelmanage/common/modelmanage-common-detail.vue
  12. +36
    -19
      web_src/vuepages/pages/modelmanage/local/modelmanage-local-create-1.vue
  13. +83
    -69
      web_src/vuepages/pages/modelmanage/local/modelmanage-local-create-2.vue

+ 3
- 1
options/locale/locale_en-US.ini View File

@@ -1266,11 +1266,13 @@ model.manage.model_accuracy = Model Accuracy
model.convert=Model Transformation
model.list=Model List
model.manage.create_new_convert_task=Create Model Transformation Task

model.manage.import_local_model=Import Local Model
model.manage.import_online_model=Import Online Model
model.manage.notcreatemodel=No model has been created
model.manage.init1=Code version: You have not initialized the code repository, please
model.manage.init2=initialized first ;
model.manage.createtrainjob_tip=Training task: you haven't created a training task, please create it first
model.manage.createmodel_tip=You can import local model or online model. Import online model should create
model.manage.createtrainjob=Training task.
model.manage.delete=Delete Model
model.manage.delete_confirm=Are you sure to delete this model? Once this model is deleted, it cannot be restored.


+ 3
- 1
options/locale/locale_zh-CN.ini View File

@@ -1281,11 +1281,13 @@ model.manage.model_accuracy = 模型精度
model.convert=模型转换任务
model.list=模型列表
model.manage.create_new_convert_task=创建模型转换任务

model.manage.import_local_model=导入本地模型
model.manage.import_online_model=导入线上模型
model.manage.notcreatemodel=未创建过模型
model.manage.init1=代码版本:您还没有初始化代码仓库,请先
model.manage.init2=创建代码版本;
model.manage.createtrainjob_tip=训练任务:您还没创建过训练任务,请先创建
model.manage.createmodel_tip=您可以导入本地模型或者导入线上模型。导入线上模型需先
model.manage.createtrainjob=训练任务。
model.manage.delete=删除模型
model.manage.delete_confirm=你确认删除该模型么?此模型一旦删除不可恢复。


+ 10
- 14
templates/repo/modelmanage/create_online.tmpl View File

@@ -56,7 +56,7 @@
<div id="newmodel">
<div class="ui second">
<div class="header" style="padding: 1rem;background-color: rgba(240, 240, 240, 100);">
<h4 id="model_header"></h4>
<h4 id="model_header">{{.i18n.Tr "repo.model.manage.import_online_model"}}</h4>
</div>
<div class="content content-padding">
<form id="formId" class="ui form dirty">
@@ -95,7 +95,7 @@
<input class="ays-ignore" id="name" name="name" required maxlength="25" onkeyup="this.value=this.value.replace(/[, ]/g,'')">
</div>
</div>
<div class="required inline fields" id="verionName">
<div class="required inline fields" id="verionName" style="display:none;">
<div class="two wide field right aligned">
<label for="version">{{.i18n.Tr "repo.model.manage.version"}}</label>
</div>
@@ -146,16 +146,14 @@
onkeydown="this.value=this.value.substring(0, 255)"
onkeyup="this.value=this.value.substring(0, 256)"></textarea>
</div>
</div>
<div class="inline field" style="margin-left:140px;">
<button id="submitId" type="button" class="ui create_train_job green button" onclick="submitSaveModel()"
style="position: absolute;margin-top:16px;">
{{.i18n.Tr "repo.model.manage.sava_model"}}
</button>
</div>
</div>
</form>
<div class="actions" style="display: inline-block;margin-left:252px;margin-top:16px;">
<button class="ui button cancel" onclick="backToModelListPage()">{{.i18n.Tr "repo.cloudbrain.cancel"}}</button>
<div class="inline field" style="margin-left:140px;margin-top:28px;">
<button id="submitId" type="button" class="ui create_train_job green button" onclick="submitSaveModel()"
style="">
{{.i18n.Tr "repo.model.manage.sava_model"}}
</button>
<button style="margin-left:0px;" class="ui button cancel" onclick="backToModelListPage()">{{.i18n.Tr "repo.cloudbrain.cancel"}}</button>
</div>
</div>
</div>
@@ -253,8 +251,7 @@
$('.ui.modal.second')
.modal({
centered: false,
onShow: function () {
$('#model_header').text({{.i18n.Tr "repo.model.manage.import_new_model"}})
onShow: function () {
$('input[name="version"]').addClass('model_disabled')
$('.ui.dimmer').css({ "background-color": "rgb(136, 136, 136,0.7)" })
$("#job-name").empty()
@@ -277,7 +274,6 @@
.modal('show')
}
*/
$('#model_header').text({{.i18n.Tr "repo.model.manage.import_new_model"}})
$('input[name="version"]').addClass('model_disabled')
$('.ui.dimmer').css({ "background-color": "rgb(136, 136, 136,0.7)" })
$("#job-name").empty()


+ 5
- 2
templates/repo/modelmanage/index.tmpl View File

@@ -75,9 +75,9 @@
<div class="column right aligned">
<!-- -->
<a class="ui button {{if .Permission.CanWrite $.UnitTypeModelManage}} blue m-blue-btn {{else}} disabled {{end}}"
href="{{.RepoLink}}/modelmanage/create_local_model_tmpl1">导入本地模型</a>
href="{{.RepoLink}}/modelmanage/create_local_model_tmpl1">{{$.i18n.Tr "repo.model.manage.import_local_model"}}</a>
<a class="ui button {{if .Permission.CanWrite $.UnitTypeModelManage}} green {{else}} disabled {{end}}"
href="{{.RepoLink}}/modelmanage/create_online_model_tmpl">导入线上模型</a>
href="{{.RepoLink}}/modelmanage/create_online_model_tmpl">{{$.i18n.Tr "repo.model.manage.import_online_model"}}</a>
</div>
</div>
{{if eq $.MODEL_COUNT 0}}
@@ -85,6 +85,7 @@
<div class="ui icon header bgtask-header-pic"></div>
<div class="bgtask-content-header">{{$.i18n.Tr "repo.model.manage.notcreatemodel"}}</div>
<div class="bgtask-content">
<!--
{{if $.RepoIsEmpty}}
<div class="bgtask-content-txt">{{$.i18n.Tr "repo.model.manage.init1"}}<a href="{{.RepoLink}}">{{$.i18n.Tr "repo.model.manage.init2"}}</a></div>
{{end}}
@@ -92,6 +93,8 @@
<div class="bgtask-content-txt">{{$.i18n.Tr "repo.model.manage.createtrainjob_tip"}}<a
href="{{.RepoLink}}/modelarts/train-job">&nbsp;{{$.i18n.Tr "repo.model.manage.createtrainjob"}}</a></div>
{{end}}
-->
<div class="bgtask-content-txt">{{$.i18n.Tr "repo.model.manage.createmodel_tip"}}<a href="{{.RepoLink}}/modelarts/train-job">&nbsp;{{$.i18n.Tr "repo.model.manage.createtrainjob"}}</a></div>
<div class="bgtask-content-txt">{{$.i18n.Tr "repo.platform_instructions1"}}<a href="https://git.openi.org.cn/zeizei/OpenI_Learning">&nbsp;{{$.i18n.Tr "repo.platform_instructions2"}}&nbsp;</a>{{$.i18n.Tr "repo.platform_instructions3"}}</div>

</div>


+ 2
- 2
web_src/js/components/Model.vue View File

@@ -23,7 +23,7 @@
<i class="el-icon-arrow-right"></i>
</div>
<!-- <i class="el-icon-time"></i> -->
<span :class="scope.row.modelType == '1' ? 'm-local' : 'm-online'">{{ scope.row.modelType == '1' ? '本地' : '线上' }}</span>
<span v-if="!scope.row.Children" :class="scope.row.modelType == '1' ? 'm-local' : 'm-online'">{{ scope.row.modelType == '1' ? i18n.local : i18n.online }}</span>
<a
class="text-over"
:href="showinfoHref + scope.row.name"
@@ -155,7 +155,7 @@
v-if="scope.row.modelType == 1"
:href="url + 'create_local_model_tmpl1?type=1&name=' + scope.row.name + '&id=' + scope.row.id"
:class="{ disabled: !scope.row.isCanOper }"
>{{ '修改' }}</a
>{{ i18n.modify }}</a
>
<a
:href="loadhref + scope.row.id"


+ 1
- 1
web_src/js/components/basic/editDialog.vue View File

@@ -1,6 +1,6 @@
<template>

<el-dialog :close-on-click-modal="!deleteLoading" v-dlg-drag :title="dialogTitle" :visible.sync="deleteDialog">
<el-dialog :close-on-click-modal="!deleteLoading" :title="dialogTitle" :visible.sync="deleteDialog">
<div class="message-box__content">


+ 6
- 0
web_src/js/features/i18nVue.js View File

@@ -105,6 +105,9 @@ export const i18nVue = {
file_sync_fail:"文件同步失败",
no_file_to_download:"没有文件可以下载",
task_not_finished:"任务还未结束,稍后再来看看",
local:"本地",
online:"线上",
modify:"修改",
},
US: {
computer_vision: "computer vision",
@@ -216,5 +219,8 @@ export const i18nVue = {
file_sync_fail:"File synchronization failed",
no_file_to_download:"No files can be downloaded",
task_not_finished:"Task not finished yet, please wait",
local:"Local",
online:"Online",
modify:"Modify",
},
};

+ 9
- 3
web_src/js/index.js View File

@@ -6,8 +6,10 @@ import "./publicpath.js";
import "./polyfills.js";
import "./features/letteravatar.js";
import Vue from "vue";
import ElementUI from "element-ui";
import "element-ui/lib/theme-chalk/index.css";
import localeEn from 'element-ui/lib/locale/lang/en';
import localeZh from 'element-ui/lib/locale/lang/zh-CN';
import ElementUI from "element-ui";
import axios from "axios";
import qs from "qs";
import Cookies from "js-cookie";
@@ -54,15 +56,19 @@ import { Message } from "element-ui";
import { i18nVue } from "./features/i18nVue.js";
import './features/ad.js';

Vue.use(ElementUI);
Vue.prototype.$axios = axios;
Vue.prototype.$Cookies = Cookies;
Vue.prototype.qs = qs;
Vue.prototype.$message = Message;
Vue.prototype.$locale = i18nVue;
window.i18n = i18nVue[document.querySelector('html').getAttribute('lang') == 'zh-CN' ? 'CN' : 'US'];
const lang = document.querySelector('html').getAttribute('lang');
window.i18n = i18nVue[lang == 'zh-CN' ? 'CN' : 'US'];
const { AppSubUrl, StaticUrlPrefix, csrf } = window.config;

Vue.use(ElementUI, {
locale: lang === 'zh-CN' ? localeZh : localeEn,
});

Object.defineProperty(Vue.prototype, "$echarts", {
value: echarts,
});


+ 60
- 0
web_src/vuepages/langs/config/en-US.js View File

@@ -193,6 +193,66 @@ const en = {
dataDesensitizationModelDesc:'Use AI technology to desensitize the face and license plate number in the picture. For more information about this model, please visit the project',
limitFilesUpload:'Only jpg/jpeg/png files can be uploaded',
limitSizeUpload:'The size of the uploaded file cannot exceed 20M!',
modelManage: {
modelManage: 'Model management',
modelName: 'Model name',
useCluster: 'Available clusters',
local: 'Local',
online: 'Online',
createModel: 'Create Model',
importLocalModel: 'Import Lacal Model',
importOnlineModel: 'Import Online Model',
modifyModelInfo: 'Modify model information',
addModelFiles: 'Add model files',
uploadModelFiles: 'Upload model files',
pleaseInputModelName: 'Please input model name',
version: 'Version',
modelEngine: 'Model engine',
modelLabel: 'Model label',
modelLabelInputTips: 'Input labels, multiple labels are separated by spaces',
modelDescr: 'Model description',
modelDescrInputTips: 'The description should not exceed 256 characters',
confirm: 'Confirm',
cancel: 'Cancel',
modelCreateFailed: 'Model create failed',
modelModifyFailed: 'Model modify failed',
fileUpload: 'File upload',
upload: 'Upload',
uploadStatus: 'Upload status',
modelFileUploadDefaultTips: 'Click to add files or drag files here directly',
modelFileUploadErrTips: 'Up to 10 files can be uploaded at a time, and the total file size of the model does not exceed 200GB',
fileIstoBig: 'File is to big',
removeFile: 'Rmove file',
uploadSuccess: 'upload success',
uploadFailed: 'upload failed',
calcFileMd5: 'Calculating file MD5...',
uploading: 'Uploading...',
fileHasAlreadyInTheModel: 'This file has already in the model: ',
basicInfo: 'Basic information',
modelSize: 'Model size',
descr: 'Description',
createTime: 'Create Time',
label: 'Label',
trainTaskInfo: 'Train task information',
trainTask: 'Train task',
codeBranch: 'Code branch',
bootFile: 'Boot file',
trainDataset: 'Train dataset',
specInfo: 'Specifications',
workServerNumber: 'Amount of compute node',
runParameters: 'Run parameters',
seeMore: 'See more',
collapseDetails: 'Collapse details',
modelFilesList: 'Mode files list',
fileName: 'File name',
fileSize: 'File size',
updateTime: 'Upate Time',
operate: 'Operation',
delete: 'Delete',
infoModificationFailed: 'Information modify failed',
deleteModelFileConfirmTips: 'Are you sure you want to delete the current model file?',
modelFileDeleteFailed: 'Model file delete failed',
},
}

export default en;

+ 60
- 0
web_src/vuepages/langs/config/zh-CN.js View File

@@ -193,6 +193,66 @@ const zh = {
dataDesensitizationModelDesc:'利用人工智能AI技术,把图片中的人脸、车牌号码进行脱敏处理。该模型更多信息请访问项目',
limitFilesUpload:'只能上传 jpg/jpeg/png 格式的文件',
limitSizeUpload:'上传文件大小不能超过 20M !',
modelManage: {
modelManage: '模型管理',
modelName: '模型名称',
useCluster: '可用集群',
local: '本地',
online: '线上',
createModel: '创建模型',
importLocalModel: '导入本地模型',
importOnlineModel: '导入线上模型',
modifyModelInfo: '修改模型信息',
addModelFiles: '增加模型文件',
uploadModelFiles: '上传模型文件',
pleaseInputModelName: '请输入模型名称',
version: '版本',
modelEngine: '模型框架',
modelLabel: '模型标签',
modelLabelInputTips: '输入标签,多个标签用空格区分',
modelDescr: '模型描述',
modelDescrInputTips: '描述字数不超过255个字符',
confirm: '确定',
cancel: '取消',
modelCreateFailed: '模型创建失败',
modelModifyFailed: '模型修改失败',
fileUpload: '文件上传',
upload: '上传',
uploadStatus: '上传状态',
modelFileUploadDefaultTips: '点击添加文件或直接拖拽文件到此处',
modelFileUploadErrTips: '单次最多上传10个文件,模型总文件大小不超过200G',
fileIstoBig: '文件太大',
removeFile: '移除文件',
uploadSuccess: '上传成功',
uploadFailed: '上传失败',
calcFileMd5: '计算文件MD5...',
uploading: '上传中...',
fileHasAlreadyInTheModel: '该文件已上传在模型:',
basicInfo: '基本信息',
modelSize: '模型大小',
descr: '描述',
createTime: '创建时间',
label: '标签',
trainTaskInfo: '训练相关信息',
trainTask: '训练任务',
codeBranch: '代码分支',
bootFile: '启动文件',
trainDataset: '训练数据集',
specInfo: '规格',
workServerNumber: '计算节点',
runParameters: '运行参数',
seeMore: '查看更多信息',
collapseDetails: '折叠详细信息',
modelFilesList: '模型文件列表',
fileName: '文件名称',
fileSize: '文件大小',
updateTime: '更新时间',
operate: '操作',
delete: '删除',
infoModificationFailed: '信息修改失败',
deleteModelFileConfirmTips: '请确认是否删除当前模型文件?',
modelFileDeleteFailed: '模型文件删除失败',
},
}

export default zh;

+ 53
- 37
web_src/vuepages/pages/modelmanage/common/modelmanage-common-detail.vue View File

@@ -2,7 +2,7 @@
<div>
<div class="ui header">
<div class="ui breadcrumb">
<a class="section" :href="`${repo}/modelmanage/show_model`">模型管理</a>
<a class="section" :href="`${repo}/modelmanage/show_model`">{{ $t('modelManage.modelManage') }}</a>
<div class="divider"> / </div>
<div class="active section">{{ this.state.name }}</div>
</div>
@@ -15,11 +15,11 @@
</div>
<div class="content">
<div class="detail-info">
<div class="title">基本信息:</div>
<div class="title">{{ $t('modelManage.basicInfo') }}:</div>
<div class="area-c">
<div class="area">
<div class="row">
<div class="tit">可用集群:</div>
<div class="tit">{{ $t('modelManage.useCluster') }}:</div>
<div class="val">
<div class="txt-wrap" :title="state.typeStr">
{{ state.typeStr }}
@@ -27,13 +27,13 @@
</div>
</div>
<div v-show="isExpanded" class="row">
<div class="tit">模型大小:</div>
<div class="tit">{{ $t('modelManage.modelSize') }}:</div>
<div class="val">
<div class="txt-wrap" :title="state.modelSize">{{ state.modelSize }}</div>
</div>
</div>
<div v-show="isExpanded" class="row" :class="isEidtDescr ? 'edit-row' : ''">
<div class="tit">描述:</div>
<div class="tit">{{ $t('modelManage.descr') }}:</div>
<div class="val" :class="isEidtDescr ? 'edit-val' : ''">
<div v-if="!isEidtDescr" class="txt-wrap" :title="state.description"
style="max-width:100%;width:unset;padding-right:20px;">
@@ -42,7 +42,8 @@
class="el-icon-edit" @click="editDescr = state._description; isEidtDescr = true;"></i>
</div>
<div class="txt-edit" v-if="isEidtDescr">
<el-input type="textarea" v-model="editDescr" :maxLength="255" placeholder="描述字数不超过255个字符"></el-input>
<el-input type="textarea" v-model="editDescr" :maxLength="255"
:placeholder="$t('modelManage.modelDescrInputTips')"></el-input>
<i style="position:absolute;right:-4px;bottom:20px;color:rgb(255, 37, 37);cursor:pointer;"
class="icon times" @click="isEidtDescr = false;"></i>
<i style="position:absolute;right:-5px;bottom:2px;color:rgb(39, 177, 72);cursor:pointer;"
@@ -53,19 +54,19 @@
</div>
<div class="area">
<div class="row">
<div class="tit">模型框架:</div>
<div class="tit">{{ $t('modelManage.modelEngine') }}:</div>
<div class="val">
<div class="txt-wrap" :title="state.engineName">{{ state.engineName }}</div>
</div>
</div>
<div v-show="isExpanded" class="row">
<div class="tit">创建时间:</div>
<div class="tit">{{ $t('modelManage.createTime') }}:</div>
<div class="val">
<div class="txt-wrap" :title="state.createTime">{{ state.createTime }}</div>
</div>
</div>
<div v-show="isExpanded" class="row" :class="isEidtLabel ? 'edit-row' : ''">
<div class="tit">标签:</div>
<div class="tit">{{ $t('modelManage.label') }}:</div>
<div class="val" :class="isEidtLabel ? 'edit-val' : ''">
<div v-if="!isEidtLabel" class="txt-wrap" :title="state.label"
style="max-width:100%;width:unset;padding-right:20px;">
@@ -74,7 +75,8 @@
class="el-icon-edit" @click="editLabel = state._label; isEidtLabel = true;"></i>
</div>
<div class="txt-edit" v-if="isEidtLabel">
<el-input v-model="editLabel" :maxLength="255" placeholder="输入标签,多个标签用空格区分"></el-input>
<el-input v-model="editLabel" :maxLength="255" :placeholder="$t('modelManage.modelLabelInputTips')"
@input="labelInput"></el-input>
<i style="position:absolute;right:-5px;bottom:20px;color:rgb(255, 37, 37);cursor:pointer;"
class="icon times" @click="isEidtLabel = false;"></i>
<i style="position:absolute;right:-5px;bottom:2px;color:rgb(39, 177, 72);cursor:pointer;"
@@ -84,29 +86,29 @@
</div>
</div>
</div>
<div v-show="isExpanded" style="margin-top:8px;" class="title">训练相关信息:</div>
<div v-show="isExpanded" style="margin-top:8px;" class="title">{{ $t('modelManage.trainTaskInfo') }}:</div>
<div v-show="isExpanded" class="area-c">
<div class="area">
<div class="row">
<div class="tit">训练任务:</div>
<div class="tit">{{ $t('modelManage.trainTask') }}:</div>
<div class="val">
<div class="txt-wrap" v-html="state.displayJobName"></div>
</div>
</div>
<div class="row">
<div class="tit">代码分支:</div>
<div class="tit">{{ $t('modelManage.codeBranch') }}:</div>
<div class="val">
<div class="txt-wrap" v-html="state.branchName"></div>
</div>
</div>
<div class="row">
<div class="tit">启动文件:</div>
<div class="tit">{{ $t('modelManage.bootFile') }}:</div>
<div class="val">
<div class="txt-wrap" :title="state.bootFile">{{ state.bootFile }}</div>
</div>
</div>
<div class="row">
<div class="tit">训练数据集:</div>
<div class="tit">{{ $t('modelManage.trainDataset') }}:</div>
<div class="val">
<div class="txt-wrap" :title="state.datasetName">{{ state.datasetName }}</div>
</div>
@@ -114,19 +116,19 @@
</div>
<div class="area">
<div class="row">
<div class="tit">规格:</div>
<div class="tit">{{ $t('modelManage.specInfo') }}:</div>
<div class="val">
<div class="txt-wrap" :title="state.specStr">{{ state.specStr }}</div>
</div>
</div>
<div class="row">
<div class="tit">计算节点:</div>
<div class="tit">{{ $t('modelManage.workServerNumber') }}:</div>
<div class="val">
<div class="txt-wrap" :title="state.workServerNumber">{{ state.workServerNumber }}</div>
</div>
</div>
<div class="row">
<div class="tit">运行参数:</div>
<div class="tit">{{ $t('modelManage.runParameters') }}:</div>
<div class="val">
<div class="txt-wrap" :title="state.parameters">{{ state.parameters }}</div>
</div>
@@ -138,27 +140,28 @@
<div class="line"></div>
<div class="expand-btn" @click="isExpanded = !isExpanded">
<i class="icon chevron circle down" :class="isExpanded ? 'up' : ''"></i>
<span>{{ isExpanded ? '折叠详细信息' : '查看更多信息' }}</span>
<span>{{ isExpanded ? $t('modelManage.collapseDetails') : $t('modelManage.seeMore') }}</span>
</div>
<div class="line"></div>
</div>
<div class="files-info">
<div class="top">
<div>
<div class="title">模型文件列表:</div>
<div class="title">{{ $t('modelManage.modelFilesList') }}:</div>
<div class="title" style="margin-top:8px"><span class="version">{{ state.version }}</span>
<span style="color:rgba(0,0,0,.4);" class="divider"> / </span>
</div>
</div>
<div>
<el-button v-if="modelType == 1 && canOperate" type="primary" icon="el-icon-upload" @click="goUploadPage">
上传模型文件
{{ $t('modelManage.uploadModelFiles') }}
</el-button>
</div>
</div>
<div class="table-container">
<el-table :data="filesList" row-key="sn" style="width: 100%" v-loading="loading" stripe>
<el-table-column column-key="FileName" prop="FileName" label="文件名称" align="left" header-align="left">
<el-table-column column-key="FileName" prop="FileName" :label="$t('modelManage.fileName')" align="left"
header-align="left">
<template slot-scope="scope">
<div class="tbl-file-name">
<span class="octicon octicon-file-directory"></span>
@@ -171,16 +174,16 @@
</div>
</template>
</el-table-column>
<el-table-column column-key="SizeShow" prop="SizeShow" label="文件大小" align="center" header-align="center"
width="200">
<el-table-column column-key="SizeShow" prop="SizeShow" :label="$t('modelManage.fileSize')" align="center"
header-align="center" width="200">
</el-table-column>
<el-table-column column-key="ModTime" prop="ModTime" label="更新时间" align="center" header-align="center"
width="200">
<el-table-column column-key="ModTime" prop="ModTime" :label="$t('modelManage.updateTime')" align="center"
header-align="center" width="200">
</el-table-column>
<el-table-column v-if="modelType == 1 && canOperate" column-key="operate" prop="operate" label="操作"
align="center" header-align="center" width="200">
<el-table-column v-if="modelType == 1 && canOperate" column-key="operate" prop="operate"
:label="$t('modelManage.operate')" align="center" header-align="center" width="200">
<template slot-scope="scope">
<span class="btn-del" @click="deleteFile(scope.row)">删除</span>
<span class="btn-del" @click="deleteFile(scope.row)">{{ $t('modelManage.delete') }}</span>
</template>
</el-table-column>
</el-table>
@@ -198,6 +201,7 @@ import { MODEL_ENGINES } from '~/const';
import { formatDate } from 'element-ui/lib/utils/date-util';

const REPO_NAME = location.pathname.split('/')[2];
const MAX_LABEL_COUNT = 5;

export default {
data() {
@@ -298,7 +302,18 @@ export default {
})
},
goUploadPage() {
window.location.href = `${this.repo}/modelmanage/create_local_model_tmpl2?type=0&name=${this.state.name}&id=${this.state.id}`;
window.location.href = `${this.repo}/modelmanage/create_local_model_tmpl2?type=1&name=${this.state.name}&id=${this.state.id}`;
},
backToModelListPage() {
const list = window.location.href.split('/');
list.pop();
list.push('show_model');
window.location.href = list.join('/');
},
labelInput() {
const hasEndSpace = this.editLabel[this.editLabel.length - 1] == ' ';
const list = this.editLabel.trim().split(' ').filter(label => label != '');
this.editLabel = list.slice(0, MAX_LABEL_COUNT).join(' ') + (hasEndSpace && list.length < MAX_LABEL_COUNT ? ' ' : '');
},
submitEidt(type) {
const obj = {
@@ -326,19 +341,19 @@ export default {
} else {
this.$message({
type: 'error',
message: '信息修改失败',
message: this.$t('modelManage.infoModificationFailed'),
});
}
}).catch(err => {
console.log(err);
this.$message({
type: 'error',
message: '信息修改失败',
message: this.$t('modelManage.infoModificationFailed'),
});
});
},
deleteFile(file) {
this.$confirm('请确认是否删除当前模型文件?', this.$t('tips'), {
this.$confirm(this.$t('modelManage.deleteModelFileConfirmTips'), this.$t('tips'), {
confirmButtonText: this.$t('confirm1'),
cancelButtonText: this.$t('cancel'),
type: 'warning',
@@ -355,14 +370,14 @@ export default {
} else {
this.$message({
type: 'error',
message: '模型文件删除失败',
message: this.$t('modelManage.modelFileDeleteFailed'),
});
}
}).catch(err => {
console.log(err);
this.$message({
type: 'error',
message: '模型文件删除失败',
message: this.$t('modelManage.modelFileDeleteFailed'),
});
});
}).catch(() => { });
@@ -387,10 +402,10 @@ export default {
}).catch(err => {
this.loading = false;
console.log(err);
this.cancel();
this.backToModelListPage();
});
} else {
this.cancel();
this.backToModelListPage();
}
},
beforeDestroy() {
@@ -414,6 +429,7 @@ export default {
font-weight: 550;
font-size: 14px;
color: rgb(16, 16, 16);
margin-bottom: 10px;
}

.detail-info {


+ 36
- 19
web_src/vuepages/pages/modelmanage/local/modelmanage-local-create-1.vue View File

@@ -1,23 +1,24 @@
<template>
<div>
<div class="header">
<span class="title">{{ type == '1' ? '修改模型信息' : '导入本地模型' }}</span>
<span class="title">{{ type == '1' ? $t('modelManage.modifyModelInfo') : $t('modelManage.importLocalModel')
}}</span>
</div>
<div class="content">
<div class="guide-c" v-if="type != '1'">
<div class="step focused">
<div class="num">1</div>
<div class="txt">创建模型</div>
<div class="txt">{{ $t('modelManage.createModel') }}</div>
</div>
<div class="line"></div>
<div class="step">
<div class="num">2</div>
<div class="txt">上传模型文件</div>
<div class="txt">{{ $t('modelManage.uploadModelFiles') }}</div>
</div>
</div>
<div class="row-c" v-loading="loading">
<div class="row">
<div class="r-title"><label class="required">可用集群</label></div>
<div class="r-title"><label class="required">{{ $t('modelManage.useCluster') }}</label></div>
<div class="r-content" style="display:flex;">
<div class="cluster-type-btn" v-if="type != 1 || type == 1 && state.type === 0"
:class="state.type === 0 ? 'focused' : ''"
@@ -54,46 +55,49 @@
</div>
</div>
<div class="row">
<div class="r-title"><label class="required">模型名称</label></div>
<div class="r-title"><label class="required">{{ $t('modelManage.modelName') }}</label></div>
<div class="r-content">
<el-input size="medium" :maxLength="25" v-model="state.name" placeholder="请输入模型名称"></el-input>
<el-input size="medium" :maxLength="25" v-model="state.name" :placeholder="$t('modelManage.pleaseInputModelName')">
</el-input>
</div>
</div>
<div class="row">
<div class="r-title"><label class="required">版本</label></div>
<div class="row" v-show="isShowVersion">
<div class="r-title"><label class="required">{{ $t('modelManage.version') }}</label></div>
<div class="r-content">
<el-input class="input-disabled" style="width:288px;" size="medium" v-model="state.version" readonly>
</el-input>
</div>
</div>
<div class="row">
<div class="r-title"><label class="required">模型框架</label></div>
<div class="r-title"><label class="required">{{ $t('modelManage.modelEngine') }}</label></div>
<div class="r-content">
<el-select style="width:288px;" size="medium" v-model="state.engine" placeholder="请选择">
<el-select style="width:288px;" size="medium" v-model="state.engine" placeholder="">
<el-option v-for="item in engineList" :key="item.k" :label="item.v" :value="item.k">
</el-option>
</el-select>
</div>
</div>
<div class="row">
<div class="r-title"><label>模型标签</label></div>
<div class="r-title"><label>{{ $t('modelManage.modelLabel') }}</label></div>
<div class="r-content">
<el-input size="medium" :maxLength="255" v-model="state.label" placeholder="输入标签,多个标签用空格区分"></el-input>
<el-input size="medium" :maxLength="255" v-model="state.label" :placeholder="$t('modelManage.modelLabelInputTips')"
@input="labelInput"></el-input>
</div>
</div>
<div class="row" style="align-items:flex-start;">
<div class="r-title"><label>模型描述</label></div>
<div class="r-title"><label>{{ $t('modelManage.modelDescr') }}</label></div>
<div class="r-content">
<el-input type="textarea" :maxLength="255" size="medium" v-model="state.description" :rows="3"
placeholder="描述字数不超过255个字符">
:placeholder="$t('modelManage.modelDescrInputTips')">
</el-input>
</div>
</div>
<div class="row" style="margin-top:20px">
<div class="r-title"><label></label></div>
<div class="r-content">
<el-button size="medium" class="green" @click="submit">保存模型</el-button>
<el-button size="medium" @click="cancel">取消</el-button>
<el-button size="medium" class="green" @click="submit">{{ type == '1' ? $t('modelManage.confirm') : $t('modelManage.createModel') }}
</el-button>
<el-button size="medium" @click="cancel">{{ $t('modelManage.cancel') }}</el-button>
</div>
</div>
</div>
@@ -108,6 +112,7 @@ import { getUrlSearchParams } from '~/utils';
import { MODEL_ENGINES } from '~/const'

const REPO_NAME = location.pathname.split('/')[2];
const MAX_LABEL_COUNT = 5;

export default {
data() {
@@ -122,16 +127,22 @@ export default {
label: '',
description: '',
},
isShowVersion: false,
engineList: MODEL_ENGINES,
};
},
components: {},
methods: {
labelInput() {
const hasEndSpace = this.state.label[this.state.label.length - 1] == ' ';
const list = this.state.label.trim().split(' ').filter(label => label != '');
this.state.label = list.slice(0, MAX_LABEL_COUNT).join(' ') + (hasEndSpace && list.length < MAX_LABEL_COUNT ? ' ' : '');
},
submit() {
if (!this.state.name) {
this.$message({
type: 'info',
message: '请输入模型名称',
message: this.$t('modelManage.pleaseInputModelName'),
});
return;
}
@@ -143,7 +154,7 @@ export default {
res = res.data;
if (res && res.code == '0') {
if (this.type == '1') {
this.cancel();
this.goDetail();
return;
}
const list = window.location.href.split('/');
@@ -153,7 +164,7 @@ export default {
} else {
this.$message({
type: 'error',
message: this.type == '1' ? '模型修改失败' : '保存模型失败',
message: this.type == '1' ? this.$t('modelManage.modelModifyFailed') : this.$t('modelManage.modelCreateFailed'),
});
}
}).catch(err => {
@@ -166,6 +177,12 @@ export default {
list.push('show_model');
window.location.href = list.join('/');
},
goDetail() {
const list = window.location.href.split('/');
list.pop();
list.push('show_model_info');
window.location.href = list.join('/') + '?name=' + this.state.name;
}
},
mounted() {
const urlParams = getUrlSearchParams();


+ 83
- 69
web_src/vuepages/pages/modelmanage/local/modelmanage-local-create-2.vue View File

@@ -1,33 +1,33 @@
<template>
<div>
<div class="header">
<span class="title">{{ type == '1' ? '增加模型文件' : '上传模型文件' }}</span>
<span class="title">{{ type == '1' ? $t('modelManage.addModelFiles') : $t('modelManage.uploadModelFiles') }}</span>
</div>
<div class="content ui form">
<div class="guide-c" v-if="type != '1'">
<div class="step">
<div class="num">1</div>
<div class="txt">创建模型</div>
<div class="txt">{{$t('modelManage.createModel')}}</div>
</div>
<div class="line"></div>
<div class="step focused">
<div class="num">2</div>
<div class="txt">上传模型文件</div>
<div class="txt">{{$t('modelManage.uploadModelFiles')}}</div>
</div>
</div>
<div class="row-c">
<div class="row">
<div class="r-title"><label class="required">模型名称</label></div>
<div class="r-title"><label class="required">{{$t('modelManage.modelName')}}</label></div>
<div class="r-content">
<el-input size="medium" class="input-disabled" v-model="state.name" placeholder="请输入模型名称" readonly>
<el-input size="medium" class="input-disabled" v-model="state.name" :placeholder="$t('modelManage.pleaseInputModelName')" readonly>
</el-input>
</div>
</div>
<div class="row" style="align-items:flex-start;">
<div class="r-title"><label class="required">文件上传</label></div>
<div class="r-title"><label class="required">{{$t('modelManage.fileUpload')}}</label></div>
<div class="r-content">
<div style="position:relative">
<form class="dropzone" ref="dropzoneRef" @click="">
<form class="dropzone" ref="dropzoneRef">
<div class="dropzon-err-tips ui red message" v-show="showUploadErr" style="display:none;margin:2.5rem">
{{ uploadErrTxt }}</div>
</form>
@@ -38,12 +38,12 @@
<div class="row" style="margin-top:10px">
<div class="r-title"><label></label></div>
<div class="r-content">
<el-button size="medium" class="green" @click="submit" :disabled="uploading">上传</el-button>
<el-button size="medium" @click="cancel">取消</el-button>
<el-button size="medium" class="green" @click="submit" :disabled="uploading">{{$t('modelManage.upload')}}</el-button>
<el-button size="medium" @click="cancel">{{$t('modelManage.cancel')}}</el-button>
</div>
</div>
<div class="row" style="align-items:flex-start;">
<div class="r-title"><label>上传状态:</label></div>
<div class="r-title"><label>{{$t('modelManage.uploadStatus')}}:</label></div>
<div class="r-content">
<div v-for="(item, index) in uploadFiles" :key="item.upload.uuid" class="datast-upload-progress">
<span class="dataset-name nowrap" :title="item.name">{{ item.name }}</span>
@@ -104,7 +104,7 @@ export default {
originData: null,
showUploadErr: false,
uploadErrTxt: '',
defaultErrTxt: '单次最多上传10个文件,模型总文件大小不超过200G',
defaultErrTxt: this.$t('modelManage.modelFileUploadErrTips'),

uploadFiles: [],
uploadLength: 0,
@@ -116,6 +116,43 @@ export default {
},
components: {},
methods: {
initModelData() {
const urlParams = getUrlSearchParams();
if (urlParams.name && urlParams.id) {
this.type = urlParams.type || '0';
this.state.name = urlParams.name;
this.state.id = urlParams.id;
this.loading = true;
getModelInfoByName({
repo: location.pathname.split('/').slice(0, 3).join('/'),
name: urlParams.name,
id: urlParams.id
}).then(res => {
this.loading = false;
const list = res.data;
if (list && list.length) {
const data = list[0];
this.state.type = data.type;
this.state.id = data.id;
this.state.name = data.name;
this.state.version = data.version;
this.state.engine = data.engine.toString();
this.state.label = data.label;
this.state.description = data.description;
this.state.size = data.size || 0;
this.originData = data;
} else {
this.cancel();
}
}).catch(err => {
this.loading = false;
console.log(err);
this.cancel();
});
} else {
this.cancel();
}
},
initDropZone() {
this.dropzoneHandler = new Dropzone(this.$refs.dropzoneRef, {
url: '/',
@@ -126,9 +163,9 @@ export default {
timeout: 0,
addRemoveLinks: true,
autoProcessQueue: false,
dictDefaultMessage: '点击添加文件或直接拖拽文件到此处',
dictFileTooBig: '文件太大',
dictRemoveFile: '移除文件',
dictDefaultMessage: this.$t('modelManage.modelFileUploadDefaultTips'),
dictFileTooBig: this.$t('modelManage.fileIstoBig'),
dictRemoveFile: this.$t('modelManage.removeFile'),
dictMaxFilesExceeded: this.defaultErrTxt,
});
this.dropzoneHandler.on("addedfile", file => {
@@ -189,7 +226,7 @@ export default {
this.uploadStatusList.push({
uploadUuid: file.upload.uuid,
name: file.name,
status: '计算文件MD5...',
status: this.$t('modelManage.calcFileMd5'),
progress: 0,
infoCode: 3,
});
@@ -261,13 +298,13 @@ export default {
this.breakpointUpload(file);
} else {
this.uploadError(file, info);
this.updateFileStatus(file, "上传失败", 0, 2);
this.updateFileStatus(file, this.$t('modelManage.uploadFailed'), 0, 2);
}
return file;
}).catch(err => {
console.log('getNewMultipart', err);
this.uploadError(file, info);
this.updateFileStatus(file, "上传失败", 0, 2);
this.updateFileStatus(file, this.$t('modelManage.uploadFailed'), 0, 2);
return err;
});
},
@@ -370,7 +407,7 @@ export default {
currentChunk++;
if (currentChunk < chunks) {
console.log(`第${currentChunk}个分片上传完成, 开始第${currentChunk + 1}/${chunks}个分片上传`);
this.updateFileStatus(file, '上传中...', Number(((currentChunk / chunks) * 100).toFixed(2)), 3);
this.updateFileStatus(file, this.$t('modelManage.uploading'), Number(((currentChunk / chunks) * 100).toFixed(2)), 3);
loadNext();
} else {
try {
@@ -378,10 +415,10 @@ export default {
console.log(`文件上传完成:${file.name} \n分片:${chunks} 大小:${file.size} 用时:${(new Date().getTime() - time) / 1000} s`);
this.uploadLength++;
this.uploadSuccessLength++;
this.updateFileStatus(file, "上传成功", 100, 0);
this.updateFileStatus(file, this.$t('modelManage.uploadSuccess'), 100, 0);
this.uploadSuccess(file);
} catch (err) {
const info = "上传失败";
const info = this.$t('modelManage.uploadFailed');
console.log(info, file)
this.uploadLength++;
this.uploadError(file, info);
@@ -390,7 +427,7 @@ export default {
}
} catch (err) {
console.log(err);
const info = "上传失败";
const info = this.$t('modelManage.uploadFailed');
console.log(info, file)
this.uploadLength++;
this.uploadError(file, info);
@@ -427,19 +464,21 @@ export default {
if (this.uploadLength === this.uploadFiles.length) {
console.log('All file has finish, success ' + this.uploadSuccessLength);
this.uploading = false;
if (this.uploadSuccessLength == this.uploadLength) {
const list = window.location.href.split('/');
list.pop();
list.push('show_model_info');
if (this.uploadSuccessLength == this.uploadLength) {
window.setTimeout(() => {
window.location.href = list.join('/') + '?name=' + this.state.name;
this.goDetail();
}, 1000);
} else {
if (this.uploadSuccessLength > 0) {
this.initModelData();
}
}
}
},
submit() {
const fileList = this.dropzoneHandler.getAcceptedFiles();
if (!fileList.length) return;
if (!this.checkFiles()) return;
this.resetFileStatus();
this.uploadFiles = fileList;
this.uploading = true;
@@ -459,12 +498,12 @@ export default {
this.uploadLength++;
// 同一模型上传同一个文件
if (file._modelUuid) {
const info = `该文件已上传在模型: ${file._modelName}`;
const info = `${this.$t('modelManage.fileHasAlreadyInTheModel')} ${file._modelName}`;
this.uploadError(file, info);
this.updateFileStatus(file, "上传失败", 0, 1, info);
this.updateFileStatus(file, this.$t('modelManage.uploadFailed'), 0, 1, info);
} else { // 秒传
this.uploadSuccessLength++;
this.updateFileStatus(file, "上传成功", 100, 0);
this.updateFileStatus(file, this.$t('modelManage.uploadFailed'), 100, 0);
this.uploadSuccess(file);
}
console.log(file.name, '文件处理完成');
@@ -474,61 +513,36 @@ export default {
}).catch(err => {
console.info('getChunksInfo', err);
this.uploadLength++;
this.uploadError(file, "上传失败");
this.updateFileStatus(file, "上传失败", 0, 2);
this.uploadError(file, this.$t('modelManage.uploadFailed'));
this.updateFileStatus(file, this.$t('modelManage.uploadFailed'), 0, 2);
});
}).catch(err => {
console.info('calcFileMd5', err);
this.uploadLength++;
this.uploadError(file, '上传失败');
this.updateFileStatus(file, "上传失败", 0, 2);
this.uploadError(file, this.$t('modelManage.uploadFailed'));
this.updateFileStatus(file, this.$t('modelManage.uploadFailed'), 0, 2);
});
}
},
cancel() {
if (this.type == '1') {
this.goDetail();
return;
}
const list = window.location.href.split('/');
list.pop();
list.push('show_model');
window.location.href = list.join('/');
},
goDetail() {
const list = window.location.href.split('/');
list.pop();
list.push('show_model_info');
window.location.href = list.join('/') + '?name=' + this.state.name;
}
},
mounted() {
const urlParams = getUrlSearchParams();
if (urlParams.name && urlParams.id) {
this.type = urlParams.type || '0';
this.state.name = urlParams.name;
this.state.id = urlParams.id;
this.loading = true;
getModelInfoByName({
repo: location.pathname.split('/').slice(0, 3).join('/'),
name: urlParams.name,
id: urlParams.id
}).then(res => {
this.loading = false;
const list = res.data;
if (list && list.length) {
const data = list[0];
this.state.type = data.type;
this.state.id = data.id;
this.state.name = data.name;
this.state.version = data.version;
this.state.engine = data.engine.toString();
this.state.label = data.label;
this.state.description = data.description;
this.state.size = data.size || 0;
this.originData = data;
} else {
this.cancel();
}
}).catch(err => {
this.loading = false;
console.log(err);
this.cancel();
});
} else {
this.cancel();
return;
}
this.initModelData();
this.initDropZone();
},
beforeDestroy() {


Loading…
Cancel
Save