- Introduced typography styles in _typography.scss for headings, paragraphs, blockquotes, and horizontal rules. - Added utility classes in _utils.scss for card styling and clearfix. - Updated layout.scss to include new typography and utility styles. - Defined common CSS variables in _common.scss for consistent theming. - Created dark and light theme variables in _dark.scss and _light.scss respectively. - Integrated Tailwind CSS with custom configurations in tailwind.config.js and postcss.config.js. - Implemented database migrations for contact and contact_persons tables. - Added data fixtures for generating sample contact data. - Developed Contact and ContactPerson entities with appropriate validation and serialization. - Enhanced ContactRepository with search and type filtering methods.
5.6 KiB
5.6 KiB
Kontaktmodul
Übersicht
Das Kontaktmodul verwaltet Firmenkontakte (Debitoren/Kreditoren) mit bis zu 2 Ansprechpartnern pro Firma.
Entities
Contact
Hauptentity für Firmenkontakte mit folgenden Feldern:
Firmendaten:
companyName(Pflicht): FirmennamecompanyNumber: Kundennummerstreet: StraßezipCode: PLZcity: Ortcountry: Landphone: Telefonfax: Faxemail: E-Mailwebsite: WebsitetaxNumber: SteuernummervatNumber: USt-IdNr.
Klassifizierung:
isDebtor: Ist Debitor (boolean)isCreditor: Ist Kreditor (boolean)isActive: Ist aktiv (boolean)
Sonstiges:
notes: Notizen (Text)contactPersons: Collection von Ansprechpartnern (OneToMany)createdAt: ErstellungsdatumupdatedAt: Änderungsdatum
ContactPerson
Ansprechpartner-Entity mit folgenden Feldern:
salutation: Anrede (Herr/Frau/Divers)title: Titel (z.B. Dr., Prof.)firstName(Pflicht): VornamelastName(Pflicht): Nachnameposition: Positiondepartment: Abteilungphone: Telefonmobile: Mobilemail: E-MailisPrimary: Hauptansprechpartner (boolean)
API Endpoints
Kontakte
GET /api/contacts- Alle Kontakte auflistenGET /api/contacts/{id}- Einzelnen Kontakt abrufenPOST /api/contacts- Neuen Kontakt erstellen (erfordert ROLE_USER)PUT /api/contacts/{id}- Kontakt bearbeiten (erfordert ROLE_USER)DELETE /api/contacts/{id}- Kontakt löschen (erfordert ROLE_ADMIN)
Request/Response Format
Kontakt erstellen/bearbeiten:
{
"companyName": "Beispiel GmbH",
"companyNumber": "K-12345",
"street": "Musterstraße 123",
"zipCode": "12345",
"city": "Berlin",
"country": "Deutschland",
"phone": "+49 30 12345678",
"fax": "+49 30 12345679",
"email": "info@beispiel.de",
"website": "https://www.beispiel.de",
"taxNumber": "123/456/78901",
"vatNumber": "DE123456789",
"isDebtor": true,
"isCreditor": false,
"isActive": true,
"notes": "Wichtiger Kunde",
"contactPersons": [
{
"salutation": "Herr",
"title": "Dr.",
"firstName": "Max",
"lastName": "Mustermann",
"position": "Geschäftsführer",
"department": "Management",
"phone": "+49 30 12345680",
"mobile": "+49 170 1234567",
"email": "max.mustermann@beispiel.de",
"isPrimary": true
}
]
}
Repository-Methoden
ContactRepository
findByType(?bool $isDebtor, ?bool $isCreditor): array
- Filtert Kontakte nach Typ (Debitor/Kreditor)
- Gibt nur aktive Kontakte zurück
- Sortiert nach Firmennamen
search(string $searchTerm): array
- Durchsucht Kontakte nach:
- Firmenname
- Stadt
- Ansprechpartner (Vor-/Nachname, E-Mail)
Vue.js Komponente
ContactManagement.vue
Features:
- DataTable mit Pagination (10/25/50 Einträge)
- Globale Suche über alle Felder
- Filter nach Typ (Alle/Debitoren/Kreditoren)
- Sortierung nach Spalten
- CRUD-Operationen über Dialoge
- Bis zu 2 Ansprechpartner pro Kontakt
- Validierung (Pflichtfelder, E-Mail-Format, URL-Format)
- Responsive Design (mobile + desktop)
- Toast-Benachrichtigungen für Erfolg/Fehler
- Bestätigungsdialog beim Löschen
Verwendete PrimeVue Komponenten:
- DataTable, Column
- Dialog
- Card
- Button
- InputText, Textarea
- Checkbox, Dropdown
- Tag
- Divider
- IconField, InputIcon
Berechtigungen
- ROLE_USER: Kann Kontakte ansehen, erstellen und bearbeiten
- ROLE_ADMIN: Kann zusätzlich Kontakte löschen
Navigation
Das Kontaktmodul ist über den Menüpunkt "Kontakte" erreichbar (Route: /contacts).
Datenbank-Tabellen
contacts
CREATE TABLE contacts (
id INT AUTO_INCREMENT PRIMARY KEY,
company_name VARCHAR(255) NOT NULL,
company_number VARCHAR(50),
street TEXT,
zip_code VARCHAR(20),
city VARCHAR(100),
country VARCHAR(100),
phone VARCHAR(50),
fax VARCHAR(50),
email VARCHAR(180),
website VARCHAR(255),
tax_number VARCHAR(50),
vat_number VARCHAR(50),
is_debtor TINYINT(1) DEFAULT 0,
is_creditor TINYINT(1) DEFAULT 0,
is_active TINYINT(1) DEFAULT 1,
notes TEXT,
created_at DATETIME NOT NULL,
updated_at DATETIME,
INDEX idx_company_name (company_name),
INDEX idx_city (city),
INDEX idx_is_debtor (is_debtor),
INDEX idx_is_creditor (is_creditor),
INDEX idx_is_active (is_active)
);
contact_persons
CREATE TABLE contact_persons (
id INT AUTO_INCREMENT PRIMARY KEY,
contact_id INT NOT NULL,
salutation VARCHAR(20),
title VARCHAR(100),
first_name VARCHAR(100) NOT NULL,
last_name VARCHAR(100) NOT NULL,
position VARCHAR(100),
department VARCHAR(100),
phone VARCHAR(50),
mobile VARCHAR(50),
email VARCHAR(180),
is_primary TINYINT(1) DEFAULT 0,
FOREIGN KEY (contact_id) REFERENCES contacts(id) ON DELETE CASCADE,
INDEX idx_contact_id (contact_id),
INDEX idx_is_primary (is_primary)
);
Best Practices
- Ansprechpartner-Limit: Maximal 2 Ansprechpartner pro Kontakt (UI-Limitierung)
- Cascade Delete: Beim Löschen eines Kontakts werden auch alle Ansprechpartner gelöscht
- Timestamps: Automatische Verwaltung von
createdAtundupdatedAt - Validierung: Alle Validierungen erfolgen sowohl im Backend (Symfony Validator) als auch im Frontend (Vue.js)
- Session-basierte API: Alle API-Aufrufe verwenden
credentials: 'include'für Session-Authentifizierung
Erweiterungsmöglichkeiten
- Aktivitäten-Tracking (Anrufe, E-Mails, Meetings)
- Dokumente-Verwaltung
- Deals/Opportunities
- Import/Export (CSV, Excel)
- Duplikatserkennung
- Kontakt-Historie
- Tags/Labels
- Mehr als 2 Ansprechpartner (aktuell UI-limitiert)