@extends('admin.layout.master')
@section('title', 'Dynamic Crud List')
@section('custom_style')
<style>
        .spliter {
            display: flex;
            justify-content: space-between;
        }
</style>
@endsection
@section('content')
    <div class="card sina-card">
        <div class="card-header card-header-s d-flex flex-wrap align-items-center">
            <h4 class="col-6 pl-0">Dynamic Crud List</h4>
            <div  class="col-6 d-flex justify-content-end">
                {{-- @if(checkAuthPermission('admin.setting.dynamic_crud.store')) --}}
                <button type="button" class="btn-sm btn-primary" id="open_slide">
                Add Dynamic Crud
                </button>
                {{-- @endif --}}
            </div>
        </div>
        <div class="card-body">
            <div class="table-responsive cl-table-container" style="height: 70vh"  id="print">
                <table id="apply_data_table" class="table cl-table table-hover table-bordered">
                    <thead>
                        <tr>
                            <th scope="col" class="cl-fixed-cell">#</th>
                            <th scope="col">Title</th>
                            <th scope="col">Type</th>
                            <th scope="col">Model Name</th>
                            <th scope="col">Route Prefix</th>
                            <th scope="col">Field Name</th>
                            <th scope="col">Warehouses Type</th>
                            <th scope="col">Is Migration Allow</th>
                            <th scope="col">Status</th>
                            <th scope="col">Action</th>
                        </tr>
                    </thead>
                    <tbody>
                        @php($i = 1)
                            @foreach ($listData as $item)
                                <tr>
                                    <th scope="row" class="cl-fixed-cell">{{ $i++ }}</th>
                                    <td>{{ $item->title }}</td>
                                    <td>{{ $item->type }}</td>
                                    <td>{{ $item->table_name }}</td>
                                    <td><a href="{{ url('/').'/'.str_replace('.','/',$item->route_name).'/index' }}">{{$item->route_name}}</a></td>
                                    <td class="text-wrap">
                                        @forelse(collect(json_decode($item->setting_object)) as $setting)
                                        <span class="badge badge-info">{{$setting->field_name}}</span>,
                                        @empty
                                        {{__('obs.not_asigned')}}
                                        @endforelse
                                    </td>
                                    <td>{{ $item->warehouse_type?($item->warehouse_type==1?__('obs.warehouses'):__('obs.store')):__('obs.n_o') }}</td>
                                    
                                    <td>{{ $item->is_migration_allow?'Yes':'No' }}</td>
                                    <td>
                                        @if ($item->status == 1)
                                            <p style="color:green">Active</p>
                                        @else
                                            <p style="color:red">Inactive</p>
                                        @endif
                                    </td>
                                    <td>
                                        <!-- Button trigger modal -->
                                        {{-- @if(checkAuthPermission('admin.setting.dynamic_crud.edit')) --}}
                                        <button type="button" onClick='editData({{$item->id}})' class="btn-sm btn-primary">
                                            {{__('obs.edit')}}
                                        </button>
                                        {{-- @endif --}}
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        @include('admin.global.loader')    
        @include('v2.admin.global.offcanvas', ['blade'=>'v2.admin.dynamic_crud.form','style'=> 'style="width: 85vw;"', 
            'title'=> 'Add Dynamic Crud']);
@endsection
@section('script')
<script>
    let formSetting=['title','table_name','route_name','warehouse_type','is_migration_allow','where_cls','type'];
    let formObjSetting=['field_name','title','input_type','d_value','display_type','options','validation'];//dependency
    let warehouse_id=@json(current_warehouse());
    let loopSize=@json(Request()->fields);
    $('#apply_data_table').dataTable({
            "paging": false,
    });
    const select2ModalV1=(cls, modal_name)=> {
        $('.' + cls).select2({
            dropdownParent: $("#" + modal_name)
        });
        $('.select_2_allow_new').select2({
            dropdownParent: $("#" + modal_name),
            tags:true,
        });
    }
   
    const nullAllField=(data=null)=>{
        select2ModalV1('select_2','global-offcanvas');
        $('#edit_id').val(data?data.id:'');
        for (let i = 0; i < formSetting.length; i++) {
            let field_name = formSetting[i];
            if(data){
                    $('#'+field_name).val(data[field_name]);
            }else{
                $('#'+field_name).val('');
            }
            if(['warehouse_type','is_migration_allow'].includes(field_name)){
                $('#'+field_name).trigger('change');
            }
        }
        if(data){
            let setting_object=JSON.parse(data.setting_object);
            let dependency=JSON.parse(data.dependency);
            for (let p = 0; p < setting_object.length; p++) {
                let so=setting_object[p];
                for (let i = 0; i < formObjSetting.length; i++) {
                    let formfield = formObjSetting[i];
                    if('options'==formfield && so[formfield]){
                            let valO='';
                            Object.keys(so[formfield]).map( (k) => {
                                valO+=k+'=>'+so[formfield][k]+',';
                            });
                            $('#'+formfield+''+p).val(valO.slice(0, -1));
                    }else{
                        $('#'+formfield+''+p).val(so[formfield]);
                    }
                    if(['input_type','display_type'].includes(formfield)){
                        $('#'+formfield+''+p).trigger('change');
                    }
                }
                let f_name=setting_object[p][formObjSetting[0]];
                if(dependency && (f_name in dependency)){
                    console.log(dependency[f_name]);
                    $('#dependency'+p).val(dependency[f_name].join('--'));
                }else{
                    $('#dependency'+p).val('');
                } 

            }
        }else{
            for (let p = 0; p < loopSize; p++) {
                for (let i = 0; i < formObjSetting.length; i++) {
                    let formfield = formObjSetting[i];
                    $('#'+formfield+''+p).val('');
                    if(['input_type','display_type'].includes(formfield)){
                        $('#'+formfield+''+p).trigger('change');
                    }
                }
                $('#dependency'+p).val(''); 
            }
        }
    }
    $('#open_slide').on('click', function() {
        nullAllField();
        currentCanvas.show();
    });
    const editData=(id)=>{
        const setFormData = data => {
            nullAllField(data);
            $("#submit_btn").text('Update');
            $('#loader').hide();
            currentCanvas.show();
        }
        let link = "{{ route('admin.setting.dynamic_crud.edit') }}";
        let int_data_param = {
            id: id
        }
        ajaxCall(link, 'GET', int_data_param, setFormData);
    }
</script>

@endsection