BeWoPlaner/BeWoPlanerMobil/Views/Main/GoalTreePartial.cshtml

@using BeWoPlanerMobil.Models
@using BeWoPlanerMobil.Util
@using BS.Shared
@using BS.Shared.DataContracts
@model MainModel

<script type="text/javascript">
    function toggleGoalHeader(branchId) {
        try {
            $(branchId).collapse("toggle");
        } catch(error) {
            showErrorPopup(error);
        }
    }

    function stopToggle(e) {
        try {
            e.stopPropagation();
        } catch(error) {
            showErrorPopup(error);;
        }
    }

    function goalTreeSearchOnChangeV2() {
        try {
            var text = $("#goal-search-input").val().toLowerCase();

            if(text.length === 0 || !text.replace(/\s\g/, '').length) {
                resetGoalTreeSearch();
                return;
            }

            $(".goal-card, .goal-text").hide();

            const goalLabels = $(".goal-name-label");

            $.each(goalLabels, function (index, item) {
                const label = $(item);

                const goalText = $.trim(label.text());
                
                if (false === goalText.toLowerCase().includes(text)) {
                    return;
                }

                const parents = label.parents(".goal-card, .goal-text");
                parents.show();
            });
        } catch(error) {
            showErrorPopup(error);
        }
    }

    function resetGoalTreeSearch() {
        try {
            $("#goal-search-input").val("");

            const entries = $(".goal-text");
            const treeCard = $(".goal-card");
            const collapsable = treeCard.find(".collapse");

            entries.show();
            treeCard.show();

            hideCollapsable(collapsable);
        } catch (error) {
            showErrorPopup(error);
        }
    }

    function getCheckedGoals() {
        try {
            const rootElement = $("#goals-tree");
            const checkboxes = rootElement.find("input");
            
            var selectedGoals = "";

            $.each(checkboxes, function(index, checkbox) {
                const box = $(checkbox);
                const id = box.attr("id").split("-")[2];

                if(box.prop("checked") === true && !id.includes("goal")) {
                    selectedGoals += `${id};`;
                }
            });

            const result = selectedGoals.substr(0, selectedGoals.length - 1);

            return result;
        } catch(error) {
            showErrorPopup(error);
            return null;
        }
    }

    function getCheckedGoalsAsArray() {
	    try {
		    const rootElement = $("#goals-tree");
		    const checkboxes = rootElement.find("input");
		    const oids = [];

		    $.each(checkboxes, function(index, checkbox) {
			    const box = $(checkbox);
			    const id = box.attr("id").split("-")[2];

			    if(box.prop("checked") === true && !id.includes("goal")) {
                    oids.push(id);
			    }
		    });

		    return oids;
	    } catch(error) {
		    showErrorPopup(error);
		    return null;
	    }
    }

    function updateSelectedGoals() {
        try {
	        const selectedGoals = getCheckedGoals();

            const goalsAsMap = new Map(selectedGoals.split(";").map(item => [item, null]));

            window.updateGoals2Ratings("@Model.BookingModePrefix", goalsAsMap);

	        $.get("@Url.Action("UpdateGoals")", {pGoalOids: selectedGoals}, function (numberOfSelectedGoals) {
                $("#goals-button").html(`Ziele <span class='badge badge-light text-primary'>${numberOfSelectedGoals}</span>`);
            });
        } catch(error) {
            showErrorPopup(error);
        }
    }

    function toggleAllGoalsSelection(element) {
        try {
            $('.goal-input').prop("checked", $(element).is(':checked'));
            updateSelectedGoals();
        } catch(error) {
            showErrorPopup(error);
        }
    }

    function showAllGoals() {
        try {
            $(".goal-collapse").collapse("show");
        } catch(error) {
            showErrorPopup(error);
        }
    }

    function hideAllGoals() {
        try {
            $(".goal-collapse").collapse("hide");
        } catch(error) {
            showErrorPopup(error);
        }
    }
</script>

@helper BuildGoalTreeBranch(GoalTreeItem goalTreeItem)
{
    var collapseClass = Model.GoalTree.Count <= 30 ? "collapse show" : "collapse";

    var isChecked = Model.SelectedGoals.Any(a => a.ValueListEntryOid.HasValue && a.ValueListEntryOid.Value == goalTreeItem.ValueListEntryOid);
    var isCheckedValue = isChecked ? "checked" : string.Empty;
    
    var textClass = goalTreeItem.ValueListEntryType == ValueListEntryType.SupportConceptIndividualGoalCategoryType || 
                    goalTreeItem.ValueListEntryType == ValueListEntryType.SupportConceptIndividualGoalType 
        ? "text-bewo-custom-goal" 
        : string.Empty;

    RatingTypeDC ratingType = null;

    if(isChecked)
    {
        var selectedGoal = Model.SelectedGoals.FirstOrDefault(f => f.ValueListEntryOid.HasValue && f.ValueListEntryOid.Value == goalTreeItem.ValueListEntryOid);

        if(!(selectedGoal is null))
        {
            ratingType = Model.GoalRatingTypes.FirstOrDefault(f => f.RatingTypeOid.HasValue && f.RatingTypeOid.Value == selectedGoal.RatingTypeOid);
        }
    }

    if(!goalTreeItem.IsLeaf)
    {
        <div class="card w-100 mb-3 goal-card" id="c-@goalTreeItem.ValueListEntryOid">
            <div class="card-header px-2" onclick="cardHeaderClick('#goal-chevron-@goalTreeItem.ValueListEntryOid', '#collapsable-goal-tree-branch-@goalTreeItem.ValueListEntryOid')">
                <div class="clearfix">
                    <div class="custom-control custom-checkbox goal-card-header float-left" onclick="stopToggle(event)" >
                        <input type="checkbox" class="custom-control-input goal-input" value="@goalTreeItem.ValueListEntryOid" @isCheckedValue id="goal-cb-@goalTreeItem.ValueListEntryOid" onchange="updateSelectedGoals()" />
                        <label class="custom-control-label goal-name-label @textClass" for="goal-cb-@goalTreeItem.ValueListEntryOid">@goalTreeItem.Header</label>
                        @if(Model.HasAnyRatingTypes)
                        {
                            <span style="cursor: pointer;" id="goal-rating-@goalTreeItem.ValueListEntryOid" class="badge badge-bewo-goal-rating goal-rating-badge ml-1" onclick="showGoalRatingPopup(@goalTreeItem.ValueListEntryOid)">
                                @(ratingType?.DisplayName ?? goalTreeItem.RatingName)
                            </span>
                        }
                    </div>
                    <div class="btn-group float-right" role="group">
                        <span class="fas fa-chevron-down text-primary align-middle" id="goal-chevron-@goalTreeItem.ValueListEntryOid"></span>
                    </div>
                </div>
            </div>
            <div class="@collapseClass goal-collapse" id="collapsable-goal-tree-branch-@goalTreeItem.ValueListEntryOid">
                <div class="card-body p-1 goal-list">
                    @foreach(var child in goalTreeItem.Children)
                    {
                        @BuildGoalTreeBranch(child)
                    }
                </div>
            </div>
        </div>
    }
    else
    {
        var marginBottom = goalTreeItem.IsGoal ? "mb-3 mx-2" : "";

        <div class="custom-control custom-checkbox goal-text @marginBottom">
            <input type="checkbox" class="custom-control-input goal-input" id="goal-cb-@goalTreeItem.ValueListEntryOid" @isCheckedValue onchange="updateSelectedGoals()">
            <label for="goal-cb-@goalTreeItem.ValueListEntryOid" class="custom-control-label goal-name-label @textClass">@goalTreeItem.Header</label>
            @if(Model.HasAnyRatingTypes)
            {
                <span id="goal-rating-@goalTreeItem.ValueListEntryOid" style="cursor: pointer;" class="badge badge-bewo-goal-rating goal-rating-badge ml-1" onclick="showGoalRatingPopup(@goalTreeItem.ValueListEntryOid)">
                    @(ratingType?.DisplayName ?? goalTreeItem.RatingName)
                </span>
            }
        </div>
    }
}

@foreach(var branch in Model.GoalTree.OrderBy(goalTreeItem => goalTreeItem.Header))
{
    @BuildGoalTreeBranch(branch)
}