diff --git a/README.md b/README.md index 54325b8780c9a722ad996876a9d0aa807d4fb94f..2c909add3c50b1aca6c05a9ed78de130f9c48537 100644 --- a/README.md +++ b/README.md @@ -1,2 +1,5 @@ -# todo-hf +python3 -m venv venv +source venv/bin/activate +pip3 install -r requirements.txt +flask run --host 0.0.0.0 diff --git a/app.py b/app.py new file mode 100644 index 0000000000000000000000000000000000000000..ad0e02a40e82007639d88f7c995b1d77c2579f47 --- /dev/null +++ b/app.py @@ -0,0 +1,81 @@ +from flask import Flask, request +from flask import render_template # jinja2-höz +from flask import redirect # átirányítás +from flask_sqlalchemy import SQLAlchemy # orm + +app = Flask(__name__) # init +app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///test.db' # adatbázis elérési útja +app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = True # adatbázis műveletek logolása +db = SQLAlchemy(app) # sqlalchemy init + +# ORM - Object Relation Mapping +# Osztályból lesz az adatbázis tábla +# A vátlozók lesznek a tábla atribútumai +# Az osztály példányaiból a tábla elemei +# Segítségével a kódban tudunk lekérdezésket, adatbázisműveleteket végrehalytani, nem kell SQL lekérdezésket írni. + +class Task(db.Model): + id = db.Column(db.Integer, primary_key=True) + content = db.Column(db.Text) + done = db.Column(db.Boolean, default=False) + +# konstruktor, példény létrehozásakor meg kell adni a feladatot +# done alapértelmezetten hamis + def __init__(self, content): + self.content = content + self.done = False + + def __repr__(self): + return '<Content %s>' % self.content + +# létrehozzuk a táblát +db.create_all() + +# Négy darab végpontot kell létrehoznunk +# - / Ez adja vissza a templatet +# - /task, POST segítségével fogunk új feladatot hozzáadni +# - /done/<id> áthuzza az elemet, ezzel jelezzük, hogy kész +# - /delete/<id> törli az elemet + +# Beállítjuk melyik utvonalra és milyen kérésekre fusson le a fgv +# Alapból ha a methodot nem jelöljük akkor get +@app.route('/') +def tasks_list(): + tasks = Task.query.all() # Lekérjük az összes elemet + return render_template('list.html', tasks=tasks) # Átadjuk a templatenek + + +@app.route('/task', methods=['POST']) +def add_task(): + # Flaskban a fgv a kérést eltudjuk érni + content = request.form['content'] # A kérésből kivesszük az elemt + if not content: # Ellenőrizzuk(validáljuk) nem e üres + return redirect('/') + + task = Task(content) # Létrehozzuk a példényt, a db tábla elemét, egy sorát + db.session.add(task) # Hozzáadjuk a táblához + # Lehet törölni is a db.session.delete() segítségével + db.session.commit() # Mentjük a változásokat + return redirect('/') # Visszairnyítjuk magunkat a kezdőlapra, megjelenjenek a változások + + +@app.route('/done/<int:task_id>') +def resolve_task(task_id): + task = Task.query.get(task_id) # Lekérjük az elemet + + if not task: # Ellenőrizzuk hogy létezik e + return redirect('/') + # Ha kész van akkor hamis, ha nincs akkor igaz + if task.done: + task.done = False + else: + task.done = True + + db.session.commit() # Mentjük + return redirect('/') # Visszairányítjuk magunkat, megjelennek a változások + + +# Feladatotok az elemtörlés megvlósítása. + +if __name__ == '__main__': + app.run() diff --git a/requirements.txt b/requirements.txt new file mode 100644 index 0000000000000000000000000000000000000000..2a7fd44c174ab27a8b5d728de43ddcc012f0dd07 --- /dev/null +++ b/requirements.txt @@ -0,0 +1,4 @@ +flask +flask-sqlalchemy +black +flake8 \ No newline at end of file diff --git a/static/styles.css b/static/styles.css new file mode 100644 index 0000000000000000000000000000000000000000..c7e40811fe8a7cd7f2311559f7d322e4b57c65fc --- /dev/null +++ b/static/styles.css @@ -0,0 +1,3 @@ +ul { + color: green; + } \ No newline at end of file diff --git a/templates/list.html b/templates/list.html new file mode 100644 index 0000000000000000000000000000000000000000..8d77d2b52c4dfa13a29602fed2c077818a49dcf4 --- /dev/null +++ b/templates/list.html @@ -0,0 +1,31 @@ +<!-- Két dolgot szeretnénk + - kilistázni a feladatokat + - új feladatot felvenni egy formon + - HF: delete gomb létrehozása --> + + <!-- CSS import --> + <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}"/> + + <ul> +<!-- A megkapott taskokbol hozzuk létre az oszlopokat --> +{% for task in tasks %} + <!-- Lista egy elemének létrehozása --> + <li> + <!-- Ha kész kihuzzuk az elemt -> if --> + <!-- Ne felejtsük el lezárni az if-et --> + {% if task.done %} <strike> {% endif %}{{ task.content }} {% if task.done %} </strike>{% endif %} + <!-- Hozzunk létre egy linket ami meghívja a task id-ját --> + <a href="/done/{{ task.id }}">X</a> + + </li> +<!-- Zárjuk le a for-t --> +{% endfor %} +</ul> + +<!-- Hozzuk létre a formot --> +<form action="/task" method="post"> + <!-- Kell egy szöveges mező és egy gomb --> + <p><input type="text" name="content"></p> + <!-- Gombnyomsára elküldi a kérést --> + <input type="submit" value="Add task"> +</form> \ No newline at end of file