@model Platform.ViewModels.HomeModel
@{
    HideBread = true;
}
<br />
<div class="row">
    <div class="col-2">
        <div class="card" style="min-height:100%;">
            <div class="card-header">
                组织机构
            </div>
            <div class="card-body">
                <div class="jstree">
                    <ul>
                        @RenderOrgans(Model.Organs)
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="col-10">
        <div class="card" style="min-height:100%;">
            <div class="card-header">
                @Model.Organ.GetDisplayName()
                @if (Model.BuildingId.HasValue)
                {
                    <text> / @Model.Building.GetDisplayName()</text>
                }
            </div>
            <div class="card-body">
                <div>此处显示当前设备里温湿度和光照等环境传感器的最大最小值</div>
                <div>此处显示当前建筑里的场景列表</div>
                @if (Model.Buildings.Any())
                {
                    <div>
                        <h2>此处显示下级建筑列表，带温湿度平均值、带批量开关用电器按钮</h2>
                        @foreach (var item in Model.Buildings)
                        {
                            <div>
                                <a href="@Url.Action(null,null,new { buildingId = item.Id})">机构建筑：@item.Name</a>
                            </div>
                        }
                    </div>
                }
                @if (Model.Deviceses.Any())
                {
                    <div>
                        <h2>此处分页显示设备，设备带快捷操作</h2>
                        @foreach (var item in Model.Deviceses)
                        {
                            <div>
                                <a href="@Url.Action(null,null,new { buildingId = item.Id})">设备：@item.Name</a>
                            </div>
                        }
                    </div>
                    <div>
                        @(await Html.PartialAsync("_Paged"))
                    </div>
                }
            </div>
        </div>
    </div>
</div>

@functions{
    object RenderOrgans(List<Organ> list)
    {
        foreach (var item in list)
        {
            <li @if (!Model.BuildingId.HasValue && Model.OrganId.HasValue && item.Id == Model.OrganId.Value) {<text> data-jstree='{"selected":true}' </text> }>
                <a href="@Url.Action(null,null,new { organId=item.Id})">@item.Name</a>
                @if (item.Children.Any() || item.Buildings.Any())
                {
                    <ul>
                        @if (item.Children.Any())
                        {
                            @RenderOrgans(item.Children)
                        }
                        @if (item.Buildings.Any())
                        {
                            @RenderBuildings(item.Buildings)
                        }
                    </ul>
                }
            </li>
        }
        return null;
    }

    object RenderBuildings(List<Building> list)
    {
        foreach (var item in list)
        {
            <li class="jstree-open" @if (Model.BuildingId.HasValue && item.Id == Model.BuildingId.Value) { <text> data-jstree='{"selected":true}' </text> }>
                <a href="@Url.Action(null,null,new { buildingId=item.Id})">@item.Name</a>
                @if (item.Children.Any())
                {
                    <ul>
                        @if(item.Children.Any())
                        {
                            @RenderBuildings(item.Children)
                        }
                    </ul>
                }
            </li>
        }
        return null;
    }
}

@section scripts{
    <script>
        var tree = $('.jstree').on('changed.jstree', function (e, data) {
            if (data.event) {
                window.location.href = data.event.currentTarget.href;
            }
            console.log(data.node);
        }).jstree();
        console.log(tree);
    </script>
}