templates/default/default.html.twig line 1

Open in your IDE?
  1. {% extends "layout.html.twig" %}
  2. {% block content %}
  3. <div class="wrapper">
  4.     <section>
  5.         <aside>
  6.             <div class="graph">
  7.             <img src="/static/img/graph.png">
  8.           </div>
  9.             <ul class="categories">
  10.                 <li>
  11.                     <strong>Katalog</strong>
  12.                 </li>
  13.                 <li>
  14.                     <a href="#">
  15.                         Material Processing
  16.                         <small>(1441)</small>
  17.                         <i>+</i>
  18.                     </a>
  19.                 </li>
  20.                 <li>
  21.                     <a href="#">
  22.                         Surface Protection
  23.                         <small>(177)</small>
  24.                         <i>-</i>
  25.                     </a>
  26.                     <ul>
  27.                         <li>
  28.                             <a href="#">Gummierungs-Systeme<small>(128)</small></a>
  29.                         </li>
  30.                         <li>
  31.                             <a href="#">Beschichtungs-Systeme<small>(49)</small></a>
  32.                         </li>
  33.                     </ul>
  34.                 </li>
  35.                 <li>
  36.                     <a href="#">
  37.                         Service
  38.                         <small>(706)</small>
  39.                         <i>+</i>
  40.                     </a>
  41.                 </li>
  42.             </ul>
  43.             <ul class="misc">
  44.                 <li>
  45.                     <strong>Sonstiges</strong>
  46.                 </li>
  47.                 <li>
  48.                     <a href="#">
  49.                         Downloads
  50.                         <small>(36)</small>
  51.                     </a>
  52.                 </li>
  53.                 <li>
  54.                     <a href="#">
  55.                         B-Ware
  56.                         <small>(36)</small>
  57.                     </a>
  58.                 </li>
  59.                 <li>
  60.                     <a href="#">
  61.                         CSV-Upload
  62.                         <small>(36)</small>
  63.                     </a>
  64.                 </li>
  65.                 <li>
  66.                     <a href="#">
  67.                         Offene Aufträge
  68.                         <small>(36)</small>
  69.                     </a>
  70.                 </li>
  71.                 <li>
  72.                     <a href="#">
  73.                         Abgeschlossene Aufträge
  74.                         <small>(36)</small>
  75.                     </a>
  76.                 </li>
  77.                 <li>
  78.                     <a href="#">
  79.                         Warenkörbe
  80.                         <small>(36)</small>
  81.                     </a>
  82.                 </li>
  83.                 <li>
  84.                     <a href="#">
  85.                         Media Center
  86.                         <small>(36)</small>
  87.                     </a>
  88.                 </li>
  89.             </ul>
  90.         </aside>
  91.         <article>
  92.             <div class="content-top">
  93.                 <section>
  94.                     <div class="left">
  95.                         <div class="search">
  96.                             <div>
  97.                                 <section class="searchicon">
  98.                                     <img src="/static/img/search.svg" />
  99.                                 </section>
  100.                                 <section class="input">
  101.                                     <input type="text" name="search-input" id="search-input" placeholder="Artikelnummer, Suchbegriffe" value="{{query}}" />
  102.                                 </section>
  103.                                 <div class="remabutton">
  104.                                     <a href="javascript:void(0)" id="search-link">
  105.                                         Artikel finden
  106.                                         <img src="/static/img/arrow-ic.svg" />
  107.                                     </a>
  108.                                 </div>
  109.                             </div>
  110.                         </div>
  111.                         <div class="countries">
  112.                             <div class="active">
  113.                                 <section>
  114.                                     <div>
  115.                                         <span><img src="/static/img/de.svg" height="16" />DE</span>
  116.                                     </div>
  117.                                 </section>
  118.                             </div>
  119.                             <div class="active">
  120.                                 <section>
  121.                                     <div>
  122.                                         <span><img src="/static/img/ch.svg" height="16" />CH</span>
  123.                                     </div>
  124.                                 </section>
  125.                             </div>
  126.                             <div class="active">
  127.                                 <section>
  128.                                     <div>
  129.                                         <span><img src="/static/img/lat.svg" height="16" />LAT</span>
  130.                                     </div>
  131.                                 </section>
  132.                             </div>
  133.                             <div>
  134.                                 <section>
  135.                                     <div>
  136.                                         <span><img src="/static/img/fr.svg" height="16" />FR</span>
  137.                                     </div>
  138.                                 </section>
  139.                             </div>
  140.                             <div>
  141.                                 <section>
  142.                                     <div>
  143.                                         <span><img src="/static/img/it.svg" height="16" />IT</span>
  144.                                     </div>
  145.                                 </section>
  146.                             </div>
  147.                             <div class="active">
  148.                                 <section>
  149.                                     <div>
  150.                                         <span><img src="/static/img/at.svg" height="16" />AT</span>
  151.                                     </div>
  152.                                 </section>
  153.                             </div>
  154.                             <div>
  155.                                 <section>
  156.                                     <div>
  157.                                         <span><img src="/static/img/esp.svg" height="16" />ESP</span>
  158.                                     </div>
  159.                                 </section>
  160.                             </div>
  161.                             <div class="allshops">
  162.                                 <section>
  163.                                     <div>
  164.                                         <span>Alle Shops</span>
  165.                                     </div>
  166.                                 </section>
  167.                             </div>
  168.                         </div>
  169.                     </div>
  170.                     <div class="right">
  171.                         <div class="addnew">
  172.                             <i>+</i>
  173.                             <strong>Produkt hinzufügen</strong>
  174.                         </div>
  175.                     </div>
  176.                 </section>
  177.             </div>
  178.             <section>
  179.                 <section class="toolbar">
  180.                     <section>
  181.                         <div>
  182.                             <label>Aktion</label>
  183.                             <section>
  184.                                 <div>
  185.                                     <span>Veröffentlichen</span>
  186.                                     <small>(3)</small>
  187.                                 </div>
  188.                             </section>
  189.                             <i class="chevron-arrow-down"></i>
  190.                         </div>
  191.                         <div>
  192.                             <label>Filter</label>
  193.                             <section>
  194.                                 <div>
  195.                                     <span> <i class="red"></i>Entwurf</span>
  196.                                 </div>
  197.                             </section>
  198.                             <i class="chevron-arrow-down"></i>
  199.                         </div>
  200.                         <div>
  201.                             <label>Sortieren</label>
  202.                             <section>
  203.                                 <div>
  204.                                     <span>Neueste</span>
  205.                                 </div>
  206.                             </section>
  207.                             <i class="chevron-arrow-down"></i>
  208.                         </div>
  209.                         <div>
  210.                             <label>Sprache</label>
  211.                             <section>
  212.                                 <div>
  213.                                     <span><img src="/static/img/de.svg" height="16" />DE</span>
  214.                                 </div>
  215.                             </section>
  216.                             <i class="chevron-arrow-down"></i>
  217.                         </div>
  218.                     </section>
  219.                 </section>
  220.                 {% if pagination %}
  221.                 <section class="catalog">
  222.                     <div>
  223.                         <ul>
  224.                             {% for product in pagination %}
  225.                             
  226.                             <li>
  227.                                 <div class="photo">
  228.                                     {% if product.mainimage %}
  229.                                         <img src="{{ product.mainimage.thumbnail('product_listing') }}" alt="{{ product.name_de }}">
  230.                                     {% endif %}
  231.                                 </div>
  232.                                 <div class="infos">
  233.                                     <label>{{product.sku}}</label>
  234.                                     <h3>{{product.name_de}}</h3>
  235.                                     {% set creationdate = product.creationdate|date('U') %} 
  236.                                     <span>Erstellt: {{creationdate|date('d.m.Y - H:i')}}</span>
  237.                                     {% set modificationdate = product.modificationdate|date('U') %}
  238.                                     <span>Zuletzt bearbeitet:{{modificationdate|date('d.m.Y - H:i')}}</span>
  239.                                 </div>
  240.                                 <div class="controls">
  241.                                     <div class="status">
  242.                                         <section>
  243.                                             <div>
  244.                                                 <span> <i class="red"></i>Entwurf</span>
  245.                                             </div>
  246.                                         </section>
  247.                                         <i class="chevron-arrow-down"></i>
  248.                                     </div>
  249.                                     <div class="edit">
  250.                                         <div class="remabutton">
  251.                                             <a href="{{ path('product_detail', { 'id': product.id }) }}">
  252.                                                 Bearbeiten
  253.                                                 <img src="/static/img/arrow-ic.svg" />
  254.                                             </a>
  255.                                         </div>
  256.                                     </div>
  257.                                     <div class="delete">
  258.                                         <a href="#">
  259.                                             <img src="/static/img/delete.svg" />
  260.                                             Löschung beantragen
  261.                                         </a>
  262.                                     </div>
  263.                                 </div>
  264.                             </li>  
  265.                             {% endfor %}                          
  266.                         </ul>
  267.                     </div>
  268.                 </section>
  269.                 {% endif %}
  270.                 <section class="priceinfo">
  271.                     Alle Preise sind inkl. MwSt ausgewiesen.
  272.                 </section>
  273.                 <section class="pagination">
  274.     <ul>
  275.         {% if pagination.previous is defined %}
  276.             <li><a href="{{ path(app.request.get('_route'), app.request.query.all|merge({'page': pagination.previous})) }}">&laquo; Previous</a></li>
  277.         {% endif %}
  278.         {% for page in pagination.paginationData.pagesInRange %}
  279.             <li>
  280.                 <a {% if page == pagination.currentPageNumber %} class="active"{% endif %} href="{{ path(app.request.get('_route'), app.request.query.all|merge({'page': page})) }}">{{ page }}</a>
  281.             </li>
  282.         {% endfor %}
  283.         {% if pagination.next is defined %}
  284.             <li><a href="{{ path(app.request.get('_route'), app.request.query.all|merge({'page': pagination.next})) }}">Next &raquo;</a></li>
  285.         {% endif %}
  286.     </ul>
  287. </section>
  288.                  
  289.             </section>
  290.         </article>
  291.     </section>
  292. </div>
  293. <script>
  294.         document.addEventListener('DOMContentLoaded', function() {
  295.             document.getElementById('search-link').addEventListener('click', function(event) {
  296.                 event.preventDefault();
  297.                 const query = document.getElementById('search-input').value;
  298.                 const url = new URL(window.location.href);
  299.                 url.searchParams.set('q', query);
  300.                 window.location.href = url.toString();
  301.             });
  302.         });
  303. </script>
  304. {% endblock %}