// pages/shangjia-paihang/shangjia-paihang.js
const app = getApp()
import request from '../../utils/request.js'

Page({
  data: {
    // 页面加载状态
    jiazaiZhuangtai: true,
    
    // 排行榜类型：1=今日流水，2=今月流水
    paihangLeixing: 1,
    
    // 榜单数据
    paihangShuju: [],
    
    // 是否展示真实数据（后端控制）
    xianshiZhenshiShuju: false,
    
    // 虚拟数据（用于当后端不允许展示时）
    xuniShuju: [],
    
    // 按钮防抖控制
    btnFangdou: false,
    
    // OSS图片基础URL（从全局变量获取）
    ossImageUrl: '',
    
    // 默认头像（相对路径，需要与OSS基础URL拼接）
    morentouxiang: '',
    
    // 用户类型：1=打手，2=管事，3=商家（当前页面固定为商家）
    yonghuLeixing: 3,
    
    // 前三名特殊数据
    qiansanMing: [],
    
    // 动画相关
    crownAnimation: null,
    
    // 卡片点击特效
    flashCardIndex: -1,
    flashCardType: '',
    flashAnimation: null,
    
    // 切换按钮选中状态
    switchBgPosition: 0
  },

  onLoad() {
    // 设置页面标题
    wx.setNavigationBarTitle({
      title: '商家排行榜'
    })
    
    // 初始化全局变量
    this.setData({
      ossImageUrl: app.globalData.ossImageUrl || '',
      morentouxiang: app.globalData.morentouxiang || ''
    })
    
    // 初始化虚拟数据
    this.initXuniShuju()
    
    // 加载排行榜数据
    this.huoquPaihangShuju()
    
    // 开始皇冠动画
    this.startCrownAnimation()
  },

  onShow() {
    // 页面显示时恢复动画
    this.registerNotificationComponent();
    this.startCrownAnimation()
  },
  registerNotificationComponent() {
    const app = getApp();
    const notificationComp = this.selectComponent('#global-notification');
    
    if (notificationComp && notificationComp.showNotification) {
        console.log('🏪 商城页面注册通知组件');
        app.globalData.globalNotification = {
            show: (data) => notificationComp.showNotification(data),
            hide: () => notificationComp.hideNotification()
        };
    }
},

  onHide() {
    // 页面隐藏时停止动画
    this.stopCrownAnimation()
  },

  onUnload() {
    // 页面卸载时停止动画
    this.stopCrownAnimation()
  },

  // 初始化虚拟数据
  initXuniShuju() {
    const xuniShuju = []
    const names = ['商业大亨', '平台巨头', '金牌商家', '优质供应商', '运营高手', 
                   '流量之王', '服务专家', '合作典范', '商业精英', '销售冠军']
    
    for (let i = 0; i < 10; i++) {
      xuniShuju.push({
        mingci: i + 1,
        touxiang: '',
        nicheng: names[i] || `虚拟商家${i + 1}`,
        uid: `S${100000 + i}`,
        jine: (5888.88 - i * 500).toFixed(2),  // 商家显示的是流水金额
        jineClass: 'normal'  // 金额样式
      })
    }
    this.setData({ xuniShuju })
  },

  // 开始皇冠动画
  startCrownAnimation() {
    this.stopCrownAnimation()
    
    const animation = wx.createAnimation({
      duration: 800,
      timingFunction: 'ease-in-out'
    })
    
    let scale = 1
    const animate = () => {
      scale = scale === 1 ? 1.15 : 1
      
      animation.scale(scale).step({
        duration: 800,
        timingFunction: 'ease-in-out'
      })
      
      this.setData({
        crownAnimation: animation.export()
      })
      
      this.data.crownAnimationTimer = setTimeout(() => {
        animate()
      }, 800)
    }
    
    animate()
  },

  // 停止皇冠动画
  stopCrownAnimation() {
    if (this.data.crownAnimationTimer) {
      clearTimeout(this.data.crownAnimationTimer)
      this.setData({
        crownAnimationTimer: null
      })
    }
  },

  // 卡片点击特效
  handleCardTap(e) {
    const index = e.currentTarget.dataset.index
    const type = e.currentTarget.dataset.type // 'top3' 或 'normal'
    
    // 创建闪光动画
    const animation = wx.createAnimation({
      duration: 300,
      timingFunction: 'ease-out'
    })
    
    // 快速闪光效果
    animation.opacity(0.9).step({
      duration: 50,
      timingFunction: 'linear'
    })
    
    animation.opacity(1).step({
      duration: 250,
      timingFunction: 'ease-out'
    })
    
    this.setData({
      flashCardIndex: index,
      flashCardType: type,
      flashAnimation: animation.export()
    })
    
    // 300ms后重置闪光状态
    setTimeout(() => {
      this.setData({
        flashCardIndex: -1,
        flashCardType: ''
      })
    }, 300)
  },

  // 获取排行榜数据
  async huoquPaihangShuju() {
    this.setData({
      jiazaiZhuangtai: true
    })
    
    try {
      // 准备请求参数
      const requestData = {
        leixing: this.data.paihangLeixing,
        yonghu_leixing: this.data.yonghuLeixing
      }
      
      // 使用封装的request发送请求
      const res = await request({
        url: '/peizhi/dsph',
        method: 'POST',
        data: requestData,
        header: {
          'content-type': 'application/json'
        }
      })
      
      // 处理返回数据
      if (res && res.data && res.data.code === 0) {
        const responseData = res.data.data
        
        // 检查后端是否允许展示
        if (responseData.xianshi && responseData.paihang_list && responseData.paihang_list.length > 0) {
          // 处理头像URL拼接和金额样式
          const processedList = this.processData(responseData.paihang_list)
          
          // 提取前三名特殊展示
          const qiansanMing = processedList.slice(0, 3)
          const qitaPaihang = processedList.slice(3)
          
          this.setData({
            paihangShuju: qitaPaihang,
            qiansanMing: qiansanMing,
            xianshiZhenshiShuju: true,
            jiazaiZhuangtai: false
          })
        } else {
          // 后端不允许展示或数据不足，显示虚拟数据
          this.xianshiXuniShuju()
        }
      } else {
        // 请求失败，显示虚拟数据
        const errorMsg = res && res.data ? (res.data.msg || '获取数据失败') : '网络请求失败'
        
        wx.showToast({
          title: errorMsg,
          icon: 'none',
          duration: 2000
        })
        
        this.xianshiXuniShuju()
      }
    } catch (error) {
      console.error('获取排行榜数据失败:', error)
      
      wx.showToast({
        title: '网络请求异常，请重试',
        icon: 'none',
        duration: 2000
      })
      
      this.xianshiXuniShuju()
    }
  },

  // 处理数据（头像拼接和金额样式）
  processData(list) {
    const { ossImageUrl, morentouxiang } = this.data
    
    return list.map(item => {
      // 优先使用返回的头像URL
      let finalTouxiang = item.touxiang
      
      // 如果返回的头像为空，使用默认头像
      if (!finalTouxiang && morentouxiang) {
        finalTouxiang = morentouxiang
      }
      
      // 拼接完整的URL
      let fullTouxiangUrl = ''
      if (finalTouxiang && ossImageUrl) {
        // 确保路径不以斜杠开头
        let touxiangPath = finalTouxiang
        if (touxiangPath.startsWith('/')) {
          touxiangPath = touxiangPath.substring(1)
        }
        fullTouxiangUrl = ossImageUrl + touxiangPath
      }
      
      // 处理金额样式
      const jine = parseFloat(item.jine || 0)
      let jineClass = 'normal'
      const jineStr = jine.toFixed(2)
      
      // 判断金额位数
      const integerPart = jineStr.split('.')[0]
      if (integerPart.length >= 7) {  // 7位数及以上
        jineClass = 'very-small'
      } else if (integerPart.length >= 6) {  // 6位数
        jineClass = 'small'
      } else if (integerPart.length >= 5) {  // 5位数
        jineClass = 'medium'
      }
      
      return {
        ...item,
        full_touxiang: fullTouxiangUrl,
        jine: jineStr,
        jineClass: jineClass
      }
    })
  },

  // 显示虚拟数据
  xianshiXuniShuju() {
    const processedList = this.processData(this.data.xuniShuju)
    const qiansanMing = processedList.slice(0, 3)
    const qitaPaihang = processedList.slice(3)
    
    this.setData({
      paihangShuju: qitaPaihang,
      qiansanMing: qiansanMing,
      xianshiZhenshiShuju: false,
      jiazaiZhuangtai: false
    })
  },

  // 切换排行榜类型（今日/今月）
  qiehuangPaihangLeixing(e) {
    // 防抖处理：防止连续点击
    if (this.data.btnFangdou) return
    
    const leixing = e.currentTarget.dataset.leixing
    if (leixing == this.data.paihangLeixing) return
    
    // 设置防抖状态
    this.setData({
      btnFangdou: true
    })
    
    // 更新切换按钮位置
    this.setData({
      paihangLeixing: leixing,
      switchBgPosition: leixing == 1 ? 0 : 1
    })
    
    // 重新加载数据
    this.huoquPaihangShuju()
    
    // 1秒后解除防抖
    setTimeout(() => {
      this.setData({
        btnFangdou: false
      })
    }, 1000)
  },

  // 用户下拉刷新
  onPullDownRefresh() {
    this.huoquPaihangShuju()
    wx.stopPullDownRefresh()
  },

  // 图片加载失败处理
  tupianJiazaiShibai(e) {
    const index = e.currentTarget.dataset.index
    const type = e.currentTarget.dataset.type // 'top3' 或 'normal'
    
    // 使用默认头像
    const { ossImageUrl, morentouxiang } = this.data
    let defaultUrl = ''
    if (morentouxiang && ossImageUrl) {
      let defaultPath = morentouxiang
      if (defaultPath.startsWith('/')) {
        defaultPath = defaultPath.substring(1)
      }
      defaultUrl = ossImageUrl + defaultPath
    }
    
    if (type === 'top3') {
      // 前三名头像加载失败
      const key = `qiansanMing[${index}].full_touxiang`
      this.setData({
        [key]: defaultUrl
      })
    } else {
      // 普通排名头像加载失败
      const key = `paihangShuju[${index}].full_touxiang`
      this.setData({
        [key]: defaultUrl
      })
    }
  }
})