bom添加产品编码

zss

4 天以前 2cdbad409e82d4354e4eca5cffa65c6bef7a4d20

 src/views/energyManagement/energyConsumptionStatistical/index.vue

@@ -180,9 +180,13 @@
                         label="序号"
                         width="60"
                         align="center" />
        <el-table-column prop="timePeriod"
                         :label="timeColumnLabel"
                         align="center" />
        <el-table-column prop="meterReadingDate"
                         label="日期"
                         align="right">
          <template #default="scope">
            <span class="consumption-value">{{ scope.row.meterReadingDate }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="waterConsumption"
                         label="用水量(吨)"
                         align="right">
@@ -190,11 +194,11 @@
            <span class="consumption-value">{{ scope.row.waterConsumption }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="waterAmount"
        <el-table-column prop="waterCost"
                         label="水费(元)"
                         align="right">
          <template #default="scope">
            <span class="amount-value">{{ scope.row.waterAmount }}</span>
            <span class="amount-value">{{ scope.row.waterCost }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="electricityConsumption"
@@ -204,11 +208,11 @@
            <span class="consumption-value">{{ scope.row.electricityConsumption }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="electricityAmount"
        <el-table-column prop="electricityCost"
                         label="电费(元)"
                         align="right">
          <template #default="scope">
            <span class="amount-value">{{ scope.row.electricityAmount }}</span>
            <span class="amount-value">{{ scope.row.electricityCost }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="gasConsumption"
@@ -218,11 +222,11 @@
            <span class="consumption-value">{{ scope.row.gasConsumption }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="gasAmount"
        <el-table-column prop="gasCost"
                         label="气费(元)"
                         align="right">
          <template #default="scope">
            <span class="amount-value">{{ scope.row.gasAmount }}</span>
            <span class="amount-value">{{ scope.row.gasCost }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="totalConsumption"
@@ -237,7 +241,7 @@
                         align="right"
                         fixed="right">
          <template #default="scope">
            <span class="total-amount-value">¥{{ scope.row.totalAmount }}</span>
            <span class="total-amount-value">¥{{ scope.row.totalCost }}</span>
          </template>
        </el-table-column>
      </el-table>
@@ -267,15 +271,28 @@
    ArrowDown,
  } from "@element-plus/icons-vue";
  import * as echarts from "echarts";
  import { energyConsumptionDetailStatistics } from "@/api/energyManagement/energyType";

  // 统计维度：day-按日，month-按月，year-按年
  const statisticsType = ref("day");

  // 搜索表单
  const searchForm = reactive({
    energyType: "",
    dateRange: [],
    monthRange: [],
    energyType: "全部",
    dateRange: (() => {
      // 默认最近7天
      const end = new Date();
      const start = new Date();
      start.setDate(start.getDate() - 6);
      return [start.toISOString().split("T")[0], end.toISOString().split("T")[0]];
    })(),
    monthRange: (() => {
      // 默认最近3个月
      const end = new Date();
      const start = new Date();
      start.setMonth(start.getMonth() - 2);
      return [start.toISOString().slice(0, 7), end.toISOString().slice(0, 7)];
    })(),
    year: new Date().getFullYear(),
  });

@@ -430,7 +447,7 @@
      },
      xAxis: {
        type: "category",
        data: data.map(item => item.timePeriod),
        data: data.map(item => item.meterReadingDate),
        axisLabel: { rotate: statisticsType.value === "day" ? 45 : 0 },
      },
      yAxis: {
@@ -481,7 +498,7 @@
      },
      xAxis: {
        type: "category",
        data: data.map(item => item.timePeriod),
        data: data.map(item => item.meterReadingDate),
        axisLabel: { rotate: statisticsType.value === "day" ? 45 : 0 },
      },
      yAxis: {
@@ -492,21 +509,21 @@
        {
          name: "水费",
          type: "line",
          data: data.map(item => item.waterAmount),
          data: data.map(item => item.waterCost),
          smooth: true,
          itemStyle: { color: "#409EFF" },
        },
        {
          name: "电费",
          type: "line",
          data: data.map(item => item.electricityAmount),
          data: data.map(item => item.electricityCost),
          smooth: true,
          itemStyle: { color: "#E6A23C" },
        },
        {
          name: "气费",
          type: "line",
          data: data.map(item => item.gasAmount),
          data: data.map(item => item.gasCost),
          smooth: true,
          itemStyle: { color: "#67C23A" },
        },
@@ -582,15 +599,15 @@
  const updateAmountTypeChart = () => {
    const data = tableData.value;
    const totalWaterAmount = data.reduce(
      (sum, item) => sum + parseFloat(item.waterAmount),
      (sum, item) => sum + parseFloat(item.waterCost),
      0
    );
    const totalElectricityAmount = data.reduce(
      (sum, item) => sum + parseFloat(item.electricityAmount),
      (sum, item) => sum + parseFloat(item.electricityCost),
      0
    );
    const totalGasAmount = data.reduce(
      (sum, item) => sum + parseFloat(item.gasAmount),
      (sum, item) => sum + parseFloat(item.gasCost),
      0
    );

@@ -651,13 +668,73 @@
  // 查询
  const handleQuery = () => {
    tableLoading.value = true;
    setTimeout(() => {
      const data = generateMockData();
      tableData.value = data;
      page.total = data.length;
      tableLoading.value = false;
      updateCharts();
    }, 300);
    const params = {
      type: "",
    };

    // 构造请求参数
    if (searchForm.energyType != "全部") {
      params.type = searchForm.energyType;
    }

    if (statisticsType.value === "day") {
      if (searchForm.dateRange && searchForm.dateRange.length === 2) {
        params.startDate = searchForm.dateRange[0];
        params.endDate = searchForm.dateRange[1];
        // 计算天数
        const start = new Date(searchForm.dateRange[0]);
        const end = new Date(searchForm.dateRange[1]);
        params.days = Math.ceil((end - start) / (1000 * 60 * 60 * 24)) + 1;
      }
    } else if (statisticsType.value === "month") {
      if (searchForm.monthRange && searchForm.monthRange.length === 2) {
        params.startDate = searchForm.monthRange[0] + "-01";
        params.endDate = searchForm.monthRange[1] + "-01";
        // 计算月数
        const start = new Date(searchForm.monthRange[0] + "-01");
        const end = new Date(searchForm.monthRange[1] + "-01");
        params.days =
          (end.getFullYear() - start.getFullYear()) * 12 +
          (end.getMonth() - start.getMonth()) +
          1;
      }
    } else if (statisticsType.value === "year") {
      params.startDate = searchForm.year + "-01-01";
      params.endDate = searchForm.year + "-12-31";
      params.days = 365;
    }

    // 调用接口获取数据
    energyConsumptionDetailStatistics(params)
      .then(res => {
        if (res.code === 200) {
          const data = res.data;

          // 更新统计概览数据
          overview.totalConsumption = data.totalEnergyConsumption || "0";
          overview.totalAmount = data.totalEnergyCost || "0";
          overview.avgConsumption = data.averageConsumption || "0";
          overview.compareRate = data.changeVite || 0;

          // 处理表格数据
          tableData.value = data.energyCostDtos || [];
          page.total = tableData.value.length || 0;
        } else {
          ElMessage.error(res.message || "获取数据失败");
          tableData.value = [];
          page.total = 0;
        }
      })
      .catch(err => {
        console.error("获取数据异常：", err);
        ElMessage.error("系统异常，获取数据失败");
        tableData.value = [];
        page.total = 0;
      })
      .finally(() => {
        tableLoading.value = false;
        updateCharts();
      });
  };

  // 更新所有图表
@@ -672,10 +749,28 @@

  // 重置
  const handleReset = () => {
    searchForm.energyType = "";
    searchForm.dateRange = [];
    searchForm.monthRange = [];
    searchForm.energyType = "全部";
    // 重置为默认时间范围
    const end = new Date();
    const start = new Date();

    // 默认最近7天
    start.setDate(start.getDate() - 6);
    searchForm.dateRange = [
      start.toISOString().split("T")[0],
      end.toISOString().split("T")[0],
    ];

    // 默认最近3个月
    start.setMonth(start.getMonth() - 2);
    searchForm.monthRange = [
      start.toISOString().slice(0, 7),
      end.toISOString().slice(0, 7),
    ];

    // 默认当前年份
    searchForm.year = new Date().getFullYear();

    page.current = 1;
    handleQuery();
  };