手机端门户轮询加待办角标

// 创建角标元素 function createBadge() {

// const element1 = document.querySelector('.tab-container #tab-tab1'); const element1 = document.querySelector('.van-tab .van-tab__text');

if (!element1) return null;


// 添加角标样式
element1.style.position = 'relative';

// 检查是否已存在角标，如果存在则移除
const existingBadge = element1.querySelector('.dynamic-badge');
if (existingBadge) {
    existingBadge.remove();
}

// 创建角标元素
const badge = document.createElement('span');
badge.className = 'dynamic-badge'; // 添加类名便于管理
badge.style.position = 'absolute';
badge.style.top = '13px';
badge.style.left = '35px';
badge.style.background = 'red';
badge.style.color = 'white';
badge.style.borderRadius = '50%';
badge.style.width = '16px';
badge.style.height = '16px';
badge.style.fontSize = '12px';
badge.style.display = 'flex';
badge.style.alignItems = 'center';
badge.style.justifyContent = 'center';
badge.style.transform = 'translate(50%, -50%)';
badge.style.zIndex = '1000'; // 确保角标在最上层

element1.appendChild(badge);
return badge;

} let that = this // 获取并更新角标数字 function updateBadgeNumber() { console.error(window) console.error(that.$ajax) that.$ajax({ url: '/flow/UserFlow/toDoList',

 }).then((data) => {
     const total = data.data?.total;
        if (total !== undefined && total !== null) {
           // 如果数字为0，隐藏角标
           if (total === 0) {
                badge.style.display = 'none';
            } else {
                badge.textContent = total.toString();
                badge.style.display = 'flex';
                
                // 处理两位数的情况，调整角标大小
                if (total > 9 && total <= 99) {
                    badge.style.width = '20px';
                   badge.style.height = '20px';
                   badge.style.fontSize = '10px';
              } else if (total > 99) {
                    badge.style.width = '22px';
                    badge.style.height = '22px';
                    badge.style.fontSize = '9px';
                   badge.textContent = '99+';
                } else {
                    // 恢复默认大小
                   badge.style.width = '16px';
                    badge.style.height = '16px';
                    badge.style.fontSize = '12px';
                }
            }
         }  
           

}); const element1 = document.querySelector('.van-tab .van-tab__text'); if (!element1) return;

let badge = element1.querySelector('.dynamic-badge');
if (!badge) {
    badge = createBadge();
    if (!badge) return;
}

}

// 初始化和启动轮询 function initBadgePolling() { // 先立即执行一次 setTimeout(() => { updateBadgeNumber(); }, 2000);

// 然后每10秒轮询一次
const pollInterval = setInterval(() => {
    updateBadgeNumber();
}, 10000); // 10秒

// 返回interval ID以便后续清理
return pollInterval;

} function isMobile() { return window.location.href.includes('/m/'); } // 启动轮询 let badgePollInterval = null;

// 页面加载完成后启动轮询 if (isMobile()) { if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', () => { badgePollInterval = initBadgePolling(); }); } else { badgePollInterval = initBadgePolling(); } }