const app = getApp();
const util = require("../../utils/util");

const ALL_PAGE_SIZE = 5000;

Page({
  data: {
    currentStore: null,
    gender: "",
    list: [],
    loading: false,
    locating: false,
    myLadderUserId: null,
    pageSize: ALL_PAGE_SIZE,
  },

  onLoad() {
    this.initData();
  },

  onShow() {
    const newStore = app.globalData.currentStore;
    const oldStoreId = this.data.currentStore
      ? this.data.currentStore.storeId
      : null;

    // 检查门店是否切换
    if (newStore && newStore.storeId !== oldStoreId) {
      this.setData({
        currentStore: newStore,
        list: [],
        myLadderUserId: null,
      });
      this.fetchData();
    } else if (app.globalData.storeChanged) {
      // 全局标记门店已切换
      app.globalData.storeChanged = false;
      this.setData({
        currentStore: newStore,
        list: [],
        myLadderUserId: null,
      });
      this.fetchData();
    }
  },

  onPullDownRefresh() {
    this.setData({ list: [], myLadderUserId: null });
    this.fetchData().then(() => {
      wx.stopPullDownRefresh();
    });
  },

  async initData() {
    // 获取当前门店（已登录用 ensureCurrentStore，未登录用 getDefaultStore 可浏览排名）
    try {
      if (app.globalData.token) {
        const store = await app.ensureCurrentStore();
        this.setData({ currentStore: store });
      } else {
        const store = await app.getDefaultStore();
        this.setData({ currentStore: store || { storeName: "请选择门店" } });
      }
      this.fetchData();
    } catch (e) {
      console.error("获取门店失败:", e);
      if (e.code === 401) {
        app.globalData.token = null;
        const store = await app.getDefaultStore();
        this.setData({ currentStore: store || { storeName: "请选择门店" } });
        this.fetchData();
      }
    }
  },

  async fetchData() {
    if (!this.data.currentStore || !this.data.currentStore.storeId) return;

    this.setData({ loading: true });

    try {
      const res = await app.request("/api/ladder/ranking", {
        store_id: this.data.currentStore.storeId,
        gender: this.data.gender,
        page: 1,
        pageSize: this.data.pageSize,
        no_count: 1,
      });

      const list = res.data.list || [];
      this.setData({
        list,
      });
    } catch (e) {
      console.error("获取排名失败:", e);
    } finally {
      this.setData({ loading: false });
    }
  },

  setGender(e) {
    const gender = e.currentTarget.dataset.gender;
    this.setData({ gender, list: [], myLadderUserId: null });
    this.fetchData();
  },

  selectStore() {
    wx.navigateTo({ url: "/pages/store/index" });
  },

  scrollToMeInMiddle(tryCount = 0) {
    const id = this.data.myLadderUserId;
    if (!id) return;

    const selector = `#player-${id}`;
    const systemInfo = wx.getSystemInfoSync();
    const windowHeight =
      systemInfo && systemInfo.windowHeight ? systemInfo.windowHeight : 0;

    wx.createSelectorQuery()
      .select(selector)
      .boundingClientRect()
      .selectViewport()
      .scrollOffset()
      .exec((res) => {
        const rect = res && res[0] ? res[0] : null;
        const scroll = res && res[1] ? res[1] : null;
        if (!rect || !scroll || typeof scroll.scrollTop !== "number") {
          if (tryCount < 10) {
            setTimeout(() => {
              this.scrollToMeInMiddle(tryCount + 1);
            }, 100);
          }
          return;
        }

        const targetScrollTop =
          scroll.scrollTop + rect.top - windowHeight / 2 + rect.height / 2;

        wx.pageScrollTo({
          scrollTop: Math.max(0, targetScrollTop),
          duration: 300,
        });
      });
  },

  async locateMe() {
    if (!this.data.currentStore || !this.data.currentStore.storeId) return;
    if (this.data.locating) return;

    this.setData({ locating: true });
    try {
      const res = await app.request("/api/ladder/my-rank", {
        store_id: this.data.currentStore.storeId,
        gender: this.data.gender,
      });

      const data = res && res.data ? res.data : null;
      if (!data) return;

      if (data.qualified === false) {
        wx.showToast({
          title: `本月场次不足（${data.monthlyMatchCount}/${data.minMonthlyMatches}）`,
          icon: "none",
        });
        return;
      }

      if (!data.ladderUserId || !data.page) {
        return;
      }

      const shouldRefetch = !this.data.list || this.data.list.length === 0;
      this.setData({ myLadderUserId: data.ladderUserId });

      if (shouldRefetch) {
        await this.fetchData();
      }

      setTimeout(() => {
        this.scrollToMeInMiddle();
      }, 50);
    } catch (e) {
      console.error("定位我的排名失败:", e);
    } finally {
      this.setData({ locating: false });
    }
  },

  viewPlayer(e) {
    const player = e.currentTarget.dataset.player;
    const id = player && player.id ? player.id : e.currentTarget.dataset.id;
    if (!id) return;

    wx.navigateTo({
      url: `/pages/player/index?id=${id}`,
      success: (res) => {
        if (res && res.eventChannel && player) {
          res.eventChannel.emit("player", player);
        }
      },
    });
  },
});