姜玉琦 2024-06-18 01:18:13 +08:00
commit 065ed011d4
3 changed files with 342 additions and 5 deletions

View File

@ -33,6 +33,19 @@ class MenuAPI {
keepAlive: true,
alwaysShow: false,
},
},
{
path: "uploadModel",
component: "model/uploadModel",
name: "uploadModel",
meta: {
title: "模型管理",
icon: "user",
hidden: true,
roles: ["ADMIN", "GUEST"],
keepAlive: true,
alwaysShow: false,
},
}
],
},

View File

@ -1,11 +1,208 @@
<!-- 用户管理 -->
<template>
<div>
1111111111
<div class="app-container">
<div class="search-container">
<el-button type="primary" @click="doUploadModel" ><i-ep-plus />上传模型</el-button>
<el-form ref="queryFormRef" :model="queryParams" :inline="true" style="flex-grow: 1;text-align: right;">
<el-form-item label="" prop="keywords">
<el-input v-model="queryParams.keywords" placeholder="请输入模型名称" clearable style="width: 200px"
@keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleQuery"><i-ep-search />搜索</el-button>
<el-button @click="resetQuery">
<i-ep-refresh />
重置</el-button>
</el-form-item>
</el-form>
</div>
<el-card shadow="never" class="table-container">
<el-table v-loading="loading" :data="tableData" stripe @selection-change="handleSelectionChange">
<el-table-column label="模型名称" align="left" prop="name" width="300"/>
<el-table-column label="网络名称" align="left" prop="netName" />
<el-table-column label="模型类型" align="left" prop="modelType" />
<el-table-column label="版本" align="left" prop="ver" />
<el-table-column label="说明" width="300" align="left" prop="desc" />
<el-table-column label="上传时间" width="120" align="left" prop="upTime" />
<el-table-column label="上传用户" width="100" align="left" prop="upUser" />
<el-table-column label="操作" fixed="right" width="250">
<template #default="scope">
<el-button text type="primary" size="small"
@click="openDialog('user-form', scope.row.id)"><i-ep-edit />查看</el-button>
<el-button text type="primary" size="small"
@click="openDialog('user-form', scope.row.id)"><i-ep-link/>互联</el-button>
<el-button text type="primary" size="small" @click="handleDelete(scope.row)"><i-ep-delete />删除</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
<el-card class="card-footer">
<pagination v-if="total > 0" v-model:total="total" v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize" @pagination="handleQuery" />
</el-card>
</div>
</template>
<script setup>
<script setup lang="ts">
defineOptions({
name: "calculateIndex",
inheritAttrs: false,
});
import { UserQuery } from "@/api/user/model";
const queryFormRef = ref(ElForm); //
const router = useRouter();
const loading = ref(false); //
const removeIds = ref([]); // ID
const queryParams = reactive<UserQuery>({
pageNum: 1,
pageSize: 10,
});
const dateTimeRange = ref("");
const total = ref(100); //
watch(dateTimeRange, (newVal) => {
if (newVal) {
queryParams.startTime = newVal[0];
queryParams.endTime = newVal[1];
}
});
const tableData = [
{
id:"1",
name: "模型名称模型名称模型名称查看",
netName: "VIT",
modelType: "图像分类",
desc:'进行10种类型 的目标分类模型查看',
ver: "1.0",
upTime: "2024-02-02",
upUser:'USER'
},
{
id:"1",
name: "模型名称模型名称模型名称查看",
netName: "Mobile-VIT",
modelType: "图像分类",
ver: "1.0",
desc:'进行10种类型 的目标分类模型查看',
upTime: "2024-02-02",
upUser:'USER'
},
{
id:"1",
name: "模型名称模型名称模型名称查看",
netName: "VIT",
modelType: "图像分类",
ver: "1.0",
desc:'进行人员检测的模型',
upTime: "2024-02-02",
upUser:'USER'
},
{
id:"1",
name: "模型名称模型名称模型名称查看",
netName: "Mobile-VIT",
modelType: "图像分类",
ver: "1.0",
desc:'进行10种类型 的目标分类模型查看',
upTime: "2024-02-02",
upUser:'USER'
},
{
id:"1",
name: "模型名称模型名称模型名称查看",
netName: "VIT",
modelType: "图像分类",
ver: "1.0",
desc:'进行人员检测的模型',
upTime: "2024-02-02",
upUser:'USER'
}
];
/** 查询 */
function handleQuery() {
loading.value = true;
ElMessage.success("查询成功");
loading.value = false;
}
function doUploadModel(){
router.replace({ path: "/modelMgr/uploadModel" });
}
/** 重置查询 */
function resetQuery() {
queryFormRef.value.resetFields();
dateTimeRange.value = "";
queryParams.pageNum = 1;
queryParams.deptId = undefined;
queryParams.startTime = undefined;
queryParams.endTime = undefined;
handleQuery();
}
/** 行选中 */
function handleSelectionChange(selection: any) {
removeIds.value = selection.map((item: any) => item.id);
}
/** 删除数据 */
function handleDelete(row: { [key: string]: any }) {
ElMessageBox.confirm("确认删除算子?", "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(function () {
ElMessage.success("删除成功");
});
}
/**
* 打开弹窗
*
* @param type 弹窗类型 用户表单user-form | 用户导入user-import
* @param id 用户ID
*/
async function openDialog(type: string, id?: number) {
router.replace({ path: "/operatorLibrary/calculateEdit" });
}
/** 下载导入模板 */
function downloadTemplate() {
ElMessage.success("下载模板成功");
}
/** 导出用户 */
function handleExport() {
ElMessage.success("导出成功");
}
onMounted(() => {
//handleQuery();
});
</script>
<style scoped lang='less'>
</style>
<style scoped lang='scss'>
.search-container{
display:flex;
}
.card-footer{
position: fixed;
width: calc(100% - 215px);
bottom: 0px;
:deep(.el-card__body){
padding:0px;
.el-pagination{
justify-content: end;
}
}
}
</style>

View File

@ -0,0 +1,127 @@
<template>
<div class="app-container">
<div class="search-container" style="padding-top:4px;">
<h4>模型基本信息</h4>
<el-form ref="uploadForm" :model="upForm" label-width="120" >
<el-row>
<el-col :span="12">
<el-form-item label="模型名称">
<el-input v-model="upForm.name" placeholder="请输入模型名称"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="模型类型">
<el-select v-model="upForm.mtype1" placeholder="请选择" style="width: 48%">
<el-option label="VIT" value="VIT" />
<el-option label="Mobile-VIT" value="Mobile-VIT" />
</el-select>
<el-select v-model="upForm.mtype2" placeholder="请选择" style="width: 48%;margin-left:2%;">
<el-option label="YoloV7Small" value="YoloV7Small" />
<el-option label="YoloV7 Tiny" value="YoloV7 Tiny" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="模型版本">
<el-input v-model="upForm.ver" placeholder="请输入模型版本"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="版本描述">
<el-input v-model="upForm.desc" type="textarea" style="width:100%;" :rows="4" placeholder="请输入版本描述"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="算法框架">
<el-select v-model="upForm.framework" placeholder="请选择" style="width: 48%;margin-left:2%;">
<el-option label="PyToRch" value="PyToRch" />
<el-option label="oCcn" value="oCcn" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="模型网络">
<el-select v-model="upForm.network" placeholder="请选择" style="width: 48%;margin-left:2%;">
<el-option label="yolov7_tiny" value="yolov7_tiny" />
<el-option label="yolov5_s" value="yolov5_s" />
<el-option label="yolov5_m" value="yolov5_m" />
<el-option label="yolov5_" value="yolov5_" />
<el-option label="yolox_s" value="yolox_s" />
<el-option label="yolox_m" value="yolox_m" />
<el-option label="yolox_l" value="yolox_l" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="文件格式">
<el-select v-model="upForm.fileFormat" placeholder="请选择" style="width: 48%;margin-left:2%;">
<el-option label="onnx" value="onnx" />
<el-option label="pth" value="pth" />
<el-option label="pt" value="pt" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="网络参数">
<el-upload
v-model:file-list="fileList"
class="upload-demo"
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
:limit="1"
>
<el-button type="primary">请选择文件</el-button>
<template #tip>
<div class="el-upload__tip">
请上传大小不超过<span style="color:coral">10M</span>,格式为<span style="color:coral">onnx/ts</span>的文件
</div>
</template>
</el-upload>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="网络配置">
<el-upload
v-model:file-list="fileList"
class="upload-demo"
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
:limit="1"
>
<el-button type="primary">请选择文件</el-button>
<template #tip>
<div class="el-upload__tip">
请上传大小不超过<span style="color:coral">10M</span>,格式为<span style="color:coral">json</span>的文件
</div>
</template>
</el-upload>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
</template>
<script setup>
const uploadForm=ref(ElForm)
const upForm=reactive({
name:''
})
</script>
<style scoped lang='less'></style>