let currentOffset = 0;
const limit = 50;
let currentView = 'groups';
let currentGroupId = null;
// 页面加载时初始化
document.addEventListener('DOMContentLoaded', function () {
    loadStatistics();
    loadGroupMessages();
    loadMessages();
});

// 加载统计信息
async function loadStatistics() {
    try {
        const response = await fetch('api/statistics');
        const data = await response.json();
        if (data) {
            const stats = data;
            document.getElementById('userCount').textContent = stats.user_count;
            document.getElementById('groupCount').textContent = stats.group_count;
            document.getElementById('messageCount').textContent = stats.message_count;
            document.getElementById('fileCount').textContent = stats.file_count;
        }
    } catch (error) {
        console.error('加载统计信息失败:', error);
    }
}

// 加载按群组分组的消息统计
async function loadGroupMessages() {
    try {
        const response = await fetch('api/groups');
        const data = await response.json();
        const groupList = document.getElementById('groupList');

        if (data.success) {
            const groups = data.groups || [];
            groupList.innerHTML = '';

            if (groups.length === 0) {
                groupList.innerHTML = '<li>暂无群组</li>';
                return;
            } else {
                currentGroupId = groups[0].id;
            }

            groups.forEach(group => {
                const li = document.createElement('li');
                li.className = 'group-item';
                li.setAttribute('data-group-id', group.id);
                li.onclick = () => selectGroup(group.id);

                const groupName = document.createElement('div');
                groupName.className = 'group-name';
                groupName.textContent = group.name || group.id;

                const groupInfo = document.createElement('div');
                groupInfo.className = 'group-info';
                groupInfo.innerHTML = `
                        <span>创建者: ${group.owner || '未知'}</span>
                    `;

                li.appendChild(groupName);
                li.appendChild(groupInfo);
                groupList.appendChild(li);
            });

            // 默认选择第一个群组
            if (currentView === 'groups' && groups.length > 0) {
                selectGroup(groups[0].id);
            }
        } else {
            groupList.innerHTML = '<li>加载失败</li>';
        }
    } catch (error) {
        console.error('加载群组消息失败:', error);
    }
}

// 选择群组
function selectGroup(groupId) {
    currentGroupId = groupId;
    currentOffset = 0;

    // 更新选中状态
    document.querySelectorAll('.group-item').forEach(item => {
        item.classList.remove('active');
    });

    // 找到对应的群组项并添加选中状态
    document.querySelectorAll('.group-item').forEach(item => {
        // 使用data-group-id属性来准确匹配群组
        if (item.getAttribute('data-group-id') === groupId) {
            item.classList.add('active');

            // 更新群组信息
            document.getElementById('currentGroup').textContent = item.querySelector('.group-name').textContent;
            document.getElementById('messageCountDisplay').textContent = '消息数量: 加载中...';
            document.getElementById('latestTime').textContent = '最新消息: 加载中...';
        }
    });

    // 加载该群组的消息
    loadMessages();

    // 加载统计信息
    loadStatistics();
}


// 加载更多消息
async function loadMoreMessages() {
    await loadMessages();
}

// 关闭聊天记录模态框
function closeChatRecordModal() {
    document.getElementById('chatRecordModal').style.display = 'none';
}

// 显示聊天记录模态框
function showChatRecordModal(chatrecordData) {
    const modal = document.getElementById('chatRecordModal');
    const title = document.getElementById('modalTitle');
    const content = document.getElementById('chatRecordContent');

    // 设置模态框标题
    if (chatrecordData.chatrecord && chatrecordData.chatrecord.title) {
        title.textContent = chatrecordData.chatrecord.title;
    } else {
        title.textContent = '聊天记录';
    }

    // 渲染聊天记录内容
    renderChatRecordContent(chatrecordData, content);

    modal.style.display = 'block';
}

// 渲染聊天记录内容
function renderChatRecordContent(chatrecordData, contentElement) {
    try {
        if (!chatrecordData.chatrecord || !chatrecordData.chatrecord.item) {
            contentElement.innerHTML = '<div class="error">聊天记录数据格式错误</div>';
            return;
        }

        const chatItems = chatrecordData.chatrecord.item;

        if (!Array.isArray(chatItems) || chatItems.length === 0) {
            contentElement.innerHTML = '<div class="error">暂无聊天记录内容</div>';
            return;
        }

        let html = '';
        chatItems.forEach(item => {
            // 处理不同类型的聊天记录项
            let contentHtml = '';

            if (item.type === 'ChatRecordText') {
                // 文本消息
                try {
                    const contentData = JSON.parse(item.content);
                    contentHtml = contentData.content || item.content || '';
                } catch (e) {
                    contentHtml = item.content || '';
                }
            } else if (item.type === 'ChatRecordImage') {
                // 图片消息
                contentHtml = '<div class="chat-record-image">[图片消息]</div>';
            } else {
                // 其他类型消息
                contentHtml = `[${item.type}] ${item.content || ''}`;
            }

            html += `
                <div class="chat-record-item">
                    <div class="chat-record-sender">${item.from_chatroom ? '群聊' : '私聊'}</div>
                    <div class="chat-record-text">${contentHtml}</div>
                    <div class="chat-record-time">${new Date(item.msgtime * 1000).toLocaleString()}</div>
                </div>
            `;
        });

        contentElement.innerHTML = html;
    } catch (error) {
        console.error('渲染聊天记录失败:', error);
        contentElement.innerHTML = '<div class="error">渲染聊天记录失败: ' + error.message + '</div>';
    }
}

// 加载消息
async function loadMessages() {
    try {
        const chatMessages = document.getElementById('chatMessages');
        if (!currentGroupId) {
            chatMessages.innerHTML = '<div class="loading">暂无消息</div>';
            return;
        }
        let url = `api/group_messages?limit=${limit}&offset=${currentOffset}&group_id=${currentGroupId}`;

        const response = await fetch(url);
        const data = await response.json();

        if (data.success) {
            const messages = data.messages || [];

            if (messages.length === 0) {
                if (currentOffset === 0) {
                    chatMessages.innerHTML = '<div class="loading">暂无消息</div>';
                }
                document.getElementById('messageCountDisplay').textContent = `消息数量: ${data.total || 0}`;
                document.getElementById('latestTime').textContent = `最新消息: ${data.lastest_time || '暂无'}`;
                return;
            }

            // 如果是第一次加载（offset=0），清空消息区域
            if (currentOffset === 0) {
                chatMessages.innerHTML = '';
            }

            // 将新消息插入到消息区域的开头（向上加载历史消息）
            messages.forEach(message => {
                const messageDiv = createMessageElement(message);
                chatMessages.insertBefore(messageDiv, chatMessages.firstChild);
            });
            
            // 更新偏移量，用于下次加载更多
            currentOffset += limit;

            document.getElementById('messageCountDisplay').textContent = `消息数量: ${data.total || 0}`;
            document.getElementById('latestTime').textContent = `最新消息: ${data.lastest_time || '暂无'}`;

        } else {
            chatMessages.innerHTML = '<div class="error">加载消息失败</div>';
        }
    } catch (error) {
        console.error('加载消息失败:', error);
        document.getElementById('chatMessages').innerHTML = '<div class="error">加载消息失败: ' + error.message + '</div>';
    }
}

// 创建消息元素
function createMessageElement(message) {
    const messageDiv = document.createElement('div');
    messageDiv.className = 'message';

    // 判断是否为自己的消息
    if (message.is_own) {
        messageDiv.classList.add('own');
    }

    const avatar = document.createElement('div');
    avatar.className = 'avatar';
    avatar.textContent = message.sender_name ? message.sender_name.charAt(0).toUpperCase() : 'U';

    const contentDiv = document.createElement('div');
    contentDiv.className = 'message-content';

    const senderDiv = document.createElement('div');
    senderDiv.className = 'message-sender';
    senderDiv.textContent = message.sender_name || '未知用户';

    const textDiv = document.createElement('div');
    textDiv.className = 'message-text';

    // 处理消息内容
    if (message.content) {
        if (message.type === 'chatrecord' && message.chatrecord_data) {
            const chatrecordBtn = document.createElement('button');
            chatrecordBtn.className = 'chatrecord-btn';
            chatrecordBtn.textContent = message.display_content || '[聊天记录]';
            chatrecordBtn.onclick = () => showChatRecordModal(message.chatrecord_data);
            textDiv.appendChild(chatrecordBtn);
        } else {
            textDiv.textContent = message.display_content;
        }
    } else {
        textDiv.textContent = '[空消息]';
    }

    const timeDiv = document.createElement('div');
    timeDiv.className = 'message-time';
    timeDiv.textContent = message.formatted_time;

    contentDiv.appendChild(senderDiv);
    contentDiv.appendChild(textDiv);
    contentDiv.appendChild(timeDiv);

    messageDiv.appendChild(avatar);
    messageDiv.appendChild(contentDiv);

    return messageDiv;
}


// 点击模态框外部关闭
window.onclick = function (event) {
    const modal = document.getElementById('chatRecordModal');
    if (event.target === modal) {
        modal.style.display = 'none';
    }
}