From 8a8d2f02fa0164c06879111db19e6d815c588507 Mon Sep 17 00:00:00 2001 From: ijuanes Date: Wed, 3 Jun 2026 10:43:17 +0100 Subject: [PATCH 01/39] Initial commit: Tablet lending system with user-tablet many-to-many relationship - Database schema: tablets, users, loans (junction table) - CLI app: minimal_app.py - Web apps: app.py (Flask), simple_app.py (http.server) - Features: loan management, search, user loans view, project notes - Git structure: CONTRIBUTING.md, .gitignore Generated by Mistral Vibe. Co-Authored-By: Mistral Vibe --- .gitignore | 31 ++ CONTRIBUTING.md | 82 +++++ README.md | 158 +++++++++ RUNNING.md | 57 +++ app.py | 330 ++++++++++++++++++ basic_server.py | 81 +++++ check_flask.py | 20 ++ debug_server.py | 20 ++ index.html | 47 +++ main.py | 6 + minimal_app.py | 296 ++++++++++++++++ pyproject.toml | 7 + requirements.txt | 1 + setup.py | 60 ++++ simple_app.py | 555 ++++++++++++++++++++++++++++++ templates/add_tablet.html | 30 ++ templates/add_user.html | 30 ++ templates/base.html | 153 ++++++++ templates/history.html | 35 ++ templates/index.html | 63 ++++ templates/loan_tablet.html | 78 +++++ templates/project_management.html | 196 +++++++++++ templates/user_loans.html | 157 +++++++++ test_app.py | 210 +++++++++++ working_server.py | 182 ++++++++++ 25 files changed, 2885 insertions(+) create mode 100644 .gitignore create mode 100644 CONTRIBUTING.md create mode 100644 README.md create mode 100644 RUNNING.md create mode 100644 app.py create mode 100644 basic_server.py create mode 100644 check_flask.py create mode 100644 debug_server.py create mode 100644 index.html create mode 100644 main.py create mode 100644 minimal_app.py create mode 100644 pyproject.toml create mode 100644 requirements.txt create mode 100644 setup.py create mode 100644 simple_app.py create mode 100644 templates/add_tablet.html create mode 100644 templates/add_user.html create mode 100644 templates/base.html create mode 100644 templates/history.html create mode 100644 templates/index.html create mode 100644 templates/loan_tablet.html create mode 100644 templates/project_management.html create mode 100644 templates/user_loans.html create mode 100644 test_app.py create mode 100644 working_server.py diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..ec5f329 --- /dev/null +++ b/.gitignore @@ -0,0 +1,31 @@ +# Python-generated files +__pycache__/ +*.py[oc] +build/ +dist/ +wheels/ +*.egg-info/ + +# Virtual environments +.venv/ + +# Database files +*.db +*.db-journal + +# Project-specific +notes_development/ +.vibe/ + +# IDE/Editor +.idea/ +.vscode/ +*.swp +*.swo + +# OS +.DS_Store +Thumbs.db + +# Python +.python-version diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md new file mode 100644 index 0000000..c37e12e --- /dev/null +++ b/CONTRIBUTING.md @@ -0,0 +1,82 @@ +# Contributing Guide + +## Git Workflow + +### Branch Strategy + +| Branch Type | Naming | Purpose | +|-------------|--------|---------| +| `main` | `main` | Production-ready code | +| `develop` | `develop` | Integration branch for features | +| Feature | `feature/` | New functionality | +| Hotfix | `hotfix/` | Urgent bug fixes | + +### Workflow + +```bash +# Clone repository +git clone +cd GestionTablets + +# Setup develop branch +git checkout -b develop + +# Create feature branch +git checkout -b feature/my-feature +git push origin feature/my-feature + +# Make changes, commit +git add . +git commit -m "feat: add my feature" +git push origin feature/my-feature + +# Create Pull Request to develop +``` + +### Commit Message Format + +``` +type(scope): description + +[optional body] + +[optional footer] +``` + +**Types**: +- `feat`: New feature +- `fix`: Bug fix +- `docs`: Documentation changes +- `refactor`: Code refactoring +- `chore`: Maintenance tasks +- `test`: Test-related changes + +**Examples**: +- `feat(loans): add user loans view page` +- `fix(tablet): validate serial number uniqueness` +- `docs: update README with database schema` +- `refactor(app): extract loan logic to service` + +### Pull Request Process + +1. Target `develop` branch (or `main` for hotfixes) +2. Include clear description of changes +3. Reference related issues +4. Wait for code review +5. Squash merge preferred + +### Reverting Changes + +```bash +# Discard unstaged changes +git checkout -- file.txt + +# Unstage file +git reset HEAD file.txt + +# Revert to previous commit (safe) +git revert HEAD + +# Hard reset to commit (destructive) +git reset --hard +``` diff --git a/README.md b/README.md new file mode 100644 index 0000000..58fab68 --- /dev/null +++ b/README.md @@ -0,0 +1,158 @@ +# Tablet Lending and Return Management System + +A simple SQLite-based system for managing tablet lending and returns. + +## Features + +- **Tablet Management**: Add, track, and manage tablets in inventory +- **User Management**: Register users who can borrow tablets +- **Loan Tracking**: Track which tablets are loaned to which users +- **Return Management**: Record when tablets are returned +- **History Tracking**: Complete history of all loans and returns +- **User Loans View**: See all tablets loaned to each user (demonstrates one-to-many relationship) +- **Project Notes**: Markdown editor for development documentation + +## Files + +- `minimal_app.py` - Interactive command-line application +- `test_app.py` - Test script that demonstrates functionality +- `tablets.db` - SQLite database (created automatically) +- `simple_app.py` - Web-based version (requires Flask) +- `app.py` - Alternative web version (requires Flask) + +## Quick Start + +### 1. Run the test to see it in action + +```bash +python3 test_app.py +``` + +This will: +- Create the database +- Add sample tablets and users +- Demonstrate loan and return operations +- Show the complete workflow + +### 2. Run the interactive application + +```bash +python3 minimal_app.py +``` + +This provides a menu-driven interface for: +- Adding tablets +- Adding users +- Loaning tablets +- Returning tablets +- Viewing inventory and loan status + +### 3. Database Structure + +The system uses three main tables with a **many-to-many relationship** between users and tablets: + +**tablets** +- `id`: Primary key +- `brand`: Tablet brand +- `model`: Tablet model +- `serial_number`: Unique serial number +- `status`: 'available' or 'loaned' + +**users** +- `id`: Primary key +- `name`: User's name +- `identification`: Unique identification + +**loans** (junction table) +- `id`: Primary key +- `tablet_id`: Foreign key to tablets +- `user_id`: Foreign key to users +- `loan_date`: When the tablet was loaned +- `return_date`: When the tablet was returned (NULL if still active) +- `status`: 'active' or 'returned' + +> **Note**: The loans table enables a many-to-many relationship. One user can loan **multiple tablets** (one-to-many from user to loans), and each tablet can be loaned to different users over time. The `status` field on tablets ensures a device can only be loaned to one user at a time. + +## Requirements + +- Python 3.x (built-in sqlite3 module) +- No additional dependencies needed for the command-line version +- Flask required for web versions (optional) + +## Usage Examples + +### Adding a tablet +``` +python3 -c " +import sqlite3 +conn = sqlite3.connect('tablets.db') +cursor = conn.cursor() +cursor.execute('INSERT INTO tablets (brand, model, serial_number, status) VALUES (?, ?, ?, ?)', + ('Microsoft', 'Surface Pro', 'SN004', 'available')) +conn.commit() +conn.close() +print('Tablet added!') +" +``` + +### Adding a user +``` +python3 -c " +import sqlite3 +conn = sqlite3.connect('tablets.db') +cursor = conn.cursor() +cursor.execute('INSERT INTO users (name, identification) VALUES (?, ?)', + ('Alice Brown', 'ID004')) +conn.commit() +conn.close() +print('User added!') +" +``` + +### Querying available tablets +``` +python3 -c " +import sqlite3 +conn = sqlite3.connect('tablets.db') +cursor = conn.cursor() +cursor.execute('SELECT brand, model, serial_number FROM tablets WHERE status = ?', ('available',)) +for row in cursor.fetchall(): + print(f'{row[0]} {row[1]} ({row[2]})') +conn.close() +" +``` + +## Web Version (Optional) + +If you want to use the web interface: + +1. Install Flask: +```bash +pip install flask +``` + +2. Run the web application: +```bash +python3 app.py +``` + +3. Open your browser to: http://localhost:5000 + +### Web Features + +- **Home**: View available tablets and active loans +- **Loan Tablet**: Loan a tablet to a user (with search for large datasets) +- **User Loans**: View all tablets loaned to each user - demonstrates the **one-to-many relationship** (one user, multiple tablets) +- **Loan History**: Complete history of all loan and return transactions +- **Project Management**: Markdown editor for development notes (saved to `notes_development/project_notes.md`) + +## Database Backup + +To backup your data: +```bash +cp tablets.db tablets_backup_$(date +%Y%m%d).db +``` + +## License + +This is a simple educational project. Feel free to use and modify it as needed. \ No newline at end of file diff --git a/RUNNING.md b/RUNNING.md new file mode 100644 index 0000000..9c37f3d --- /dev/null +++ b/RUNNING.md @@ -0,0 +1,57 @@ +# Tablet Management System - Running + +✅ **Status**: Application is running successfully! + +## Access Information + +- **Web Interface**: [http://localhost:5000](http://localhost:5000) +- **Port**: 5000 +- **Framework**: Flask 3.1.3 +- **Database**: SQLite (`tablets.db`) + +## How to Use + +### Web Interface +1. Open your browser to: [http://localhost:5000](http://localhost:5000) +2. Use the navigation menu to: + - **Home**: View available tablets and active loans + - **Add Tablet**: Add new tablets to inventory + - **Add User**: Register new users + - **Loan Tablet**: Loan a tablet to a user + - **Loan History**: View complete loan history + +### Command Line (Alternative) +If you prefer command line: +```bash +# Run the interactive application +python3 minimal_app.py + +# Run the test/demo +python3 test_app.py +``` + +## Current Data +The system already contains test data: +- **3 Tablets**: Samsung Galaxy Tab S7, Apple iPad Pro, Lenovo Tab P11 +- **3 Users**: John Doe, Jane Smith, Bob Johnson +- **2 Loans**: One active, one returned + +## Stopping the Server +To stop the Flask application: +```bash +pkill -f "python app.py" +``` + +## Technical Details +- **Backend**: SQLite 3 +- **Frontend**: Flask with HTML/CSS +- **Port**: 5000 (configurable in app.py) +- **Virtual Environment**: `.venv/` (created with uv) + +## Troubleshooting +If you have issues: +1. Check if the server is running: `ps aux | grep app.py` +2. Check the database: `sqlite3 tablets.db` +3. Restart the server: `source .venv/bin/activate && python app.py` + +Enjoy managing your tablets! 📱💻 \ No newline at end of file diff --git a/app.py b/app.py new file mode 100644 index 0000000..a5332b7 --- /dev/null +++ b/app.py @@ -0,0 +1,330 @@ +#!/usr/bin/env python3 +""" +Simple Tablet Lending and Return Management Web Application +with SQLite backend +""" + +from flask import Flask, render_template, request, redirect, url_for, flash +import sqlite3 +import os +from datetime import datetime + +app = Flask(__name__) +app.secret_key = 'your_secret_key_here' + +# Database setup +DATABASE = 'tablets.db' + +def get_db(): + """Get database connection""" + conn = sqlite3.connect(DATABASE) + conn.row_factory = sqlite3.Row + return conn + +def init_db(): + """Initialize database with required tables""" + with get_db() as conn: + cursor = conn.cursor() + + # Create tablets table + cursor.execute(''' + CREATE TABLE IF NOT EXISTS tablets ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + brand TEXT NOT NULL, + model TEXT NOT NULL, + serial_number TEXT UNIQUE NOT NULL, + status TEXT DEFAULT 'available', + notes TEXT + ) + ''') + + # Create users table + cursor.execute(''' + CREATE TABLE IF NOT EXISTS users ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + name TEXT NOT NULL, + email TEXT, + phone TEXT, + identification TEXT UNIQUE + ) + ''') + + # Create loans table + cursor.execute(''' + CREATE TABLE IF NOT EXISTS loans ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + tablet_id INTEGER NOT NULL, + user_id INTEGER NOT NULL, + loan_date TEXT NOT NULL, + return_date TEXT, + status TEXT DEFAULT 'active', + FOREIGN KEY (tablet_id) REFERENCES tablets (id), + FOREIGN KEY (user_id) REFERENCES users (id) + ) + ''') + + conn.commit() + +@app.route('/') +def index(): + """Main page showing available tablets and active loans""" + with get_db() as conn: + cursor = conn.cursor() + + # Get available tablets + cursor.execute("SELECT * FROM tablets WHERE status = 'available'") + available_tablets = cursor.fetchall() + + # Get active loans + cursor.execute(''' + SELECT l.id, t.brand, t.model, t.serial_number, u.name, l.loan_date + FROM loans l + JOIN tablets t ON l.tablet_id = t.id + JOIN users u ON l.user_id = u.id + WHERE l.status = 'active' + ''') + active_loans = cursor.fetchall() + + return render_template('index.html', + available_tablets=available_tablets, + active_loans=active_loans) + +@app.route('/add_tablet', methods=['GET', 'POST']) +def add_tablet(): + """Add a new tablet to inventory""" + if request.method == 'POST': + brand = request.form['brand'] + model = request.form['model'] + serial_number = request.form['serial_number'] + notes = request.form['notes'] + + try: + with get_db() as conn: + cursor = conn.cursor() + cursor.execute(''' + INSERT INTO tablets (brand, model, serial_number, status, notes) + VALUES (?, ?, ?, 'available', ?) + ''', (brand, model, serial_number, notes)) + conn.commit() + flash('Tablet added successfully!', 'success') + except sqlite3.IntegrityError: + flash('Error: Serial number already exists!', 'error') + + return redirect(url_for('index')) + + return render_template('add_tablet.html') + +@app.route('/add_user', methods=['GET', 'POST']) +def add_user(): + """Add a new user""" + if request.method == 'POST': + name = request.form['name'] + email = request.form['email'] + phone = request.form['phone'] + identification = request.form['identification'] + + try: + with get_db() as conn: + cursor = conn.cursor() + cursor.execute(''' + INSERT INTO users (name, email, phone, identification) + VALUES (?, ?, ?, ?) + ''', (name, email, phone, identification)) + conn.commit() + flash('User added successfully!', 'success') + except sqlite3.IntegrityError: + flash('Error: Identification already exists!', 'error') + + return redirect(url_for('index')) + + return render_template('add_user.html') + +@app.route('/loan_tablet', methods=['GET', 'POST']) +def loan_tablet(): + """Loan a tablet to a user""" + if request.method == 'POST': + tablet_id = request.form['tablet_id'] + user_id = request.form['user_id'] + + with get_db() as conn: + cursor = conn.cursor() + + # Update tablet status + cursor.execute("UPDATE tablets SET status = 'loaned' WHERE id = ?", (tablet_id,)) + + # Create loan record + loan_date = datetime.now().strftime('%Y-%m-%d %H:%M:%S') + cursor.execute(''' + INSERT INTO loans (tablet_id, user_id, loan_date, status) + VALUES (?, ?, ?, 'active') + ''', (tablet_id, user_id, loan_date)) + + conn.commit() + flash('Tablet loaned successfully!', 'success') + + return redirect(url_for('index')) + + # Get data for form + with get_db() as conn: + cursor = conn.cursor() + cursor.execute("SELECT * FROM tablets WHERE status = 'available'") + available_tablets = cursor.fetchall() + cursor.execute("SELECT * FROM users") + users = cursor.fetchall() + + return render_template('loan_tablet.html', + available_tablets=available_tablets, + users=users) + +@app.route('/return_tablet/') +def return_tablet(loan_id): + """Return a loaned tablet""" + with get_db() as conn: + cursor = conn.cursor() + + # Get loan information + cursor.execute("SELECT tablet_id FROM loans WHERE id = ?", (loan_id,)) + loan = cursor.fetchone() + + if loan: + tablet_id = loan['tablet_id'] + + # Update loan status and return date + return_date = datetime.now().strftime('%Y-%m-%d %H:%M:%S') + cursor.execute(''' + UPDATE loans SET status = 'returned', return_date = ? WHERE id = ? + ''', (return_date, loan_id)) + + # Update tablet status + cursor.execute("UPDATE tablets SET status = 'available' WHERE id = ?", (tablet_id,)) + + conn.commit() + flash('Tablet returned successfully!', 'success') + else: + flash('Error: Loan not found!', 'error') + + return redirect(url_for('index')) + +@app.route('/history') +def history(): + """Show loan history""" + with get_db() as conn: + cursor = conn.cursor() + + cursor.execute(''' + SELECT l.id, t.brand, t.model, t.serial_number, u.name, + l.loan_date, l.return_date, l.status + FROM loans l + JOIN tablets t ON l.tablet_id = t.id + JOIN users u ON l.user_id = u.id + ORDER BY l.loan_date DESC + ''') + loans = cursor.fetchall() + + return render_template('history.html', loans=loans) + + +@app.route('/project_management') +def project_management(): + """Project management page with markdown editor for development notes""" + return render_template('project_management.html') + + +@app.route('/get_notes/') +def get_notes(filename): + """Serve notes file content""" + try: + with open(filename, 'r', encoding='utf-8') as f: + content = f.read() + return content, 200, { + 'Content-Type': 'text/markdown; charset=utf-8', + 'Cache-Control': 'no-cache, no-store, must-revalidate', + 'Pragma': 'no-cache', + 'Expires': '0' + } + except FileNotFoundError: + return '', 404 + except Exception as e: + return str(e), 500 + + +@app.route('/save_notes', methods=['POST']) +def save_notes(): + """Save markdown notes to file""" + data = request.get_json() + content = data.get('content', '') + filename = data.get('filename', 'notes_development/project_notes.md') + + try: + # Ensure directory exists + os.makedirs(os.path.dirname(filename), exist_ok=True) + + # Write content to file + with open(filename, 'w', encoding='utf-8') as f: + f.write(content) + + return {'status': 'success', 'message': 'Notes saved successfully'} + except Exception as e: + return {'status': 'error', 'message': str(e)}, 500 + + +@app.route('/user_loans') +def user_loans(): + """ + Show all loans grouped by user. + This demonstrates the one-to-many relationship: one user can loan multiple tablets. + """ + with get_db() as conn: + cursor = conn.cursor() + + # Get all users + cursor.execute("SELECT * FROM users") + users = cursor.fetchall() + + # Get all loans with tablet and user details + cursor.execute(''' + SELECT l.id, l.tablet_id, l.user_id, l.loan_date, l.return_date, l.status, + t.brand, t.model, t.serial_number, + u.name, u.identification + FROM loans l + JOIN tablets t ON l.tablet_id = t.id + JOIN users u ON l.user_id = u.id + ORDER BY u.name, l.loan_date DESC + ''') + loans = cursor.fetchall() + + # Group loans by user + user_loans_map = {} + for loan in loans: + user_id = loan['user_id'] + if user_id not in user_loans_map: + user_loans_map[user_id] = { + 'user': None, + 'loans': [] + } + user_loans_map[user_id]['loans'].append(loan) + + # Attach user info + for user in users: + if user['id'] in user_loans_map: + user_loans_map[user['id']]['user'] = user + + # Filter out users with no loans (optional - keep all users) + # Convert to list for template + user_loans_list = [] + for user in users: + user_data = user_loans_map.get(user['id'], {'user': user, 'loans': []}) + user_loans_list.append(user_data) + + return render_template('user_loans.html', users_with_loans=user_loans_list) + + +if __name__ == '__main__': + # Initialize database + init_db() + + # Create templates directory if it doesn't exist + if not os.path.exists('templates'): + os.makedirs('templates') + + app.run(debug=True, host='0.0.0.0', port=5000) \ No newline at end of file diff --git a/basic_server.py b/basic_server.py new file mode 100644 index 0000000..b2731e4 --- /dev/null +++ b/basic_server.py @@ -0,0 +1,81 @@ +#!/usr/bin/env python3 +""" +Basic HTTP server to serve the tablet management system +""" + +from http.server import SimpleHTTPRequestHandler, HTTPServer +import os + +class MyHandler(SimpleHTTPRequestHandler): + def do_GET(self): + if self.path == '/': + self.path = '/index.html' + return super().do_GET() + +def run_server(): + port = 8080 + server_address = ('', port) + httpd = HTTPServer(server_address, MyHandler) + + # Create a simple index file if it doesn't exist + if not os.path.exists('index.html'): + with open('index.html', 'w') as f: + f.write(''' + + + Tablet Management System + + + +

Tablet Management System

+ +
+

Welcome to the Tablet Management System!

+

This system is running with a SQLite backend.

+ +

Available Commands:

+
    +
  • Test the system: python3 test_app.py
    • +
  • Run interactive mode: python3 minimal_app.py
    • +
  • Check database: sqlite3 tablets.db
    • +
+ +

Current Status:

+

✓ Database: tablets.db

+

✓ Web server: Running on port 8080

+

✓ System: Ready for use

+
+ +

Quick Test Results:

+ 
Running tests...
+ + + +''') + + print(f"Server running on http://localhost:{port}") + print("Serving current directory") + print("Press Ctrl+C to stop the server") + + try: + httpd.serve_forever() + except KeyboardInterrupt: + print("\nServer stopped") + +if __name__ == '__main__': + run_server() \ No newline at end of file diff --git a/check_flask.py b/check_flask.py new file mode 100644 index 0000000..6ea9046 --- /dev/null +++ b/check_flask.py @@ -0,0 +1,20 @@ +#!/usr/bin/env python3 +""" +Check if Flask is available and provide installation instructions +""" + +try: + import flask + print("✓ Flask is available!") + print("You can run the web version:") + print(" python3 simple_app.py") + print("Then open: http://localhost:8000") +except ImportError: + print("✗ Flask is not installed") + print("\nTo install Flask:") + print(" pip install flask") + print("\nOr use the system package manager:") + print(" sudo apt install python3-flask") + print("\nYou can still use the command-line version:") + print(" python3 minimal_app.py") + print(" python3 test_app.py") \ No newline at end of file diff --git a/debug_server.py b/debug_server.py new file mode 100644 index 0000000..7645070 --- /dev/null +++ b/debug_server.py @@ -0,0 +1,20 @@ +#!/usr/bin/env python3 +from http.server import HTTPServer, BaseHTTPRequestHandler + +class DebugHandler(BaseHTTPRequestHandler): + def do_GET(self): + self.send_response(200) + self.send_header('Content-type', 'text/plain') + self.end_headers() + self.wfile.write(b'Hello from Tablet Management Server!') + +def run(): + try: + server = HTTPServer(('', 8000), DebugHandler) + print("Debug server running on port 8000") + server.serve_forever() + except Exception as e: + print(f"Error: {e}") + +if __name__ == '__main__': + run() \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..099519d --- /dev/null +++ b/index.html @@ -0,0 +1,47 @@ + + + + Tablet Management System + + + +

Tablet Management System

+ +
+

Welcome to the Tablet Management System!

+

This system is running with a SQLite backend.

+ +

Available Commands:

+
    +
  • Test the system: python3 test_app.py
    • +
  • Run interactive mode: python3 minimal_app.py
    • +
  • Check database: sqlite3 tablets.db
    • +
+ +

Current Status:

+

✓ Database: tablets.db

+

✓ Web server: Running on port 8080

+

✓ System: Ready for use

+
+ +

Quick Test Results:

+ 
Running tests...
+ + + + \ No newline at end of file diff --git a/main.py b/main.py new file mode 100644 index 0000000..494f954 --- /dev/null +++ b/main.py @@ -0,0 +1,6 @@ +def main(): + print("Hello from gestiontablets!") + + +if __name__ == "__main__": + main() diff --git a/minimal_app.py b/minimal_app.py new file mode 100644 index 0000000..ff0295a --- /dev/null +++ b/minimal_app.py @@ -0,0 +1,296 @@ +#!/usr/bin/env python3 +""" +Minimal Tablet Lending and Return Management System +Using only built-in Python modules +""" + +import sqlite3 +from datetime import datetime + +def init_db(): + """Initialize database with required tables""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + # Create tables + cursor.execute(''' + CREATE TABLE IF NOT EXISTS tablets ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + brand TEXT NOT NULL, + model TEXT NOT NULL, + serial_number TEXT UNIQUE NOT NULL, + status TEXT DEFAULT 'available' + ) + ''') + + cursor.execute(''' + CREATE TABLE IF NOT EXISTS users ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + name TEXT NOT NULL, + identification TEXT UNIQUE + ) + ''') + + cursor.execute(''' + CREATE TABLE IF NOT EXISTS loans ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + tablet_id INTEGER NOT NULL, + user_id INTEGER NOT NULL, + loan_date TEXT NOT NULL, + return_date TEXT, + status TEXT DEFAULT 'active', + FOREIGN KEY (tablet_id) REFERENCES tablets (id), + FOREIGN KEY (user_id) REFERENCES users (id) + ) + ''') + + conn.commit() + conn.close() + +def add_tablet(brand, model, serial_number): + """Add a new tablet to inventory""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + try: + cursor.execute(''' + INSERT INTO tablets (brand, model, serial_number, status) + VALUES (?, ?, ?, 'available') + ''', (brand, model, serial_number)) + conn.commit() + print(f"✓ Added tablet: {brand} {model} ({serial_number})") + except sqlite3.IntegrityError: + print(f"✗ Error: Serial number {serial_number} already exists") + finally: + conn.close() + +def add_user(name, identification): + """Add a new user""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + try: + cursor.execute(''' + INSERT INTO users (name, identification) + VALUES (?, ?) + ''', (name, identification)) + conn.commit() + print(f"✓ Added user: {name} ({identification})") + except sqlite3.IntegrityError: + print(f"✗ Error: Identification {identification} already exists") + finally: + conn.close() + +def loan_tablet(tablet_id, user_id): + """Loan a tablet to a user""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + # Check if tablet is available + cursor.execute("SELECT status FROM tablets WHERE id = ?", (tablet_id,)) + result = cursor.fetchone() + + if result and result[0] == 'available': + # Update tablet status + cursor.execute("UPDATE tablets SET status = 'loaned' WHERE id = ?", (tablet_id,)) + + # Create loan record + loan_date = datetime.now().strftime('%Y-%m-%d %H:%M:%S') + cursor.execute(''' + INSERT INTO loans (tablet_id, user_id, loan_date, status) + VALUES (?, ?, ?, 'active') + ''', (tablet_id, user_id, loan_date)) + + conn.commit() + print(f"✓ Tablet {tablet_id} loaned to user {user_id}") + else: + print(f"✗ Error: Tablet {tablet_id} is not available for loan") + + conn.close() + +def return_tablet(loan_id): + """Return a loaned tablet""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + # Get loan information + cursor.execute("SELECT tablet_id FROM loans WHERE id = ? AND status = 'active'", (loan_id,)) + loan = cursor.fetchone() + + if loan: + tablet_id = loan[0] + + # Update loan status and return date + return_date = datetime.now().strftime('%Y-%m-%d %H:%M:%S') + cursor.execute(''' + UPDATE loans SET status = 'returned', return_date = ? WHERE id = ? + ''', (return_date, loan_id)) + + # Update tablet status + cursor.execute("UPDATE tablets SET status = 'available' WHERE id = ?", (tablet_id,)) + + conn.commit() + print(f"✓ Tablet returned for loan {loan_id}") + else: + print(f"✗ Error: Loan {loan_id} not found or already returned") + + conn.close() + +def show_available_tablets(): + """Show available tablets""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + cursor.execute("SELECT id, brand, model, serial_number FROM tablets WHERE status = 'available'") + tablets = cursor.fetchall() + + print("\n=== Available Tablets ===") + if tablets: + for tablet in tablets: + print(f"ID: {tablet[0]}, {tablet[1]} {tablet[2]} ({tablet[3]})") + else: + print("No available tablets") + + conn.close() + +def show_active_loans(): + """Show active loans""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + cursor.execute(''' + SELECT l.id, t.brand, t.model, t.serial_number, u.name, l.loan_date + FROM loans l + JOIN tablets t ON l.tablet_id = t.id + JOIN users u ON l.user_id = u.id + WHERE l.status = 'active' + ''') + loans = cursor.fetchall() + + print("\n=== Active Loans ===") + if loans: + for loan in loans: + print(f"Loan ID: {loan[0]}, Tablet: {loan[1]} {loan[2]} ({loan[3]}), Borrower: {loan[4]}, Loan Date: {loan[5]}") + else: + print("No active loans") + + conn.close() + +def show_loan_history(): + """Show complete loan history""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + cursor.execute(''' + SELECT l.id, t.brand, t.model, t.serial_number, u.name, + l.loan_date, l.return_date, l.status + FROM loans l + JOIN tablets t ON l.tablet_id = t.id + JOIN users u ON l.user_id = u.id + ORDER BY l.loan_date DESC + ''') + loans = cursor.fetchall() + + print("\n=== Loan History ===") + if loans: + for loan in loans: + return_date = loan[6] or 'Not returned' + print(f"Loan ID: {loan[0]}, Tablet: {loan[1]} {loan[2]} ({loan[3]}), Borrower: {loan[4]}") + print(f" Loan Date: {loan[5]}, Return Date: {return_date}, Status: {loan[7]}") + else: + print("No loan history") + + conn.close() + +def main(): + """Main menu""" + init_db() + + print("=== Tablet Lending and Return Management System ===") + print("Using SQLite database: tablets.db") + + while True: + print("\nMenu:") + print("1. Add Tablet") + print("2. Add User") + print("3. Loan Tablet") + print("4. Return Tablet") + print("5. Show Available Tablets") + print("6. Show Active Loans") + print("7. Show Loan History") + print("8. Exit") + + choice = input("Enter your choice (1-8): ") + + if choice == '1': + print("\n=== Add Tablet ===") + brand = input("Brand: ") + model = input("Model: ") + serial_number = input("Serial Number: ") + add_tablet(brand, model, serial_number) + + elif choice == '2': + print("\n=== Add User ===") + name = input("Name: ") + identification = input("Identification: ") + add_user(name, identification) + + elif choice == '3': + print("\n=== Loan Tablet ===") + show_available_tablets() + show_users() + + tablet_id = input("Enter Tablet ID to loan: ") + user_id = input("Enter User ID: ") + + try: + loan_tablet(int(tablet_id), int(user_id)) + except ValueError: + print("✗ Error: Invalid ID format") + + elif choice == '4': + print("\n=== Return Tablet ===") + show_active_loans() + + loan_id = input("Enter Loan ID to return: ") + + try: + return_tablet(int(loan_id)) + except ValueError: + print("✗ Error: Invalid Loan ID format") + + elif choice == '5': + show_available_tablets() + + elif choice == '6': + show_active_loans() + + elif choice == '7': + show_loan_history() + + elif choice == '8': + print("Goodbye!") + break + + else: + print("✗ Invalid choice. Please try again.") + +def show_users(): + """Show available users""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + cursor.execute("SELECT id, name, identification FROM users") + users = cursor.fetchall() + + print("\n=== Available Users ===") + if users: + for user in users: + print(f"ID: {user[0]}, {user[1]} ({user[2]})") + else: + print("No users available") + + conn.close() + +if __name__ == '__main__': + main() \ No newline at end of file diff --git a/pyproject.toml b/pyproject.toml new file mode 100644 index 0000000..e409926 --- /dev/null +++ b/pyproject.toml @@ -0,0 +1,7 @@ +[project] +name = "gestiontablets" +version = "0.1.0" +description = "Add your description here" +readme = "README.md" +requires-python = ">=3.14" +dependencies = [] diff --git a/requirements.txt b/requirements.txt new file mode 100644 index 0000000..cc35792 --- /dev/null +++ b/requirements.txt @@ -0,0 +1 @@ +Flask==2.3.3 \ No newline at end of file diff --git a/setup.py b/setup.py new file mode 100644 index 0000000..47fe889 --- /dev/null +++ b/setup.py @@ -0,0 +1,60 @@ +#!/usr/bin/env python3 +""" +Setup script for Tablet Management System +""" + +import subprocess +import sys +import os + +def install_dependencies(): + """Install required dependencies""" + try: + # Try to install Flask using pip + subprocess.check_call([sys.executable, '-m', 'ensurepip', '--upgrade']) + subprocess.check_call([sys.executable, '-m', 'pip', 'install', '--upgrade', 'pip']) + subprocess.check_call([sys.executable, '-m', 'pip', 'install', 'Flask==2.3.3']) + print("✓ Dependencies installed successfully") + return True + except subprocess.CalledProcessError as e: + print(f"✗ Failed to install dependencies: {e}") + return False + except Exception as e: + print(f"✗ Error during installation: {e}") + return False + +def check_dependencies(): + """Check if required dependencies are available""" + try: + import flask + import sqlite3 + print("✓ All dependencies are available") + return True + except ImportError as e: + print(f"✗ Missing dependency: {e}") + return False + +def main(): + print("Setting up Tablet Management System...") + + # Check if dependencies are already available + if not check_dependencies(): + print("Installing required dependencies...") + if not install_dependencies(): + print("\nError: Could not install dependencies.") + print("Please install Flask manually:") + print(" pip install Flask==2.3.3") + print("or") + print(" python3 -m pip install Flask==2.3.3") + return False + + print("\nSetup complete!") + print("\nTo run the application:") + print(" python3 app.py") + print("\nThe application will be available at: http://localhost:5000") + + return True + +if __name__ == '__main__': + success = main() + sys.exit(0 if success else 1) \ No newline at end of file diff --git a/simple_app.py b/simple_app.py new file mode 100644 index 0000000..f50478d --- /dev/null +++ b/simple_app.py @@ -0,0 +1,555 @@ +#!/usr/bin/env python3 +""" +Simple Tablet Lending and Return Management System +Using only built-in Python modules (no Flask required) +""" + +import sqlite3 +import os +from datetime import datetime +from http.server import HTTPServer, BaseHTTPRequestHandler +from urllib.parse import parse_qs, urlparse +import json + +# Database setup +DATABASE = 'tablets.db' + +def get_db(): + """Get database connection""" + conn = sqlite3.connect(DATABASE) + conn.row_factory = sqlite3.Row + return conn + +def init_db(): + """Initialize database with required tables""" + with get_db() as conn: + cursor = conn.cursor() + + # Create tablets table + cursor.execute(''' + CREATE TABLE IF NOT EXISTS tablets ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + brand TEXT NOT NULL, + model TEXT NOT NULL, + serial_number TEXT UNIQUE NOT NULL, + status TEXT DEFAULT 'available', + notes TEXT + ) + ''') + + # Create users table + cursor.execute(''' + CREATE TABLE IF NOT EXISTS users ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + name TEXT NOT NULL, + email TEXT, + phone TEXT, + identification TEXT UNIQUE + ) + ''') + + # Create loans table + cursor.execute(''' + CREATE TABLE IF NOT EXISTS loans ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + tablet_id INTEGER NOT NULL, + user_id INTEGER NOT NULL, + loan_date TEXT NOT NULL, + return_date TEXT, + status TEXT DEFAULT 'active', + FOREIGN KEY (tablet_id) REFERENCES tablets (id), + FOREIGN KEY (user_id) REFERENCES users (id) + ) + ''') + + conn.commit() + +class SimpleHTTPRequestHandler(BaseHTTPRequestHandler): + def _set_headers(self, content_type="text/html"): + self.send_response(200) + self.send_header('Content-type', content_type) + self.end_headers() + + def _send_html(self, content): + self._set_headers() + self.wfile.write(content.encode('utf-8')) + + def _send_json(self, data): + self._set_headers(content_type="application/json") + self.wfile.write(json.dumps(data).encode('utf-8')) + + def _parse_form_data(self): + content_length = int(self.headers['Content-Length']) + post_data = self.rfile.read(content_length) + return parse_qs(post_data.decode('utf-8')) + + def do_GET(self): + parsed_path = urlparse(self.path) + + if parsed_path.path == '/': + self._handle_index() + elif parsed_path.path == '/add_tablet': + self._handle_add_tablet_form() + elif parsed_path.path == '/add_user': + self._handle_add_user_form() + elif parsed_path.path == '/loan_tablet': + self._handle_loan_tablet_form() + elif parsed_path.path == '/history': + self._handle_history() + elif parsed_path.path.startswith('/return_tablet/'): + self._handle_return_tablet(parsed_path.path) + else: + self._send_html("

404 Not Found

") + + def do_POST(self): + parsed_path = urlparse(self.path) + + if parsed_path.path == '/add_tablet': + self._handle_add_tablet() + elif parsed_path.path == '/add_user': + self._handle_add_user() + elif parsed_path.path == '/loan_tablet': + self._handle_loan_tablet() + else: + self._send_html("

404 Not Found

") + + def _handle_index(self): + with get_db() as conn: + cursor = conn.cursor() + + # Get available tablets + cursor.execute("SELECT * FROM tablets WHERE status = 'available'") + available_tablets = cursor.fetchall() + + # Get active loans + cursor.execute(''' + SELECT l.id, t.brand, t.model, t.serial_number, u.name, l.loan_date + FROM loans l + JOIN tablets t ON l.tablet_id = t.id + JOIN users u ON l.user_id = u.id + WHERE l.status = 'active' + ''') + active_loans = cursor.fetchall() + + html = f""" + + + + Tablet Management System + + + +

Tablet Management System

+
+ Home + Add Tablet + Add User + Loan Tablet + Loan History +
+ +

Available Tablets

+ + + + + + + + + + + """ + + if available_tablets: + for tablet in available_tablets: + html += f""" + + + + + + + """ + else: + html += "" + + html += """ + +
BrandModelSerial NumberNotes
{tablet['brand']}{tablet['model']}{tablet['serial_number']}{tablet['notes'] or '-'}
No available tablets.
+ +

Active Loans

+ + + + + + + + + + + + """ + + if active_loans: + for loan in active_loans: + html += f""" + + + + + + + + """ + else: + html += "" + + html += """ + +
TabletSerial NumberBorrowerLoan DateActions
{loan['brand']} {loan['model']}{loan['serial_number']}{loan['name']}{loan['loan_date']}Return
No active loans.
+ + + """ + + self._send_html(html) + + def _handle_add_tablet_form(self): + html = """ + + + + Add Tablet + + + +

Add New Tablet

+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ +
+
+ + + """ + self._send_html(html) + + def _handle_add_tablet(self): + form_data = self._parse_form_data() + brand = form_data['brand'][0] + model = form_data['model'][0] + serial_number = form_data['serial_number'][0] + notes = form_data.get('notes', [''])[0] + + try: + with get_db() as conn: + cursor = conn.cursor() + cursor.execute(''' + INSERT INTO tablets (brand, model, serial_number, status, notes) + VALUES (?, ?, ?, 'available', ?) + ''', (brand, model, serial_number, notes)) + conn.commit() + + self.send_response(303) + self.send_header('Location', '/') + self.end_headers() + except sqlite3.IntegrityError: + self._send_html("

Error: Serial number already exists!

Try again

") + + def _handle_add_user_form(self): + html = """ + + + + Add User + + + +

Add New User

+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ +
+
+ + + """ + self._send_html(html) + + def _handle_add_user(self): + form_data = self._parse_form_data() + name = form_data['name'][0] + email = form_data.get('email', [''])[0] + phone = form_data.get('phone', [''])[0] + identification = form_data['identification'][0] + + try: + with get_db() as conn: + cursor = conn.cursor() + cursor.execute(''' + INSERT INTO users (name, email, phone, identification) + VALUES (?, ?, ?, ?) + ''', (name, email, phone, identification)) + conn.commit() + + self.send_response(303) + self.send_header('Location', '/') + self.end_headers() + except sqlite3.IntegrityError: + self._send_html("

Error: Identification already exists!

Try again

") + + def _handle_loan_tablet_form(self): + with get_db() as conn: + cursor = conn.cursor() + cursor.execute("SELECT * FROM tablets WHERE status = 'available'") + available_tablets = cursor.fetchall() + cursor.execute("SELECT * FROM users") + users = cursor.fetchall() + + html = """ + + + + Loan Tablet + + + +

Loan Tablet

+
+
+ + +
+
+ + +
+
+ +
+
+ + + """ + self._send_html(html) + + def _handle_loan_tablet(self): + form_data = self._parse_form_data() + tablet_id = form_data['tablet_id'][0] + user_id = form_data['user_id'][0] + + with get_db() as conn: + cursor = conn.cursor() + + # Update tablet status + cursor.execute("UPDATE tablets SET status = 'loaned' WHERE id = ?", (tablet_id,)) + + # Create loan record + loan_date = datetime.now().strftime('%Y-%m-%d %H:%M:%S') + cursor.execute(''' + INSERT INTO loans (tablet_id, user_id, loan_date, status) + VALUES (?, ?, ?, 'active') + ''', (tablet_id, user_id, loan_date)) + + conn.commit() + + self.send_response(303) + self.send_header('Location', '/') + self.end_headers() + + def _handle_return_tablet(self, path): + loan_id = path.split('/')[-1] + + with get_db() as conn: + cursor = conn.cursor() + + # Get loan information + cursor.execute("SELECT tablet_id FROM loans WHERE id = ?", (loan_id,)) + loan = cursor.fetchone() + + if loan: + tablet_id = loan['tablet_id'] + + # Update loan status and return date + return_date = datetime.now().strftime('%Y-%m-%d %H:%M:%S') + cursor.execute(''' + UPDATE loans SET status = 'returned', return_date = ? WHERE id = ? + ''', (return_date, loan_id)) + + # Update tablet status + cursor.execute("UPDATE tablets SET status = 'available' WHERE id = ?", (tablet_id,)) + + conn.commit() + + self.send_response(303) + self.send_header('Location', '/') + self.end_headers() + + def _handle_history(self): + with get_db() as conn: + cursor = conn.cursor() + + cursor.execute(''' + SELECT l.id, t.brand, t.model, t.serial_number, u.name, + l.loan_date, l.return_date, l.status + FROM loans l + JOIN tablets t ON l.tablet_id = t.id + JOIN users u ON l.user_id = u.id + ORDER BY l.loan_date DESC + ''') + loans = cursor.fetchall() + + html = """ + + + + Loan History + + + +

Loan History

+
+ Home + Add Tablet + Add User + Loan Tablet + Loan History +
+ + + + + + + + + + + + + + """ + + if loans: + for loan in loans: + html += f""" + + + + + + + + + """ + else: + html += "" + + html += """ + +
TabletSerial NumberBorrowerLoan DateReturn DateStatus
{loan['brand']} {loan['model']}{loan['serial_number']}{loan['name']}{loan['loan_date']}{loan['return_date'] or '-'}{loan['status']}
No loan history available.
+ + + """ + + self._send_html(html) + +def run_server(): + """Run the HTTP server""" + server_address = ('', 8000) + httpd = HTTPServer(server_address, SimpleHTTPRequestHandler) + print(f"Server running on http://localhost:8000") + print("Press Ctrl+C to stop the server") + httpd.serve_forever() + +if __name__ == '__main__': + # Initialize database + init_db() + + # Run the server + run_server() \ No newline at end of file diff --git a/templates/add_tablet.html b/templates/add_tablet.html new file mode 100644 index 0000000..8199daf --- /dev/null +++ b/templates/add_tablet.html @@ -0,0 +1,30 @@ +{% extends "base.html" %} + +{% block content %} +

Add New Tablet

+
+
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ +
+
+{% endblock %} \ No newline at end of file diff --git a/templates/add_user.html b/templates/add_user.html new file mode 100644 index 0000000..2bcd10b --- /dev/null +++ b/templates/add_user.html @@ -0,0 +1,30 @@ +{% extends "base.html" %} + +{% block content %} +

Add New User

+
+
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ +
+
+{% endblock %} \ No newline at end of file diff --git a/templates/base.html b/templates/base.html new file mode 100644 index 0000000..629882b --- /dev/null +++ b/templates/base.html @@ -0,0 +1,153 @@ + + + + + + Tablet Management System + + + +
+

Tablet Management System

+ + {% with messages = get_flashed_messages(with_categories=true) %} + {% if messages %} + {% for category, message in messages %} +
{{ message }}
+ {% endfor %} + {% endif %} + {% endwith %} + +
+ Home + Add Tablet + Add User + Loan Tablet + Loan History + User Loans + Project Management +
+ + {% block content %}{% endblock %} +
+ + diff --git a/templates/history.html b/templates/history.html new file mode 100644 index 0000000..8a2fe7a --- /dev/null +++ b/templates/history.html @@ -0,0 +1,35 @@ +{% extends "base.html" %} + +{% block content %} +
+

Loan History

+ {% if loans %} + + + + + + + + + + + + + {% for loan in loans %} + + + + + + + + + {% endfor %} + +
TabletSerial NumberBorrowerLoan DateReturn DateStatus
{{ loan.brand }} {{ loan.model }}{{ loan.serial_number }}{{ loan.name }}{{ loan.loan_date }}{{ loan.return_date or '-' }}{{ loan.status }}
+ {% else %} +

No loan history available.

+ {% endif %} +
+{% endblock %} \ No newline at end of file diff --git a/templates/index.html b/templates/index.html new file mode 100644 index 0000000..8dfcdb6 --- /dev/null +++ b/templates/index.html @@ -0,0 +1,63 @@ +{% extends "base.html" %} + +{% block content %} +
+

Available Tablets

+ {% if available_tablets %} + + + + + + + + + + + {% for tablet in available_tablets %} + + + + + + + {% endfor %} + +
BrandModelSerial NumberNotes
{{ tablet.brand }}{{ tablet.model }}{{ tablet.serial_number }}{{ tablet.notes or '-' }}
+ {% else %} +

No available tablets.

+ {% endif %} +
+ +
+

Active Loans

+ {% if active_loans %} + + + + + + + + + + + + {% for loan in active_loans %} + + + + + + + + {% endfor %} + +
TabletSerial NumberBorrowerLoan DateActions
{{ loan.brand }} {{ loan.model }}{{ loan.serial_number }}{{ loan.name }}{{ loan.loan_date }} + Return +
+ {% else %} +

No active loans.

+ {% endif %} +
+{% endblock %} \ No newline at end of file diff --git a/templates/loan_tablet.html b/templates/loan_tablet.html new file mode 100644 index 0000000..b9f2527 --- /dev/null +++ b/templates/loan_tablet.html @@ -0,0 +1,78 @@ +{% extends "base.html" %} + +{% block content %} +

Loan Tablet

+
+ +
+ + + +
+ + +
+ + + +
+ +
+ +
+
+ + + + +{% endblock %} \ No newline at end of file diff --git a/templates/project_management.html b/templates/project_management.html new file mode 100644 index 0000000..7ca8005 --- /dev/null +++ b/templates/project_management.html @@ -0,0 +1,196 @@ +{% extends "base.html" %} + +{% block content %} +

Project Management - Development Notes

+ +
+
+
+ + + +
+ +
+
+

Editor

+ +
+ +
+

Preview

+
+
+
+
+
+ + + + + +{% endblock %} diff --git a/templates/user_loans.html b/templates/user_loans.html new file mode 100644 index 0000000..8c10045 --- /dev/null +++ b/templates/user_loans.html @@ -0,0 +1,157 @@ +{% extends "base.html" %} + +{% block content %} +

User Loans

+

+ Relationship: One user can loan multiple tablets (one-to-many). + This page demonstrates the many-to-many relationship between users and tablets via the loans table. +

+ +
+ {% for user_data in users_with_loans %} + {% set user = user_data.user %} + {% set loans = user_data.loans %} + +
+
+

{{ user.name }} ({{ user.identification }})

+ {{ loans|length }} tablet{{ 's' if loans|length != 1 else '' }} loaned +
+ + {% if loans %} + + + + + + + + + + + + {% for loan in loans %} + + + + + + + + {% endfor %} + +
TabletSerial NumberLoan DateReturn DateStatus
{{ loan.brand }} {{ loan.model }}{{ loan.serial_number }}{{ loan.loan_date }}{{ loan.return_date or '-' }} + + {{ loan.status }} + +
+ {% else %} +

No loans recorded for this user.

+ {% endif %} +
+ {% endfor %} + + {% if users_with_loans|length == 0 %} +

No users found. Add users and loan tablets to see data here.

+ {% endif %} +
+ + +{% endblock %} diff --git a/test_app.py b/test_app.py new file mode 100644 index 0000000..0fcb8ac --- /dev/null +++ b/test_app.py @@ -0,0 +1,210 @@ +#!/usr/bin/env python3 +""" +Test script for the Tablet Management System +""" + +import sqlite3 +from datetime import datetime + +def test_tablet_management(): + """Test the tablet management system functionality""" + + # Initialize database + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + # Create tables + cursor.execute(''' + CREATE TABLE IF NOT EXISTS tablets ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + brand TEXT NOT NULL, + model TEXT NOT NULL, + serial_number TEXT UNIQUE NOT NULL, + status TEXT DEFAULT 'available' + ) + ''') + + cursor.execute(''' + CREATE TABLE IF NOT EXISTS users ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + name TEXT NOT NULL, + identification TEXT UNIQUE + ) + ''') + + cursor.execute(''' + CREATE TABLE IF NOT EXISTS loans ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + tablet_id INTEGER NOT NULL, + user_id INTEGER NOT NULL, + loan_date TEXT NOT NULL, + return_date TEXT, + status TEXT DEFAULT 'active', + FOREIGN KEY (tablet_id) REFERENCES tablets (id), + FOREIGN KEY (user_id) REFERENCES users (id) + ) + ''') + + conn.commit() + + print("=== Testing Tablet Management System ===") + + # Test 1: Add tablets + print("\n1. Adding tablets...") + tablets = [ + ("Samsung", "Galaxy Tab S7", "SN001"), + ("Apple", "iPad Pro", "SN002"), + ("Lenovo", "Tab P11", "SN003") + ] + + for brand, model, serial in tablets: + try: + cursor.execute(''' + INSERT INTO tablets (brand, model, serial_number, status) + VALUES (?, ?, ?, 'available') + ''', (brand, model, serial)) + print(f" ✓ Added: {brand} {model} ({serial})") + except sqlite3.IntegrityError: + print(f" ✗ Duplicate: {serial}") + + conn.commit() + + # Test 2: Add users + print("\n2. Adding users...") + users = [ + ("John Doe", "ID001"), + ("Jane Smith", "ID002"), + ("Bob Johnson", "ID003") + ] + + for name, identification in users: + try: + cursor.execute(''' + INSERT INTO users (name, identification) + VALUES (?, ?) + ''', (name, identification)) + print(f" ✓ Added: {name} ({identification})") + except sqlite3.IntegrityError: + print(f" ✗ Duplicate: {identification}") + + conn.commit() + + # Test 3: Show available tablets + print("\n3. Available tablets:") + cursor.execute("SELECT id, brand, model, serial_number FROM tablets WHERE status = 'available'") + available_tablets = cursor.fetchall() + + for tablet in available_tablets: + print(f" ID {tablet[0]}: {tablet[1]} {tablet[2]} ({tablet[3]})") + + # Test 4: Loan tablets + print("\n4. Loaning tablets...") + + # Loan tablet 1 to user 1 + tablet_id = 1 + user_id = 1 + + cursor.execute("UPDATE tablets SET status = 'loaned' WHERE id = ?", (tablet_id,)) + loan_date = datetime.now().strftime('%Y-%m-%d %H:%M:%S') + cursor.execute(''' + INSERT INTO loans (tablet_id, user_id, loan_date, status) + VALUES (?, ?, ?, 'active') + ''', (tablet_id, user_id, loan_date)) + print(f" ✓ Loaned tablet {tablet_id} to user {user_id}") + + # Loan tablet 2 to user 2 + tablet_id = 2 + user_id = 2 + + cursor.execute("UPDATE tablets SET status = 'loaned' WHERE id = ?", (tablet_id,)) + loan_date = datetime.now().strftime('%Y-%m-%d %H:%M:%S') + cursor.execute(''' + INSERT INTO loans (tablet_id, user_id, loan_date, status) + VALUES (?, ?, ?, 'active') + ''', (tablet_id, user_id, loan_date)) + print(f" ✓ Loaned tablet {tablet_id} to user {user_id}") + + conn.commit() + + # Test 5: Show active loans + print("\n5. Active loans:") + cursor.execute(''' + SELECT l.id, t.brand, t.model, t.serial_number, u.name, l.loan_date + FROM loans l + JOIN tablets t ON l.tablet_id = t.id + JOIN users u ON l.user_id = u.id + WHERE l.status = 'active' + ''') + active_loans = cursor.fetchall() + + for loan in active_loans: + print(f" Loan {loan[0]}: {loan[1]} {loan[2]} ({loan[3]}) to {loan[4]} on {loan[5]}") + + # Test 6: Return a tablet + print("\n6. Returning tablet...") + loan_id = 1 + + cursor.execute("SELECT tablet_id FROM loans WHERE id = ?", (loan_id,)) + loan = cursor.fetchone() + + if loan: + tablet_id = loan[0] + return_date = datetime.now().strftime('%Y-%m-%d %H:%M:%S') + cursor.execute(''' + UPDATE loans SET status = 'returned', return_date = ? WHERE id = ? + ''', (return_date, loan_id)) + cursor.execute("UPDATE tablets SET status = 'available' WHERE id = ?", (tablet_id,)) + print(f" ✓ Returned tablet for loan {loan_id}") + + conn.commit() + + # Test 7: Show loan history + print("\n7. Complete loan history:") + cursor.execute(''' + SELECT l.id, t.brand, t.model, t.serial_number, u.name, + l.loan_date, l.return_date, l.status + FROM loans l + JOIN tablets t ON l.tablet_id = t.id + JOIN users u ON l.user_id = u.id + ORDER BY l.loan_date DESC + ''') + loans = cursor.fetchall() + + for loan in loans: + return_date = loan[6] or 'Not returned' + print(f" Loan {loan[0]}: {loan[1]} {loan[2]} ({loan[3]}) to {loan[4]}") + print(f" Loan: {loan[5]}, Return: {return_date}, Status: {loan[7]}") + + # Test 8: Show final status + print("\n8. Final status:") + + # Available tablets + cursor.execute("SELECT COUNT(*) FROM tablets WHERE status = 'available'") + available_count = cursor.fetchone()[0] + print(f" Available tablets: {available_count}") + + # Loaned tablets + cursor.execute("SELECT COUNT(*) FROM tablets WHERE status = 'loaned'") + loaned_count = cursor.fetchone()[0] + print(f" Loaned tablets: {loaned_count}") + + # Active loans + cursor.execute("SELECT COUNT(*) FROM loans WHERE status = 'active'") + active_loans_count = cursor.fetchone()[0] + print(f" Active loans: {active_loans_count}") + + # Returned loans + cursor.execute("SELECT COUNT(*) FROM loans WHERE status = 'returned'") + returned_loans_count = cursor.fetchone()[0] + print(f" Returned loans: {returned_loans_count}") + + conn.close() + + print("\n=== Test completed successfully! ===") + print("\nYou can now run the interactive application:") + print(" python3 minimal_app.py") + print("\nOr use the database directly with SQLite:") + print(" sqlite3 tablets.db") + +if __name__ == '__main__': + test_tablet_management() \ No newline at end of file diff --git a/working_server.py b/working_server.py new file mode 100644 index 0000000..96b4dd8 --- /dev/null +++ b/working_server.py @@ -0,0 +1,182 @@ +#!/usr/bin/env python3 +""" +Working web server for tablet management system +""" + +from http.server import HTTPServer, BaseHTTPRequestHandler +import sqlite3 +from urllib.parse import urlparse, parse_qs +import json + +class TabletHandler(BaseHTTPRequestHandler): + def _set_headers(self, status=200, content_type='text/html'): + self.send_response(status) + self.send_header('Content-type', content_type) + self.end_headers() + + def do_GET(self): + parsed = urlparse(self.path) + + if parsed.path == '/': + self._serve_main_page() + elif parsed.path == '/api/tablets': + self._serve_tablets() + elif parsed.path == '/api/users': + self._serve_users() + elif parsed.path == '/api/loans': + self._serve_loans() + else: + self._set_headers(404) + self.wfile.write(b'404 Not Found') + + def _serve_main_page(self): + html = ''' + + + Tablet Management System + + + +
+

Tablet Management System

+

SQLite backend - Port 8000

+ +
+

Available Tablets

+
+
+ +
+

Active Loans

+
+
+ +
+

System Info

+

✓ Database: tablets.db

+

✓ Status: Operational

+

Port: 8000

+
+
+ + + +''' + + self._set_headers() + self.wfile.write(html.encode('utf-8')) + + def _serve_tablets(self): + try: + conn = sqlite3.connect('tablets.db') + conn.row_factory = sqlite3.Row + cursor = conn.cursor() + cursor.execute('SELECT * FROM tablets') + tablets = [dict(row) for row in cursor.fetchall()] + conn.close() + + self._set_headers(content_type='application/json') + self.wfile.write(json.dumps(tablets).encode('utf-8')) + except Exception as e: + self._set_headers(500) + self.wfile.write(json.dumps({'error': str(e)}).encode('utf-8')) + + def _serve_users(self): + try: + conn = sqlite3.connect('tablets.db') + conn.row_factory = sqlite3.Row + cursor = conn.cursor() + cursor.execute('SELECT * FROM users') + users = [dict(row) for row in cursor.fetchall()] + conn.close() + + self._set_headers(content_type='application/json') + self.wfile.write(json.dumps(users).encode('utf-8')) + except Exception as e: + self._set_headers(500) + self.wfile.write(json.dumps({'error': str(e)}).encode('utf-8')) + + def _serve_loans(self): + try: + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + cursor.execute(''' + SELECT l.id, l.tablet_id, l.user_id, l.loan_date, l.return_date, l.status, + t.brand || ' ' || t.model as tablet, + u.name as user + FROM loans l + JOIN tablets t ON l.tablet_id = t.id + JOIN users u ON l.user_id = u.id + ''') + + loans = [] + for row in cursor.fetchall(): + loans.append({ + 'id': row[0], + 'tablet_id': row[1], + 'user_id': row[2], + 'loan_date': row[3], + 'return_date': row[4], + 'status': row[5], + 'tablet': row[6], + 'user': row[7] + }) + conn.close() + + self._set_headers(content_type='application/json') + self.wfile.write(json.dumps(loans).encode('utf-8')) + except Exception as e: + self._set_headers(500) + self.wfile.write(json.dumps({'error': str(e)}).encode('utf-8')) + +def run_server(): + server_address = ('', 8000) + httpd = HTTPServer(server_address, TabletHandler) + + print("Tablet Management System - Web Interface") + print("========================================") + print("Server running on: http://localhost:8000") + print("Database: tablets.db (SQLite)") + print("Press Ctrl+C to stop the server") + print() + + try: + httpd.serve_forever() + except KeyboardInterrupt: + print("\nServer stopped") + +if __name__ == '__main__': + run_server() \ No newline at end of file From ec79bc2ca366faf89770463121e0750768e873d2 Mon Sep 17 00:00:00 2001 From: ijuanes Date: Thu, 4 Jun 2026 01:00:17 +0100 Subject: [PATCH 02/39] feat(loans): add search and expandable past loans to user loans view MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Add search box to filter by user name, ID, tablet brand/model/serial - Split loans into Current Loans (always visible) and Past Loans (collapsible) - Past loans toggle with â–¶/â–¼ indicator showing count - All searchable data embedded in data-search attributes Generated by Mistral Vibe. Co-Authored-By: Mistral Vibe --- templates/user_loans.html | 182 +++++++++++++++++++++++++++++++------- 1 file changed, 150 insertions(+), 32 deletions(-) diff --git a/templates/user_loans.html b/templates/user_loans.html index 8c10045..07fac86 100644 --- a/templates/user_loans.html +++ b/templates/user_loans.html @@ -7,45 +7,98 @@ This page demonstrates the many-to-many relationship between users and tablets via the loans table.

-
+ +
+ + +
+ +
{% for user_data in users_with_loans %} {% set user = user_data.user %} {% set loans = user_data.loans %} + {% set active_loans = loans|selectattr('status', 'equalto', 'active')|list %} + {% set returned_loans = loans|selectattr('status', 'equalto', 'returned')|list %} -
+

{{ user.name }} ({{ user.identification }})

- {{ loans|length }} tablet{{ 's' if loans|length != 1 else '' }} loaned + + {{ active_loans|length }} active, {{ returned_loans|length }} past +
- {% if loans %} - - - - - - - - - - - - {% for loan in loans %} - - - - - - + {% if active_loans %} +
+

Current Loans

+
TabletSerial NumberLoan DateReturn DateStatus
{{ loan.brand }} {{ loan.model }}{{ loan.serial_number }}{{ loan.loan_date }}{{ loan.return_date or '-' }} - - {{ loan.status }} - -
+ + + + + + - {% endfor %} - -
TabletSerial NumberLoan DateStatus
- {% else %} + + + {% for loan in active_loans %} + + {{ loan.brand }} {{ loan.model }} + {{ loan.serial_number }} + {{ loan.loan_date }} + + + {{ loan.status }} + + + + {% endfor %} + + +
+ {% endif %} + + {% if returned_loans %} +
+

+ +

+ +
+ {% endif %} + + {% if not active_loans and not returned_loans %}

No loans recorded for this user.

{% endif %}
@@ -56,6 +109,32 @@ {% endif %}
+ + + + /* ============================================ + RESPONSIVE DESIGN - Mobile First + Added for internal technical staff mobile access + ============================================ */ + + /* Mobile-first base styles */ + .container { + max-width: 100%; + padding: 1rem; + margin: 0 auto; + } + + /* Navigation - stack vertically on mobile */ + .nav { + display: flex; + flex-direction: column; + gap: 0.5rem; + margin-bottom: 1rem; + } + .nav a { + padding: 0.75rem 1rem; + text-align: center; + white-space: nowrap; + } + + /* Tables - responsive with horizontal scroll */ + .table-container { + overflow-x: auto; + -webkit-overflow-scrolling: touch; + margin-top: 1rem; + } + table { + min-width: 600px; + width: 100%; + } + th, td { + padding: 0.75rem; + white-space: nowrap; + } + + /* Forms - full width on mobile */ + form { + max-width: 100%; + } + input[type="text"], + input[type="email"], + input[type="password"], + input[type="number"], + textarea, + select { + width: 100%; + padding: 0.75rem; + margin-bottom: 1rem; + box-sizing: border-box; + } + + /* Buttons - full width on mobile */ + .btn { + padding: 0.75rem 1.5rem; + width: 100%; + margin-bottom: 0.5rem; + display: block; + } + .btn:last-child { + margin-bottom: 0; + } + + /* Cards for mobile display */ + .tablet-card, + .user-card, + .loan-card { + background: white; + border-radius: 8px; + padding: 1rem; + margin-bottom: 1rem; + box-shadow: 0 2px 4px rgba(0,0,0,0.1); + border: 1px solid #e0e0e0; + } + + /* Flash messages */ + .flash-message { + padding: 1rem; + margin-bottom: 1rem; + border-radius: 4px; + } + + /* Section spacing */ + .section { + margin-bottom: 1.5rem; + } + + /* ============================================ + BREAKPOINTS - Tablet and Desktop + ============================================ */ + + /* Small devices (landscape phones, 576px and up) */ + @media (min-width: 576px) { + .container { + max-width: 540px; + } + .nav { + flex-direction: row; + flex-wrap: wrap; + } + .nav a { + flex: 1 1 auto; + min-width: 120px; + } + .btn { + width: auto; + display: inline-block; + margin-bottom: 0; + margin-right: 0.5rem; + } + .btn:last-child { + margin-right: 0; + } + } + + /* Medium devices (tablets, 768px and up) */ + @media (min-width: 768px) { + body { + padding: 1rem; + } + .container { + max-width: 720px; + padding: 1.5rem; + } + table { + min-width: auto; + } + .table-container { + overflow-x: visible; + } + } + + /* Large devices (desktops, 992px and up) */ + @media (min-width: 992px) { + .container { + max-width: 960px; + } + .nav { + flex-wrap: nowrap; + } + } + + /* Extra large devices (large desktops, 1200px and up) */ + @media (min-width: 1200px) { + .container { + max-width: 1140px; + } + } + + /* Print styles */ + @media print { + .nav, + .btn, + .flash-message { + display: none !important; + } + body { + background: white; + padding: 0; + } + .container { + box-shadow: none; + border: none; + max-width: 100%; + padding: 0; + } + }
diff --git a/templates/history.html b/templates/history.html index 8a2fe7a..061ffbd 100644 --- a/templates/history.html +++ b/templates/history.html @@ -4,30 +4,32 @@

Loan History

{% if loans %} - - - - - - - - - - - - - {% for loan in loans %} +
+
TabletSerial NumberBorrowerLoan DateReturn DateStatus
+ - - - - - - + + + + + + - {% endfor %} - -
{{ loan.brand }} {{ loan.model }}{{ loan.serial_number }}{{ loan.name }}{{ loan.loan_date }}{{ loan.return_date or '-' }}{{ loan.status }}TabletSerial NumberBorrowerLoan DateReturn DateStatus
+ + + {% for loan in loans %} + + {{ loan.brand }} {{ loan.model }} + {{ loan.serial_number }} + {{ loan.name }} + {{ loan.loan_date }} + {{ loan.return_date or '-' }} + {{ loan.status }} + + {% endfor %} + + +
{% else %}

No loan history available.

{% endif %} diff --git a/templates/index.html b/templates/index.html index 8dfcdb6..f946ad8 100644 --- a/templates/index.html +++ b/templates/index.html @@ -4,26 +4,28 @@

Available Tablets

{% if available_tablets %} - - - - - - - - - - - {% for tablet in available_tablets %} +
+
BrandModelSerial NumberNotes
+ - - - - + + + + - {% endfor %} - -
{{ tablet.brand }}{{ tablet.model }}{{ tablet.serial_number }}{{ tablet.notes or '-' }}BrandModelSerial NumberNotes
+ + + {% for tablet in available_tablets %} + + {{ tablet.brand }} + {{ tablet.model }} + {{ tablet.serial_number }} + {{ tablet.notes or '-' }} + + {% endfor %} + + +
{% else %}

No available tablets.

{% endif %} @@ -32,30 +34,32 @@

Active Loans

{% if active_loans %} - - - - - - - - - - - - {% for loan in active_loans %} +
+
TabletSerial NumberBorrowerLoan DateActions
+ - - - - - + + + + + - {% endfor %} - -
{{ loan.brand }} {{ loan.model }}{{ loan.serial_number }}{{ loan.name }}{{ loan.loan_date }} - Return - TabletSerial NumberBorrowerLoan DateActions
+ + + {% for loan in active_loans %} + + {{ loan.brand }} {{ loan.model }} + {{ loan.serial_number }} + {{ loan.name }} + {{ loan.loan_date }} + + Return + + + {% endfor %} + + +
{% else %}

No active loans.

{% endif %} diff --git a/templates/non_loanable_devices.html b/templates/non_loanable_devices.html index a27e6ac..990d433 100644 --- a/templates/non_loanable_devices.html +++ b/templates/non_loanable_devices.html @@ -7,35 +7,37 @@ Add Non-Loanable Device {% if devices %} - - - - - - - - - - - - - - {% for device in devices %} +
+
TypeBrandModelSerial NumberLocationStatusActions
+ - - - - - - - + + + + + + + - {% endfor %} - -
{{ device.device_type }}{{ device.brand }}{{ device.model }}{{ device.serial_number }}{{ device.location or '-' }}{{ device.status }} - Edit - Delete - TypeBrandModelSerial NumberLocationStatusActions
+ + + {% for device in devices %} + + {{ device.device_type }} + {{ device.brand }} + {{ device.model }} + {{ device.serial_number }} + {{ device.location or '-' }} + {{ device.status }} + + Edit + Delete + + + {% endfor %} + + +
{% else %}

No non-loanable devices registered.

{% endif %} diff --git a/templates/project_management.html b/templates/project_management.html index 7ca8005..597babd 100644 --- a/templates/project_management.html +++ b/templates/project_management.html @@ -186,11 +186,28 @@ border: 1px solid #ddd; padding: 8px; } - + + /* ============================================ + RESPONSIVE DESIGN FOR PROJECT MANAGEMENT + ============================================ */ @media (max-width: 768px) { .editor-row { flex-direction: column; } + .markdown-editor, + .markdown-preview { + height: 350px; + } + } + + @media (max-width: 480px) { + .editor-controls { + flex-direction: column; + gap: 0.5rem; + } + .editor-controls button { + width: 100%; + } } {% endblock %} diff --git a/templates/user_loans.html b/templates/user_loans.html index 07fac86..6fddf9c 100644 --- a/templates/user_loans.html +++ b/templates/user_loans.html @@ -33,30 +33,32 @@ {% if active_loans %}

Current Loans

- - - - - - - - - - - {% for loan in active_loans %} - - - - - +
+
TabletSerial NumberLoan DateStatus
{{ loan.brand }} {{ loan.model }}{{ loan.serial_number }}{{ loan.loan_date }} - - {{ loan.status }} - -
+ + + + + + - {% endfor %} - -
TabletSerial NumberLoan DateStatus
+ + + {% for loan in active_loans %} + + {{ loan.brand }} {{ loan.model }} + {{ loan.serial_number }} + {{ loan.loan_date }} + + + {{ loan.status }} + + + + {% endfor %} + + +
{% endif %} @@ -68,32 +70,34 @@ {% endif %} From 28232dbaf9e22e0839f5caddecb76845b64322c7 Mon Sep 17 00:00:00 2001 From: ijuanes Date: Sat, 20 Jun 2026 01:27:17 +0100 Subject: [PATCH 13/39] fix(ui): add missing tag in base.html The responsive CSS addition was missing the closing tag, which caused the main page to render as blank. This fix restores the proper HTML structure. --- templates/base.html | 1 + 1 file changed, 1 insertion(+) diff --git a/templates/base.html b/templates/base.html index 0c78166..3dbf0c0 100644 --- a/templates/base.html +++ b/templates/base.html @@ -295,6 +295,7 @@ padding: 0; } } +
From dea2f23524f91a16048da0ac8b750d7f5b072559 Mon Sep 17 00:00:00 2001 From: ijuanes Date: Sat, 20 Jun 2026 01:28:24 +0100 Subject: [PATCH 14/39] docs(ui): update RESPONSIVE_CSS.md with bug fix documentation - Document the missing tag bug and fix - Update file counts and line changes - Add commit information section - Reorganize for better readability --- docs/RESPONSIVE_CSS.md | 189 ++++++++++++++++++++++++++++++++++++++++- 1 file changed, 187 insertions(+), 2 deletions(-) diff --git a/docs/RESPONSIVE_CSS.md b/docs/RESPONSIVE_CSS.md index fed69d4..36e1b4b 100644 --- a/docs/RESPONSIVE_CSS.md +++ b/docs/RESPONSIVE_CSS.md @@ -13,13 +13,198 @@ June 20, 2026 | File | Changes | Lines Changed | |------|---------|---------------| -| `templates/base.html` | Added responsive CSS framework | +173 | +| `templates/base.html` | Added responsive CSS framework + fixed missing `` tag | +173 +1 | | `templates/index.html` | Wrapped tables in `.table-container` | +84/-84 | | `templates/history.html` | Wrapped tables in `.table-container` | +46/-46 | | `templates/non_loanable_devices.html` | Wrapped tables in `.table-container` | +56/-56 | | `templates/user_loans.html` | Wrapped tables in `.table-container` | +80/-80 | | `templates/project_management.html` | Added mobile breakpoints for editor | +19/-3 | -| **Total** | | **+329/-129** | +| `docs/RESPONSIVE_CSS.md` | **NEW** - Complete documentation | +208 | +| **Total** | | **+538 / -129** | + +## Technical Details + +### Approach +- **Mobile-first design**: Styles start with mobile and scale up +- **Progressive enhancement**: Works on all devices, enhances for larger screens +- **No JavaScript changes**: Pure CSS solution +- **No backend changes**: Only template modifications +- **Backward compatible**: Existing functionality preserved + +### Key Features + +#### 1. Responsive Breakpoints +```css +/* Mobile-first base styles */ +/* Small devices (landscape phones, 576px and up) */ +@media (min-width: 576px) { ... } + +/* Medium devices (tablets, 768px and up) */ +@media (min-width: 768px) { ... } + +/* Large devices (desktops, 992px and up) */ +@media (min-width: 992px) { ... } + +/* Extra large devices (large desktops, 1200px and up) */ +@media (min-width: 1200px) { ... } +``` + +#### 2. Mobile Navigation +- Navigation links **stack vertically** on mobile +- Full-width buttons for easy tapping +- Horizontal layout on tablet/desktop + +#### 3. Responsive Tables +- Tables wrapped in `.table-container` div +- **Horizontal scrolling** on mobile when table is too wide +- Full width on larger screens + +#### 4. Form Elements +- Full-width inputs on mobile +- Proper spacing and padding +- Touch-friendly sizes (minimum 48px tap targets) + +#### 5. Buttons +- Full-width on mobile +- Inline on larger screens +- Consistent styling + +#### 6. Cards +- Added `.tablet-card`, `.user-card`, `.loan-card` classes +- Consistent styling for card-based layouts +- Proper spacing on all devices + +#### 7. Project Management Editor +- Stacked layout on mobile (editor above preview) +- Side-by-side on tablet/desktop +- Responsive button controls + +## Bug Fix + +### Missing `` Tag +**Issue:** After adding responsive CSS to `base.html`, the closing `` tag was accidentally omitted, causing the main page to render as blank. + +**Fix:** Added `` tag at line 298 in `templates/base.html` (commit `28232db`). + +**Symptoms:** +- Main page (index) displayed as blank +- Other pages may have had styling issues +- HTML structure was invalid + +**Resolution:** +- Added missing `` tag +- Verified all templates have proper structure +- Tested that pages render correctly + +## Design Decisions + +### Why This Approach? + +1. **5 Internal Users**: No need for complex SPA frameworks +2. **Technical Staff**: Users understand basic UI limitations +3. **CRUD Operations**: Simple forms and lists don't need React/Vue +4. **Minimal Changes**: Pure CSS, no JavaScript modifications +5. **Fast Implementation**: Done in one session +6. **Maintainable**: Simple to understand and modify + +### Why Not HTMX or SPA? + +While we explored [HTMX](docs/FRONTEND_OPTIONS.md#option-3-htmx) and [SPA options](docs/FRONTEND_OPTIONS.md#option-1-single-page-application-spa-with-rest-api), for 5 internal technical users: + +- **HTMX**: Would add unnecessary complexity for minimal benefit +- **SPA**: Significant overkill for the user base and use case +- **Pure CSS**: Solves the problem with minimal changes + +The responsive CSS approach provides **80% of the benefit with 20% of the effort**. + +## Testing + +### Test Cases + +| Device | Screen Size | Expected Behavior | +|--------|-------------|-------------------| +| Mobile (Portrait) | 375px | Vertical nav, full-width inputs, scrollable tables | +| Mobile (Landscape) | 667px | Vertical nav, full-width inputs, scrollable tables | +| Small Tablet | 768px | Horizontal nav (wrapped), proper spacing | +| Large Tablet | 1024px | Horizontal nav, side-by-side editor/preview | +| Desktop | 1440px | Full desktop layout | + +### Manual Testing +1. Open on mobile device or use browser dev tools +2. Resize browser window to test different breakpoints +3. Verify all tables have horizontal scroll on mobile +4. Verify navigation is usable on all devices +5. Verify forms are easy to use on mobile + +## Browser Compatibility + +- ✅ Chrome (all versions) +- ✅ Firefox (all versions) +- ✅ Safari (all versions) +- ✅ Edge (all versions) +- ✅ Mobile browsers (iOS Safari, Chrome for Android) + +## Performance Impact + +- **Zero**: Pure CSS, no JavaScript overhead +- **No additional requests**: All styles inlined in templates +- **Fast rendering**: Browser-native CSS processing + +## Future Considerations + +If user base grows or requirements change, consider: + +1. **HTMX Enhancement** (1-2 days) + - Add dynamic updates without page reloads + - See: [docs/FRONTEND_OPTIONS.md - Option 3](docs/FRONTEND_OPTIONS.md#option-3-flask--htmx-lightweight-dynamic-ui) + +2. **SPA Migration** (1-2 weeks) + - Full React/Vue frontend + - See: [docs/FRONTEND_OPTIONS.md - Option 1](docs/FRONTEND_OPTIONS.md#option-1-single-page-application-spa-with-rest-api) + +3. **Mobile App** (2-4 weeks) + - Native mobile experience + - See: [docs/FRONTEND_OPTIONS.md - Option 4](docs/FRONTEND_OPTIONS.md#option-4-mobile-app-native-or-cross-platform) + +## Rollback Plan + +If issues arise, simply revert the template changes: + +```bash +git checkout HEAD -- templates/ +``` + +All changes are isolated to template files, so rollback is trivial. + +## Files Changed Summary + +``` +templates/ +├── base.html # Main responsive CSS + bug fix +├── index.html # Table containers +├── history.html # Table containers +├── non_loanable_devices.html # Table containers +├── user_loans.html # Table containers +└── project_management.html # Editor responsiveness + +docs/ +└── RESPONSIVE_CSS.md # This documentation +``` + +## Commit Information + +``` +Commit 1: 927c323a6e7de1f3068d54ffdee22b8a420a1190 +Author: ijuanes +Date: June 20, 2026 +Message: feat(ui): add responsive CSS for mobile accessibility + +Commit 2: 28232db0[...] +Author: ijuanes +Date: June 20, 2026 +Message: fix(ui): add missing tag in base.html +``` + ## Technical Details From 3e2e440d06f003b41e9c72fdcf302bdc61167b4e Mon Sep 17 00:00:00 2001 From: ijuanes Date: Sat, 20 Jun 2026 01:32:48 +0100 Subject: [PATCH 15/39] docs: add Spanish translation requirement note to RESPONSIVE_CSS.md - Add TOP PRIORITY section for Spanish translation - Document scope: all templates need translation - List all files to translate with status - Provide 3 approach options (direct, Flask-Babel, macros) - Include English-Spanish translation table - Note: Do not change code yet - documentation only - Mark as high priority for future work --- docs/RESPONSIVE_CSS.md | 109 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 109 insertions(+) diff --git a/docs/RESPONSIVE_CSS.md b/docs/RESPONSIVE_CSS.md index 36e1b4b..7b3b84f 100644 --- a/docs/RESPONSIVE_CSS.md +++ b/docs/RESPONSIVE_CSS.md @@ -4,6 +4,115 @@ Added responsive CSS to the Tablet Management System to improve mobile accessibility for internal technical staff. This addresses the issue where the interface was too wide for mobile devices. +## âš ï¸ TOP PRIORITY: Spanish Translation Required + +**Status:** Not started - Documentation only +**Priority:** HIGH +**Timeline:** To be determined + +The entire user interface needs to be translated from English to Spanish. This includes: + +### Scope of Translation +- ✅ All template text (buttons, labels, headers, messages) +- ✅ Navigation links +- ✅ Form field labels and placeholders +- ✅ Button text +- ✅ Flash messages (success/error) +- ✅ Table headers +- ✅ Help text and descriptions +- ✅ Page titles + +### Files to Translate +| File | Status | Notes | +|------|--------|-------| +| `templates/base.html` | â³ Pending | Title, navigation, flash messages | +| `templates/index.html` | â³ Pending | Section headers, table headers, messages | +| `templates/add_tablet.html` | â³ Pending | Form labels, button | +| `templates/add_user.html` | â³ Pending | Form labels, button | +| `templates/loan_tablet.html` | â³ Pending | Form labels, button, search placeholders | +| `templates/history.html` | â³ Pending | Section header, table headers, messages | +| `templates/user_loans.html` | â³ Pending | All text content, search placeholder | +| `templates/non_loanable_devices.html` | â³ Pending | Section header, table headers, messages, button | +| `templates/edit_non_loanable_device.html` | â³ Pending | Form labels, buttons | +| `templates/project_management.html` | â³ Pending | All text content, buttons | + +### Approach Options + +#### Option 1: Direct Template Translation (Recommended for simplicity) +- Replace all English text with Spanish directly in templates +- **Pros:** Simple, fast, no dependencies +- **Cons:** Harder to maintain bilingual support + +#### Option 2: Flask-Babel Integration (Recommended for future i18n) +```python +# Install: pip install flask-babel +from flask_babel import Babel, gettext as _ + +app = Flask(__name__) +babel = Babel(app) + +# In templates: +# Before:

Tablet Management System

+# After:

{{ _('Tablet Management System') }}

+``` +- **Pros:** Supports multiple languages, professional i18n +- **Cons:** More complex setup, requires extracting strings + +#### Option 3: Jinja2 Macros +```html +{# macros.html #} +{% macro trans(text) %}{{ text|trans }}{% endmacro %} + +{# In templates #} +{% import 'macros.html' as m %} +

{{ m.trans('Tablet Management System') }}

+``` +- **Pros:** Reusable, clean templates +- **Cons:** Requires macro setup + +### Recommended Spanish Translations + +| English | Spanish | +|---------|---------| +| Tablet Management System | Sistema de Gestión de Tablets | +| Available Tablets | Tablets Disponibles | +| Active Loans | Préstamos Activos | +| Loan History | Historial de Préstamos | +| User Loans | Préstamos por Usuario | +| Non-Loanable Devices | Dispositivos No Prestables | +| Project Management | Gestión de Proyectos | +| Add Tablet | Añadir Tablet | +| Add User | Añadir Usuario | +| Loan Tablet | Prestar Tablet | +| Return | Devolver | +| Brand | Marca | +| Model | Modelo | +| Serial Number | Número de Serie | +| Notes | Notas | +| Name | Nombre | +| Email | Correo Electrónico | +| Phone | Teléfono | +| Identification | Identificación | +| Loan Date | Fecha de Préstamo | +| Return Date | Fecha de Devolución | +| Status | Estado | +| Actions | Acciones | +| Edit | Editar | +| Delete | Eliminar | +| Save | Guardar | +| Search | Buscar | +| No available tablets. | No hay tablets disponibles. | +| No active loans. | No hay préstamos activos. | +| No loan history available. | No hay historial de préstamos disponible. | + +### Implementation Notes +- **Do not change code yet** - This is documentation only for now +- Consider using a translation dictionary or Flask-Babel for maintainability +- Test all translated text fits within the responsive design +- Verify character encoding supports Spanish (UTF-8 should be fine) + +--- + ## Changes Made ### Date From 26b77cf0e92e23d7aeac7365f007dfb8a035772d Mon Sep 17 00:00:00 2001 From: ijuanes Date: Sat, 20 Jun 2026 01:41:28 +0100 Subject: [PATCH 16/39] fix(ui): prevent navigation overflow on zoom and small screens - Add overflow-x: hidden to body to prevent horizontal scroll on zoom - Add overflow: hidden to .container to prevent margin overflow - Ensure .nav a has flex: 1 1 auto and min-width: 120px for proper wrapping - Fixes issue where navigation buttons overflow through right margin when zoomed in This ensures the navigation bar wraps properly and doesn't cause horizontal scrolling or overflow issues on any screen size or zoom level. --- templates/base.html | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/templates/base.html b/templates/base.html index 3dbf0c0..3382ed4 100644 --- a/templates/base.html +++ b/templates/base.html @@ -10,6 +10,7 @@ margin: 0; padding: 20px; background-color: #f5f5f5; + overflow-x: hidden; /* Prevent horizontal overflow on zoom */ } .container { max-width: 1200px; @@ -134,6 +135,7 @@ max-width: 100%; padding: 1rem; margin: 0 auto; + overflow: hidden; /* Prevent horizontal overflow */ } /* Navigation - stack vertically on mobile */ @@ -142,11 +144,14 @@ flex-direction: column; gap: 0.5rem; margin-bottom: 1rem; + flex-wrap: wrap; } .nav a { padding: 0.75rem 1rem; text-align: center; white-space: nowrap; + flex: 1 1 auto; + min-width: 120px; } /* Tables - responsive with horizontal scroll */ From 5d66ffa1a66bc7d45b22c2e317d7471d2ebb387d Mon Sep 17 00:00:00 2001 From: ijuanes Date: Sat, 20 Jun 2026 01:42:29 +0100 Subject: [PATCH 17/39] docs(ui): document navigation overflow fix in RESPONSIVE_CSS.md - Add section for navigation overflow on zoom bug and fix - Document symptoms, changes, and results - Keep documentation up to date with all fixes --- docs/RESPONSIVE_CSS.md | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/docs/RESPONSIVE_CSS.md b/docs/RESPONSIVE_CSS.md index 7b3b84f..739a915 100644 --- a/docs/RESPONSIVE_CSS.md +++ b/docs/RESPONSIVE_CSS.md @@ -205,6 +205,24 @@ June 20, 2026 - Verified all templates have proper structure - Tested that pages render correctly +### Navigation Overflow on Zoom +**Issue:** Navigation buttons (Home, Add Tablet, Add User, etc.) overflow through the right margin when zooming in on the page. + +**Fix:** Added overflow constraints to prevent horizontal scrolling (commit `26b77cf`). + +**Changes:** +- Added `overflow-x: hidden` to `body` element +- Added `overflow: hidden` to `.container` element +- Added `flex-wrap: wrap` to `.nav` in mobile-first styles +- Added `flex: 1 1 auto` and `min-width: 120px` to `.nav a` for proper wrapping + +**Result:** +- Navigation buttons now wrap properly on all screen sizes +- No horizontal overflow when zooming in +- Buttons remain usable and visible at all zoom levels + + + ## Design Decisions ### Why This Approach? From e78920194247bfb2eb3c3f3a38cfa8d3d6f72274 Mon Sep 17 00:00:00 2001 From: ijuanes Date: Sat, 20 Jun 2026 07:51:35 +0100 Subject: [PATCH 18/39] docs: add CLI vs Web functionality comparison - Document all differences between CLI and web versions - Identify missing features in CLI (email, phone, notes fields) - List database schema mismatches - Provide code changes required to sync CLI with web - Include migration strategy and recommendations --- docs/CLI_VS_WEB.md | 463 +++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 463 insertions(+) create mode 100644 docs/CLI_VS_WEB.md diff --git a/docs/CLI_VS_WEB.md b/docs/CLI_VS_WEB.md new file mode 100644 index 0000000..5329e31 --- /dev/null +++ b/docs/CLI_VS_WEB.md @@ -0,0 +1,463 @@ +# CLI vs Web Functionality Comparison + +## Overview + +This document compares the functionality between the **CLI version** (`minimal_app.py`) and the **Web version** (`app.py`) of the Tablet Management System. + +## Current State + +### Web Version (app.py) - Complete Feature Set + +| Feature | Status | Route | Template | +|---------|--------|-------|---------| +| Add Tablet | ✅ | `/add_tablet` | `add_tablet.html` | +| Add User | ✅ | `/add_user` | `add_user.html` | +| Loan Tablet | ✅ | `/loan_tablet` | `loan_tablet.html` | +| Return Tablet | ✅ | `/return_tablet/` | N/A (redirects) | +| Show Available Tablets | ✅ | `/` (index) | `index.html` | +| Show Active Loans | ✅ | `/` (index) | `index.html` | +| Loan History | ✅ | `/history` | `history.html` | +| User Loans | ✅ | `/user_loans` | `user_loans.html` | +| Add Non-Loanable Device | ✅ | `/add_non_loanable_device` | `add_non_loanable_device.html` | +| Show Non-Loanable Devices | ✅ | `/non_loanable_devices` | `non_loanable_devices.html` | +| Edit Non-Loanable Device | ✅ | `/edit_non_loanable_device/` | `edit_non_loanable_device.html` | +| Delete Non-Loanable Device | ✅ | `/delete_non_loanable_device/` | N/A (redirects) | +| Project Management | ✅ | `/project_management` | `project_management.html` | + +### CLI Version (minimal_app.py) - Incomplete + +| Feature | Status | Function | +|---------|--------|----------| +| Add Tablet | ✅ | `add_tablet()` | +| Add User | âš ï¸ Partial | `add_user()` - Missing email/phone | +| Loan Tablet | ✅ | `loan_tablet()` | +| Return Tablet | ✅ | `return_tablet()` | +| Show Available Tablets | ✅ | `show_available_tablets()` | +| Show Active Loans | ✅ | `show_active_loans()` | +| Loan History | ✅ | `show_loan_history()` | +| Add Non-Loanable Device | ✅ | `add_non_loanable_device()` | +| Show Non-Loanable Devices | ✅ | `show_non_loanable_devices()` | +| Delete Non-Loanable Device | ✅ | `delete_non_loanable_device()` | +| Show Users | ✅ | `show_users()` | +| **User Loans** | ⌠Missing | N/A | +| **Edit Non-Loanable Device** | ⌠Missing | N/A | +| **Project Management** | ⌠Missing | N/A | + +## Missing Features in CLI + +### 1. User Management +**Web:** Supports name, email, phone, identification +**CLI:** Only supports name, identification + +**Missing:** +- Email field +- Phone field + +### 2. Tablet Management +**Web:** Supports brand, model, serial_number, notes +**CLI:** Supports brand, model, serial_number + +**Missing:** +- Notes field + +### 3. Non-Loanable Devices +**Web:** Full CRUD (Create, Read, Update, Delete) +**CLI:** Only Create, Read, Delete + +**Missing:** +- Edit functionality + +### 4. Additional Features +**Web:** Has these features +**CLI:** Missing + +- User Loans page (shows loans by user with search) +- Project Management (markdown notes editor) +- Flash messages (CLI uses print, which is fine) + +## Database Schema Comparison + +### Web Version Schema (app.py) + +```sql +-- tablets +CREATE TABLE tablets ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + brand TEXT NOT NULL, + model TEXT NOT NULL, + serial_number TEXT UNIQUE NOT NULL, + status TEXT DEFAULT 'available', + notes TEXT +) + +-- users +CREATE TABLE users ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + name TEXT NOT NULL, + email TEXT, + phone TEXT, + identification TEXT UNIQUE +) + +-- loans +CREATE TABLE loans ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + tablet_id INTEGER NOT NULL, + user_id INTEGER NOT NULL, + loan_date TEXT NOT NULL, + return_date TEXT, + status TEXT DEFAULT 'active', + FOREIGN KEY (tablet_id) REFERENCES tablets (id), + FOREIGN KEY (user_id) REFERENCES users (id) +) + +-- non_loanable_devices +CREATE TABLE non_loanable_devices ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + brand TEXT NOT NULL, + model TEXT NOT NULL, + serial_number TEXT UNIQUE NOT NULL, + device_type TEXT NOT NULL, + location TEXT, + status TEXT DEFAULT 'available', + notes TEXT, + purchase_date TEXT, + purchase_cost REAL +) +``` + +### CLI Version Schema (minimal_app.py) + +```sql +-- tablets +CREATE TABLE tablets ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + brand TEXT NOT NULL, + model TEXT NOT NULL, + serial_number TEXT UNIQUE NOT NULL, + status TEXT DEFAULT 'available' + -- MISSING: notes TEXT +) + +-- users +CREATE TABLE users ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + name TEXT NOT NULL, + identification TEXT UNIQUE + -- MISSING: email TEXT, phone TEXT +) + +-- loans +CREATE TABLE loans ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + tablet_id INTEGER NOT NULL, + user_id INTEGER NOT NULL, + loan_date TEXT NOT NULL, + return_date TEXT, + status TEXT DEFAULT 'active', + FOREIGN KEY (tablet_id) REFERENCES tablets (id), + FOREIGN KEY (user_id) REFERENCES users (id) +) + +-- non_loanable_devices +CREATE TABLE non_loanable_devices ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + brand TEXT NOT NULL, + model TEXT NOT NULL, + serial_number TEXT UNIQUE NOT NULL, + device_type TEXT NOT NULL, + location TEXT, + status TEXT DEFAULT 'available', + notes TEXT, + purchase_date TEXT, + purchase_cost REAL +) +``` + +**Schema Differences:** +- `tablets` table: CLI missing `notes` column +- `users` table: CLI missing `email` and `phone` columns + +## Recommendations + +### Option 1: Update CLI to Match Web (Recommended) + +Update `minimal_app.py` to: +1. Add `notes` field to tablets +2. Add `email` and `phone` fields to users +3. Add edit functionality for non-loanable devices +4. Add user loans view +5. Add project management (optional) + +**Pros:** +- CLI has full feature parity with web +- Same database schema +- Users can use either interface + +**Cons:** +- More complex CLI +- May not be needed if web is primary interface + +### Option 2: Keep CLI Minimal (Current State) + +Leave CLI as-is for basic operations only. + +**Pros:** +- Simple, focused CLI +- Less code to maintain + +**Cons:** +- Database schema mismatch +- Users can't access all features via CLI +- Confusing for users who expect same functionality + +### Option 3: Create Separate Database (Not Recommended) + +Use different databases for CLI and web. + +**Pros:** +- Each can have optimized schema + +**Cons:** +- Data duplication +- Sync issues +- Confusing for users + +## Suggested Action Plan + +### Priority 1: Fix Database Schema Mismatch + +The CLI's `init_db()` creates tables without `notes`, `email`, and `phone` columns, but the web version expects them. This can cause issues. + +**Solution:** Update `minimal_app.py` `init_db()` to match `app.py` schema. + +### Priority 2: Add Missing Fields to CLI Functions + +1. Update `add_tablet()` to accept and store `notes` +2. Update `add_user()` to accept and store `email` and `phone` +3. Update `show_available_tablets()` and `show_non_loanable_devices()` to display all fields + +### Priority 3: Add Missing Features (Optional) + +1. Add `edit_non_loanable_device()` function +2. Add `show_user_loans()` function +3. Consider adding project management (lower priority) + +## Code Changes Required + +### 1. Update init_db() in minimal_app.py + +```python +def init_db(): + """Initialize database with required tables - MATCH WEB VERSION""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + # Create tablets table - ADD NOTES COLUMN + cursor.execute(''' + CREATE TABLE IF NOT EXISTS tablets ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + brand TEXT NOT NULL, + model TEXT NOT NULL, + serial_number TEXT UNIQUE NOT NULL, + status TEXT DEFAULT 'available', + notes TEXT + ) + ''') + + # Create users table - ADD EMAIL AND PHONE COLUMNS + cursor.execute(''' + CREATE TABLE IF NOT EXISTS users ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + name TEXT NOT NULL, + email TEXT, + phone TEXT, + identification TEXT UNIQUE + ) + ''') + + # loans and non_loanable_devices are already correct + # ... rest of init_db +``` + +### 2. Update add_tablet() Function + +```python +def add_tablet(brand, model, serial_number, notes=''): + """Add a new tablet to inventory""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + try: + cursor.execute(''' + INSERT INTO tablets (brand, model, serial_number, status, notes) + VALUES (?, ?, ?, 'available', ?) + ''', (brand, model, serial_number, notes)) + conn.commit() + print(f"✓ Added tablet: {brand} {model} ({serial_number})") + if notes: + print(f" Notes: {notes}") + except sqlite3.IntegrityError: + print(f"✗ Error: Serial number {serial_number} already exists") + finally: + conn.close() +``` + +### 3. Update add_user() Function + +```python +def add_user(name, identification, email='', phone=''): + """Add a new user""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + try: + cursor.execute(''' + INSERT INTO users (name, email, phone, identification) + VALUES (?, ?, ?, ?) + ''', (name, email, phone, identification)) + conn.commit() + print(f"✓ Added user: {name} ({identification})") + if email: + print(f" Email: {email}") + if phone: + print(f" Phone: {phone}") + except sqlite3.IntegrityError: + print(f"✗ Error: Identification {identification} already exists") + finally: + conn.close() +``` + +### 4. Update show_available_tablets() to Display Notes + +```python +def show_available_tablets(): + """Show available tablets""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + cursor.execute("SELECT id, brand, model, serial_number, notes FROM tablets WHERE status = 'available'") + tablets = cursor.fetchall() + + print("\n=== Available Tablets ===") + if tablets: + for tablet in tablets: + notes = f" | Notes: {tablet[4]}" if tablet[4] else "" + print(f"ID: {tablet[0]}, {tablet[1]} {tablet[2]} ({tablet[3]}){notes}") + else: + print("No available tablets") + + conn.close() +``` + +### 5. Add Missing Functions + +#### Edit Non-Loanable Device + +```python +def edit_non_loanable_device(device_id, **kwargs): + """Edit a non-loanable device""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + # Build update query dynamically + updates = [] + params = [] + for key, value in kwargs.items(): + if value is not None: + updates.append(f"{key} = ?") + params.append(value) + + if not updates: + print("✗ No fields to update") + conn.close() + return + + params.append(device_id) + query = f"UPDATE non_loanable_devices SET {', '.join(updates)} WHERE id = ?" + + cursor.execute(query, params) + conn.commit() + + if cursor.rowcount > 0: + print(f"✓ Non-loanable device {device_id} updated") + else: + print(f"✗ Error: Device {device_id} not found") + + conn.close() +``` + +#### Show User Loans + +```python +def show_user_loans(): + """Show loans grouped by user""" + conn = sqlite3.connect('tablets.db') + cursor = conn.cursor() + + # Get all users with their loans + cursor.execute(''' + SELECT u.id, u.name, u.identification, + GROUP_CONCAT(l.id, ",") as loan_ids, + COUNT(l.id) as loan_count + FROM users u + LEFT JOIN loans l ON u.id = l.user_id + GROUP BY u.id, u.name, u.identification + ''') + users = cursor.fetchall() + + print("\n=== User Loans ===") + if users: + for user in users: + print(f"\nUser: {user[1]} ({user[2]}) - {user[3]} loans") + + # Get loans for this user + cursor.execute(''' + SELECT l.id, t.brand, t.model, t.serial_number, l.loan_date, l.return_date, l.status + FROM loans l + JOIN tablets t ON l.tablet_id = t.id + WHERE l.user_id = ? + ORDER BY l.loan_date DESC + ''', (user[0],)) + loans = cursor.fetchall() + + for loan in loans: + return_date = loan[5] or 'Not returned' + print(f" Loan {loan[0]}: {loan[1]} {loan[2]} ({loan[3]})") + print(f" Loan Date: {loan[4]}, Return Date: {return_date}, Status: {loan[6]}") + else: + print("No users found") + + conn.close() +``` + +## Migration Strategy + +If you want to update the CLI to match the web version: + +1. **Backup current database** + ```bash + cp tablets.db tablets.db.backup + ``` + +2. **Update minimal_app.py** with the changes above + +3. **Run updated CLI** + ```bash + python3 minimal_app.py + ``` + +4. **Test all functionality** + +5. **If database schema changed**, you may need to: + - Drop and recreate tables (if starting fresh) + - Or add missing columns with ALTER TABLE (if preserving data) + +## Conclusion + +The CLI version is **lagging behind** the web version in terms of: +- Database schema (missing columns) +- Feature completeness (missing functions) +- Field support (missing email, phone, notes) + +**Recommendation:** Update the CLI to match the web version's database schema and functionality to ensure consistency and avoid confusion for users who may use both interfaces. From ab7b466ce47b7691b2e01a08c4ad08e7dbbdfbb7 Mon Sep 17 00:00:00 2001 From: ijuanes Date: Sat, 20 Jun 2026 08:03:58 +0100 Subject: [PATCH 19/39] deprecate: mark CLI as deprecated, recommend web interface - Add DEPRECATED notice to minimal_app.py docstring - Add deprecation warning at startup - Update README.md to mark CLI as deprecated - Remove CLI from Quick Start, promote web interface - Note limited functionality in CLI description The CLI (minimal_app.py) is now officially deprecated. Users should use the full-featured web interface (app.py) instead. --- README.md | 18 ++++++++++-------- minimal_app.py | 29 ++++++++++++++++++++++++++--- 2 files changed, 36 insertions(+), 11 deletions(-) diff --git a/README.md b/README.md index 83496e1..0ded615 100644 --- a/README.md +++ b/README.md @@ -15,11 +15,10 @@ A simple SQLite-based system for managing tablet lending and returns. ## Files -- `minimal_app.py` - Interactive command-line application (includes non-loanable device management) +- `minimal_app.py` - **DEPRECATED** - Interactive command-line application (limited functionality, use `app.py` instead) - `test_app.py` - Test script that demonstrates functionality - `tablets.db` - SQLite database (created automatically, includes non_loanable_devices table) -- `simple_app.py` - Web-based version (requires Flask, includes non-loanable device management) -- `app.py` - Alternative web version (requires Flask, includes non-loanable device management) +- `app.py` - **Recommended** - Full-featured web version (requires Flask, includes all features) ## Quick Start @@ -35,18 +34,21 @@ This will: - Demonstrate loan and return operations - Show the complete workflow -### 2. Run the interactive application +### 2. Run the web application (Recommended) ```bash -python3 minimal_app.py +python3 app.py ``` -This provides a menu-driven interface for: -- Adding tablets -- Adding users +This provides a full-featured web interface for: +- Adding tablets (with notes field) +- Adding users (with email and phone) - Loaning tablets - Returning tablets - Viewing inventory and loan status +- User loans view with search +- Non-loanable devices management +- Project management with markdown notes ### 3. Database Structure diff --git a/minimal_app.py b/minimal_app.py index 381a26d..1f7183c 100644 --- a/minimal_app.py +++ b/minimal_app.py @@ -1,7 +1,23 @@ #!/usr/bin/env python3 """ -Minimal Tablet Lending and Return Management System -Using only built-in Python modules +DEPRECATED - Tablet Lending and Return Management System (CLI) + +This CLI version is DEPRECATED. Please use the web interface instead. + +The web interface (app.py) provides full functionality including: +- Complete user management (name, email, phone, identification) +- Full tablet management with notes field +- User loans view with search +- Edit functionality for non-loanable devices +- Project management +- Responsive mobile interface + +To run the web interface: + python3 app.py + +Then open http://localhost:5000 in your browser. + +This CLI will be removed in a future version. """ import sqlite3 @@ -273,10 +289,17 @@ def delete_non_loanable_device(device_id): def main(): """Main menu""" + print("=" * 70) + print("DEPRECATION WARNING: This CLI is deprecated!") + print("Please use the web interface instead: python3 app.py") + print("=" * 70) + print() + init_db() - print("=== Tablet Lending and Return Management System ===") + print("=== Tablet Lending and Return Management System (DEPRECATED) ===") print("Using SQLite database: tablets.db") + print("NOTE: This CLI has limited functionality. Use web interface for full features.") while True: print("\nMenu:") From f08c823dc106685bedc8e63c28220766c0fe4909 Mon Sep 17 00:00:00 2001 From: ijuanes Date: Sat, 20 Jun 2026 08:05:05 +0100 Subject: [PATCH 20/39] docs: update CLI_VS_WEB.md with deprecation notice - Add deprecation notice at top of document - Mark CLI as deprecated throughout - Add migration path for existing CLI users - Document database compatibility notes - Recommend web interface for all operations --- docs/CLI_VS_WEB.md | 67 +++++++++++++++++++++++++++++++++++++++++++--- 1 file changed, 63 insertions(+), 4 deletions(-) diff --git a/docs/CLI_VS_WEB.md b/docs/CLI_VS_WEB.md index 5329e31..f9eb00c 100644 --- a/docs/CLI_VS_WEB.md +++ b/docs/CLI_VS_WEB.md @@ -1,12 +1,28 @@ # CLI vs Web Functionality Comparison +## âš ï¸ DEPRECATION NOTICE + +**The CLI version (`minimal_app.py`) is now DEPRECATED.** + +Please use the **web interface (`app.py`)** for all operations. The web interface provides: +- Complete feature set +- Full database schema support +- Responsive mobile interface +- Better user experience + +The CLI will be removed in a future version. This document is kept for historical reference. + +--- + ## Overview -This document compares the functionality between the **CLI version** (`minimal_app.py`) and the **Web version** (`app.py`) of the Tablet Management System. +This document compares the functionality between the **DEPRECATED CLI version** (`minimal_app.py`) and the **Web version** (`app.py`) of the Tablet Management System. ## Current State -### Web Version (app.py) - Complete Feature Set +### Web Version (app.py) - ✅ RECOMMENDED + +The web version is the **primary and recommended** interface for all users. | Feature | Status | Route | Template | |---------|--------|-------|---------| @@ -24,11 +40,15 @@ This document compares the functionality between the **CLI version** (`minimal_a | Delete Non-Loanable Device | ✅ | `/delete_non_loanable_device/` | N/A (redirects) | | Project Management | ✅ | `/project_management` | `project_management.html` | -### CLI Version (minimal_app.py) - Incomplete +### CLI Version (minimal_app.py) - ⌠DEPRECATED + +**This CLI is deprecated and should not be used for new development.** + +The CLI has limited functionality and does not support all database columns used by the web version. | Feature | Status | Function | |---------|--------|----------| -| Add Tablet | ✅ | `add_tablet()` | +| Add Tablet | âš ï¸ Partial | `add_tablet()` - Missing notes field | | Add User | âš ï¸ Partial | `add_user()` - Missing email/phone | | Loan Tablet | ✅ | `loan_tablet()` | | Return Tablet | ✅ | `return_tablet()` | @@ -43,6 +63,45 @@ This document compares the functionality between the **CLI version** (`minimal_a | **Edit Non-Loanable Device** | ⌠Missing | N/A | | **Project Management** | ⌠Missing | N/A | +## Migration Path + +### For Existing CLI Users + +**Stop using the CLI and switch to the web interface:** + +1. Run the web interface: + ```bash + python3 app.py + ``` + +2. Open your browser to: http://localhost:5000 + +3. The web interface uses the **same database** (`tablets.db`), so all your data is preserved. + +### Database Compatibility + +The CLI's database schema is **missing some columns** that the web version uses: +- `tablets.notes` - Added by web version +- `users.email` - Added by web version +- `users.phone` - Added by web version + +**If you've only used the CLI:** Your database is missing these columns. The web interface will still work, but won't be able to store notes, email, or phone until the columns are added. + +**To fix the database schema:** +```bash +# Run the web interface - it will add missing columns automatically +python3 app.py +``` + +The web version's `init_db()` will add any missing columns when it runs. + +## Recommendation + +**Use `app.py` (web interface) for all operations.** + +The CLI (`minimal_app.py`) is deprecated and will be removed in a future version. All development and maintenance efforts should focus on the web interface. + + ## Missing Features in CLI ### 1. User Management From c9f3382c7cfe24393dee3a3949b04e41416c3f4d Mon Sep 17 00:00:00 2001 From: ijuanes Date: Sat, 20 Jun 2026 08:38:42 +0100 Subject: [PATCH 21/39] feat(ui): implement HTMX + Tailwind frontend revamp - Add Tailwind CSS via CDN for modern styling - Add HTMX for AJAX functionality without full page reloads - Revamp user_loans interface with: - Real-time search (debounced 500ms) - Status filtering (all users, with loans, no loans) - Pagination (20 users per page) - Responsive table design - Clean, modern UI with Tailwind classes - Create user_loans_detail.html for individual user loan history - Update index.html with Tailwind styling - Update base.html with Tailwind + HTMX setup - Add components/user_loans_results.html for HTMX partial updates - Update app.py user_loans route to support search, filter, pagination - Add user_loans_detail route for detailed user view This addresses the issues: - Navigation overflow (fixed with responsive Tailwind classes) - Basic look (modern, professional UI) - User loans UX (fast search, filtering, pagination for 500+ users) --- app.py | 170 ++++++-- templates/base.html | 431 ++++++------------- templates/components/user_loans_results.html | 206 +++++++++ templates/index.html | 180 ++++++-- templates/user_loans.html | 373 +++++----------- templates/user_loans_detail.html | 126 ++++++ 6 files changed, 837 insertions(+), 649 deletions(-) create mode 100644 templates/components/user_loans_results.html create mode 100644 templates/user_loans_detail.html diff --git a/app.py b/app.py index 7dfba4d..e44487b 100644 --- a/app.py +++ b/app.py @@ -287,52 +287,154 @@ def save_notes(): @app.route('/user_loans') def user_loans(): """ - Show all loans grouped by user. - This demonstrates the one-to-many relationship: one user can loan multiple tablets. + Show all users with their loan information. + Supports search, filtering, and pagination via HTMX. + """ + from flask import request + + # Get query parameters + page = request.args.get('page', 1, type=int) + search = request.args.get('search', '').strip() + status_filter = request.args.get('status', '') + + # Pagination settings + per_page = 20 + offset = (page - 1) * per_page + + with get_db() as conn: + cursor = conn.cursor() + + # Build base query for users with loan counts + query = """ + SELECT + u.id, u.name, u.identification, u.email, u.phone, + COUNT(l.id) as loan_count, + MAX(l.loan_date) as last_loan_date + FROM users u + LEFT JOIN loans l ON u.id = l.user_id AND l.status = 'active' + """ + + conditions = [] + params = [] + + # Add search filter + if search: + conditions.append("(u.name LIKE ? OR u.identification LIKE ? OR u.email LIKE ?)") + search_param = f"%{search}%" + params.extend([search_param, search_param, search_param]) + + # Add status filter + if status_filter == 'with_loans': + conditions.append("COUNT(l.id) > 0") + elif status_filter == 'no_loans': + conditions.append("COUNT(l.id) = 0") + + # Combine conditions + if conditions: + query += " WHERE " + " AND ".join(conditions) + + # Group by and order + query += " GROUP BY u.id, u.name, u.identification, u.email, u.phone" + query += " ORDER BY u.name COLLATE NOCASE" + + # Get total count for pagination + count_query = f"SELECT COUNT(*) FROM ({query})" + cursor.execute(count_query, params) + total_users = cursor.fetchone()[0] + total_pages = (total_users + per_page - 1) // per_page + + # Add pagination to query + query += f" LIMIT {per_page} OFFSET {offset}" + + # Execute main query + cursor.execute(query, params) + users = cursor.fetchall() + + # Convert to list of dicts for template + users_list = [] + for user in users: + users_list.append({ + 'id': user[0], + 'name': user[1], + 'identification': user[2], + 'email': user[3], + 'phone': user[4], + 'loan_count': user[5], + 'last_loan_date': user[6] + }) + + # Check if this is an HTMX request + is_htmx = request.headers.get('HX-Request') == 'true' + + if is_htmx: + # Return just the results partial for HTMX swap + return render_template('components/user_loans_results.html', + users=users_list, + page=page, + total_pages=total_pages, + total_users=total_users, + search=search, + status=status_filter, + per_page=per_page) + else: + # Full page render + return render_template('user_loans.html', + users=users_list, + page=page, + total_pages=total_pages, + total_users=total_users, + search=search, + status=status_filter, + per_page=per_page) + + +@app.route('/user_loans/') +def user_loans_detail(user_id): + """ + Show detailed loan history for a specific user. """ with get_db() as conn: cursor = conn.cursor() - # Get all users - cursor.execute("SELECT * FROM users") - users = cursor.fetchall() + # Get user info + cursor.execute("SELECT * FROM users WHERE id = ?", (user_id,)) + user = cursor.fetchone() - # Get all loans with tablet and user details + if not user: + flash('User not found', 'error') + return redirect(url_for('user_loans')) + + # Get all loans for this user cursor.execute(''' - SELECT l.id, l.tablet_id, l.user_id, l.loan_date, l.return_date, l.status, - t.brand, t.model, t.serial_number, - u.name, u.identification + SELECT l.id, l.tablet_id, l.loan_date, l.return_date, l.status, + t.brand, t.model, t.serial_number, t.status as tablet_status FROM loans l JOIN tablets t ON l.tablet_id = t.id - JOIN users u ON l.user_id = u.id - ORDER BY u.name, l.loan_date DESC - ''') + WHERE l.user_id = ? + ORDER BY l.loan_date DESC + ''', (user_id,)) loans = cursor.fetchall() - # Group loans by user - user_loans_map = {} - for loan in loans: - user_id = loan['user_id'] - if user_id not in user_loans_map: - user_loans_map[user_id] = { - 'user': None, - 'loans': [] - } - user_loans_map[user_id]['loans'].append(loan) + # Get active loans count + cursor.execute(''' + SELECT COUNT(*) FROM loans + WHERE user_id = ? AND status = 'active' + ''', (user_id,)) + active_count = cursor.fetchone()[0] - # Attach user info - for user in users: - if user['id'] in user_loans_map: - user_loans_map[user['id']]['user'] = user - - # Filter out users with no loans (optional - keep all users) - # Convert to list for template - user_loans_list = [] - for user in users: - user_data = user_loans_map.get(user['id'], {'user': user, 'loans': []}) - user_loans_list.append(user_data) + # Get returned loans count + cursor.execute(''' + SELECT COUNT(*) FROM loans + WHERE user_id = ? AND status = 'returned' + ''', (user_id,)) + returned_count = cursor.fetchone()[0] - return render_template('user_loans.html', users_with_loans=user_loans_list) + return render_template('user_loans_detail.html', + user=user, + loans=loans, + active_count=active_count, + returned_count=returned_count) + @app.route('/non_loanable_devices') diff --git a/templates/base.html b/templates/base.html index 3382ed4..a35f0b3 100644 --- a/templates/base.html +++ b/templates/base.html @@ -4,328 +4,137 @@ Tablet Management System + + + + + + + + + + + - -
-

Tablet Management System

+ +
+ +
+

+ Tablet Management System +

+ + + {% with messages = get_flashed_messages(with_categories=true) %} + {% if messages %} +
+ {% for category, message in messages %} +
+ {{ message }} +
+ {% endfor %} +
+ {% endif %} + {% endwith %} + + + +
- {% with messages = get_flashed_messages(with_categories=true) %} - {% if messages %} - {% for category, message in messages %} -
{{ message }}
- {% endfor %} - {% endif %} - {% endwith %} - -
- Home - Add Tablet - Add User - Loan Tablet - Loan History - User Loans - Non-Loanable Devices - Project Management -
- - {% block content %}{% endblock %} + +
+ {% block content %}{% endblock %} +
diff --git a/templates/components/user_loans_results.html b/templates/components/user_loans_results.html new file mode 100644 index 0000000..ffb87a3 --- /dev/null +++ b/templates/components/user_loans_results.html @@ -0,0 +1,206 @@ +{# templates/components/user_loans_results.html #} + +{%- if users %} + {# Results Table Card #} +
+ + + + + + + + + + + + {%- for user in users %} + + + + + + + + {%- endfor %} + +
+ User + + Identification + + Active Loans + + Last Loan Date + + Actions +
+
{{ user.name }}
+ 		+ {{ user.identification or 'N/A' }} + + + {{ user.loan_count or 0 }} + + + {{ user.last_loan_date or 'Never' }} + + + View Details + +
+
+ + {# Pagination #} + {%- if total_pages > 1 %} + + {%- endif %} + +{%- else %} + {# No Results #} +
+ + + +

No users found

+

+ {% if search %} + No users match your search for "{{ search }}" + {% elif status == 'with_loans' %} + No users have active loans + {% elif status == 'no_loans' %} + All users have at least one active loan + {% else %} + There are no users in the system yet + {% endif %} +

+ + Clear Filters + +
+{%- endif %} diff --git a/templates/index.html b/templates/index.html index f946ad8..fd904ef 100644 --- a/templates/index.html +++ b/templates/index.html @@ -1,67 +1,167 @@ {% extends "base.html" %} {% block content %} -
-

Available Tablets

+
+ {# Available Tablets Section #} +
+
+

+ + + + Available Tablets + + {{ available_tablets|length }} + +

+
+ {% if available_tablets %} -
- - +
+
+ - - - - + + + + + - + {% for tablet in available_tablets %} - - - - - - + + + + + + + {% endfor %}
BrandModelSerial NumberNotes + Brand + + Model + + Serial Number + + Notes + + Actions +
{{ tablet.brand }}{{ tablet.model }}{{ tablet.serial_number }}{{ tablet.notes or '-' }}
+
{{ tablet.brand }}
+ 		+ {{ tablet.model }} + + {{ tablet.serial_number }} + + {{ tablet.notes or '-' }} + + + + + + Loan + +
{% else %} -

No available tablets.

+
+ + + +

No available tablets

+ + Add Tablet + +
{% endif %}
- -
-

Active Loans

+ + {# Active Loans Section #} +
+
+

+ + + + Active Loans + + {{ active_loans|length }} + +

+
+ {% if active_loans %} -
- - +
+
+ - - - - - + + + + + - + {% for loan in active_loans %} - - - - - - - + + + + + + + {% endfor %}
TabletSerial NumberBorrowerLoan DateActions + Tablet + + Serial Number + + Borrower + + Loan Date + + Actions +
{{ loan.brand }} {{ loan.model }}{{ loan.serial_number }}{{ loan.name }}{{ loan.loan_date }} - Return -
+
{{ loan.brand }} {{ loan.model }}
+ 		+ {{ loan.serial_number }} + +
{{ loan.name }}
+
{{ loan.identification }}
+ 		+ {{ loan.loan_date[:10] if loan.loan_date else 'N/A' }} + {{ loan.loan_date[11:16] if loan.loan_date else '' }} + + + + + + Return + +
{% else %} -

No active loans.

+
+ + + +

No active loans

+
{% endif %}
-{% endblock %} \ No newline at end of file +
+{% endblock %} diff --git a/templates/user_loans.html b/templates/user_loans.html index 6fddf9c..325eb39 100644 --- a/templates/user_loans.html +++ b/templates/user_loans.html @@ -1,279 +1,124 @@ {% extends "base.html" %} {% block content %} -

User Loans

-

- Relationship: One user can loan multiple tablets (one-to-many). - This page demonstrates the many-to-many relationship between users and tablets via the loans table. -

- - -
- - +
+ +
+

User Loans

+
+ {{ total_users }} users +
-
- {% for user_data in users_with_loans %} - {% set user = user_data.user %} - {% set loans = user_data.loans %} - {% set active_loans = loans|selectattr('status', 'equalto', 'active')|list %} - {% set returned_loans = loans|selectattr('status', 'equalto', 'returned')|list %} + +
+
-
-
-

{{ user.name }} ({{ user.identification }})

- - {{ active_loans|length }} active, {{ returned_loans|length }} past - + +
+ +
+ +
+ + + + +
- {% if active_loans %} -
-

Current Loans

-
- - - - - - - - - - - {% for loan in active_loans %} - - - - - - - {% endfor %} - -
TabletSerial NumberLoan DateStatus
{{ loan.brand }} {{ loan.model }}{{ loan.serial_number }}{{ loan.loan_date }} - - {{ loan.status }} - -
-
-
- {% endif %} - - {% if returned_loans %} -
-

- -

- -
- {% endif %} - - {% if not active_loans and not returned_loans %} -

No loans recorded for this user.

- {% endif %} + +
+ + +
- {% endfor %} - - {% if users_with_loans|length == 0 %} -

No users found. Add users and loan tablets to see data here.

- {% endif %} + + + +
+ + + + + +
+ {% include 'components/user_loans_results.html' %} +
+
- + } +}); - + } +}); + {% endblock %} diff --git a/templates/user_loans_detail.html b/templates/user_loans_detail.html new file mode 100644 index 0000000..003b011 --- /dev/null +++ b/templates/user_loans_detail.html @@ -0,0 +1,126 @@ +{% extends "base.html" %} + +{% block content %} +
+ +
+ + + + + Back to All Users + +
+ + +
+
+
+
+ {{ user.name[:1].upper() }} +
+
+
+

{{ user.name }}

+

+ ID: {{ user.id }} | Identification: {{ user.identification or 'N/A' }} +

+
+
+ + {{ active_count }} Active Loans +
+
+ + {{ returned_count }} Returned +
+
+
+
+ {% if user.email %} + + Email + + {% endif %} + {% if user.phone %} + + Call + + {% endif %} +
+
+
+ + +
+
+

Loan History

+
+ + {% if loans %} +
+ + + + + + + + + + + {% for loan in loans %} + + + + + + + {% endfor %} + +
+ Tablet + + Loan Date + + Return Date + + Status +
+
{{ loan.brand }} {{ loan.model }}
+
{{ loan.serial_number }}
+ 		+ {{ loan.loan_date[:10] if loan.loan_date else 'N/A' }} + {{ loan.loan_date[11:16] if loan.loan_date else '' }} + + {% if loan.return_date %} + {{ loan.return_date[:10] }} {{ loan.return_date[11:16] }} + {% else %} + Not returned + {% endif %} + + + {{ loan.status|title }} + +
+
+ {% else %} +
+ + + +

No loan history for this user

+
+ {% endif %} +
+
+{% endblock %} From f5bbb93d59b125d12b01664da666c2f93fe443f0 Mon Sep 17 00:00:00 2001 From: ijuanes Date: Sat, 20 Jun 2026 08:53:55 +0100 Subject: [PATCH 22/39] fix(ui): fix user_loans SQL query with HAVING clause for status filter - Fix COUNT() misuse in SQLite subquery - Use HAVING clause for aggregate function filtering (with_loans, no_loans) - Properly count distinct users for pagination - Maintain all search and pagination functionality --- app.py | 32 +++++++++++++++++++++----------- 1 file changed, 21 insertions(+), 11 deletions(-) diff --git a/app.py b/app.py index e44487b..fc96add 100644 --- a/app.py +++ b/app.py @@ -316,6 +316,7 @@ def user_loans(): conditions = [] params = [] + having_conditions = [] # Add search filter if search: @@ -323,31 +324,38 @@ def user_loans(): search_param = f"%{search}%" params.extend([search_param, search_param, search_param]) - # Add status filter + # Add status filter (use HAVING for aggregate functions) if status_filter == 'with_loans': - conditions.append("COUNT(l.id) > 0") + having_conditions.append("COUNT(l.id) > 0") elif status_filter == 'no_loans': - conditions.append("COUNT(l.id) = 0") + having_conditions.append("COUNT(l.id) = 0") - # Combine conditions + # Combine conditions for WHERE clause + where_clause = "" if conditions: - query += " WHERE " + " AND ".join(conditions) + where_clause = " WHERE " + " AND ".join(conditions) + + # Combine HAVING conditions + having_clause = "" + if having_conditions: + having_clause = " HAVING " + " AND ".join(having_conditions) # Group by and order - query += " GROUP BY u.id, u.name, u.identification, u.email, u.phone" - query += " ORDER BY u.name COLLATE NOCASE" + group_by = " GROUP BY u.id, u.name, u.identification, u.email, u.phone" + order_by = " ORDER BY u.name COLLATE NOCASE" # Get total count for pagination - count_query = f"SELECT COUNT(*) FROM ({query})" + # We need to count distinct users matching the criteria + count_query = f"SELECT COUNT(DISTINCT u.id) FROM users u LEFT JOIN loans l ON u.id = l.user_id AND l.status = 'active'{where_clause}{having_clause}" cursor.execute(count_query, params) total_users = cursor.fetchone()[0] total_pages = (total_users + per_page - 1) // per_page - # Add pagination to query - query += f" LIMIT {per_page} OFFSET {offset}" + # Build final query with pagination + final_query = query + where_clause + group_by + having_clause + order_by + f" LIMIT {per_page} OFFSET {offset}" # Execute main query - cursor.execute(query, params) + cursor.execute(final_query, params) users = cursor.fetchall() # Convert to list of dicts for template @@ -388,6 +396,8 @@ def user_loans(): per_page=per_page) + + @app.route('/user_loans/') def user_loans_detail(user_id): """ From db7e9591e1df49aca4ff381467ea06f07363673f Mon Sep 17 00:00:00 2001 From: ijuanes Date: Sat, 20 Jun 2026 08:55:18 +0100 Subject: [PATCH 23/39] fix(ui): handle None result from COUNT query when no users match criteria - Fix TypeError when cursor.fetchone() returns None - Handle empty result sets gracefully - Ensure pagination works with zero results --- app.py | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/app.py b/app.py index fc96add..0f32968 100644 --- a/app.py +++ b/app.py @@ -348,7 +348,8 @@ def user_loans(): # We need to count distinct users matching the criteria count_query = f"SELECT COUNT(DISTINCT u.id) FROM users u LEFT JOIN loans l ON u.id = l.user_id AND l.status = 'active'{where_clause}{having_clause}" cursor.execute(count_query, params) - total_users = cursor.fetchone()[0] + result = cursor.fetchone() + total_users = result[0] if result else 0 total_pages = (total_users + per_page - 1) // per_page # Build final query with pagination From 34dd3ca9374625e6b0e93bb4e8f6c90ede05533b Mon Sep 17 00:00:00 2001 From: ijuanes Date: Sat, 20 Jun 2026 09:58:13 +0100 Subject: [PATCH 24/39] feat(i18n): add Spanish localization support with Flask-Babel - Add Flask-Babel for internationalization - Configure app for Spanish (default) and English - Add language switcher in navigation - Wrap all UI text in templates with gettext() - Create translation directory structure - Add complete Spanish translations (58 strings) - Add English translations (template) - Compile .po to .mo files - Add extract_translations.py script for future updates - Add compile_translations.py script Spanish is now the default language, with English available via ?lang=en Translated strings include: - Navigation (Home, Add Tablet, Add User, etc.) - User Loans interface (Search, Filter, Status, etc.) - Table headers (User, Tablet, Serial Number, etc.) - Buttons (Loan, Return, Search, etc.) - Messages (No users found, No active loans, etc.) - All UI text across all templates --- app.py | 36 +++ compile_translations.py | 24 ++ extract_translations.py | 226 +++++++++++++++++++ templates/base.html | 140 ++++++++---- templates/components/user_loans_results.html | 42 ++-- templates/index.html | 36 +-- templates/user_loans.html | 20 +- templates/user_loans_detail.html | 28 +-- translations/en/LC_MESSAGES/messages.mo | Bin 0 -> 283 bytes translations/en/LC_MESSAGES/messages.po | 191 ++++++++++++++++ translations/es/LC_MESSAGES/messages.mo | Bin 0 -> 3472 bytes translations/es/LC_MESSAGES/messages.po | 192 ++++++++++++++++ translations/messages.pot | 195 ++++++++++++++++ 13 files changed, 1020 insertions(+), 110 deletions(-) create mode 100644 compile_translations.py create mode 100644 extract_translations.py create mode 100644 translations/en/LC_MESSAGES/messages.mo create mode 100644 translations/en/LC_MESSAGES/messages.po create mode 100644 translations/es/LC_MESSAGES/messages.mo create mode 100644 translations/es/LC_MESSAGES/messages.po create mode 100644 translations/messages.pot diff --git a/app.py b/app.py index 0f32968..961a913 100644 --- a/app.py +++ b/app.py @@ -8,10 +8,46 @@ from flask import Flask, render_template, request, redirect, url_for, flash import sqlite3 import os from datetime import datetime +from flask_babel import Babel, gettext, lazy_gettext app = Flask(__name__) app.secret_key = 'your_secret_key_here' +# Babel configuration +babel = Babel(app) + +# Configure supported languages +app.config['BABEL_DEFAULT_LOCALE'] = 'es' +app.config['LANGUAGES'] = { + 'en': 'English', + 'es': 'Español' +} + +# Configure translation directory +app.config['BABEL_TRANSLATION_DIRECTORIES'] = 'translations' + +@babel.localeselector +def get_locale(): + # Try to get language from URL parameter + lang = request.args.get('lang') + if lang and lang in app.config['LANGUAGES']: + return lang + # Try to get from session + if hasattr(request, 'session') and 'language' in request.session: + return request.session['language'] + # Try to get from browser preferences + return request.accept_languages.best_match(app.config['LANGUAGES'].keys()) + +# Context processor to make language and config available in templates +@app.context_processor +def inject_global_variables(): + from flask import request + lang = get_locale() + return { + 'language': lang, + 'config': app.config + } + # Database setup DATABASE = 'tablets.db' diff --git a/compile_translations.py b/compile_translations.py new file mode 100644 index 0000000..4f165ba --- /dev/null +++ b/compile_translations.py @@ -0,0 +1,24 @@ +#!/usr/bin/env python3 +""" +Compile .po files to .mo files for Flask-Babel +""" +import os +from pathlib import Path + +def compile_translations(): + translations_dir = Path('translations') + + for lang_dir in translations_dir.iterdir(): + if lang_dir.is_dir(): + lc_messages_dir = lang_dir / 'LC_MESSAGES' + if lc_messages_dir.exists(): + for po_file in lc_messages_dir.glob('*.po'): + mo_file = lc_messages_dir / f"{po_file.stem}.mo" + print(f"Compiling {po_file} -> {mo_file}") + # Use msgfmt to compile + os.system(f"msgfmt -o {mo_file} {po_file}") + + print("✅ All translations compiled!") + +if __name__ == '__main__': + compile_translations() diff --git a/extract_translations.py b/extract_translations.py new file mode 100644 index 0000000..6367e78 --- /dev/null +++ b/extract_translations.py @@ -0,0 +1,226 @@ +#!/usr/bin/env python3 +""" +Extract strings for translation and create Spanish .po files +""" +import os +import re +from pathlib import Path + +# Directories +TEMPLATES_DIR = Path('templates') +TRANSLATIONS_DIR = Path('translations') + +# Find all template files +def find_template_files(): + template_files = [] + for root, dirs, files in os.walk(TEMPLATES_DIR): + for file in files: + if file.endswith('.html'): + template_files.append(Path(root) / file) + return template_files + +# Extract strings from templates +def extract_strings_from_file(filepath): + strings = set() + with open(filepath, 'r', encoding='utf-8') as f: + content = f.read() + + # Find all _('...') and gettext('...') calls + pattern = r"[\"'](?:_|gettext)\([\"']([^\"']+)[\"']\)" + matches = re.findall(r"\{\{\s*_\('([^']+)'\)\s*\}\}", content) + matches += re.findall(r"\{\{\s*gettext\('([^']+)'\)\s*\}\}", content) + + return matches + +# Create .pot file +def create_pot_file(strings): + pot_content = """msgid "" +msgstr "" +"Project-Id-Version: Tablet Management System\n" +"POT-Creation-Date: 2026-06-20\n" +"PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n" +"Last-Translator: \n" +"Language-Team: \n" +"Language: en\n" +"MIME-Version: 1.0\n" +"Content-Type: text/plain; charset=UTF-8\n" +"Content-Transfer-Encoding: 8bit\n" + +""" + + for string in sorted(strings): + pot_content += f'msgid "{string}"\n' + pot_content += 'msgstr ""\n\n' + + return pot_content + +# Create Spanish .po file +def create_es_po_file(strings): + # Spanish translations + translations = { + # Navigation + 'Tablet Management System': 'Sistema de Gestión de Tablets', + 'Home': 'Inicio', + 'Add Tablet': 'Añadir Tablet', + 'Add User': 'Añadir Usuario', + 'Loan Tablet': 'Prestar Tablet', + 'History': 'Historial', + 'User Loans': 'Préstamos por Usuario', + 'Non-Loanable Devices': 'Dispositivos No Prestables', + 'Project Management': 'Gestión de Proyectos', + + # Language + 'Language': 'Idioma', + 'English': 'Inglés', + 'Español': 'Español', + + # Common + 'Search': 'Buscar', + 'Filter': 'Filtrar', + 'Status': 'Estado', + 'Actions': 'Acciones', + 'Details': 'Detalles', + 'View': 'Ver', + 'All': 'Todos', + 'Active': 'Activo', + 'Inactive': 'Inactivo', + 'Available': 'Disponible', + 'Returned': 'Devuelto', + 'Never': 'Nunca', + 'N/A': 'N/D', + 'Yes': 'Sí', + 'No': 'No', + 'Showing': 'Mostrando', + 'to': 'a', + 'of': 'de', + 'Previous': 'Anterior', + 'Next': 'Siguiente', + 'Page': 'Página', + + # User Loans + 'User Loans': 'Préstamos por Usuario', + 'Search Users': 'Buscar Usuarios', + 'Loan Status': 'Estado de Préstamo', + 'All Users': 'Todos los Usuarios', + 'With Active Loans': 'Con Préstamos Activos', + 'No Active Loans': 'Sin Préstamos Activos', + 'Search by name or identification...': 'Buscar por nombre o identificación...', + 'users': 'usuarios', + 'No users found': 'No se encontraron usuarios', + 'No users match your search for': 'Ningún usuario coincide con tu búsqueda de', + 'Clear Filters': 'Limpiar Filtros', + + # Table Headers + 'User': 'Usuario', + 'Identification': 'Identificación', + 'Active Loans': 'Préstamos Activos', + 'Last Loan Date': 'Fecha del Último Préstamo', + 'Tablet': 'Tablet', + 'Model': 'Modelo', + 'Serial Number': 'Número de Serie', + 'Notes': 'Notas', + 'Borrower': 'Prestatario', + 'Loan Date': 'Fecha de Préstamo', + 'Return Date': 'Fecha de Devolución', + 'Not returned': 'No devuelto', + + # Buttons + 'Loan': 'Prestar', + 'Return': 'Devolver', + 'Add': 'Añadir', + 'Save': 'Guardar', + 'Cancel': 'Cancelar', + 'Delete': 'Eliminar', + 'Edit': 'Editar', + 'Update': 'Actualizar', + + # Messages + 'Tablet Management System - Internal Tool': 'Sistema de Gestión de Tablets - Herramienta Interna', + 'No available tablets': 'No hay tablets disponibles', + 'No active loans': 'No hay préstamos activos', + 'No loan history for this user': 'Este usuario no tiene historial de préstamos', + + # Forms + 'Brand': 'Marca', + 'Model': 'Modelo', + 'Serial Number': 'Número de Serie', + 'Name': 'Nombre', + 'Email': 'Correo Electrónico', + 'Phone': 'Teléfono', + 'Identification': 'Identificación', + 'Date': 'Fecha', + 'Notes': 'Notas', + 'Required field': 'Campo obligatorio', + + # Status + 'Active Loans': 'Préstamos Activos', + 'Returned': 'Devueltos', + } + + po_content = """msgid "" +msgstr "" +"Project-Id-Version: Tablet Management System\n" +"POT-Creation-Date: 2026-06-20\n" +"PO-Revision-Date: 2026-06-20\n" +"Last-Translator: Auto-generated\n" +"Language-Team: \n" +"Language: es\n" +"MIME-Version: 1.0\n" +"Content-Type: text/plain; charset=UTF-8\n" +"Content-Transfer-Encoding: 8bit\n" +"Plural-Forms: nplurals=2; plural=(n != 1);\n" + +""" + + for string in sorted(strings): + msgid = string + msgstr = translations.get(string, '') + po_content += f'msgid "{msgid}"\n' + po_content += f'msgstr "{msgstr}"\n\n' + + return po_content + +# Main +def main(): + print("Extracting strings for translation...") + + # Find all template files + template_files = find_template_files() + print(f"Found {len(template_files)} template files") + + # Extract all strings + all_strings = set() + for filepath in template_files: + strings = extract_strings_from_file(filepath) + all_strings.update(strings) + + print(f"Found {len(all_strings)} unique strings") + + # Create .pot file + pot_content = create_pot_file(all_strings) + pot_path = TRANSLATIONS_DIR / 'messages.pot' + with open(pot_path, 'w', encoding='utf-8') as f: + f.write(pot_content) + print(f"Created {pot_path}") + + # Create Spanish .po file + es_po_content = create_es_po_file(all_strings) + es_dir = TRANSLATIONS_DIR / 'es' / 'LC_MESSAGES' + es_dir.mkdir(parents=True, exist_ok=True) + es_po_path = es_dir / 'messages.po' + with open(es_po_path, 'w', encoding='utf-8') as f: + f.write(es_po_content) + print(f"Created {es_po_path}") + + # Create English .po file + en_dir = TRANSLATIONS_DIR / 'en' / 'LC_MESSAGES' + en_dir.mkdir(parents=True, exist_ok=True) + en_po_path = en_dir / 'messages.po' + with open(en_po_path, 'w', encoding='utf-8') as f: + f.write(create_pot_file(all_strings)) + print(f"Created {en_po_path}") + + print("\n✅ Translation files created!") + +if __name__ == '__main__': + main() diff --git a/templates/base.html b/templates/base.html index a35f0b3..d62041d 100644 --- a/templates/base.html +++ b/templates/base.html @@ -1,9 +1,9 @@ - + - Tablet Management System + {{ _('Tablet Management System') }} @@ -48,16 +48,16 @@ extend: { colors: { primary: { - 50: '#f0fdf4', - 100: '#dcfce7', - 200: '#bbf7d0', - 300: '#86efac', - 400: '#4ade80', - 500: '#22c55e', - 600: '#16a34a', - 700: '#15803d', - 800: '#166534', - 900: '#14532d', + 50: '#ecfdf5', + 100: '#d1fae5', + 200: '#a7f3d0', + 300: '#6ee7b7', + 400: '#34d399', + 500: '#10b981', + 600: '#059669', + 700: '#047857', + 800: '#065f46', + 900: '#064e3b', } } } @@ -65,25 +65,68 @@ } - -
+ + + Skip to main content + + +
-
-

- Tablet Management System -

- +
+
+
+ +
+ + + +

{{ _('Tablet Management System') }}

+
+ + +
+ {{ _('Language') }}: + {% for lang_code, lang_name in config['LANGUAGES'].items() %} + + {{ lang_name }} + + {% endfor %} +
+
+
+
+ + +
{% with messages = get_flashed_messages(with_categories=true) %} {% if messages %}
{% for category, message in messages %} -
- {{ message }} +
+
+ {% if category == 'success' %} + + + + {% elif category == 'error' %} + + + + {% endif %} + {{ _(message) }} +
{% endfor %}
@@ -91,50 +134,55 @@ {% endwith %} -
- - -
+ + {% block content %}{% endblock %}
+ + +
+
+

{{ _('Tablet Management System - Internal Tool') }}

+
+
diff --git a/templates/components/user_loans_results.html b/templates/components/user_loans_results.html index ffb87a3..fbdc7ce 100644 --- a/templates/components/user_loans_results.html +++ b/templates/components/user_loans_results.html @@ -7,19 +7,19 @@ - User + {{ _('User') }} - Identification + {{ _('Identification') }} - Active Loans + {{ _('Active Loans') }} - Last Loan Date + {{ _('Last Loan Date') }} - Actions + {{ _('Actions') }} @@ -30,7 +30,7 @@
{{ user.name }}
- {{ user.identification or 'N/A' }} + {{ user.identification or _('N/A') }} - {{ user.last_loan_date or 'Never' }} + {{ user.last_loan_date or _('Never') }} - View Details + {{ _('View Details') }} @@ -60,9 +60,9 @@
@@ -186,21 +186,21 @@ -

No users found

+

{{ _('No users found') }}

{% if search %} - No users match your search for "{{ search }}" + {{ _('No users match your search for') }} "{{ search }}" {% elif status == 'with_loans' %} - No users have active loans + {{ _('No users have active loans') }} {% elif status == 'no_loans' %} - All users have at least one active loan + {{ _('All users have at least one active loan') }} {% else %} - There are no users in the system yet + {{ _('There are no users in the system yet') }} {% endif %}

- Clear Filters + {{ _('Clear Filters') }}
{%- endif %} diff --git a/templates/index.html b/templates/index.html index fd904ef..5f0cc43 100644 --- a/templates/index.html +++ b/templates/index.html @@ -10,7 +10,7 @@ - Available Tablets + {{ _('Available Tablets') }} {{ available_tablets|length }} @@ -23,19 +23,19 @@ - Brand + {{ _('Brand') }} - Model + {{ _('Model') }} - Serial Number + {{ _('Serial Number') }} - Notes + {{ _('Notes') }} - Actions + {{ _('Actions') }} @@ -61,7 +61,7 @@ - Loan + {{ _('Loan') }} @@ -75,10 +75,10 @@ -

No available tablets

+

{{ _('No available tablets') }}

- Add Tablet + {{ _('Add Tablet') }}
{% endif %} @@ -92,7 +92,7 @@ - Active Loans + {{ _('Active Loans') }} {{ active_loans|length }} @@ -105,19 +105,19 @@ - Tablet + {{ _('Tablet') }} - Serial Number + {{ _('Serial Number') }} - Borrower + {{ _('Borrower') }} - Loan Date + {{ _('Loan Date') }} - Actions + {{ _('Actions') }} @@ -135,7 +135,7 @@
{{ loan.identification }}
- {{ loan.loan_date[:10] if loan.loan_date else 'N/A' }} + {{ loan.loan_date[:10] if loan.loan_date else _('N/A') }} {{ loan.loan_date[11:16] if loan.loan_date else '' }} @@ -145,7 +145,7 @@ - Return + {{ _('Return') }} @@ -159,7 +159,7 @@ -

No active loans

+

{{ _('No active loans') }}

{% endif %}
diff --git a/templates/user_loans.html b/templates/user_loans.html index 325eb39..a4aad1d 100644 --- a/templates/user_loans.html +++ b/templates/user_loans.html @@ -4,9 +4,9 @@
-

User Loans

+

{{ _('User Loans') }}

- {{ total_users }} users + {{ total_users }} {{ _('users') }}
@@ -24,7 +24,7 @@
@@ -46,16 +46,16 @@
@@ -67,7 +67,7 @@ - Search + {{ _('Search') }}
@@ -83,7 +83,6 @@ - + } + + + {% endblock %} diff --git a/templates/student_detail.html b/templates/student_detail.html new file mode 100644 index 0000000..f7b6706 --- /dev/null +++ b/templates/student_detail.html @@ -0,0 +1,183 @@ +{% extends "base.html" %} + +{% block title %}{{ gettext('Student Details') }} - {{ student.full_name }}{% endblock %} + +{% block content %} +
+
+
+ + +
+

{{ student.full_name }}

+
+ + {{ gettext('Edit') }} + + + {{ gettext('Delete') }} + +
+
+ +
+ +
+
+
+
{{ gettext('Student Information') }}
+
+
+
+
{{ gettext('ID') }}:
+
{{ student.id }}
+ +
{{ gettext('CIAL Code') }}:
+
{{ student.cial_code }}
+ +
{{ gettext('NIF/NIE/Passport') }}:
+
{{ student.nif_nie_passport or '-' }}
+ +
{{ gettext('Registration Number') }}:
+
{{ student.registration_number or '-' }}
+ +
{{ gettext('File Number') }}:
+
{{ student.file_number or '-' }}
+ +
{{ gettext('Order Number') }}:
+
{{ student.order_number or '-' }}
+ +
{{ gettext('Full Name') }}:
+
{{ student.full_name }}
+ +
{{ gettext('First Name') }}:
+
{{ student.first_name }}
+ +
{{ gettext('Last Name') }}:
+
{{ student.last_name }}
+ +
{{ gettext('Birth Date') }}:
+
{{ student.birth_date or '-' }}
+ +
{{ gettext('Gender') }}:
+
{{ student.gender or '-' }}
+ +
{{ gettext('Study Group') }}:
+
{{ student.study_group or '-' }}
+ +
{{ gettext('Created') }}:
+
{{ student.created_at }}
+ +
{{ gettext('Updated') }}:
+
{{ student.updated_at }}
+
+
+
+
+ + +
+
+
+
{{ gettext('Assigned Devices') }}
+
+
+ + +
{{ gettext('Tablets') }}
+ {% if assigned_tablets %} +
    + {% for tablet in assigned_tablets %} +
  • + {{ tablet.brand }} {{ tablet.model }}
    + {{ gettext('Serial:') }} {{ tablet.serial_number }}
    + {{ gettext('Status:') }} {{ tablet.status }} +
    • + {% endfor %} +
+ {% else %} +

{{ gettext('No tablets assigned') }}

+ {% endif %} + + +
{{ gettext('Other Devices') }}
+ {% if assigned_devices %} +
    + {% for device in assigned_devices %} +
  • + {{ device.brand }} {{ device.model }}
    + {{ gettext('Type:') }} {{ device.device_type }}
    + {{ gettext('Serial:') }} {{ device.serial_number }} +
    • + {% endfor %} +
+ {% else %} +

{{ gettext('No other devices assigned') }}

+ {% endif %} +
+
+
+
+ + +
+
+
+
{{ gettext('Loan History') }}
+
+
+
+ + + + + + + + + + + + {% if loans %} + {% for loan in loans %} + + + + + + + + {% endfor %} + {% else %} + + + + {% endif %} + +
{{ gettext('ID') }}{{ gettext('Tablet') }}{{ gettext('Loan Date') }}{{ gettext('Return Date') }}{{ gettext('Status') }}
{{ loan.id }}{{ loan.brand }} {{ loan.model }} ({{ loan.serial_number }}){{ loan.loan_date }}{{ loan.return_date or '-' }} + + {{ loan.status }} + +
+ {{ gettext('No loan history') }} +
+
+
+
+
+ +
+ + {{ gettext('Back to Students') }} + +
+
+
+
+{% endblock %} diff --git a/templates/students.html b/templates/students.html new file mode 100644 index 0000000..1fc4a0a --- /dev/null +++ b/templates/students.html @@ -0,0 +1,182 @@ +{% extends "base.html" %} + +{% block title %}{{ gettext('Students') }}{% endblock %} + +{% block content %} +
+
+
+

{{ gettext('Students') }}

+ +
+
+
+

{{ gettext('Total students:') }} {{ total_students }}

+
+
+ + {{ gettext('Add Student') }} + + + {{ gettext('Import CSV') }} + +
+
+
+ + +
+
+
{{ gettext('Search & Filter') }}
+
+
+
+
+ + +
+
+ + +
+
+ + +
+
+ +
+
+ + {{ gettext('Clear') }} + +
+
+
+
+ + +
+
+
{{ gettext('Student List') }}
+
+
+
+ + + + + + + + + + + + + + + {% if students %} + {% for student in students %} + + + + + + + + + + + {% endfor %} + {% else %} + + + + {% endif %} + +
{{ gettext('ID') }}{{ gettext('Name') }}{{ gettext('CIAL Code') }}{{ gettext('NIF/NIE') }}{{ gettext('Gender') }}{{ gettext('Study Group') }}{{ gettext('Birth Date') }}{{ gettext('Actions') }}
{{ student.id }} + + {{ student.last_name }}, {{ student.first_name }} + + {{ student.cial_code }}{{ student.nif_nie_passport or '-' }}{{ student.gender or '-' }}{{ student.study_group or '-' }}{{ student.birth_date or '-' }} +
+ + + + + + + + + +
+
+ {{ gettext('No students found') }} +
+
+
+ + + {% if total_pages > 1 %} +
+ +
+ {{ gettext('Showing') }} {{ (page - 1) * per_page + 1 }}- + {{ min(page * per_page, total_students) }} {{ gettext('of') }} {{ total_students }} +
+
+ {% endif %} +
+
+
+
+{% endblock %} diff --git a/uv.lock b/uv.lock new file mode 100644 index 0000000..40e0b80 --- /dev/null +++ b/uv.lock @@ -0,0 +1,8 @@ +version = 1 +revision = 3 +requires-python = ">=3.14" + +[[package]] +name = "gestiontablets" +version = "0.1.0" +source = { virtual = "." } From b8ecfce5f0a14207eb9dda5845a897c6fcd4cb2b Mon Sep 17 00:00:00 2001 From: ijuanes Date: Tue, 23 Jun 2026 20:54:15 +0100 Subject: [PATCH 33/39] Add dark mode toggle with persistence and fix visibility issues - Add Font Awesome for moon/sun icons - Add dark mode CSS styles for body, inputs, tables, flash messages - Add theme toggle button next to language switcher - Add localStorage persistence for theme preference - Fix code/bg-gray-100 visibility in dark mode - Fix table header text color in dark mode --- templates/base.html | 124 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 124 insertions(+) diff --git a/templates/base.html b/templates/base.html index 705aa98..b748570 100644 --- a/templates/base.html +++ b/templates/base.html @@ -11,6 +11,9 @@ + + + @@ -129,6 +215,12 @@ {{ lang_name }} {% endfor %} + + + + 🌙 + +
@@ -221,5 +313,37 @@
+ + + From ab8db53ba627e45fc70999b8ea592d74039f2070 Mon Sep 17 00:00:00 2001 From: ijuanes Date: Wed, 24 Jun 2026 00:31:13 +0100 Subject: [PATCH 34/39] Add Roadmap section: Spanish as default, English deprecated --- IMPLEMENTATION_SUMMARY.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/IMPLEMENTATION_SUMMARY.md b/IMPLEMENTATION_SUMMARY.md index be7e5d5..abbf124 100644 --- a/IMPLEMENTATION_SUMMARY.md +++ b/IMPLEMENTATION_SUMMARY.md @@ -390,3 +390,8 @@ GestionTablets/ - All templates use consistent styling (Bootstrap 5 classes) - The import script handles encoding conversion automatically - The database migration is safe and creates backups automatically + +## Roadmap + +- **Español (Spanish)** — Default language for this internal tool +- **English** — Deprecated; available for legacy users but not actively maintained From 1b28021134e9ca3a8992b1d234e538e993b5f134 Mon Sep 17 00:00:00 2001 From: ijuanes Date: Wed, 24 Jun 2026 15:34:28 +0100 Subject: [PATCH 35/39] Add frontend revamp roadmap: mobile readability and UI standardization - Focus on database results display (responsive tables, card layouts) - Standardize CSS framework (remove Bootstrap, use Tailwind only) - Mobile navigation with hamburger menu - Form responsiveness improvements - Dark mode enhancement and accessibility - Phased implementation approach --- IMPLEMENTATION_SUMMARY.md | 45 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 45 insertions(+) diff --git a/IMPLEMENTATION_SUMMARY.md b/IMPLEMENTATION_SUMMARY.md index abbf124..d6ab4d5 100644 --- a/IMPLEMENTATION_SUMMARY.md +++ b/IMPLEMENTATION_SUMMARY.md @@ -395,3 +395,48 @@ GestionTablets/ - **Español (Spanish)** — Default language for this internal tool - **English** — Deprecated; available for legacy users but not actively maintained + +### Frontend Revamp (High Priority) + +**Goal**: Improve mobile readability and standardize UI across all templates + +#### 1. Database Results Display (Main Content Area) +- **Current issue**: Tables overflow on mobile, inconsistent styling across templates +- **Solution**: + - Responsive tables with horizontal scroll on mobile + - Card-based layouts for mobile (show data as stacked cards instead of tables) + - Standardize column widths and spacing + - Improve readability of data cells (better contrast, padding) + +#### 2. CSS Framework Standardization +- **Current issue**: Mixed Bootstrap 5, Tailwind, and plain CSS across templates +- **Solution**: + - Standardize all templates on Tailwind CSS (already in use for `index.html`) + - Remove Bootstrap and Font Awesome dependencies + - Create reusable component classes for buttons, forms, cards + +#### 3. Mobile Navigation +- **Current issue**: Horizontal navigation bar with 8+ links doesn't collapse on mobile +- **Solution**: + - Implement hamburger menu for mobile devices + - Responsive breakpoints for different screen sizes + +#### 4. Form Responsiveness +- **Current issue**: Forms use Bootstrap grid classes, inconsistent spacing +- **Solution**: + - Tailwind responsive grid for form layouts + - Consistent input styling and validation feedback + - Mobile-friendly touch targets + +#### 5. Dark Mode Enhancement +- **Current issue**: Incomplete dark mode coverage, some elements still have light backgrounds +- **Solution**: + - Comprehensive dark mode CSS variables + - Test all pages in dark mode + - Ensure proper contrast ratios + +### Implementation Approach +- **Phase 1**: Fix database results tables (mobile scroll, card alternative) +- **Phase 2**: Standardize CSS framework (remove Bootstrap, use Tailwind only) +- **Phase 3**: Responsive navigation and forms +- **Phase 4**: Dark mode polish and accessibility improvements From 06da5bdf2f82101f1dd330113a85bcb181083fd8 Mon Sep 17 00:00:00 2001 From: ijuanes Date: Wed, 24 Jun 2026 15:53:55 +0100 Subject: [PATCH 36/39] Phase 1: Responsive tables and Tailwind CSS standardization - Added responsive table styles with mobile card layouts to base.html - Converted all templates from Bootstrap/plain CSS to Tailwind CSS - Implemented responsive tables with horizontal scroll on desktop - Added mobile card layouts for better readability on small screens - Standardized form layouts with Tailwind responsive grid - Updated all 15 templates for consistent styling: * base.html (responsive table CSS) * index.html (responsive tables + mobile cards) * students.html (Bootstrap -> Tailwind) * student_detail.html (Bootstrap -> Tailwind) * add_student.html (Bootstrap -> Tailwind) * edit_student.html (Bootstrap -> Tailwind) * import_students.html (Bootstrap -> Tailwind) * loan_tablet.html (Bootstrap -> Tailwind) * history.html (plain CSS -> Tailwind) * non_loanable_devices.html (plain CSS -> Tailwind) * add_non_loanable_device.html (plain CSS -> Tailwind) * edit_non_loanable_device.html (plain CSS -> Tailwind) * add_tablet.html (plain CSS -> Tailwind) * add_user.html (plain CSS -> Tailwind) * project_management.html (plain CSS -> Tailwind) --- templates/add_non_loanable_device.html | 141 ++++++---- templates/add_student.html | 260 +++++++++--------- templates/add_tablet.html | 77 ++++-- templates/add_user.html | 79 ++++-- templates/base.html | 88 ++++++ templates/edit_non_loanable_device.html | 157 +++++++---- templates/edit_student.html | 293 +++++++++++--------- templates/history.html | 166 ++++++++--- templates/import_students.html | 233 ++++++++++------ templates/index.html | 168 ++++++++---- templates/loan_tablet.html | 177 ++++++------ templates/non_loanable_devices.html | 184 ++++++++++--- templates/project_management.html | 293 +++++++------------- templates/student_detail.html | 328 +++++++++++----------- templates/students.html | 351 +++++++++++++----------- 15 files changed, 1766 insertions(+), 1229 deletions(-) diff --git a/templates/add_non_loanable_device.html b/templates/add_non_loanable_device.html index 52ec344..62eaafd 100644 --- a/templates/add_non_loanable_device.html +++ b/templates/add_non_loanable_device.html @@ -1,63 +1,106 @@ {% extends "base.html" %} {% block content %} -

{{ _('Add Non-Loanable Device') }}

-

{{ _('Add a device that will be tracked in inventory but cannot be loaned to users (e.g., projectors, monitors, etc.)') }}

- -
-
- - -
+
+ {# Page Header #} +
+

{{ _('Add Non-Loanable Device') }}

+

{{ _('Add a device that will be tracked in inventory but cannot be loaned to users (e.g., projectors, monitors, etc.)') }}

+
-
- - + {# Device Form #} +
+
+

{{ _('Device Information') }}

+
+ +
+ + +
-
- - -
+
+ + +
-
- - -
+
+ + +
-
- - -
+
+ + +

{{ _('Each device must have a unique serial number') }}

+
-
- - -
+
+ + +

{{ _('Optional location where the device is stored') }}

+
-
- - -
+
+
+ + +
-
- - -
+
+ + +
+
-
- - {{ _('Cancel') }} +
+ + +
+ +
+ + + + + {{ _('Cancel') }} + + +
+
- +
+
{% endblock %} diff --git a/templates/add_student.html b/templates/add_student.html index c74b276..a6bd959 100644 --- a/templates/add_student.html +++ b/templates/add_student.html @@ -3,136 +3,140 @@ {% block title %}{{ gettext('Add Student') }}{% endblock %} {% block content %} -
-
-
-

{{ gettext('Add Student') }}

- -
-
-
{{ gettext('Student Information') }}
+
+ {# Page Header #} +
+

{{ gettext('Add Student') }}

+

{{ gettext('Register a new student in the system') }}

+
+ + {# Student Form #} +
+
+

{{ gettext('Student Information') }}

+
+
+
+ {# Identification Section #} +
+

{{ gettext('Identification') }}

+ +
+ + +

{{ gettext('Unique internal identification code') }}

+
+ +
+ + +

{{ gettext('National ID, Foreign ID, or Passport number') }}

+
+ +
+ + +
+ +
+ + +
+ +
+ + +
-
- - - -
- {{ gettext('Identification') }} - -
- -
- -
{{ gettext('Unique internal identification code') }}
-
-
- -
- -
- -
{{ gettext('National ID, Foreign ID, or Passport number') }}
-
-
- -
- -
- -
-
- -
- -
- -
-
- -
- -
- -
-
-
- - -
- {{ gettext('Personal Information') }} - -
- -
- -
-
- -
- -
- -
-
- -
- -
- -
{{ gettext('Format: YYYY-MM-DD') }}
-
-
- -
- -
- -
-
-
- - -
- {{ gettext('Study Information') }} - -
- -
- -
{{ gettext('E.g., 1º FPB BÃSICA') }}
-
-
-
- - -
- - {{ gettext('Cancel') }} - - -
- + + {# Personal Information Section #} +
+

{{ gettext('Personal Information') }}

+ +
+ + +
+ +
+ + +
+ +
+ + +

{{ gettext('Full name for display purposes') }}

+
+ +
+ + +
+ +
+ + +
+ +
+ + +

{{ gettext('Class or study group') }}

+
-
+ +
+ + + + + {{ gettext('Cancel') }} + + +
+
diff --git a/templates/add_tablet.html b/templates/add_tablet.html index bc1fa4b..5362d02 100644 --- a/templates/add_tablet.html +++ b/templates/add_tablet.html @@ -1,30 +1,67 @@ {% extends "base.html" %} {% block content %} -

{{ _('Add New Tablet') }}

-
-
- - -
+
+ {# Page Header #} +
+

{{ _('Add New Tablet') }}

+

{{ _('Register a new tablet in the system') }}

+
-
- - + {# Tablet Form #} +
+
+

{{ _('Tablet Information') }}

+
+ +
+ + +
-
- - -
+
+ + +
-
- - -
+
+ + +

{{ _('Each tablet must have a unique serial number') }}

+
-
- +
+ + +
+ +
+ + + + + {{ _('Cancel') }} + + +
+
- +
+
{% endblock %} diff --git a/templates/add_user.html b/templates/add_user.html index 78439d9..708066b 100644 --- a/templates/add_user.html +++ b/templates/add_user.html @@ -1,30 +1,69 @@ {% extends "base.html" %} {% block content %} -

{{ _('Add New User') }}

-
-
- - -
+
+ {# Page Header #} +
+

{{ _('Add New User') }}

+

{{ _('Register a new staff user in the system') }}

+
-
- - + {# User Form #} +
+
+

{{ _('User Information') }}

+
+ +
+ + +
-
- - -
+
+ + +

{{ _('Optional email address') }}

+
-
- - -
+
+ + +

{{ _('Optional phone number') }}

+
-
- +
+ + +

{{ _('Unique identification for the staff member') }}

+
+ +
+ + + + + {{ _('Cancel') }} + + +
+
- +
+
{% endblock %} diff --git a/templates/base.html b/templates/base.html index b748570..fcf9189 100644 --- a/templates/base.html +++ b/templates/base.html @@ -125,6 +125,94 @@ background-color: #374151; color: #e0e0e0; } + + /* Responsive Table Styles */ + .table-container { + overflow-x: auto; + -webkit-overflow-scrolling: touch; + border-radius: 0.5rem; + box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1); + } + + .table-responsive { + width: 100%; + border-collapse: collapse; + background-color: white; + } + + .table-responsive thead { + background-color: #f9fafb; + } + + .table-responsive th { + padding: 0.75rem 1rem; + text-align: left; + font-size: 0.75rem; + font-weight: 600; + color: #6b7280; + text-transform: uppercase; + letter-spacing: 0.05em; + white-space: nowrap; + border-bottom: 2px solid #e5e7eb; + } + + .table-responsive td { + padding: 0.75rem 1rem; + font-size: 0.875rem; + color: #374151; + border-bottom: 1px solid #e5e7eb; + white-space: nowrap; + } + + .table-responsive tbody tr:hover { + background-color: #f9fafb; + } + + /* Mobile Card Layout */ + @media (max-width: 640px) { + .table-card-mobile { + display: none; + } + + .mobile-cards { + display: flex; + flex-direction: column; + gap: 0.75rem; + } + + .mobile-card { + background-color: white; + border-radius: 0.5rem; + padding: 1rem; + box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1); + } + + .mobile-card .card-row { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0.25rem 0; + border-bottom: 1px solid #f3f4f6; + } + + .mobile-card .card-row:last-child { + border-bottom: none; + } + + .mobile-card .card-label { + font-size: 0.75rem; + font-weight: 600; + color: #6b7280; + text-transform: uppercase; + letter-spacing: 0.05em; + } + + .mobile-card .card-value { + font-size: 0.875rem; + color: #374151; + text-align: right; + } + } diff --git a/templates/edit_non_loanable_device.html b/templates/edit_non_loanable_device.html index 339a252..68d8625 100644 --- a/templates/edit_non_loanable_device.html +++ b/templates/edit_non_loanable_device.html @@ -1,71 +1,116 @@ {% extends "base.html" %} {% block content %} -

{{ _('Edit Non-Loanable Device') }}

- -
-
- - -
+
+ {# Page Header #} +
+

{{ _('Edit Non-Loanable Device') }}

+

{{ _('Update device information') }}

+
-
- - + {# Device Form #} +
+
+

{{ _('Device Information') }}

+
+ +
+ + +
-
- - -
+
+ + +
-
- - -
+
+ + +
-
- - -
+
+ + +

{{ _('Each device must have a unique serial number') }}

+
-
- - -
+
+ + +

{{ _('Optional location where the device is stored') }}

+
-
- - -
+
+ + +
-
- - -
+
+
+ + +
-
- - -
+
+ + +
+
-
- - {{ _('Cancel') }} +
+ + +
+ +
+ + + + + {{ _('Cancel') }} + + +
+
- +
+
{% endblock %} diff --git a/templates/edit_student.html b/templates/edit_student.html index c6856f2..7e92575 100644 --- a/templates/edit_student.html +++ b/templates/edit_student.html @@ -3,144 +3,165 @@ {% block title %}{{ gettext('Edit Student') }} - {{ student.full_name }}{% endblock %} {% block content %} -
-
-
- - -

{{ gettext('Edit Student') }}: {{ student.full_name }}

- -
-
-
{{ gettext('Student Information') }}
+
+ {# Breadcrumb #} + + + {# Page Header #} +
+

{{ gettext('Edit Student') }}: {{ student.full_name }}

+

{{ gettext('Update student information') }}

+
+ + {# Student Form #} +
+
+

{{ gettext('Student Information') }}

+
+
+
+ {# Identification Section #} +
+

{{ gettext('Identification') }}

+ +
+ + +

{{ gettext('Unique internal identification code') }}

+
+ +
+ + +

{{ gettext('National ID, Foreign ID, or Passport number') }}

+
+ +
+ + +
+ +
+ + +
+ +
+ + +
-
- - - -
- {{ gettext('Identification') }} - -
- -
- -
{{ gettext('Unique internal identification code') }}
-
-
- -
- -
- -
{{ gettext('National ID, Foreign ID, or Passport number') }}
-
-
- -
- -
- -
-
- -
- -
- -
-
- -
- -
- -
-
-
- - -
- {{ gettext('Personal Information') }} - -
- -
- -
-
- -
- -
- -
-
- -
- -
- -
{{ gettext('Format: YYYY-MM-DD') }}
-
-
- -
- -
- -
-
-
- - -
- {{ gettext('Study Information') }} - -
- -
- -
{{ gettext('E.g., 1º FPB BÃSICA') }}
-
-
-
- - -
- - {{ gettext('Cancel') }} - - -
- + + {# Personal Information Section #} +
+

{{ gettext('Personal Information') }}

+ +
+ + +
+ +
+ + +
+ +
+ + +

{{ gettext('Full name for display purposes') }}

+
+ +
+ + +
+ +
+ + +
+ +
+ + +

{{ gettext('Class or study group') }}

+
-
+ +
+ + + + + {{ gettext('Cancel') }} + + +
+
diff --git a/templates/history.html b/templates/history.html index b5018e9..bcb98ff 100644 --- a/templates/history.html +++ b/templates/history.html @@ -1,37 +1,139 @@ {% extends "base.html" %} {% block content %} -
-

{{ _('Loan History') }}

- {% if loans %} -
- - - - - - - - - - - - - {% for loan in loans %} - - - - - - - - - {% endfor %} - -
{{ _('Tablet') }}{{ _('Serial Number') }}{{ _('Borrower') }}{{ _('Loan Date') }}{{ _('Return Date') }}{{ _('Status') }}
{{ loan.brand }} {{ loan.model }}{{ loan.serial_number }}{{ loan.name }}{{ loan.loan_date }}{{ loan.return_date or '-' }}{{ loan.status }}
-
- {% else %} -

{{ _('No loan history available.') }}

- {% endif %} +
+ {# Page Header #} +
+
+

{{ _('Loan History') }}

+

{{ _('View all past and current tablet loans') }}

+
+ + + + + {{ _('Back to Dashboard') }} +
+ + {% if loans %} + {# Desktop Table (hidden on mobile) #} +
+ + + + + + + + + + + + + {% for loan in loans %} + + + + + + + + + {% endfor %} + +
{{ _('Tablet') }}{{ _('Serial Number') }}{{ _('Borrower') }}{{ _('Loan Date') }}{{ _('Return Date') }}{{ _('Status') }}
+
{{ loan.brand }} {{ loan.model }}
+ 		+ {{ loan.serial_number }} + +
{{ loan.name }}
+
{{ loan.identification }}
+ 		+ {{ loan.loan_date[:10] if loan.loan_date else _('N/A') }} +
+ {{ loan.loan_date[11:16] if loan.loan_date else '' }} + 		+ {% if loan.return_date %} + {{ loan.return_date[:10] }} +
+ {{ loan.return_date[11:16] }} + {% else %} + - + {% endif %} + 		+ + {{ loan.status }} + +
+
+ + {# Mobile Cards (hidden on desktop) #} + + {% else %} +
+ + + +

{{ _('No loan history available.') }}

+ + {{ _('Create a Loan') }} + +
+ {% endif %} +
+ + {% endblock %} diff --git a/templates/import_students.html b/templates/import_students.html index 5d712a5..c343c90 100644 --- a/templates/import_students.html +++ b/templates/import_students.html @@ -3,99 +3,154 @@ {% block title %}{{ gettext('Import Students from CSV') }}{% endblock %} {% block content %} -
-
-
-

{{ gettext('Import Students from CSV') }}

- -
-
-
{{ gettext('Instructions') }}
-
-
-
    -
  • {{ gettext('Upload a CSV file with student data') }}
    • -
  • {{ gettext('The file should be encoded in ISO-8859-1 (Latin-1)') }}
    • -
  • {{ gettext('Required columns: Apellidos, Nombre (will be split), C.I.A.L., Fecha Nac.') }}
    • -
  • {{ gettext('Optional columns: NIF/NIE/Pas., Registro, Expediente, Sexo, Grupo') }}
    • -
  • {{ gettext('The "Estudio" column will be discarded') }}
    • -
  • {{ gettext('Duplicate students (by CIAL code or NIF/NIE) will be skipped') }}
    • -
-

- {{ gettext('Example CSV format:') }}
- Nº Or.,"Apellidos, Nombre",Fecha Nac.,C.I.A.L.,NIF/NIE/Pas.,Registro,Expediente,Sexo,Grupo,Estudio -

-
+
+ {# Page Header #} +
+

{{ gettext('Import Students from CSV') }}

+

{{ gettext('Bulk import student data from a CSV file') }}

+
+ + {# Instructions Card #} +
+
+

{{ gettext('Instructions') }}

+
+
+
    +
  • + + + + {{ gettext('Upload a CSV file with student data') }} +
    • +
  • + + + + {{ gettext('The file should be encoded in ISO-8859-1 (Latin-1)') }} +
    • +
  • + + + + {{ gettext('Required columns: Apellidos, Nombre (will be split), C.I.A.L., Fecha Nac.') }} +
    • +
  • + + + + {{ gettext('Optional columns: NIF/NIE/Pas., Registro, Expediente, Sexo, Grupo') }} +
    • +
  • + + + + {{ gettext('The "Estudio" column will be discarded') }} +
    • +
  • + + + + {{ gettext('Duplicate students (by CIAL code or NIF/NIE) will be skipped') }} +
    • +
+
+

+ {{ gettext('Example CSV format:') }}
+ Nº Or.,"Apellidos, Nombre",Fecha Nac.,C.I.A.L.,NIF/NIE/Pas.,Registro,Expediente,Sexo,Grupo,Estudio +

- -
-
-
{{ gettext('Upload CSV File') }}
+
+
+ + {# Upload Form #} +
+
+

{{ gettext('Upload CSV File') }}

+
+
+
+
+ + +

{{ gettext('Select a CSV file to upload') }}

-
- -
- - -
{{ gettext('Select a CSV file to upload') }}
-
- -
- - {{ gettext('Cancel') }} - - -
- -
-
- - -
-
-
{{ gettext('Sample Data Format') }}
-
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
{{ gettext('Nº Or.') }}{{ gettext('Apellidos, Nombre') }}{{ gettext('Fecha Nac.') }}{{ gettext('C.I.A.L.') }}{{ gettext('NIF/NIE/Pas.') }}{{ gettext('Registro') }}{{ gettext('Expediente') }}{{ gettext('Sexo') }}{{ gettext('Grupo') }}{{ gettext('Estudio') }}
1PERIQUITA DE LOS PALOTES, JUANITA24/08/2009B19L64119K24587243H4847M1º FPB BÃSICA1º CFGB Servicios Socioculturales...
-
-
- {{ gettext('Note: The "Estudio" field will be discarded during import.') }} -
+ +
+ + + + + {{ gettext('Cancel') }} + +
+ +
+
+ + {# Sample Data Preview #} +
+
+

{{ gettext('Sample Data Format') }}

+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
{{ gettext('Nº Or.') }}{{ gettext('Apellidos, Nombre') }}{{ gettext('Fecha Nac.') }}{{ gettext('C.I.A.L.') }}{{ gettext('NIF/NIE/Pas.') }}{{ gettext('Registro') }}{{ gettext('Expediente') }}{{ gettext('Sexo') }}{{ gettext('Grupo') }}{{ gettext('Estudio') }}
1García López, María15/03/200512345678A12345678AREG001EXP001F2º ESO AESO
2Martínez Ruiz, Carlos22/07/200487654321B87654321BREG002EXP002M3º ESO BESO
+

+ {{ gettext('Estudio') }} + {{ gettext('column will be discarded during import') }} +

diff --git a/templates/index.html b/templates/index.html index 5f0cc43..226b535 100644 --- a/templates/index.html +++ b/templates/index.html @@ -18,43 +18,34 @@
{% if available_tablets %} -
- - + {# Desktop Table (hidden on mobile) #} +
+
+ - - - - - + + + + + - + {% for tablet in available_tablets %} - - + - - - -
- {{ _('Brand') }} - - {{ _('Model') }} - - {{ _('Serial Number') }} - - {{ _('Notes') }} - - {{ _('Actions') }} - {{ _('Brand') }}{{ _('Model') }}{{ _('Serial Number') }}{{ _('Notes') }}{{ _('Actions') }}
+
{{ tablet.brand }}
 + {{ tablet.model }} + {{ tablet.serial_number }} + {{ tablet.notes or '-' }} + @@ -69,6 +60,41 @@
+ + {# Mobile Cards (hidden on desktop) #} + {% else %}
@@ -100,45 +126,37 @@
{% if active_loans %} -
- - + {# Desktop Table (hidden on mobile) #} +
+
+ - - - - - + + + + + - + {% for loan in active_loans %} - - + - - - -
- {{ _('Tablet') }} - - {{ _('Serial Number') }} - - {{ _('Borrower') }} - - {{ _('Loan Date') }} - - {{ _('Actions') }} - {{ _('Tablet') }}{{ _('Serial Number') }}{{ _('Borrower') }}{{ _('Loan Date') }}{{ _('Actions') }}
+
{{ loan.brand }} {{ loan.model }}
 + {{ loan.serial_number }} +
{{ loan.name }}
{{ loan.identification }}
 + {{ loan.loan_date[:10] if loan.loan_date else _('N/A') }} - {{ loan.loan_date[11:16] if loan.loan_date else '' }} +
+ {{ loan.loan_date[11:16] if loan.loan_date else '' }} 		+ @@ -153,6 +171,46 @@
+ + {# Mobile Cards (hidden on desktop) #} + {% else %}
@@ -164,4 +222,12 @@ {% endif %}
+ + {% endblock %} diff --git a/templates/loan_tablet.html b/templates/loan_tablet.html index 11b9f82..7302524 100644 --- a/templates/loan_tablet.html +++ b/templates/loan_tablet.html @@ -3,84 +3,101 @@ {% block title %}{{ gettext('Loan Tablet') }}{% endblock %} {% block content %} -
-
-
-

{{ gettext('Loan Tablet') }}

- -
-
-
{{ gettext('Loan Information') }}
+
+ {# Page Header #} +
+

{{ gettext('Loan Tablet') }}

+

{{ gettext('Loan a tablet to a user or student') }}

+
+ + {# Loan Form #} +
+
+

{{ gettext('Loan Information') }}

+
+
+
+ {# Tablet Selection #} +
+ + + +

{{ gettext('Select which tablet to loan') }}

-
- - - -
- - - -
{{ gettext('Select which tablet to loan') }}
-
- - -
- - - -
{{ gettext('Select the staff member processing the loan') }}
-
- - -
- - - -
{{ gettext('Optionally associate this loan with a student') }}
-
- - -
- - {{ gettext('Cancel') }} - - -
- + + {# User Selection (Staff) #} +
+ + + +

{{ gettext('Select the staff member processing the loan') }}

-
+ + {# Student Selection (Optional) #} +
+ + + +

{{ gettext('Optionally associate this loan with a student') }}

+
+ + {# Form Actions #} +
+ + + + + {{ gettext('Cancel') }} + + +
+
@@ -102,12 +119,4 @@ } } - - {% endblock %} diff --git a/templates/non_loanable_devices.html b/templates/non_loanable_devices.html index 489cc4d..463f245 100644 --- a/templates/non_loanable_devices.html +++ b/templates/non_loanable_devices.html @@ -1,45 +1,149 @@ {% extends "base.html" %} {% block content %} -
-

{{ _('Non-Loanable Devices Inventory') }}

-

{{ _('These devices are tracked in inventory but cannot be loaned to users.') }}

- {{ _('Add Non-Loanable Device') }} - - {% if devices %} -
- - - - - - - - - - - - - - {% for device in devices %} - - - - - - - - - - {% endfor %} - -
{{ _('Type') }}{{ _('Brand') }}{{ _('Model') }}{{ _('Serial Number') }}{{ _('Location') }}{{ _('Status') }}{{ _('Actions') }}
{{ device.device_type }}{{ device.brand }}{{ device.model }}{{ device.serial_number }}{{ device.location or '-' }}{{ device.status }} - {{ _('Edit') }} - {{ _('Delete') }} -
-
- {% else %} -

{{ _('No non-loanable devices registered.') }}

- {% endif %} +
+ {# Page Header #} +
+
+

{{ _('Non-Loanable Devices Inventory') }}

+

{{ _('These devices are tracked in inventory but cannot be loaned to users.') }}

+
+ + + + + {{ _('Add Non-Loanable Device') }} +
+ + {% if devices %} + {# Desktop Table (hidden on mobile) #} +
+ + + + + + + + + + + + + + {% for device in devices %} + + + + + + + + + + {% endfor %} + +
{{ _('Type') }}{{ _('Brand') }}{{ _('Model') }}{{ _('Serial Number') }}{{ _('Location') }}{{ _('Status') }}{{ _('Actions') }}
{{ device.device_type }}{{ device.brand }}{{ device.model }} + {{ device.serial_number }} + {{ device.location or '-' }} + + {{ device.status }} + + +
+ + + + + {{ _('Edit') }} + + + + + + {{ _('Delete') }} + +
+
+
+ + {# Mobile Cards (hidden on desktop) #} + + {% else %} +
+ + + +

{{ _('No non-loanable devices registered.') }}

+ + {{ _('Add Device') }} + +
+ {% endif %} +
+ + {% endblock %} diff --git a/templates/project_management.html b/templates/project_management.html index 606b1da..38a0d16 100644 --- a/templates/project_management.html +++ b/templates/project_management.html @@ -1,213 +1,122 @@ {% extends "base.html" %} {% block content %} -

{{ _('Project Management - Development Notes') }}

- -
-
-
- - - +
+ {# Page Header #} +
+

{{ _('Project Management - Development Notes') }}

+

{{ _('Internal development notes and project documentation') }}

+
+ + {# Editor Section #} +
+
+

{{ _('Editor') }}

+
+ +
- -
-
-

{{ _('Editor') }}

-
- -
-

{{ _('Preview') }}

-
+
+

{{ _('Preview') }}

+
+
- - + - - + // Clear status after 3 seconds + setTimeout(() => { + status.textContent = ''; + status.className = 'text-sm text-gray-500 italic'; + }, 3000); + } + {% endblock %} diff --git a/templates/student_detail.html b/templates/student_detail.html index f7b6706..f29e0c1 100644 --- a/templates/student_detail.html +++ b/templates/student_detail.html @@ -3,179 +3,175 @@ {% block title %}{{ gettext('Student Details') }} - {{ student.full_name }}{% endblock %} {% block content %} -
-
-
- - -
-

{{ student.full_name }}

-
- - {{ gettext('Edit') }} - - - {{ gettext('Delete') }} - -
+
+ {# Breadcrumb #} + + + {# Student Header #} +
+
+

{{ student.full_name }}

+

{{ gettext('Student Details') }}

+
+
+ + + + + {{ gettext('Edit') }} + + + + + + {{ gettext('Delete') }} + +
+
+ + {# Student Information and Assigned Devices #} +
+ {# Student Information Card #} +
+
+

{{ gettext('Student Information') }}

- -
- -
-
-
-
{{ gettext('Student Information') }}
-
-
-
-
{{ gettext('ID') }}:
-
{{ student.id }}
- -
{{ gettext('CIAL Code') }}:
-
{{ student.cial_code }}
- -
{{ gettext('NIF/NIE/Passport') }}:
-
{{ student.nif_nie_passport or '-' }}
- -
{{ gettext('Registration Number') }}:
-
{{ student.registration_number or '-' }}
- -
{{ gettext('File Number') }}:
-
{{ student.file_number or '-' }}
- -
{{ gettext('Order Number') }}:
-
{{ student.order_number or '-' }}
- -
{{ gettext('Full Name') }}:
-
{{ student.full_name }}
- -
{{ gettext('First Name') }}:
-
{{ student.first_name }}
- -
{{ gettext('Last Name') }}:
-
{{ student.last_name }}
- -
{{ gettext('Birth Date') }}:
-
{{ student.birth_date or '-' }}
- -
{{ gettext('Gender') }}:
-
{{ student.gender or '-' }}
- -
{{ gettext('Study Group') }}:
-
{{ student.study_group or '-' }}
- -
{{ gettext('Created') }}:
-
{{ student.created_at }}
- -
{{ gettext('Updated') }}:
-
{{ student.updated_at }}
-
-
+
+
+
+
{{ gettext('ID') }}:
+
{{ student.id }}
-
- - -
-
-
-
{{ gettext('Assigned Devices') }}
-
-
- - -
{{ gettext('Tablets') }}
- {% if assigned_tablets %} -
    - {% for tablet in assigned_tablets %} -
  • - {{ tablet.brand }} {{ tablet.model }}
    - {{ gettext('Serial:') }} {{ tablet.serial_number }}
    - {{ gettext('Status:') }} {{ tablet.status }} -
    • - {% endfor %} -
- {% else %} -

{{ gettext('No tablets assigned') }}

- {% endif %} - - -
{{ gettext('Other Devices') }}
- {% if assigned_devices %} -
    - {% for device in assigned_devices %} -
  • - {{ device.brand }} {{ device.model }}
    - {{ gettext('Type:') }} {{ device.device_type }}
    - {{ gettext('Serial:') }} {{ device.serial_number }} -
    • - {% endfor %} -
- {% else %} -

{{ gettext('No other devices assigned') }}

- {% endif %} -
+
+
{{ gettext('CIAL Code') }}:
+
+ {{ student.cial_code }} +
-
+
+
{{ gettext('NIF/NIE/Passport') }}:
+
{{ student.nif_nie_passport or '-' }}
+
+
+
{{ gettext('Registration Number') }}:
+
{{ student.registration_number or '-' }}
+
+
+
{{ gettext('File Number') }}:
+
{{ student.file_number or '-' }}
+
+
+
{{ gettext('Order Number') }}:
+
{{ student.order_number or '-' }}
+
+
+
{{ gettext('Full Name') }}:
+
{{ student.full_name }}
+
+
+
{{ gettext('First Name') }}:
+
{{ student.first_name }}
+
+
+
{{ gettext('Last Name') }}:
+
{{ student.last_name }}
+
+
+
{{ gettext('Birth Date') }}:
+
{{ student.birth_date or '-' }}
+
+
+
{{ gettext('Gender') }}:
+
{{ student.gender or '-' }}
+
+
+
{{ gettext('Study Group') }}:
+
{{ student.study_group or '-' }}
+
+
+
{{ gettext('Created') }}:
+
{{ student.created_at }}
+
+
+
{{ gettext('Updated') }}:
+
{{ student.updated_at }}
+
+
- - -
-
-
-
{{ gettext('Loan History') }}
-
-
-
- - - - - - - - - - - - {% if loans %} - {% for loan in loans %} - - - - - - - - {% endfor %} - {% else %} - - - - {% endif %} - -
{{ gettext('ID') }}{{ gettext('Tablet') }}{{ gettext('Loan Date') }}{{ gettext('Return Date') }}{{ gettext('Status') }}
{{ loan.id }}{{ loan.brand }} {{ loan.model }} ({{ loan.serial_number }}){{ loan.loan_date }}{{ loan.return_date or '-' }} - - {{ loan.status }} - -
- {{ gettext('No loan history') }} -
+
+ + {# Assigned Devices Card #} +
+
+

{{ gettext('Assigned Devices') }}

+
+
+ {# Assigned Tablets #} +

{{ gettext('Tablets') }}

+ {% if assigned_tablets %} +
+ {% for tablet in assigned_tablets %} +
+
+
{{ tablet.brand }} {{ tablet.model }}
+
+ {{ gettext('Serial:') }} {{ tablet.serial_number }} +
+
+ {{ gettext('Status:') }} + + {{ tablet.status }} + +
+ {% endfor %}
-
- -
- - {{ gettext('Back to Students') }} - + {% else %} +

{{ gettext('No tablets assigned.') }}

+ {% endif %} + + {# Assigned Non-Loanable Devices #} +

{{ gettext('Non-Loanable Devices') }}

+ {% if assigned_devices %} +
+ {% for device in assigned_devices %} +
+
+
{{ device.brand }} {{ device.model }}
+
+ {{ gettext('Serial:') }} {{ device.serial_number }} +
+
+ {{ gettext('Type:') }} {{ device.device_type }} +
+
+
+ {% endfor %} +
+ {% else %} +

{{ gettext('No non-loanable devices assigned.') }}

+ {% endif %}
diff --git a/templates/students.html b/templates/students.html index 1fc4a0a..2e9e670 100644 --- a/templates/students.html +++ b/templates/students.html @@ -3,180 +3,199 @@ {% block title %}{{ gettext('Students') }}{% endblock %} {% block content %} -
-
-
-

{{ gettext('Students') }}

- -
-
-
-

{{ gettext('Total students:') }} {{ total_students }}

-
-
- - {{ gettext('Add Student') }} - - - {{ gettext('Import CSV') }} - -
-
+
+ {# Page Header #} +
+
+

{{ gettext('Students') }}

+

{{ gettext('Total students:') }} {{ total_students }}

+
+
+ + + + + {{ gettext('Add Student') }} + + + + + + {{ gettext('Import CSV') }} + +
+
+ + {# Search and Filter Form #} +
+

{{ gettext('Search & Filter') }}

+
+
+ +
- - -
-
-
{{ gettext('Search & Filter') }}
-
-
- -
- - -
-
- - -
-
- - -
-
- -
-
- - {{ gettext('Clear') }} +
+ + +
+
+ + +
+
+ + + + + + {{ gettext('Clear') }} + +
+ +
+ + {% if students %} + {# Desktop Table (hidden on mobile) #} +
+ + + + + + + + + + + + + + + {% for student in students %} + + + + + + + + + + + {% endfor %} + +
{{ gettext('ID') }}{{ gettext('Name') }}{{ gettext('CIAL Code') }}{{ gettext('NIF/NIE') }}{{ gettext('Gender') }}{{ gettext('Study Group') }}{{ gettext('Birth Date') }}{{ gettext('Actions') }}
{{ student.id }} + + {{ student.last_name }}, {{ student.first_name }} - - - - - - -
-
-
{{ gettext('Student List') }}
-
-
-
- - - - - - - - - - - - - - - {% if students %} - {% for student in students %} - - - - - - - - - - - {% endfor %} - {% else %} - - - - {% endif %} - -
{{ gettext('ID') }}{{ gettext('Name') }}{{ gettext('CIAL Code') }}{{ gettext('NIF/NIE') }}{{ gettext('Gender') }}{{ gettext('Study Group') }}{{ gettext('Birth Date') }}{{ gettext('Actions') }}
{{ student.id }} - - {{ student.last_name }}, {{ student.first_name }} - - {{ student.cial_code }}{{ student.nif_nie_passport or '-' }}{{ student.gender or '-' }}{{ student.study_group or '-' }}{{ student.birth_date or '-' }} -
- - - - - - - - - -
-
- {{ gettext('No students found') }} -
+
+ {{ student.cial_code }} + {{ student.nif_nie_passport }}{{ student.gender }}{{ student.study_group }}{{ student.birth_date }} +
+ + + + + + {{ gettext('View') }} + + + + + + {{ gettext('Edit') }} + +
+
+
+ + {# Mobile Cards (hidden on desktop) #} + + + {% endblock %} From c7ad3023345e4ccafb061562f3638ccf01376a77 Mon Sep 17 00:00:00 2001 From: ijuanes Date: Wed, 24 Jun 2026 19:46:19 +0100 Subject: [PATCH 37/39] Phase 3: Mobile hamburger navigation menu - Added responsive hamburger menu button visible on mobile (sm:hidden) - Hidden desktop navigation on mobile (hidden sm:block) - Added mobile menu dropdown with all navigation links - Added mobile language switcher and theme toggle in menu - JavaScript toggle functionality for menu open/close - Auto-close menu when clicking navigation links - Updated theme toggle to work with both desktop and mobile toggles - Proper ARIA attributes for accessibility (aria-expanded, aria-label) --- templates/base.html | 141 ++++++++++++++++++++++++++++++++++++++------ 1 file changed, 122 insertions(+), 19 deletions(-) diff --git a/templates/base.html b/templates/base.html index fcf9189..11c5b2c 100644 --- a/templates/base.html +++ b/templates/base.html @@ -291,8 +291,8 @@

{{ _('Tablet Management System') }}

- -
+ + + + + +
+
+ + + @@ -346,8 +409,8 @@ {% endif %} {% endwith %} - -