<header class="m-header">
    <a class="m-header__logo" href="#">
        <img src="/assets/images/m-logo.png" alt="">
    </a>

    <div class="m-header__nav">
        <div class="m-header__links">
            <a href="#" class="m-header__link  m-header__link--active">Proposte</a>
            <a href="#" class="m-header__link">Rifinanziamenti</a>
            <a href="#" class="m-header__link">myMobilityPass</a>
            <a href="#" class="m-header__link"><svg class="icon icon--user">
  <use xlink:href="../../assets/icons.svg#user" />
</svg>
</a>
        </div>
    </div>
</header>

<div class="m-sub-header">

    <div class="m-sub-header__img">
        <img src="/assets/images/sub-header-bg.jpeg" alt="">
    </div>

    <div class="m-sub-header__data-box">

        <div>
            <span>
					43
				</span> in lavorazione
        </div>

        <div>
            <span>
					43
				</span> in lavorazione
        </div>

        <div>
            <span>
					43
				</span> in lavorazione
        </div>

        <div>
            <span>
					43
				</span> in lavorazione
        </div>

    </div>

    <div class="m-sub-header__date">dicembre 2018</div>
    <a class="m-sub-header__cta" href="#">vedi statistiche</a>
</div>

<div class="l-main-wrapper  l-spacing--v-margin-small-auto">
    <div class="row l-bottom">
        <div class="col-12 m-filter-controlls">

            <a href="#" class="a-filter-button">
    <span class="a-filter-button--label">Tutte</span>
    <span class="a-filter-button--extra">
         
            (20)  
        
        

            <svg class="icon icon--filter">
  <use xlink:href="../../assets/icons.svg#filter" />
</svg>

            
            

        
    </span>
</a>

            <a href="#" class="a-filter-button">
    <span class="a-filter-button--label">Urgenti</span>
    <span class="a-filter-button--extra">
         
            (20)  
        
        

            <svg class="icon icon--chat">
  <use xlink:href="../../assets/icons.svg#chat" />
</svg>

            
            
                <span class="a-filter-button__notification">
                    
    <div class="a-notification bg-azure ">
        3
    </div>

                </span>
            

        
    </span>
</a>

            <a href="#" class="a-filter-button">
    <span class="a-filter-button--label">Assegnate a me</span>
    <span class="a-filter-button--extra">
         
            (20)  
        
        
    </span>
</a>

            <a href="#" class="a-filter-button">
    <span class="a-filter-button--icon">        
        <svg class="icon icon--pen">
  <use xlink:href="../../assets/icons.svg#pen" />
</svg>

    </span>
</a>

        </div>
    </div>
</div>

<div class="l-main-wrapper  l-spacing--v-margin-small-auto">
    <div class="m-filter-container m-filter-container--active">

        <div class="m-filter-container__wrapper">

            <div class="m-filter-container__col">

                <div class="m-filter-container__child m-filter-container__child-title">
                    Soggetto
                </div>

                <div class="m-filter-container__child">
                    <div class="a-input  a-input--text  ">
                        <div class="a-input__label">

                            &nbsp;

                        </div>
                        <input type="text" value="" placeholder="Nome">
                    </div>

                </div>

                <div class="m-filter-container__child">
                    <div class="a-input  a-input--select  ">
                        <div class="a-input__label">
                            Value
                        </div>
                        <select name="" id="">
		
			<option value="Select Option"> Select Option</option>	    
		
	</select>

                        <svg class="icon icon--arrow-down">
  <use xlink:href="../../assets/icons.svg#arrow-down" />
</svg>

                    </div>
                </div>

            </div>

            <div class="m-filter-container__col">

                <div class="m-filter-container__child m-filter-container__child-title">
                    Proposta
                </div>

                <div class="m-filter-container__child">
                    <div class="a-input  a-input--text  ">
                        <div class="a-input__label">

                            &nbsp;

                        </div>
                        <input type="text" value="" placeholder="Numero">
                    </div>

                </div>

                <div class="m-filter-container__child">
                    <div class="a-input  a-input--text  ">
                        <div class="a-input__label">

                            &nbsp;

                        </div>
                        <input type="text" value="" placeholder="Telaio">
                    </div>

                </div>

                <div class="m-filter-container__child">
                    <div class="a-input  a-input--select  ">
                        <div class="a-input__label">
                            Value
                        </div>
                        <select name="" id="">
		
			<option value="Leasing"> Leasing</option>	    
		
	</select>

                        <svg class="icon icon--arrow-down">
  <use xlink:href="../../assets/icons.svg#arrow-down" />
</svg>

                    </div>
                </div>

            </div>

            <div class="m-filter-container__col">

                <div class="m-filter-container__child m-filter-container__child-title">
                    Asset
                </div>

                <div class="m-filter-container__child">
                    <div class="a-input  a-input--select  ">
                        <div class="a-input__label">
                            Value
                        </div>
                        <select name="" id="">
		
			<option value="Select Option"> Select Option</option>	    
		
	</select>

                        <svg class="icon icon--arrow-down">
  <use xlink:href="../../assets/icons.svg#arrow-down" />
</svg>

                    </div>
                </div>

            </div>

            <div class="m-filter-container__col">

            </div>

        </div>

        <div class="m-filter-container__controls">
            <div class="m-footer-controls">

                <div class="m-footer-controls__child">

                    <div class="a-button">
                        Azzera
                    </div>

                    <div class="a-button  a-button--azure">
                        Conferma
                    </div>

                </div>

            </div>

        </div>

    </div>
</div>

<div class="l-main-wrapper  l-spacing--v-margin-small-auto">
    <table class="m-table-list  m-table-list--row-hover">

        <thead class="m-table-list__header">
            <tr class="m-table-list__row">

                <td class="m-table-list__col  m-table-list__col--">

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    proposta

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    arrivo

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    prodotto<br/>finanziario

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    richiedente

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    sospesa da

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    causale<br/>sospensione

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    asset

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    campagna

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                </td>

            </tr>
        </thead>

        <tbody class="m-table-list__data">

            <tr class="m-table-list__row">

                <td class="m-table-list__col  m-table-list__col--dot">

                    <div class="h-dot"></div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="1002007462">
                        1002007462
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="16-01-2019 12:21">
                        16-01-2019 12:21
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="Noleggio">
                        Noleggio
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="Rigoni Fausto">
                        Rigoni Fausto
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="Mauro Rossi">
                        Mauro Rossi
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="103">
                        103
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="Nuovo">
                        Nuovo
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="Leasing">
                        Leasing
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--actions">

                    <div class="m-action-controls">

                        <div class="m-action-controls__child">

                            <svg class="icon icon--loked">
  <use xlink:href="../../assets/icons.svg#loked" />
</svg>

                            <div class="m-action-controls__child__notification">

                                <div class="a-notification">
                                    3
                                </div>

                            </div>

                        </div>

                        <div class="m-action-controls__child">

                            <svg class="icon icon--notification">
  <use xlink:href="../../assets/icons.svg#notification" />
</svg>

                            <div class="m-action-controls__child__notification">

                                <div class="a-notification">
                                    2
                                </div>

                            </div>

                        </div>

                        <div class="m-action-controls__child">

                        </div>

                        <div class="m-action-controls__child">

                            <svg class="icon icon--arrow-down">
  <use xlink:href="../../assets/icons.svg#arrow-down" />
</svg>

                        </div>

                    </div>

                </td>

            </tr>

            <tr class="m-table-list__row">

                <td class="m-table-list__col  m-table-list__col--">

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="2004798">
                        2004798
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="17-03-2019 16:21">
                        17-03-2019 16:21
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="Finanziamento">
                        Finanziamento
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="Rigoni Fausto">
                        Rigoni Fausto
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="">

                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="">

                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="Usato">
                        Usato
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--label">

                    <div class="h-ellipsis" title="My drive pass">
                        My drive pass
                    </div>

                </td>

                <td class="m-table-list__col  m-table-list__col--actions">

                    <div class="m-action-controls">

                        <div class="m-action-controls__child">

                        </div>

                        <div class="m-action-controls__child">

                        </div>

                        <div class="m-action-controls__child">

                        </div>

                        <div class="m-action-controls__child">

                            <svg class="icon icon--arrow-down">
  <use xlink:href="../../assets/icons.svg#arrow-down" />
</svg>

                        </div>

                    </div>

                </td>

            </tr>

        </tbody>

    </table>

</div>
{% render '@header' %}

{% render '@sub-header' %}

{% render '@filter-controls' %}

<div class="l-main-wrapper  l-spacing--v-margin-small-auto">
    {% render '@filter-container', {
        "state": "active",
            "columns":[
                {
                    "title": "Soggetto",
                    "atoms": [
                        {
                            "atom": "input--text",
                            "text": {
                              "placeholder": "Nome"
                            }
                        },
                        {
                            "atom": "input--select",
                            "select": {
                              "label" : "Value",
                              "values": ["Select Option"]
                            }
                        }
                    ]
                },
                {
                    "title": "Proposta",
                    "atoms": [
                        {
                            "atom": "input--text",
                            "text": {
                              "placeholder": "Numero"
                            }
                        },
                        {
                            "atom": "input--text",
                            "text": {
                              "placeholder": "Telaio"
                            }
                        },
                        {
                            "atom": "input--select",
                            "select": {
                              "label" : "Value",
                              "values": ["Leasing"]
                            }
                        }
                    ]
                },
                {
                    "title": "Asset",
                    "atoms": [
                        {
                            "atom": "input--select",
                            "select": {
                              "label" : "Value",
                              "values": ["Select Option"]
                            }
                        }
                    ]
                },
                {

                }
            ]
    } %}
</div>

<div class="l-main-wrapper  l-spacing--v-margin-small-auto">
    {% render '@table-list--hover', tableList %}
</div>
{
  "tableList": {
    "header": [
      {},
      {
        "label": "proposta",
        "type": "label"
      },
      {
        "label": "arrivo",
        "type": "label"
      },
      {
        "label": "prodotto<br/>finanziario",
        "type": "label"
      },
      {
        "label": "richiedente",
        "type": "label"
      },
      {
        "label": "sospesa da",
        "type": "label"
      },
      {
        "label": "causale<br/>sospensione",
        "type": "label"
      },
      {
        "label": "asset",
        "type": "label"
      },
      {
        "label": "campagna",
        "type": "label"
      },
      {
        "label": null,
        "type": "label"
      }
    ],
    "data": [
      [
        {
          "type": "dot"
        },
        {
          "label": 1002007462,
          "type": "label"
        },
        {
          "label": "16-01-2019 12:21",
          "type": "label"
        },
        {
          "label": "Noleggio",
          "type": "label"
        },
        {
          "label": "Rigoni Fausto",
          "type": "label"
        },
        {
          "label": "Mauro Rossi",
          "type": "label"
        },
        {
          "label": "103",
          "type": "label"
        },
        {
          "label": "Nuovo",
          "type": "label"
        },
        {
          "label": "Leasing",
          "type": "label"
        },
        {
          "label": null,
          "type": "actions",
          "actions": [
            {
              "icon": "loked",
              "count": 3
            },
            {
              "icon": "notification",
              "count": 2
            },
            {},
            {
              "icon": "arrow-down"
            }
          ]
        }
      ],
      [
        {},
        {
          "label": 2004798,
          "type": "label"
        },
        {
          "label": "17-03-2019 16:21",
          "type": "label"
        },
        {
          "label": "Finanziamento",
          "type": "label"
        },
        {
          "label": "Rigoni Fausto",
          "type": "label"
        },
        {
          "label": null,
          "type": "label"
        },
        {
          "label": null,
          "type": "label"
        },
        {
          "label": "Usato",
          "type": "label"
        },
        {
          "label": "My drive pass",
          "type": "label"
        },
        {
          "label": null,
          "type": "actions",
          "actions": [
            {},
            {},
            {},
            {
              "icon": "arrow-down"
            }
          ]
        }
      ]
    ]
  }
}

There are no notes for this item.