// pages/imgs/imgs.js
const app = getApp();
// const baseUrl = app.remoteConfig.baseUrl;
Component({
  /**
   * 继承父级样式
   */
  options: {
    addGlobalClass: true,
  },

  /**
   * 组件的属性列表
   */
  properties: {

  },

  /**
   * 组件的初始数据
   */
  data: {
    title: '表情包',
    loading: false,
    searchVal: '二次元',
    emptyText:'查询为空',
    baseUrl: 'https://yongma16.xyz',
    config: {
      title: '表情包搜索',
      searchPlaceholder: '输入搜索图片',
      searchText: '查询'
    },
    // 展示的图片
    imgsArray: []
  },
  lifetimes: {
    // 生命周期函数，可以为函数，或一个在 methods 段中定义的方法名
    attached: function () {
      console.log('获取attached')
      const imgConfig = app.wxProgramConfig.imgConfig;
      if (imgConfig) {
        this.setData({
          title: imgConfig.title,
          searchVal: imgConfig.searchVal,
          config: imgConfig.config,
          emptyText:imgConfig.emptyText
        })
      }
      this.searchImg()
    },
    moved: function () { },
    detached: function () {
      console.log('detached')
    },
  },

  /**
   * 组件的方法列表
   */
  methods: {
    bindKeyInput(e) {
      this.setData({
        searchVal: e.detail.value
      })
    },
    previewImage(e) {
      console.log('click png', e)
      const url = e.target.dataset.url
      wx.previewImage({
        current: url, // 当前显示图片的http链接
        urls: [url] // 需要预览的图片http链接列表
      })
    },
    searchImg() {
      this.setData({
        loading: true
      })
      const prefix = '/api/emoji/get/' + this.data.searchVal
      const remotePath = this.data.baseUrl + prefix
      const thisBack = this
      wx.request({
        url: remotePath,
        method: 'GET',
        success: (res) => {
          console.log('res', res)
          let imgData = []
          if (res.data) {
            const { data } = res.data
            imgData = data.map(url => {
              return {
                mode: 'aspectFill',
                title: '图片',
                src: url
              }
            })
          }
          thisBack.setData({
            loading: false,
            imgsArray: imgData
          })
        },
        fail: () => {
          thisBack.setData({
            loading: false,
            imgsArray: []
          })
        }
      })
    }
  }
})