<?xml version="1.0" encoding="UTF-8" ?>
<templates xml:space="preserve">
  <t t-name="eurooffice_odoo_templates.ExportDataItem" owl="1">
    <div
      t-att-data-field_id="props.field.id"
      t-attf-class="o-eurooffice-list-field {{ state.subfields.length ? 'o-eurooffice-list-field_expanded mb-2' : '' }} {{ props.field.parent ? 'o-eurooffice-list-field_children' : ''}}"
      role="treeitem"
      t-on-click.stop="() => this.toggleItem(props.field, true)"
      t-attf-data-tooltip="{{ props.isTechnicalName ? props.field.string : props.field.id }}"
    >
      <div
        t-attf-class="o-eurooffice-field list-group-item-action {{ state.subfields.length ? 'o-eurooffice-field_expanded list-group-item active' : '' }}"
      >
        <span
          t-if="props.isFieldExpandable(props.field.id)"
          t-attf-class="o-eurooffice-field-caret fa {{ state.subfields.length ? 'fa-caret-down' : 'fa-caret-right' }}"
          role="img"
          aria-label="Show sub-fields"
          title="Show sub-fields"
        />
        <span t-if="props.isTechnicalName" class="o-eurooffice-field-title" t-esc="props.field.formattedId" />
        <span t-else="" class="o-eurooffice-field-title" t-esc="props.field.formattedString" />
        <!--<span
          t-if="props.field.field_type === 'binary'"
          title="Image"
          t-attf-class="o-eurooffice-field-type fa fa-picture-o float-end m-1"
        />-->
      </div>
      <t t-foreach="state.subfields" t-as="field" t-key="field.id">
        <ExportDataItem t-props="props" field="field" />
        <t t-if="field_index === state.subfields.length-1">
          <hr class="o-eurooffice-template-separator" />
        </t>
      </t>
    </div>
  </t>

  <t t-name="eurooffice_odoo_templates.ExportData" owl="1">
    <div class="o-eurooffice-fields-options">
      <div class="o-eurooffice-options-help">
        <span> Choose the field below to paste selected parameter to the cursor </span>
      </div>
      <div class="o-eurooffice-options-title">
        <span>Module/ section</span>
      </div>
      <div class="o-eurooffice-options-search">
        <div class="o-eurooffice-search-field o_searchview">
          <input
            t-ref="search"
            class="o-eurooffice-search-input o_searchview_input form-control"
            id="o-export-search-filter"
            t-attf-placeholder="{{ state.isTechnicalName ? 'Search technical name' : 'Search field' }}"
            t-on-input="onSearch"
          />
          <button t-if="this.searchRef.el and this.searchRef.el.value" t-on-click="onCleanSearch">
            <svg width="12" height="11" viewBox="0 0 12 11" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
              <path
                fill-rule="evenodd"
                clip-rule="evenodd"
                d="M0.810547 0.707106L1.4718 1.36836L2.7943 2.69087L5.29585 5.19244L3.00452 7.48377L1.57703 8.91125L0.863283 9.625L1.57039 10.3321L2.28413 9.61836L3.71162 8.19087L6.00295 5.89954L8.2943 8.19089L9.7218 9.61839L10.4355 10.3321L11.1427 9.62503L10.4289 8.91128L9.0014 7.48378L6.71006 5.19244L9.21162 2.69087L10.5341 1.36836L11.1954 0.707108L10.4883 0L9.82703 0.661255L8.50452 1.98377L6.00295 4.48533L3.50141 1.98377L2.17891 0.661257L1.51766 0L0.810547 0.707106Z"
                fill="black"
              />
            </svg>
          </button>
          <button t-else="">
            <svg width="14" height="14" viewBox="0 0 14 14" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
              <path
                fill-rule="evenodd"
                clip-rule="evenodd"
                d="M10 5.5C10 7.98528 7.98528 10 5.5 10C3.01472 10 1 7.98528 1 5.5C1 3.01472 3.01472 1 5.5 1C7.98528 1 10 3.01472 10 5.5ZM9.01953 9.72663C8.06578 10.5217 6.83875 11 5.5 11C2.46243 11 0 8.53757 0 5.5C0 2.46243 2.46243 0 5.5 0C8.53757 0 11 2.46243 11 5.5C11 6.83875 10.5217 8.06578 9.72663 9.01953L13.8536 13.1465L13.1465 13.8536L9.01953 9.72663Z"
                fill="black"
              />
            </svg>
          </button>
        </div>
      </div>
      <div class="o-eurooffice-options-technical-name">
        <CheckBox id="'o-display-option'" value="state.isTechnicalName" onChange.bind="onToggleDisplayOption">
          Use a technical name
        </CheckBox>
      </div>
      <hr class="o-eurooffice-template-separator" />
    </div>
    <div class="o-eurooffice-fields-list">
      <t t-if="fieldsAvailable">
        <t t-foreach="rootFields" t-as="field" t-key="field.id + '_' + state.search.length + '_' + state.isCompatible">
          <ExportDataItem
            field="field"
            filterSubfields.bind="filterSubfields"
            isExpanded="state.search.length > 0"
            isFieldExpandable.bind="isFieldExpandable"
            isTechnicalName="state.isTechnicalName"
            loadFields.bind="loadFields"
          />
        </t>
      </t>
      <h3 t-else="" class="text-center text-muted mt-5 o_no_match">No match found.</h3>
    </div>
  </t>
</templates>
