import { randomString } from '@/utils'
/**
 *设置游客数据
 *
 * @export
 * @param {*} list 游客列表
 * @param {*} num 数量
 * @param {*} data 身份证信息
 */
export function setPictureRemarks (list, num, data) {
  // 数量为0，不做处理
  if (num === 0) {
    return
  }

  // 数量为负，减少列表数量
  if (num < 0) {
    list.splice(num)
    return
  }

  // 身份证信息
  if (data) {
    // 游客信息
    const pictureRemarks = {
      idKey: randomString(),
      url: '',
      remark: ''
    }

    let index = list.findIndex(item => {
      return item.url === ''
    })

    if (index > -1) {
      list.splice(index, 1, pictureRemarks)
      return
    }

    // 加入列表
    list.push(pictureRemarks)
    return
  }

  for (let i = 0; i < num; i++) {
    list.push({
      idKey: randomString(),
      url: '',
      remark: ''
    })
  }
}
export function setTourist (list, num, data) {
  // 数量为0，不做处理
  if (num === 0) {
    return
  }

  // 数量为负，减少列表数量
  if (num < 0) {
    list.splice(num)
    return
  }

  // 身份证信息
  if (data) {
    // 游客信息
    const tourist = {
      idKey: randomString(),
      guestName: data.Name,
      guestPhone: '',
      guestIdentify: data.IDNumber,
      guestIdentifyType: 0,
      lock: true // 刷卡信息不可编辑
    }

    // 已存在身份证不操作
    let existInfo = list.find(item => {
      return data.IDNumber === item.guestIdentify
    })
    if (existInfo) return

    let index = list.findIndex(item => {
      return item.guestIdentify === ''
    })

    if (index > -1) {
      list.splice(index, 1, {
        ...list[index],
        guestName: data.Name,
        guestIdentify: data.IDNumber
      })
      return
    }

    // // 只有一个游客信息时，刷卡时更新空白信息
    // if (list.length === 1 && list[0].guestIdentify === '') {
    //   list.splice(0, 1, tourist)
    //   return
    // }

    // 加入列表
    list.push(tourist)
    return
  }

  for (let i = 0; i < num; i++) {
    list.push({
      idKey: randomString(),
      guestName: '',
      guestPhone: '',
      guestIdentify: '',
      guestIdentifyType: 0,
      lock: false // 是否可编辑
    })
  }
}

// 绑定按键操作
export function BindKeyControl (vue) {
  this.currentIndex = 0
  // 初始化可通过键盘控制的组件
  this.componentsArr = []

  // 筛选出能键盘控制的组件
  getKeyControlComponents(vue, this.componentsArr)

  // 根据 keyControl的值进行排序
  this.componentsArr.sort((a, b) => {
    return a.$data.keyControl - b.$data.keyControl
  })

  // 默认选中第一个组件
  this.componentsArr[0].isFocus = true

  // 鼠标事件
  const mouseListener = (e) => {
    let tags = ['INPUT', 'BUTTON']

    // e.stopPropagation()
    this.componentsArr.forEach((com, index) => {
      // 判断当前点击的是哪个组件
      if (com.$el.contains(e.target)) {
        this.componentsArr.forEach((i, idx) => {
          // 是否需要一点击空白处就触发焦点呢？？
          if (idx !== index) {
            i.isFocus = false
          } else {
            i.isFocus = true
          }
        })

        // 设置当前序号
        this.currentIndex = index
        // 如果是非表单元素，则设置组件焦点
        if (tags.indexOf(e.target.tagName) > -1 || e.target.className.indexOf('checkbox') > -1) return
        console.log(e.target.tagName)
        // 首次获得焦点时，触发组件focus
        com.setFocus && com.setFocus()
      }
    })
  }

  // 键盘事件
  const keyListener = (e) => {
    console.log(e.code)
    const currentComponent = this.componentsArr[this.currentIndex]
    const activeElement = document.activeElement.tagName
    // 非input元素
    if (activeElement !== 'INPUT') {
      // 预留
    }

    switch (e.code) {
      // f1回到第一个组件
      case 'F1':
        this.currentIndex = 0
        this.setFocus()
        break
      // 组件上下键事件
      case 'PageUp':
        currentComponent.PageUp && currentComponent.PageUp()
        break
      case 'PageDown':
        currentComponent.PageDown && currentComponent.PageDown()
        break
      // 组件上下键事件
      case 'ArrowUp':
        currentComponent.arrowUp && currentComponent.arrowUp()
        break
      case 'ArrowDown':
        currentComponent.arrowDown && currentComponent.arrowDown()
        break
      case 'Enter':
        currentComponent.handleEnter && currentComponent.handleEnter(this)
        break
    //   case 'ArrowRight':
    //     this.currentIndex++
    //     if (this.currentIndex > this.componentsArr.length - 1) {
    //       this.currentIndex = 0
    //     }
    //     break
    //   case 'ArrowLeft':
    //     this.currentIndex--
    //     if (this.currentIndex < 0) {
    //       this.currentIndex = this.componentsArr.length - 1
    //     }
    //     break
    }
  }

  document.addEventListener('mouseup', mouseListener)
  document.addEventListener('keyup', keyListener)

  this.removeEvents = function () {
    document.removeEventListener('mouseup', mouseListener)
    document.removeEventListener('keyup', keyListener)
  }

  // 设置组件焦点
  this.setFocus = () => {
    let currentCom = this.componentsArr[this.currentIndex]
    this.componentsArr.forEach(i => { i.isFocus = false })
    this.componentsArr[this.currentIndex].isFocus = true
    currentCom.setFocus && currentCom.setFocus()
  }
}

// 收集所有能键盘控制的组件
function getKeyControlComponents (RootEle, componentsArr) {
  let children = RootEle.$children
  if (children.length > 0) {
    children.forEach(item => {
      if (item.$data.keyControl) {
        componentsArr.push(item)
      }
      // 递归查找
      getKeyControlComponents(item, componentsArr)
    })
  }
}
