LocalGovIMS_localgov-ims/src/Admin/Views/Transaction/List.cshtml
@using PagedList.Mvc
@using BusinessLogic.Extensions
@model Admin.Models.Transaction.ListViewModel

@section Messages {
    @if (TempData.ContainsKey("Message") && TempData["Message"] != null) { Html.RenderPartial("_Message", TempData["Message"]); }
}

@{
    ViewBag.Title = "Transactions";
}

@section Header { Transactions }

@section Subheader { Payments and refunds }

@section Actions {

    @if (!Model.SearchCriteria.IsForAnImport)
    {
        <a href="@Url.Action("Import", "FileImport")" class="btn btn-secondary" id="upload">File import</a>
    }

    <a class="btn btn-secondary" id="export" onclick="SubmitMyForm()">Export</a>
}

<h3 class="visually-hidden">Search criteria</h3>

<div class="border border-1 rounded p-2">
    @Html.Partial("_Search", Model.SearchCriteria)
</div>

<h3 class="visually-hidden">Search results</h3>

@if (Model.Transactions != null && Model.Transactions.Any())
{
    <div class="table-responsive">
        <table class="table table-striped table-bordered table-hover mt-2">
            <thead>
                <tr>
                    <th scope="col" style="width: 10%">Date and time</th>
                    <th scope="col" style="width: 5%">MOP</th>
                    <th scope="col" style="width: 15%">Receipt</th>
                    <th scope="col" style="width: 20%">Type</th>
                    <th scope="col" style="width: 15%">Account</th>
                    <th scope="col" style="width: 15%">Narrative</th>
                    <th scope="col" style="width: 10%">Amount (£)</th>
                </tr>
            </thead>
            <tbody>

                @foreach (var transaction in Model.Transactions)
                {
                    <tr>
                        <td>@transaction.EntryDate</td>
                        <td class="text-center">
                            <div class="px-2 py-1 rounded-1 d-inline-flex"
                                 title="@(transaction.Mop != null ? transaction.Mop.MopName : "")"
                                 style="color:@(transaction.Mop != null ? transaction.Mop.TextColour() : ""); background-color:@(transaction.Mop != null ? transaction.Mop.BackgroundColour() : "") ">@(transaction.Mop != null ? transaction.Mop.MopCode : "")</div>
                        </td>
                        <td>
                            @if (User.IsInRole(Role.TransactionDetails))
                            {
                                <a href="@Url.Action("Details", new {id = transaction.PspReference})">@transaction.PspReference</a>
                            }
                            else
                            {
                                @transaction.PspReference
                            }
                            @if (transaction.PspReference != transaction.InternalReference)
                            {
                                <div>@transaction.InternalReference</div>
                            }
                        </td>
                        <td>
                            @(transaction.Fund != null ? string.Format("{0} ({1})", transaction.Fund.FundName, transaction.Fund.FundCode) : "")
                            <div class="sub">@transaction.CardHolderAddressLine1 @transaction.CardHolderAddressLine2 @transaction.CardHolderAddressLine3 @transaction.CardHolderAddressLine4 @transaction.CardHolderPostCode</div>
                        </td>
                        <td>@transaction.AccountReference</td>

                        <td class="force-wrap">@transaction.Narrative @transaction.AppReference</td>
                        <td class="text-end @if (transaction.Amount < 0) { @Html.Raw("td--negative") }">
                            @Html.ToCurrency(transaction.Amount)
                        </td>
                    </tr>
                }

            </tbody>
            <tfoot>
                <tr>
                    <td colspan="7">
                        @if (Model.Pages > 1)
                        {
                            @Html.PagedListPager(Model.Transactions, page => Url.Action(Model.SearchCriteria.SearchAction, new
                            {
                                page = page,
                                amount = Model.SearchCriteria.Amount,
                                fundCode = Model.SearchCriteria.FundCode,
                                receiptNumber = Model.SearchCriteria.ReceiptNumber,
                                startDate = Model.SearchCriteria.StartDate,
                                endDate = Model.SearchCriteria.EndDate,
                                accountReference = Model.SearchCriteria.AccountReference,
                                userId = Model.SearchCriteria.UserId,
                                mopCode = Model.SearchCriteria.MopCode,
                                narrative = Model.SearchCriteria.Narrative,
                                WildSearchAccountReference = Model.SearchCriteria.WildSearchAccountReference,
                                ImportId = Model.SearchCriteria.ImportId
                            }))
                        }
                    </td>
                </tr>
            </tfoot>
        </table>
    </div>
}
else
{
    Html.RenderPartial("_NoResultsMessage", "transactions");
}

<script>
    $(document).ready(function () {

        $('tr').click(function () {
            var href = $(this).find("a").attr("href");
            if (href) {
                window.location = href;
            }
        });

    });

    function SubmitMyForm() {
        console.log('In SubmitMyForm')

        var form = document.getElementById("search-form");

        form.action = "/Transaction/Export";
        form.submit();
        form.action = "/Transaction/Search";
    }
</script>

@section Scripts {
    @Scripts.Render("~/bundles/app/transaction")

    <script type="text/javascript">
        $(document).ready(function () {

            accessibleAutocomplete.enhanceSelectElement({
                displayMenu: 'overlay',
                autoSelect: false,
                confirmOnBlur: false,
                showAllValues: true,
                defaultValue: '',
                preserveNullOptions: true,
                placeholder: 'Select fund type',
                dropdownArrow: () => paymentsAdmin.controls.autocomplete.downarrow,
                selectElement: document.querySelector('#FundCode')
            });

            accessibleAutocomplete.enhanceSelectElement({
                displayMenu: 'overlay',
                autoSelect: false,
                confirmOnBlur: false,
                showAllValues: true,
                defaultValue: '',
                preserveNullOptions: true,
                placeholder: 'Select mop type',
                dropdownArrow: () => paymentsAdmin.controls.autocomplete.downarrow,
                selectElement: document.querySelector('#MopCode')
            });

            accessibleAutocomplete.enhanceSelectElement({
                displayMenu: 'overlay',
                autoSelect: false,
                confirmOnBlur: false,
                showAllValues: true,
                defaultValue: '',
                preserveNullOptions: true,
                placeholder: 'Select user',
                dropdownArrow: () => paymentsAdmin.controls.autocomplete.downarrow,
                selectElement: document.querySelector('#UserId')
            });

        });
    </script>

}
