@model PantheonRA.BackOffice.Models.PreviewReportTreeViewModel

<div id="@(string.IsNullOrEmpty(Model.Id) ? "reportTreeDropdown" : Model.Id)" class="reportTreeDropdown" hidden>
    <div class="btn-group dropdown custom-dropdown">
        <button type="button" class="btn btn-ghost dropdown-toggle p-none" data-toggle="dropdown">
            <span class="fa fa-eye fa-lg text-muted m-r-xs"></span><span class="text-muted caret"></span>
        </button>
        <ul class="dropdown-menu dropdown-menu-left printMenuDropdown">
            @if (Model.ReportTree != null)
            {
                foreach (var report in Model.ReportTree)
                {
                    <li class="dropdown-submenu">
                        <a href="#" class="dropdown-menu-icon" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                            <span class="nav-label">
                                @report.Category
                            </span>
                            <span class="caret caret-right"></span>
                        </a>
                        <ul class="dropdown-menu printMenuDropdown">
                            @foreach (var formReport in report.FormReports)
                            {
                                <li class="preview-print-option" data-print="@formReport.Report" data-fisc="@formReport.Fiscalize">
                                    <a onclick="" title="@formReport.Report - @formReport.Name">
                                        @formReport.Report - @formReport.Name
                                    </a>
                                </li>
                            }
                        </ul>
                    </li>
                }
            }
        </ul>
    </div>
</div>

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

    function setPreviewDropdownToggle($element, acKey) {
        var $dropdownSubmenu = $('.dropdown-submenu a');
        var $dropdownMenu = $('.dropdown-menu a');
        var $dropdownMainButton;

        if ($element) {
            $dropdownSubmenu = $element.find('.dropdown-submenu a');
            $dropdownMenu = $element.find('.dropdown-menu a');
            $dropdownMainButton = $element
        }

        $dropdownSubmenu.on("click", function (e) {
            $(this).children(".dropdown-menu[style*='display: block']").toggle();
            $(this).next('ul').toggle();
            e.stopPropagation();
            e.preventDefault();
        });

        $dropdownMenu.on("click", function (e) {
            if ($(this).closest("li").hasClass("dropdown-submenu")) {
                $(this).closest(".dropdown-menu").find(".dropdown-submenu").not($(this).closest("li")).children(".dropdown-menu").hide();
            }
        });
    }

    function setPreviewOnClicks(func) {
        $.each($(".reportTreeDropdown .preview-print-option"), function (key, item) {
            item.children[0].setAttribute("onclick", stringFormat(func, null, $(item).attr("data-print"), $(item).attr("data-fisc")));
        });
    }
</script>
