// components/search/search.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    maxLenth: { // 属性名
      type: Number, // 类型（必填），目前接受的类型包括：String, Number, Boolean, Object, Array, null（表示任意类型）
      value: 5, // 属性初始值（可选），如果未指定则会根据类型选择一个
    },
    showHistory: { // 属性名
      type: Boolean, // 类型（必填），目前接受的类型包括：String, Number, Boolean, Object, Array, null（表示任意类型）
      value: false, // 属性初始值（可选），如果未指定则会根据类型选择一个
    },
  },

  /**
   * 组件的初始数据
   */
  data: {
    searchHistory: [],
    hasFocus:false,
    searchValue:''
  },

  /**
   * 组件的方法列表
   */
  methods: {
    //失去焦点
    _blurInput(e){
      let value = e.detail.value
      setTimeout(()=>{
        this.setData({
          hasFocus: false,
        })
      },200)
      this.triggerSearch(value)
    },
    //输入
    _searchInput(e) {
      let value=e.detail.value
      this.triggerChange(value)
    },
    //聚焦
    _focusInput(e){
      this.setData({
        hasFocus: true,
      })
    },
    //更新历史记录
    _updateHistory(key){
      let historyArray=this.data.searchHistory
      let newHistoryArray=null
      if (historyArray.length < this.data.maxLenth){
         this.data.searchHistory.unshift(key)
      }else{
        this.data.searchHistory.unshift(key)
        this.data.searchHistory.pop()
      }
      this.setData({
        searchHistory: this.data.searchHistory
      })
    },
    _historyItemTap(e){
      let historyValue=e.currentTarget.id
      this.setData({
        searchValue:historyValue
      })
    },
    //触发搜索事件
    triggerSearch(value){
      this.setData({
        searchValue: value
      })
      this.triggerEvent('search', { value })
      this._updateHistory(value)
    },
    //触发改变事件
    triggerChange(value) {
      this.triggerEvent('change', { value })
    }
  }
})
