<template>
  <!-- 行李全流程服务水平百分比 -->
  <div class="statstics-wrapper">
    <StatisticsHeader title="行李全流程服务水平百分比" :items="formItems" :data.sync="formData" with-setting :withSetting="false" @export="exportup" @getFormData="getFormData" />
    <!-- <Tableformcp
      :isloadings="isloadings"
      :rows="12"
      label-width="140px"
      :min-height="70"
      width="800px"
      tableHeight="750"
    /> -->
    <Tableformbrs :data-id="dataId" upid="8" :textShow="textShow" :isloadings="isloadings" :data-content="dataContent" :rows="12" label-width="140px" :min-height="70" width="800px" tableHeight="750"/>
  </div>
</template>
<script>
import StatisticsHeader from '../../components/statisticsHeader.vue'
// import Tableformcp from "../../components/tableformcp";
import Tableformbrs from '../../components/tableformbrs'
import TableDialog from '../../components/TableDialog.vue'
import { Format } from '@/utils/validate'
export default {
  name: 'ReportStatistics',
  data () {
    return {
      textShow: null,
      formData: {
        airport: '',
        dateTime: [],
        company: '',
        timedim: '',
        trd: [],
      },
      isloadings: 1,
      dataContent: [],
      dataId: '1847',
      formItems: [
        {
          prop: 'dateTime',
          inputType: 'datePicker',
          clearable: true,
          width: '240px',
          options: [],
        },
      ],
      dialogFlag: false,
      dialogTitle: '',
      queryParams: [],
    }
  },
  components: {
    StatisticsHeader,
    // Tableformcp,
    Tableformbrs,
    TableDialog,
  },
  mounted () {
    this.dataContent = [
      this.formData.dateTime[0] || Format('yyyy-MM-dd', new Date()),
      this.formData.dateTime[1] || Format('yyyy-MM-dd', new Date()),
    ]
  },
  methods: {
    getFormData (data) {
      this.textShow = data.trd
      this.dataContent = [
        data.dateTime[0],
        data.dateTime[1]
      ]
    },
    exportup () {
      this.isloadings = this.isloadings += 1
    },
    cellClickHandler (row, column, cell, event) {
      if (
        column.property.includes('trans_bag') &&
        row[column.property] &&
        Number(row[column.property])
      ) {
        const queryParams = [
          this.formData.airport || 'PEK',
          row.fd || Format('yyyy-MM-dd', new Date()),
          row.fd || Format('yyyy-MM-dd', new Date()),
          ...Array(4).fill(this.formData.company || '国航'),
        ]
        const flow = column.property
          .split('_')
          .pop()
          .toUpperCase()
          .split('')
          .join('-')
        queryParams.push(...Array(4).fill(flow))
        queryParams.push(...Array(4).fill(null))
        const processMap = {
          need: '需中转',
          finish: '已中转',
          not: '未中转',
        }
        const process = processMap[column.property.split('_')[0]]
        queryParams.push(...Array(3).fill(process))
        // console.log(queryParams)
        this.queryParams = queryParams
        this.dialogTitle = column.label
        this.dialogFlag = true
      }
    },
  },
}
</script>
<style lang="scss" scoped></style>