{% extends "index.html" %}
{% block bodyheader %}
<body onload="javascript:update_componants();">
{% endblock %}
{% block title %}Nouveau composant{% endblock %}
        {% block top_menu %}
        <span class='top_menu_item' onclick='javascript:document.location="/componants";'>Rechercher un composant</span>
        <span class='top_menu_item_selected' onclick='javascript:document.location="/componants/new";'>Nouveau composant</span>
        <span class='top_menu_item' onclick='javascript:document.location="/componants/in";'>Entrée de stock</span>
        <span class='top_menu_item' onclick='javascript:document.location="/componants/out";'>Sortie de stock</span>
        {% endblock %}
        
          {% block left_menu %}
          <div class='left_menu_item' onclick='javascript:document.location="/";'>
            Accueil
          </div>
          <div class='left_menu_item_selected' onclick='javascript:document.location="/componants";'>
            Composants
          </div>
          <div class='left_menu_item' onclick='javascript:document.location="/kits";'>
            Kits
          </div>
          <div class='left_menu_item' onclick='javascript:document.location="/providers";'>
            Fournisseurs
          </div>
          {% endblock %}

          {% block content %}
          <!-- ----------------------------------------------------
          Recherche
          -----------------------------------------------------  -->
          <h3>Recherche:</h3>
          <div class='block margin_bottom no_border'>
            <label class='editable'>Référence (unique)</label>
            <input
                  id='reference'
                  type='text'
                  class='editable'
                  onkeyup='javascript:search_reference(this);'
                  maxlength='20'
                  title='Référence interne unique (max. 20)'
                  placeholder='Référence interne unique (max. 20)'
                  value='' />
          </div>
          <div class='block margin_bottom no_border'>
            <label class='editable'>Désignation</label>
            <input
                  id='designation'
                  type='text'
                  class='editable'
                  maxlength='50'
                  title='Désignation (max. 50)'
                  placeholder='Désignation (max. 50)'
                  value='' />
          </div>
          <div class='block margin_bottom no_border'>
            <label class='editable'>Emplacement</label>
            <input
                  id='place'
                  type='text'
                  class='editable'
                  maxlength='15'
                  title='Emplacement (max. 15)'
                  placeholder='Emplacement (max. 15)'
                  value='' />
          </div>
          <div class='block margin_bottom no_border'>
            <label  class='editable'>Fournisseur</label>
            <select
                    id='provider_id'
                    title='Fournisseur'>
                <option value='0' selected>Tous</option>
              {% for prov in providers %}
                <option value='{{ prov.id }}'>{{ prov.name }}</option>
              {% endfor %}
            </select>
          </div>
          <div class='block margin_bottom no_border center'>
            <text title='Enregistrer' class='save' onclick='javascript:new_componant();'></text>
          </div>
          <!-- ----------------------------------------------------
          Resultat
          -----------------------------------------------------  -->
          <div id='result_container' class='result_container'>
          
          </div>
          {% endblock %}