vue-Excel导入对话框模板

vue-Excel导入对话框模板

更新历史

名称	内容
创建时间	2021-10-18
更新时间	2021-10-18
变更次数	0

功能清单

• 提供基于对话框的excel导入功能
• 配置基本定制内容
• 通过回调方法处理定制内容
• 通过方法设置导入结果的显示

<!--
version: 1.0
date: 2021-10-18
update:
author: Petty Fox
function: 提供基于对话框的excel导入功能

属性配置：
- allowType:配置允许的文件类型
- title:对话框标题
- allowType:配置允许的文件类型
- importDesc:导入框描述
- maxSize:最大字节数

回调方法：
- clickDownTemp(): 点击下载模板
- handleUpload({file:file}): 处理上传的文件,用axios接口调用上传
- update(): 导入完成后点击

方法：
- setResult 导入结果
- setResultError 导入错误
-->
<template>
    <el-dialog
            :close-on-click-modal="false"
            :title="title"
            top="10vh"
            destroy-on-close
            :visible.sync="dialogVisible"
            width="50%">
        <div class="import-layout">
            <el-steps :active="activeStatus" finish-status="success">
                <el-step title="导入文件" icon="el-icon-upload"></el-step>
                <el-step title="导入中" icon="el-icon-top"></el-step>
                <el-step title="导入完成"></el-step>
            </el-steps>
            <div>
                <el-upload
                        v-if="activeStatus === 0"
                        style="text-align: center;margin-top:20px;"
                        drag
                        :show-file-list="false"
                        :before-upload="uploadBefore"
                        action="https://jsonplaceholder.typico