10 changed files with 209 additions and 36 deletions
@ -0,0 +1,11 @@
@@ -0,0 +1,11 @@
|
||||
<template> |
||||
<time-process :stationType="stationType" :fixed="fixed" :requestPrefix="requestPrefix" :requestPrefixTable="requestPrefixTable" :tableTitle="title"></time-process> |
||||
</template> |
||||
<script setup> |
||||
import TimeProcess from '@/components/TimeProcess/index.vue' |
||||
const stationType = ref('E') |
||||
const fixed = ref(1) |
||||
const requestPrefix = ref('/ycqflowdata/chartdata') |
||||
const requestPrefixTable = ref('/ycqflowdata/gettabledataopen') |
||||
const title = '流量时段过程' |
||||
</script> |
||||
@ -0,0 +1,86 @@
@@ -0,0 +1,86 @@
|
||||
<template> |
||||
<div class="report-rain"> |
||||
<div class="tjfx-menu"> |
||||
<el-select v-model="menu" placeholder="请选择"> |
||||
<el-option v-for="dict in tjfxMenus" :key="dict.value" :label="dict.label" :value="dict.value" /> |
||||
</el-select> |
||||
</div> |
||||
<!-- 添加加载状态和错误提示 --> |
||||
<el-empty v-if="componentError" class="error-message" description="组件加载失败,请刷新页面重试" /> |
||||
<component :is="currentComponent" :tableTitle="tableTitle"></component> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { ref, computed, defineAsyncComponent } from 'vue' |
||||
|
||||
|
||||
// 定义菜单选项 |
||||
const tjfxMenus = [ |
||||
{ |
||||
value: '1', |
||||
label: '时段过程' |
||||
}, |
||||
{ |
||||
value: '2', |
||||
label: '年特征值' |
||||
}, { |
||||
value: '3', |
||||
label: '时段统计' |
||||
}, { |
||||
value: '4', |
||||
label: '历史同期对比' |
||||
} |
||||
] |
||||
|
||||
// 当前选中的菜单 |
||||
const menu = ref(tjfxMenus.length > 0 ? tjfxMenus[0].value : '') |
||||
|
||||
// 动态组件映射 |
||||
const componentMap = { |
||||
'1': defineAsyncComponent(() => import('@/views/statistic/qflow/qflow.vue')), |
||||
'2': defineAsyncComponent(() => import('@/views/statistic/qflow/qflowtzz.vue')), |
||||
'3': defineAsyncComponent(() => import('@/views/statistic/qflow/qflowsd.vue')), |
||||
'4': defineAsyncComponent(() => import('@/views/statistic/qflow/qflowls.vue')) |
||||
} |
||||
// 添加错误处理 |
||||
const componentError = ref(false) |
||||
|
||||
onErrorCaptured((error) => { |
||||
componentError.value = true |
||||
return true |
||||
}) |
||||
|
||||
// 计算当前应该显示的组件 |
||||
const currentComponent = computed(() => { |
||||
return componentMap[menu.value] |
||||
}) |
||||
// 原代码有误,tjfxMenus 中的对象没有 name 属性 |
||||
const tableTitle = computed(() => { |
||||
const currentItem = tjfxMenus.find(item => item.value === menu.value); |
||||
return currentItem ? currentItem.label : ''; |
||||
}) |
||||
</script> |
||||
|
||||
<style lang="scss"> |
||||
.tjfx-menu { |
||||
position: absolute; |
||||
right: 25px; |
||||
top: 30px; |
||||
z-index: 999999; |
||||
|
||||
.el-input__wrapper { |
||||
background: #10163A; |
||||
} |
||||
|
||||
.el-input__inner { |
||||
background: #10163A; |
||||
color: #fff; |
||||
border-color: #10163A; |
||||
} |
||||
|
||||
.el-select .el-input .el-select__caret { |
||||
color: #fff !important; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,10 @@
@@ -0,0 +1,10 @@
|
||||
<template> |
||||
<history-yoy :stationType="stationType" :fixed="fixed" :requestPrefix="requestPrefix" :tableTitle="title"></history-yoy> |
||||
</template> |
||||
<script setup> |
||||
import HistoryYoy from '@/components/HistoryYOY/index.vue' |
||||
const stationType = ref('E') |
||||
const fixed = ref(1) |
||||
const requestPrefix = ref('history') |
||||
const title = '流量历史同期对比' |
||||
</script> |
||||
@ -0,0 +1,10 @@
@@ -0,0 +1,10 @@
|
||||
<template> |
||||
<time-count :stationType="stationType" :fixed="fixed" :requestPrefix="requestPrefix" :tableTitle="title"></time-count> |
||||
</template> |
||||
<script setup> |
||||
import TimeCount from '@/components/TimeCount/index.vue' |
||||
const stationType = ref('E') |
||||
const fixed = ref(1) |
||||
const requestPrefix = ref('sddata') |
||||
const title = '流量时段统计(m³/s)' |
||||
</script> |
||||
@ -0,0 +1,11 @@
@@ -0,0 +1,11 @@
|
||||
<template> |
||||
<year-eigenvalue :stationType="stationType" :fixed="fixed" :requestPrefix="requestPrefix" :tableTitle="title" :tableName="tableName"></year-eigenvalue> |
||||
</template> |
||||
<script setup> |
||||
import YearEigenvalue from '@/components/YearEigenvalue/index.vue' |
||||
const stationType = ref('E') |
||||
const fixed = ref(1) |
||||
const requestPrefix = ref('tzzdatahistory') |
||||
let title = '流量年特征值表' |
||||
let tableName=ref('arch_char_q_qflow') |
||||
</script> |
||||
Loading…
Reference in new issue