// pages/video/video.ts

import UrlParamsHandler from "../../../utils/store";
import { htmlToWxNodes } from "../../../utils/html-to-wx-nodes";
import { request } from "../../../utils/request";
import { version, appversion, appId } from "../../../env";
import { receiveRedPacket } from "../../../utils/util";

const isMobileEnvironment = (): boolean => {
  const platform = wx.getSystemInfoSync().platform?.toLowerCase() || '';
  return platform !== 'windows' && platform !== 'mac';
};

Page({
  /**
   * 页面的初始数据
   */
  data: {
    dataList: {},
    nodes: [] as any[],
    eveId: null,
    store: {},

    active: 0,
    canSubmit: false,
    safeBottom: 0,
  },

  /**
   * 生命周期函数--监听页面加载
   */
  async onLoad(options: any) {
    const app = getApp<IAppOption>();
    wx.hideShareMenu({
      menus: ["shareAppMessage"], // 单独禁用好友分享
    });
    new UrlParamsHandler(options);
    app.globalData.store = options;
    let safeBottom = 0;
    //@ts-ignore
    if (wx.getWindowInfo) {
      //@ts-ignore
      const systemInfo = wx.getWindowInfo();
      safeBottom =
        Math.abs(systemInfo.windowHeight - systemInfo.safeArea.bottom) + 10;
      if (safeBottom === 0) safeBottom = 24;
    } else {
      const systemInfo = wx.getSystemInfoSync();
      safeBottom = systemInfo.safeArea
        ? Math.abs(systemInfo.windowHeight - systemInfo.safeArea.bottom) + 10
        : 24;
    }
    this.setData({
      safeBottom: safeBottom,
      store: options,
    });

    if (!isMobileEnvironment()) {
      this.handleEnterError(
        "当前环境不支持观看，请使用手机观看。",
        "环境不支持",
      );
      return;
    }

    const bool = await app.login("video");
    if (!bool) return;

    // 在需要保护的页面调用
    //@ts-ignore
    wx.setVisualEffectOnCapture({
      visualEffect: 'hidden', // 录屏或截图时隐藏内容
      success: function () {
        console.log('防截屏录屏保护已开启');
      }
    });
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() { },
  handleEnterError(message: string, title = "无法进入") {
    wx.showModal({
      title: title,
      content: message,
      showCancel: false,
      confirmText: "确定",
    });
  },

  handleBack() {
    wx.switchTab({
      url: "/pages/tab-bar/course/course",
    });
  },
  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    this.search();
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() { },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() { },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() { },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() { },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() { },

  onChange(e: any) {
    this.setData({
      active: event.detail.index,
    });
  },

  // 监听答题变化
  onAnswerChange() {
    this.updateProgress();
  },

  async search() {
    const app = getApp<IAppOption>();
    const bool = await app.checkLoginState();
    if (!bool) return;
    const code = wx.getStorageSync("code");
    const params = {
      openId: wx.getStorageSync("openId"),
      ...app.globalData.store,
    };
    if (code) {
      const data = await request({
        options: {
          url: `/app/video-watch/details?version=${version.details}&appVer=${appversion}`,
          method: "GET",
          data: params,
        },
      });

      if (!data.watch.url) {
        wx.reLaunch({
          url: `/pages/live/registration/registration?content=${data.watch.content}&state=${-1}`,
        });
      }
      const nodes = htmlToWxNodes(data.watch.content);
      this.setData({
        dataList: data.watch,
        eveId: data.watch.eveId,
        nodes,
      });
    } else {
      const data = await request({
        options: {
          url: `/app/watch/details?version=${version.details}&appVer=${appversion}`,
          data: params,
        },
      });

      if (!data.data.url) {
        wx.reLaunch({
          url: `/pages/live/registration/registration?content=${data.data.content
            }&state=${5}`,
        });
      }
      const nodes = htmlToWxNodes(data.data.content);
      this.setData({
        dataList: data.data,
        eveId: data.data.eveId,
        nodes,
      });
    }

    this.selectComponent("#tabs").resize();
  },
  // 更新答题进度
  updateProgress() {
    const quizComponent = this.selectComponent("#quizComponent");
    if (quizComponent) {
      const canSubmit = quizComponent.isAllAnswered();
      this.setData({
        canSubmit: canSubmit,
      });
    }
  },

  handleSubmit(this) {
    const ended = wx.getStorageSync("ended") || false;
    if (!ended) {
      wx.showModal({
        title: "请先观看视频，再答题",
        showCancel: false,
        confirmText: "确定",
        confirmColor: "#FF0000",
      });
      return;
    }
    //@ts-ignore
    if (this.data.dataList?.userAnsNum >= this.data.dataList?.answerMax) {
      wx.showToast({
        title: "答题次数已用完",
        icon: "none",
        duration: 6000,
      });
      return;
    }
    const quizComponent = this.selectComponent("#quizComponent");

    if (!quizComponent) {
      wx.showToast({
        title: "组件加载失败",
        icon: "none",
      });
      return;
    }

    const isAllAnswered = quizComponent.isAllAnswered();
    if (!isAllAnswered) {
      const progress = quizComponent.getProgress();
      wx.showModal({
        title: "答题未完成",
        content: `您已完成 ${progress.answered}/${progress.total} 题，请完成所有题目后再提交。`,
        showCancel: false,
        confirmText: "继续答题",
      });
      return;
    }

    const answers = quizComponent.getAllAnswers();
    if (!answers || answers.length === 0) {
      wx.showToast({
        title: "请先完成答题",
        icon: "none",
      });
      return;
    }

    wx.showModal({
      title: "确认提交",
      content: `您已完成 ${answers.length} 道题目，确定要提交答案吗？`,
      success: (res) => {
        if (res.confirm) {
          this.submitAnswers(answers);
        }
      },
    });
  },

  async submitAnswers(answers: any[]) {
    const code = wx.getStorageSync("code");
    const params = {
      answers,
      openId: wx.getStorageSync("openId"),
      eveId: this.data.eveId,
      ...this.data.store,
    };
    wx.showLoading({
      title: "提交中...",
    });
    let res = null;

    if (code) {
      res = await request({
        options: {
          url: "/app/video-watch/interactive?version=" + version.interactive,
          data: params,
        },
      });
    } else {
      res = await request({
        options: {
          url: "/app/watch/interactive?version=" + version.interactive,
          data: params,
        },
      });
    }

    if (res.code !== 200) {
      wx.showToast({
        title: res.msg || "提交失败",
        icon: "none",
        duration: 2000,
      });
      return;
    }

    const { pass, redId } = res.data;
    if (redId) {
      wx.showModal({
        content: "🎉 领取红包！",
        showCancel: false,
        confirmText: "立即领取",
        confirmColor: "#FF0000",
        success: (res) => {
          if (res.confirm) {
            this.handleReceive(redId);
          }
        },
      });
      return;
    }
    if (pass) {

      wx.showModal({
        content: "🎉 恭喜您获得红包！",
        showCancel: false,
        confirmText: "确定",
        confirmColor: "#FF0000",

      });
    } else {
      wx.showToast({
        title: "回答错误,您与红包擦肩而过",
        icon: "none",
        duration: 6000,
      });
    }
  },
  async handleReceive(e: any) {
    const { id } = e.currentTarget.dataset;
    const { code } = this.data.store as Record<string, any>;
    const params = {
      appId,
      code,
      openId: wx.getStorageSync("openId"),
      redId: id,
    }
    try {
      await receiveRedPacket(
        params,
        '/app/general/receive-red',
        appId
      );
    } catch (err) {
      console.error('领取红包失败:', err);
    }
  },
  handleCustomReport() {
    const { code, state, seeId } = this.data.store as Record<string, any>;
    const params: Record<string, string> = {};
    if (code) params.code = code;
    if (state) params.state = state;
    if (seeId) params.seeId = seeId;
    const query = Object.entries(params)
      .map(([k, v]) => `${encodeURIComponent(k)}=${encodeURIComponent(v)}`)
      .join("&");
    wx.navigateTo({
      url: `/pages/live/report/report${query ? `?${query}` : ""}`,
    });
  },
  handleViewHitory() {
    const { code, state, seeId } = this.data.store as Record<string, any>;
    const params: Record<string, string> = {};
    if (code) params.code = code;
    if (state) params.state = state;
    if (seeId) params.seeId = seeId;
    const query = Object.entries(params)
      .map(([k, v]) => `${encodeURIComponent(k)}=${encodeURIComponent(v)}`)
      .join("&");
    wx.navigateTo({
      url: `/pages/live/red-history/red-history${query ? `?${query}` : ""}`,
    });
  }
});