avue 按时间导出excel

需求

现状：后端web端商城订单查询支持列表根据用户搜索条件，列表展示对应的内容但不支持条件搜索导出。
优化内容： 根据时间的搜索条件导出。

编码过程

前端：

html:

      <avue-crud
        ref="crud"
        v-model="form"
        :page.sync="page"
        :data="tableData"
        :permission="permissionList"
        :table-loading="tableLoading"
        :option="tableOption"
        @on-load="getPage"
        @refresh-change="refreshChange"
        @row-update="handleUpdate"
        @row-save="handleSave"
        @row-del="handleDel"
        @sort-change="sortChange"
        @search-change="searchChange"
        @date-change="dateChange"
      >
        <template slot="menuLeft">
          <el-button
            type="primary"
            icon="el-icon-download"
            size="small"
            @click="handleExport"
            >导出订单</el-button
          >
        </template>

js：对应@click="handleExport"方法

    /** 导出按钮操作 */
    handleExport() {
    
    
      this.download(
        "mall/orderinfo/export",
        {
    
    
          ...this.paramsSearch,//请求参数
        },
        `order_${
      
      new Date().getTime()}.xlsx`
      );
    },

可以看出事通过this.paramsSearch来进行前后端传参的，因此，找到时间对应的dateChange方法，如下所示:

    dateChange(date) {
    
    
      if (date) {
    
    
        this.date = date;

      } else {
    
    
        this.date = [];
      }
      this.getPage(this.page);
    },

加上时间请求参数即可：

    dateChange(date) {
    
    
      if (date) {
    
    
        this.date = date;
        this.paramsSearch.beginTime=this.date[0];
        this.paramsSearch.endTime=this.date[1];
      } else {
    
    
        this.date = [];
      }
      this.getPage(this.page);
    },