能耗单耗修改

zhangwencui

21 小时以前 7276f122a92c9c7d45cf70fb1f8490dfb5c2448b

 src/views/reportAnalysis/unitEnergyConsumption/index.vue

@@ -90,48 +90,38 @@
        </el-icon>
        能耗单耗数据
      </h2>
      <el-table :data="tableValue"
      <el-table :data="tableData2"
                v-loading="tableLoading"
                border>
        <el-table-column prop="meterReadingDate"
        <!-- <el-table-column prop="meterReadingDate"
                         label="日期"
                         align="center" />
        <!-- <el-table-column prop="type"
                         label="类型"
                         align="center"
                         width="100">
          <template #default="scope">
            <el-tag :type="scope.row.type === '生产' ? 'primary' : 'success'">
              {{ scope.row.type }}
            </el-tag>
          </template>
        </el-table-column> -->
                         align="center" /> -->
        <el-table-column prop="energyTyep"
                         label="能耗类型"
                         align="center">
          <template #default="scope">
            <el-tag :type="getEnergyTypeType(scope.row.type)">
              {{ scope.row.type }}
            <el-tag :type="getEnergyTypeType(scope.row.energyTyep)">
              {{ scope.row.energyTyep }}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="consumption"
        <el-table-column prop="energyConsumption"
                         label="用量"
                         align="right" />
        <el-table-column prop="cost"
        <el-table-column prop="energyCost"
                         label="成本"
                         align="right">
          <template #default="scope">
            <span class="data-value">¥{{ scope.row.cost }}</span>
            <span class="data-value">¥{{ scope.row.energyCost }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="unitConsumption"
        <!-- <el-table-column prop="unitConsumption"
                         label="单耗"
                         align="right">
          <template #default="scope">
            <span class="data-value">{{ scope.row.unitConsumption }}</span>
          </template>
        </el-table-column>
        </el-table-column> -->
      </el-table>
    </div>
  </div>
@@ -142,7 +132,7 @@
  import { ElMessage } from "element-plus";
  import { TrendCharts, List } from "@element-plus/icons-vue";
  import * as echarts from "echarts";
  import { energyConsumptionDetailStatistics } from "@/api/energyManagement/energyType";
  import { energyConsumptionDetailCollectEnergy } from "@/api/energyManagement/energyType";

  // 统计维度
  const statisticsType = ref("day");
@@ -208,7 +198,7 @@
    const typeMap = {
      水: "primary",
      电: "warning",
      蒸汽: "success",
      气: "success",
    };
    return typeMap[type] || "info";
  };
@@ -330,7 +320,51 @@
    );
    // 使用实际的meterReadingDate作为横轴数据
    xAxisData = allDates;

    const energyTypesList = ["水", "电", "气"];
    const seriesData = [
      {
        name: "水",
        type: "line",
        data: data.map(item => item.waterConsumption),
        smooth: true,
        symbol: "circle",
        symbolSize: 8,
        lineStyle: {
          width: 3,
        },
        itemStyle: {
          color: "#409EFF",
        },
      },
      {
        name: "电",
        type: "line",
        data: data.map(item => item.electricityConsumption),
        smooth: true,
        symbol: "circle",
        symbolSize: 8,
        lineStyle: {
          width: 3,
        },
        itemStyle: {
          color: "#FF4D4F",
        },
      },
      {
        name: "气",
        type: "line",
        data: data.map(item => item.gasConsumption),
        smooth: true,
        symbol: "circle",
        symbolSize: 8,
        lineStyle: {
          width: 3,
        },
        itemStyle: {
          color: "#FF9900",
        },
      },
    ];
    const option = {
      tooltip: {
        trigger: "axis",
@@ -340,7 +374,7 @@
        textStyle: { color: "#303133" },
      },
      legend: {
        data: ["单耗"],
        data: energyTypesList,
        top: 0,
        right: 10,
        textStyle: { color: "#606266" },
@@ -370,26 +404,13 @@
        axisLine: { show: false },
        splitLine: { lineStyle: { color: "#f0f2f5" } },
      },
      series: {
        name: "单耗",
        type: "line",
        data: data.map(item => item.totalCost),
        smooth: true,
        symbol: "circle",
        symbolSize: 8,
        lineStyle: {
          width: 3,
        },
        itemStyle: {
          color: "#409EFF",
        },
      },
      series: seriesData,
    };

    consumptionChartInstance.setOption(option);
  };
  const tableValue = ref([]);

  const tableData2 = ref([]);
  // 查询
  const handleQuery = () => {
    tableLoading.value = true;
@@ -443,11 +464,12 @@
      params.days = Math.ceil((end - start) / (1000 * 60 * 60 * 24)) + 1;
    }

    energyConsumptionDetailStatistics(params)
    energyConsumptionDetailCollectEnergy(params)
      .then(res => {
        if (res.code === 200) {
          const data = res.data;
          tableData.value = data.energyCostDtos || [];
          tableData2.value = data.energyConsumptionTypeProportion || [];
          tableValue.value = [];
          tableData.value.forEach(item => {
            tableValue.value.push({