UI Fenster Größe Fehler Fix
This commit is contained in:
Daniel Nagel
parent
f8649adaf3
commit
2c0ce2b016
Binary file not shown.
|
|
@ -10,7 +10,8 @@ def initialize_db():
|
|||
cursor.execute('''
|
||||
CREATE TABLE IF NOT EXISTS ats (
|
||||
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||||
name TEXT UNIQUE
|
||||
name TEXT UNIQUE,
|
||||
code TEXT UNIQUE
|
||||
)
|
||||
''')
|
||||
|
||||
|
|
|
|||
Binary file not shown.
|
|
@ -2,35 +2,46 @@ from nicegui import ui
|
|||
from datetime import datetime
|
||||
import database
|
||||
|
||||
|
||||
def build_ui():
|
||||
ui.colors(primary='#e30013') #Firetruck Red
|
||||
with ui.card().classes("w-full h-25").style("background-color: #e30013"):
|
||||
dark = ui.dark_mode(True)
|
||||
ui.colors(primary='#e30013')
|
||||
|
||||
# 1. HAUPT-CONTAINER:
|
||||
# Spalte die exakt so hoch ist wie der Bildschirm (h-screen).
|
||||
# 'items-stretch' sorgt dafür, dass die Kinder (Header, Mitte, Footer) die volle Breite nutzen.
|
||||
with ui.column().classes('w-full h-screen no-wrap gap-0 items-stretch'):
|
||||
|
||||
# ---------------------------------------------------------
|
||||
# BEREICH OBEN (Header) - Feste Höhe (h-25)
|
||||
# ---------------------------------------------------------
|
||||
with ui.card().classes("h-25 rounded-none").style("background-color: #e30013"):
|
||||
# Hinweis: rounded-none entfernt die abgerundeten Ecken, damit es nahtlos aussieht
|
||||
ui.image('gui/logo.png').classes('absolute top-4 right-4 w-55')
|
||||
with ui.row().classes("w-full"):
|
||||
with ui.card():
|
||||
# ATS Träger Dropdown Menü
|
||||
|
||||
# ---------------------------------------------------------
|
||||
# BEREICH MITTE (Inhalt) - Variable Höhe (flex-1)
|
||||
# ---------------------------------------------------------
|
||||
# 'flex-1' ist hier entscheidend. Es sagt: "Nimm allen Platz zwischen Header und Footer".
|
||||
# 'overflow-hidden' verhindert, dass das ganze Fenster scrollt -> wir wollen nur die Tabelle scrollen.
|
||||
with ui.row().classes("w-full flex-1 p-4 gap-4 no-wrap overflow-hidden"):
|
||||
|
||||
# --- Linke Karte: Eingabemaske ---
|
||||
# 'overflow-y-auto': Falls das Formular zu lang für kleine Bildschirme wird, bekommt nur diese Karte einen Scrollbalken.
|
||||
with ui.card().classes('overflow-y-auto'):
|
||||
|
||||
traeger = database.get_ats_names()
|
||||
input_name = ui.select(label="ATS Träger Name", options=traeger, with_input=True).classes('w-full')
|
||||
# Einsatzname
|
||||
|
||||
input_location = ui.input(label='Einsatzort', placeholder='Adresse, oder Beschreibung').classes("w-full")
|
||||
|
||||
with ui.row().classes('gap-10'):
|
||||
# --- Der DATUMS-PICKER (Pop-Up) ---
|
||||
today = datetime.now().strftime("%Y-%m-%d")
|
||||
|
||||
with ui.input('Datum', value=today).classes('flex-1') as date_input:
|
||||
# Das Icon im Eingabefeld (zum Klicken)
|
||||
with date_input.add_slot('append'):
|
||||
ui.icon('event').classes('cursor-pointer') \
|
||||
.on('click', lambda: menu.open()) # Öffnet das Menü
|
||||
# Das Pop-Up Menü mit dem Kalender
|
||||
.on('click', lambda: menu.open())
|
||||
with ui.menu() as menu:
|
||||
input_date = ui.date().bind_value(date_input)
|
||||
|
||||
# --- Zeit Eingabe in Minuten ---
|
||||
input_time = ui.number(label="Dauer (Min)", value=0).classes('flex-1')
|
||||
|
||||
with ui.row().classes("gap-10 w-full items-center"):
|
||||
|
|
@ -44,12 +55,11 @@ def build_ui():
|
|||
time = input_time.value
|
||||
etype = input_type.value
|
||||
device = input_device.value
|
||||
# Hinweis: database Aufruf ist hier korrekt, sofern importiert
|
||||
database.add_data_to_einsaetze(name, location, date, time, etype, device)
|
||||
print (name, location, date, time)
|
||||
|
||||
einsaetze_table.rows = database.get_einsaetze()
|
||||
einsaetze_table.update()
|
||||
|
||||
ui.notify("Eintrag in Datenbank erstellt.")
|
||||
|
||||
def ClearForm():
|
||||
|
|
@ -57,19 +67,21 @@ def build_ui():
|
|||
input_location.value = ""
|
||||
input_date.value = today
|
||||
input_time.value = 0
|
||||
input_type.value = 0
|
||||
input_device.value = 0
|
||||
input_type.value = "Einsatz" # Achtung: Value sollte zum Toggle passen (String, nicht 0)
|
||||
input_device.value = None # Select resetten
|
||||
ui.notify("Gelöscht.")
|
||||
|
||||
ui.separator()
|
||||
ui.space()
|
||||
ui.space() # Drückt die Buttons nach unten (innerhalb der Formular-Karte)
|
||||
with ui.row().classes('w-full'):
|
||||
ui.button(text="Leeren", on_click=ClearForm)
|
||||
ui.space()
|
||||
ui.button(text="Eintragen", on_click=InputDataToTable)
|
||||
|
||||
|
||||
with ui.card().classes('flex-1 h-[85vh] p-0'):
|
||||
# --- Rechte Karte: Tabelle ---
|
||||
# 'flex-1': Diese Karte nimmt die restliche Breite der Reihe ein.
|
||||
# 'h-full': Diese Karte nutzt die volle Höhe des mittleren Bereichs.
|
||||
with ui.card().classes('flex-1 h-full p-0'):
|
||||
collums = [
|
||||
{'name': 'date', 'label': 'Datum', 'field': 'date', 'sortable': True, 'align': 'left'},
|
||||
{'name': 'name', 'label': 'Name', 'field': 'name', 'sortable': True, 'align': 'left'},
|
||||
|
|
@ -78,19 +90,21 @@ def build_ui():
|
|||
{'name': 'etype', 'label': 'Art', 'field': 'etype'},
|
||||
{'name': 'device', 'label': 'Gerät', 'field': 'device'},
|
||||
]
|
||||
# Die Tabelle selbst bekommt auch h-full, damit sie die Karte ausfüllt
|
||||
einsaetze_table = ui.table(
|
||||
columns = collums,
|
||||
rows = database.get_einsaetze(),
|
||||
row_key = "id"
|
||||
).classes("w-full h-full")
|
||||
|
||||
# ---------------------------------------------------------
|
||||
# BEREICH UNTEN (Footer) - Automatische Höhe
|
||||
# ---------------------------------------------------------
|
||||
# Hier landet dein Switch. Durch 'flex-1' im mittleren Bereich wird dieser Teil
|
||||
# immer an den unteren Bildschirmrand geschoben.
|
||||
|
||||
with ui.row().classes("p-2 pb-6 items-center"):
|
||||
dark = ui.dark_mode(True)
|
||||
# Der Switch ist nun schön in einer Leiste unten
|
||||
ui.switch('Dark mode').bind_value(dark)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user