haowanShow/miniprogram/pages/search/search.js

import { VueLikePage } from '../../utils/page'
import { saveSearchHistory, loadSearchHistory, removeSearchHistory } from '../../utils/storage'
import GoodsApi from '../../apis/goods'
import Router from '../../utils/routes'
VueLikePage([], {
  data: {
    showResult: false,
    selectShowStatus: false,
    resultList: [],
    searchTips: [],
    searchTypes: [
      {
        text: '企业',
        value: 'company'
      },
      // {
      //   text: '产品',
      //   value: 'goods'
      // },
    ],
    activeIndex: 0,
    keyword: ''
  },
  methods: {
    onLoad () {
      this.setData({
        history: loadSearchHistory()
      })
    },
    clearHistory () {
      removeSearchHistory()
      this.setData({
        history: []
      })
    },
    hideSelect () {
      this.setData({
        selectShowStatus: false
      })
    },
    showSelect () {
      this.setData({
        selectShowStatus: true
      })
    },
    changeSearchType (e) {
      this.setData({
        activeIndex: e.currentTarget.dataset.index
      })
    },
    searchHistory (e) {
      e.detail = e.currentTarget.dataset.keyword
      this.search(e)
    },
    search (e) {
      console.log(e)
      const { activeIndex, searchTypes } = this.data
      const value = e.detail
      if (!value) {
        this.setData({
          showResult: false
        })
        return
      }
      saveSearchHistory(value)
      const params = {
        type: searchTypes[activeIndex].value,
        keyword: value
      }
      GoodsApi.searchGoodsOrCompany(params).then(res => {
        const name_key = params.type === 'company' ? 'companyName' : 'name'
        const id_key = params.type === 'company' ? 'companyId' : 'goodsId'
        const img_key = params.type === 'company' ? 'introduceImage' : 'listPicUrl'
        
        this.setData({
          showResult: true,
          resultList: res.data.list.map(item => {
            console.log(item[img_key], 'item[img_key]')
          let img = []
          // try {
          //   img = JSON.parse(item[img_key])
          // } catch (err) {
          //   console.log(err, '解析图片列表出错')
          // }
          // console.log(img)
            item.name = item[name_key]
            item.id = item[id_key]
            item.img = item.companyLogo
            return item
          }),
          history: loadSearchHistory(),
          keyword: params.keyword,
          searchTips: []
        })
      })
    },
    toResultDetail (e) {
      const { index } = e.currentTarget.dataset
      const item = this.data.resultList[index]
      if (item.vrLink) {
        Router.push({
          url: 'scene',
          query: {
            vr_link: item.vrLink
          }
        })
      } else {
        Router.push({
          url: 'goodsDetail',
          query: {
            goods_id: item.id
          }
        })
      }
    },
    handleTipClick (e) {
      e.detail = e.currentTarget.dataset.item
      this.search(e)
    },
    handleInput (e) {
      console.log(e)
      const params = {
        type: 'company',
        keyword: e.detail
      }
      if (!e.detail) {
        this.setData({
          searchTips: []
        })
      }
      GoodsApi.searchGoodsOrCompany(params).then(res => {
        const name_key = 'companyName'
        
        this.setData({
          searchTips: res.data.list.map(item => item[name_key]),
        })
      })
    }
  }
})