ztb-mini/pages/home/city-select/index.js

const util = require('../../../utils/util')
const event = require('../../../utils/event')
const storage = require('../../../utils/storage')
const city = require("../../../const/city.js")
const tdsdk = require('../../../libs/tdweapp')
const app = getApp()
var hotList = []

Page({
  /**
   * 页面的初始数据
   */
  data: {
    value: '',
    height: app.globalData.fragmentHeight - 100,
    nowCity: null,//当前定位城市
    localCity: null,//当前定位城市
    hotCity: [], // 热门城市
    lists:[],//城市列表
    searchResult:[],//查找列表
    titleHeight: 240,
    indexHeight: 0,
    itemHeight: 0,
    scrollViewId: '', // scroll-view滚动到的子元素的id 锚点
    touchmove: false, // 是否在索引表上滑动
    touchmoveIndex: -1
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var height = app.globalData.fragmentHeight - 100
    this.data.indexHeight = height - 48
    if(this.data.indexHeight >= 1200){
      this.data.indexHeight = 1200
    }
    var titleHeight = this.px2rpx(app.globalData.CustomBar) + 116
    var itemHeight = parseInt(this.data.indexHeight / 24)
    var localCity = null
    if(app.nowLocation && !util.isEmpty(app.nowLocation.cityName)){
      localCity = app.nowLocation.cityName
    }
    var nowCity = null
    if(app.nowCity){
      nowCity = app.nowCity.cityName
    }
    var hotstring = storage.get('ztb-hot-list')
    if(!util.isEmpty(hotstring)){
      hotList = JSON.parse(hotstring)
    }
    this.setData({ height, itemHeight, indexHeight: this.data.indexHeight, titleHeight, localCity, nowCity, lists: city.list, hotCity: hotList })
  },
  getInputValue(e){
    this.setData({ value:e.detail.value },()=>{
      this.searchCity()
    })
  },
  closeInput(e){
    this.setData({ value: '' })
  },
  searchCity(){
    let result = []
    city.list.forEach((item1, index1) => {
      item1.data.forEach((item2, index2) => {
        if (item2.keyword.indexOf(this.data.value.toLocaleUpperCase()) !== -1) {
          result.push(item2)
        }
      })
    })
    this.setData({ searchResult: result })
  },
  rpx2px: function(rpx) {
    return rpx / 750 * app.globalData.windowWidth
  },
  px2rpx: function(px) {
    return px * 750 / app.globalData.windowWidth
  },
  touchStart: function(e) {
    this.setData({ touchmove: true })
    let pageY = this.px2rpx(e.touches[0].pageY) 
    let index = Math.floor((pageY - this.data.titleHeight) / this.data.itemHeight)
    let item = this.data.lists[index]
    if (item) {
      this.setData({ scrollViewId: item.letter == '#' ? 'E_' : item.letter, touchmoveIndex: index })
    }
  },
  touchMove: function(e) {
    let pageY = this.px2rpx(e.touches[0].pageY)
    let index = Math.floor((pageY - this.data.titleHeight) / this.data.itemHeight)
    let item = this.data.lists[index]
    if (item) {
      this.setData({ scrollViewId: item.letter, touchmoveIndex: index })
    }
  },
  touchEnd: function() {
    this.setData({ touchmove: false, touchmoveIndex: -1 })
  },
  lookItem: function(e){
    var item = null
    if(util.isEmpty(this.data.value)){
      if(!util.isEmpty(e.currentTarget.dataset.page)){
        item = this.data.lists[e.currentTarget.dataset.page].data[e.currentTarget.dataset.index]
      } else {
        item = this.data.hotCity[e.currentTarget.dataset.index]
      }
    } else {
      item = this.data.searchResult[e.currentTarget.dataset.index]
    }
    if(app.nowCity) {
      if(app.nowCity.cityCode == item.code){
        wx.navigateBack()
        return
      }
      app.nowCity.cityName = item.name.replace('市', '')
      app.nowCity.cityCode = item.code
    } else {
      app.nowCity = { cityName: item.name.replace('市', ''), cityCode: item.code }
    }
    var flag = false
    for (let index = 0; index < hotList.length; index++) {
      if(hotList[index].code == item.code){
        flag = true
        break
      }
    }
    if(!flag){
      hotList.push(item)
      storage.put('ztb-hot-list', JSON.stringify(hotList))
    }
    storage.put('ztb-now-city', JSON.stringify(app.nowCity))
    event.emit('EventMessage', { what: 444, desc: 'nowCity' })
    wx.navigateBack()
  },
  onShow: function () {
    tdsdk.Page.onShow()
  },
  onHide: function(){
    tdsdk.Page.onHide()
  },
  onUnload: function () {
    tdsdk.Page.onUnload()
  }
})