修改交大AI
parent
d0a6b21456
commit
f5b2049ba1
Binary file not shown.
After Width: | Height: | Size: 289 KiB |
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="model-flow">
|
<div class="model-flow">
|
||||||
<el-row class="row-1">
|
<el-row class="row-1">
|
||||||
<div class="card-item">
|
<div class="card-item" @click="toUrl('#/modelMgr/uploadModel')">
|
||||||
<div class="title-text">算法上传</div>
|
<div class="title-text">算法上传</div>
|
||||||
<el-badge :value="0" class="item">
|
<el-badge :value="0" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
|
@ -11,7 +11,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="line line-right">
|
<div class="line line-right">
|
||||||
</div>
|
</div>
|
||||||
<div class="card-item ">
|
<div class="card-item " @click="toUrl('#/connection/index')">
|
||||||
<div class="title-text">算子互联</div>
|
<div class="title-text">算子互联</div>
|
||||||
<el-badge :value="0" class="item">
|
<el-badge :value="0" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
|
@ -24,7 +24,7 @@
|
||||||
<div class="line line-right">
|
<div class="line line-right">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="card-item" :class="info.cnt1 > 0 ? 'is-active' : ''">
|
<div class="card-item" :class="info.cnt1 > 0 ? 'is-active' : ''" @click="toUrl('#/simulationEvaluation/addTask')">
|
||||||
<div class="title-text">编译部署</div>
|
<div class="title-text">编译部署</div>
|
||||||
<el-badge :value="info.cnt1" class="item">
|
<el-badge :value="info.cnt1" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
|
@ -34,7 +34,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="line line-right">
|
<div class="line line-right">
|
||||||
</div>
|
</div>
|
||||||
<div class="card-item" :class="info.cnt2 > 0 ? 'is-active' : ''">
|
<div class="card-item" :class="info.cnt2 > 0 ? 'is-active' : ''" @click="toUrl('#/simulationEvaluation/addTask')">
|
||||||
<div class="title-text">推理评估</div>
|
<div class="title-text">推理评估</div>
|
||||||
<el-badge :value="info.cnt2" class="item">
|
<el-badge :value="info.cnt2" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
|
@ -46,7 +46,8 @@
|
||||||
<div class="line line-right">
|
<div class="line line-right">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="card-item" :class="info.cnt3 > 0 ? 'is-active' : ''">
|
<div class="card-item" :class="info.cnt3 > 0 ? 'is-active' : ''"
|
||||||
|
@click="toUrl('#/simulationEvaluation/reportList')">
|
||||||
<div class="title-text">评估报告</div>
|
<div class="title-text">评估报告</div>
|
||||||
<el-badge :value="info.cnt3" class="item">
|
<el-badge :value="info.cnt3" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
|
@ -58,7 +59,7 @@
|
||||||
</el-row>
|
</el-row>
|
||||||
<el-row class="row-3">
|
<el-row class="row-3">
|
||||||
|
|
||||||
<div class="card-item line-top">
|
<div class="card-item line-top" @click="toUrl('#/operatorLibrary/calculate')">
|
||||||
<el-badge :value="0" class="item">
|
<el-badge :value="0" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
<img class="img-120" src="./flow/szgl.png" />
|
<img class="img-120" src="./flow/szgl.png" />
|
||||||
|
@ -73,7 +74,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
<div class="card-item card-center">
|
<div class="card-item card-center">
|
||||||
<div class="card-center-item">
|
<div class="card-center-item" @click="toUrl('#/tester/equipment')">
|
||||||
<el-badge :value="0" class="item">
|
<el-badge :value="0" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
<img class="img-120" src="./flow/sbgl.png" />
|
<img class="img-120" src="./flow/sbgl.png" />
|
||||||
|
@ -81,7 +82,7 @@
|
||||||
</el-badge>
|
</el-badge>
|
||||||
<div class="title-text">设备管理</div>
|
<div class="title-text">设备管理</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-center-item">
|
<div class="card-center-item" @click="toUrl('#/tester/otherTool')">
|
||||||
<el-badge :value="0" class="item">
|
<el-badge :value="0" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
<img class="img-120" src="./flow/gjgl.png" />
|
<img class="img-120" src="./flow/gjgl.png" />
|
||||||
|
@ -91,9 +92,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
<div class="card-item"></div>
|
<div class="card-item line-top" @click="toUrl('#/dataMgr/datas')">
|
||||||
<div class="line"></div>
|
|
||||||
<div class="card-item line-top">
|
|
||||||
<el-badge :value="0" class="item">
|
<el-badge :value="0" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
<img class="img-120" src="./flow/sjjgl.png" />
|
<img class="img-120" src="./flow/sjjgl.png" />
|
||||||
|
@ -102,6 +101,9 @@
|
||||||
<div class="title-text">数据管理</div>
|
<div class="title-text">数据管理</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="line"></div>
|
||||||
|
|
||||||
|
<div class="card-item"></div>
|
||||||
|
|
||||||
|
|
||||||
</el-row>
|
</el-row>
|
||||||
|
@ -127,8 +129,19 @@ const loadData = () => {
|
||||||
info.cnt3 = findCnt("model_report");
|
info.cnt3 = findCnt("model_report");
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
function toUrl(url) {
|
||||||
|
location.href = url;
|
||||||
|
}
|
||||||
|
onUnmounted(() => {
|
||||||
|
if (window.modelFlowTimer) {
|
||||||
|
clearInterval(window.modelFlowTimer);
|
||||||
|
}
|
||||||
|
});
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
loadData();
|
loadData();
|
||||||
|
window.modelFlowTimer = setInterval(() => {
|
||||||
|
loadData();
|
||||||
|
}, 3000);
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<style lang='scss'>
|
<style lang='scss'>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="model-flow2" style="margin-left: 40px;">
|
<div class="model-flow2" style="margin-left: 40px;">
|
||||||
<el-row class="row-1">
|
<el-row class="row-1">
|
||||||
<div class="card-item" :class="info.cnt1 > 0 ? 'is-active' : ''">
|
<div class="card-item" :class="info.cnt1 > 0 ? 'is-active' : ''" @click="toUrl('#/simulationEvaluation/addTask')">
|
||||||
<div class="title-text">编译部署</div>
|
<div class="title-text">编译部署</div>
|
||||||
<el-badge :value="info.cnt1" class="item">
|
<el-badge :value="info.cnt1" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
|
@ -11,7 +11,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="line line-right">
|
<div class="line line-right">
|
||||||
</div>
|
</div>
|
||||||
<div class="card-item" :class="info.cnt2 > 0 ? 'is-active' : ''">
|
<div class="card-item" :class="info.cnt2 > 0 ? 'is-active' : ''" @click="toUrl('#/simulationEvaluation/addTask')">
|
||||||
<div class="title-text">推理评估</div>
|
<div class="title-text">推理评估</div>
|
||||||
<el-badge :value="info.cnt2" class="item">
|
<el-badge :value="info.cnt2" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
|
@ -23,7 +23,8 @@
|
||||||
<div class="line line-right">
|
<div class="line line-right">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="card-item" :class="info.cnt3 > 0 ? 'is-active' : ''">
|
<div class="card-item" :class="info.cnt3 > 0 ? 'is-active' : ''"
|
||||||
|
@click="toUrl('#/simulationEvaluation/reportList')">
|
||||||
<div class="title-text">评估报告</div>
|
<div class="title-text">评估报告</div>
|
||||||
<el-badge :value="info.cnt3" class="item">
|
<el-badge :value="info.cnt3" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
|
@ -35,7 +36,7 @@
|
||||||
</el-row>
|
</el-row>
|
||||||
<el-row class="row-3">
|
<el-row class="row-3">
|
||||||
<div class="card-item card-center">
|
<div class="card-item card-center">
|
||||||
<div class="card-center-item">
|
<div class="card-center-item" @click="toUrl('#/tester/equipment')">
|
||||||
<el-badge :value="0" class="item">
|
<el-badge :value="0" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
<img class="img-120" src="./flow/sbgl.png" />
|
<img class="img-120" src="./flow/sbgl.png" />
|
||||||
|
@ -43,7 +44,7 @@
|
||||||
</el-badge>
|
</el-badge>
|
||||||
<div class="title-text">设备管理</div>
|
<div class="title-text">设备管理</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="card-center-item">
|
<div class="card-center-item" @click="toUrl('#/tester/otherTool')">
|
||||||
<el-badge :value="0" class="item">
|
<el-badge :value="0" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
<img class="img-120" src="./flow/gjgl.png" />
|
<img class="img-120" src="./flow/gjgl.png" />
|
||||||
|
@ -53,9 +54,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
<div class="card-item"></div>
|
<div class="card-item line-top" @click="toUrl('#/dataMgr/datas')">
|
||||||
<div class="line"></div>
|
|
||||||
<div class="card-item line-top">
|
|
||||||
<el-badge :value="0" class="item">
|
<el-badge :value="0" class="item">
|
||||||
<div class="div-img">
|
<div class="div-img">
|
||||||
<img class="img-120" src="./flow/sjjgl.png" />
|
<img class="img-120" src="./flow/sjjgl.png" />
|
||||||
|
@ -65,6 +64,9 @@
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="line"></div>
|
||||||
|
|
||||||
|
<div class="card-item"></div>
|
||||||
|
|
||||||
</el-row>
|
</el-row>
|
||||||
</div>
|
</div>
|
||||||
|
@ -77,6 +79,9 @@ let info = reactive({
|
||||||
cnt2: 0,
|
cnt2: 0,
|
||||||
cnt3: 0
|
cnt3: 0
|
||||||
})
|
})
|
||||||
|
function toUrl(url) {
|
||||||
|
location.href = url;
|
||||||
|
}
|
||||||
const loadData = () => {
|
const loadData = () => {
|
||||||
LogApi.userRunning().then(d => {
|
LogApi.userRunning().then(d => {
|
||||||
let tmps = d.data?.data?.running_operation_list || [];
|
let tmps = d.data?.data?.running_operation_list || [];
|
||||||
|
@ -89,8 +94,16 @@ const loadData = () => {
|
||||||
info.cnt3 = findCnt("model_report");
|
info.cnt3 = findCnt("model_report");
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
onUnmounted(() => {
|
||||||
|
if (window.modelFlow2Timer) {
|
||||||
|
clearInterval(window.modelFlow2Timer);
|
||||||
|
}
|
||||||
|
});
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
loadData();
|
loadData();
|
||||||
|
window.modelFlow2Timer = setInterval(() => {
|
||||||
|
loadData();
|
||||||
|
}, 3000);
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<style lang='scss'>
|
<style lang='scss'>
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="service-status">
|
<div class="service-status">
|
||||||
<div class="sv-chart" >
|
<div class="sv-chart">
|
||||||
<div :id="id" :class="className" :style="{ height, width }">
|
<div :id="id" :class="className" :style="{ height, width }">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -9,33 +9,34 @@
|
||||||
<div class="chart-bar">
|
<div class="chart-bar">
|
||||||
<div class="bar-title">内存</div>
|
<div class="bar-title">内存</div>
|
||||||
<div class="chart-line">
|
<div class="chart-line">
|
||||||
<div class="chart-line-inner" :style="'width:'+serverInfo.memory_usage*100.0/serverInfo.memory_total+'%'"></div>
|
<div class="chart-line-inner"
|
||||||
|
:style="'width:' + serverInfo.memory_usage * 100.0 / serverInfo.memory_total + '%'"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="bar-title">{{serverInfo.memory_usage*100.0/serverInfo.memory_total}}%</div>
|
<div class="bar-title">{{ serverInfo.memory_usage * 100.0 / serverInfo.memory_total }}%</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="chart-bar">
|
<div class="chart-bar">
|
||||||
<div class="bar-title">CPU</div>
|
<div class="bar-title">CPU</div>
|
||||||
<div class="chart-line">
|
<div class="chart-line">
|
||||||
<div class="chart-line-inner" :style="'width:'+serverInfo.cpu_usage+'%'"></div>
|
<div class="chart-line-inner" :style="'width:' + serverInfo.cpu_usage + '%'"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="bar-title"> {{serverInfo.cpu_usage}}% </div>
|
<div class="bar-title"> {{ serverInfo.cpu_usage }}% </div>
|
||||||
</div>
|
</div>
|
||||||
<div class="chart-bar">
|
<div class="chart-bar">
|
||||||
<div class="bar-title">硬盘</div>
|
<div class="bar-title">硬盘</div>
|
||||||
<div class="chart-line">
|
<div class="chart-line">
|
||||||
<div class="chart-line-inner" :style="'width:'+serverInfo.storage_usage+'%'"></div>
|
<div class="chart-line-inner" :style="'width:' + serverInfo.storage_usage + '%'"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="bar-title">{{serverInfo.storage_usage}}%</div>
|
<div class="bar-title">{{ serverInfo.storage_usage }}%</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang='ts' setup>
|
<script setup>
|
||||||
import * as echarts from "echarts";
|
import * as echarts from "echarts";
|
||||||
import LogApi from '@/api/log'
|
import LogApi from '@/api/log'
|
||||||
let tempurature=ref<any>(0);
|
let tempurature = ref(0);
|
||||||
let serverInfo=ref<any>(null);
|
let serverInfo = ref(null);
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
id: {
|
id: {
|
||||||
type: String,
|
type: String,
|
||||||
|
@ -57,7 +58,7 @@ const props = defineProps({
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
let options = reactive( {
|
let options = reactive({
|
||||||
grid: {
|
grid: {
|
||||||
left: "20%",
|
left: "20%",
|
||||||
right: "20%",
|
right: "20%",
|
||||||
|
@ -134,19 +135,24 @@ let options = reactive( {
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
const loadLog=()=>{
|
const loadLog = () => {
|
||||||
LogApi.serverState().then(d=>{
|
LogApi.serverState().then(d => {
|
||||||
serverInfo.value=d.data.data
|
serverInfo.value = d.data.data
|
||||||
tempurature.value=serverInfo.value.tempurature/10.0;
|
tempurature.value = serverInfo.value.tempurature / 10.0;
|
||||||
options.series[0].data[0].value=tempurature.value;
|
options.series[0].data[0].value = tempurature.value;
|
||||||
chart.value.setOption(options);
|
chart.value.setOption(options);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
const chart = ref<any>("");
|
const chart = ref("");
|
||||||
|
onUnmounted(() => {
|
||||||
|
if (window.serviceStatusTimer) {
|
||||||
|
window.clearInterval(window.serviceStatusTimer);
|
||||||
|
}
|
||||||
|
});
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// 图表初始化
|
// 图表初始化
|
||||||
chart.value = markRaw(
|
chart.value = markRaw(
|
||||||
echarts.init(document.getElementById(props.id) as HTMLDivElement)
|
echarts.init(document.getElementById(props.id))
|
||||||
);
|
);
|
||||||
|
|
||||||
chart.value.setOption(options);
|
chart.value.setOption(options);
|
||||||
|
@ -156,6 +162,9 @@ onMounted(() => {
|
||||||
chart.value.resize();
|
chart.value.resize();
|
||||||
});
|
});
|
||||||
loadLog();
|
loadLog();
|
||||||
|
window.serviceStatusTimer = setInterval(() => {
|
||||||
|
loadLog();
|
||||||
|
}, 3000);
|
||||||
});
|
});
|
||||||
|
|
||||||
onActivated(() => {
|
onActivated(() => {
|
||||||
|
@ -188,7 +197,8 @@ onActivated(() => {
|
||||||
.chart-bars {
|
.chart-bars {
|
||||||
position: relative;
|
position: relative;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
top:-30px;
|
top: -30px;
|
||||||
|
|
||||||
.chart-bar {
|
.chart-bar {
|
||||||
display: flex;
|
display: flex;
|
||||||
padding: 0px 15%;
|
padding: 0px 15%;
|
||||||
|
|
|
@ -74,7 +74,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="dev-row3">
|
<div class="dev-row3">
|
||||||
<div class="device-state">
|
<div class="device-state">
|
||||||
|
<img :src="'images/loading-icon.gif'" v-if="it.working_state == 'infer'" class="img-loading">
|
||||||
<img style="position: relative;top: -10px;left:-10px;"
|
<img style="position: relative;top: -10px;left:-10px;"
|
||||||
:src="'images/state/' + it.working_state + '.png'" />
|
:src="'images/state/' + it.working_state + '.png'" />
|
||||||
<div
|
<div
|
||||||
|
@ -119,7 +119,7 @@
|
||||||
<el-card shadow="never" class="proc-card model-proc">
|
<el-card shadow="never" class="proc-card model-proc">
|
||||||
<template #header>
|
<template #header>
|
||||||
<div class="row2-top">
|
<div class="row2-top">
|
||||||
<div style="color:#333;font-weight: bold;font-size:15px;">模型仿真评估流程</div>
|
<div style="color:#333;font-weight: bold;font-size:15px;">模型评估流程</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<ModelFlow2 v-if="isV2" />
|
<ModelFlow2 v-if="isV2" />
|
||||||
|
@ -211,41 +211,64 @@ const loadDevice = () => {
|
||||||
const loadInfo = () => {
|
const loadInfo = () => {
|
||||||
InfoApi.statistics().then(res => {
|
InfoApi.statistics().then(res => {
|
||||||
let d = res.data
|
let d = res.data
|
||||||
let isDark=settingsStore.theme === ThemeEnum.DARK
|
let isDark = settingsStore.theme === ThemeEnum.DARK
|
||||||
topInfos.value = [
|
topInfos.value = [
|
||||||
{ title: '模型总数', count: d.data.total_model_count, ucnt: d.data.user_model_count, clsName: 'c1',
|
{
|
||||||
icon: isDark?"images/nav/nav12.png": "images/nav/nav1.png" },
|
title: '模型总数', count: d.data.total_model_count, ucnt: d.data.user_model_count, clsName: 'c1',
|
||||||
{ title: '算子总数', count: d.data.total_operator_count, ucnt: d.data.user_operator_count, clsName: 'c1',
|
icon: isDark ? "images/nav/nav12.png" : "images/nav/nav1.png"
|
||||||
icon:isDark?"images/nav/nav22.png": "images/nav/nav2.png" },
|
},
|
||||||
{ title: '数据集总数', count: d.data.total_dataset_count, ucnt: d.data.user_dataset_count, clsName: 'c1',
|
{
|
||||||
icon: isDark?"images/nav/nav32.png":"images/nav/nav3.png" },
|
title: '算子总数', count: d.data.total_operator_count, ucnt: d.data.user_operator_count, clsName: 'c1',
|
||||||
{ title: '评估报告总数', count: d.data.total_connection_count, ucnt: d.data.user_connection_count, clsName: 'c1',
|
icon: isDark ? "images/nav/nav22.png" : "images/nav/nav2.png"
|
||||||
icon: isDark?"images/nav/nav42.png":"images/nav/nav4.png" },
|
},
|
||||||
{ title: '互联总数', count: d.data.total_task_count, ucnt: d.data.user_task_count, clsName: 'c1',
|
{
|
||||||
icon: isDark?"images/nav/nav52.png":"images/nav/nav5.png" },
|
title: '数据集总数', count: d.data.total_dataset_count, ucnt: d.data.user_dataset_count, clsName: 'c1',
|
||||||
{ title: '总访问量', count: d.data.total_visit_count, ucnt: d.data.user_visit_count, clsName: 'c1',
|
icon: isDark ? "images/nav/nav32.png" : "images/nav/nav3.png"
|
||||||
icon: isDark?"images/nav/nav62.png":"images/nav/nav6.png" },
|
},
|
||||||
|
{
|
||||||
|
title: '评估报告总数', count: d.data.total_connection_count, ucnt: d.data.user_connection_count, clsName: 'c1',
|
||||||
|
icon: isDark ? "images/nav/nav42.png" : "images/nav/nav4.png"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '互联总数', count: d.data.total_task_count, ucnt: d.data.user_task_count, clsName: 'c1',
|
||||||
|
icon: isDark ? "images/nav/nav52.png" : "images/nav/nav5.png"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '总访问量', count: d.data.total_visit_count, ucnt: d.data.user_visit_count, clsName: 'c1',
|
||||||
|
icon: isDark ? "images/nav/nav62.png" : "images/nav/nav6.png"
|
||||||
|
},
|
||||||
];
|
];
|
||||||
if (isV2) {
|
if (isV2) {
|
||||||
topInfos.value = [
|
topInfos.value = [
|
||||||
{ title: '模型总数', count: d.data.total_model_count, ucnt: d.data.user_model_count, clsName: 'c1',
|
{
|
||||||
icon: isDark?"images/nav/nav12.png":"images/nav/nav1.png" },
|
title: '模型总数', count: d.data.total_model_count, ucnt: d.data.user_model_count, clsName: 'c1',
|
||||||
{ title: '数据集总数', count: d.data.total_dataset_count, ucnt: d.data.user_dataset_count, clsName: 'c1',
|
icon: isDark ? "images/nav/nav12.png" : "images/nav/nav1.png"
|
||||||
icon: isDark?"images/nav/nav32.png":"images/nav/nav3.png" },
|
},
|
||||||
{ title: '评估报告总数', count: d.data.total_connection_count, ucnt: d.data.user_connection_count, clsName: 'c1',
|
{
|
||||||
icon: isDark?"images/nav/nav42.png":"images/nav/nav4.png" },
|
title: '数据集总数', count: d.data.total_dataset_count, ucnt: d.data.user_dataset_count, clsName: 'c1',
|
||||||
{ title: '总访问量', count: d.data.total_visit_count, ucnt: d.data.user_visit_count, clsName: 'c1',
|
icon: isDark ? "images/nav/nav32.png" : "images/nav/nav3.png"
|
||||||
icon: isDark?"images/nav/nav62.png":"images/nav/nav6.png" },
|
},
|
||||||
|
{
|
||||||
|
title: '评估报告总数', count: d.data.total_connection_count, ucnt: d.data.user_connection_count, clsName: 'c1',
|
||||||
|
icon: isDark ? "images/nav/nav42.png" : "images/nav/nav4.png"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '总访问量', count: d.data.total_visit_count, ucnt: d.data.user_visit_count, clsName: 'c1',
|
||||||
|
icon: isDark ? "images/nav/nav62.png" : "images/nav/nav6.png"
|
||||||
|
},
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
onUnmounted(()=>{
|
onUnmounted(() => {
|
||||||
eventBus.off("changeTheme");
|
eventBus.off("changeTheme");
|
||||||
|
if (window.indexTimer) {
|
||||||
|
window.clearInterval(window.indexTimer);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
eventBus.on("changeTheme",d=>{
|
eventBus.on("changeTheme", d => {
|
||||||
loadInfo();
|
loadInfo();
|
||||||
});
|
});
|
||||||
winWidth.value = window.outerWidth;
|
winWidth.value = window.outerWidth;
|
||||||
|
@ -256,6 +279,10 @@ onMounted(() => {
|
||||||
}
|
}
|
||||||
loadDevice();
|
loadDevice();
|
||||||
loadInfo();
|
loadInfo();
|
||||||
|
window.indexTimer = window.setInterval(() => {
|
||||||
|
loadDevice();
|
||||||
|
loadInfo();
|
||||||
|
}, 3000);
|
||||||
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
@ -601,6 +628,12 @@ onMounted(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.img-loading {
|
||||||
|
position: absolute;
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
.proc-card {
|
.proc-card {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
|
@ -690,18 +723,21 @@ html.dark {
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
.proc-card{
|
|
||||||
.el-card__header{
|
.proc-card {
|
||||||
.row2-top{
|
.el-card__header {
|
||||||
div{
|
.row2-top {
|
||||||
color:#fff !important;
|
div {
|
||||||
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.el-card__body{
|
|
||||||
|
.el-card__body {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
color:#aaa;
|
color: #aaa;
|
||||||
.el-badge__content--danger{
|
|
||||||
|
.el-badge__content--danger {
|
||||||
background: #6F89A6;
|
background: #6F89A6;
|
||||||
width: 24px;
|
width: 24px;
|
||||||
height: 24px;
|
height: 24px;
|
||||||
|
@ -711,12 +747,14 @@ html.dark {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.proc-card.server-status{
|
|
||||||
|
.proc-card.server-status {
|
||||||
background: #242B43;
|
background: #242B43;
|
||||||
.el-card__header{
|
|
||||||
.row2-top{
|
.el-card__header {
|
||||||
div{
|
.row2-top {
|
||||||
color:#fff !important;
|
div {
|
||||||
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -40,7 +40,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="dev-row3">
|
<div class="dev-row3">
|
||||||
<div class="device-state">
|
<div class="device-state">
|
||||||
|
<img :src="'images/loading-icon.gif'" v-if="it.state == 'infer'" class="img-loading">
|
||||||
<img style="position: relative;top: -10px;left:-10px;"
|
<img style="position: relative;top: -10px;left:-10px;"
|
||||||
:src="'images/state/' + it.state + '.png'" />
|
:src="'images/state/' + it.state + '.png'" />
|
||||||
<div
|
<div
|
||||||
|
@ -114,7 +114,7 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup>
|
||||||
import { reactive } from 'vue'
|
import { reactive } from 'vue'
|
||||||
import ModelFlow from './components/ModelFlow2.vue'
|
import ModelFlow from './components/ModelFlow2.vue'
|
||||||
import IndexNotice from './components/IndexNotice.vue'
|
import IndexNotice from './components/IndexNotice.vue'
|
||||||
|
@ -147,7 +147,7 @@ const winWidth = ref(0)
|
||||||
const isSmallScreen = computed(() => {
|
const isSmallScreen = computed(() => {
|
||||||
return winWidth.value < 1440;
|
return winWidth.value < 1440;
|
||||||
});
|
});
|
||||||
const getState = (e: any) => {
|
const getState = (e) => {
|
||||||
if (e == "offline") {
|
if (e == "offline") {
|
||||||
return "离线";
|
return "离线";
|
||||||
}
|
}
|
||||||
|
@ -172,6 +172,11 @@ const getState = (e: any) => {
|
||||||
|
|
||||||
return "升级中";
|
return "升级中";
|
||||||
}
|
}
|
||||||
|
onUnmounted(() => {
|
||||||
|
if (window.indexTimer2) {
|
||||||
|
window.clearInterval(window.indexTimer2);
|
||||||
|
}
|
||||||
|
});
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
winWidth.value = window.outerWidth;
|
winWidth.value = window.outerWidth;
|
||||||
window.onresize = () => {
|
window.onresize = () => {
|
||||||
|
@ -182,6 +187,9 @@ onMounted(() => {
|
||||||
DeviceAPI.getStatus().then(d => {
|
DeviceAPI.getStatus().then(d => {
|
||||||
|
|
||||||
});
|
});
|
||||||
|
window.indexTimer2 = window.setInterval(() => {
|
||||||
|
DeviceAPI.getStatus()
|
||||||
|
}, 3000);
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -489,6 +497,12 @@ onMounted(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.img-loading {
|
||||||
|
position: absolute;
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
.proc-card {
|
.proc-card {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
|
|
|
@ -53,8 +53,16 @@
|
||||||
<el-table-column label="Micro F1" align="left" prop="micro_f1" />
|
<el-table-column label="Micro F1" align="left" prop="micro_f1" />
|
||||||
<el-table-column label="Macro F1" align="left" prop="macro_f1" />
|
<el-table-column label="Macro F1" align="left" prop="macro_f1" />
|
||||||
<el-table-column label="加权F1-Scroe" align="left" prop="weight_f1" />
|
<el-table-column label="加权F1-Scroe" align="left" prop="weight_f1" />
|
||||||
<el-table-column label="平均推理时间" align="left" prop="inference_time" />
|
<el-table-column label="平均推理时间" align="left" prop="inference_time">
|
||||||
<el-table-column label="系统延迟时间" align="left" prop="system_delay" />
|
<template #default="scope">
|
||||||
|
{{ scope.row.inference_time }} ms
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="系统延迟时间" align="left" prop="system_delay">
|
||||||
|
<template #default="scope">
|
||||||
|
{{ scope.row.system_delay }} ms
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
<div class="print-page" v-if="false"></div>
|
<div class="print-page" v-if="false"></div>
|
||||||
<el-row class="report-chart1" style="margin-top:20px;" :key="info.elPrint" v-if="false"
|
<el-row class="report-chart1" style="margin-top:20px;" :key="info.elPrint" v-if="false"
|
||||||
|
@ -240,8 +248,8 @@ const info = reactive({
|
||||||
horizontal_comparison: [],
|
horizontal_comparison: [],
|
||||||
isPrint: false,
|
isPrint: false,
|
||||||
elPrint: 0,
|
elPrint: 0,
|
||||||
theme:settingsStore.theme,
|
theme: settingsStore.theme,
|
||||||
chartKey:0,
|
chartKey: 0,
|
||||||
})
|
})
|
||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
const calcChartHeight = it => {
|
const calcChartHeight = it => {
|
||||||
|
@ -364,8 +372,8 @@ function renderChar4() {
|
||||||
let opt = {
|
let opt = {
|
||||||
title: {
|
title: {
|
||||||
text: '硬件横向对比测试图',
|
text: '硬件横向对比测试图',
|
||||||
textStyle:{
|
textStyle: {
|
||||||
color:isDark.value? "#fff":"#333"
|
color: isDark.value ? "#fff" : "#333"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
|
@ -373,8 +381,8 @@ function renderChar4() {
|
||||||
top: 40,
|
top: 40,
|
||||||
orient: 'vertical',
|
orient: 'vertical',
|
||||||
data: datas.map((d, idx) => idx + 1 + "-" + d.device_name),
|
data: datas.map((d, idx) => idx + 1 + "-" + d.device_name),
|
||||||
textStyle:{
|
textStyle: {
|
||||||
color:isDark.value? "#fff":"#333"
|
color: isDark.value ? "#fff" : "#333"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
tooltip: {
|
tooltip: {
|
||||||
|
@ -472,8 +480,8 @@ function renderChar3() {
|
||||||
let opt = {
|
let opt = {
|
||||||
title: {
|
title: {
|
||||||
text: '推理结果比对图',
|
text: '推理结果比对图',
|
||||||
textStyle:{
|
textStyle: {
|
||||||
color:isDark.value? "#fff":"#333"
|
color: isDark.value ? "#fff" : "#333"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
|
@ -481,8 +489,8 @@ function renderChar3() {
|
||||||
top: 40,
|
top: 40,
|
||||||
orient: 'vertical',
|
orient: 'vertical',
|
||||||
data: legendDatas,
|
data: legendDatas,
|
||||||
textStyle:{
|
textStyle: {
|
||||||
color:isDark.value? "#fff":"#333"
|
color: isDark.value ? "#fff" : "#333"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
tooltip: {
|
tooltip: {
|
||||||
|
@ -521,23 +529,23 @@ function renderChart1(data, type) {
|
||||||
legend: {
|
legend: {
|
||||||
left: '10%', right: '20%',
|
left: '10%', right: '20%',
|
||||||
data: chartInfo.names,
|
data: chartInfo.names,
|
||||||
textStyle:{
|
textStyle: {
|
||||||
color:isDark.value? "#fff":"#333"
|
color: isDark.value ? "#fff" : "#333"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
grid: { top: gridTop, },
|
grid: { top: gridTop, },
|
||||||
xAxis: [{
|
xAxis: [{
|
||||||
type: 'category', // 还有其他的type,可以去官网喵两眼哦
|
type: 'category', // 还有其他的type,可以去官网喵两眼哦
|
||||||
data: chartInfo.labels, // x轴数据
|
data: chartInfo.labels, // x轴数据
|
||||||
textStyle:{
|
textStyle: {
|
||||||
color:isDark.value? "#fff":"#333"
|
color: isDark.value ? "#fff" : "#333"
|
||||||
}
|
}
|
||||||
}],
|
}],
|
||||||
yAxis: [{
|
yAxis: [{
|
||||||
type: 'value',
|
type: 'value',
|
||||||
name: type == 'roc' ? "ROC曲线" : "RP曲线",
|
name: type == 'roc' ? "ROC曲线" : "RP曲线",
|
||||||
textStyle:{
|
textStyle: {
|
||||||
color:isDark.value? "#fff":"#333"
|
color: isDark.value ? "#fff" : "#333"
|
||||||
}
|
}
|
||||||
}],
|
}],
|
||||||
tooltip: {
|
tooltip: {
|
||||||
|
@ -577,14 +585,14 @@ function initTaskChart(it) {
|
||||||
rocs, rps, names, labels
|
rocs, rps, names, labels
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
onUnmounted(()=>{
|
onUnmounted(() => {
|
||||||
eventBus.off("changeTheme");
|
eventBus.off("changeTheme");
|
||||||
});
|
});
|
||||||
function loadData() {
|
function loadData() {
|
||||||
eventBus.on("changeTheme",d=>{
|
eventBus.on("changeTheme", d => {
|
||||||
info.theme=d;
|
info.theme = d;
|
||||||
info.chartKey++;
|
info.chartKey++;
|
||||||
isDark.value=d== ThemeEnum.DARK;
|
isDark.value = d == ThemeEnum.DARK;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue