姜玉琦 2024-06-19 21:42:53 +08:00
commit c001d7389b
7 changed files with 166 additions and 8 deletions

View File

@ -19,6 +19,14 @@
html { touch-action: none; overflow: hidden; width: 100%; height: 100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-rendering: optimizeLegibility; -webkit-text-rendering: optimizeLegibility; -moz-text-rendering: optimizeLegibility; -ms-text-rendering: optimizeLegibility; -o-text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -ms-font-smoothing: antialiased; -o-font-smoothing: antialiased; }
body { touch-action: none; overflow: hidden; width: 100%; height: 100%; margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe WPC", "Segoe UI", "Ubuntu", "Droid Sans", sans-serif, "PingFang SC"; font-size: 12px; text-rendering: geometricPrecision; }
button { font-family: -apple-system, BlinkMacSystemFont, "Segoe WPC", "Segoe UI", "Ubuntu", "Droid Sans", sans-serif, "PingFang SC"; }
.scroll::-webkit-scrollbar {
width: 8px;
height: 8px;
}
.scroll::-webkit-scrollbar-thumb {
background-color: rgb(1, 169, 255);
border-radius: 4px;
}
.center { position: absolute; margin: auto; top: 0; right: 0; bottom: 0; left: 0; user-select: none; -webkit-user-select: none; -moz-user-select: none; }
.select { user-select: text; -webkit-user-select: text; -moz-user-select: text; }
.graph { display: flex; height: 100%; width: 100%; overflow: auto; outline: none; touch-action: pan-x pan-y; }
@ -216,7 +224,7 @@
</head>
<body class="welcome spinner">
<div id="graph" class="graph" tabindex="0">
<div id="graph" class="graph scroll" tabindex="0">
<svg id="canvas" class="canvas" preserveaspectratio="xMidYMid meet" width="100%" height="100%"></svg>
</div>
<div id="sidebar" class="sidebar">

View File

@ -34,3 +34,9 @@ const fontColor = computed(() => {
: "rgba(0, 0, 0, .15)";
});
</script>
<style lang="scss">
.router-link-active .el-menu-item{
background-color: #EEF3FB;
border-right: solid 3px var(--el-color-primary);
}
</style>

View File

@ -39,7 +39,20 @@ class MenuAPI {
component: "model/uploadModel",
name: "uploadModel",
meta: {
title: "模型管理",
title: "上传模型",
icon: "user",
hidden: true,
roles: ["ADMIN", "GUEST"],
keepAlive: true,
alwaysShow: false,
},
},
{
path: "modelDetail",
component: "model/modelDetail",
name: "modelDetail",
meta: {
title: "模型详情",
icon: "user",
hidden: true,
roles: ["ADMIN", "GUEST"],

View File

@ -0,0 +1 @@
<svg class="icon" style="width: 1em;height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6318"><path style=" stroke: #0477F4;fill:#0477F4;" d="M755.968 128a16 16 0 0 1 16 16v736a16 16 0 0 1-16 16h-128a16 16 0 0 1-16-16V144a16 16 0 0 1 16-16h128zM396.032 128a16 16 0 0 1 16 16v736a16 16 0 0 1-16 16h-128a16 16 0 0 1-16-16V144a16 16 0 0 1 16-16h128z" fill="#666666" p-id="6319"></path></svg>

After

Width:  |  Height:  |  Size: 489 B

View File

@ -30,7 +30,7 @@
<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>
@click="doShowModelDetail(scope.row)"><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>
@ -84,7 +84,7 @@ const tableData = [
upUser:'USER'
},
{
id:"1",
id:"2",
name: "模型名称模型名称模型名称查看",
netName: "Mobile-VIT",
modelType: "图像分类",
@ -94,7 +94,7 @@ const tableData = [
upUser:'USER'
},
{
id:"1",
id:"3",
name: "模型名称模型名称模型名称查看",
netName: "VIT",
modelType: "图像分类",
@ -104,7 +104,7 @@ const tableData = [
upUser:'USER'
},
{
id:"1",
id:"4",
name: "模型名称模型名称模型名称查看",
netName: "Mobile-VIT",
modelType: "图像分类",
@ -114,7 +114,7 @@ const tableData = [
upUser:'USER'
},
{
id:"1",
id:"5",
name: "模型名称模型名称模型名称查看",
netName: "VIT",
modelType: "图像分类",
@ -164,6 +164,9 @@ function handleDelete(row: { [key: string]: any }) {
});
}
const doShowModelDetail=(row:any)=>{
router.replace({path:"/modelMgr/modelDetail",query:{id:row.id}})
}
/**
* 打开弹窗
*

View File

@ -0,0 +1,104 @@
<template>
<div class="app-container model-detail">
<el-card>
<template #header>
<svg-icon icon-class="pause" style="width:20px;height:20px;" />
基本信息</template>
<table style="width:100%" class="tb-base-info">
<tr>
<td style="width: 50%;">
<span class="sp-title">模型名称:</span>
<span class="sp-text">目标分类模型</span>
</td>
<td style="width: 50%;">
<span class="sp-title">模型类型:</span>
<span class="sp-text">目标分类</span>
</td>
</tr>
<tr>
<td style="width: 50%;">
<span class="sp-title">模型版本:</span>
<span class="sp-text">1.0</span>
</td>
<td style="width: 50%;">
<span class="sp-title">版本描述:</span>
<span class="sp-text">进行10中类型的目标分类建模和一些其他操作</span>
</td>
</tr>
<tr>
<td style="width: 50%;">
<span class="sp-title">模型网络:</span>
<span class="sp-text">目标分类</span>
</td>
<td style="width: 50%;">
<span class="sp-title">上传用户:</span>
<span class="sp-text">王大大</span>
</td>
</tr>
<tr>
<td style="width: 50%;">
<span class="sp-title">算法框架:</span>
<span class="sp-text">ONNX</span>
</td>
<td style="width: 50%;">
<span class="sp-title">上传时间:</span>
<span class="sp-text">2023-12-12 12:12:12</span>
</td>
</tr>
<tr>
<td style="width: 50%;">
<span class="sp-title">文件格式:</span>
<span class="sp-text">ONNX</span>
</td>
<td style="width: 50%;">
<span class="sp-title">网络配置:</span>
<span class="sp-text sp-file">
<a style="line-height:24px;"ref="#"><el-icon><Document /></el-icon></a>
</span>
</td>
</tr>
</table>
</el-card>
<el-card style="margin-top: 12px;">
<template #header>
<svg-icon icon-class="pause" style="width:20px;height:20px;" />可适配算子</template>
<el-button>前处理-GRAY图像格式</el-button>
<el-button>前处理-GRAY图像格式</el-button>
<el-button>前处理-GRAY图像格式</el-button>
<el-button>前处理-RGB24图像格式</el-button>
</el-card>
<el-card style="margin-top: 12px;">
<template #header>
<svg-icon icon-class="pause" style="width:20px;height:20px;" />
模型结构</template>
<div style="position: relative;min-height:50vh;" class="scroll">
<iframe frameborder="0" scrolling="no" :src="url" style="width:100%;height:100%;position: absolute;top:0px;"></iframe>
</div>
</el-card>
</div>
</template>
<script setup>
let url=ref("")
onMounted(()=>{
url.value="./onnx/onnx.html?url=/ai/siamRPN_192.onnx"
});
</script>
<style scoped lang='scss'>
.model-detail{
:deep(.el-card__header){
padding:8px 4px;
display: flex;
align-items: center
}
}
.sp-file{
color:#29d;
}
.tb-base-info{
line-height: 30px;
}
:deep(.svg-icon){
margin-right:8px;
}
</style>

View File

@ -113,6 +113,19 @@
</el-row>
</el-form>
</div>
<div class="div-log">
<div style="font-weight: bold;font-size:14px;padding:10px 10px">分割日志</div>
<el-card class="split-log">
<div v-for="(it,idx) in logList" :key="idx" class="log-item">
<span>{{ it.date }}</span>
<span>{{it.log}}</span>
</div>
</el-card>
</div>
<el-card class="card-footer">
<el-button type="primary">分割</el-button>
<el-button>取消</el-button>
</el-card>
</div>
</template>
@ -122,6 +135,16 @@ const uploadForm=ref(ElForm)
const upForm=reactive({
name:''
})
const logList=reactive([{
date:'2024-05-06 18:34:36',log:'系统已启动编译'
},{date:'2024-05-06 18:34:36',log:'系统正在分割目标文件'},
{date:'2024-05-06 18:34:36',log:'运行时异常,系统编译已终止'}])
</script>
<style scoped lang='less'></style>
<style scoped lang='scss'>
.card-footer{
position: fixed;
width: calc(100% - 215px);
bottom: 0px;
}
</style>