<template>
  <div>
    <div style="display: inline-block;">
      <span>状态：</span>
      <el-select
        v-model="state"
        style="width:150px;margin-left: 10px;"
        @change="select"
        :clearable="true"
      >
        <el-option
          v-for="item in statesnum2"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option> </el-select
      >
      <div style="margin:5px;display: inline-block;">
        <span>开始时间：</span>
        <el-date-picker
          style="width: 220px;margin-left: 10px;"
          v-model="startTime"
          align="right"
          type="datetime"
          format="yyyy-MM-dd HH:mm:ss"
          value-format="yyyy-MM-dd HH:mm:ss"
          placeholder="选择开始时间"
        >
        </el-date-picker
        >&nbsp;&nbsp;&nbsp;
      </div>
      <div style="margin:5px;display: inline-block;">
        <span>截止时间：</span>
        <el-date-picker
          style="width: 220px;margin-left: 10px;"
          v-model="endTime"
          align="right"
          type="datetime"
          format="yyyy-MM-dd HH:mm:ss"
          value-format="yyyy-MM-dd HH:mm:ss"
          placeholder="选择截止时间"
        >
        </el-date-picker>
      </div>
      <el-button
        style="margin-left:15px;"
        size="mini"
        type="primary"
        icon="document"
        @click="select"
        >查询
      </el-button>
      <el-button
        style="margin-left:15px;"
        size="mini"
        type="primary"
        icon="document"
        @click="cleans"
        >重置
      </el-button>
      <el-button
        style="margin-left:15px;"
        size="mini"
        type="primary"
        icon="document"
        @click="refresh"
        >刷新
      </el-button>
    </div>
    <el-table v-loading="tableDataLoading" :data="duanxinData.list">
      <el-table-column fixed prop="complaintId" label="编号" width="100">
        <template slot-scope="scope">
          <span>{{ scope.$index + 1 }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="fileName" label="任务名称" align="center">
      </el-table-column>
      <el-table-column prop="updateTime" label="导出时间" align="center">
      </el-table-column>
      <el-table-column
        prop="exportId"
        label="导出id"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="conditionDetail"
        label="导出条件"
        align="center"
      >
      </el-table-column>
      <el-table-column
        prop="fileSize"
        label="文件大小/kb"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="sendFromShopName"
        label="状态"
        align="center"
      >
        <template slot-scope="scope">
          <span v-if="scope.row.flag==-1">导出中</span>
          <span v-if="scope.row.flag==0">待导出</span>
          <span v-if="scope.row.flag==1">导出完成</span>
          <span v-if="scope.row.flag==2">导出失败</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" width="150" align="center">
        <template slot-scope="scope" v-if="scope.row.flag==1">
          <el-button
            size="mini"
            type="primary"
            :disabled="!isAuth('downList:xiazai')"
            @click="downFile(scope.row)"
            style="margin: 5px;"
          >
            下载
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <div style="text-align: center;margin-top: 10px;">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="limit"
        :current-page="page"
        layout="total,sizes, prev, pager, next,jumper"
        :total="duanxinData.totalCount"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      limit: 10,
      page: 1,
      activeName: "first",
      tableDataLoading: false,
      dialogFormVisible: false,
      checkBoxData: [], //多选框选择的值

      startTime: "",
      endTime: "",
      filename: "",
      state: "",

      statesnum2:[
        {label:"待导出",value:0},
        {label:"导出完成",value:1},
        {label:"导出失败",value:2},
      ],
      duanxinData: []
    };
  },
  methods: {
    handleSizeChange(val) {
      this.limit = val;
      this.dataSelect();
    },
    handleCurrentChange(val) {
      this.page = val;
      this.dataSelect();
    },
    //处理默认选中当前日期
    getNowTime1() {
      var now = new Date();
      var year = now.getFullYear(); //得到年份
      var month = now.getMonth(); //得到月份
      var date = now.getDate(); //得到日期
      var hh = now.getHours() < 10 ? "0" + now.getHours() : now.getHours();
      var mm =
        now.getMinutes() < 10 ? "0" + now.getMinutes() : now.getMinutes();
      var ss =
        now.getSeconds() < 10 ? "0" + now.getSeconds() : now.getSeconds();
      month = month + 1;
      month = month.toString().padStart(2, "0");
      date = date.toString().padStart(2, "0");
      var defaultDate = `${year}-${month}-${date} ${hh}:${mm}:${ss}`;
      return defaultDate;
      this.$set(this.info, "stockDate", defaultDate);
    },
    getNowTime2() {
      var now = new Date();
      var year = now.getFullYear(); //得到年份
      var month = now.getMonth(); //得到月份
      var date = now.getDate(); //得到日期
      month = month + 1;
      month = month.toString().padStart(2, "0");
      date = date.toString().padStart(2, "0");
      var defaultDate = `${year}-${month}-${date}`;
      return defaultDate;
      this.$set(this.info, "stockDate", defaultDate);
    },
    //处理默认选中当前日期
    getNowTime() {
      var now = new Date();
      var year = now.getFullYear(); //得到年份
      var month = now.getMonth() - now.getMonth(); //得到月份
      var date = now.getDate() - now.getDate() + 1; //得到日期
      month = month + 1;
      month = month.toString().padStart(2, "0");
      date = date.toString().padStart(2, "0");
      var defaultDate = `${year}-${month}-${date}`;
      return defaultDate;
      this.$set(this.info, "stockDate", defaultDate);
    },
    // 查询
    select() {
      if(this.state==null){
        this.state=''
      }
      this.page = 1;
      this.limit = 10;
      this.dataSelect();
    },
    // 重置
    cleans() {
      // this.filename = "";
      this.state = "";
      this.startTime = "";
      this.endTime = "";
      this.page = 1;
      this.dataSelect();
    },
    refresh() {
      this.dataSelect();
    },
    // 获取派单数据列表
    dataSelect() {
      console.log(this.state);
      // if (this.endTime == '') {
      // 	  this.endTime = this.info2.stockDate2
      //   }
      //   if (this.startTime == '') {
      // 	  this.startTime = this.info.stockDate
      //   }
      this.tableDataLoading = true;
      var userId = this.$cookie.get('userId')
      this.$http({
        url: this.$http.adornUrl("admin/export/listByUser"),
        method: "get",
        params: this.$http.adornParams({
          curretPage: this.page,
          pageSize: this.limit,
          filename:'',// 文件名称
          userId:userId,
          state: this.state, //订单id
          startTime: this.startTime, //开始时间
          endTime: this.endTime, //结束时间
        })
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.tableDataLoading = false;
          let returnData = data.data;
          this.duanxinData = returnData;
          console.log(data.data,'导出文件列表');
        }
      });
    },
    // 下载文件
    downFile(row){
      var userId = this.$cookie.get('userId')
      this.$http({
        url: this.$http.adornUrl("admin/export/readBuffer"),
        method: "get",
        responseType: "blob",
        params: this.$http.adornParams({
          filename:row.fileName,// 文件名称
          userId:userId,
        })
      }).then(({ data }) => {
        console.log(data, "导出");
        let blob = new Blob([data], {
          type:
            "application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
        });
        if (window.navigator.msSaveOrOpenBlob) {
          navigator.msSaveBlob(blob);
        } else {
          let url = window.URL.createObjectURL(blob);
          let elink = document.createElement("a");
          elink.download = row.fileName;
          elink.style.display = "none";
          elink.href = url;
          document.body.appendChild(elink);
          elink.click();
          document.body.removeChild(elink);
        }
      });
    }
  },
  mounted() {
    this.dataSelect();
  },
};
</script>

<style></style>
