[% USE T8 %]
[% USE LxERP %]
[% USE L %]

<div id="additional_billing_addresses">
<div class="select-item control-panel">
  [% 'Billing Address' | $T8 %]
    [% L.select_tag(
        'additional_billing_address.id',
        SELF.additional_billing_addresses,
        default     = SELF.additional_billing_address.id,
        value_key   = 'id',
        title_key   = 'displayable_id',
        with_empty  = 1,
        empty_title = LxERP.t8('New address'),
        onchange    = "kivi.CustomerVendor.selectAdditionalBillingAddress({onFormSet: function(){ additionalBillingAddressMapWidget.testInputs(); kivi.reinit_widgets(); }});",
      )
    %]
</div>

<div class="wrapper">

<div class="buttons">
  [% 'Default Billing Address' | $T8 %]
  [% L.yes_no_tag('additional_billing_address.default_address', SELF.additional_billing_address.default_address) %]
</div>

<div class="item">
  
  <table id="additional_billing_address_table" class="tbl-horizontal">
    <caption>[% 'Name and Address' | $T8 %]</caption>
    <tbody>
      <tr>
        <th>[% 'Name' | $T8 %]</th>
        <td>[% L.input_tag('additional_billing_address.name', SELF.additional_billing_address.name, class="wi-wide") %]</td>
      </tr>
      <tr>
        <th>[% 'Department' | $T8 %]</th>
        <td>
          [% L.input_tag('additional_billing_address.department_1', SELF.additional_billing_address.department_1, class="wi-wide") %]<br>
          [% L.input_tag('additional_billing_address.department_2', SELF.additional_billing_address.department_2, class="wi-wide addition") %]
        </td>
      </tr>
      <tr>
        <th>[% 'Street' | $T8 %]</th>
        <td>
          [% L.input_tag('additional_billing_address.street', SELF.additional_billing_address.street, class="wi-wide") %]

          <span id="additional_billing_address_map"></span>
          <script type="text/javascript">
            additionalBillingAddressMapWidget = new kivi.CustomerVendor.MapWidget('additional_billing_address_');
            $(function() {
              additionalBillingAddressMapWidget.render($('#additional_billing_address_map'));
            });
          </script>
        </td>
      </tr>
      <tr>
        <th>[% 'Zipcode' | $T8 %]/[% 'City' | $T8 %]</th>
        <td>
          [% L.input_tag('additional_billing_address.zipcode', SELF.additional_billing_address.zipcode, class="wi-verysmall") %][% L.input_tag('additional_billing_address.city', SELF.additional_billing_address.city, class="wi-wide--verysmall") %]
        </td>
      </tr>
      <tr>
        <th>[% 'Country' | $T8 %]</th>
        <td>[% L.input_tag('additional_billing_address.country', SELF.additional_billing_address.country, class="wi-wide") %]</td>
      </tr>
      <tr>
        <th>[% 'GLN' | $T8 %]</th>
        <td>[% L.input_tag('additional_billing_address.gln', SELF.additional_billing_address.gln, class="wi-wide") %]</td>
      </tr>
    </tbody>
  </table>

  <table class="tbl-horizontal">
    <caption>[% 'Communication' | $T8 %]</caption>
    <tbody>
      <tr>
        <th>[% 'Contact' | $T8 %]</th>
        <td>[% L.input_tag('additional_billing_address.contact', SELF.additional_billing_address.contact, class="wi-wide") %]</td>
      </tr>
      <tr>
        <th>[% 'Phone' | $T8 %]</th>
        <td>[% L.input_tag('additional_billing_address.phone', SELF.additional_billing_address.phone, class="wi-wide") %]</td>
      </tr>
      <tr>
        <th>[% 'Fax' | $T8 %]</th>
        <td>[% L.input_tag('additional_billing_address.fax', SELF.additional_billing_address.fax, class="wi-wide") %]</td>
      </tr>
      <tr>
        <th>[% 'E-mail' | $T8 %]</th>
        <td>[% L.input_tag('additional_billing_address.email', SELF.additional_billing_address.email, class="wi-wide") %]</td>
      </tr>
    </tbody>
  </table>

</div><!-- /.item -->

<div class="buttons">
  [% L.button_tag('submitInputButton("delete_additional_billing_address");', LxERP.t8('Delete address'), class = 'submit') %]
</div>

</div><!-- /.wrapper -->
[% IF ( !SELF.additional_billing_address.id ) %]
  <script type="text/javascript">
    $('#action_delete_additional_billing_address').hide();
  </script>
[% END %]
</div>