<div class="page-title page-title--full-width">
<div class="h-container">
<h1 class="page-title__text">Lepingud</h1>
</div>
</div>
<div class="table-filter">
<div class="h-container">
<div class="grid grid--middle-xs">
<div class="grid__col grid__col--lg-7">
<div class="filter js-filter table-filter__filter">
<ul class="filter__list">
<li class="filter__list-item">
<button class="filter-item js-filter-item is-selected" type="button" data-key="all">
<span class="filter-item__inner">
<span class="filter-item__text">Kõik</span>
</span>
</button>
</li>
<li class="filter__list-item">
<button class="filter-item js-filter-item" type="button" data-key="awaiting">
<span class="filter-item__inner">
<span class="filter-item__bullet">
<span class="filter-item__count">2</span>
</span>
<span class="filter-item__text">Kinnituse ootel</span>
</span>
</button>
</li>
<li class="filter__list-item">
<button class="filter-item js-filter-item" type="button" data-key="in-progress">
<span class="filter-item__inner">
<span class="filter-item__bullet">
<span class="filter-item__count">3</span>
</span>
<span class="filter-item__text">Koostamisel</span>
</span>
</button>
</li>
<li class="filter__list-item">
<button class="filter-item js-filter-item" type="button" data-key="confirmed">
<span class="filter-item__inner">
<span class="filter-item__bullet">
<span class="filter-item__count">5</span>
</span>
<span class="filter-item__text">Kinnitatud</span>
</span>
</button>
</li>
</ul>
<button class="filter__button filter__button--left is-hidden" type="button" aria-label="Scroll left">
<svg class="icon filter__button-icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#chevron-left"></use>
</svg>
</button>
<button class="filter__button filter__button--right is-hidden" type="button" aria-label="Scroll right">
<svg class="icon filter__button-icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#chevron-right"></use>
</svg>
</button>
</div>
</div>
<div class="grid__col grid__col--lg-5">
<div class="grid grid--middle-xs grid--between-xs grid--start-lg grid--no-wrap-lg">
<div class="grid__col grid__col--xs h-hidden-lg">
<button class="search-toggle table-filter__search-toggle" type="button">
<span class="search-toggle__inner">
<svg class="icon search-toggle__icon search-toggle__icon--closed" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#search"></use>
</svg>
<svg class="icon search-toggle__icon search-toggle__icon--open" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#close"></use>
</svg>
<span class="search-toggle__text">Otsi</span>
</span>
</button>
</div>
<div class="grid__col grid__col--xs grid__col--min-lg">
<div class="dropdown js-dropdown dropdown--trigger-icon-animated table-filter__dropdown" data-offset-x="0" data-offset-y="0">
<button type="button" class="button button--tiny dropdown__trigger button--icon-right">
<span class="button__inner">
<svg class="icon button__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#chevron-bottom"></use>
</svg>
<span class="button__text">Lae info alla</span>
</span>
</button>
<div class="dropdown__content">
<div class="dropdown__content-inner">
<p>Lae info alla</p>
<ul class="dropdown__options">
<li class="dropdown__option-item">
<a class="dropdown__option-link" href="#">
<svg class="icon dropdown__option-icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#csv"></use>
</svg>
<span class="dropdown__text">CSV</span>
</a>
</li>
<li class="dropdown__option-item">
<a class="dropdown__option-link" href="#">
<svg class="icon dropdown__option-icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#excel"></use>
</svg>
<span class="dropdown__text">Excel</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="grid__col grid__col--first-lg grid__col--max-lg">
<div class="search table-filter__search">
<div class="search__inner">
<div class="search__textfield-wrapper">
<div class="textfield search__textfield">
<label class="textfield__label h-visually-hidden" for="search1">
Otsing
</label>
<div class="textfield__inner">
<input class="textfield__input" type="text" id="search1" name="search" placeholder="Otsi arvete hulgast...">
</div>
</div>
<button class="search__clear js-search-clear" type="button" aria-label="Tühjenda">
<span class="search__clear-inner">
<svg class="icon search__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#close"></use>
</svg>
</span>
</button>
</div>
<button class="search__button search__button--toggle js-search-toggle" type="button" aria-label="Otsi">
<span class="search__button-inner">
<svg class="icon search__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#search"></use>
</svg>
</span>
</button>
<button class="search__button search__button--submit" type="submit" aria-label="Otsi">
<span class="search__button-inner">
<svg class="icon search__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#search"></use>
</svg>
</span>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="divider divider--xs divider--invisible"></div>
<div class="h-container">
<h2 class="h4 bold text-base">Allkirja ootel</h2>
<div class="divider divider--xs divider--invisible"></div>
<div class="status-table ">
<table class="status-table__table tablesaw tablesaw-stack" data-tablesaw-mode="stack" data-tablesaw-hide-empty>
<thead class="status-table__head">
<tr class="status-table__row">
<th class="status-table__header" data-key="lepinguNr" scope="col">
<span class="status-table__title">Lepingu nr</span>
</th>
<th class="status-table__header" data-key="objektiKood" scope="col">
<span class="status-table__title">Obj. kood</span>
</th>
<th class="status-table__header" data-key="objektiNimi" scope="col">
<span class="status-table__title">Obj. nimi</span>
</th>
<th class="status-table__header" data-key="tellija" scope="col">
<span class="status-table__title">Tellija</span>
</th>
<th class="status-table__header" data-key="kontakt" scope="col">
<span class="status-table__title">Kontakt</span>
</th>
<th class="status-table__header" data-key="esindus" scope="col">
<span class="status-table__title">Esindus</span>
</th>
<th class="status-table__header" data-key="lepinguAlgus" scope="col">
<span class="status-table__title">Lepingu algus</span>
</th>
<th class="status-table__header" data-key="staatus" scope="col">
<span class="status-table__title">Staatus</span>
</th>
<th class="status-table__header status-table__header--empty" scope="col">
</th>
<th class="status-table__header status-table__header--component" scope="col">
<div class="dropdown js-dropdown status-table__dropdown js-status-table-dropdown" data-offset-x="0" data-offset-y="0">
<button type="button" class="button button--text button--text-color status-table__dropdown-button dropdown__trigger button--icon">
<span class="button__inner">
<svg class="icon button__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#dots"></use>
</svg>
<span class="button__text">Valikud</span>
</span>
</button>
<div class="dropdown__content">
<div class="dropdown__content-inner">
Kuva tabeli veerge
<fieldset class="choice-group
dropdown__choices">
<legend class="choice-group__label h-visually-hidden">Kuva tabeli veerge</legend>
<div class="choice-group__inner">
<div class="check
choice-group__item">
<input type="checkbox" id="check1" name="check" value="" class="check__input" checked data-key="lepinguNr">
<label for="check1" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Lepingu nr</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check2" name="check" value="" class="check__input" checked data-key="objektiKood">
<label for="check2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Objekti kood</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check3" name="check" value="" class="check__input" checked data-key="objektiNimi">
<label for="check3" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Objekti nimi</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check5" name="check" value="" class="check__input" checked data-key="tellija">
<label for="check5" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Tellija</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check6" name="check" value="" class="check__input" checked data-key="kontkat">
<label for="check6" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Kontakt</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check7" name="check" value="" class="check__input" checked data-key="esindus">
<label for="check7" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Esindus</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check8" name="check" value="" class="check__input" checked data-key="lepinguAlgus">
<label for="check8" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Lepingu algus</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check9" name="check" value="" class="check__input" checked data-key="staatus">
<label for="check9" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Staatus</span>
</label>
</div>
</div>
</fieldset>
</div>
</div>
</div>
</th>
</tr>
</thead>
<tbody class="status-table__body">
<tr class="status-table__row">
<td class="status-table__item " data-key="lepinguNr">
<span class="text-truncate"><a href="#">RC080840</a></span>
</td>
<td class="status-table__item " data-key="objektiKood">
12
</td>
<td class="status-table__item " data-key="objektiNimi">
12
</td>
<td class="status-table__item " data-key="tellija">
Risse Soomets
</td>
<td class="status-table__item " data-key="kontakt">
Rendipunkt
</td>
<td class="status-table__item " data-key="esindus">
<span class="text-truncate"><a href="#">1011</a></span>
</td>
<td class="status-table__item " data-key="lepinguAlgus">
01.06.2022
</td>
<td class="status-table__item " data-key="staatus">
<div class="status status--type-pending">
<span class="status__bullet"></span>
<span class="status__text">Allkirja ootel</span>
</div>
</td>
<td class="status-table__item " data-tablesaw-no-labels>
<button type="button" class="button button--tiny status-table__button">
<span class="button__inner">
<span class="button__text">Allkirjastama</span>
</span>
</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="divider divider--md divider--invisible"></div>
<h2 class="h4 bold text-base">Allkirjastatud</h2>
<div class="divider divider--xs divider--invisible"></div>
<div class="status-table ">
<table class="status-table__table tablesaw tablesaw-stack" data-tablesaw-mode="stack" data-tablesaw-hide-empty>
<thead class="status-table__head">
<tr class="status-table__row">
<th class="status-table__header" data-key="lepinguNr2" scope="col">
<span class="status-table__title">Lepingu nr</span>
</th>
<th class="status-table__header" data-key="objektiKood2" scope="col">
<span class="status-table__title">Obj. kood</span>
</th>
<th class="status-table__header" data-key="objektiNimi2" scope="col">
<span class="status-table__title">Obj. nimi</span>
</th>
<th class="status-table__header" data-key="tellija2" scope="col">
<span class="status-table__title">Tellija</span>
</th>
<th class="status-table__header" data-key="kontakt2" scope="col">
<span class="status-table__title">Kontakt</span>
</th>
<th class="status-table__header" data-key="esindus2" scope="col">
<span class="status-table__title">Esindus</span>
</th>
<th class="status-table__header" data-key="lepinguAlgus2" scope="col">
<span class="status-table__title">Lepingu algus</span>
</th>
<th class="status-table__header" data-key="staatus2" scope="col">
<span class="status-table__title">Staatus</span>
</th>
<th class="status-table__header status-table__header--empty" scope="col">
</th>
<th class="status-table__header status-table__header--component" scope="col">
<div class="dropdown js-dropdown status-table__dropdown js-status-table-dropdown" data-offset-x="0" data-offset-y="0">
<button type="button" class="button button--text button--text-color status-table__dropdown-button dropdown__trigger button--icon">
<span class="button__inner">
<svg class="icon button__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#dots"></use>
</svg>
<span class="button__text">Valikud</span>
</span>
</button>
<div class="dropdown__content">
<div class="dropdown__content-inner">
Kuva tabeli veerge
<fieldset class="choice-group
dropdown__choices">
<legend class="choice-group__label h-visually-hidden">Kuva tabeli veerge</legend>
<div class="choice-group__inner">
<div class="check
choice-group__item">
<input type="checkbox" id="check1-2" name="check" value="" class="check__input" checked data-key="lepinguNr2">
<label for="check1-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Lepingu nr</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check2-2" name="check" value="" class="check__input" checked data-key="objektiKood2">
<label for="check2-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Objekti kood</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check3-2" name="check" value="" class="check__input" checked data-key="objektiNimi2">
<label for="check3-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Objekti nimi</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check4-2" name="check" value="" class="check__input" checked data-key="tellija2">
<label for="check4-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Tellija</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check5-2" name="check" value="" class="check__input" checked data-key="kontakt2">
<label for="check5-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Kontakt</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check6-2" name="check" value="" class="check__input" checked data-key="esindus2">
<label for="check6-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Esindus</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check7-2" name="check" value="" class="check__input" checked data-key="lepinguAlgus2">
<label for="check7-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Lepingu algus</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check8-2" name="check" value="" class="check__input" checked data-key="staatus2">
<label for="check8-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Staatus</span>
</label>
</div>
</div>
</fieldset>
</div>
</div>
</div>
</th>
</tr>
</thead>
<tbody class="status-table__body">
<tr class="status-table__row">
<td class="status-table__item " data-key="lepinguNr2">
<span class="text-truncate"><a href="#">RC080841</a></span>
</td>
<td class="status-table__item " data-key="objektiKood2">
12
</td>
<td class="status-table__item " data-key="objektiNimi2">
12
</td>
<td class="status-table__item " data-key="tellija2">
Nele Erikson
</td>
<td class="status-table__item " data-key="kontakt2">
Rendipunkt
</td>
<td class="status-table__item " data-key="esindus2">
<span class="text-truncate"><a href="#">1011</a></span>
</td>
<td class="status-table__item " data-key="lepinguAlgus2">
01.06.2022
</td>
<td class="status-table__item " data-key="staatus2">
<div class="status status--type-success">
<span class="status__bullet"></span>
<span class="status__text">Allkirjastatud</span>
</div>
</td>
<td class="status-table__item " data-tablesaw-no-labels>
<button type="button" class="button button--tiny status-table__button">
<span class="button__inner">
<span class="button__text">Vaata</span>
</span>
</button>
</td>
</tr>
<tr class="status-table__row">
<td class="status-table__item " data-key="lepinguNr2">
<span class="text-truncate"><a href="#">RC080846</a></span>
</td>
<td class="status-table__item " data-key="objektiKood2">
12
</td>
<td class="status-table__item " data-key="objektiNimi2">
12
</td>
<td class="status-table__item " data-key="tellija2">
Nele Erikson
</td>
<td class="status-table__item " data-key="kontakt2">
Rendipunkt
</td>
<td class="status-table__item " data-key="esindus2">
<span class="text-truncate"><a href="#">1011</a></span>
</td>
<td class="status-table__item " data-key="lepinguAlgus2">
01.06.2022
</td>
<td class="status-table__item " data-key="staatus2">
<div class="status status--type-success">
<span class="status__bullet"></span>
<span class="status__text">Allkirjastatud väljaspool veebi</span>
</div>
</td>
<td class="status-table__item ">
</td>
</tr>
</tbody>
</table>
</div>
<div class="divider divider--md divider--invisible"></div>
<h2 class="h4 bold text-base">Lõpetatud</h2>
<div class="divider divider--xs divider--invisible"></div>
<div class="status-table ">
<table class="status-table__table tablesaw tablesaw-stack" data-tablesaw-mode="stack" data-tablesaw-hide-empty>
<thead class="status-table__head">
<tr class="status-table__row">
<th class="status-table__header" data-key="lepinguNr3" scope="col">
<span class="status-table__title">Lepingu nr</span>
</th>
<th class="status-table__header" data-key="objektiKood3" scope="col">
<span class="status-table__title">Obj. kood</span>
</th>
<th class="status-table__header" data-key="objektiNimi3" scope="col">
<span class="status-table__title">Obj. nimi</span>
</th>
<th class="status-table__header" data-key="tellija3" scope="col">
<span class="status-table__title">Tellija</span>
</th>
<th class="status-table__header" data-key="kontakt3" scope="col">
<span class="status-table__title">Kontakt</span>
</th>
<th class="status-table__header" data-key="esindus3" scope="col">
<span class="status-table__title">Esindus</span>
</th>
<th class="status-table__header" data-key="lepinguAlgus3" scope="col">
<span class="status-table__title">Lepingu algus</span>
</th>
<th class="status-table__header" data-key="staatus3" scope="col">
<span class="status-table__title">Staatus</span>
</th>
<th class="status-table__header status-table__header--empty" scope="col">
</th>
<th class="status-table__header status-table__header--component" scope="col">
<div class="dropdown js-dropdown status-table__dropdown js-status-table-dropdown" data-offset-x="0" data-offset-y="0">
<button type="button" class="button button--text button--text-color status-table__dropdown-button dropdown__trigger button--icon">
<span class="button__inner">
<svg class="icon button__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#dots"></use>
</svg>
<span class="button__text">Valikud</span>
</span>
</button>
<div class="dropdown__content">
<div class="dropdown__content-inner">
Kuva tabeli veerge
<fieldset class="choice-group
dropdown__choices">
<legend class="choice-group__label h-visually-hidden">Kuva tabeli veerge</legend>
<div class="choice-group__inner">
<div class="check
choice-group__item">
<input type="checkbox" id="check1-2-2" name="check" value="" class="check__input" checked data-key="lepinguNr3">
<label for="check1-2-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Lepingu nr</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check2-2-2" name="check" value="" class="check__input" checked data-key="objektiKood3">
<label for="check2-2-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Objekti kood</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check3-2-2" name="check" value="" class="check__input" checked data-key="objektiNimi3">
<label for="check3-2-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Objekti nimi</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check4-2-2" name="check" value="" class="check__input" checked data-key="tellija3">
<label for="check4-2-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Tellija</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check5-2-2" name="check" value="" class="check__input" checked data-key="kontakt3">
<label for="check5-2-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Kontakt</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check6-2-2" name="check" value="" class="check__input" checked data-key="esindus3">
<label for="check6-2-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Esindus</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check7-2-2" name="check" value="" class="check__input" checked data-key="lepinguAlgus3">
<label for="check7-2-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Lepingu algus</span>
</label>
</div>
<div class="check
choice-group__item">
<input type="checkbox" id="check8-2-2" name="check" value="" class="check__input" checked data-key="staatus3">
<label for="check8-2-2" class="check__label">
<span class="check__indicator">
<svg class="icon check__icon" focusable="false">
<use href="../../inc/svg/global.4609ec92109fc41e7ad4764ef897ea8e.svg#check"></use>
</svg>
</span>
<span class="check__text ">Staatus</span>
</label>
</div>
</div>
</fieldset>
</div>
</div>
</div>
</th>
</tr>
</thead>
<tbody class="status-table__body">
<tr class="status-table__row">
<td class="status-table__item " data-key="lepinguNr3">
<span class="text-truncate"><a href="#">RC080845</a></span>
</td>
<td class="status-table__item " data-key="objektiKood3">
12
</td>
<td class="status-table__item " data-key="objektiNimi3">
12
</td>
<td class="status-table__item " data-key="tellija3">
Kristel-Maria K...
</td>
<td class="status-table__item " data-key="kontakt3">
Rendipunkt
</td>
<td class="status-table__item " data-key="esindus3">
<span class="text-truncate"><a href="#">1011</a></span>
</td>
<td class="status-table__item " data-key="lepinguAlgus3">
01.06.2022
</td>
<td class="status-table__item " data-key="staatus3">
<div class="status status--type-inactive">
<span class="status__bullet"></span>
<span class="status__text">Lõpetatud</span>
</div>
</td>
<td class="status-table__item " data-tablesaw-no-labels>
<button type="button" class="button button--tiny status-table__button">
<span class="button__inner">
<span class="button__text">Vaata</span>
</span>
</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="divider divider--md divider--invisible"></div>
</div>
{% include '@page-title' with { class: '', modifier: '', isFullWidth: true, data: { title: data.title } } %}
{% include '@table-filter' with { class: '', modifier: '', data: data.filter } %}
{% include '@divider' with { modifier: 'divider--xs divider--invisible' } %}
<div class="h-container">
{% if data.pendingTable %}
<h2 class="h4 bold text-base">Allkirja ootel</h2>
{% include '@divider' with { modifier: 'divider--xs divider--invisible' } %}
{% include '@status-table' with { class: '', modifier: '', data: data.pendingTable } %}
{% include '@divider' with { modifier: 'divider--md divider--invisible' } %}
{% endif %}
{% if data.signedTable %}
<h2 class="h4 bold text-base">Allkirjastatud</h2>
{% include '@divider' with { modifier: 'divider--xs divider--invisible' } %}
{% include '@status-table' with { class: '', modifier: '', data: data.signedTable } %}
{% include '@divider' with { modifier: 'divider--md divider--invisible' } %}
{% endif %}
{% if data.archiveTable %}
<h2 class="h4 bold text-base">Lõpetatud</h2>
{% include '@divider' with { modifier: 'divider--xs divider--invisible' } %}
{% include '@status-table' with { class: '', modifier: '', data: data.archiveTable } %}
{% include '@divider' with { modifier: 'divider--md divider--invisible' } %}
{% endif %}
</div>
{
"language": "en-US",
"data": {
"title": "Lepingud",
"filter": {
"filter": {
"items": [
{
"key": "all",
"isSelected": true,
"text": "Kõik"
},
{
"key": "awaiting",
"text": "Kinnituse ootel",
"count": 2
},
{
"key": "in-progress",
"text": "Koostamisel",
"count": 3
},
{
"key": "confirmed",
"text": "Kinnitatud",
"count": 5
}
]
},
"search": {
"textfield": {
"label": "Otsing",
"id": "search1",
"name": "search",
"placeholder": "Otsi arvete hulgast...",
"isLabelHidden": true
},
"clearText": "Tühjenda",
"searchText": "Otsi",
"submitText": "Otsi"
},
"dropdown": {
"buttonModifier": "button--tiny",
"trigger": {
"text": "Lae info alla",
"icon": "chevron-bottom",
"iconPosition": "right"
},
"triggerIconAnimated": true,
"content": "<p>Lae info alla</p>",
"options": [
{
"url": "#",
"icon": "csv",
"text": "CSV"
},
{
"url": "#",
"icon": "excel",
"text": "Excel"
}
]
},
"searchToggle": {
"text": "Otsi"
}
},
"pendingTable": {
"headers": [
{
"label": "Lepingu nr",
"key": "lepinguNr"
},
{
"label": "Obj. kood",
"key": "objektiKood"
},
{
"label": "Obj. nimi",
"key": "objektiNimi"
},
{
"label": "Tellija",
"key": "tellija"
},
{
"label": "Kontakt",
"key": "kontakt"
},
{
"label": "Esindus",
"key": "esindus"
},
{
"label": "Lepingu algus",
"key": "lepinguAlgus"
},
{
"label": "Staatus",
"key": "staatus"
},
{
"label": ""
},
{
"component": "dropdown",
"componentData": {
"componentClass": "status-table__dropdown js-status-table-dropdown",
"buttonModifier": "button--text button--text-color status-table__dropdown-button",
"trigger": {
"text": "Valikud",
"icon": "dots",
"iconPosition": null
},
"triggerIconAnimated": false,
"content": "Kuva tabeli veerge",
"options": null,
"choices": {
"label": "Kuva tabeli veerge",
"type": "check",
"choices": [
{
"id": "check1",
"label": "Lepingu nr",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"lepinguNr\""
},
{
"id": "check2",
"label": "Objekti kood",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"objektiKood\""
},
{
"id": "check3",
"label": "Objekti nimi",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"objektiNimi\""
},
{
"id": "check5",
"label": "Tellija",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"tellija\""
},
{
"id": "check6",
"label": "Kontakt",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"kontkat\""
},
{
"id": "check7",
"label": "Esindus",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"esindus\""
},
{
"id": "check8",
"label": "Lepingu algus",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"lepinguAlgus\""
},
{
"id": "check9",
"label": "Staatus",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"staatus\""
}
],
"isLabelHidden": true
}
}
}
],
"rows": [
{
"cells": [
{
"content": "<span class=\"text-truncate\"><a href=\"#\">RC080840</a></span>",
"key": "lepinguNr"
},
{
"content": "12",
"key": "objektiKood"
},
{
"content": "12",
"key": "objektiNimi"
},
{
"content": "Risse Soomets",
"key": "tellija"
},
{
"content": "Rendipunkt",
"key": "kontakt"
},
{
"content": "<span class=\"text-truncate\"><a href=\"#\">1011</a></span>",
"key": "esindus"
},
{
"content": "01.06.2022",
"key": "lepinguAlgus"
},
{
"component": "status",
"componentData": {
"text": "Allkirja ootel",
"type": "pending"
},
"key": "staatus"
},
{
"component": "button",
"componentData": {
"componentClass": "status-table__button",
"modifier": "button--tiny",
"text": "Allkirjastama"
}
}
]
}
]
},
"signedTable": {
"headers": [
{
"label": "Lepingu nr",
"key": "lepinguNr2"
},
{
"label": "Obj. kood",
"key": "objektiKood2"
},
{
"label": "Obj. nimi",
"key": "objektiNimi2"
},
{
"label": "Tellija",
"key": "tellija2"
},
{
"label": "Kontakt",
"key": "kontakt2"
},
{
"label": "Esindus",
"key": "esindus2"
},
{
"label": "Lepingu algus",
"key": "lepinguAlgus2"
},
{
"label": "Staatus",
"key": "staatus2"
},
{
"label": ""
},
{
"component": "dropdown",
"componentData": {
"componentClass": "status-table__dropdown js-status-table-dropdown",
"buttonModifier": "button--text button--text-color status-table__dropdown-button",
"isLabelHidden": true,
"triggerIconAnimated": false,
"content": "Kuva tabeli veerge",
"trigger": {
"text": "Valikud",
"icon": "dots",
"iconPosition": null
},
"choices": {
"label": "Kuva tabeli veerge",
"type": "check",
"choices": [
{
"id": "check1-2",
"label": "Lepingu nr",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"lepinguNr2\""
},
{
"id": "check2-2",
"label": "Objekti kood",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"objektiKood2\""
},
{
"id": "check3-2",
"label": "Objekti nimi",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"objektiNimi2\""
},
{
"id": "check4-2",
"label": "Tellija",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"tellija2\""
},
{
"id": "check5-2",
"label": "Kontakt",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"kontakt2\""
},
{
"id": "check6-2",
"label": "Esindus",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"esindus2\""
},
{
"id": "check7-2",
"label": "Lepingu algus",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"lepinguAlgus2\""
},
{
"id": "check8-2",
"label": "Staatus",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"staatus2\""
}
],
"isLabelHidden": true
}
}
}
],
"rows": [
{
"cells": [
{
"content": "<span class=\"text-truncate\"><a href=\"#\">RC080841</a></span>",
"key": "lepinguNr2"
},
{
"content": "12",
"key": "objektiKood2"
},
{
"content": "12",
"key": "objektiNimi2"
},
{
"content": "Nele Erikson",
"key": "tellija2"
},
{
"content": "Rendipunkt",
"key": "kontakt2"
},
{
"content": "<span class=\"text-truncate\"><a href=\"#\">1011</a></span>",
"key": "esindus2"
},
{
"content": "01.06.2022",
"key": "lepinguAlgus2"
},
{
"component": "status",
"componentData": {
"text": "Allkirjastatud",
"type": "success"
},
"key": "staatus2"
},
{
"component": "button",
"componentData": {
"componentClass": "status-table__button",
"modifier": "button--tiny",
"text": "Vaata"
}
}
]
},
{
"cells": [
{
"content": "<span class=\"text-truncate\"><a href=\"#\">RC080846</a></span>",
"key": "lepinguNr2"
},
{
"content": "12",
"key": "objektiKood2"
},
{
"content": "12",
"key": "objektiNimi2"
},
{
"content": "Nele Erikson",
"key": "tellija2"
},
{
"content": "Rendipunkt",
"key": "kontakt2"
},
{
"content": "<span class=\"text-truncate\"><a href=\"#\">1011</a></span>",
"key": "esindus2"
},
{
"content": "01.06.2022",
"key": "lepinguAlgus2"
},
{
"component": "status",
"componentData": {
"text": "Allkirjastatud väljaspool veebi",
"type": "success"
},
"key": "staatus2"
},
{
"content": ""
}
]
}
]
},
"archiveTable": {
"headers": [
{
"label": "Lepingu nr",
"key": "lepinguNr3"
},
{
"label": "Obj. kood",
"key": "objektiKood3"
},
{
"label": "Obj. nimi",
"key": "objektiNimi3"
},
{
"label": "Tellija",
"key": "tellija3"
},
{
"label": "Kontakt",
"key": "kontakt3"
},
{
"label": "Esindus",
"key": "esindus3"
},
{
"label": "Lepingu algus",
"key": "lepinguAlgus3"
},
{
"label": "Staatus",
"key": "staatus3"
},
{
"label": ""
},
{
"component": "dropdown",
"componentData": {
"componentClass": "status-table__dropdown js-status-table-dropdown",
"buttonModifier": "button--text button--text-color status-table__dropdown-button",
"isLabelHidden": true,
"triggerIconAnimated": false,
"content": "Kuva tabeli veerge",
"trigger": {
"text": "Valikud",
"icon": "dots",
"iconPosition": null
},
"choices": {
"label": "Kuva tabeli veerge",
"type": "check",
"choices": [
{
"id": "check1-2-2",
"label": "Lepingu nr",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"lepinguNr3\""
},
{
"id": "check2-2-2",
"label": "Objekti kood",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"objektiKood3\""
},
{
"id": "check3-2-2",
"label": "Objekti nimi",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"objektiNimi3\""
},
{
"id": "check4-2-2",
"label": "Tellija",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"tellija3\""
},
{
"id": "check5-2-2",
"label": "Kontakt",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"kontakt3\""
},
{
"id": "check6-2-2",
"label": "Esindus",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"esindus3\""
},
{
"id": "check7-2-2",
"label": "Lepingu algus",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"lepinguAlgus3\""
},
{
"id": "check8-2-2",
"label": "Staatus",
"isChecked": true,
"name": "check",
"attributes": "data-key=\"staatus3\""
}
],
"isLabelHidden": true
}
}
}
],
"rows": [
{
"cells": [
{
"content": "<span class=\"text-truncate\"><a href=\"#\">RC080845</a></span>",
"key": "lepinguNr3"
},
{
"content": "12",
"key": "objektiKood3"
},
{
"content": "12",
"key": "objektiNimi3"
},
{
"content": "Kristel-Maria K...",
"key": "tellija3"
},
{
"content": "Rendipunkt",
"key": "kontakt3"
},
{
"content": "<span class=\"text-truncate\"><a href=\"#\">1011</a></span>",
"key": "esindus3"
},
{
"content": "01.06.2022",
"key": "lepinguAlgus3"
},
{
"component": "status",
"componentData": {
"text": "Lõpetatud",
"type": "inactive"
},
"key": "staatus3"
},
{
"component": "button",
"componentData": {
"componentClass": "status-table__button",
"modifier": "button--tiny",
"text": "Vaata"
}
}
]
}
]
}
}
}