mirror of
https://github.com/complexcaresolutions/cms.c2sgmbh.git
synced 2026-03-17 23:14:12 +00:00
Martin Porwoll
9e5c741941
New Collections: - Events: Veranstaltungen mit Datum, Ort, Registrierung - Jobs: Stellenangebote mit Standort und Bewerbungsfrist - Locations: Standorte mit Adresse, Kontakt, Öffnungszeiten - Partners: Partner/Kunden mit Logo und Beschreibung - Downloads: Dateien mit Kategorisierung und Tracking New Blocks: - EventsBlock: Veranstaltungslisten mit Kalender-Ansicht - JobsBlock: Stellenanzeigen mit Filterfunktion - LocationsBlock: Standort-Karten und Listen - PricingBlock: Preistabellen mit Feature-Vergleich - TabsBlock: Tabbed Content mit verschiedenen Stilen - AccordionBlock: FAQ/Accordion mit Animationen - ComparisonBlock: Vergleichstabellen (Tabelle, Karten, Pro/Contra) - StatsBlock: Statistiken mit Counter-Animation - LogoGridBlock: Logo-Wolken und Partner-Galerien - MapBlock: Interaktive Karten mit Markern - DownloadsBlock: Download-Listen mit Kategorien All collections support multi-tenant isolation and localization. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
381 lines
10 KiB
TypeScript
381 lines
10 KiB
TypeScript
import type { Block } from 'payload'
|
|
|
|
/**
|
|
* Tabs Block
|
|
*
|
|
* Tabbed Content für organisierte Informationen.
|
|
* Unterstützt verschiedene Tab-Stile, Icons und
|
|
* kann andere Blocks als Content enthalten.
|
|
*/
|
|
export const TabsBlock: Block = {
|
|
slug: 'tabs',
|
|
labels: {
|
|
singular: 'Tabs',
|
|
plural: 'Tabs',
|
|
},
|
|
fields: [
|
|
{
|
|
name: 'title',
|
|
type: 'text',
|
|
label: 'Überschrift',
|
|
localized: true,
|
|
},
|
|
{
|
|
name: 'subtitle',
|
|
type: 'text',
|
|
label: 'Untertitel',
|
|
localized: true,
|
|
},
|
|
// Tabs
|
|
{
|
|
name: 'tabs',
|
|
type: 'array',
|
|
label: 'Tabs',
|
|
minRows: 2,
|
|
maxRows: 10,
|
|
fields: [
|
|
{
|
|
name: 'label',
|
|
type: 'text',
|
|
required: true,
|
|
label: 'Tab-Titel',
|
|
localized: true,
|
|
},
|
|
{
|
|
name: 'icon',
|
|
type: 'select',
|
|
label: 'Icon',
|
|
options: [
|
|
{ label: 'Keines', value: 'none' },
|
|
{ label: 'Info', value: 'info' },
|
|
{ label: 'Stern', value: 'star' },
|
|
{ label: 'Herz', value: 'heart' },
|
|
{ label: 'Häkchen', value: 'check' },
|
|
{ label: 'Einstellungen', value: 'settings' },
|
|
{ label: 'Benutzer', value: 'user' },
|
|
{ label: 'Dokument', value: 'document' },
|
|
{ label: 'Bild', value: 'image' },
|
|
{ label: 'Video', value: 'video' },
|
|
{ label: 'Code', value: 'code' },
|
|
{ label: 'Chart', value: 'chart' },
|
|
{ label: 'Kalender', value: 'calendar' },
|
|
{ label: 'Standort', value: 'location' },
|
|
{ label: 'E-Mail', value: 'email' },
|
|
{ label: 'Telefon', value: 'phone' },
|
|
],
|
|
},
|
|
{
|
|
name: 'customIcon',
|
|
type: 'upload',
|
|
relationTo: 'media',
|
|
label: 'Eigenes Icon',
|
|
admin: {
|
|
description: 'Überschreibt das ausgewählte Icon',
|
|
},
|
|
},
|
|
{
|
|
name: 'badge',
|
|
type: 'text',
|
|
label: 'Badge',
|
|
admin: {
|
|
description: 'z.B. "Neu", "3", "Beta"',
|
|
},
|
|
},
|
|
// Content
|
|
{
|
|
name: 'contentType',
|
|
type: 'select',
|
|
defaultValue: 'richtext',
|
|
label: 'Content-Typ',
|
|
options: [
|
|
{ label: 'Rich Text', value: 'richtext' },
|
|
{ label: 'Bild & Text', value: 'image-text' },
|
|
{ label: 'Feature-Liste', value: 'features' },
|
|
{ label: 'Code', value: 'code' },
|
|
{ label: 'Embed', value: 'embed' },
|
|
],
|
|
},
|
|
// Rich Text Content
|
|
{
|
|
name: 'content',
|
|
type: 'richText',
|
|
label: 'Inhalt',
|
|
localized: true,
|
|
admin: {
|
|
condition: (data, siblingData) => siblingData?.contentType === 'richtext',
|
|
},
|
|
},
|
|
// Image & Text Content
|
|
{
|
|
name: 'imgTxt',
|
|
type: 'group',
|
|
label: 'Bild & Text',
|
|
admin: {
|
|
condition: (data, siblingData) => siblingData?.contentType === 'image-text',
|
|
},
|
|
fields: [
|
|
{
|
|
name: 'img',
|
|
type: 'upload',
|
|
relationTo: 'media',
|
|
label: 'Bild',
|
|
},
|
|
{
|
|
name: 'imgPos',
|
|
type: 'select',
|
|
defaultValue: 'left',
|
|
label: 'Bild-Position',
|
|
options: [
|
|
{ label: 'Links', value: 'left' },
|
|
{ label: 'Rechts', value: 'right' },
|
|
{ label: 'Oben', value: 'top' },
|
|
],
|
|
},
|
|
{
|
|
name: 'text',
|
|
type: 'richText',
|
|
label: 'Text',
|
|
localized: true,
|
|
},
|
|
],
|
|
},
|
|
// Features List
|
|
{
|
|
name: 'features',
|
|
type: 'array',
|
|
label: 'Features',
|
|
admin: {
|
|
condition: (data, siblingData) => siblingData?.contentType === 'features',
|
|
},
|
|
fields: [
|
|
{
|
|
name: 'title',
|
|
type: 'text',
|
|
required: true,
|
|
label: 'Titel',
|
|
localized: true,
|
|
},
|
|
{
|
|
name: 'description',
|
|
type: 'textarea',
|
|
label: 'Beschreibung',
|
|
localized: true,
|
|
},
|
|
{
|
|
name: 'icon',
|
|
type: 'select',
|
|
label: 'Icon',
|
|
options: [
|
|
{ label: 'Häkchen', value: 'check' },
|
|
{ label: 'Stern', value: 'star' },
|
|
{ label: 'Pfeil', value: 'arrow' },
|
|
{ label: 'Punkt', value: 'dot' },
|
|
{ label: 'Nummer', value: 'number' },
|
|
],
|
|
},
|
|
],
|
|
},
|
|
// Code Content
|
|
{
|
|
name: 'code',
|
|
type: 'group',
|
|
label: 'Code',
|
|
admin: {
|
|
condition: (data, siblingData) => siblingData?.contentType === 'code',
|
|
},
|
|
fields: [
|
|
{
|
|
name: 'language',
|
|
type: 'select',
|
|
label: 'Sprache',
|
|
options: [
|
|
{ label: 'JavaScript', value: 'javascript' },
|
|
{ label: 'TypeScript', value: 'typescript' },
|
|
{ label: 'HTML', value: 'html' },
|
|
{ label: 'CSS', value: 'css' },
|
|
{ label: 'JSON', value: 'json' },
|
|
{ label: 'Python', value: 'python' },
|
|
{ label: 'Bash', value: 'bash' },
|
|
{ label: 'SQL', value: 'sql' },
|
|
],
|
|
},
|
|
{
|
|
name: 'code',
|
|
type: 'code',
|
|
label: 'Code',
|
|
},
|
|
{
|
|
name: 'showLineNumbers',
|
|
type: 'checkbox',
|
|
defaultValue: true,
|
|
label: 'Zeilennummern anzeigen',
|
|
},
|
|
],
|
|
},
|
|
// Embed Content
|
|
{
|
|
name: 'embed',
|
|
type: 'group',
|
|
label: 'Embed',
|
|
admin: {
|
|
condition: (data, siblingData) => siblingData?.contentType === 'embed',
|
|
},
|
|
fields: [
|
|
{
|
|
name: 'type',
|
|
type: 'select',
|
|
label: 'Typ',
|
|
options: [
|
|
{ label: 'YouTube', value: 'youtube' },
|
|
{ label: 'Vimeo', value: 'vimeo' },
|
|
{ label: 'iFrame', value: 'iframe' },
|
|
],
|
|
},
|
|
{
|
|
name: 'url',
|
|
type: 'text',
|
|
label: 'URL',
|
|
},
|
|
{
|
|
name: 'aspectRatio',
|
|
type: 'select',
|
|
defaultValue: '16:9',
|
|
label: 'Seitenverhältnis',
|
|
options: [
|
|
{ label: '16:9', value: '16:9' },
|
|
{ label: '4:3', value: '4:3' },
|
|
{ label: '1:1', value: '1:1' },
|
|
],
|
|
},
|
|
],
|
|
},
|
|
],
|
|
},
|
|
// Tab Style
|
|
{
|
|
name: 'tabStyle',
|
|
type: 'select',
|
|
defaultValue: 'underline',
|
|
label: 'Tab-Stil',
|
|
options: [
|
|
{ label: 'Unterstrichen', value: 'underline' },
|
|
{ label: 'Boxed', value: 'boxed' },
|
|
{ label: 'Pills', value: 'pills' },
|
|
{ label: 'Buttons', value: 'buttons' },
|
|
{ label: 'Vertikal', value: 'vertical' },
|
|
],
|
|
},
|
|
{
|
|
name: 'tabPosition',
|
|
type: 'select',
|
|
defaultValue: 'top',
|
|
label: 'Tab-Position',
|
|
options: [
|
|
{ label: 'Oben', value: 'top' },
|
|
{ label: 'Links', value: 'left' },
|
|
{ label: 'Rechts', value: 'right' },
|
|
{ label: 'Unten', value: 'bottom' },
|
|
],
|
|
admin: {
|
|
condition: (data, siblingData) => siblingData?.tabStyle !== 'vertical',
|
|
},
|
|
},
|
|
{
|
|
name: 'tabAlignment',
|
|
type: 'select',
|
|
defaultValue: 'left',
|
|
label: 'Tab-Ausrichtung',
|
|
options: [
|
|
{ label: 'Links', value: 'left' },
|
|
{ label: 'Zentriert', value: 'center' },
|
|
{ label: 'Rechts', value: 'right' },
|
|
{ label: 'Gleichmäßig verteilt', value: 'stretch' },
|
|
],
|
|
admin: {
|
|
condition: (data, siblingData) =>
|
|
siblingData?.tabPosition === 'top' || siblingData?.tabPosition === 'bottom',
|
|
},
|
|
},
|
|
// Verhalten
|
|
{
|
|
name: 'defaultTab',
|
|
type: 'number',
|
|
defaultValue: 0,
|
|
min: 0,
|
|
label: 'Standard-Tab (Index)',
|
|
admin: {
|
|
description: '0 = erster Tab',
|
|
},
|
|
},
|
|
{
|
|
name: 'allowKeyboardNavigation',
|
|
type: 'checkbox',
|
|
defaultValue: true,
|
|
label: 'Tastatur-Navigation',
|
|
},
|
|
{
|
|
name: 'animated',
|
|
type: 'checkbox',
|
|
defaultValue: true,
|
|
label: 'Animierter Übergang',
|
|
},
|
|
{
|
|
name: 'lazy',
|
|
type: 'checkbox',
|
|
defaultValue: false,
|
|
label: 'Lazy Loading',
|
|
admin: {
|
|
description: 'Tab-Inhalte erst bei Aktivierung laden',
|
|
},
|
|
},
|
|
// Mobile
|
|
{
|
|
name: 'mobileStyle',
|
|
type: 'select',
|
|
defaultValue: 'scroll',
|
|
label: 'Mobile-Ansicht',
|
|
options: [
|
|
{ label: 'Scrollbar', value: 'scroll' },
|
|
{ label: 'Dropdown', value: 'dropdown' },
|
|
{ label: 'Accordion', value: 'accordion' },
|
|
{ label: 'Gestapelt', value: 'stacked' },
|
|
],
|
|
},
|
|
// Styling
|
|
{
|
|
name: 'backgroundColor',
|
|
type: 'select',
|
|
defaultValue: 'white',
|
|
label: 'Hintergrund',
|
|
options: [
|
|
{ label: 'Weiß', value: 'white' },
|
|
{ label: 'Hell (Grau)', value: 'light' },
|
|
{ label: 'Dunkel', value: 'dark' },
|
|
{ label: 'Transparent', value: 'transparent' },
|
|
],
|
|
},
|
|
{
|
|
name: 'contentBackground',
|
|
type: 'select',
|
|
defaultValue: 'white',
|
|
label: 'Content-Hintergrund',
|
|
options: [
|
|
{ label: 'Weiß', value: 'white' },
|
|
{ label: 'Hell (Grau)', value: 'light' },
|
|
{ label: 'Transparent', value: 'transparent' },
|
|
],
|
|
},
|
|
{
|
|
name: 'showBorder',
|
|
type: 'checkbox',
|
|
defaultValue: true,
|
|
label: 'Rahmen anzeigen',
|
|
},
|
|
{
|
|
name: 'fullWidth',
|
|
type: 'checkbox',
|
|
defaultValue: false,
|
|
label: 'Volle Breite',
|
|
},
|
|
],
|
|
}
|