gitadmin/INSIGHT-MVP
1
0
Fork 0
mirror of http://172.20.10.11:3000/gitadmin/INSIGHT-MVP.git synced 2026-06-24 23:56:40 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix(crm): Kontaktdaten-Card zeigt alle Allgemein-Felder konstant

Browse source 
E-Mail, Telefon, Mobil, LinkedIn, Unternehmen, Position, Abteilung
werden immer angezeigt — leere Felder mit '—' Platzhalter

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Thomas Reitz 2026-03-12 20:45:01 +01:00
parent bff4419c27
commit b746fc987d
2 changed files with 71 additions and 99 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
packages/frontend/src/crm/contacts/ContactDetailPage.module.css
View file

@ -176,6 +176,11 @@
word-break: break-word;
}
.empty {
color: var(--color-text-muted);
opacity: 0.5;
}
/* ---- Address row (full-width below infoColumns) ---- */
.addressRow {
margin-top: 1rem;

165
packages/frontend/src/crm/contacts/ContactDetailPage.tsx
View file

@ -206,61 +206,51 @@ export function ContactDetailPage() {
<div className={styles.card}>
<h2 className={styles.cardTitle}>Kontaktdaten</h2>
{/* Two sub-columns */}
{/* Two sub-columns — always show all Allgemein fields */}
<div className={styles.infoColumns}>
{/* Left: communication */}
{/* Left: Kommunikation */}
<div className={styles.infoGrid}>
{contact.email && (
<>
<span className={styles.infoLabel}>E-Mail</span>
<span className={styles.infoValue}>
<a
href={`mailto:${contact.email}`}
style={{ color: 'var(--color-primary)' }}
>
{contact.email}
</a>
</span>
</>
)}
{contact.phone && (
<>
<span className={styles.infoLabel}>Telefon</span>
<span className={styles.infoValue}>{contact.phone}</span>
</>
)}
{contact.mobile && (
<>
<span className={styles.infoLabel}>Mobil</span>
<span className={styles.infoValue}>
<a
href={`tel:${contact.mobile}`}
style={{ color: 'var(--color-primary)' }}
>
{contact.mobile}
</a>
</span>
</>
)}
{contact.linkedinUrl && (
<>
<span className={styles.infoLabel}>LinkedIn</span>
<span className={styles.infoValue}>
<a
href={contact.linkedinUrl}
target="_blank"
rel="noopener noreferrer"
style={{ color: 'var(--color-primary)' }}
>
<LinkedInIcon />
{contact.linkedinUrl.replace(
/^https?:\/\/(www\.)?linkedin\.com\/in\//,
'',
)}
</a>
</span>
</>
)}
<span className={styles.infoLabel}>E-Mail</span>
<span className={styles.infoValue}>
{contact.email ? (
<a href={`mailto:${contact.email}`} style={{ color: 'var(--color-primary)' }}>
{contact.email}
</a>
) : <span className={styles.empty}>—</span>}
</span>
<span className={styles.infoLabel}>Telefon</span>
<span className={styles.infoValue}>
{contact.phone ?? <span className={styles.empty}>—</span>}
</span>
<span className={styles.infoLabel}>Mobil</span>
<span className={styles.infoValue}>
{contact.mobile ? (
<a href={`tel:${contact.mobile}`} style={{ color: 'var(--color-primary)' }}>
{contact.mobile}
</a>
) : <span className={styles.empty}>—</span>}
</span>
<span className={styles.infoLabel}>LinkedIn</span>
<span className={styles.infoValue}>
{contact.linkedinUrl ? (
<a
href={contact.linkedinUrl}
target="_blank"
rel="noopener noreferrer"
style={{ color: 'var(--color-primary)' }}
>
<LinkedInIcon />
{contact.linkedinUrl.replace(
/^https?:\/\/(www\.)?linkedin\.com\/in\//,
'',
)}
</a>
) : <span className={styles.empty}>—</span>}
</span>
{contact.website && (
<>
<span className={styles.infoLabel}>Website</span>
@ -278,12 +268,12 @@ export function ContactDetailPage() {
)}
</div>
{/* Right: context */}
{/* Right: Kontext */}
<div className={styles.infoGrid}>
{contact.company && (
<>
<span className={styles.infoLabel}>Unternehmen</span>
<span className={styles.infoValue}>
<span className={styles.infoLabel}>Unternehmen</span>
<span className={styles.infoValue}>
{contact.company ? (
<>
<Link
to={`/crm/companies/${contact.company.id}`}
style={{ color: 'var(--color-primary)' }}
@ -291,35 +281,24 @@ export function ContactDetailPage() {
{contact.company.name}
</Link>
{contact.company.industry && (
<span
style={{
color: 'var(--color-text-muted)',
marginLeft: '0.5rem',
fontSize: '0.8125rem',
}}
>
<span style={{ color: 'var(--color-text-muted)', marginLeft: '0.5rem', fontSize: '0.8125rem' }}>
({contact.company.industry})
</span>
)}
</span>
</>
)}
{contact.position && (
<>
<span className={styles.infoLabel}>Position</span>
<span className={styles.infoValue}>
{contact.position}
</span>
</>
)}
{contact.department && (
<>
<span className={styles.infoLabel}>Abteilung</span>
<span className={styles.infoValue}>
{contact.department}
</span>
</>
)}
</>
) : <span className={styles.empty}>—</span>}
</span>
<span className={styles.infoLabel}>Position</span>
<span className={styles.infoValue}>
{contact.position ?? <span className={styles.empty}>—</span>}
</span>
<span className={styles.infoLabel}>Abteilung</span>
<span className={styles.infoValue}>
{contact.department ?? <span className={styles.empty}>—</span>}
</span>
{contact.birthday && (
<>
<span className={styles.infoLabel}>Geburtsdatum</span>
@ -341,12 +320,7 @@ export function ContactDetailPage() {
<span className={styles.infoLabel}>Status</span>
<span
className={styles.infoValue}
style={{
color:
contact.status === 'BLOCKED'
? '#991b1b'
: 'var(--color-text-muted)',
}}
style={{ color: contact.status === 'BLOCKED' ? '#991b1b' : 'var(--color-text-muted)' }}
>
{ENTITY_STATUS_LABELS[contact.status] ?? contact.status}
</span>
@ -361,16 +335,9 @@ export function ContactDetailPage() {
<div className={styles.infoGrid}>
<span className={styles.infoLabel}>Adresse</span>
<span className={styles.infoValue}>
{contact.street && (
<>
{contact.street}
<br />
</>
)}
{contact.street && <>{contact.street}<br /></>}
{contact.zip} {contact.city}
{contact.country && contact.country !== 'DE' && (
<>, {contact.country}</>
)}
{contact.country && contact.country !== 'DE' && <>, {contact.country}</>}
</span>
</div>
</div>