Projektvorgaben und Strukturdokumentation aktualisiert
AGENTS.md neu angelegt: Vorgaben für TypeScript/Mithril-Entwicklung (responsives Design via w3-auto, Formatierung längerer Attributlisten, ClosureComponent-Muster, Datenmodelle in Client/models, REST-API-Gerüst). ai-context/AI-operative_Vorgaben.md und mistral-context.md an die aktuelle Projektstruktur (App_Server, Client, NGINX_Server) angepasst. Generated by Mistral Vibe. Co-Authored-By: Mistral Vibe <vibe@mistral.ai>
This commit is contained in:
1 parent
1c99dcf326
commit
16eaab8b64
3 files changed
+137
-33
No files matched your search
@@ -0,0 +1,44 @@
|
||||
# Architektur der Anwendung
|
||||
Beachte die strukturellen Vorgaben, die in ai-context/AI-operative-Vorgaben.md definiert sind.
|
||||
In den Programmen sollen aussagekräftige Kommentare in deutsch erstellt werden.
|
||||
|
||||
## Vorgaben für die Typescript und mithriljs Entwicklung
|
||||
Verwende bei der GUI primar die widgets, die es in client/Components/widgets gibt. Fehler widgets, gib eines Hinweis und erstelle einen Vorschlag für ein entsprechendes neues Widget.
|
||||
Es soll immer ein responsive Design implmentiert werden, da die App sowohl auf PCs als auch auf mobilen Geräten laufen soll.
|
||||
Verwende für Attribute der GUI-Oberfläche nach Möglichkeit Klassen aus NGINX_Server/html/static/w3.css, insbesondere wenn es darum geht, eine Respnosive Design zu implentieren.
|
||||
View-Container werden mit `w3-container.w3-auto` gewrappt, damit sie auf kleinen Bildschirmen 100% und auf großen bis max. 1140px (bzw. 95%) zentriert nutzen.
|
||||
|
||||
Bei Mithril `m(...)`-Aufrufen mit längeren Attributlisten (z.B. mehrere `style`-Eigenschaften oder mehrere Attribute) schreibe die Attribute untereinander, sobald sie in einer Zeile nicht mehr gut lesbar sind (Faustregel: mehr als 2–3 Attribute oder ein mehrzeiliges `style`-Objekt). Kurze Attributlisten (1–2 Attribute, einzeiliges `style`) dürfen in einer Zeile bleiben. Formatbeispiel:
|
||||
```typescript
|
||||
m("div.w3-bar-block.w3-border", {
|
||||
style: {
|
||||
width: '95%',
|
||||
'max-height': '220px',
|
||||
'overflow-y': 'auto',
|
||||
position: 'absolute',
|
||||
'z-index': '1000'
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
Für Symbole auf Buttons und ähnlichen Steuerelementen verwende Symbole aus den Google Material Icons.
|
||||
Erstelle die Datenmodelle für die Typescript-Entwicklung im Verzeichnis Client/Models. Erstelle für die verschiedenen Datenmodelle (Kunde, Projekt usw.) eigene .ts-Dateien. Erstelle in der jeweiligen Datei auch den Aufruf der REST-Api für die Server-Seite.
|
||||
|
||||
Bei `m.ClosureComponent` den Closure-Parameter weglassen (`() =>`) und Attribute ausschließlich über das `vnode` des jeweiligen Lifecycle-Hooks (`view`, `oninit`, `onupdate` etc.) lesen. Das `vnode` der Closure-Funktion ist ein Snapshot zum Erzeugungszeitpunkt und wird bei Redraws nicht aktualisiert — daraus gelesene `attrs` sind veraltet. Initialisierung, die `attrs` braucht, gehört nach `oninit`. Beispiel:
|
||||
```typescript
|
||||
export const Select: m.ClosureComponent<iSelect> = () => {
|
||||
// closure-State ohne Referenz auf attrs
|
||||
let search = ""
|
||||
return {
|
||||
oninit: (vnode) => {
|
||||
// vnode.attrs hier initial lesen
|
||||
search = vnode.attrs.value
|
||||
},
|
||||
view: (vnode) => {
|
||||
// vnode.attrs enthält die aktuellen Werte je Render-Durchlauf
|
||||
const options = vnode.attrs.options
|
||||
...
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
@@ -23,20 +23,42 @@
|
||||
|
||||
```text
|
||||
.
|
||||
├── .gitignore
|
||||
├── .env
|
||||
├── .env.example
|
||||
├── requirements.txt
|
||||
├── docker-compose.yml
|
||||
├── Dockerfile
|
||||
├── wsgi.py
|
||||
├── data/ ← Datenbankverzeichnis (persistente SQLite-Datei, nicht im Image)
|
||||
└── app/
|
||||
├── __init__.py
|
||||
├── config.py
|
||||
├── database.py
|
||||
├── models.py
|
||||
├── auth.py
|
||||
├── routes.py
|
||||
├── templates/
|
||||
└── static/
|
||||
├── ai-context/ # Anweisungen und Information für Mistral AI
|
||||
├── App_Server/ # Enthält Alles, was auf den Server (Backend) gehört
|
||||
│ ├── data/ # enthält die SQLite-Datenbanken
|
||||
│ ├── Dockerfile
|
||||
│ ├── root/ # Enthält alle Python-Programme
|
||||
│ │ ├── approot.py
|
||||
│ │ ├── auth # Enthält Programme zu Benutzerverwaltung
|
||||
│ │ │ ├── model/ # Enthält die Datenmodelle der Benutzerverwaltung
|
||||
│ │ │ └── routes.py
|
||||
│ │ ├── config.ini
|
||||
│ │ ├── db.py
|
||||
│ │ ├── requirements.txt
|
||||
│ │ ├── routes/ # Enthält die Route-Definitionen für Flask
|
||||
│ │ ├── runserver.py
|
||||
│ │ ├── settings.py
|
||||
│ │ └── templates/ # enthält die Vorlagen für Jinja2
|
||||
│ └── scripts/ # enthält Scripts, die im Dockjer-Container ausgeführt werden
|
||||
├── Client/ # Enthält alles, was für die Browser-basierte GUI erforderlich ist
|
||||
│ ├── Components/ # enthält die mit mithril.js entwickelten GUI-Komponenten
|
||||
│ │ ├── auth/ # enthält die GUI-Komponenten für die Benutzer-Verwaltung
|
||||
│ │ │ └── models/ # enthält die Datenmodelle für die Benutzerverwaltung
|
||||
│ │ └── widgets # enthält einzelne GUI-Elemente wie Eingabefelder u.ä., die dann in den Komponenten verwendet werden
|
||||
│ ├── index.ts
|
||||
│ ├── inireader.mjs
|
||||
│ ├── node_modules/
|
||||
├── docker-compose.base.yaml
|
||||
├── docker-compose.dev.yaml
|
||||
├── docker-compose.prod.yaml
|
||||
├── docker-compose.save.yaml
|
||||
├── Dokumentationen/ # enthält Dokumente, die für die Entwicklung wichtig sind
|
||||
├── mistral-context.md
|
||||
├── NGINX_Server/ # enthält die Konfiguration für den im Docker-Container laufenden NGINX-Server
|
||||
│ ├── certs/ # enthält die Zertifikatsdateien für die SSL-Verschlüsselung
|
||||
│ ├── configtemplates
|
||||
│ ├── Dockerfile
|
||||
│ └── html/
|
||||
│ └── static/ # enthält die statischen Elemente der GUI, wie css-Dateien und Javascript-Dateien
|
||||
└── README.md
|
||||
```
|
||||
+54
-16
@@ -22,18 +22,53 @@ cd docs/ && make html # Ergebnis: docs/_build/html/index.html
|
||||
|
||||
## Architektur
|
||||
|
||||
Das Projekt besteht aus 2 Teilen:
|
||||
- Die GUI, die im Browser läuft und mit Typescript und mithril.js erstellt wird
|
||||
- Das Backend, welches im wesentlichen mit Python, flask und sqlalchemy entwickelt wird
|
||||
Daraus ergibt sich die folgende Struktur:
|
||||
|
||||
```
|
||||
app/
|
||||
├── __init__.py # App-Factory, Flask-Initialisierung, CLI-Kommandos (db-init, seed-db)
|
||||
├── config.py # Konfiguration aus .env (12-Factor)
|
||||
├── database.py # SQLAlchemy-Instanz und Session-Setup
|
||||
├── models.py # Alle ORM-Modelle (siehe Datenmodell unten)
|
||||
├── auth.py # Zitadel-OIDC-Flow via Authlib; Rollen aus Token-Claims
|
||||
├── routes.py # Flask-Blueprints und View-Funktionen
|
||||
├── templates/ # Jinja2-Templates
|
||||
└── static/ # CSS, JS, Assets
|
||||
data/ # SQLite-Datenbankdatei (nicht im Docker-Image, persistiert als Volume)
|
||||
wsgi.py # Waitress-Einstiegspunkt
|
||||
.
|
||||
├── ai-context/ # Anweisungen und Information für Mistral AI
|
||||
├── App_Server/ # Enthält Alles, was auf den Server (Backend) gehört
|
||||
│ ├── data/ # enthält die SQLite-Datenbanken
|
||||
│ ├── Dockerfile
|
||||
│ ├── root/ # Enthält alle Python-Programme
|
||||
│ │ ├── approot.py
|
||||
│ │ ├── auth # Enthält Programme zu Benutzerverwaltung
|
||||
│ │ │ ├── model/ # Enthält die Datenmodelle der Benutzerverwaltung
|
||||
│ │ │ └── routes.py
|
||||
│ │ ├── config.ini
|
||||
│ │ ├── db.py
|
||||
│ │ ├── requirements.txt
|
||||
│ │ ├── routes/ # Enthält die Route-Definitionen für Flask
|
||||
│ │ ├── runserver.py
|
||||
│ │ ├── settings.py
|
||||
│ │ └── templates/ # enthält die Vorlagen für Jinja2
|
||||
│ └── scripts/ # enthält Scripts, die im Dockjer-Container ausgeführt werden
|
||||
├── Client/ # Enthält alles, was für die Browser-basierte GUI erforderlich ist
|
||||
│ ├── Components/ # enthält die mit mithril.js entwickelten GUI-Komponenten
|
||||
│ │ ├── auth/ # enthält die GUI-Komponenten für die Benutzer-Verwaltung
|
||||
│ │ │ └── models/ # enthält die Datenmodelle für die Benutzerverwaltung
|
||||
│ │ └── widgets # enthält einzelne GUI-Elemente wie Eingabefelder u.ä.,
|
||||
│ │ # die dann in den Komponenten verwendet werden
|
||||
│ ├── index.ts
|
||||
│ ├── inireader.mjs
|
||||
│ ├── node_modules/
|
||||
├── docker-compose.base.yaml
|
||||
├── docker-compose.dev.yaml
|
||||
├── docker-compose.prod.yaml
|
||||
├── docker-compose.save.yaml
|
||||
├── Dokumentationen/ # enthält Dokumente, die für die Entwicklung wichtig sind
|
||||
├── mistral-context.md
|
||||
├── NGINX_Server/ # enthält die Konfiguration für den im Docker-Container laufenden NGINX-Server
|
||||
│ ├── certs/ # enthält die Zertifikatsdateien für die SSL-Verschlüsselung
|
||||
│ ├── configtemplates
|
||||
│ ├── Dockerfile
|
||||
│ └── html/
|
||||
│ └── static/ # enthält die statischen Elemente der GUI, wie css-Dateien und Javascript-Dateien
|
||||
└── README.md
|
||||
|
||||
```
|
||||
|
||||
## Datenmodell
|
||||
@@ -42,12 +77,12 @@ wsgi.py # Waitress-Einstiegspunkt
|
||||
|---|---|
|
||||
| `Benutzer` | Anwendungsnutzer; Primärschlüssel ist der Zitadel-`sub` |
|
||||
| `Kunden` | Kundenstamm (Firmen oder Privatpersonen) |
|
||||
| `Kontakte` | Ansprechpartner bei einem Kunden (FK → Kunden) |
|
||||
| `Projekte` | Akquise-Projekte, einem Kunden zugeordnet |
|
||||
| `Kontakte` | Ansprechpartner bei einem Kunden (ForeignKey → Kunden) |
|
||||
| `Projekte` | Akquise-Projekte, einem Kunden zugeordnet (ForeignKey → Kunden) |
|
||||
| `Benutzer_Projekt` | n:m-Zuordnung Benutzer ↔ Projekte (Zugriffskontrolle) |
|
||||
| `Kontaktadressen` | Anrufziele innerhalb eines Projekts; importierbar via CSV/Excel (FK → Projekte) |
|
||||
| `Gesprächsnotizen` | Anrufdokumentation mit Metadaten, Freitext und Tags (FK → Kontaktadressen) |
|
||||
| `Tags` | Benutzerdefinierte Kategorien für Gesprächsnotizen |
|
||||
| `Kontaktadressen` | Anrufziele innerhalb eines Projekts; importierbar via CSV/Excel (ForeignKey → Projekte) |
|
||||
| `Gesprächsnotizen` | Anrufdokumentation mit Metadaten, Freitext und Tags (ForeignKey → Projekte, Kontaktadressen) |
|
||||
| `Tags` | Benutzerdefinierte hierarchische Kategorien für Gesprächsnotizen |
|
||||
| `Gesprächsnotizen_Tags` | n:m-Verknüpfung Gesprächsnotizen ↔ Tags |
|
||||
|
||||
## Authentifizierung & Autorisierung
|
||||
@@ -100,6 +135,9 @@ SECRET_KEY=...
|
||||
|
||||
## Weitere Vorgabedokumente
|
||||
|
||||
Alle Dateien, die sich im Verzeichnis ai-context befinden, enthalten für das Projekt wichtige Information.
|
||||
Die wichtigsten sind dabei die folgenden:
|
||||
|
||||
| Datei | Inhalt |
|
||||
|---|---|
|
||||
| `ai-context/AI-operative_Vorgaben.md` | Tech-Stack, Verzeichnisstruktur, Docker-Setup |
|
||||
|
||||
Reference in new issue
Block a user