2026-03-27 15:52:43 +08:00
|
|
|
<template>
|
2026-06-17 11:22:03 +08:00
|
|
|
<div class="monitorData-page">
|
|
|
|
|
<a-tabs v-model:activeKey="activeTab" class="monitorData-tabs">
|
|
|
|
|
<a-tab-pane tab="生态流量运行数据" key="FlowData">
|
|
|
|
|
<FlowData />
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
<a-tab-pane tab="水质监测数据" key="WaterData">
|
|
|
|
|
<WaterData />
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
<a-tab-pane tab="垂向水温数据" key="VerticalTemp">
|
|
|
|
|
<VerticalTemp />
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
<a-tab-pane tab="表层水温数据" key="SurfaceTemp">
|
|
|
|
|
<SurfaceTemp />
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
<a-tab-pane tab="过鱼监测数据" key="FishData">
|
|
|
|
|
<FishData />
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
<a-tab-pane tab="鱼类放鱼数据" key="FishRelease">
|
|
|
|
|
<FishRelease />
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
<a-tab-pane tab="流量站数据" key="FlowStation">
|
|
|
|
|
<FlowStation />
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
<a-tab-pane tab="综合导出" key="Export">
|
|
|
|
|
<Export />
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
</a-tabs>
|
2026-03-27 15:52:43 +08:00
|
|
|
</div>
|
2026-06-17 11:22:03 +08:00
|
|
|
</template>
|
|
|
|
|
<script setup lang="ts">
|
|
|
|
|
import { ref } from 'vue';
|
|
|
|
|
import FlowData from './components/FlowData/index.vue';
|
|
|
|
|
import WaterData from './components/WaterData/index.vue';
|
|
|
|
|
import VerticalTemp from './components/VerticalTemp/index.vue';
|
|
|
|
|
import SurfaceTemp from './components/SurfaceTemp/index.vue';
|
|
|
|
|
import FishData from './components/FishData/index.vue';
|
|
|
|
|
import FishRelease from './components/FishRelease/index.vue';
|
|
|
|
|
import FlowStation from './components/FlowStation/index.vue';
|
|
|
|
|
import Export from './components/Export/index.vue';
|
|
|
|
|
const activeTab = ref('FlowData');
|
|
|
|
|
</script>
|
|
|
|
|
<style scoped lang="scss">
|
|
|
|
|
.monitorData-page {
|
|
|
|
|
position: relative;
|
|
|
|
|
z-index: 900;
|
|
|
|
|
pointer-events: all;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
background-color: #ffffff;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.monitorData-tabs {
|
|
|
|
|
padding-left: 20px;
|
|
|
|
|
width: calc(100% - 20px);
|
|
|
|
|
height: calc(100% - 20px);
|
|
|
|
|
:deep(.ant-tabs-content) {
|
|
|
|
|
height: 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
