/*
 * @Date: 2022-07-26 09:49:54
 * @LastEditors: hookehuyr hookehuyr@gmail.com
 * @LastEditTime: 2024-12-04 10:39:08
 * @FilePath: /hager/src/common/mixin.js
 * @Description: 文件描述
 */

import $ from 'jquery';
import { throttle } from 'lodash-es';
import axios from '@/utils/axios';
import { getUserInfoAPI } from '@/api/hager';
import { openLoginPrompt } from '@/utils/loginPrompt';

export default {
  // 初始化设置
  init: {
    mounted () {
      document.title = this.$route.meta.title;
      // 页面进入时获取当前屏幕宽度
      this.handleResize();
      // 监听窗口的 resize 事件
      window.addEventListener('resize', this.handleResize);
    },
    beforeDestroy() {
      // 在组件销毁前移除监听器，防止内存泄漏
      window.removeEventListener('resize', this.handleResize);
    },
    data () {
      return {
        top_img_height: '38rem',
        screenWidth: $(window).width(), // 初始化屏幕宽度, xs <768px
      };
    },
    computed: {
      is_xs () {
        return this.screenWidth < 768;
      }
    },
    methods: {
      handleResize() {
        this.screenWidth = $(window).width(); // 更新屏幕宽度
        if (this.screenWidth < 768) {
          this.top_img_height = $(window).width()*0.39 + 'px';
        } else {
          this.top_img_height = $(window).width()*0.35 + 'px';
        }
      },
      async getLoginStatus () {
        const res = await getUserInfoAPI();
        return Boolean(res && res.code && res.data);
      },
      goToLoginPage (redirect = this.$route.fullPath) {
        const query = redirect ? { redirect } : {};
        this.$router.push({
          path: '/user/login',
          query,
        });
      },
      async ensureLogin (options = {}) {
        const isLogin = await this.getLoginStatus();

        if (typeof this.is_login === 'boolean') {
          this.is_login = isLogin;
        }

        if (isLogin) {
          return true;
        }

        const shouldLogin = await openLoginPrompt({
          title: options.title || '登录后可下载资料',
          message: options.message || '当前下载操作需要先登录，是否现在前往登录页面？',
          confirmText: options.confirmText || '去登录',
          cancelText: options.cancelText || '稍后再说',
        });

        if (shouldLogin) {
          this.goToLoginPage(options.redirect || this.$route.fullPath);
        }

        return false;
      },
      // 埋点支持两种传参方式：
      // this.maEvent('h5_contact')
      // this.maEvent({ p: 'h5_contact', event: 'document_preview' })
      maEvent: throttle(function (payload) {
        const eventData = typeof payload === 'string' ? { p: payload } : (payload || {});
        const query = new URLSearchParams();

        Object.entries(eventData).forEach(([key, value]) => {
          if (value !== undefined && value !== null && value !== '') {
            query.append(key, value);
          }
        });

        const url = query.toString() ? `/srv/?a=log&${query.toString()}` : '/srv/?a=log';
        return axios.post(url);
      }, 1500)
    },
    directives: {
      clickOutside: {
        bind(el, binding) {
          el.clickOutsideEvent = function(event) {
            // 检测点击是否在指定元素外部
            if (!(el === event.target || el.contains(event.target))) {
              binding.value(); // 触发绑定的方法
            }
          };
          document.addEventListener('click', el.clickOutsideEvent);
        },
        unbind(el) {
          document.removeEventListener('click', el.clickOutsideEvent);
        }
      }
    },
  },
};