index.vue

<template>
  <div>
    <el-table v-loading="loading" :data="dataInfo" show-summary :summary-method="getSummaries">
      <el-table-column label="储配站" align="center" prop="stationName" />
      <el-table-column label="充装气瓶数" align="center" prop="bottleNum" />
      <el-table-column label="充装量/KG" align="center" prop="chargeMeasure"/>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="queryDataInfo"
    />
  </div>

</template>

<script>
  import { airChargeStationStatistics, airChargeStationStatisticExport } from "@/api/gasBottleTrack/chargeRecord";
  export default {
    name: "station-list",
    props: {
        queryParams: {
          type: Object
        }
    },
    data(){
      return{
        dataInfo: [],
        total: 0,
        loading: false
      }

    },
    methods: {
      //查询
      queryDataInfo(){
        this.loading = true;
        airChargeStationStatistics(this.queryParams).then(res =>{
          this.loading = false;
          if(res.code == 200){
            this.total = res.total;
            this.dataInfo = res.rows;
          }
        })
      },
      //导出
      importData(){
        this.$confirm('是否确认导出所有充装信息统计数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          console.log("fsf------", this.$parent)
          this.$parent.exportLoading = true;
          return airChargeStationStatisticExport(this.queryParams);
        }).then(response => {
            this.download(response.msg);
            this.$parent.exportLoading = false;
        }).catch(() => {});
      },
      getSummaries(param){
        const { columns, data } = param;
        const sums = [];
        columns.forEach((column, index) => {
          if (index === 0) {
          sums[index] = "数据汇总";
          return;
        }
        const values = data.map((item) => Number(item[column.property]));
        if (
          column.property === "bottleNum" ||
          column.property === "chargeMeasure"
        ) {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
          if (!isNaN(value)) {
            return prev + curr;
          } else {
            return prev;
          }
        }, 0);
          sums[index] = sums[index].toFixed(0);
        }
      });
        return sums;
      }
    }
  }
</script>

<style scoped>

</style>