<template>
  <div class="app-container">
    <el-form v-model="dto" inline>
      <el-row>
        <el-form-item label="收件时间">
          <el-date-picker
            v-model="dto._Range_ReceiveTime"
            type="daterange"
            range-separator="~"
            value-format="yyyy-MM-dd"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          />
        </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="DownloadLogs()" :loading="loading"
            >导出日志文件</el-button
          >
        </el-form-item>
      </el-row>
    </el-form>
    <div id="table" v-if="isxlsx">
      <el-table :data="excelData" style="width: 100%">
        <el-table-column
          v-for="(value, key, index) in excelData[2]"
          :key="index"
          :prop="key"
          :label="key"
        ></el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script>
import axios from "axios";
import XLSX from "xlsx";
import { exportExcelNew } from "@/utils/filedown";
import BaseList from "@/components/Xyy/baselist";
import { DownloadTraces } from "@/api/tracking/onlinetrack";
import { getToken } from "@/utils/auth";
export default {
  name: "ExpressLineLogs",
  components: { "base-list": BaseList },
  data() {
    return {
      isxlsx: false,
      excelData: [],
      loading: false,
      dto: {
        _Range_ReceiveTime: null,
      },
    };
  },
  methods: {
    DownloadLogs() {
      if (this.dto._Range_ReceiveTime == null) {
        this.$message({
          message: "收货时间必须填写！",
          type: "warning",
        });
        return false;
      }
      //   window.open("https://view.officeapps.live.com/op/view.aspx?src=https://wms.xingyunyi.cn/"+"/Order/DownloadTraces?startTime=" +
      //       this.dto._Range_ReceiveTime[0] +
      //       "&endTime=" +
      //       this.dto._Range_ReceiveTime[1],
      //     "_blank"
      //   );
      //   const QueryParamer = [];
      //   QueryParamer.push({
      //     Filed: "ReceiveTime",
      //     Value: this.dto._Range_ReceiveTime[0],
      //     Method: "GrE",
      //   });
      //   QueryParamer.push({
      //     Filed: "ReceiveTime",
      //     Value: this.dto._Range_ReceiveTime[1],
      //     Method: "LeE",
      //   });
      //   this.dto.QueryParamer = QueryParamer;
      this.loading = true;
      DownloadTraces(
        this.dto._Range_ReceiveTime[0],
        this.dto._Range_ReceiveTime[1]
      )
        .then((res) => {
          const url =
            "https://view.officeapps.live.com/op/view.aspx?src=https://wms.xingyunyi.cn/" +
            res;
            console.log(url);
          window.open(url, "_blank");
          
        })
        .finally(() => {
          this.loading = false;
        });
      //   exportExcelNew(
      //     process.env.VUE_APP_BASE_API + "/Order/DownloadTraces",
      //     this.dto,
      //     "post"
      //   ).finally(() => {
      //     this.loading = false;
      //   });
      //   exportExcelNew(
      //     process.env.VUE_APP_Tracking_API + "/api/TrackingTraces/DownloadTraces",
      //     this.dto,
      //     "post"
      //   ).finally(() => {
      //     this.loading = false;
      //   });
      //   axios({
      //     method: "post",
      //     headers:"token "+getToken(),
      //     url:process.env.VUE_APP_BASE_API+"/Order/DownloadTraces",
      //     data: this.dto,
      //     responseType: "blod",
      //   })
      //     .then((response) => {
      //       console.log(response);
      //       const data = new Uint8Array(response.data);
      //       const workbook = XLSX.read(data, { type: "array" });
      //       const worksheet = workbook.Sheets[workbook.SheetNames[0]];
      //       this.excelData = XLSX.utils.sheet_to_json(worksheet);//, { header: 1 }
      //       console.log(this.excelData);
      //       this.isxlsx = true;
      //     })
      //     .catch((error) => {
      //       console.log(error);
      //     })
      //     .finally(() => {
      //       this.loading = false;
      //     });
    },
  },
};
</script>
