tft-fe/src/views/deviceManagement/performanceAnalysis.vue

63 lines
1.3 KiB
Vue

<template>
<div class="performance-analysis">
<el-menu
:default-active="activeName"
mode="horizontal"
@select="handleSelect"
>
<el-menu-item index="devicePage">设备OEE</el-menu-item>
<el-menu-item index="utilizationRateAnalysis">利用率分析</el-menu-item>
<el-menu-item index="mtbrf">MTBR-F</el-menu-item>
<el-menu-item index="analysisOfPallet">托盘指标分析</el-menu-item>
</el-menu>
<section>
<router-view />
</section>
</div>
</template>
<script>
export default {
name: 'performanceAnalysis',
data() {
return {
activeName: ''
}
},
mounted() {
this.activeName = this.$router.history.current.name
},
methods: {
handleSelect(name) {
this.$router.push({ name: name })
}
}
}
</script>
<style lang="scss">
.performance-analysis {
.el-menu {
background-color: #f2f4f9;
}
.el-menu.el-menu--horizontal {
border-bottom: none;
width: 100%;
display: flex;
justify-content: space-between;
padding: 8px 8px;
.el-menu-item {
height: 48px;
line-height: 48px;
width: 24.5%;
border-radius: 8px;
background-color: #fff;
font-size: 16px;
color: rgba(22, 22, 22, 0.65);
text-align: center;
}
}
.el-tabs__active-bar {
display: none;
}
}
</style>