element-ui的upload组件上传文件覆盖上一个文件

<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
    String path = request.getContextPath();
%>
<script>
    var bCodeList;
    $(function(){
        new Vue({
            el:"#bCodeList",
            data:{
                dialogCustomerPackageVisible:true,
                addNewloading:false,
                tableData: [],
            },
            created:function(){
                bCodeList = this;
            },
            methods: {
                showError:function(response, file, fileList){
                    if(response.code=="success"){
                        this.tableData = response.data;
                        this.$message.success(response.message);
                    }else{
                        this.fileList=new Array();
                        this.$message.error(response.message);
                    }
                },
                closeDialog:function(){
                    bCodeList.dialogCustomerPackageVisible = false;
                },
                // 移除文件之前
                beforeRemove(file, fileList) {
                    return this.$msgbox.alert(`确定移除 ${file.name}?`)
                },
                clearFiles:function () {
                    this.$refs['my-upload'].clearFiles();
                }
            }
        })
    })
</script>
<style>
    .codeDialog .el-dialog__body{
        padding:0px;
    }

    .codeDialog .el-dialog__header{
        padding:0px;
    }
    .codeDialog .rowStyle{
        height:50px;
    }
    .codeDialog .rowTitle{
        width:100px;
        color:#aaa;
        float:left;
        padding:10px;
    }
    .codeDialog .rowInput_1{
        float:left;
    }
    .el-upload__input{
        display: none!important;
    }
</style>

<div id="bCodeList">
    <template>
        <el-dialog class="codeDialog" title="" :visible.sync="dialogCustomerPackageVisible" width="900px" >

            <el-row style="padding-left:20px;height:55px;line-height:55px; box-shadow: darkgrey 0px 5px 8px -2px; background-color:#475669; color:#ffd04b; z-index:3000;">
                Code上传
            </el-row>
            <el-row type="flex" align="middle" gutter="8" style="margin-bottom:20px;margin-top: 15px" id="smartName" >
                <el-col :span="3" align="right">
                    <el-badge is-dot style="padding-top:5px;margin-right:10px;"></el-badge>
                    <span class="text-muted"  style="margin-right:10px;">上传文件</span>
                </el-col>
                <el-col :span="15">
                    <el-upload
                            class="upload-demo"
                            action="<%=path%>/manage/bdjh/code/ajax/uploadCodeExcel"
                            :limit="1"
                            accept=".xls,.xlsx"
                            :on-success="showError"
                            :before-remove="beforeRemove"
                            ref="my-upload"
                    >
                        <el-button type="primary" size="mini" @click="clearFiles" style="width:120px">选择本地文件</el-button>
                        <span style="margin-left: 20px">目前仅支持xlsx和xls文件格式</span>
                    </el-upload>
                </el-col>
            </el-row>
            <template>
                <el-table
                        :data="tableData"
                        stripe
                        :row-style="{height:'70px'}"
                        style="width: 100%; margin-top:0px;" height="calc(70vh - 233px)">
                    <el-table-column
                            prop="platformName"
                            label="媒体"
                            align ="center"
                            width="100">
                    </el-table-column>
                    <el-table-column
                            prop="platformId"
                            label="媒体ID"
                            align ="center"
                            width="100">
                    </el-table-column>
                    <el-table-column
                            prop="adId"
                            label="计划ID"
                            align ="center"
                            width="180">
                    </el-table-column>
                    <el-table-column
                            prop="activityCode"
                            label="code">
                    </el-table-column>
                    <el-table-column
                            prop="isError"
                            label="失败个数">
                    </el-table-column>
                    <el-table-column
                            prop="msg"
                            label="失败原因">
                    </el-table-column>

                </el-table>
            </template>
            <!-- 页底 -->
            <el-row style="height:50px;background-color:#fafafa;border-top:1px solid #ddd;padding-left:20px;padding-top:8px;">
                <el-button  size="mini" type="primary" @click="closeDialog" style="width:15%;float: right;margin-right: 15px;">确认</el-button>
            </el-row>
        </el-dialog>
    </template>
</div>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值