导出功能

导出功能

实现功能：不选中时默认导出全部数据，选中数据时导出所选数据。

<a-table
      size="middle"
      :columns="columns"
      :data-source="dataSource"
      :pagination="pagination"
      @change="handleTableChange"
      style="margin-top: 20px"
      :row-selection="{
        selectedRowKeys: selectedRowKeys,
        onChange: onSelectChange,
      }"
    >
</table>

<a-button style="margin-left: 8px" @click="getQueryPathExportData()">
导出
</a-button>

// 导出专用
      maxSize: "",//数据源长度最大值
      fristTag: true,
      selectedRowKeys: [],
      SelectArray: [],
      SelectedArray: [],

 // 表格选择事件
    onSelectChange(selectedRowKeys, selectedRows) {
      console.log("选中的值为:::::", selectedRowKeys);
      this.selectedRowKeys = selectedRowKeys;

      // 在选中表格的时候进行相应的判断,如果选中的这条数据 已经在表格中了,那么就不添加进去,如果没有的话就添加进去
      // 对选中的数据进行遍历
      for (let i = 0; i < selectedRows.length; i++) {
        // 如果选择的序号中不包含被选中的数组的值，那么把选中的数组值插入到要导出的数组中
        if (this.SelectedArray.indexOf(selectedRows[i].key) > -1) {
          console.log("包含的数据为::::::", selectedRows[i].key);
        } else {
          this.SelectedArray.push(selectedRows[i].key);
          this.SelectArray.push(selectedRows[i]);
        }
      }
      // 过滤 勾选去掉的数据
      let target = this.SelectArray.filter(
        (item) => selectedRowKeys.indexOf(item.key) > -1
      );
      console.log("最后选中的数组为::::::", target);
      this.SelectArray = target;
      // 过滤到数组中冗余的值
    },
     // ----------------- 导出开始 ----------------
    // 基于查询条件进行导出
    getQueryPathExportData() {
      if (this.selectedRowKeys.length < 1) {
        let queryPath =
          "?pageNo=1&pageSize=" +
          this.maxSize +
          "&beginDate=" +
          this.startTime +
          "&endDate=" +
          this.endTime;
        console.log("基于查询条件进行导出的条件", queryPath);
        imHttp.getPrecultureList(queryPath).then((res) => {
          let array = res.result.records;
          this.exportBasic(array);
        });
      } else {
        this.exportSelectData();
      }
    },

    // 导出选中数据(表格选中数据导出)
    exportSelectData() {
      if (this.SelectArray.length == 0) {
        this.$message.error("请选择后导出");
      } else {
        this.exportBasic(this.SelectArray);
      }
    },

    // 接收数组，进行导出
    exportBasic(Array) {
      console.log("要导出的数据为:::::", Array);
      // 规整要导出的数据:::::
      let array = [];
      for (let i = 0; i < Array.length; i++) {
        let data = {
          序号: i + 1,
          负责人: Array[i].principal_text,
          备注: Array[i].remark,
        };
        array.push(data);
      }
      // 生成 sheet 表格 数据
      let sheet = XLSX.utils.json_to_sheet(array, {
        // 对导出内容进行相应的排序,手动排序。
        header: [
          "序号",
          "负责人",
          "备注",
        ],
      });
      // 生成导出表格
      let blob = sheet2blob(sheet);
      try {
        FileSaver.saveAs(
          new Blob([blob], {
            type: "application/octet-stream",
          }),
          "文件名称.xlsx" // 导出文件夹名称
        );
      } catch (e) {
        console.log(e);
      }
    },
     // ------------------------------------------------------- 查询 -------------------
   //分页函数
   handleTableChange(pagination) {
      this.pagination.current = pagination.current;
      this.pagination.pageSize = pagination.pageSize;
      this.queryParam.page = pagination.current;
      this.queryParam.size = pagination.pageSize;

      // 分页是基于查询条件进行的分页,点击分页函数后,查询条件不变
      let queryPath = this.getQueryPath();
      this.getJianGenPaiShiList(queryPath);
    },
    //获取 查询条件 当前页数  + 查询条件
    getQueryPath() {
      let queryPath =
        "?pageNo=" +
        this.queryParam.page +
        "&beginDate=" +
        this.startTime +
        "&endDate=" +
        this.endTime +
        "&operation=" +
        this.form.operation;

      return queryPath; // 返回的查询条件
    }, 
   // ----------------- 导出结束 ----------------
   // 获取查询列表
    getPrecultureList(queryPath = "?pageNo=1") {
      this.dataSource = []; // 重置 table 的 dataSource 数据
      imHttp.getPrecultureList(queryPath).then((res) => {
        // 设置分页
        const pagination = { ...this.pagination };
        pagination.total = res.result.total;
        pagination.pageSize = res.result.size;
        pagination.current = res.result.current;
        this.pagination = pagination;

         if (this.fristTag) {
          this.maxSize = res.result.total;
          console.log("最大数量为::::", this.maxSize);
          this.fristTag = false;
        }

        // 渲染数据,把接收的数据渲染到table中
        this.dataSource = res.result.records;
        for (let i = 0; i < res.result.records.length; i++) {
          this.dataSource[i].key =
            (res.result.current - 1) * res.result.size + i + 1;
        }
      });
    },