@extends('layouts.admin')
@section('content')
@push('css')
{{-- dropzone --}}
<link href="{{ asset('') }}/assets/libs/dropzone/min/dropzone.min.css" rel="stylesheet" type="text/css" />
<link href="{{ asset('') }}/assets/libs/dropify/css/dropify.min.css" rel="stylesheet" type="text/css" />
@endpush

    <div class="container-fluid bg-white">
      <div class="row">
        <div class="col-md-9">
            <div id="jstree">
                <ul>
                    <li>Head Name
                        <ul>
                            @foreach ($AccountsInfos as $AccountsInfo)
                            <li ><a  class="open_account_info_modal_page" data-url="{{ route('HeadLevel.info',$AccountsInfo->HeadCode) }}" data-toggle="tooltip" data-title="" style="color: green">{{$AccountsInfo->HeadName}}</a>
                            <ul>
                                @foreach ($HeadLevel1_Infos as $HeadLevel1_Info)
                                @if ($AccountsInfo->HeadName == $HeadLevel1_Info->PHeadName)
                                <li ><a class="open_account_info_modal_page" data-url="{{ route('HeadLevel.info',$HeadLevel1_Info->HeadCode) }}" data-toggle="tooltip" data-title="" style="color: red">{{$HeadLevel1_Info->HeadName}}</a>
                                <ul>
                                    @foreach ($HeadLevel2_Infos as $HeadLevel2_Info)
                                    @if ($HeadLevel1_Info->HeadName == $HeadLevel2_Info->PHeadName)
                                    <li><a  class="open_account_info_modal_page" data-url="{{ route('HeadLevel.info',$HeadLevel2_Info->HeadCode) }}" data-toggle="tooltip" data-title="" style="color: yellow">{{$HeadLevel2_Info->HeadName}}</a>
                                    <ul>
                                        @foreach ($HeadLevel3_Infos as $HeadLevel3_Info)
                                        @if ($HeadLevel2_Info->HeadName == $HeadLevel3_Info->PHeadName)
                                        <li><a>{{$HeadLevel3_Info->HeadName}}</a>
                                    </li>
                                    @endif
                                    @endforeach
                                </ul>
                            </li>
                            @endif
                            @endforeach
                        </ul>
                    </li>
                    @endif
                    @endforeach
                </ul>
            </li>
            @endforeach
            
        </ul>
    </li>
</ul>
</div>
</div>
</div>
</div>

@push('alljs')
{{-- <script type="text/javascript">
$(function () {
$("#jstree").jstree({
"types" : {
"default" : {
"icon" : "glyphicon glyphicon-flash"
},
"demo" : {
"icon" : "glyphicon glyphicon-ok"
}
},
"plugins" : [ "types" ]
});
});
</script> --}}

@endpush
@endsection