Hello,
I’m currently trying to make an a web application using Flask. But I have proublems to define routes and views for the web app, such as a login page for the brigadiers, a form to enter the production data.
My question is, did I not connect something okay or am I missing something?
When I get to the login page and click on login it won’t redirect me to the next part of the hmtl part of the app1,
do I have to add something else to my routing in others app like in index or nav?
Any help would be great, thank you.
Here is my app for now:.
index.py
from dash import dcc
from dash import html
from dash.dependencies import Input, Output
from app import app
from apps import app1, app2
import nav
app.layout = html.Div(
[dcc.Location(id="url", refresh=False), html.Div(id="page-content")]
)
# "complete" layout
app.validation_layout = html.Div(
[
app1.layout,
app2.layout,
nav.layout,
app.layout,
]
)
@app.callback(Output("page-content", "children"), [Input("url", "pathname")])
def display_page(pathname):
if pathname == "/":
return nav.layout
elif pathname == "/apps/Enter_Daily_Production":
# app.title ="Enter Data for Sewing Report"
return app1.layout
elif pathname == "/apps/Cell_Data_Dashboard":
# app.title = "Report of Daily Sewing Process"
return app2.layout
else:
return "404"
if __name__ == "__main__":
app.run_server(debug=True, port=8080)
In here I define the index page and call the navigation file with the applications.
app.py
import dash
import dash_bootstrap_components as dbc
import dash_auth
import user_mgmt
app = dash.Dash(__name__)
server = app.server
app.title = "BDE Sewing Report ZE"
auth = dash_auth.BasicAuth(app, user_mgmt.read_users())
app1.py
import dash
import dash_html_components as html
import dash_core_components as dcc
import pandas as pd
import pyodbc
from dash.dependencies import Input, Output, State
# import connect
import pandas as pd
from app import app
import mssql_queries
import mssql_conn
import constants
import mysql_queries
import io
import base64
# Define the Dash app
app = dash.Dash(__name__)
# Define layout for the web app
content = html.Div([
# Login page for the brigadiers
html.Div([
html.H1('Login Page', className='text-center'),
dcc.Input(id='username', type='text', placeholder='Enter username', className='form-control mb-2'),
dcc.Input(id='password', type='password', placeholder='Enter password', className='form-control mb-2'),
html.Button('Login', id='login-button', className='btn btn-primary btn-block'),
html.Div(id='login-status', className='mt-2')
], className='col-lg-4 offset-lg-4 mt-5'),
# Form to enter production data
html.Div([
html.H1('Production Data Form', className='text-center'),
dcc.Input(id='shift-id', type='text', placeholder='Enter ShiftID', className='form-control mb-2'),
dcc.Input(id='shift-start', type='text', placeholder='Enter ShiftStart', className='form-control mb-2'),
dcc.Input(id='shift-end', type='text', placeholder='Enter ShiftEnd', className='form-control mb-2'),
dcc.Input(id='brigadier-id', type='text', placeholder='Enter BrigadierID', className='form-control mb-2'),
dcc.Input(id='island-id', type='text', placeholder='Enter IslandID', className='form-control mb-2'),
html.Button('Submit', id='submit-button', className='btn btn-primary btn-block'),
html.Div(id='submit-status', className='mt-2')
], id='production-form', className='col-lg-6 offset-lg-3 mt-5', style={'display': 'none'}),
# Page to display production data
html.Div([
html.H1('Production Data', className='text-center'),
html.Table([
html.Thead([
html.Tr([
html.Th('ShiftID'),
html.Th('ShiftStart'),
html.Th('ShiftEnd'),
html.Th('BrigadierID'),
html.Th('IslandID')
])
]),
html.Tbody(id='production-table')
])
], id='production-page', className='col-lg-8 offset-lg-2 mt-5', style={'display': 'none'})
], className='container')
layout = html.Div([content])
valid_users = {'john': '12345', 'jane': 'password', 'admin': 'admin'}
# Define callback for login button
@app.callback(
Output('login-status', 'children'),
Input('login-button', 'n_clicks'),
State('username', 'value'),
State('password', 'value')
)
def login(n_clicks, username, password):
# Check if username and password are correct
if username in valid_users and valid_users[username] == password:
return 'Login successful!'
else:
return 'Invalid username or password'
# Define callback for submit button
@app.callback(
Output('submit-status', 'children'),
Input('submit-button', 'n_clicks'),
State('shift-id', 'value'),
State('shift-start', 'value'),
State('shift-end', 'value'),
State('brigadier-id', 'value'),
State('island-id', 'value')
)
def submit_data(n_clicks, shift_id, shift_start, shift_end, brigadier_id, island_id):
# Insert production data into SQL Server database
cursor = cnxn.cursor()
cursor.execute("INSERT INTO Shift (ShiftID, ShiftStart, ShiftEnd, BrigadierID, IslandID) VALUES (?, ?, ?, ?, ?)",
shift_id, shift_start, shift_end, brigadier_id, island_id)
cnxn.commit()
return 'Data submitted successfully!'
# Define callback for display production page
@app.callback(
Output('production-table', 'data'),
Input('date-picker', 'date')
)
def update_production_table(date):
# Connect to database
# Query production data for selected date
query = f"SELECT Shift.ShiftID, Shift.ShiftStart, Shift.ShiftEnd, Brigadier.BrigadierName, Island.IslandName, Production.PiecesProduced FROM Shift INNER JOIN Production ON Shift.ShiftID = Production.ShiftID INNER JOIN Brigadier ON Production.BrigadierID = Brigadier.BrigadierID INNER JOIN Island ON Production.IslandID = Island.IslandID WHERE CONVERT(date, Shift.ShiftStart) = '{date}'"
df = pd.read_sql(query)
# Close database connection
# Return production data as a dictionary
return df.to_dict('records')
if __name__ == '__main__':
app.run_server(debug=True)