<template>
  <el-dialog :visible.sync="visible" title="批量发货" width="510px" @closed="$emit('close')">
    <div>
      <span><span style="color:#FF5152;margin-right:5px">*</span>导入文件：</span>
      <dm-upload-file
        class="ml10 upload"
        action="/api-welfare/delivery-order/batch-delivering"
        width="70px"
        :show-file-list="true"
        :limit="1"
        accept=".xls,.xlsx"
        with-credentials
        :headers="uploadHeader"
        style="display:inline-block;">
        <span slot="tip"></span>
        <el-button icon="iconfont-components4 icon-cp-shangc upload-icon">上传</el-button>
      </dm-upload-file>
      <el-link class="ml20" type="primary" href="/static/批量发货模板.xlsx">下载批量发货的模版</el-link>
    </div>
    <div class="mt10" style="margin-left:90px">
      成功<span style="color:#2f54eb">{{successCount}}</span>条，失败<span style="color:#F5222d">{{failedCount}}</span>条
    </div>
    <el-divider></el-divider>
    <div style="color:#909399;font-size:12px">1.填入需要发货的发货单号、物流公司名称、物流公司编码、物流单号；</div>
    <div style="color:#909399;font-size:12px;margin-top:8px">2.仅支持.xlsx .xls的文件导入，最多1000条信息，文件大小不超过2M；</div>
    <div slot="footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="handleConfirm">确认</el-button>
    </div>
  </el-dialog>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      visible: false,
      successCount: 0,
      failedCount: 0,
      uploadHeader: {
        isControl: true,
      },
    };
  },
  mounted() {
    let header = axios.defaults.headers.common;
    this.uploadHeader = {
      ...this.uploadHeader,
      project: header.project,
      route: header.route,
      sign: header.sign
    };
    this.visible = true;
  },
  methods: {
    handleConfirm() {
      this.visible = false;
    },
  }
};
</script>
<style lang="scss" scoped>
/deep/ .el-divider--horizontal {
  margin: 16px 0;
  margin-top: 20px;
}
.upload {
  /deep/ .el-button {
    border-style: dashed;
  }
}
</style>
