<template>
  <div class="table-wrapper">
    <header ref="tableWrapperHeader" class="table-header-wrapper">
      <SecurityCheckHeader
        title="运单管理"
        :with-change-button="false"
        :with-date-picker="false"
        :with-select="false"
        :with-input="true"
        :agentShow="false"
        :withInputer="true"
        searchPlaceholder="请输入运单编号查询"
        @search="searchHandler"
        @exportex="exportex"
      />
    </header>
    <main>
      <SecurityCheckTable
        id="table2"
        :table-cols="tableCols"
        :table-data="tableData"
        row-key="index"
        :height="tableHeight"
        show-summary
        :pagination="pagination"
        :loading="loading"
        @handleTableChange="handleTableChange"
      />
      <!-- <PrintTable
        v-show="false"
        :table-cols="tableCols"
        id="2"
        :table-data="tableDataPrint"
        row-key="index"
        :height="tableHeight"
        show-summary
        :loading="false"
      /> -->
    </main>
  </div>
</template>

<script>
import SecurityCheckHeader from '../components/securityCheckHeader.vue'
import PrintTable from '../components/securityCheckTable.vue'
import SecurityCheckTable from '../components/securityCheckTableWaybill.vue'
import { waybill, waybilleclex } from '@/api/statistics/statistics.js'
import XLSX from 'xlsx'
import FileSaver from 'file-saver'
export default {
  components: { SecurityCheckHeader, SecurityCheckTable, PrintTable },
  data() {
    return {
      printTableId: 'printTableId',
      loading: false,
      pagination: {
        showSizeChanger: true,
        showQuickJumper: true,
        total: 0, //数据总数
        pageSize: 20,
        current: 1,
        showTotal: (total) => {
          return `共${total}条`
        },
      },
      tableHeight: '50vh',
      tableCols: [
        {
          dataIndex: 'waybillNo',
          key: 'waybillNo',
          title: '运单编号',
          width: 125,
        },
        {
          dataIndex: 'mwbNo',
          key: 'mwbNo',
          title: '航空主运单编号',
          width: 125,
        },
        {
          dataIndex: 'hwbNo',
          key: 'hwbNo',
          title: '航空分运单编号',
          width: 125,
        },
        {
          dataIndex: 'goodsName',
          key: 'goodsName',
          title: '品名描述',
          width: 125,
        },
        {
          dataIndex: 'agentCode',
          key: 'agentCode',
          title: '交货发货代理人',
          width: 155,
        },
        {
          dataIndex: 'agentLevel',
          key: 'agentLevel',
          title: '代理人诚信等级',
          width: 125,
        },
        {
          dataIndex: 'origin',
          key: 'origin',
          title: '始发站',
        },
        {
          dataIndex: 'destination',
          key: 'destination',
          title: '目的地机场',
        },
        {
          dataIndex: 'flightNo',
          key: 'flightNo',
          title: '航班号',
        },
        {
          dataIndex: 'riskRating',
          key: 'riskRating',
          title: '综合风险等级',
          width: 120,
        },
        {
          dataIndex: 'riskClassification',
          key: 'riskClassification',
          title: '货物风险等级',
          width: 120,
        },
        {
          dataIndex: 'checkPoint',
          key: 'checkPoint',
          title: '安检通道号',
        },
        {
          dataIndex: 'goodsPieces',
          key: 'goodsPieces',
          title: '安检件数',
        },
        {
          dataIndex: 'goodsWeight',
          key: 'goodsWeight',
          title: '重量',
          width: 70,
        },
      ],
      FormData: {
        waybillNo: '', //运单号
        destination: '', // 目的站
        agentCode: '', // 代理人ID
        agentLevel: '', // 代理人信用等级 A\B\C\D
        riskRating: '', // 综合风险等级评估 低风险\优先\普通\高风险\严控
        startTime: '', //开始时间
        endTime: '', // 结束时间
        openResult: '', //  开箱结果
        riskClassification: '', //货物风险等级 高风险\低风险\普通
        pageNum: '1', //** 当前记录起始索引 */
        pageSize: '20', // /** 每页显示记录数 */
      },
      tableData: [],
      tableDataPrint: [],
    }
  },
  created() {},
  mounted() {
    this.setTableHeight()
    window.addEventListener('resize', this.setTableHeight)
  },
  activated() {
    let queryData = this.$route.params
    const {
      waybillNo,
      destination,
      agentCode,
      agentLevel,
      riskRating,
      startTime,
      endTime,
      openResult,
      riskClassification,
    } = queryData
    this.FormData = {
      waybillNo: waybillNo,
      destination: destination,
      agentCode: agentCode,
      agentLevel: agentLevel,
      riskRating: riskRating,
      startTime: startTime,
      endTime: endTime,
      openResult: openResult,
      riskClassification: riskClassification,
      pageNum: '1',
      pageSize: '20',
    }
    if (queryData) {
      this.getData()
      // this.getPrintData()
    }
  },
  beforeDestroy() {
    window.removeEventListener('resize', this.setTableHeight)
  },
  methods: {
    // //导出
    // async exportex() {
    //   let that = this
    //   this.$confirm({
    //     title: '是否确认导出',
    //     content: '是否确认导出',
    //     onOk() {
    //       return waybilleclex(that.FormData).then((response) => {
    //         that.download(response.msg)
    //         that.$message.success('导出成功')
    //       })
    //     },
    //   })
    //   // this.downlodTable()
    // },
    // //导出
    // downlodTable() {
    //   this.$confirm('是否需要导出xlsx文档, 是否继续?', '提示', {
    //     confirmButtonText: '确定',
    //     cancelButtonText: '取消',
    //     type: 'warning',
    //   })
    //     .then(() => {
    //       // this.downFile()
    //       this.$message({
    //         type: 'success',
    //         message: '导出成功!',
    //       })
    //     })
    //     .catch(() => {
    //       this.$message({
    //         type: 'info',
    //         message: '已取消导出',
    //       })
    //     })
    // },
    //导出
    async exportex() {
      this.downFile()
    },
    downFile() {
      var wb = XLSX.utils.table_to_book(document.querySelector('#table2'))
      var wbout = XLSX.write(wb, {
        bookType: 'xlsx',
        bookSST: true,
        type: 'array',
      })
      try {
        FileSaver.saveAs(
          new Blob([wbout], {
            type: 'application/octet-stream',
          }),
          '运单统计.xlsx'
        )
      } catch (e) {
        if (typeof console !== 'undefined') console.log(e, wbout)
      }
      return wbout
    },
    async getPrintData() {
      try {
        let queryData = JSON.parse(JSON.stringify(this.FormData))
        queryData.pageNum = '1'
        queryData.pageSize = '1000'
        const result = await waybill(queryData)
        if (result.code === 200) {
          this.tableDataPrint = result.data.list
        }
      } catch (error) {
        console.log(error)
      }
    },
    searchHandler(arr) {
      this.FormData.waybillNo = arr[0]
      if (this.$route.params) {
        this.getData()
      }
    },
    setTableHeight() {
      const topBarHeight = 80
      const headerHeight = this.$refs['tableWrapperHeader'].offsetHeight
      const footerBlackHeight = 24
      this.tableHeight = `calc(100vh - ${topBarHeight + headerHeight + footerBlackHeight}px -20px)`
    },
    async getData() {
      try {
        this.loading = true
        const result = await waybill(this.FormData)
        if (result.code === 200) {
          const pagination = { ...this.pagination }
          pagination.total = result.data.total
          this.pagination = pagination
          this.tableData = result.data.list
          this.loading = false
        }
      } catch (error) {
        console.log(error)
      }
    },
    handleTableChange(data) {
      this.pagination.current = data.current
      this.pagination.pageSize = data.pageSize
      this.FormData.pageNum = data.current + ''
      this.FormData.pageSize = data.pageSize + ''
      this.getData()
    },
  },
}
</script>

<style lang="scss" scoped>
.table-wrapper {
  padding: 0 24px;

  .table-header-wrapper {
    padding-top: 24px;
  }
}
</style>
