python-code
/
wqb-server


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342
							<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>BRAIN Alpha 模拟器 - 用户界面</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}">
    <style>
        .simulator-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 20px;
        }

        .simulator-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 20px;
            margin-top: 20px;
        }

        .simulator-panel {
            background: #f8f9fa;
            border-radius: 8px;
            padding: 20px;
            border: 1px solid #dee2e6;
        }

        .form-group {
            margin-bottom: 15px;
        }

        .form-group label {
            display: block;
            margin-bottom: 5px;
            font-weight: 600;
            color: #495057;
        }

        .form-group input, .form-group textarea, .form-group select {
            width: 100%;
            padding: 8px 12px;
            border: 1px solid #ced4da;
            border-radius: 4px;
            font-size: 14px;
        }

        .form-group input[type="number"] {
            width: 120px;
        }

        .form-group input[type="file"] {
            padding: 4px;
        }

        .form-group textarea {
            height: 60px;
            resize: vertical;
        }

        .checkbox-group {
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .checkbox-group input[type="checkbox"] {
            width: auto;
        }

        .log-viewer {
            background: #1e1e1e;
            color: #f8f8f2;
            padding: 15px;
            border-radius: 4px;
            font-family: 'Courier New', 'SimSun', 'Microsoft YaHei', monospace;
            font-size: 12px;
            height: 300px;
            overflow-y: auto;
            white-space: pre-wrap;
            margin-top: 10px;
            unicode-bidi: embed;
            word-break: break-all;
        }

        .status-indicator {
            padding: 8px 12px;
            border-radius: 4px;
            font-weight: 500;
            margin-bottom: 15px;
        }

        .status-idle {
            background: #e9ecef;
            color: #495057;
        }

        .status-running {
            background: #fff3cd;
            color: #856404;
        }

        .status-success {
            background: #d1edff;
            color: #0c5460;
        }

        .status-error {
            background: #f8d7da;
            color: #721c24;
        }

        .parameter-help {
            font-size: 12px;
            color: #6c757d;
            margin-top: 4px;
        }

        .action-buttons {
            display: flex;
            gap: 10px;
            margin-top: 20px;
        }

        .btn-run {
            background: #28a745;
            color: white;
            border: none;
            padding: 12px 24px;
            border-radius: 4px;
            font-size: 16px;
            font-weight: 500;
            cursor: pointer;
        }

        .btn-run:hover {
            background: #218838;
        }

        .btn-run:disabled {
            background: #6c757d;
            cursor: not-allowed;
        }

        .password-input {
            position: relative;
        }

        .password-toggle {
            position: absolute;
            right: 10px;
            top: 50%;
            transform: translateY(-50%);
            background: none;
            border: none;
            cursor: pointer;
            color: #6c757d;
        }

        .file-info {
            margin-top: 8px;
            padding: 8px;
            background: #e9ecef;
            border-radius: 4px;
            font-size: 12px;
        }

        .back-link {
            color: #007bff;
            text-decoration: none;
            margin-bottom: 20px;
            display: inline-block;
        }

        .back-link:hover {
            text-decoration: underline;
        }

        .warning-box {
            background: #fff3cd;
            border: 1px solid #ffeaa7;
            border-radius: 4px;
            padding: 12px;
            margin: 10px 0;
            color: #856404;
        }

        .info-box {
            background: #d1ecf1;
            border: 1px solid #bee5eb;
            border-radius: 4px;
            padding: 12px;
            margin: 10px 0;
            color: #0c5460;
        }
    </style>
</head>
<body>
    <div class="simulator-container">
        <a href="/" class="back-link">← 返回主页</a>

        <header>
            <h1>🚀 BRAIN Alpha 模拟器</h1>
            <p class="subtitle">用户友好的界面，用于运行 alpha 模拟</p>

            <div class="status-indicator" id="simulatorStatus">
                准备配置模拟参数
            </div>
        </header>

        <div class="simulator-grid">
            <!-- 配置面板 -->
            <div class="simulator-panel">
                <h3>📋 模拟配置</h3>

                <form id="simulatorForm">
                    <!-- JSON 文件选择 -->
                    <div class="form-group">
                        <label for="jsonFile">📁 表达式 JSON 文件</label>
                        <input type="file" id="jsonFile" accept=".json" required>
                        <div class="parameter-help">选择 expressions_with_settings.json 文件</div>
                        <div id="jsonFileInfo" class="file-info" style="display: none;"></div>
                    </div>

                    <!-- 身份验证 -->
                    <div class="form-group">
                        <label for="username">👤 BRAIN 用户名</label>
                        <input type="text" id="username" required placeholder="your.email@domain.com">
                    </div>

                    <div class="form-group">
                        <label for="password">🔒 BRAIN 密码</label>
                        <div class="password-input">
                            <input type="password" id="password" required placeholder="您的密码">
                            <button type="button" class="password-toggle" onclick="togglePassword()">👁️</button>
                        </div>
                    </div>

                    <!-- 模拟参数 -->
                    <div class="form-group">
                        <label for="startPosition">🎯 起始位置</label>
                        <input type="number" id="startPosition" min="0" value="0" required>
                        <div class="parameter-help">从表达式 N 开始（基于 0 的索引）</div>
                    </div>

                    <div class="form-group">
                        <label for="concurrentCount">⚡ 并发模拟</label>
                        <input type="number" id="concurrentCount" min="1" value="3" required>
                        <div class="parameter-help">并行模拟的数量</div>
                    </div>

                    <!-- 高级选项 -->
                    <div class="form-group">
                        <div class="checkbox-group">
                            <input type="checkbox" id="randomShuffle">
                            <label for="randomShuffle">🔀 随机打乱</label>
                        </div>
                        <div class="parameter-help">随机打乱表达式顺序</div>
                    </div>

                    <div class="form-group">
                        <div class="checkbox-group">
                            <input type="checkbox" id="useMultiSim" onchange="toggleMultiSimOptions()">
                            <label for="useMultiSim">🎛️ 多重模拟模式</label>
                        </div>
                        <div class="parameter-help">在一个模拟槽中组合多个 alpha</div>
                    </div>

                    <div class="form-group" id="multiSimOptions" style="display: none;">
                        <label for="alphaCountPerSlot">📊 每个槽的 Alphas</label>
                        <input type="number" id="alphaCountPerSlot" min="2" max="10" value="3">
                        <div class="parameter-help">每个多重模拟槽的 alpha 数量（2-10）</div>
                    </div>

                    <div class="warning-box" id="overwriteWarning" style="display: none;">
                        ⚠️ 警告：如果起始位置 > 0 或启用了随机打乱，则原始 JSON 文件将被覆盖！
                    </div>
                </form>

                <div class="action-buttons">
                    <button class="btn-run" id="runSimulator" onclick="runSimulator()">
                        🚀 开始模拟
                    </button>
                    <button class="btn btn-outline" onclick="testConnection()" id="testBtn">
                        🔗 测试连接
                    </button>
                    <button class="btn btn-outline" onclick="stopSimulation()" id="stopBtn" style="display: none;">
                        ⏹️ 停止
                    </button>
                </div>
            </div>

            <!-- 日志查看面板 -->
            <div class="simulator-panel">
                <h3>📊 模拟日志与状态</h3>

                <div class="info-box" id="currentLogFile">
                    未选择日志文件。模拟开始时将自动监控最新日志。
                </div>

                <div class="form-group">
                    <label for="logSelector">📁 选择日志文件</label>
                    <select id="logSelector" onchange="loadSelectedLog()">
                        <option value="">选择一个日志文件...</option>
                    </select>
                    <button class="btn btn-small btn-outline" onclick="refreshLogFiles()">🔄 刷新</button>
                </div>

                <div class="log-viewer" id="logViewer">
                    欢迎使用 BRAIN Alpha 模拟器！

                    该界面将显示：
                    - 实时模拟进度
                    - 身份验证状态
                    - Alpha 生成结果
                    - 错误消息和警告

                    配置您的参数并点击“开始模拟”以开始。
                </div>

                <div id="simulationProgress" style="margin-top: 15px; display: none;">
                    <div style="display: flex; justify-content: space-between; align-items: center;">
                        <span>进度：</span>
                        <span id="progressText">0/0</span>
                    </div>
                    <div style="background: #e9ecef; height: 8px; border-radius: 4px; margin-top: 5px;">
                        <div id="progressBar" style="background: #28a745; height: 100%; border-radius: 4px; width: 0%; transition: width 0.3s;"></div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 结果部分 -->
        <div class="simulator-panel" id="resultsPanel" style="margin-top: 20px; display: none;">
            <h3>✅ 模拟请求成功发送</h3>
            <div id="simulationResults"></div>
        </div>
    </div>

    <script src="{{ url_for('static', filename='simulator.js') }}"></script>
</body>
</html>