update code
parent
dbb04d1515
commit
95acce43ad
|
|
@ -1,8 +1,9 @@
|
|||
import request from "@/utils/request";
|
||||
const list=(pageSize,pageIndex)=>{
|
||||
const list=(data)=>{
|
||||
return request({
|
||||
url: `/connections?page_num=${pageIndex}&page_size=${pageSize}`,
|
||||
method: "get"
|
||||
url: `/connections`,
|
||||
method: "get",
|
||||
params:data
|
||||
});
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -91,10 +91,10 @@ class MenuAPI {
|
|||
],
|
||||
},
|
||||
{
|
||||
path: "/protocol",
|
||||
path: "/connection",
|
||||
component: "Layout",
|
||||
redirect: "/protocol/index",
|
||||
name: "/protocol",
|
||||
redirect: "/connection/index",
|
||||
name: "/connection",
|
||||
meta: {
|
||||
title: "互联协议管理",
|
||||
icon: "web",
|
||||
|
|
@ -105,8 +105,8 @@ class MenuAPI {
|
|||
children: [
|
||||
{
|
||||
path: "index",
|
||||
component: "protocol/index",
|
||||
name: "protocolIndex",
|
||||
component: "connection/index",
|
||||
name: "connectionIndex",
|
||||
meta: {
|
||||
title: "互联协议",
|
||||
icon: "user",
|
||||
|
|
@ -118,8 +118,8 @@ class MenuAPI {
|
|||
},
|
||||
{
|
||||
path: "edit",
|
||||
component: "protocol/edit",
|
||||
name: "protocolEdit",
|
||||
component: "connection/edit",
|
||||
name: "connectionEdit",
|
||||
meta: {
|
||||
title: "互联协议修改",
|
||||
icon: "user",
|
||||
|
|
@ -131,8 +131,8 @@ class MenuAPI {
|
|||
},
|
||||
{
|
||||
path: "detail",
|
||||
component: "protocol/detail",
|
||||
name: "protocolDetail",
|
||||
component: "connection/detail",
|
||||
name: "connectionDetail",
|
||||
meta: {
|
||||
title: "互联协议详情",
|
||||
icon: "user",
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="app-container protocol-detail">
|
||||
<div class="app-container connection-detail">
|
||||
<el-card>
|
||||
<template #header>
|
||||
<svg-icon icon-class="pause" style="width:20px;height:20px;" />
|
||||
|
|
@ -8,37 +8,37 @@
|
|||
<tr>
|
||||
<td style="width: 50%;">
|
||||
<span class="sp-title">模型名称:</span>
|
||||
<span class="sp-text">目标分类模型</span>
|
||||
<span class="sp-text">{{ info.data.model_name }}</span>
|
||||
</td>
|
||||
<td style="width: 50%;">
|
||||
<span class="sp-title">模型版本:</span>
|
||||
<span class="sp-text">1.0</span>
|
||||
<span class="sp-text">{{ info.data.connection_version}}</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 50%;">
|
||||
<span class="sp-title">互联名称:</span>
|
||||
<span class="sp-text">我的互联名称</span>
|
||||
<span class="sp-text">{{ info.data.connection_name }}</span>
|
||||
</td>
|
||||
<td style="width: 50%;">
|
||||
<span class="sp-title">标签:</span>
|
||||
<span class="sp-text">标分类模型</span>
|
||||
<span class="sp-text">{{ info.data.connection_label }}</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 50%;">
|
||||
<span class="sp-title">创建用户:</span>
|
||||
<span class="sp-text">USER</span>
|
||||
<span class="sp-text">{{ info.data.user_name }}</span>
|
||||
</td>
|
||||
<td style="width: 50%;">
|
||||
<span class="sp-title">创建时间:</span>
|
||||
<span class="sp-text">2024-02-02 12:12:12</span>
|
||||
<span class="sp-text">{{ info.data.create_time }}</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 100%;" colspan="2">
|
||||
<span class="sp-title">互联说明:</span>
|
||||
<span class="sp-text">进行10种类型 的目标分类模型查看</span>
|
||||
<span class="sp-text">{{ info.data.connection_desc }}</span>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
|
@ -54,7 +54,7 @@
|
|||
<i-ep-setting/><span>互联设置</span>
|
||||
</div>
|
||||
<div class="div-chart">
|
||||
<detailFlow/>
|
||||
<detailFlow ref="operFlow" @nodeClick="doNodeClick"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item" style="margin-left: 100px;">
|
||||
|
|
@ -62,18 +62,20 @@
|
|||
<i-ep-document/><span>算子基本信息</span>
|
||||
</div>
|
||||
<div class="div-info">
|
||||
<template v-if="info.selNode">
|
||||
<div class="row">
|
||||
<span class="sp-label">算子名称:</span>
|
||||
<span class="sp-text">图像缩放</span>
|
||||
<span class="sp-text">{{ info.selNode.operator_name }}</span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<span class="sp-label">算子版本:</span>
|
||||
<span class="sp-text">1.0</span>
|
||||
<span class="sp-text">{{ info.selNode.operator_version }}</span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<span class="sp-label">算子说明:</span>
|
||||
<span class="sp-text">算子说明算子说明算子说明算子说明算子说明算子说明算子说明算子说明</span>
|
||||
<span class="sp-text">{{ info.selNode.operator_desc }}</span>
|
||||
</div>
|
||||
<!--
|
||||
<div class="row">
|
||||
<span class="sp-label">输入参数:</span>
|
||||
<span class="sp-text">
|
||||
|
|
@ -87,6 +89,14 @@
|
|||
<div>type:nearest</div>
|
||||
</span>
|
||||
</div>
|
||||
-->
|
||||
<div class="row">
|
||||
<span class="sp-label">参数:</span>
|
||||
<span class="sp-text">
|
||||
<span :key="it.key" style="display: block;" v-for="it in mapToArray(info.selNode.parameters)">{{ it.key }}:{{it.value }}</span>
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -99,15 +109,44 @@
|
|||
|
||||
<script lang='ts' setup>
|
||||
import detailFlow from './detailFlow.vue';
|
||||
import ConnApi from '@/api/connection'
|
||||
const router = useRouter();
|
||||
const doBack=()=>{
|
||||
router.replace({path:"/protocol/index"})
|
||||
}
|
||||
const route =useRoute()
|
||||
const info=reactive({
|
||||
data:{},
|
||||
selNode:null
|
||||
})
|
||||
const operFlow=ref();
|
||||
|
||||
const doBack=()=>{
|
||||
router.replace({path:"/connection/index"})
|
||||
}
|
||||
const mapToArray=obj=>{
|
||||
let arr=[];
|
||||
for(let k in obj){
|
||||
arr.push({
|
||||
key:k,value:obj[k]
|
||||
})
|
||||
};
|
||||
return arr;
|
||||
}
|
||||
const loadData=()=>{
|
||||
let id=route.query.id;
|
||||
ConnApi.detail(id).then(d=>{
|
||||
info.data=d.data?.data||{};
|
||||
operFlow.value.showFlow(info.data)
|
||||
});
|
||||
};
|
||||
const doNodeClick=(node)=>{
|
||||
info.selNode=node;
|
||||
}
|
||||
onMounted(() => {
|
||||
loadData();
|
||||
});
|
||||
|
||||
</script>
|
||||
<style scoped lang='scss'>
|
||||
.protocol-detail {
|
||||
.connection-detail {
|
||||
:deep(.el-card__header) {
|
||||
padding: 8px 4px;
|
||||
display: flex;
|
||||
|
|
@ -151,11 +190,11 @@ const doBack=()=>{
|
|||
}
|
||||
}
|
||||
|
||||
.tb-base-info {
|
||||
|
||||
line-height: 30px;
|
||||
|
||||
|
||||
.tb-base-info {
|
||||
line-height: 30px;
|
||||
:deep(span){
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.svg-icon) {
|
||||
|
|
@ -0,0 +1,184 @@
|
|||
<template>
|
||||
<div class="flow-demo1">
|
||||
<div ref="flow" class="viewport" id="flowMain" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import LogicFlow from '@logicflow/core';
|
||||
// 引入整体背景的样式
|
||||
import '@logicflow/core/dist/style/index.css';
|
||||
import { Menu } from "@logicflow/extension";
|
||||
import AiNodeExtension from '@/components/flow/index'
|
||||
import RegisteMenu from '@/components/flow/menu.js'
|
||||
|
||||
const themeApprove = {
|
||||
rect: { // 矩形样式
|
||||
radius: 8,
|
||||
stroke: '#3CB371'
|
||||
},
|
||||
circle: {
|
||||
r: 25,
|
||||
stroke: '#FF6347'
|
||||
},
|
||||
polygon: {
|
||||
stroke: '#6495ED',
|
||||
},
|
||||
polyline: {
|
||||
strokeWidth: 1,
|
||||
stroke: '#6495ED'
|
||||
},
|
||||
edgeText: {
|
||||
background: {
|
||||
fill: 'white',
|
||||
},
|
||||
},
|
||||
}
|
||||
const props = defineProps({
|
||||
operInfo: {
|
||||
type: Object,
|
||||
require: true,
|
||||
default: {}
|
||||
}
|
||||
})
|
||||
const info=reactive({
|
||||
nodes:[],
|
||||
opers:[],
|
||||
edges:[],
|
||||
})
|
||||
const emit = defineEmits(["nodeClick"]);
|
||||
const flow = ref()
|
||||
let lf = ref(null)
|
||||
const config = {
|
||||
stopScrollGraph: true,
|
||||
stopZoomGraph: true,
|
||||
isSilentMode: true,
|
||||
grid: {
|
||||
size: 10,
|
||||
visible: false,
|
||||
type: 'mesh',
|
||||
config: {
|
||||
color: '#DCDCDC',
|
||||
}
|
||||
},
|
||||
keyboard: { enabled: false },
|
||||
style: themeApprove,
|
||||
plugins: [AiNodeExtension, Menu]
|
||||
};
|
||||
const showFlow=(o)=>{
|
||||
info.opers=o.operator_list;
|
||||
info.edges=o.operator_edges;
|
||||
info.nodes=o.operator_nodes.map(it=>{
|
||||
let tmps=info.opers.filter(d=>d.operator_id==it.properties.node);
|
||||
if(tmps.length>0){
|
||||
it.text.value=tmps[0].operator_name;
|
||||
}
|
||||
return it;
|
||||
});
|
||||
|
||||
let data={nodes:info.nodes,edges:info.edges};
|
||||
lf.value.render(data)
|
||||
}
|
||||
defineExpose({
|
||||
showFlow
|
||||
})
|
||||
const initEvent=(lf)=>{
|
||||
lf.on("element:click",node=>{
|
||||
let nodeId=node.data.properties.node;
|
||||
let nd=null;
|
||||
if(nodeId){
|
||||
let tmps=info.opers.filter(d=>d.operator_id==nodeId);
|
||||
nd=tmps.length>0?tmps[0]:null;
|
||||
}
|
||||
emit("nodeClick",nd);
|
||||
});
|
||||
}
|
||||
onMounted(() => {
|
||||
const logicFlow = new LogicFlow({
|
||||
...config,
|
||||
container: flow.value
|
||||
})
|
||||
initEvent(logicFlow);
|
||||
lf.value = logicFlow
|
||||
window.lf = lf;
|
||||
/*
|
||||
const data = {
|
||||
"nodes": [
|
||||
{ "id": "node_1", "type": "ai-node",fill:'#409effaa',"x": 150, "y": 20, "properties": { "node": 1, "ui": "node-ai" }, "text": { "x": 160, "y": 20, "value": "图像缩放" } },
|
||||
{ "id": "node_2", "type": "ai-node",fill:'#3CB371', "x": 150, "y": 290, "properties": { "node": 2, "ui": "node-ai" }, "text": { "x": 160, "y": 290, "value": "目标绘图" } },
|
||||
{ "id": "node_3", fill:'#409effaa',"type": "ai-node", "x": 150, "y": 90, "properties": { "node": 3, "ui": "node-ai" }, "text": { "x": 160, "y": 90, "value": "RGB12图像格式转换" } },
|
||||
{ "id": "node_4",fill:'#ccccccaa', "type": "ai-node", "x": 150, "y": 150, "properties": { "node": 4, "ui": "node-ai" }, "text": { "x": 160, "y": 150, "value": "VIT推理算子1" } },
|
||||
{ "id": "node_5", fill:'#ccccccaa',"type": "ai-node", "x": 150, "y": 220, "properties": { "node": 5, "ui": "node-ai" }, "text": { "x": 160, "y": 220, "value": "VIT推理算子2" } }],
|
||||
"edges":
|
||||
[{ "id": "54555484-e393-4a43-8b51-1f407dd42c11", "type": "polyline", "sourceNodeId": "node_1", "targetNodeId": "node_3", "startPoint": { "x": 150, "y": 35 },
|
||||
"endPoint": { "x": 150, "y": 75 },
|
||||
"properties": {},
|
||||
"pointsList": [{ "x": 150, "y": 35 }, { "x": 150, "y": 65 }, { "x": 150, "y": 65 }, { "x": 150, "y": 45 }, { "x": 150, "y": 45 }, { "x": 150, "y": 75 }] },
|
||||
{ "id": "46e53f10-8997-42fc-9107-9e0083670ce8", "type": "polyline", "sourceNodeId": "node_3", "targetNodeId": "node_4",
|
||||
"startPoint": { "x": 150, "y": 105 }, "endPoint": { "x": 150, "y": 135 },
|
||||
"properties": {},
|
||||
"pointsList": [{ "x": 150, "y": 105 }, { "x": 150, "y": 135 }, { "x": 150, "y": 135 }, { "x": 150, "y": 105 }, { "x": 150, "y": 105 }, { "x": 150, "y": 135 }] },
|
||||
{ "id": "7d5407fa-01f5-457c-8504-f5f464dd254f", "type": "polyline", "sourceNodeId": "node_4", "targetNodeId": "node_5",
|
||||
"startPoint": { "x": 150, "y": 165 }, "endPoint": { "x": 150, "y": 205 },
|
||||
"properties": {},
|
||||
"pointsList": [{ "x": 150, "y": 165 }, { "x": 150, "y": 195 }, { "x": 150, "y": 195 }, { "x": 150, "y": 175 }, { "x": 150, "y": 175 }, { "x": 150, "y": 205 }] },
|
||||
{ "id": "4ece042b-faf1-4e95-8213-ee1c9b6060c5", "type": "polyline", "sourceNodeId": "node_5", "targetNodeId": "node_2",
|
||||
"startPoint": { "x": 150, "y": 235 }, "endPoint": { "x": 150, "y": 275 },
|
||||
"properties": {},
|
||||
"pointsList": [{ "x": 150, "y": 235 }, { "x": 150, "y": 265 }, { "x": 150, "y": 265 }, { "x": 150, "y": 245 }, { "x": 150, "y": 245 }, { "x": 150, "y": 275 }] }] }
|
||||
logicFlow.render(data)
|
||||
*/
|
||||
});
|
||||
</script>
|
||||
<style scoped lang='scss'>
|
||||
.flow-demo1 {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
padding: 20px 0px 10px;
|
||||
|
||||
.viewport {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-anchor {
|
||||
stroke: #999;
|
||||
stroke-width: 1;
|
||||
fill: #d9d9d9;
|
||||
cursor: crosshair;
|
||||
rx: 3;
|
||||
ry: 3;
|
||||
}
|
||||
|
||||
.custom-anchor:hover {
|
||||
fill: #ff7f0e;
|
||||
stroke: #ff7f0e;
|
||||
}
|
||||
|
||||
.flow-card {
|
||||
height: 80%;
|
||||
width: calc(100% - 450px);
|
||||
|
||||
.el-card__body {
|
||||
height: 100%;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
margin: 0px 12px;
|
||||
}
|
||||
|
||||
.node-panel {
|
||||
width: 240px;
|
||||
|
||||
.el-tabs__item {
|
||||
padding: 0px 10px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.card-prop {
|
||||
height: 300px;
|
||||
width: 200px;
|
||||
min-width: 200px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="app-container protocol-edit">
|
||||
<div class="app-container connection-edit">
|
||||
<el-card>
|
||||
<template #header>
|
||||
互联信息</template>
|
||||
|
|
@ -122,14 +122,14 @@ const doInitLf=(o:any)=>{
|
|||
lf.value=o.value
|
||||
}
|
||||
const doSave=()=>{
|
||||
router.replace({path:"/protocol/index"})
|
||||
router.replace({path:"/connection/index"})
|
||||
}
|
||||
const doCancel=()=>{
|
||||
router.replace({path:"/protocol/index"})
|
||||
router.replace({path:"/connection/index"})
|
||||
}
|
||||
</script>
|
||||
<style scoped lang='scss'>
|
||||
.protocol-edit{
|
||||
.connection-edit{
|
||||
:deep(.el-card__header) {
|
||||
padding: 8px 12px;
|
||||
display: flex;
|
||||
|
|
@ -3,8 +3,8 @@
|
|||
<div class="app-container">
|
||||
<div class="search-container">
|
||||
<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: 250px"
|
||||
<el-form-item label="" prop="connection_name">
|
||||
<el-input v-model="queryParams.connection_name" placeholder="请输入互联名将，标签，模型名称" clearable style="width: 250px"
|
||||
@keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
|
|
@ -18,28 +18,30 @@
|
|||
|
||||
<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" />
|
||||
<el-table-column label="网络名称" align="left" prop="netName" width="120"/>
|
||||
<el-table-column label="模型类型" align="left" prop="modelType" />
|
||||
<el-table-column label="版本" align="left" prop="ver" />
|
||||
<el-table-column label="互联名称" align="left" prop="netName" width="120"/>
|
||||
<el-table-column label="互联说明" 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="状态" width="100" align="left" prop="state">
|
||||
<el-table v-loading="loading" :data="info.data" stripe @selection-change="handleSelectionChange">
|
||||
<el-table-column label="模型名称" align="left" prop="model_name" />
|
||||
<el-table-column label="网络名称" align="left" prop="modl_net_type" width="120"/>
|
||||
<el-table-column label="模型类型" align="left" prop="modl_main_type_name">
|
||||
<template #default="{row}">{{ row.modl_main_type_name }}/{{row.modl_sub_type_name }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="版本" align="left" prop="connection_version" />
|
||||
<el-table-column label="互联名称" align="left" prop="connection_name" width="120"/>
|
||||
<el-table-column label="互联说明" align="left" prop="connection_desc" />
|
||||
<el-table-column label="互联创建时间" width="120" align="left" prop="create_time" />
|
||||
<el-table-column label="创建用户" width="100" align="left" prop="user_name" />
|
||||
<el-table-column label="状态" width="100" align="left" prop="connection_created">
|
||||
<template #default="scope">
|
||||
<el-button type="success" size="small" v-if="scope.row.state==1">已互联</el-button>
|
||||
<el-button type="success" size="small" v-if="scope.row.connection_created">已互联</el-button>
|
||||
<el-button type="info" size="small" v-else plain>未互联</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right" align="center" width="270">
|
||||
<template #default="scope">
|
||||
<template v-if="scope.row.state==1">
|
||||
<template v-if="scope.row.connection_created">
|
||||
<el-button text type="primary" size="small"
|
||||
@click="doShowDetail(scope.row)"><i-ep-edit />查看</el-button>
|
||||
<el-button text type="primary" size="small"
|
||||
@click="doEdit('user-form', scope.row.id)"><i-ep-link/>修改互联</el-button>
|
||||
@click="doEdit(scope.row.connection_id)"><i-ep-link/>修改互联</el-button>
|
||||
<el-button text type="primary" size="small" @click="handleDelete(scope.row)"><i-ep-delete />删除</el-button>
|
||||
</template>
|
||||
<template v-else>
|
||||
|
|
@ -51,8 +53,8 @@
|
|||
</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" />
|
||||
<pagination v-if="info.total > 0" v-model:total="info.total" v-model:page="queryParams.page_num"
|
||||
v-model:limit="queryParams.page_size" @pagination="handleQuery" />
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -60,19 +62,24 @@
|
|||
<script setup lang="ts">
|
||||
|
||||
import { UserQuery } from "@/api/user/model";
|
||||
import ConnApi from '@/api/connection'
|
||||
|
||||
const queryFormRef = ref(ElForm); // 查询表单
|
||||
const router = useRouter();
|
||||
|
||||
const loading = ref(false); // 加载状态
|
||||
const removeIds = ref([]); // 删除用户ID集合 用于批量删除
|
||||
const queryParams = reactive<UserQuery>({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
const queryParams = reactive<any>({
|
||||
page_num: 1,
|
||||
page_size: 10,
|
||||
connection_name:''
|
||||
});
|
||||
const dateTimeRange = ref("");
|
||||
const total = ref(100); // 数据总数
|
||||
|
||||
const info=reactive({
|
||||
total:0,
|
||||
data:[]
|
||||
})
|
||||
watch(dateTimeRange, (newVal) => {
|
||||
if (newVal) {
|
||||
queryParams.startTime = newVal[0];
|
||||
|
|
@ -80,74 +87,14 @@ watch(dateTimeRange, (newVal) => {
|
|||
}
|
||||
});
|
||||
|
||||
const tableData = [
|
||||
{
|
||||
id:"1",
|
||||
name: "模型名称模型名称模型名称查看",
|
||||
netName: "VIT",
|
||||
modelType: "图像分类",
|
||||
ver: "1.0",
|
||||
netName:'我的互联名称',
|
||||
desc:'进行10种类型 的目标分类模型查看',
|
||||
upTime: "2024-02-02",
|
||||
upUser:'USER',
|
||||
state:'1'
|
||||
},
|
||||
{
|
||||
id:"2",
|
||||
name: "模型名称模型名称模型名称查看",
|
||||
netName: "Mobile-VIT",
|
||||
modelType: "图像分类",
|
||||
ver: "1.0",
|
||||
netName:'我的互联名称',
|
||||
desc:'进行10种类型 的目标分类模型查看',
|
||||
upTime: "2024-02-02",
|
||||
upUser:'USER' ,
|
||||
state:'1'
|
||||
},
|
||||
{
|
||||
id:"3",
|
||||
name: "模型名称模型名称模型名称查看",
|
||||
netName: "VIT",
|
||||
modelType: "图像分类",
|
||||
ver: "1.0",
|
||||
netName:'我的互联名称',
|
||||
desc:'进行人员检测的模型',
|
||||
upTime: "2024-02-02",
|
||||
upUser:'USER' ,
|
||||
state:'1'
|
||||
},
|
||||
{
|
||||
id:"4",
|
||||
name: "模型名称模型名称模型名称查看",
|
||||
netName: "Mobile-VIT",
|
||||
modelType: "图像分类",
|
||||
ver: "1.0",
|
||||
netName:'我的互联名称',
|
||||
desc:'进行10种类型 的目标分类模型查看',
|
||||
upTime: "2024-02-02",
|
||||
upUser:'USER' ,
|
||||
state:'0'
|
||||
},
|
||||
{
|
||||
id:"5",
|
||||
name: "模型名称模型名称模型名称查看",
|
||||
netName: "VIT",
|
||||
modelType: "图像分类",
|
||||
ver: "1.0",
|
||||
netName:'我的互联名称',
|
||||
desc:'进行人员检测的模型',
|
||||
upTime: "2024-02-02",
|
||||
upUser:'USER' ,
|
||||
state:'0'
|
||||
}
|
||||
];
|
||||
|
||||
/** 查询 */
|
||||
function handleQuery() {
|
||||
loading.value = true;
|
||||
ElMessage.success("查询成功");
|
||||
loading.value = false;
|
||||
ConnApi.list(queryParams).then(d=>{
|
||||
loading.value = false;
|
||||
info.total=d.data?.total||0;
|
||||
info.data=d.data?.data||[];
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
|
@ -173,30 +120,34 @@ function handleSelectionChange(selection: any) {
|
|||
|
||||
/** 删除数据 */
|
||||
function handleDelete(row: { [key: string]: any }) {
|
||||
ElMessageBox.confirm("确认删除算子?", "警告", {
|
||||
ElMessageBox.confirm("确认删除互联?", "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then(function () {
|
||||
ElMessage.success("删除成功");
|
||||
ConnApi.deleteConnect(row.connection_id).then(d=>{
|
||||
if(d.data.code==0){
|
||||
ElMessage.success("删除互联成功");
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
const doShowDetail=(row:any)=>{
|
||||
router.replace({path:"/protocol/detail",query:{id:row.id}})
|
||||
router.replace({path:"/connection/detail",query:{id:row.connection_id}})
|
||||
}
|
||||
|
||||
const doEdit=(row:any)=>{
|
||||
router.replace({path:"/protocol/edit",query:{id:row.id,type:'edit'}})
|
||||
router.replace({path:"/connection/edit",query:{id:row.connection_id,type:'edit'}})
|
||||
}
|
||||
|
||||
const doAdd=(row:any)=>{
|
||||
router.replace({path:"/protocol/edit",query:{id:row.id,type:'add'}})
|
||||
router.replace({path:"/connection/edit",query:{id:row.connection_id,type:'add'}})
|
||||
}
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
//handleQuery();
|
||||
handleQuery();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
@ -60,7 +60,7 @@
|
|||
<span>{{ it.memory_usage}}MB</span>
|
||||
</div>
|
||||
<div class="chart-line">
|
||||
<div class="chart-line-inline" :style="'width:' + (it.memory_usage/64/1024.0) + '%'"></div>
|
||||
<div class="chart-line-inline" :style="'width:' + (it.memory_usage*100.0/it.memory_total) + '%'"></div>
|
||||
</div>
|
||||
|
||||
<div class="chart-item-title">
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@
|
|||
<el-button text type="primary" size="small"
|
||||
@click="doShowModelDetail(scope.row)"><i-ep-edit />查看</el-button>
|
||||
<el-button text type="primary" size="small"
|
||||
@click="doProtocol()"><i-ep-link/>互联</el-button>
|
||||
@click="doconnection()"><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>
|
||||
|
|
@ -89,8 +89,8 @@ function handleQuery() {
|
|||
const doUploadModel=()=>{
|
||||
router.replace({ path: "/modelMgr/uploadModel" });
|
||||
}
|
||||
function doProtocol(){
|
||||
router.replace({ path: "/protocol/index" });
|
||||
function doconnection(){
|
||||
router.replace({ path: "/connection/index" });
|
||||
}
|
||||
|
||||
/** 重置查询 */
|
||||
|
|
|
|||
|
|
@ -131,6 +131,7 @@
|
|||
|
||||
<script setup>
|
||||
import ConstApi from '@/api/const'
|
||||
import ModelApi from '@/api/models'
|
||||
import request from "axios";
|
||||
const router = useRouter();
|
||||
let listOpt = reactive({
|
||||
|
|
@ -145,8 +146,13 @@ let fileList=ref([])
|
|||
const doSave = () => {
|
||||
uploadForm.value?.validate((valid) => {
|
||||
if (valid) {
|
||||
debugger
|
||||
router.replace({ path: "/modelMgr/index" })
|
||||
ModelApi.add(upForm).then(d=>{
|
||||
if(d.data.code==0){
|
||||
ElMessage.success("增加模型成功!");
|
||||
router.replace({ path: "/modelMgr/index" })
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -1,123 +0,0 @@
|
|||
<template>
|
||||
<div class="flow-demo1">
|
||||
<div ref="flow" class="viewport" id="flowMain" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang='ts' setup>
|
||||
import LogicFlow from '@logicflow/core';
|
||||
// 引入整体背景的样式
|
||||
import '@logicflow/core/dist/style/index.css';
|
||||
import { Menu } from "@logicflow/extension";
|
||||
import AiNodeExtension from '@/components/flow/index'
|
||||
import RegisteMenu from '@/components/flow/menu.js'
|
||||
const themeApprove = {
|
||||
rect: { // 矩形样式
|
||||
radius: 8,
|
||||
stroke: '#3CB371'
|
||||
},
|
||||
circle: {
|
||||
r: 25,
|
||||
stroke: '#FF6347'
|
||||
},
|
||||
polygon: {
|
||||
stroke: '#6495ED',
|
||||
},
|
||||
polyline: {
|
||||
strokeWidth: 1,
|
||||
stroke: '#6495ED'
|
||||
},
|
||||
edgeText: {
|
||||
background: {
|
||||
fill: 'white',
|
||||
},
|
||||
},
|
||||
}
|
||||
const flow = ref()
|
||||
let lf = ref(null)
|
||||
const config = {
|
||||
stopScrollGraph: true,
|
||||
stopZoomGraph: true,
|
||||
isSilentMode: true,
|
||||
grid: {
|
||||
size: 10,
|
||||
visible: false,
|
||||
type: 'mesh',
|
||||
config: {
|
||||
color: '#DCDCDC',
|
||||
}
|
||||
},
|
||||
keyboard: { enabled: false },
|
||||
style: themeApprove,
|
||||
plugins: [AiNodeExtension, Menu]
|
||||
};
|
||||
onMounted(() => {
|
||||
const logicFlow = new LogicFlow({
|
||||
...config,
|
||||
container: flow.value
|
||||
})
|
||||
lf.value = logicFlow
|
||||
window.lf = lf;
|
||||
const data = { "nodes": [{ "id": "node_1", "type": "ai-node",
|
||||
fill:'#409effaa',
|
||||
"x": 150, "y": 20, "properties": { "node": 201, "ui": "node-ai" },
|
||||
"text": { "x": 160, "y": 20, "value": "图像缩放" } },
|
||||
{ "id": "node_2", "type": "ai-node",fill:'#3CB371', "x": 150, "y": 290, "properties": { "node": 900, "ui": "node-ai" }, "text": { "x": 160, "y": 290, "value": "目标绘图" } },
|
||||
{ "id": "a758b24e-6a3f-4652-b7ea-4b844bf5d44a", fill:'#409effaa',"type": "ai-node", "x": 150, "y": 90, "properties": { "node": 202, "ui": "node-ai" }, "text": { "x": 160, "y": 90, "value": "RGB12图像格式转换" } },
|
||||
{ "id": "ea1ec036-7fe4-4e2d-8e17-1840647c6cb3",fill:'#ccccccaa', "type": "ai-node", "x": 150, "y": 150, "properties": { "node": 301, "ui": "node-ai" }, "text": { "x": 160, "y": 150, "value": "VIT推理算子1" } },
|
||||
{ "id": "3a03b42c-bc46-4eab-aac6-e2f2b9c83736", fill:'#ccccccaa',"type": "ai-node", "x": 150, "y": 220, "properties": { "node": 302, "ui": "node-ai" }, "text": { "x": 160, "y": 220, "value": "VIT推理算子2" } }], "edges": [{ "id": "54555484-e393-4a43-8b51-1f407dd42c11", "type": "polyline", "sourceNodeId": "node_1", "targetNodeId": "a758b24e-6a3f-4652-b7ea-4b844bf5d44a", "startPoint": { "x": 150, "y": 35 }, "endPoint": { "x": 150, "y": 75 }, "properties": {}, "pointsList": [{ "x": 150, "y": 35 }, { "x": 150, "y": 65 }, { "x": 150, "y": 65 }, { "x": 150, "y": 45 }, { "x": 150, "y": 45 }, { "x": 150, "y": 75 }] }, { "id": "46e53f10-8997-42fc-9107-9e0083670ce8", "type": "polyline", "sourceNodeId": "a758b24e-6a3f-4652-b7ea-4b844bf5d44a", "targetNodeId": "ea1ec036-7fe4-4e2d-8e17-1840647c6cb3", "startPoint": { "x": 150, "y": 105 }, "endPoint": { "x": 150, "y": 135 }, "properties": {}, "pointsList": [{ "x": 150, "y": 105 }, { "x": 150, "y": 135 }, { "x": 150, "y": 135 }, { "x": 150, "y": 105 }, { "x": 150, "y": 105 }, { "x": 150, "y": 135 }] }, { "id": "7d5407fa-01f5-457c-8504-f5f464dd254f", "type": "polyline", "sourceNodeId": "ea1ec036-7fe4-4e2d-8e17-1840647c6cb3", "targetNodeId": "3a03b42c-bc46-4eab-aac6-e2f2b9c83736", "startPoint": { "x": 150, "y": 165 }, "endPoint": { "x": 150, "y": 205 }, "properties": {}, "pointsList": [{ "x": 150, "y": 165 }, { "x": 150, "y": 195 }, { "x": 150, "y": 195 }, { "x": 150, "y": 175 }, { "x": 150, "y": 175 }, { "x": 150, "y": 205 }] }, { "id": "4ece042b-faf1-4e95-8213-ee1c9b6060c5", "type": "polyline", "sourceNodeId": "3a03b42c-bc46-4eab-aac6-e2f2b9c83736", "targetNodeId": "node_2", "startPoint": { "x": 150, "y": 235 }, "endPoint": { "x": 150, "y": 275 }, "properties": {}, "pointsList": [{ "x": 150, "y": 235 }, { "x": 150, "y": 265 }, { "x": 150, "y": 265 }, { "x": 150, "y": 245 }, { "x": 150, "y": 245 }, { "x": 150, "y": 275 }] }] }
|
||||
logicFlow.render(data)
|
||||
});
|
||||
</script>
|
||||
<style scoped lang='scss'>
|
||||
.flow-demo1 {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
padding: 20px 0px 10px;
|
||||
|
||||
.viewport {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.custom-anchor {
|
||||
stroke: #999;
|
||||
stroke-width: 1;
|
||||
fill: #d9d9d9;
|
||||
cursor: crosshair;
|
||||
rx: 3;
|
||||
ry: 3;
|
||||
}
|
||||
|
||||
.custom-anchor:hover {
|
||||
fill: #ff7f0e;
|
||||
stroke: #ff7f0e;
|
||||
}
|
||||
|
||||
.flow-card {
|
||||
height: 80%;
|
||||
width: calc(100% - 450px);
|
||||
|
||||
.el-card__body {
|
||||
height: 100%;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
margin: 0px 12px;
|
||||
}
|
||||
|
||||
.node-panel {
|
||||
width: 240px;
|
||||
|
||||
.el-tabs__item {
|
||||
padding: 0px 10px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.card-prop {
|
||||
height: 300px;
|
||||
width: 200px;
|
||||
min-width: 200px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -174,7 +174,7 @@ const doEdit=(row:any)=>{
|
|||
}
|
||||
|
||||
const doAdd=(row:any)=>{
|
||||
router.replace({path:"/protocol/edit",query:{id:row.id,type:'add'}})
|
||||
router.replace({path:"/connection/edit",query:{id:row.id,type:'add'}})
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue