@model Disco.Web.Models.Device.ShowModel
@{
    Authorization.Require(Claims.Device.ShowCertificates);
    var hasDownloadCert = Authorization.Has(Claims.Config.DeviceCertificate.DownloadCertificates);
}
<div id="DeviceDetailTab-Certificates" class="DevicePart">
    <div class="genericData certificateTable">
        @if (Model.Certificates.Count() > 0)
        {
            <table class="genericData certificateTable">
                <tr>
                    <th>
                        Name
                    </th>
                    <th>
                        Enabled
                    </th>
                    <th>
                        Allocated
                    </th>
                    <th>
                        Expires
                    </th>
                </tr>
                @foreach (var item in Model.Certificates)
                {
                    <tr>
                        <td>
                            @if (hasDownloadCert)
                            {
                                <a href="#" class="certificateDownload" data-id="@item.Id">@item.Name</a>
                            }
                            else
                            {
                                @item.Name
                            }
                        </td>
                        <td>
                            @item.Enabled
                        </td>
                        <td>
                            @CommonHelpers.FriendlyDate(item.AllocatedDate)
                        </td>
                        <td>
                            @CommonHelpers.FriendlyDate(item.ExpirationDate)
                        </td>
                    </tr>
                }
            </table>
            if (hasDownloadCert)
            {
                using (Html.BeginForm(MVC.API.DeviceCertificate.Download()))
                {
                    @Html.AntiForgeryToken()
                    <input type="hidden" name="id" />
                }
                <script>
                    $(function () {
                        $('#DeviceDetailTab-Certificates').on('click', '.certificateDownload', function (e) {
                            e.preventDefault();
                            const form = $('#DeviceDetailTab-Certificates').find('form');
                            form.find('input[name="id"]').val($(this).attr('data-id'));
                            form.trigger('submit');
                            return false;
                        })
                    })
                </script>
            }
        }
        else
        {
            <span class="smallMessage">No Certificates Allocated</span>
        }
    </div>
    <script>
        $('#DeviceDetailTabItems').append('<li><a href="#DeviceDetailTab-Certificates">Certificates [@(Model.Certificates.Count)]</a></li>');
    </script>
</div>