|
|
|
|
@ -80,7 +80,7 @@
|
|
|
|
|
<div class="charts-container"> |
|
|
|
|
<!-- 左侧:成本与收益对比图 --> |
|
|
|
|
<div class="chart-section"> |
|
|
|
|
<div class="section-title">成本与收益对比图</div> |
|
|
|
|
<div class="section-title">成本与单耗对比图</div> |
|
|
|
|
<div class="chart-box" ref="costChart_ref"></div> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
@ -174,7 +174,9 @@ export default {
|
|
|
|
|
|
|
|
|
|
// 表格数据 |
|
|
|
|
tableData: [ |
|
|
|
|
] |
|
|
|
|
], |
|
|
|
|
// 图表完整数据 |
|
|
|
|
chartData: [] |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
mounted() { |
|
|
|
|
@ -186,7 +188,9 @@ export default {
|
|
|
|
|
this.handleResize(); |
|
|
|
|
// 初始化时加载数据 |
|
|
|
|
this.fetchCardData(); |
|
|
|
|
this.getList(); |
|
|
|
|
this.getList().then(() => { |
|
|
|
|
this.fetchChartData(); |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
beforeDestroy() { |
|
|
|
|
window.removeEventListener("resize", this.handleResize); |
|
|
|
|
@ -204,11 +208,11 @@ export default {
|
|
|
|
|
// 初始化成本与收益对比图 |
|
|
|
|
initCostChart() { |
|
|
|
|
|
|
|
|
|
const dates = this.tableData.map(item => item.curDate).reverse(); |
|
|
|
|
const waterAmountData = this.tableData.map(item => item.totalUseWater).reverse(); |
|
|
|
|
const electricAmountData = this.tableData.map(item => item.totalUseEle).reverse(); |
|
|
|
|
const dates = this.chartData.map(item => item.curDate).reverse(); |
|
|
|
|
const waterAmountData = this.chartData.map(item => item.totalUseWater).reverse(); |
|
|
|
|
const electricAmountData = this.chartData.map(item => item.totalUseEle).reverse(); |
|
|
|
|
|
|
|
|
|
const unitConsumptionData = this.tableData.map(item => item.unitConsumption).reverse(); |
|
|
|
|
const unitConsumptionData = this.chartData.map(item => item.unitConsumption).reverse(); |
|
|
|
|
|
|
|
|
|
console.log(" electricAmountData", electricAmountData) |
|
|
|
|
|
|
|
|
|
@ -483,9 +487,9 @@ export default {
|
|
|
|
|
|
|
|
|
|
// 处理图例变化,重新计算y轴范围 |
|
|
|
|
handleLegendChanged(params) { |
|
|
|
|
const waterAmountData = this.tableData.map(item => item.totalUseWater).reverse(); |
|
|
|
|
const electricAmountData = this.tableData.map(item => item.totalUseEle).reverse(); |
|
|
|
|
const unitConsumptionData = this.tableData.map(item => item.unitConsumption).reverse(); |
|
|
|
|
const waterAmountData = this.chartData.map(item => item.totalUseWater).reverse(); |
|
|
|
|
const electricAmountData = this.chartData.map(item => item.totalUseEle).reverse(); |
|
|
|
|
const unitConsumptionData = this.chartData.map(item => item.unitConsumption).reverse(); |
|
|
|
|
|
|
|
|
|
// 获取当前选中的图例 |
|
|
|
|
const selected = params.selected; |
|
|
|
|
@ -699,8 +703,8 @@ export default {
|
|
|
|
|
initTrendChart() { |
|
|
|
|
this.trendChart = echarts.init(this.$refs.trendChart_ref); |
|
|
|
|
|
|
|
|
|
const dates = this.tableData.map(item => item.curDate).reverse(); |
|
|
|
|
const incomeData = this.tableData.map(item => item.totalIncome).reverse(); |
|
|
|
|
const dates = this.chartData.map(item => item.curDate).reverse(); |
|
|
|
|
const incomeData = this.chartData.map(item => item.totalIncome).reverse(); |
|
|
|
|
|
|
|
|
|
const option = { |
|
|
|
|
tooltip: { |
|
|
|
|
@ -714,7 +718,7 @@ export default {
|
|
|
|
|
}, |
|
|
|
|
grid: { |
|
|
|
|
left: "3%", |
|
|
|
|
right: "4%", |
|
|
|
|
right: "5%", |
|
|
|
|
bottom: "3%", |
|
|
|
|
containLabel: true |
|
|
|
|
}, |
|
|
|
|
@ -819,7 +823,9 @@ export default {
|
|
|
|
|
this.dateType = type; |
|
|
|
|
this.fetchCardData(); |
|
|
|
|
this.queryParams.pageNum = 1; |
|
|
|
|
this.getList(); |
|
|
|
|
this.getList().then(() => { |
|
|
|
|
this.fetchChartData(); |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 获取平均值标签 |
|
|
|
|
@ -849,7 +855,10 @@ export default {
|
|
|
|
|
console.log("查询数据"); |
|
|
|
|
this.fetchCardData(); |
|
|
|
|
this.queryParams.pageNum = 1; |
|
|
|
|
this.getList(); |
|
|
|
|
// 先获取列表数据获取 total,然后再获取图表数据 |
|
|
|
|
this.getList().then(() => { |
|
|
|
|
this.fetchChartData(); |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 获取顶部卡片数据 |
|
|
|
|
@ -1004,7 +1013,7 @@ export default {
|
|
|
|
|
this.endYear = String(currentYear); |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 获取列表数据(图表和表格) |
|
|
|
|
// 获取列表数据(表格) |
|
|
|
|
async getList() { |
|
|
|
|
try { |
|
|
|
|
// 构建查询参数 |
|
|
|
|
@ -1021,16 +1030,36 @@ export default {
|
|
|
|
|
if (res.code === 200 && res.rows) { |
|
|
|
|
// 处理表格数据 |
|
|
|
|
this.tableData = res.rows; |
|
|
|
|
|
|
|
|
|
this.total = res.total || 0; |
|
|
|
|
} |
|
|
|
|
} catch (error) { |
|
|
|
|
console.error('获取列表数据失败:', error); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 获取图表完整数据 |
|
|
|
|
async fetchChartData() { |
|
|
|
|
try { |
|
|
|
|
// 构建查询参数,使用 total 作为 pageSize 获取所有数据 |
|
|
|
|
const params = { |
|
|
|
|
startDate: this.getDateRange().start, |
|
|
|
|
endDate: this.getDateRange().end, |
|
|
|
|
type: this.getTypeValue(), |
|
|
|
|
buildingId: '所有', |
|
|
|
|
pageNum: 1, |
|
|
|
|
pageSize: this.total || 1000 |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
const res = await waterRevenueQuery(params); |
|
|
|
|
if (res.code === 200 && res.rows) { |
|
|
|
|
this.chartData = res.rows; |
|
|
|
|
// 更新图表 |
|
|
|
|
this.$nextTick(() => { |
|
|
|
|
this.updateCharts(); |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
} catch (error) { |
|
|
|
|
console.error('获取列表数据失败:', error); |
|
|
|
|
console.error('获取图表数据失败:', error); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|