/**
 * 全局 Loading 管理
 * 纯 JS 实现，直接操作 DOM，不依赖 Vue 组件
 * 支持引用计数，多个并发请求时正确处理显示/隐藏
 * 支持超时自动隐藏保护机制
 */

// 全局状态
let isLoading = false
let loadingElement = null
let messageText = '加载中...'
let loadingCount = 0 // 引用计数，支持并发请求
let autoHideTimer = null // 超时自动隐藏定时器

// 配置
const DEFAULT_TIMEOUT = 30000 // 默认超时时间 30 秒
const CONTAINER_ID = 'global-loading-container'

/**
 * 创建 Loading DOM 元素
 */
function createLoadingElement (message) {
  const container = document.createElement('div')
  container.id = CONTAINER_ID
  container.innerHTML = `
    <div class="global-loading-mask">
      <div class="global-loading-content">
        <div class="global-loading-spinner">
          <div class="ant-spin ant-spin-lg ant-spin-spinning">
            <span class="ant-spin-dot ant-spin-dot-spin">
              <i class="ant-spin-dot-item"></i>
              <i class="ant-spin-dot-item"></i>
              <i class="ant-spin-dot-item"></i>
              <i class="ant-spin-dot-item"></i>
            </span>
          </div>
        </div>
        <p class="global-loading-message">${message}</p>
      </div>
    </div>
  `
  return container
}

/**
 * 注入全局样式（只注入一次）
 */
function injectStyles () {
  if (document.getElementById('global-loading-styles')) return

  const style = document.createElement('style')
  style.id = 'global-loading-styles'
  style.textContent = `
    .global-loading-mask {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: rgba(0, 0, 0, 0.45);
      z-index: 99999;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .global-loading-content {
      text-align: center;
    }
    .global-loading-message {
      margin-top: 16px;
      font-size: 14px;
      color: #fff;
    }
    .global-loading-content .ant-spin-dot-item {
      background-color: #fff !important;
    }
  `
  document.head.appendChild(style)
}

/**
 * 清除超时定时器
 */
function clearAutoHideTimer () {
  if (autoHideTimer) {
    clearTimeout(autoHideTimer)
    autoHideTimer = null
  }
}

/**
 * 设置超时自动隐藏
 * @param {number} timeout - 超时时间（毫秒）
 */
function setAutoHideTimer (timeout) {
  clearAutoHideTimer()
  if (timeout > 0) {
    autoHideTimer = setTimeout(() => {
      console.warn(`[GlobalLoading] 超时自动隐藏 (${timeout}ms)`)
      forceHideGlobalLoading()
    }, timeout)
  }
}

/**
 * 显示全局 Loading
 * 支持引用计数，多次调用只显示一个 Loading
 * @param {string|boolean} message - 提示信息，传 true 使用默认文字
 * @param {number} timeout - 超时自动隐藏时间（毫秒），默认 30 秒，传 0 禁用
 */
export function showGlobalLoading (message = '加载中...', timeout = DEFAULT_TIMEOUT) {
  loadingCount++

  // 已经在显示，只增加计数，重置超时
  if (isLoading) {
    setAutoHideTimer(timeout)
    return
  }

  isLoading = true
  messageText = typeof message === 'string' ? message : '加载中...'

  // 注入样式
  injectStyles()

  // 创建并插入 DOM
  loadingElement = createLoadingElement(messageText)
  document.body.appendChild(loadingElement)

  // 设置超时自动隐藏
  setAutoHideTimer(timeout)
}

/**
 * 隐藏全局 Loading
 * 只有当所有请求都完成时才真正隐藏
 */
export function hideGlobalLoading () {
  loadingCount = Math.max(0, loadingCount - 1)

  // 还有其他请求在进行中，不隐藏
  if (loadingCount > 0) return

  doHide()
}

/**
 * 强制隐藏全局 Loading（重置计数器）
 * 用于异常情况下的强制重置
 */
export function forceHideGlobalLoading () {
  loadingCount = 0
  doHide()
}

/**
 * 执行隐藏操作
 */
function doHide () {
  if (!isLoading) return

  isLoading = false
  clearAutoHideTimer()

  // 移除 DOM
  if (loadingElement && loadingElement.parentNode) {
    loadingElement.parentNode.removeChild(loadingElement)
  }
  loadingElement = null
}

/**
 * 获取当前 Loading 状态
 * @returns {boolean}
 */
export function isGlobalLoadingVisible () {
  return isLoading
}

/**
 * 获取当前 Loading 计数
 * @returns {number}
 */
export function getLoadingCount () {
  return loadingCount
}

/**
 * useGlobalLoading Hook（Vue Composition API 风格）
 * @returns {{ show: Function, hide: Function, forceHide: Function, isVisible: Function }}
 */
export function useGlobalLoading () {
  return {
    show: showGlobalLoading,
    hide: hideGlobalLoading,
    forceHide: forceHideGlobalLoading,
    isVisible: isGlobalLoadingVisible
  }
}

export default {
  show: showGlobalLoading,
  hide: hideGlobalLoading,
  forceHide: forceHideGlobalLoading,
  isVisible: isGlobalLoadingVisible
}
