<template>
  <CommonBarStatisticsCharts charts-title="航线平均旅客行李量" :rol="rol" :query-settings="querySettings" :form-data="formData" :form-items="formItems" />
</template>

<script>
import CommonBarStatisticsCharts from '../../components/newBarStatisticsCharts.vue'
import { mapGetters } from 'vuex'
import { Query } from '@/api/webApi'
import { parseTime } from '@/utils'

export default {
  name: 'WorkloadStatisticsCharts',
  components: { CommonBarStatisticsCharts },
  data () {
    const that = this
    return {
      querySettings: {
        serviceid:'',
        seriesKey: 'workload',
        xAxisKey: 'fd',
      },
      formData: {
        td: '日',
        // agent_number: '',
        // airport: '',
        line: '',
        status: '',
        dateTime: [],
      },
      rol: 'avgbag',
      formItems: [
        {
          prop: 'td',
          inputType: 'select',
          placeholder: '时间维度',
          requiredWarning: '请先选择统计时间维度',
          options: [
            {
              value: '日',
              label: '按日统计',
            },
            {
              value: '月',
              label: '按月统计',
            },
            {
              value: '年',
              label: '按年统计',
            },
          ],
          changeHandler (value, oldValue) {
            const typeMap = {
              日: 'datePicker',
              月: 'monthPicker',
              年: 'yearPicker',
            }
            const dateTimeItem = this.formItems.find(
              item => item.prop === 'dateTime'
            )
            const formData = this._.cloneDeep(this.formData)
            if (dateTimeItem) {
              dateTimeItem.inputType = typeMap[value]
              const dateTime = formData.dateTime
              if (dateTime && dateTime[0] && dateTime[1]) {
                if (value === '年') {
                  this.formData.dateTime[0] = dateTime[0].split('-')[0]
                  this.formData.dateTime[1] = dateTime[1].split('-')[0]
                }
                if (value === '月') {
                  if (oldValue === '年') {
                    this.formData.dateTime[0] = `${dateTime[0].split('-')[0]
                      }-01`
                    this.formData.dateTime[1] = `${dateTime[1].split('-')[0]
                      }-12`
                  }
                  if (oldValue === '日') {
                    this.formData.dateTime[0] = dateTime[0]
                      .split('-')
                      .slice(0, 2)
                      .join('-')
                    this.formData.dateTime[1] = dateTime[1]
                      .split('-')
                      .slice(0, 2)
                      .join('-')
                  }
                }
                if (value === '日') {
                  if (oldValue === '年') {
                    this.formData.dateTime[0] = `${dateTime[0].split('-')[0]
                      }-01-01`
                    this.formData.dateTime[1] = `${dateTime[1].split('-')[0]
                      }-12-31`
                  }
                  if (oldValue === '月') {
                    this.formData.dateTime[0] = `${dateTime[0]
                      .split('-')
                      .slice(0, 2)
                      .join('-')}-01`
                    let [year, month] = dateTime[1].split('-')
                    if (month === '12') {
                      year = Number(year) + 1
                      month = 1
                    } else {
                      month = Number(month) + 1
                    }
                    const day = 24 * 60 * 60 * 1000
                    this.formData.dateTime[1] = parseTime(
                      new Date(`${year}-${month}-01`) - day * 1,
                      '{y}-{m}-{d}'
                    )
                  }
                }
              }
            }
          },
        },
        {
          prop: 'line',
          inputType: 'select',
          placeholder: '航线',
          filterable: true,
          queryId: 75,
          setKey: 'air_line',
          requiredWarning: '请先选择航线',
          options: [],
        },{
          prop: 'status',
          inputType: 'select',
          placeholder: '全部',
          requiredWarning: '请先选择行李状态',
          filterable: true,
          options: [{
              value: '正常',
              label: "正常",
            },{
              value: '取消',
              label: "取消",
            },{
              value: '全部',
              label: "全部",
            }],
        },
        {
          prop: 'dateTime',
          inputType: 'datePicker',
          width: '240px',
          requiredWarning: '请先选择时间范围',
        },
      ],
    }
  },
  computed: {
    ...mapGetters(['authArrs']),
  },
  mounted() {
    this.pageInit()
  },
  methods: {
    //页面初始化
    pageInit () {
      //获取页面查询参数
      const { query } = this.$route
      this.pageQuery = query
      //获取页面配置
      const { pagecode, qid, auth_id } = this.$route.meta
      //获取页面权限类型组件  pagetype 1模块  2页面  3按钮 4表格 5树形  6弹窗 
      const pageAuths = this.authArrs
      if (!pageAuths.length) return
      //获取当前页面权限类型
      const pageAuthArrs = pageAuths.filter(item => item['superiorid'] == auth_id)
      if (!pageAuthArrs.length) return
      // console.log(pageAuthArrs)
      this.querySettings.serviceid = pageAuthArrs[0].serviceid
    },
    async getAgentOptions (airport) {
      try {
        const { code, returnData, message } = await Query({
          serviceId: SERVICE_ID.agentCode,
          dataContent: [
            {
              airport,
            },
          ],
        })
        if (String(code) === '0') {
          const listValues = returnData.listValues || returnData
          // this.formItems[2].options = listValues.map(element => ({
          //   label: element.agent_number,
          //   value: element.agent_number,
          // }))
        } else {
          this.$message.error(message)
        }
      } catch (error) {
        this.$message.error('失败')
      }
    },
  },
}
</script>
