Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Flare Admin UI</title> | |
| <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> | |
| <link rel="stylesheet" href="style.css"> | |
| </head> | |
| <body class="p-4"> | |
| <div class="container"> | |
| <h1 class="mb-4 text-center">🔥 Flare Admin UI</h1> | |
| <!-- Login Panel --> | |
| <div id="login-panel" class="card mb-3"> | |
| <div class="card-header">Login</div> | |
| <div class="card-body"> | |
| <input type="text" id="login-username" class="form-control mb-2" placeholder="Username"> | |
| <input type="password" id="login-password" class="form-control mb-2" placeholder="Password"> | |
| <button class="btn btn-primary btn-block" onclick="login()">Login</button> | |
| <div id="login-result" class="mt-2 text-danger"></div> | |
| </div> | |
| </div> | |
| <!-- Main Tabs Panel (hidden until login) --> | |
| <div id="main-tabs" class="d-none"> | |
| <ul class="nav nav-tabs mb-3" role="tablist"> | |
| <li class="nav-item"><a class="nav-link active" data-toggle="tab" href="#config" role="tab">Config</a></li> | |
| <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#projects" role="tab">Projects</a></li> | |
| <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#spark" role="tab">Spark</a></li> | |
| <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#test" role="tab">Test</a></li> | |
| <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#admin" role="tab">Admin Tools</a></li> | |
| <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#api" role="tab">API Definitions</a></li> | |
| </ul> | |
| <div class="tab-content"> | |
| <!-- Config Tab --> | |
| <div class="tab-pane fade show active" id="config" role="tabpanel"> | |
| <form> | |
| <div class="form-group"> | |
| <label for="work-mode">Work Mode</label> | |
| <select id="work-mode" class="form-control" onchange="toggleCloudToken()"> | |
| <option value="hfcloud">hfcloud</option> | |
| <option value="cloud">cloud</option> | |
| <option value="on-premise">on-premise</option> | |
| </select> | |
| </div> | |
| <div class="form-group"> | |
| <label for="cloud-token">Cloud Token</label> | |
| <input type="text" id="cloud-token" class="form-control"> | |
| </div> | |
| <button type="button" class="btn btn-info mb-2" onclick="getConfig()">Load Config</button> | |
| <button type="button" class="btn btn-success mb-2" onclick="updateConfig()">Update Config</button> | |
| <div id="config-result" class="mt-2"></div> | |
| </form> | |
| </div> | |
| <!-- Projects Tab --> | |
| <div class="tab-pane fade" id="projects" role="tabpanel"> | |
| <button class="btn btn-info mb-2" onclick="listProjects()">Refresh Project List</button> | |
| <div class="form-group"> | |
| <label for="project-select">Select Project</label> | |
| <select id="project-select" class="form-control" onchange="loadProjectDetails()"> | |
| <option value="">-- Select a project --</option> | |
| </select> | |
| </div> | |
| <div id="project-details" class="mt-3 d-none"> | |
| <h5>Project Details</h5> | |
| <div id="project-info"></div> | |
| <button class="btn btn-success mt-2" onclick="saveProject()">Save Changes</button> | |
| <button class="btn btn-warning mt-2" onclick="publishProject()">Publish Version</button> | |
| </div> | |
| <div id="project-result" class="mt-2"></div> | |
| </div> | |
| <!-- Spark Tab --> | |
| <div class="tab-pane fade" id="spark" role="tabpanel"> | |
| <button class="btn btn-info mb-2" onclick="sparkProjectList()">Get Spark Project List</button> | |
| <div id="spark-table" class="table-responsive"> | |
| <table class="table table-bordered"> | |
| <thead> | |
| <tr> | |
| <th>Project</th> | |
| <th>Version</th> | |
| <th>Enabled</th> | |
| <th>Status</th> | |
| <th>Last Accessed</th> | |
| </tr> | |
| </thead> | |
| <tbody id="spark-body"> | |
| <!-- Spark rows here --> | |
| </tbody> | |
| </table> | |
| </div> | |
| <div id="spark-result" class="mt-2"></div> | |
| </div> | |
| <!-- Test Tab --> | |
| <div class="tab-pane fade" id="test" role="tabpanel"> | |
| <button class="btn btn-warning mb-2" onclick="runTests()">Run All Tests</button> | |
| <div id="test-result" class="mt-2"></div> | |
| </div> | |
| <!-- Admin Tools Tab --> | |
| <div class="tab-pane fade" id="admin" role="tabpanel"> | |
| <button class="btn btn-danger mb-2" onclick="seedTestData()">Seed Test Data</button> | |
| <button class="btn btn-danger mb-2" onclick="clearAllProjects()">Clear All Projects</button> | |
| <div id="admin-result" class="mt-2"></div> | |
| </div> | |
| <!-- API Definitions Tab --> | |
| <div class="tab-pane fade" id="api" role="tabpanel"> | |
| <button class="btn btn-info mb-2" onclick="listApis()">Refresh API List</button> | |
| <button class="btn btn-success mb-2" onclick="addApi()">+ Add API</button> | |
| <div id="api-table" class="table-responsive"> | |
| <table class="table table-bordered"> | |
| <thead> | |
| <tr> | |
| <th>API Name</th> | |
| <th>URL</th> | |
| <th>Method</th> | |
| <th>Actions</th> | |
| </tr> | |
| </thead> | |
| <tbody id="api-body"> | |
| <!-- API rows here --> | |
| </tbody> | |
| </table> | |
| </div> | |
| <div id="api-result" class="mt-2"></div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Intent Edit Modal --> | |
| <div class="modal fade" id="intentModal" tabindex="-1" role="dialog" aria-labelledby="intentModalLabel" aria-hidden="true"> | |
| <div class="modal-dialog modal-lg" role="document"> | |
| <div class="modal-content"> | |
| <div class="modal-header"> | |
| <h5 class="modal-title" id="intentModalLabel">Edit Intent</h5> | |
| <button type="button" class="close" data-dismiss="modal" aria-label="Close"> | |
| <span aria-hidden="true">×</span> | |
| </button> | |
| </div> | |
| <div class="modal-body"> | |
| <input type="hidden" id="intent-project-name"> | |
| <input type="hidden" id="intent-name"> | |
| <div class="form-group"> | |
| <label for="intent-action">Action (API)</label> | |
| <input type="text" id="intent-action" class="form-control"> | |
| </div> | |
| <div class="form-group"> | |
| <label for="intent-fallback">Fallback Error Message</label> | |
| <input type="text" id="intent-fallback" class="form-control"> | |
| </div> | |
| <div class="form-group"> | |
| <label for="intent-prompt">Humanization Prompt</label> | |
| <textarea id="intent-prompt" class="form-control"></textarea> | |
| </div> | |
| <div class="form-group"> | |
| <label for="intent-examples">Examples (comma-separated)</label> | |
| <input type="text" id="intent-examples" class="form-control"> | |
| </div> | |
| <div class="form-group"> | |
| <label>Parameters</label> | |
| <button class="btn btn-sm btn-success ml-2" onclick="addParameterRow()">+ Add Parameter</button> | |
| <table class="table table-sm mt-2"> | |
| <thead> | |
| <tr> | |
| <th>Name</th> | |
| <th>Type</th> | |
| <th>Regex</th> | |
| <th>Validation Message</th> | |
| <th>Actions</th> | |
| </tr> | |
| </thead> | |
| <tbody id="parameter-body"> | |
| <!-- parameter rows --> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| <div class="modal-footer"> | |
| <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> | |
| <button type="button" class="btn btn-primary" onclick="saveIntent()">Save Changes</button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- JS Files --> | |
| <script src="js/common.js"></script> | |
| <script src="js/auth.js"></script> | |
| <script src="js/config.js"></script> | |
| <script src="js/project.js"></script> | |
| <script src="js/spark.js"></script> | |
| <script src="js/test.js"></script> | |
| <script src="js/admin.js"></script> | |
| <script src="js/api.js"></script> | |
| <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script> | |
| </body> | |
| </html> | |