{% extends 'field-manager/_layouts' %}
{% import '_includes/forms' as forms %}

{% set crumbs = [
    { label: 'Field Manager' | t('field-manager'), url: url('field-manager') },
    { label: 'Fields' | t('field-manager'), url: url('field-manager') },
] %}

{% set title = 'Fields' %}
{% set selectedTab = 'fields' %}

{% set fullPageForm = true %}

{% block actionButton %}
    <a href="{{ url('settings/fields/new') }}" class="submit btn add icon new-field-btn">{{ 'New field' | t('field-manager') }}</a>
{% endblock %}

{% block blockContent %}

<input type="hidden" name="action" value="field-manager/base/export">

<table id="fieldmanager" class="data fullwidth field-manager-table">
    <thead>
        <th>{{ 'Field' | t('field-manager') }}</th>
        <th>{{ 'Handle' | t('field-manager') }}</th>
        <th>{{ 'Type' | t('field-manager') }}</th>
        <th></th>
        <th></th>
    </thead>
    <tbody>
        <tr class="group" data-groupid="1">
            <th scope="row">
                {{ forms.checkboxField({
                    label: 'All Fields' | t('field-manager'),
                }) }}
            </th>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>

        {% for field in craft.app.fields.getAllFields() %}
            <tr class="field" data-id="{{ field.id }}" data-groupid="1" data-name="{{ field.name }}">
                <th scope="row" class="name">
                    {% set label %}
                        <span class="go">
                            <a href="{{ url('settings/fields/edit/' ~ field.id) }}">{{ field.name }}</a>

                            {% if field.uid in getUnusedFields %}
                                <span class="unused-field">{{ 'Unused' | t('field-manager') }}</span>
                            {% endif %}
                        </span>
                    {% endset %}

                    {{ forms.checkboxField({
                        name: 'selectedFields[]',
                        value: field.id,
                        label: label,
                    }) }}
                </th>

                <td><code>{{ field.handle }}</code></td>

                {% if field is missing %}
                    <td><span class="error">{{ field.expectedType }}</span></td>
                {% else %}
                    <td>{{ field.displayName() }}</td>
                {% endif %}

                {% if field is missing %}
                    <td class="thin"></td>
                {% else %}
                    <td class="thin"><div class="btn small clone-btn element">{{ 'Clone' | t('field-manager') }}</div></td>
                {% endif %}

                <td class="thin delete-row">
                    <a class="delete icon" title="{{ 'Delete' | t('field-manager') }}" role="button"></a>
                </td>
            </tr>
        {% endfor %}
    </tbody>
</table>

<hr>

<div class="buttons field-manager-buttons">
    <input type="submit" class="btn submit disabled export-btn" disabled value="{{ 'Export selected' | t('field-manager') }}">

    {{ forms.checkboxField({
        label: 'Download export file' | t('field-manager'),
        id: 'download',
        name: 'download',
        value: 1,
        checked: true,
    }) }}
</div>

{% endblock %}

{% js %}
    new Craft.AdminTable({
        tableSelector: '#fieldmanager',
        noObjectsSelector: '#nofields',
        deleteAction: 'fields/delete-field'
    });
{% endjs %}