<div class="account-outlet">
<div class="account-outlet__container">
<div class="account-outlet__navigation">
<nav class="account-navigation">
<h3 class="visually-hidden">Account Navigation</h3>
<div class="swiper account-navigation__main-nav">
<ul class="swiper-wrapper account-navigation__list">
<li class="swiper-slide account-navigation__list-item">
<a href="#" class="account-navigation__link--active -icon-profile" data-account-navigation-expand="1">Profil</a>
<ul class="account-navigation__sub-list--active" data-account-navigation-list-id="1">
<li class="account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link--active" data-account-navigation-sub-link-id="1">Persönliche Daten</a>
</li>
<li class="account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="2">Kommunikation</a>
</li>
<li class="account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="3">Adressen</a>
</li>
</ul>
</li>
<li class="swiper-slide account-navigation__list-item">
<a href="#" class="account-navigation__link -icon-orders" data-account-navigation-expand="2">Bestellungen</a>
<ul class="account-navigation__sub-list" data-account-navigation-list-id="2">
<li class="account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="1">Bestellübersicht</a>
</li>
<li class="account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="2">Bestellungen freigeben</a>
</li>
</ul>
</li>
<li class="swiper-slide account-navigation__list-item">
<a href="#" class="account-navigation__link -icon-analysis" data-account-navigation-expand="3">Auswertungen</a>
</li>
<li class="swiper-slide account-navigation__list-item">
<a href="#" class="account-navigation__link -icon-invoices" data-account-navigation-expand="4">Rechnungen</a>
</li>
<li class="swiper-slide account-navigation__list-item">
<a href="#" class="account-navigation__link -icon-credit-notes" data-account-navigation-expand="5">Gutschriften</a>
</li>
<li class="swiper-slide account-navigation__list-item">
<a href="#" class="account-navigation__link -icon-wishlist" data-account-navigation-expand="6">Merklisten</a>
</li>
<li class="swiper-slide account-navigation__list-item">
<a href="#" class="account-navigation__link -icon-cart" data-account-navigation-expand="7">Warenkörbe</a>
</li>
<li class="swiper-slide account-navigation__list-item">
<a href="#" class="account-navigation__link -icon-return" data-account-navigation-expand="8">Retouren</a>
<ul class="account-navigation__sub-list" data-account-navigation-list-id="8">
<li class="account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="1">Retourenübersicht</a>
</li>
<li class="account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="2">Retoure erfassen</a>
</li>
<li class="account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="3">Retourenliste</a>
</li>
</ul>
</li>
<li class="swiper-slide account-navigation__list-item">
<a href="#" class="account-navigation__link -icon-warranty" data-account-navigation-expand="9">Garantieanträge</a>
</li>
<li class="swiper-slide account-navigation__list-item">
<a href="#" class="account-navigation__link -icon-service" data-account-navigation-expand="10">Serviceanträge</a>
</li>
</ul>
</div>
<div class="account-navigation__mobile-nav">
<div class="swiper" data-account-navigation-expand="1">
<ul class="swiper-wrapper account-navigation__sub-list--active" data-account-navigation-list-id="1">
<li class="swiper-slide account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link--active" data-account-navigation-sub-link-id="1">Persönliche Daten</a>
</li>
<li class="swiper-slide account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="2">Kommunikation</a>
</li>
<li class="swiper-slide account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="3">Adressen</a>
</li>
</ul>
</div>
<div class="swiper" data-account-navigation-expand="2">
<ul class="swiper-wrapper account-navigation__sub-list" data-account-navigation-list-id="2">
<li class="swiper-slide account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="1">Bestellübersicht</a>
</li>
<li class="swiper-slide account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="2">Bestellungen freigeben</a>
</li>
</ul>
</div>
<div class="swiper" data-account-navigation-expand="3">
</div>
<div class="swiper" data-account-navigation-expand="4">
</div>
<div class="swiper" data-account-navigation-expand="5">
</div>
<div class="swiper" data-account-navigation-expand="6">
</div>
<div class="swiper" data-account-navigation-expand="7">
</div>
<div class="swiper" data-account-navigation-expand="8">
<ul class="swiper-wrapper account-navigation__sub-list" data-account-navigation-list-id="8">
<li class="swiper-slide account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="1">Retourenübersicht</a>
</li>
<li class="swiper-slide account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="2">Retoure erfassen</a>
</li>
<li class="swiper-slide account-navigation__sub-list-item">
<a href="#" class="account-navigation__sub-link" data-account-navigation-sub-link-id="3">Retourenliste</a>
</li>
</ul>
</div>
<div class="swiper" data-account-navigation-expand="9">
</div>
<div class="swiper" data-account-navigation-expand="10">
</div>
</div>
</nav>
</div>
<div class="account-outlet__content">
<div class="account-header">
<h3 class="account-header__title">Persönliche Daten</h3>
</div>
<div class="personal-data-list">
<div class="personal-data-list__column">
<h4 class="personal-data-list__title">Account</h4>
<div class="personal-data-list__area-row">
<div class="personal-data-list__area-column">
<div class="personal-data-list__key">Username</div>
<div class="personal-data-list__value">max.muster@muster.com</div>
<div class="personal-data-list__key">Passwort</div>
<div class="personal-data-list__value">*****</div>
<a href="#" class="button-icon--icon-text-regular -icon-edit">
Passwort ändern
</a>
</div>
<div class="personal-data-list__area-column">
<div class="personal-data-list__key">Rolle</div>
<div class="personal-data-list__value">Administrator</div>
<div class="personal-data-list__key">Kundennummer</div>
<div class="personal-data-list__value">999999</div>
<a href="#" class="button-icon--icon-text-regular -icon-edit">
Kundennummer wechseln
</a>
</div>
</div>
</div>
<div class="personal-data-list__column">
<h4 class="personal-data-list__title">Persönliche Daten</h4>
<div class="personal-data-list__area-row">
<div class="personal-data-list__area-column">
<div class="personal-data-list__key">Anrede</div>
<div class="personal-data-list__value">Frau</div>
<div class="personal-data-list__key">Vorname</div>
<div class="personal-data-list__value">Sabine</div>
<div class="personal-data-list__key">Nachname</div>
<div class="personal-data-list__value">Schreiber</div>
<a href="#" class="button-icon--icon-text-regular -icon-edit">
Daten bearbeiten
</a>
</div>
<div class="personal-data-list__area-column">
<div class="personal-data-list__key">Geburtsdatum</div>
<div class="personal-data-list__value">28.01.1988</div>
<div class="personal-data-list__key">Sprache</div>
<div class="personal-data-list__value">Deutsch</div>
</div>
</div>
</div>
<div class="personal-data-list__column">
<h4 class="personal-data-list__title">E-Mail</h4>
<div class="personal-data-list__area-row">
<div class="personal-data-list__area-column">
<div class="personal-data-list__key">E-Mail</div>
<div class="personal-data-list__value">s.schreiber@gmail.com</div>
<a href="#" class="button-icon--icon-text-regular -icon-edit">
E-Mail Adresse bearbeiten
</a>
</div>
</div>
</div>
<div class="personal-data-list__column">
<h4 class="personal-data-list__title">Telefon</h4>
<div class="personal-data-list__area-row">
<div class="personal-data-list__area-column">
<div class="personal-data-list__key">Telefon Mobil</div>
<div class="personal-data-list__value">076 123 44 55</div>
<a href="#" class="button-icon--icon-text-regular -icon-edit">
Telefonnummer wechseln
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% include '@SharedComponents/modules/b2b-account/templates/personal-data/personal-data.twig' %}
{
"header": {
"title": "Persönliche Daten",
"headingLevel": "3"
},
"navigation": {
"headingLevel": "3",
"title": "Account Navigation",
"items": [
{
"name": "Profil",
"href": "#",
"icon": "profile",
"active": true,
"subLinksList": [
{
"name": "Persönliche Daten",
"href": "#",
"active": true
},
{
"name": "Kommunikation",
"href": "#"
},
{
"name": "Adressen",
"href": "#"
}
]
},
{
"name": "Bestellungen",
"href": "#",
"icon": "orders",
"subLinksList": [
{
"name": "Bestellübersicht",
"href": "#"
},
{
"name": "Bestellungen freigeben",
"href": "#"
}
]
},
{
"name": "Auswertungen",
"href": "#",
"icon": "analysis"
},
{
"name": "Rechnungen",
"href": "#",
"icon": "invoices"
},
{
"name": "Gutschriften",
"href": "#",
"icon": "credit-notes"
},
{
"name": "Merklisten",
"href": "#",
"icon": "wishlist"
},
{
"name": "Warenkörbe",
"href": "#",
"icon": "cart"
},
{
"name": "Retouren",
"href": "#",
"icon": "return",
"subLinksList": [
{
"name": "Retourenübersicht",
"href": "#"
},
{
"name": "Retoure erfassen",
"href": "#"
},
{
"name": "Retourenliste",
"href": "#"
}
]
},
{
"name": "Garantieanträge",
"href": "#",
"icon": "warranty"
},
{
"name": "Serviceanträge",
"href": "#",
"icon": "service"
}
]
},
"personalDataList": {
"include": "...personal-data-list--with-edit-buttons"
}
}
No notes defined.