yudao-dev/src/views/energy/analysis/index.vue

75 lines
1.5 KiB
Vue

<!--
* @Author: zwq
* @Date: 2024-09-23 14:35:30
* @LastEditors: zwq
* @LastEditTime: 2024-09-23 14:48:08
* @Description:
-->
<template>
<div>
<div style="background: #f2f4f9; height: 40px; width: 100%">
<ButtonNav
:menus="['走势分析', '对比分析', '同比分析', '环比分析']"
@change="currentMenu">
<template v-slot:tab1>
<div>走势分析</div>
</template>
<template v-slot:tab2>
<div>对比分析</div>
</template>
<template v-slot:tab3>
<div>同比分析</div>
</template>
<template v-slot:tab4>
<div>环比分析</div>
</template>
</ButtonNav>
</div>
<div class="app-container">
<div v-if="activeName === '走势分析'">
<trendAnalysis />
</div>
<div v-else-if="activeName === '对比分析'">
<contrastAnalysis />
</div>
<div v-else-if="activeName === '同比分析'">
<yoyAnalysis />
</div>
<div v-else-if="activeName === '环比分析'">
<qoqAnalysis />
</div>
</div>
</div>
</template>
<script>
import ButtonNav from '@/components/ButtonNav';
import trendAnalysis from './trendAnalysis';
import contrastAnalysis from './contrastAnalysis';
import yoyAnalysis from './yoyAnalysis';
import qoqAnalysis from './qoqAnalysis';
export default {
name: '',
data() {
return {
activeName: '走势分析',
};
},
components: {
ButtonNav,
trendAnalysis,
contrastAnalysis,
yoyAnalysis,
qoqAnalysis,
},
created() {},
methods: {
currentMenu(val) {
this.activeName = val;
},
},
};
</script>
<style lang="scss"></style>