[%- USE T8 %]
[%- USE HTML %]
[%- USE LxERP %]
[%- USE L %]
[%- USE P %]

<div id="assortment" name="assortment">

<h2>[% 'Assortment items' | $T8 %]</h2>

[% L.hidden_tag('assortment_id', SELF.part.id) %]

<table id="assortment_items">
 <thead>
   <tr class="listheading">
     <th class="listheading" style='display:none'></th>
     [% IF SELF.orphaned %]
     <th class="listheading" style='text-align:center' nowrap width="1"><img src="image/close.png" alt="[%- LxERP.t8('delete item') %]"></th>
     [% END %]
     <th class="listheading" nowrap width="3" >[%- 'position'     | $T8 %] </th>
     [% IF SELF.orphaned %]
     <th class="listheading" style='text-align:center' nowrap width="1"><img src="image/updown.png" alt="[%- LxERP.t8('reorder item') %]"></th>
     [% END %]
     <th id="partnumber_header_id"  class="listheading" nowrap width="15"><a href='#' onClick='javascript:kivi.Part.reorder_items("partnumber")'> [%- 'Partnumber'  | $T8 %]</a></th>
     <th id="partdescription_header_id"  class="listheading" nowrap width="15"><a href='#' onClick='javascript:kivi.Part.reorder_items("description")' >[%- 'Description' | $T8 %]</a></th>
     <th id="qty_header_id"         class="listheading" nowrap width="5" ><a href='#' onClick='javascript:kivi.Part.reorder_items("qty")'>        [%- 'Qty'         | $T8 %]</a></th>
     <th class="listheading" nowrap width="5" >[%- 'Unit'         | $T8 %] </th>
     <th class="listheading" nowrap width="5" >[%- 'Charge'       | $T8 %] </th>
     <th class="listheading" nowrap width="5" >[%- 'Line Total'   | $T8 %] </th>
     <th id="sellprice_header_id"   class="listheading" nowrap width="10" ><a href='#' onClick='javascript:kivi.Part.reorder_items("sellprice")'> [%- 'Sellprice'   | $T8 %]</a></th>
     <th id="lastcost_header_id"   class="listheading" nowrap width="10" ><a href='#' onClick='javascript:kivi.Part.reorder_items("lastcost")'> [%- 'Lastcost'      | $T8 %]</a></th>
     <th id="_header_id"   class="listheading" nowrap width="15" ><a href='#' onClick='javascript:kivi.Part.reorder_items("partsgroup")'> [%- 'Partsgroup'       | $T8 %]</a></th>
   </tr>
 </thead>
<tbody id="assortment_rows">
  [% assortment_html %]
</tbody>
<tbody id="assortment_input">
<tr>
 [% IF SELF.orphaned %]
 <td></td>
 <td></td>
 <td align="right">[% 'Part' | $T8 %]:</td>
 <td>[% P.part.picker('add_items[+].parts_id', '', style='width: 300px', multiple=1, id='assortment_picker', action={set_multi_items='kivi.Part.set_multi_assortment_items'}) %]</td>
 <td>[%- L.button_tag("kivi.Part.add_assortment_item()", LxERP.t8("Add")) %]</td>
 <td>[% L.button_tag('$("#assortment_picker").data("part_picker").open_dialog()', LxERP.t8('Add multiple items')) %]</td>
 <td>[% L.hidden_tag('add_items[].qty_as_number', 1) %]</td>
 [% ELSE %]
 <td></td>
 <td></td>
 <td></td>
 <td></td>
 <td></td>
 <td></td>
 [% END %]
 <td></td>
 <td align="right">[% 'Totals' | $T8 %]:</td>
 <th id="items_sellprice_sum" class="numeric">[%- LxERP.format_amount(items_sellprice_sum, 2, 0) %]</td>
 <th id="items_lastcost_sum"  class="numeric">[%- LxERP.format_amount(items_lastcost_sum,  2, 0) %]</td>
 <th id="items_sum_diff"      class="numeric">[%- LxERP.format_amount(items_sum_diff,      2, 0) %]</td>
</tr>
<tr>
 [% IF SELF.orphaned %]
 <td></td>
 <td></td>
 [% END %]
 <td></td>
 <td></td>
 <td></td>
 <td></td>
 <td></td>
 <td></td>
 <td></td>
 <td align="right">[% L.button_tag("kivi.Part.set_assortment_sellprice()", LxERP.t8("Set sellprice")) %]</td>
 <td align="right">[% L.button_tag("kivi.Part.set_assortment_lastcost()",  LxERP.t8("Set lastcost"))  %]</td>
 <td></td>
</tr>
</tbody>
</table>

[% L.sortable_element('#assortment_rows') %]

</div>

<script type="text/javascript">
  $(function() {
    $("#assortment").on( "focusout", ".recalc", function( event )  {
      kivi.Part.assortment_recalc();
    });

    $("#assortment").on( "change", ":checkbox", function( event )  {
      kivi.Part.assortment_recalc();
    });

    $('#assortment_rows').on('sortstop', function(event, ui) {
      $('#assortment thead a img').remove();
      kivi.Part.renumber_positions();
    });
  })
</script>