Spaces:
Runtime error
Runtime error
| <html> | |
| <head> | |
| <title>AI SQL Assistant</title> | |
| <style> | |
| body { font-family: Arial, sans-serif; margin: 20px; } | |
| .container { max-width: 800px; margin: auto; } | |
| .section { margin-bottom: 20px; } | |
| label { display: block; margin-bottom: 5px; } | |
| input[type="text"], input[type="password"], input[type="number"] { width: 100%; max-width: 300px; padding: 5px; margin-bottom: 10px; } | |
| button { padding: 10px 20px; background-color: #4CAF50; color: white; border: none; cursor: pointer; } | |
| button:hover { background-color: #45a049; } | |
| .error { color: red; } | |
| .success { color: green; } | |
| table { border-collapse: collapse; width: 100%; } | |
| th, td { border: 1px solid #ddd; padding: 8px; text-align: left; } | |
| th { background-color: #f2f2f2; } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <h1>AI SQL Assistant</h1> | |
| {% if error %} | |
| <p class="error">{{ error }}</p> | |
| {% endif %} | |
| {% if success %} | |
| <p class="success">{{ success }}</p> | |
| {% endif %} | |
| <div class="section"> | |
| <h2>Configure MySQL Connection</h2> | |
| <form method="POST" action="/configure_db"> | |
| <label for="host">Host:</label><input type="text" id="host" name="host" value="localhost" required> | |
| <label for="user">User:</label><input type="text" id="user" name="user" value="root" required> | |
| <label for="password">Password:</label><input type="password" id="password" name="password" required> | |
| <label for="port">Port:</label><input type="number" id="port" name="port" value="3306" required> | |
| <input type="hidden" name="debug" value="test"> | |
| <button type="submit">Save Connection</button> | |
| </form> | |
| </div> | |
| <div class="section"> | |
| <h2>Upload SQL File</h2> | |
| <form method="POST" enctype="multipart/form-data"> | |
| <label for="sql_file">Upload .sql file:</label> | |
| <input type="file" id="sql_file" name="sql_file" accept=".sql" required> | |
| <button type="submit">Upload</button> | |
| </form> | |
| {% if schema %} | |
| <h3>Database Schema</h3> | |
| <table> | |
| <tr><th>Table</th><th>Columns</th></tr> | |
| {% for table, columns in schema.items() %} | |
| <tr><td>{{ table }}</td><td>{{ columns|join(', ') }}</td></tr> | |
| {% endfor %} | |
| </table> | |
| {% endif %} | |
| {% if summary %} | |
| <h3>Schema Summary</h3> | |
| <p>{{ summary.description }}</p> | |
| <h4>Main Tables</h4> | |
| <ul> | |
| {% for table, columns in summary.main_tables.items() %} | |
| <li>{{ table }}: {{ columns|join(', ') }}</li> | |
| {% endfor %} | |
| </ul> | |
| <h4>Relationships</h4> | |
| <ul> | |
| {% for rel in summary.relationships %} | |
| <li>{{ rel }}</li> | |
| {% endfor %} | |
| </ul> | |
| <h4>Suggestions</h4> | |
| <p>Evaluation: {{ summary.suggestions.evaluation }}</p> | |
| <p>Note: {{ summary.suggestions.note }}</p> | |
| <ul> | |
| {% for rec in summary.suggestions.recommendations %} | |
| <li>{{ rec }}</li> | |
| {% endfor %} | |
| </ul> | |
| {% endif %} | |
| </div> | |
| <div class="section"> | |
| <h2>Ask a Question</h2> | |
| <form method="POST"> | |
| <label for="question">Enter your question:</label><br> | |
| <input type="text" id="question" name="question" style="width: 100%; max-width: 600px;" required><br> | |
| <button type="submit">Submit</button> | |
| </form> | |
| {% if query %} | |
| <h3>Generated Query</h3> | |
| <p>{{ query }}</p> | |
| {% endif %} | |
| {% if results %} | |
| <h3>Results</h3> | |
| <table> | |
| <tr> | |
| {% for key in results[0].keys() %} | |
| <th>{{ key }}</th> | |
| {% endfor %} | |
| </tr> | |
| {% for row in results %} | |
| <tr> | |
| {% for value in row.values() %} | |
| <td>{{ value }}</td> | |
| {% endfor %} | |
| </tr> | |
| {% endfor %} | |
| </table> | |
| {% endif %} | |
| </div> | |
| </div> | |
| </body> | |
| </html> |