Projet Web utilisant :
#! /usr/bin/python # -*- coding:utf-8 -*- import json from flask import Flask, render_template, request, redirect, url_for, session app = Flask(__name__) username = 'nina' password = 'ninaetleo' #taches : dictionnaire (tableau associatif) de tâches taches=[] #id : identifiant de la tache id = 1 @app.route('/') def accueil(): if not session.get('authentifie'): return render_template('login.html') else : #lire le fichier lire() return render_template('accueil.html', message = session['username']) #sauver() #print(taches) return render_template('accueil.html') @app.route('/login', methods=['POST']) def login(): # vérification du compte et du mot de passe if request.form['username'] == username and request.form['password'] == password: session['authentifie'] = True session['username'] = username else: return render_template('login.html', message = "Erreur de compte ou de mot de passe !") return redirect(url_for('accueil')) @app.route("/logout") def logout(): # deconnexion session['authentifie'] = False return redirect(url_for('accueil')) @app.route('/page2') def page2(): return render_template('page2.html') @app.route('/page3') def page3(): global taches # fournir au template index.html le tableau taches accomplie et non accomplie accomplies = [] nonaccomplies = [] for tache in taches: if tache["accomplie"] == False: nonaccomplies.append(tache) else: accomplies.append(tache) return render_template('page3.html', accomplies=accomplies, nonaccomplies=nonaccomplies) @app.route('/toto') def index(): global taches # fournir au template index.html le tableau taches accomplie et non accomplie accomplies = [] nonaccomplies = [] for tache in taches: if tache["accomplie"] == False: nonaccomplies.append(tache) else: accomplies.append(tache) return render_template('index.html', accomplies=accomplies, nonaccomplies=nonaccomplies) @app.route('/ajout', methods=['POST']) def ajout(): # utiliser les variables globales taches et id global taches, id vartache = request.form['tache'] taches.append({"id":id, "libelle":vartache, "accomplie":False}) print("taches apres ajout {}".format(taches)) # sauver le tableau sauver() #incrémenter id pour la prochaine tâche id = id + 1 return redirect(url_for('page3')) @app.route('/miseajour', methods=['POST']) def miseajour(): # utiliser les variables globales taches et id global taches, id varid = request.form['choix'] print("varid : {}".format(varid)) # mise à jour de la tâche for tache in taches: if tache["id"] == int(varid): tache["accomplie"] = True return redirect(url_for('page3')) def sauver(): global taches with open('leonie.txt', 'w') as fichier: fichier.write(json.dumps(taches, indent=4)) print(taches) def lire(): global taches, id #with open(url_for('static', filename='leonie.txt'), "r") as fichier: with open('leonie.txt', 'r') as fichier: taches=json.load(fichier) print("taches contient {}".format(taches)) id=len(taches)+1 if __name__ == '__main__': # il faut définir une clé secrete app.secret_key = 'laclesecrete' app.run(debug=True, host='0.0.0.0', port=5005)
<!DOCTYPE html> <html lang="fr"> <head> <title>Projet Bullet'journal</title> <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}"> <meta charset="UTF-8"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <div id='haut'> <h2>NINA et LEO</h2> <p> Bienvenue <strong>les poulets/poulettes</strong>.</p> <img src="http://www.lyc-valadon.ac-limoges.fr/local/cache-vignettes/L250xH220/siteon0-e5814.png?1513160567" /> </div> <div class="container-fluid" > <h2 class="text-primary">Authentification</h2> <form action="/login" method="POST" > <div style="margin:5px"> <input type="text" name="username" placeholder="Nom de compte" class="form-control" /> </div> <div style="margin:5px"> <input type="password" name="password" placeholder="Mot de passe" class="form-control" /> </div> <div style="margin:5px"> <input type="submit" value="S'authentifier" class="btn btn-primary" /> </div> </form> <div class="text-primary">{{message}}</div> </div> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </body> </html>
<!DOCTYPE html> <html lang="fr"> <head> <title>Projet Bullet'journal</title> <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}"> <meta charset="UTF-8"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <div id='haut'> <h2>NINA et LEO</h2> <p> Bienvenue <strong>les poulets/poulettes</strong>. | <a href="/logout">Se déconnecter.</a></p> <img src="http://www.lyc-valadon.ac-limoges.fr/local/cache-vignettes/L250xH220/siteon0-e5814.png?1513160567" /> <a href="{{ url_for('page2') }}" >Page suivante</a> </div> <div id='image'> <img src="{{ url_for('static', filename='images/carnet.png') }}"> </div> </body> </html>
<!DOCTYPE html> <html lang="fr"> <head> <title>Projet Bullet'journal</title> <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}"> <meta charset="UTF-8"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <div id='haut'> <h2>NINA et LEO</h2> <p> Bienvenue <strong>les poulets/poulettes</strong>. | <a href="/logout">Se déconnecter.</a></p> <img src="http://www.lyc-valadon.ac-limoges.fr/local/cache-vignettes/L250xH220/siteon0-e5814.png?1513160567" /> <a href="{{ url_for('accueil') }}">Page précédente</a> | <a href="{{ url_for('page3') }}" >Page suivante</a> </div> <div class="container-fluid" > <div class="row"> <div id='agendaG' class="col-sm-6")> <iframe src="https://calendar.google.com/calendar/embed?src=fr.french%23holiday%40group.v.calendar.google.com&ctz=Europe%2FParis" style="border: 0" width="400" height="300" frameborder="0" scrolling="no"></iframe> </div> <div id='agendaD' class="col-sm-6"> </div> </div> </div> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </body> </html>
<!DOCTYPE html> <html lang="fr"> <head> <title>Projet Bullet'journal</title> <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}"> <meta charset="UTF-8"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <div id='haut'> <h2>NINA et LEO</h2> <p> Bienvenue <strong>les poulets/poulettes</strong>. | <a href="/logout">Se déconnecter.</a></p> <img src="http://www.lyc-valadon.ac-limoges.fr/local/cache-vignettes/L250xH220/siteon0-e5814.png?1513160567" /> <a href="{{ url_for('page2') }}">Page precedente</a> </div> <div id='agenda'> <div id="todo"> <div> <h1>Todo liste</h1> Ajouter une nouvelle tâche : <form action="/ajout" method="POST"> <input type="text" name="tache"> <input type="submit" value="Enregistrer"> </form> </div> <div> <h2>Tâches non accomplies</h2> <form action="/miseajour" method="POST"> <ul> {% for tache in nonaccomplies %} <li><input type="checkbox" name="choix" value="{{tache.id}}">{{tache.libelle}}</li> {% endfor %} </ul> <input type="submit" value="Mettre à jour"> </form> </div> <div> <h2>Tâches accomplies</h2> <ul> {% for tache in accomplies %} <li>{{tache.libelle}}</li> {% endfor %} </ul> </div> </div> </div> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </body> </html>
body { background-color: white; color: white; } #agenda{ background-image:url("images/ouvert.jpg"); background-repeat:no-repeat; background-size: cover; } #todo { #margin-left:20px; padding:70px; } #toto { padding:70px; background-image:url("images/ouvertG.jpg"); background-repeat:no-repeat; } #agendaG { width:800px; padding:40px; background-image:url("images/ouvertG.jpg"); background-repeat:no-repeat; background-size:cover; } #agendaD { padding:70px; background-image:url("images/ouvertD.jpg"); background-repeat:no-repeat; background-size:cover; }
[ { "id": 1, "libelle": "Lire", "accomplie": true }, { "id": 2, "libelle": "Aller en cours", "accomplie": false }, { "id": 3, "libelle": "RDV dentiste", "accomplie": false } ]