homework

README.md

-# todo-hf
+python3 -m venv venv
+source venv/bin/activate
+pip3 install -r requirements.txt
+flask run --host 0.0.0.0
 

app.py

+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()

requirements.txt

+flask
+flask-sqlalchemy
+black
+flake8
\ No newline at end of file

static/styles.css

+ul {
+    color: green;    
+  }
\ No newline at end of file

templates/list.html

+<!-- 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