Sistema de Soporte Técnico con Tickets con Python + Flask + HTML

📌 Proyecto 4: Sistema de Soporte Técnico con Tickets en Flask

En este artículo, te mostraré cómo desarrollamos “Proyecto 4”, un sistema web para gestionar tickets de soporte técnico usando Flask y Python. El sistema permite registrar, editar y eliminar tickets, almacenando los datos en un archivo de texto (tickets.txt) dentro de la carpeta Documentos/python/Proyecto4.

🔹 Tecnologías Utilizadas

• Python + Flask: Backend y lógica de negocio.

• HTML + Bootstrap: Interfaz moderna y responsiva.

• OS (módulo de Python): Manejo de archivos de tickets.

🔹 Objetivo del Proyecto

El sistema permite gestionar tickets de soporte, almacenando los siguientes datos:

✅ Número de Ticket

✅ Usuario

✅ Descripción del Problema

✅ Fecha de Creación

✅ Estado (Abierto, En Proceso, Resuelto)

🔹 Funcionalidades

✅ Registrar un ticket

✅ Editar el estado del ticket

✅ Eliminar tickets resueltos

✅ Mostrar todos los tickets activos

✅ Guardar los tickets en tickets.txt

📌 Código Fuente Completo

🔹 Archivo app.py

from flask import Flask, render_template, request, redirect, url_for

import os

import datetime

app = Flask(__name__)

# Ruta donde se guardarán los tickets en Documentos/python/Proyecto4

documents_path = os.path.join(os.path.expanduser("~"), "Documents")

folder_path = os.path.join(documents_path, "python", "Proyecto4")

file_path = os.path.join(folder_path, "tickets.txt")

# Crear la carpeta si no existe

if not os.path.exists(folder_path):

os.makedirs(folder_path)

# Funciones para leer y escribir tickets

def leer_tickets():

if not os.path.exists(file_path):

return []

with open(file_path, "r", encoding="utf-8") as file:

return [line.strip().split(",") for line in file.readlines()]

def escribir_tickets(tickets):

with open(file_path, "w", encoding="utf-8") as file:

for ticket in tickets:

file.write(",".join(ticket) + "\n")

@app.route('/')

def index():

tickets = leer_tickets()

return render_template('index.html', tickets=enumerate(tickets))

@app.route('/agregar', methods=['POST'])

def agregar():

usuario = request.form['usuario']

descripcion = request.form['descripcion']

fecha = datetime.datetime.now().strftime("%Y-%m-%d %H:%M:%S")

estado = "Abierto"

nuevo_ticket = [str(len(leer_tickets()) + 1), usuario, descripcion, fecha, estado]

tickets = leer_tickets()

tickets.append(nuevo_ticket)

escribir_tickets(tickets)

return redirect(url_for('index'))

@app.route('/editar/<int:index>', methods=['GET', 'POST'])

def editar(index):

tickets = leer_tickets()

if request.method == 'POST':

tickets[index][4] = request.form['estado']

escribir_tickets(tickets)

return redirect(url_for('index'))

return render_template('editar.html', index=index, ticket=tickets[index])

@app.route('/eliminar/<int:index>')

def eliminar(index):

tickets = leer_tickets()

tickets.pop(index)

escribir_tickets(tickets)

return redirect(url_for('index'))

if __name__ == '__main__':

app.run(debug=True)

🔹 Archivo templates/index.html

<!DOCTYPE html>

<head>

<title>Soporte Técnico - Gestión de Tickets</title>

</head>

<h2 class="text-center">📋 Lista de Tickets</h2>

{% for index, ticket in tickets %}

<h5 class="card-title">🎟 Ticket #{{ ticket[0] }}</h5>

<p><strong>Usuario:</strong> {{ ticket[1] }}</p>

<p><strong>Descripción:</strong> {{ ticket[2] }}</p>

<p><strong>Fecha:</strong> {{ ticket[3] }}</p>

<p><strong>Estado:</strong>

{% if ticket[4] == "Abierto" %}

<span class="badge bg-warning text-dark">Abierto</span>

{% elif ticket[4] == "En Proceso" %}

<span class="badge bg-info text-dark">En Proceso</span>

{% else %}

<span class="badge bg-success">Resuelto</span>

{% endif %}

</p>

<a href="/editar/{{ index }}" class="btn btn-sm btn-warning">Editar</a>

<a href="/eliminar/{{ index }}" class="btn btn-sm btn-danger">Eliminar</a>

</div>

{% endfor %}

</div>

<h2 class="text-center mt-5">➕ Registrar Nuevo Ticket</h2>

<label class="form-label">Usuario</label>

</div>

<label class="form-label">Descripción del Problema</label>

</div>

<button type="submit" class="btn btn-primary w-100">Registrar Ticket</button>

</form>

</div>

</body>

</html>

🚀 Cómo Ejecutar la Aplicación

1️⃣ Instalar Flask con:

pip install flask

2️⃣ Ejecutar la aplicación:

python app.py

3️⃣ Abrir en el navegador:

👉 http://127.0.0.1:5000/

🎯 Conclusión

Este sistema de soporte técnico permite gestionar problemas y su estado de forma sencilla, ideal para empresas o equipos de TI. 🚀

Sistema de Soporte Técnico con Tickets con Python + Flask + HTML

No hay comentarios

+ Visto

Categories