109 lines
2.7 KiB
Vue
109 lines
2.7 KiB
Vue
<template>
|
|
<div class="home-page">
|
|
<el-card class="welcome-card">
|
|
<template #header>
|
|
<h2>装备成本估算系统</h2>
|
|
</template>
|
|
<el-row :gutter="20">
|
|
<el-col :span="8">
|
|
<el-card @click="$router.push('/predict')">
|
|
<el-icon><Money /></el-icon>
|
|
<h3>成本预测</h3>
|
|
<p>基于机器学习和 PLS 回归模型的成本预测</p>
|
|
</el-card>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-card @click="$router.push('/analysis')">
|
|
<el-icon><DataAnalysis /></el-icon>
|
|
<h3>特征分析</h3>
|
|
<p>分析参数对成本的影响</p>
|
|
</el-card>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-card @click="$router.push('/training')">
|
|
<el-icon><Monitor /></el-icon>
|
|
<h3>模型训练</h3>
|
|
<p>训练和优化预测模型</p>
|
|
</el-card>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-card @click="$router.push('/algorithm-demo')">
|
|
<el-icon><TrendCharts /></el-icon>
|
|
<h3>算法演示</h3>
|
|
<p>切换常用机器学习算法并对比预测效果</p>
|
|
</el-card>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-card @click="$router.push('/models')">
|
|
<el-icon><Management /></el-icon>
|
|
<h3>模型管理</h3>
|
|
<p>管理训练好的模型</p>
|
|
</el-card>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-card @click="$router.push('/datasets')">
|
|
<el-icon><Collection /></el-icon>
|
|
<h3>数据集管理</h3>
|
|
<p>管理训练和验证数据集</p>
|
|
</el-card>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-card @click="$router.push('/data')">
|
|
<el-icon><Management /></el-icon>
|
|
<h3>数据管理</h3>
|
|
<p>管理装备数据和成本数据</p>
|
|
</el-card>
|
|
</el-col>
|
|
</el-row>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { Money, DataAnalysis, Monitor, Management, Collection, TrendCharts } from '@element-plus/icons-vue'
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.home-page {
|
|
padding: 20px;
|
|
|
|
.welcome-card {
|
|
max-width: 1200px;
|
|
margin: 0 auto;
|
|
|
|
h2 {
|
|
text-align: center;
|
|
margin: 0;
|
|
}
|
|
}
|
|
|
|
.el-card {
|
|
text-align: center;
|
|
cursor: pointer;
|
|
transition: all 0.3s;
|
|
margin-bottom: 20px;
|
|
|
|
&:hover {
|
|
transform: translateY(-5px);
|
|
box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
|
|
}
|
|
|
|
.el-icon {
|
|
font-size: 48px;
|
|
color: #409EFF;
|
|
margin: 20px 0;
|
|
}
|
|
|
|
h3 {
|
|
margin: 10px 0;
|
|
font-size: 18px;
|
|
}
|
|
|
|
p {
|
|
color: #909399;
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
}
|
|
</style>
|