{% extends "views/report-templates/default.htm" %}
{% load i18n %}
{% block report %}

{% block body %}
<!-- ko ifnot: hideNames() -->
<div data-bind="visible: !!dataConfig.name" class="aher-report-section">
    <h2 class="aher-report-section-title"><i tabindex="0" data-bind="onEnterkeyClick, onSpaceClick, click: function() {toggleVisibility(visible.names)}, onReportSectionToggleAria: visible.names, sectionName: '{% trans "Names" %}'" class="fa toggle"></i> {% trans "Names" %}</h2>
    <!-- ko if: checkCardsAvailable($parent.cards) -->
        <span data-bind="if: cards.name && (!names().length || cards.name.cardinality == 'n')">
            <a href="#" class="aher-report-a" data-bind="click: function(){add(cards.name)}"><i class="fa fa-mail-reply"></i> {% trans "Add Name" %}</a>
        </span>
    <!-- /ko -->

    <!-- Collapsible content -->
    <div data-bind="visible: visible.names" class="aher-report-collapsible-container pad-lft">

        <!-- ko ifnot: names().length -->
        <div class="aher-nodata-note">No names for this resource</div>
        <!-- /ko -->

        <!-- ko if: names().length -->
        <div class="aher-report-subsection" >
            <div>
                <div class="aher-table pad-btm">
                    <table class="table table-striped" cellspacing="0" width="100%">
                        <thead>
                            <tr class="aher-table-header">
                                <th>{% trans "Name" %}</th>
                                <th class="">{% trans "Name Use Type" %}</th>
                                <th class="">{% trans "Name Currency" %}</th>
                                <th class="aher-table-control all"></th>
                            </tr>
                        </thead>
                        <tbody data-bind="dataTablesForEach: { data: names, dataTableOptions: nameTableConfig }">
                            <tr>
                                <td data-bind="text: name"></td>
                                <td data-bind="text: nameUseType"></td>
                                <td data-bind="text: currency"></td>
                                <td class="aher-table-control">
                                    <div data-bind="if: $parent.cards && $parent.cards.name">
                                        <a href="#" data-bind="onEnterkeyClick, onSpaceClick, click: function() {$parent.edit(tileid, $parent.cards.name)}">
                                            <i class="fa fa-mail-reply"></i>
                                        </a>
                                        <a href="#" data-bind="if: $parent.cards.name.cardinality == 'n', onEnterkeyClick, onSpaceClick, click: $parent.deleteTile.bind($data, tileid, $parent.cards.name, $parent.resource)">
                                            <i class="fa fa-trash"></i>
                                        </a>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <!-- /ko -->
    </div>
</div>
<!-- /ko -->

<!-- External Reference -->
<!-- ko ifnot: hideCrossReferences() -->
<div data-bind="visible: !!dataConfig.xref" class="aher-report-section">
    <h2 class="aher-report-section-title"><i tabindex="0" data-bind="onEnterkeyClick, onSpaceClick, click: function() {toggleVisibility(visible.crossReferences)}, onReportSectionToggleAria: visible.crossReferences, sectionName: '{% trans "External Cross References" %}'" class="fa toggle"></i> {% trans "External Cross References" %}</h2>
    
    <!-- ko if: checkCardsAvailable($parent.cards) -->
        <a href="#" data-bind="{if: cards.externalCrossReferences, click: function(){addNewTile(cards.externalCrossReferences)}}" class="aher-report-a"><i class="fa fa-mail-reply"></i> {% trans "Add Reference" %}</a>
    <!-- /ko -->

    <!-- Collapsible content -->
    <div data-bind="visible: visible.crossReferences" class="aher-report-collapsible-container pad-lft">
        <!-- ko ifnot: crossReferences().length -->
        <div class="aher-nodata-note">No references for this resource</div>
        <!-- /ko -->

        <!-- ko if: crossReferences().length -->
        <div class="aher-report-subsection">
            <div class="firstchild-container">
                <div class="aher-table">
                    <table class="table table-striped" cellspacing="0" width="100%">
                        <thead>
                            <tr class="aher-table-header">
                                <th>{% trans "Name" %}</th>
                                <th class="min-tabletl">{% trans "Source" %}</th>
                                <th class="none">{% trans "Note" %}</th>
                                <th>{% trans "URL" %}</th>
                                <th class="aher-table-control all"></th>
                            </tr>
                        </thead>
                        <tbody data-bind="dataTablesForEach: {data: crossReferences, dataTableOptions: crossReferenceTableConfig}">
                            <tr>
                                <td data-bind="text: name"></td>
                                <td data-bind="text: source"></td>
                                <td data-bind="html: description"></td>
                                <td>
                                    <!-- ko with: url -->
                                    <!-- ko if: url -->
                                    <a data-bind="text: url, attr: {href: url, target: '_blank'}"></a>
                                    <!-- /ko -->
                                    <!-- /ko -->
                                </td>
                                <td class="aher-table-control">
                                    <div data-bind="if: $parent.cards.externalCrossReferences">
                                        <a href="#" data-bind="onEnterkeyClick, onSpaceClick, click: function(){$parent.editTile(tileid, $parent.cards.externalCrossReferences)}">
                                            <i class="fa fa-mail-reply"></i>
                                        </a>
                                        <a href="#" data-bind="if: $parent.cards.externalCrossReferences.cardinality == 'n', onEnterkeyClick, onSpaceClick, click: $parent.deleteTile.bind($data, tileid, $parent.cards.externalCrossReferences, $parent.resource)">
                                            <i class="fa fa-trash"></i>
                                        </a>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <!-- /ko -->
    </div>
</div>
<!-- /ko -->

<!-- System Reference Numbers section -->
<div class="aher-report-section">
    <h2 class="aher-report-section-title"><i tabindex="0" data-bind="onEnterkeyClick, onSpaceClick, click: function() {toggleVisibility(visible.systemReferenceNumbers)}, onReportSectionToggleAria: visible.systemReferenceNumbers, sectionName: '{% trans "System Reference Numbers" %}'" class="fa toggle"></i> {% trans "System Reference Numbers" %}</h2>
    <!-- ko if: checkCardsAvailable($parent.cards) -->
        <a href="#" data-bind="{if: cards.systemReferenceNumbers, click: function(){ addNewTile(cards.systemReferenceNumbers) }}" class="aher-report-a">
            <i class="fa fa-mail-reply"></i>
            <span data-bind="if: cards.systemReferenceNumbers.tiles().length">{% trans "Edit Identifier" %}</span>
            <span data-bind="ifnot: cards.systemReferenceNumbers.tiles().length">{% trans "Add Identifier" %}</span>
        </a>
    <!-- /ko -->

    <!-- Collapsible content -->
    <div data-bind="visible: visible.systemReferenceNumbers" class="aher-report-collapsible-container pad-lft">
        <!-- ko ifnot: systemReferenceNumbers() -->
        <div class="aher-nodata-note">No references for this resource</div>
        <!-- /ko -->

        <!-- ko if: systemReferenceNumbers() -->
        <div class="aher-report-subsection" data-bind="with: systemReferenceNumbers, as: 'srn'">

            <div class="firstchild-container">
                <div class="aher-report-subsection-ite">
                    <div class="aher-block-attributes">
                        <span class="aher-block-key">Resource ID: </span>
                        <div class="aher-block-value" data-bind="text:srn.resourceId"></div>
                    </div>
                    <div class="aher-block-attributes">
                        <span class="aher-block-key">Legacy ID: </span>
                        <div class="aher-block-value" data-bind="text:srn.legacyId"></div>
                    </div>
                    <div class="aher-block-attributes">
                        <span class="aher-block-key">Primary Reference Number: </span>
                        <div class="aher-block-value" data-bind="text:srn.primaryReferenceNumber"></div>
                    </div>
                </div>
            </div>
        </div>
        <!-- /ko -->
    </div>
</div>

<div data-bind="visible: !!dataConfig.parent, component: {
    name: 'views/components/reports/scenes/default',
    params: {
        data: parentData
    }
}"></div>


<div data-bind="visible: !!dataConfig.recordStatus, component: {
    name: 'views/components/reports/scenes/default',
    params: {
        data: recordStatusData,
    }
}"></div>

{% endblock body %}
{% endblock report %}
{% block summary %}

<div class="model-summary-report">
Do not use - yet.
</div>

{% endblock summary %}