DeXun/klp-oa
9
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(ems/dashboard): 重构能源类型选择为标签页形式并设置默认值

Browse Source 
将能源类型选择从下拉框改为标签页形式，提升用户体验
移除未使用的标签页代码，并设置默认选中的能源类型
This commit is contained in:
砂糖
2026-03-26 10:41:27 +08:00
parent c2ba4b0193
commit feb50e038d
1 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
klp-ui/src/views/ems/dashboard/index.vue
View File

@@ -1,11 +1,11 @@
<template>
<el-row>
<el-col :span="4">
<div style="padding: 10px;">
<!-- <div style="padding: 10px;">
<el-select v-model="energyType" placeholder="请选择能源类型" @change="refresh">
<el-option v-for="item in energyTypeList" :key="item.energyTypeId" :label="item.name" :value="item.energyTypeId" />
</el-select>
</div>
</div> -->
<!-- 区域选择，默认展开，最高高度为60%的屏幕尺寸 -->
@@ -21,17 +21,20 @@
</el-col>
<el-col :span="20" v-if="showRight">
<el-tabs v-model="activeTab" type="card">
<!-- <el-tabs v-model="activeTab" type="card">
<el-tab-pane label="环比概况" name="1"></el-tab-pane>
<el-tab-pane label="近期趋势" name="2"></el-tab-pane>
<el-tab-pane label="同比分析" name="3"></el-tab-pane>
<el-tab-pane label="环比分析" name="4"></el-tab-pane>
</el-tabs> -->
<el-tabs v-model="energyType" type="card">
<el-tab-pane v-for="item in energyTypeList" :key="item.energyTypeId" :label="item.name" :name="item.energyTypeId"></el-tab-pane>
</el-tabs>
<Overview ref="overview" v-if="activeTab === '1'" :unit="energyUnit" :energyName="energyName" :energyType="energyType" :locationId="locationId" :deviceId="deviceId" />
<RecentTrend ref="recentTrend" v-if="activeTab === '2'" :unit="energyUnit" :energyName="energyName" :energyType="energyType" :locationId="locationId" :deviceId="deviceId" />
<YearToYear ref="yearToYear" v-if="activeTab === '3'" :unit="energyUnit" :energyName="energyName" :energyType="energyType" :locationId="locationId" :deviceId="deviceId" />
<MonthToMonth ref="monthToMonth" v-if="activeTab === '4'" :unit="energyUnit" :energyName="energyName" :energyType="energyType" :locationId="locationId" :deviceId="deviceId" />
<Overview ref="overview" :unit="energyUnit" :energyName="energyName" :energyType="energyType" :locationId="locationId" :deviceId="deviceId" />
<RecentTrend ref="recentTrend" :unit="energyUnit" :energyName="energyName" :energyType="energyType" :locationId="locationId" :deviceId="deviceId" />
<YearToYear ref="yearToYear" :unit="energyUnit" :energyName="energyName" :energyType="energyType" :locationId="locationId" :deviceId="deviceId" />
<MonthToMonth ref="monthToMonth" :unit="energyUnit" :energyName="energyName" :energyType="energyType" :locationId="locationId" :deviceId="deviceId" />
</el-col>
<el-col :span="20" v-else>
<el-empty description="请选择能源类型和区域"></el-empty>
@@ -90,6 +93,7 @@ export default {
getEnergyTypeList() {
listEnergyType({ pageNum: 1, pageSize: 9999 }).then(response => {
this.energyTypeList = response.rows;
this.energyType = this.energyTypeList[0]?.energyTypeId;
});
},
getLocationList() {