{% load i18n %}
<!-- ko if: loading() === false -->
<div class="final-step">
    <div class="her-final-step-section">
        <h5 class="summary-value">{% trans 'Created or Modified Resource Instance' %}</h5>
        <div class="final-step-section-block">
            <div class="final-step-section-block-item">
                <a data-bind="attr: { href: urls.resource + '/' + resourceid}" target="_blank">
                    <div class="summary-value" 
                        data-bind = "text: displayName + ' ({% trans 'Consultation Resource Instance' %})'">
                    </div>
                </a>
            </div>
        </div>
    </div>
    <div class="her-final-step-section">
        <h5 class="summary-value">{% trans 'Correspondence Communication Details' %}</h5>
        <div class="final-step-section-block">
            <div class="final-step-section-block-item">
                <div class="block-item">
                    <div class="summary-label" data-bind="text: reportVals.consultationName.name + ':'"></div>
                    <div class="summary-value" data-bind="text: reportVals.consultationName.value"></div>
                </div>
                <div class="block-item">
                    <div class="summary-label" data-bind="text: reportVals.letterType.name + ':'"></div>
                    <div class="summary-value" data-bind="text: reportVals.letterType.value"></div>
                </div>
            </div>
        </div>
    </div>
    <div class="her-final-step-section">
        <h5 class="summary-value">{% trans 'Download Letter' %}</h5>
        <div class="final-step-section-block">
            <div class="final-step-section-block-item">
                <div class="block-item">
                    <div class="summary-label" data-bind="text: reportVals.letter.name + ':'"></div>
                    <a data-bind="attr: { href: dataURL }, click: function() { return true; }, clickBubble: false" target="_blank">
                        <div class="summary-value" data-bind="text: reportVals.letter.value"></div>
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- /ko -->
