<template>
    <div>
        <el-drawer
        title="文件查看"
        :visible.sync="isShowDrawer"
        :before-close="handleClose"
        :with-header="true">
        <div class="proList" style="padding:0 10px;">
            【商品一键导入】失败的商品文件列表
             <el-table
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%;margin-top:20px;"
        height="86vh"
         stripe
         v-loading="loading"
      >
        <el-table-column type="index" width="70" label="序号" align="center"></el-table-column>
        <el-table-column prop="excelName" label="文件名称" align="center"></el-table-column>
        <el-table-column prop="addTime" label="导入时间" align="center"></el-table-column>
        <el-table-column prop="spuId" label="操作" align="center">
          <template slot-scope="scope">
              <div>
                <a v-if="scope.row.id" :href="exportMain(scope.row.id)">下载</a>
                <!-- <a v-if="scope.row.id" :href="'/api/excel/createExcelList?' 
                + 'token='+params.token + '&brandId=' + params.brandId + '&id='+ scope.row.id">下载2</a> -->
              </div>
            </template>
        </el-table-column>
        </el-table>
         <!-- <pagination
          @eventSizeChange="eventSizeChange"
          @eventCurrentChange="eventCurrentChange"
          :total="total"
          :pagerCount="5"
          :pageSize="params.pageSize"
          :pageNum="params.pageNum"
          :layout="'total, prev, pager, next'"
        ></pagination> -->
        </div>
    </el-drawer>
    </div>
</template>
<script>
import pagination from "@/components/common/pagination";
import qs from 'qs'
export default {
    name:'dialogaddpro',
    data(){
        return {
            isShowDrawer:false,
            formSearch:{
                name:''
            },
            // tableData:[],
            params: {
                // pageSize: 10,
                // pageNum: 1,
                // search: "",
                // status: 10,
                // brandId: "",
                // templateId: "",
                // supplierId: "",
                // beginTime: "",
                // endTime:''
            },
            total:0,
            selection:[],
            loading:false,
            token:''
        }
    },
    components:{
        pagination
    },
    computed: {
        exportMain(id){
            return function(id) {
                var info = localStorage.getItem('info') == "" ? "" : JSON.parse(localStorage.getItem('info'));
                var token = info && info.token ? info.token : '';
                var params = {};
                params.token = token;
                params.brandId = info.brandId;
                params.id = id
                let dataparams = qs.stringify(params);
                return '/api/excel/createExcelList?' + dataparams;
            }
            
        },
    },
    props:{
        dialogData:{
            type:Object,
            default: ()=>{ return {} }
        },
        tableData:{
            type:Array,
            default:()=>{ return []}
        }
        
    },
    watch:{
        dialogData:{
            deep:true,
            handler: function(value) {
                this.isShowDrawer =value.isShowDrawer
            }
        }
    },
    mounted(){
        this.isShowDrawer =this.dialogData.isShowDrawer
        var info = localStorage.getItem('info') == "" ? "" : JSON.parse(localStorage.getItem('info'));
        this.params.token = info && info.token ? info.token : '';
        this.params.brandId = info.brandId
        // this.getData()
    },
    methods:{
        handleClose(done) {
            this.$emit('resData',false)
            done();
      },
        getData() {
            this.loading = true
            // this.$axios.post("/product/list", this.params).then(res => {
            //     let { data, code } = res.data;
            //     if (code == 200) {
            //     if(data && data.list && data.list.length>0){
            //         this.total = parseInt(data.total);
            //         this.tableData =data.list
            //         }else{
            //         this.tableData =[]
            //         this.total =0
            //         }
            //     }
            //     this.loading = false;
            // });
        },
          onSearch() {
            this.params.pageNum = 1;
            this.getData();
        },

       
        eventSizeChange(e) {
            this.params.pageSize = e;
            this.getData();
        },
        eventCurrentChange(e) {
            this.params.pageNum = e;
            this.getData();
        },
    }
}
</script>
<style lang="scss">
    
</style>