基于ABP和Magicodes实现Excel导出操作

public class ExportActivityDto : EntityDto<Guid?>
{
    /// <summary>
    /// 姓名或微信昵称
    /// </summary>
    [Required]
    [ExporterHeader(DisplayName = "姓名或微信昵称")]
    public string Name { get; set; }

    /// <summary>
    /// 所在省市区
    /// </summary>
    [Required]
    [ExporterHeader(DisplayName = "所在省市区")]
    public string Address { get; set; }

    /// <summary>
    /// 手机号
    /// </summary>
    [Required]
    [ExporterHeader(DisplayName = "手机号")]
    public string Phone { get; set; }

    /// <summary>
    /// 年龄
    /// </summary>
    [Required]
    [ExporterHeader(DisplayName = "年龄")]
    public string Age { get; set; }

    /// <summary>
    /// 备注
    /// </summary>
    [ExporterHeader(DisplayName = "备注")]
    public string Remark { get; set; }
}

(2)IActivityAppService

public interface IActivityAppService : IApplicationService
{
    // 导出活动列表
    Task<ActionResult> ExportActivity();
}

(1)ActivityAppService

通过构造函数注入的方式，依赖注入IExcelExporter：

/// <summary>
/// 通过Excel导出活动报名信息
/// </summary>
/// <returns></returns>
public async Task<ActionResult> ExportActivity()
{
    var query = await _repository.GetQueryableAsync();
    var dto = ObjectMapper.Map<List<Activity>, List<ExportActivityDto>>(query.ToList());
    var result = await _excelExporter.ExportAsByteArray(dto);
    var fs  = new MemoryStream(result);

    return new XlsxFileResult(stream: fs, "活动报名信息表.xlsx");
}

(2)ActivityAutoMapperProfile

public class ActivityAutoMapperProfile : Profile
{
    public ActivityAutoMapperProfile()
    {
        CreateMap<Activity, ExportActivityDto>();
    }
}

(1)ActivityController

[HttpGet]
[Route("export-activity")]
public Task<ActionResult> ExportActivity()
{
    return _ActivityAppService.ExportActivity();
}

导出按钮相关的vue代码如下：

<el-button class="filter-item" size="mini" type="success" icon="el-icon-download" @click="handleExport()">导出</el-button>

导出函数的vue代码如下：

handleExport() {
  var that = this;
  that.$axios.get('/api/app/activity/export-activity').then(res => {
    this.$notify({
      title: '成功',
      message: '导出成功',
      type: 'success',
      duration: 2000
    });
    var blob = new Blob([res], {
      type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
    });
    let url = window.URL.createObjectURL(blob); //创建下载的链接
    let a = document.createElement("a"); //生成一个a标签
    a.setAttribute("href", url);
    a.setAttribute("download", that.$activityExcelName);
    a.style.display = "none"; //将a标签隐藏
    document.body.appendChild(a); //将a标签添加到body中
    a.click(); //触发a标签的点击事件
    window.URL.revokeObjectURL(url); //释放掉blob对象
    a.remove() //将a标签从body中移除
  }).catch(() => {
    this.$message({
      type: 'info',
      message: '没有权限导出'
    });
  });
  }

其中that.$axios.get中的get()代码如下：

get(url) {
  return new Promise((resolve, reject) => {
    axios.get(url, { responseType: "blob" })
      .then(response => {
        resolve(response.data)
      }, err => {
        // Message({
        //   message: err.error.message,
        //   type: 'error',
        //   duration: 5 * 1000
        // })
        reject(err)
      })
      .catch((error) => {
        reject(error)
      })
  })
}

说明：一定要特别注意加上responseType: "blob"，否则就会报文件格式或者文件扩展名无效的错误。自己尝试了下，换成responseType: "arraybuffer"也是可以的。

三.MagicodesIEXXXModule模块源码

 public class MagicodesIEExcelModule: AbpModule
{
    public override void ConfigureServices(ServiceConfigurationContext context)
    {
        context.Services.AddScoped<IExcelExporter, ExcelExporter>();
        context.Services.AddScoped<IExcelImporter, ExcelImporter>();
        context.Services.AddScoped<IExportFileByTemplate, ExcelExporter>();
        //TODO:处理筛选器
    }
}


public class MagicodesIECsvModule: AbpModule
{
    public override void ConfigureServices(ServiceConfigurationContext context)
    {
        context.Services.AddScoped<ICsvExporter, CsvExporter>();
        context.Services.AddScoped<ICsvImporter, CsvImporter>();
    }
}


public class MagicodesIEHtmlModule: AbpModule
{
    public override void ConfigureServices(ServiceConfigurationContext context)
    {
        context.Services.AddScoped<IHtmlExporter, HtmlExporter>();
    }
}


public class MagicodesIEPdfModule: AbpModule
{
    public override void ConfigureServices(ServiceConfigurationContext context)
    {
        context.Services.AddScoped<IPdfExporter, PdfExporter>();
    }
}


public class MagicodesIEWordModule: AbpModule
{
    public override void ConfigureServices(ServiceConfigurationContext context)
    {
        context.Services.AddScoped<IWordExporter, WordExporter>();
    }
}

参考文献：

[1]基础教程之导入学生数据：https://urlify.cn/neI7Vz

[2]基础教程之导出Excel：https://urlify.cn/yiei6f

[3]基础教程之导出Pdf收据：https://urlify.cn/7FjuA3

[4]在Docker中使用：https://github.com/dotnetcore/Magicodes.IE/blob/master/docs/4.在Docker中使用.md

[5]动态导出：https://github.com/dotnetcore/Magicodes.IE/blob/master/docs/5.动态导出.md

[6]多Sheet导入：https://github.com/dotnetcore/Magicodes.IE/blob/master/docs/6.多Sheet导入.md

[7]Csv导入导出：https://github.com/dotnetcore/Magicodes.IE/blob/master/docs/7.Csv导入导出.md

[8]Excel图片导入导出：https://urlify.cn/Ybyey2

[9]Excel模板导出之导出教材订购表：https://urlify.cn/vqyQnq

[10]进阶篇之导入导出筛选器：https://urlify.cn/Nzmmim

[11]Magicodes.IE之花式导出：https://urlify.cn/QRZRN3