templates/menu/topbar.html.twig line 1

  1. <!-- Template für die Menüstruktur -->
  3. {% set temp = app.request.get('_route')|split('_') %}
  4. {% set link = temp[0] %}
  6. {% set menu_dashboard     = ["dashboard"] %}
  7. {% set menu_nutzer        = ["nutzer"] %}
  8. {% set menu_nutzergruppen = ["nutzergruppen"] %}
  9. {% set menu_inhalte       = ["inhalte"] %}
  10. {% set menu_einstellungen = ["einstellungen"] %}
  11. {% set menu_listen        = ["auswahllisten"] %}
  12. {% set menu_vertraege     = ["vertraege"] %}
  13. {% set menu_kontoauszug   = ["kontoauszuege"] %}
  14. {% set menu_rechnungen    = ["rechnungen"] %}
  15. {% set menu_anliegen      = ["anliegen"] %}
  16. {% set menu_kontakt       = ["kontakt"] %}
  17. {% set menu_nutzerkonten  = ["nutzerkontent"] %}
  18. {% set menu_transaktionen = ["transaktionen"] %}
  19. {% set menu_vertragswesen = ["vertragswesen"] %}
  21. <!-- Anzeige für die Breadcrumb -->
  23. {% set breadcrumb = { 'tarifrechner': 'Tarifrechner', 'dashboard': 'Übersicht', 'profil': 'Profil'} %}
  24. {% set portaltitel = "Energieportal" %}
  26. {% if app.session.get('texte')["login-10"] is defined and app.session.get('texte')["login-10"] is not empty %}
  27.     {% set portaltitel = app.session.get('texte')["login-10"] %}
  28. {% endif %}
  30. <!-- BEGIN: Mobile Menu -->
  31. <div class="mobile-menu md:hidden">
  32.     <div class="mobile-menu-bar">
  33.         <a href="/" class="flex mr-auto">
  34.             <img alt="" class="w-20" src="{% if app.session.get('logo') %}/customerdata/{{ app.session.get('logo') }}{% else %}/images/logo-msu-farbig.svg{% endif %}"
  35.             data-farbe="{% if app.session.get('logo') %}/customerdata/{{ app.session.get('logo') }}{% else %}/images/logo-msu-farbig.svg{% endif %}" 
  36.       data-graustufen="{% if app.session.get('logo-graustufen') %}/customerdata/{{ app.session.get('logo-graustufen') }}{% endif %}" 
  37.       data-schwarzweiss="{% if app.session.get('logo-schwarzweiss') %}/customerdata/{{ app.session.get('logo-schwarzweiss') }}{% endif %}">
  38.         </a>
  39.         {% if is_granted("ROLE_USER") %}
  40.         <a href="javascript:;" class="mobile-menu-toggler">
  41.             <i data-lucide="bar-chart-2" class="w-8 h-8 text-white transform -rotate-90"></i>
  42.         </a>
  43.         {% endif %}
  44.     </div>
  45.     {% if is_granted("ROLE_USER") %}
  46.     <div class="scrollable">
  47.         <a href="javascript:;" class="mobile-menu-toggler">
  48.             <i data-lucide="x-circle" class="w-8 h-8 text-white transform -rotate-90"></i>
  49.         </a>
  50.         <ul class="scrollable__content py-2">
  51.             <li>
  52.                 <a href="javascript:;.html" class="menu menu--active">
  53.                     <div class="menu__icon">
  54.                         <i data-lucide="home"></i>
  55.                     </div>
  56.                     <div class="menu__title">
  57.                         Menü
  58.                         <i data-lucide="chevron-down" class="menu__sub-icon transform rotate-180"></i>
  59.                     </div>
  60.                 </a>
  61.                 <ul class="menu__sub-open">
  62.                     {% if is_granted("ROLE_ADMIN") %}
  63.                         <li>
  64.                             <a href="/dashboard" class="menu {% if link in menu_dashboard %}side-menu--active{% endif %}">
  65.                                 <div class="menu__icon">
  66.                                     <i data-lucide="activity"></i>
  67.                                 </div>
  68.                                 <div class="menu__title">
  69.                                     Startseite
  70.                                 </div>
  71.                             </a>
  72.                         </li>
  73.                         <li>
  74.                             <a href="/nutzer/" class="menu {% if link in menu_nutzer %}side-menu--active{% endif %}">
  75.                                 <div class="menu__icon">
  76.                                     <i data-lucide="user"></i>
  77.                                 </div>
  78.                                 <div class="menu__title">
  79.                                     Nutzer
  80.                                 </div>
  81.                             </a>
  82.                         </li>
  83.                         <li>
  84.                             <a href="/gruppen/" class="menu {% if link in menu_nutzergruppen %}side-menu--active{% endif %}">
  85.                                 <div class="menu__icon">
  86.                                     <i data-lucide="users"></i>
  87.                                 </div>
  88.                                 <div class="menu__title">
  89.                                     Gruppen
  90.                                 </div>
  91.                             </a>
  92.                         </li>
  93.                         <li>
  94.                             <a href="/inhalte/" class="menu {% if link in menu_inhalte %}side-menu--active{% endif %}">
  95.                                 <div class="menu__icon">
  96.                                     <i data-lucide="book"></i>
  97.                                 </div>
  98.                                 <div class="menu__title">
  99.                                     Inhalte
  100.                                 </div>
  101.                             </a>
  102.                         </li>
  103.                         <li>
  104.                             <a href="/einstellungen/" class="menu {% if link in menu_einstellungen %}side-menu--active{% endif %}">
  105.                                 <div class="menu__icon">
  106.                                     <i data-lucide="settings"></i>
  107.                                 </div>
  108.                                 <div class="menu__title">
  109.                                     Einstellungen
  110.                                 </div>
  111.                             </a>
  112.                         </li>
  113.                         <li>
  114.                             <a href="/auswahllisten/" class="menu {% if link in menu_listen %}side-menu--active{% endif %}">
  115.                                 <div class="menu__icon">
  116.                                     <i data-lucide="list"></i>
  117.                                 </div>
  118.                                 <div class="menu__title">
  119.                                     Auswahllisten
  120.                                 </div>
  121.                             </a>
  122.                         </li>
  123.                         <li>
  124.                             <a href="/?edit=1" class="menu {% if link in menu_listen %}side-menu--active{% endif %}">
  125.                                 <div class="menu__icon">
  126.                                     <i data-lucide="edit"></i>
  127.                                 </div>
  128.                                 <div class="menu__title">
  129.                                     Login bearbeiten
  130.                                 </div>
  131.                             </a>
  132.                         </li>
  133.                     {% else %}
  134.                         <li>
  135.                             <a href="/vertraege/" class="menu {% if link in menu_vertraege %}side-menu--active{% endif %}">
  136.                                 <div class="menu__icon">
  137.                                     <i data-lucide="file-text"></i>
  138.                                 </div>
  139.                                 <div class="menu__title">
  140.                                     Verträge
  141.                                 </div>
  142.                             </a>
  143.                         </li>
  144.                         <li>
  145.                             <a href="/kontoauszuege/" class="menu {% if link in menu_kontoauszug %}side-menu--active{% endif %}">
  146.                                 <div class="menu__icon">
  147.                                     <i data-lucide="credit-card"></i>
  148.                                 </div>
  149.                                 <div class="menu__title">
  150.                                     Kontoauszüge
  151.                                 </div>
  152.                             </a>
  153.                         </li>
  154.                         <li>
  155.                             <a href="/rechnungen/" class="menu {% if link in menu_rechnungen %}side-menu--active{% endif %}">
  156.                                 <div class="menu__icon">
  157.                                     <i data-lucide="file-plus"></i>
  158.                                 </div>
  159.                                 <div class="menu__title">
  160.                                     Dokumente
  161.                                 </div>
  162.                             </a>
  163.                         </li>
  164.                         <li>
  165.                             <a href="/transaktionen/" class="menu {% if link in menu_transaktionen %}side-menu--active{% endif %}">
  166.                                 <div class="menu__icon">
  167.                                     <i data-lucide="rss"></i>
  168.                                 </div>
  169.                                 <div class="menu__title">Anliegen</div>
  170.                             </a>
  171.                         </li>
  172.                         <li>
  173.                             <a href="javascript:;" class="menu">
  174.                                 <div class="menu__icon">
  175.                                     <i data-lucide="mail"></i>
  176.                                 </div>
  177.                                 <div class="menu__title">
  178.                                     Kontakt
  179.                                     <div class="menu__sub-icon ">
  180.                                         <i data-lucide="chevron-down"></i>
  181.                                     </div>
  182.                                 </div>
  183.                             </a>
  184.                             <ul class="">
  185.                                 <li>
  186.                                     <a href="/kontakt/" class="menu {% if link in menu_kontakt %}side-menu--active{% endif %}">
  187.                                         <div class="menu__icon">
  188.                                             <i data-lucide="mail"></i>
  189.                                         </div>
  190.                                         <div class="menu__title">Kontaktformular</div>
  191.                                     </a>
  192.                                 </li>
  193.                                 <li>
  194.                                     <a href="/kontakt/?betreff=auszug" class="menu">
  195.                                         <div class="menu__icon">
  196.                                             <i data-lucide="navigation"></i>
  197.                                         </div>
  198.                                         <div class="menu__title">Auszug melden</div>
  199.                                     </a>
  200.                                 </li>
  201.                                 <li>
  202.                                     <a href="/profil/#belegempfaener" class="menu">
  203.                                         <div class="menu__icon">
  204.                                             <i data-lucide="user-plus"></i>
  205.                                         </div>
  206.                                         <div class="menu__title">Belegempfänger</div>
  207.                                     </a>
  208.                                 </li>
  209.                             </ul>
  210.                         </li>
  211.                         <li>
  212.                             <a href="/nutzerkonten/" class="menu {% if link in menu_nutzerkonten %}side-menu--active{% endif %}">
  213.                                 <div class="menu__icon">
  214.                                     <i data-lucide="copy"></i>
  215.                                 </div>
  216.                                 <div class="menu__title">Nutzerkonten</div>
  217.                             </a>
  218.                         </li>
  219.                     {% endif %}
  220.                 </ul>
  221.             </li>
  222.         </ul>
  223.     </div>
  224.     {% endif %}
  225. </div>
  226. <!-- END: Mobile Menu -->
  227. <!-- BEGIN: Top Bar -->
  228. <div class="top-bar-boxed h-[70px] md:h-[65px] z-[51] border-b border-white/[0.08] mt-12 md:mt-0 -mx-3 sm:-mx-8 md:-mx-0 px-3 md:border-b-0 relative md:fixed md:inset-x-0 md:top-0 sm:px-8 md:px-10 md:pt-10 md:bg-gradient-to-b md:from-slate-100 md:to-transparent dark:md:from-darkmode-700">
  229.     <div
  230.         class="h-full flex items-center">
  231.         <!-- BEGIN: Logo -->
  232.         <a href="/" class="logo -intro-x hidden md:flex xl:w-[180px] block">
  233.             <img alt="" class="logo__image w-20" src="{% if app.session.get('logo') %}/customerdata/{{ app.session.get('logo') }}{% else %}/images/logo-msu-farbig.svg{% endif %}" 
  234.             data-farbe="{% if app.session.get('logo') %}/customerdata/{{ app.session.get('logo') }}{% else %}/images/logo-msu-farbig.svg{% endif %}" 
  235.       data-graustufen="{% if app.session.get('logo-graustufen') %}/customerdata/{{ app.session.get('logo-graustufen') }}{% endif %}" 
  236.       data-schwarzweiss="{% if app.session.get('logo-schwarzweiss') %}/customerdata/{{ app.session.get('logo-schwarzweiss') }}{% endif %}">
  237.             <span class="logo__text text-white text-lg ml-3"></span>
  238.         </a>
  239.         <!-- END: Logo -->
  240.         <!-- BEGIN: Breadcrumb -->
  241.         <nav aria-label="breadcrumb" class="-intro-x h-[45px] mr-auto">
  242.             <ol class="breadcrumb breadcrumb-light">
  243.                 <li class="breadcrumb-item">
  244.                     <a href="/">{{ portaltitel }}</a>
  245.                 </li>
  246.                 <li class="breadcrumb-item active" aria-current="page"><a href="/tarifrechner">Tarifrechner</a></li>
  247.             </ol>
  248.         </nav>
  249.         <!-- END: Breadcrumb -->
  251.         {% if is_granted('ROLE_USER') %}
  252.             <!-- BEGIN: Notifications -->
  253.             <div class="intro-x dropdown mr-4 sm:mr-6">
  254.                 <div class="konten-dropdown dropdown-toggle notification notification--bullet cursor-pointer" role="button" aria-expanded="false" data-tw-toggle="dropdown">
  255.                     <i data-lucide="file-text" class="notification__icon dark:text-slate-500"></i>
  256.                 </div>
  257.                 <div class="notification-content pt-2 dropdown-menu">
  258.                     <div class="notification-content__box dropdown-content">
  259.                         <div class="notification-content__title text-white">Kontoliste</div>
  260.                         <hr class="dropdown-divider border-white/[0.08]">
  262.                         {% for key,value in app.session.get('kundennummern') %}
  263.                             <div class="cursor-pointer relative flex items-center mt-5">
  264.                                 <div class="overflow-hidden">
  265.                                     <div class="flex items-center">
  266.                                         <a href="/vertraege/?kundennummer={{ value }}" class="font-medium truncate text-white">{{ value }}</a>
  267.                                     </div>
  268.                                 </div>
  269.                             </div>
  270.                         {% endfor %}
  271.                     </div>
  272.                 </div>
  273.             </div>
  274.             <!-- END: Notifications -->
  275.         {% endif %}
  277.         <!-- BEGIN: Notifications -->
  278.         <div class="intro-x dropdown mr-4 sm:mr-6" title="Barrierefreiheit">
  279.             <div class="dropdown-toggle notification cursor-pointer" role="button" data-tw-toggle="modal" data-tw-target="#barrierefreiheit">
  280.                 <i data-lucide="eye" class="notification__icon dark:text-slate-500"></i>
  281.             </div>
  282.         </div>
  283.         <!-- END: Notifications -->
  285.         {% if is_granted('ROLE_USER') %}
  286.             <!-- BEGIN: Notifications -->
  287.             <div class="intro-x dropdown mr-4 sm:mr-6" title="Status Webservice: {% if app.session.get('webservice') %}erreichbar{% else %}nicht erreichbar{% endif %}">
  288.                 <div class="dropdown-toggle notification notification--bullet {% if app.session.get('webservice') %}green{% else %}red{% endif %}">
  289.                     <i data-lucide="radio" class="notification__icon dark:text-slate-500"></i>
  290.                 </div>
  291.             </div>
  292.             <!-- END: Notifications -->
  293.         {% endif %}
  295.         {% if is_granted('ROLE_USER') %}
  296.         <!-- BEGIN: Account Menu -->
  297.         <div class="intro-x dropdown w-8 h-8">
  298.             <div class="profilname dropdown-toggle w-8 h-8 rounded-full overflow-hidden shadow-lg image-fit zoom-in scale-110" role="button" aria-expanded="false" data-tw-toggle="dropdown">
  299.                 <span>{{ app.session.get('nutzername') }}</span>
  300.             </div>
  301.             <div class="dropdown-menu w-56">
  302.                 <ul class="dropdown-content bg-primary/80 before:block before:absolute before:bg-black before:inset-0 before:rounded-md before:z-[-1] text-white">
  303.                     <li class="p-2">
  304.                         <div class="font-medium">{{ app.session.get('name') }}</div>
  305.                         {% if is_granted('ROLE_ADMIN') %}
  306.                             <div class="text-xs text-white/60 mt-0.5 dark:text-slate-500">Nutzergruppe: Administrator</div>
  307.                         {% else %}
  308.                             <div class="text-xs text-white/60 mt-0.5 dark:text-slate-500">Nutzergruppe: Nutzer</div>
  309.                         {% endif %}
  310.                     </li>
  311.                     <li>
  312.                         <hr class="dropdown-divider border-white/[0.08]">
  313.                     </li>
  314.                     <li>
  315.                         <a href="/profil/" class="dropdown-item hover:bg-white/5">
  316.                             <i data-lucide="user" class="w-4 h-4 mr-2"></i>
  317.                             Profil
  318.                         </a>
  319.                     </li>
  320.                     <li>
  321.                         <hr class="dropdown-divider border-white/[0.08]">
  322.                     </li>
  323.                     {% if is_granted('ROLE_PREVIOUS_ADMIN') %}
  324.                         <a href="/dashboard?_switch_user=_exit" class="dropdown-item hover:bg-white/5">
  325.                             <i data-lucide="user" class="w-4 h-4 mr-2"></i>
  326.                             Admin
  327.                         </a>
  328.                         <li>
  329.                             <hr class="dropdown-divider border-white/[0.08]">
  330.                         </li>
  331.                     {% endif %}
  332.                     <li>
  333.                         <a href="/logout" class="dropdown-item hover:bg-white/5">
  334.                             <i data-lucide="toggle-right" class="w-4 h-4 mr-2"></i>
  335.                             Abmelden
  336.                         </a>
  337.                     </li>
  338.                 </ul>
  339.             </div>
  340.         </div>
  341.         <!-- END: Account Menu -->
  342.         {% endif %}
  343.     </div>
  344. </div>
  345. <!-- END: Top Bar -->