export function createQueueDisplay(queueData) {
    const container = document.createElement('div');
    container.className = 'queue-container';

    const title = document.createElement('h2');
    title.textContent = '排队情况';
    title.className = 'queue-title';
    container.appendChild(title);

    if (!queueData || queueData.length === 0) {
        const emptyMessage = document.createElement('p');
        emptyMessage.className = 'queue-empty';
        emptyMessage.textContent = '当前无人排队';
        container.appendChild(emptyMessage);
        return container;
    }

    const queueList = document.createElement('div');
    queueList.className = 'queue-list';

    queueData.forEach(item => {
        const queueItem = document.createElement('div');
        let wait_time = item.wait_time
        if (wait_time < 60) {
            wait_time = `${Math.round(wait_time)}秒`
        } else if (wait_time < 3600) {
            wait_time = `${Math.round(wait_time / 60)}分钟`
        } else {
            wait_time = `${Math.round(wait_time / 3600)}小时${Math.round(wait_time % 3600 / 60)}分钟`
        }
        queueItem.className = 'queue-item';
        queueItem.innerHTML = `
            <span class="queue-user">${item.user}</span>
            <span class="queue-time">${wait_time}</span>
        `;
        queueList.appendChild(queueItem);
    });

    container.appendChild(queueList);
    return container;
}