@extends('layouts.administrator.master')

@section('title')
    Data Master
@endsection

<!-- Example: Include jQuery and DataTables from CDN -->

@section('content')
    <div class="nk-block-head">
        <div class="nk-block-head-content">
            <div class="nk-block-between-md g-4">
                <div class="nk-block-head-content">
                    <h3 class="nk-block-title page-title">
                        Wilayah
                    </h3>
                    <div class="nk-block-des">
                        <p>Kamu mempunyai akses untuk mengelola data wilayah</p>
                    </div>
                </div>
                <div class="nk-block-head-content">
                    <a href="{{ route('admin.dataMaster') }}" class="btn btn-primary btn-sm"><em
                            class="icon ni ni-arrow-left"></em>
                        Kembali</a>
                </div>
            </div>
        </div>
    </div><!-- .nk-block-head -->
    <div class="nk-block">
        <div class="card card-preview">
            <div class="card-inner">
                <div class="text-end pb-3">
                    {{-- <a href="{{ route('admin.pages.landingPage.calendar.create') }}" class="btn btn-primary">Buat Data
                        Wilayah</a> --}}
                </div>

	
            <table id="test" title="Wilayah" class="easyui-treegrid"
                    data-options="
                        url: '{{ route('admin.dataMaster.region.list.data') }}',
                        method: 'get',
                        rownumbers: true,
                        idField: 'id',
                        treeField: 'nama',
                        loadFilter: myLoadFilter
                    ">
                <thead>
                    <tr>
                        <th data-options="field:'nama'" width="60%">Nama</th>
                        <th data-options="field:'kode'" width="40%">Kode</th>
                    </tr>
                </thead>
            </table>
            <script>
                function myLoadFilter(data,parentId){
                    function setData(data){
                        var todo = [];
                        for(var i=0; i<data.length; i++){
                            todo.push(data[i]);
                        }
                        while(todo.length){
                            var node = todo.shift();
                            if (node.children && node.children.length){
                                node.state = 'closed';
                                node.children1 = node.children;
                                node.children = undefined;
                                todo = todo.concat(node.children1);
                            }
                        }
                    }
                    
                    setData(data);
                    var tg = $(this);
                    var opts = tg.treegrid('options');
                    opts.onBeforeExpand = function(row){
                        if (row.children1){
                            tg.treegrid('append',{
                                parent: row[opts.idField],
                                data: row.children1
                            });
                            row.children1 = undefined;
                            tg.treegrid('expand', row[opts.idField]);
                        }
                        return row.children1 == undefined;
                    };
                    return data;
                }
            </script>
        </div>
    </div>
</div>
@endsection