// 在文件开头添加调试日志
console.log('monitor.js 加载完成');

// 全局变量声明
let currentDirectory = null;
let selectedPid = null;
let updateInterval = null;
let cpuChart = null;
let memoryChart = null;
let gpuChart = null;

// 更新监控数据
function updateMonitorData(pid) {
    // 使用保存的监控类型
    const type = currentMonitorType;
    console.log('正在更新数据，类型:', type);  // 调试日志
    
    // 构建 URL，确保包含 type 参数
    const url = new URL(`${window.location.origin}/api/process/${pid}/status/`);
    url.searchParams.append('type', type);
    console.log('请求 URL:', url.toString());  // 调试日志

    fetch(url)
        .then(response => response.json())
        .then(response => {
            if (response.status === 'success') {
                const data = response.data;
                updateUI(data, type);
            }
        })
        .catch(error => handleError(error, '获取监控数据失败'));
}

// 获取所有监控按钮和停止按钮
const monitorButtons = document.querySelectorAll('[data-type]');
const stopBtn = document.getElementById('stopMonitor');
const pidInput = document.getElementById('pidInput');

// 保存当前监控类型的全局变量
let currentMonitorType = null;

// 开始监控
function startMonitoring(pid) {
    console.log('开始监控，类型:', currentMonitorType);  // 调试日志
    updateMonitorData(pid);  // 立即执行一次更新
    monitorInterval = setInterval(() => {
        updateMonitorData(pid);
    }, 60000);
}

// 停止监控
function stopMonitoring() {
    if (!currentDirectory) {
        console.error('没有正在监控的目录');
        showMessage('没有正在监控的目录', 'error');
        return;
    }
    
    const stopBtn = document.getElementById('stopDirectoryMonitor');
    if (!stopBtn) return;
    
    stopBtn.disabled = true;
    stopBtn.textContent = '正在停止...';
    
    // 先清理定时器
    if (updateInterval) {
        clearInterval(updateInterval);
        updateInterval = null;
    }
    
    const directoryToStop = currentDirectory;
    
    fetch('/monitor/stop-directory-monitor/', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'X-CSRFToken': getCSRFToken(),
        },
        body: JSON.stringify({ directory: directoryToStop })
    })
    .then(response => response.json())
    .then(data => {
        if (data.status === 'success') {
            cleanupMonitoringState();
            showMessage('监控已停止', 'success');
        } else {
            throw new Error(data.message || '停止监控失败');
        }
    })
    .catch(error => {
        console.error('停止监控失败:', error);
        showMessage(error.message || '停止监控失败', 'error');
        stopBtn.disabled = false;
    })
    .finally(() => {
        stopBtn.textContent = '停止监控';
    });
}

// 初始化图表
function initCharts() {
    console.log('初始化图表');
    cpuChart = echarts.init(document.getElementById('cpuChart'));
    memoryChart = echarts.init(document.getElementById('memoryChart'));
    gpuChart = echarts.init(document.getElementById('gpuChart'));
    
    const baseOption = {
        tooltip: {
            trigger: 'axis',
            formatter: function(params) {
                const time = new Date(params[0].value[0]).toLocaleTimeString();
                return `${time}<br/>${params[0].seriesName}: ${params[0].value[1].toFixed(2)}%`;
            }
        },
        xAxis: {
            type: 'time',
            splitLine: { show: false }
        },
        yAxis: {
            type: 'value',
            min: 0,
            max: 100,
            splitLine: { show: true }
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        series: [{
            type: 'line',
            showSymbol: false,
            data: [],
            smooth: true,
            areaStyle: {
                opacity: 0.1
            }
        }]
    };
    
    cpuChart.setOption({
        ...baseOption,
        series: [{
            ...baseOption.series[0],
            name: 'CPU使用率',
            itemStyle: { color: '#2196F3' }
        }]
    });
    
    memoryChart.setOption({
        ...baseOption,
        series: [{
            ...baseOption.series[0],
            name: '内存使用量',
            itemStyle: { color: '#4CAF50' }
        }]
    });
    
    gpuChart.setOption({
        ...baseOption,
        series: [{
            ...baseOption.series[0],
            name: 'GPU使用率',
            itemStyle: { color: '#FF5722' }
        }]
    });
}

// 更新图表数据
function updateCharts(process) {
    console.log('更新图表:', process);
    const now = new Date();
    
    // 更新CPU图表
    if (cpuChart) {
        updateChartData(cpuChart, now, process.cpu_usage);
    }
    
    // 更新内存图表
    if (memoryChart) {
        updateChartData(memoryChart, now, process.memory_usage);
    }
    
    // 更新GPU图表
    if (gpuChart && process.gpu_info) {
        updateChartData(gpuChart, now, process.gpu_info.usage);
    }
}

// 辅助函数：更新图表数据
function updateChartData(chart, time, value) {
    if (!chart) return;
    
    try {
        const option = chart.getOption();
        const data = option.series[0].data || [];
        data.push([time, value]);
        
        // 保持最近60个数据点
        if (data.length > 60) {
            data.shift();
        }
        
        chart.setOption({
            series: [{
                data: data
            }]
        });
    } catch (error) {
        console.error('更新图表数据失败:', error);
    }
}

// 修改更新进程表格函数
function updateProcessTable(processes) {
    console.log('更新进程表格:', processes);  // 调试日志
    const table = document.getElementById('processTable');
    if (!table) {
        console.error('找不到进程表格元素');
        return;
    }

    if (!processes || processes.length === 0) {
        table.innerHTML = `
            <tr>
                <td colspan="7" class="text-center">暂无进程数据</td>
            </tr>
        `;
        return;
    }

    table.innerHTML = processes.map(proc => `
        <tr class="${selectedPid && selectedPid == proc.pid ? 'table-primary' : ''}">
            <td>${proc.pid}</td>
            <td>${proc.name}</td>
            <td>
                <div class="d-flex align-items-center">
                    <div class="progress flex-grow-1" style="height: 6px;">
                        <div class="progress-bar" role="progressbar" 
                             style="width: ${proc.cpu_usage}%;" 
                             aria-valuenow="${proc.cpu_usage}" 
                             aria-valuemin="0" 
                             aria-valuemax="100">
                        </div>
                    </div>
                    <span class="ms-2">${proc.cpu_usage.toFixed(1)}%</span>
                </div>
            </td>
            <td>
                <div class="d-flex align-items-center">
                    <div class="progress flex-grow-1" style="height: 6px;">
                        <div class="progress-bar bg-success" role="progressbar" 
                             style="width: ${(proc.memory_usage/1000)*100}%;" 
                             aria-valuenow="${proc.memory_usage}" 
                             aria-valuemin="0" 
                             aria-valuemax="100">
                        </div>
                    </div>
                    <span class="ms-2">${proc.memory_usage.toFixed(1)} MB</span>
                </div>
            </td>
            <td>
                <div class="d-flex align-items-center">
                    <div class="progress flex-grow-1" style="height: 6px;">
                        <div class="progress-bar bg-warning" role="progressbar" 
                             style="width: ${proc.gpu_info.usage}%;" 
                             aria-valuenow="${proc.gpu_info.usage}" 
                             aria-valuemin="0" 
                             aria-valuemax="100">
                        </div>
                    </div>
                    <span class="ms-2">${proc.gpu_info.usage}%</span>
                </div>
            </td>
            <td>${proc.gpu_info.memory.toFixed(1)} MB</td>
            <td>
                <span class="badge bg-success">运行中</span>
                <button class="btn btn-sm btn-outline-primary ms-2" 
                        onclick="selectProcess(${proc.pid})">
                    查看详情
                </button>
            </td>
        </tr>
    `).join('');
}

// 修改选择进程的函数
function selectProcess(pid) {
    console.log('选择进程:', pid);
    selectedPid = pid.toString();  // 确保转换为字符串
    
    // 更新选择器
    const selector = document.getElementById('processSelector');
    if (selector) {
        selector.value = selectedPid;
    }
    
    // 更新表格中的选中状态
    const rows = document.querySelectorAll('#processTable tr');
    rows.forEach(row => {
        if (row.cells && row.cells[0] && row.cells[0].textContent === selectedPid) {
            row.classList.add('table-primary');
        } else {
            row.classList.remove('table-primary');
        }
    });
    
    // 获取最新数据并更新图表
    if (currentDirectory) {
        fetch(`/monitor/directory-status/?directory=${encodeURIComponent(currentDirectory)}`)
            .then(response => response.json())
            .then(data => {
                if (data.status === 'success' && data.processes) {
                    const selectedProcess = data.processes.find(p => p.pid.toString() === selectedPid);
                    if (selectedProcess) {
                        // 更新图表
                        updateCharts(selectedProcess);
                        // 更新详细信息
                        updateProcessDetails(selectedProcess);
                    }
                }
            })
            .catch(error => console.error('获取进程详情失败:', error));
    }
}

// 修改进程选择器更新函数
function updateProcessSelector(processes) {
    console.log('更新进程选择器，进程列表:', processes);  // 调试日志
    
    const selector = document.getElementById('processSelector');
    const processInfo = document.getElementById('selectedProcessInfo');
    
    if (!selector) {
        console.error('找不到进程选择器元素');
        return;
    }
    
    // 启用选择器
    selector.disabled = false;
    
    // 获取当前的进程列表
    const currentPids = processes.map(p => p.pid.toString());
    console.log('当前PID列表:', currentPids);  // 调试日志
    
    // 如果当前选中的进程不在列表中，清除选择
    if (selectedPid && !currentPids.includes(selectedPid.toString())) {
        console.log('选中的进程不再存在，清除选择');  // 调试日志
        selectedPid = null;
        clearCharts();
    }
    
    // 移除旧的事件监听器
    const newSelector = selector.cloneNode(true);
    selector.parentNode.replaceChild(newSelector, selector);
    
    // 更新选择器选项
    newSelector.innerHTML = `
        <option value="">选择要监控的进程</option>
        ${processes.map(proc => `
            <option value="${proc.pid}" ${proc.pid.toString() === selectedPid ? 'selected' : ''}>
                PID: ${proc.pid} - ${proc.name} (CPU: ${proc.cpu_usage.toFixed(2)}%)
            </option>
        `).join('')}
    `;
    
    // 添加新的事件监听器
    newSelector.addEventListener('change', function() {
        console.log('进程选择变更:', this.value);
        selectedPid = this.value;
        if (selectedPid) {
            const selected = processes.find(p => p.pid === parseInt(selectedPid));
            if (selected) {
                processInfo.textContent = `监控中: PID ${selected.pid} - ${selected.name}`;
                updateProcessDetails(selected);  // 更新详细信息
                clearCharts();
            }
        } else {
            processInfo.textContent = '未选择进程';
            clearCharts();
            // 清空详细信息
            ['basicInfo', 'resourceInfo', 'networkInfo', 'fileInfo'].forEach(id => {
                document.getElementById(id).innerHTML = '<p>选择进程查看详细信息</p>';
            });
        }
    });
    
    console.log('进程选择器更新完成');  // 调试日志
}

// 添加清除图表数据函数
function clearCharts() {
    const emptyOption = {
        series: [{
            data: []
        }]
    };
    cpuChart.setOption(emptyOption);
    memoryChart.setOption(emptyOption);
    gpuChart.setOption(emptyOption);
}

document.addEventListener('DOMContentLoaded', function() {
    console.log('DOM加载完成，开始初始化');
    
    const startBtn = document.getElementById('startDirectoryMonitor');
    const stopBtn = document.getElementById('stopDirectoryMonitor');
    
    if (!startBtn || !stopBtn) {
        console.error('找不到监控按钮元素');
        return;
    }
    
    // 初始化图表
    initCharts();
    
    // 开始监控按钮事件
    startBtn.addEventListener('click', function() {
        console.log('点击了开始监控按钮');
        const directory = document.getElementById('directoryInput').value;
        const statusDiv = document.getElementById('directoryMonitorStatus');
        
        if (!directory) {
            statusDiv.style.display = 'block';
            statusDiv.className = 'alert alert-warning';
            statusDiv.textContent = '请输入目录路径';
            return;
        }

        // 显示加载状态
        startBtn.disabled = true;
        startBtn.textContent = '启动中...';
        statusDiv.style.display = 'block';
        statusDiv.className = 'alert alert-info';
        statusDiv.textContent = '正在启动监控...';
        
        console.log('开始监控目录:', directory);
        
        // 清除旧的选择
        selectedPid = null;
        clearCharts();
        
        fetch('/monitor/scan-directory/', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({ directory: directory })
        })
        .then(response => response.json())
        .then(data => {
            console.log('接口返回:', data);
            if (data.status === 'success') {
                currentDirectory = directory;
                statusDiv.className = 'alert alert-success';
                statusDiv.textContent = data.message;
                startBtn.disabled = true;
                stopBtn.disabled = false;
                
                // 开始定期获取详细信息
                if (updateInterval) {
                    clearInterval(updateInterval);
                }
                currentDirectory = directory;
                getProcessDetails(directory);  // 立即获取一次
                updateInterval = setInterval(() => getProcessDetails(directory), 5000);  // 每5秒更新一次
            } else {
                statusDiv.className = 'alert alert-danger';
                statusDiv.textContent = data.message;
                startBtn.disabled = false;
            }
        })
        .catch(error => {
            console.error('监控启动失败:', error);
            statusDiv.className = 'alert alert-danger';
            statusDiv.textContent = '启动监控失败: ' + error.message;
            startBtn.disabled = false;
        })
        .finally(() => {
            startBtn.textContent = '开始监控';
        });
    });

    // 停止监控按钮事件
    if (stopBtn) {
        stopBtn.addEventListener('click', function() {
            console.log('停止监控，当前目录:', currentDirectory);
            
            // 检查是否有当前目录
            if (!currentDirectory) {
                console.error('没有正在监控的目录');
                showMessage('没有正在监控的目录', 'error');
                return;
            }
            
            // 禁用按钮，防止重复点击
            stopBtn.disabled = true;
            stopBtn.textContent = '正在停止...';
            
            // 先清理定时器，防止继续发送请求
            if (updateInterval) {
                clearInterval(updateInterval);
                updateInterval = null;
            }
            
            // 保存当前目录的副本
            const directoryToStop = currentDirectory;
            
            // 发送停止监控请求到服务器
            fetch('/monitor/stop-directory-monitor/', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'X-CSRFToken': getCSRFToken(),
                },
                body: JSON.stringify({ 
                    directory: directoryToStop,
                    timestamp: new Date().getTime()  // 添加时间戳防止缓存
                })
            })
            .then(response => {
                if (!response.ok) {
                    throw new Error('Network response was not ok');
                }
                return response.json();
            })
            .then(data => {
                console.log('停止监控响应:', data);
                if (data.status === 'success') {
                    // 清理前端状态
                    cleanupMonitoringState();
                    // 显示成功消息
                    showMessage('监控已停止', 'success');
                } else {
                    throw new Error(data.message || '停止监控失败');
                }
            })
            .catch(error => {
                console.error('停止监控失败:', error);
                showMessage(error.message || '停止监控请求失败', 'error');
                // 恢复按钮状态
                stopBtn.disabled = false;
                stopBtn.textContent = '停止监控';
            });
        });
    }

    // 初始状态设置
    stopBtn.disabled = true;  // 初始状态下停止按钮禁用
    console.log('初始化完成');

    // 为每个监控按钮添加点击事件
    monitorButtons.forEach(button => {
        button.addEventListener('click', function() {
            const pid = pidInput.value.trim();
            const type = this.dataset.type;  // 从按钮的 data-type 属性获取类型
            
            if (!pid) {
                alert('请输入进程ID');
                return;
            }

            // 保存当前选择的监控类型
            currentMonitorType = type;
            console.log('设置监控类型为:', currentMonitorType);

            fetch(`/monitor/start/?pid=${pid}&type=${type}`)
                .then(response => response.json())
                .then(data => {
                    if (data.status === 'success') {
                        startMonitoring(pid);
                        // 禁用所有监控按钮
                        monitorButtons.forEach(btn => btn.disabled = true);
                        stopBtn.disabled = false;
                        pidInput.disabled = true;
                    } else {
                        alert(data.message);
                    }
                })
                .catch(error => {
                    console.error('启动监控失败:', error);
                    alert('启动监控失败');
                });
        });
    });

    // 获取自动检测按钮
    const startAutoDetectBtn = document.getElementById('startAutoDetectBtn');
    const stopAutoDetectBtn = document.getElementById('stopAutoDetectBtn');

    // 获取CSRF Token
    function getCSRFToken() {
        const name = 'csrftoken';
        let cookieValue = null;
        if (document.cookie && document.cookie !== '') {
            const cookies = document.cookie.split(';');
            for (let i = 0; i < cookies.length; i++) {
                const cookie = cookies[i].trim();
                if (cookie.substring(0, name.length + 1) === (name + '=')) {
                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                    break;
                }
            }
        }
        return cookieValue;
    }

    // 添加自动检测开始按钮事件
    startAutoDetectBtn.addEventListener('click', function() {
        fetch('/auto_detect/', {
            method: 'POST',
            headers: {
                'X-CSRFToken': getCSRFToken(),
                'Content-Type': 'application/json'
            }
        })
        .then(response => response.json())
        .then(data => {
            if (data.status === 'success') {
                alert('已开始自动检测高资源进程');
                startAutoDetectBtn.disabled = true;
                stopAutoDetectBtn.disabled = false;
            } else {
                alert(data.message);
            }
        })
        .catch(error => {
            console.error('启动自动检测失败:', error);
            alert('启动自动检测失败');
        });
    });

    // 添加自动检测停止按钮事件
    stopAutoDetectBtn.addEventListener('click', function() {
        fetch('/stop_auto_detect/', {
            method: 'POST',
            headers: {
                'X-CSRFToken': getCSRFToken(),
                'Content-Type': 'application/json'
            }
        })
        .then(response => response.json())
        .then(data => {
            if (data.status === 'success') {
                alert('已停止自动检测');
                startAutoDetectBtn.disabled = false;
                stopAutoDetectBtn.disabled = true;
            } else {
                alert(data.message);
            }
        })
        .catch(error => {
            console.error('停止自动检测失败:', error);
            alert('停止自动检测失败');
        });
    });
});

// 更新 UI 的函数
function updateUI(data, type) {
    // 根据监控类型更新对应的表格
    if (type === 'all' || type === 'cpu') {
        document.getElementById('cpuTable').innerHTML = `
            <tr><td>使用率</td><td>${data.cpu.usage}</td></tr>
            <tr><td>用户态时间</td><td>${data.cpu.user_time}</td></tr>
            <tr><td>内核态时间</td><td>${data.cpu.system_time}</td></tr>
            <tr><td>CPU核心数</td><td>${data.cpu.cores}</td></tr>
            <tr><td>CPU频率</td><td>${data.cpu.frequency}</td></tr>
            <tr><td>上下文切换</td><td>${data.cpu.context_switches}</td></tr>
        `;
        document.getElementById('cpuStatus').className = 'badge bg-success status-badge';
        document.getElementById('cpuStatus').textContent = '监控中';
    }

    if (type === 'all' || type === 'memory') {
        document.getElementById('memoryTable').innerHTML = `
            <tr><td>物理内存</td><td>${data.memory.physical}</td></tr>
            <tr><td>虚拟内存</td><td>${data.memory.virtual}</td></tr>
            <tr><td>内存映射</td><td>${data.memory.mappings}</td></tr>
            <tr><td>系统内存使用</td><td>${data.memory.system_usage}</td></tr>
            <tr><td>交换空间使用</td><td>${data.memory.swap_usage}</td></tr>
        `;
        document.getElementById('memoryStatus').className = 'badge bg-success status-badge';
        document.getElementById('memoryStatus').textContent = '监控中';
    }

    if (type === 'all' || type === 'gpu') {
        document.getElementById('gpuTable').innerHTML = `
            <tr><td>使用率</td><td>${data.gpu.usage}</td></tr>
            <tr><td>显存使用</td><td>${data.gpu.memory}</td></tr>
        `;
        document.getElementById('gpuStatus').className = 'badge bg-success status-badge';
        document.getElementById('gpuStatus').textContent = '监控中';
    }

    // 更新最后更新时间
    document.getElementById('lastUpdate').textContent = 
        `最后更新: ${data.timestamp}`;
}

// 添加错误处理函数
function handleError(error, message) {
    console.error(message, error);
    ['cpu', 'gpu', 'memory'].forEach(type => {
        const statusElement = document.getElementById(`${type}Status`);
        if (statusElement) {
            statusElement.className = 'badge bg-danger status-badge';
            statusElement.textContent = '错误';
        }
    });
    alert(message);
}

// 窗口大小改变时调整图表大小
window.addEventListener('resize', function() {
    if (cpuChart) cpuChart.resize();
    if (memoryChart) memoryChart.resize();
    if (gpuChart) gpuChart.resize();
});

// 更新进程详细信息的函数
function updateProcessDetails(process) {
    if (!process) return;
    
    // 检查元素是否存在
    const basicInfo = document.getElementById('basicInfo');
    const resourceInfo = document.getElementById('resourceInfo');
    
    if (!basicInfo || !resourceInfo) {
        console.error('找不到详情显示元素');
        return;
    }
    
    try {
        // 更新基本信息
        basicInfo.innerHTML = `
            <dl class="row mb-0">
                <dt class="col-sm-4">PID</dt>
                <dd class="col-sm-8">${process.pid}</dd>
                
                <dt class="col-sm-4">进程名</dt>
                <dd class="col-sm-8">${process.name}</dd>
                
                <dt class="col-sm-4">命令行</dt>
                <dd class="col-sm-8"><small class="text-muted">${process.command_line}</small></dd>
                
                <dt class="col-sm-4">工作目录</dt>
                <dd class="col-sm-8"><small class="text-muted">${process.working_directory}</small></dd>
                
                <dt class="col-sm-4">创建时间</dt>
                <dd class="col-sm-8">${process.create_time}</dd>
            </dl>
        `;

        // 更新资源信息
        resourceInfo.innerHTML = `
            <dl class="row mb-0">
                <dt class="col-sm-4">CPU使用率</dt>
                <dd class="col-sm-8">${process.cpu_usage.toFixed(2)}%</dd>
                
                <dt class="col-sm-4">内存使用</dt>
                <dd class="col-sm-8">${process.memory_usage.toFixed(2)} MB</dd>
                
                <dt class="col-sm-4">线程数</dt>
                <dd class="col-sm-8">${process.threads}</dd>
                
                <dt class="col-sm-4">GPU使用率</dt>
                <dd class="col-sm-8">${process.gpu_info.usage}%</dd>
                
                <dt class="col-sm-4">GPU内存</dt>
                <dd class="col-sm-8">${process.gpu_info.memory.toFixed(2)} MB</dd>
            </dl>
        `;
    } catch (error) {
        console.error('更新进程详情失败:', error);
    }
}

// 修改定期更新函数
function startPeriodicUpdate(directory) {
    console.log('开始定期更新, 目录:', directory);
    
    if (updateInterval) {
        clearInterval(updateInterval);
    }
    
    // 立即执行一次更新
    getProcessDetails(directory);
    
    // 设置定时更新
    updateInterval = setInterval(() => {
        getProcessDetails(directory);
    }, 5000);
}

// 修改获取进程详情的函数
function getProcessDetails(directory) {
    if (!directory || !currentDirectory) {  // 添加currentDirectory检查
        console.log('没有目录或已停止监控');
        return;
    }
    
    // 使用 AbortController 来控制fetch请求
    if (window.currentFetch) {
        window.currentFetch.abort();
    }
    window.currentFetch = new AbortController();
    
    fetch(`/monitor/directory-status/?directory=${encodeURIComponent(directory)}`, {
        signal: window.currentFetch.signal
    })
        .then(response => response.json())
        .then(data => {
            if (!currentDirectory) {  // 再次检查是否已停止监控
                console.log('监控已停止，不更新数据');
                return;
            }
            
            console.log('收到进程数据:', data);
            if (data.status === 'success' && data.processes && data.processes.length > 0) {
                updateProcessTable(data.processes);
                
                if (selectedPid) {
                    const selectedProcess = data.processes.find(p => p.pid.toString() === selectedPid);
                    if (selectedProcess) {
                        updateCharts(selectedProcess);
                        updateProcessDetails(selectedProcess);
                    }
                }
            }
        })
        .catch(error => {
            if (error.name === 'AbortError') {
                console.log('请求被中止');
            } else {
                console.error('获取进程详情失败:', error);
            }
        });
}

// 获取所有正在监控的进程ID
function getAllMonitoredPids() {
    const table = document.getElementById('processTable');
    if (!table) return [];
    
    const pids = [];
    const rows = table.getElementsByTagName('tr');
    for (let row of rows) {
        const firstCell = row.cells[0];
        if (firstCell && !isNaN(firstCell.textContent)) {
            pids.push(firstCell.textContent);
        }
    }
    return pids;
}

// 修改清理监控状态的函数
function cleanupMonitoringState() {
    console.log('清理监控状态');
    
    // 先取消所有正在进行的请求
    if (window.currentFetch) {
        window.currentFetch.abort();
        window.currentFetch = null;
    }
    
    // 清除定时器
    if (updateInterval) {
        clearInterval(updateInterval);
        updateInterval = null;
    }
    
    // 清除状态变量（在清理完其他内容后再清除）
    const oldDirectory = currentDirectory;
    currentDirectory = null;
    selectedPid = null;
    
    console.log('已清除的目录:', oldDirectory);
    
    // 清空图表
    clearCharts();
    
    // 清空进程列表
    const processTable = document.getElementById('processTable');
    if (processTable) {
        processTable.innerHTML = `
            <tr>
                <td colspan="8" class="text-center">未开始监控</td>
            </tr>
        `;
    }
    
    // 清空详细信息
    const basicInfo = document.getElementById('basicInfo');
    const resourceInfo = document.getElementById('resourceInfo');
    
    if (basicInfo) {
        basicInfo.innerHTML = '<p class="text-center text-muted">未选择进程</p>';
    }
    if (resourceInfo) {
        resourceInfo.innerHTML = '<p class="text-center text-muted">未选择进程</p>';
    }
    
    // 更新按钮状态
    const startBtn = document.getElementById('startDirectoryMonitor');
    const stopBtn = document.getElementById('stopDirectoryMonitor');
    if (startBtn) startBtn.disabled = false;
    if (stopBtn) {
        stopBtn.disabled = true;
        stopBtn.textContent = '停止监控';
    }
}

// 添加显示消息的函数
function showMessage(message, type = 'info') {
    const statusDiv = document.getElementById('directoryMonitorStatus');
    if (statusDiv) {
        statusDiv.style.display = 'block';
        statusDiv.className = `alert alert-${type}`;
        statusDiv.textContent = message;
        
        // 3秒后自动隐藏
        setTimeout(() => {
            statusDiv.style.display = 'none';
        }, 3000);
    }
}