@yeepay/virtual-keyboard/src/YeepayMobileKeyboard/z-index-manager.js

YeePay Virtual Keyboard Component

// z-index动态管理器
class ZIndexManager {
  constructor() {
    this.maxZIndex = 1000 // 基础z-index值
    this.lastUpdateTime = 0
    this.updateInterval = 1000 // 1秒更新间隔
    this.observer = null
  }

  // 优化的z-index获取方法
  getMaxZIndex(prefix = 'van') {
    const now = Date.now()
    if (now - this.lastUpdateTime < this.updateInterval) {
      return this.maxZIndex + 1
    }
    const highZIndexSelectors = [
      '[style*="z-index"]',
      '.modal',
      '.popup',
      '.dialog',
      '.dropdown',
      '.tooltip',
      '.overlay',
      `${prefix}-dialog`,
      `${prefix}-popup`,
      `${prefix}-dropdown-menu`,
      `${prefix}-tooltip`,
      `${prefix}-overlay`,
    ]
    let maxZ = 1000
    highZIndexSelectors.forEach((selector) => {
      try {
        const elements = document.querySelectorAll(selector)
        elements.forEach((el) => {
          const z = Number.parseInt(window.getComputedStyle(el).zIndex) || 0
          if (z > maxZ && z < 999999) {
            maxZ = z
          }
        })
      }
      catch (e) {
        // 忽略异常
      }
    })
    this.maxZIndex = maxZ
    this.lastUpdateTime = now
    return this.maxZIndex + 5
  }

  // 监听DOM变化，智能更新z-index
  observeZIndexChanges() {
    if (typeof MutationObserver !== 'undefined' && !this.observer) {
      this.observer = new MutationObserver((mutations) => {
        let shouldUpdate = false
        mutations.forEach((mutation) => {
          if (mutation.type === 'attributes' && mutation.attributeName === 'style') {
            const target = mutation.target
            if (target.style.zIndex) {
              shouldUpdate = true
            }
          }
        })
        if (shouldUpdate) {
          this.lastUpdateTime = 0
        }
      })
      this.observer.observe(document.body, {
        attributes: true,
        attributeFilter: ['style'],
        subtree: true,
      })
    }
    return this.observer
  }
}

// 单例导出
export const zIndexManager = new ZIndexManager()
export default ZIndexManager