はじめに
- WEBで見える/更新できる、行き先掲示板を作ってみた
- 今後
- コンボボックスで行き先を選択する
- 行き先はdbに持つ
- 行き先メンテナンスもしたい
- 時間をtimepikerで入力する
- 見栄え
- ロジックがダサい
サンプル（IE11）
構成
│ app4svr.py
│ app4db.py ...事前にDB作成する用のpy
├─ templates
│ └─ app4.html
└─ static ...空
app
app4svr.py
#svr.py
from flask import Flask, render_template, request
from flask_sqlalchemy import SQLAlchemy
app = Flask(__name__)
# DB設定
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///app4.db'
app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = True
db = SQLAlchemy(app)
# db.Model を継承してクラスを定義
class Board(db.Model):
__tablename__ = 'Board'
#id
#name 名前
#destination 行き先
#backtime 戻り予定
#quittime 退社予定
id = db.Column(db.String(3), primary_key=True)
name = db.Column(db.String(20))
destination = db.Column(db.String(20))
backtime = db.Column(db.String(5))
quittime = db.Column(db.String(5))
#def __init__(self, id , name , destination , backtime , quittime ):
def __init__(self, id , name ):
self.id = id
self.name = name
self.destination = ''
self.backtime = ''
self.quittime = ''
#self.destination = destination
#self.backtime = backtime
#self.quittime = quittime
@app.route("/" , methods=["GET", "POST"])
def board():
if request.method == "GET":
# boardsをid昇順で取得
boards = Board.query.order_by(Board.id).all()
# テンプレートにwordsを渡す
return render_template('app4.html', boards=boards)
if request.method == "POST":
def chkupd( id ):
row = Board.query.get(id)
#destination
cellid = 'col' + id + 'b'
if request.form[cellid] != row.destination :
row.destination = request.form[cellid]
#backtime
cellid = 'col' + id + 'c'
if request.form[cellid] != row.backtime :
row.backtime = request.form[cellid]
#quittime
cellid = 'col' + id + 'd'
if request.form[cellid] != row.quittime :
row.quittime = request.form[cellid]
db.session.commit()
# rowが更新ありかチェック
chkupd( 'u1' )
chkupd( 'u2' )
chkupd( 'u3' )
chkupd( 'u4' )
chkupd( 'u5' )
# 再表示
# boardsをid昇順で取得
boards = Board.query.order_by(Board.id).all()
# テンプレートにwordsを渡す
return render_template('app4.html', boards=boards)
if __name__ == '__main__':
app.run(debug=True)
app4db.py
#db.py
from app4svr import db, Board
# テーブル作成
db.create_all()
# word のリストを作成
board_list = [('u1','user1'), \
('u2','user2'), \
('u3','user3'), \
('u4','user4'), \
('u5','user5') \
]
boards = [Board(d[0],d[1]) for d in board_list]
# 複数行インサート
db.session.add_all(boards)
db.session.commit()
app4.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello,Alchemy World!</title>
</head>
<body>
<div>
<h1> DESTINATION BOARD </h1>
<!-- ul でboardsを表示 -->
<form method="post" action="/">
<input type="submit" >
<input type="button" value="reload" onclick="window.location.reload();" />
<table border="1">
<!-- #name 名前 -->
<!-- #destination 行き先 -->
<!-- #backtime 戻り予定 -->
<!-- #quittime 退社予定 -->
<tr>
<th>name</th>
<th>destination</th>
<th>backtime</th>
<th>quittime</th>
</tr>
<!-- 配列 boards の件数分、li の表示を繰り返す -->
{% for board in boards %}
<tr>
<td>{{ board.name }}</td>
<td><input type="text" name="col{{ board.id }}b" value="{{ board.destination }}"></td>
<td><input type="text" name="col{{ board.id }}c" value="{{ board.backtime }}"></td>
<td><input type="text" name="col{{ board.id }}d" value="{{ board.quittime }}"></td>
</tr>
{% endfor %}
</table>
</form>
</div>
</body>
</html>