@extends('master.admin')

@push('header.scripts')
<!-- BEGIN PAGE LEVEL PLUGINS -->
<link href="{{ asset('public/assets/global/plugins/datatables/datatables.min.css') }}" type="text/css" />
<link href="{{ asset('public/assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.css') }}" rel="stylesheet" type="text/css" />
<!-- END PAGE LEVEL PLUGINS -->
@stop

@push('footer.scripts')
<!-- BEGIN PAGE LEVEL SCRIPTS -->
<script src="{{ asset('public/assets/global/scripts/datatable.js') }}" type="text/javascript"></script>
<script src="{{ asset('public/assets/global/plugins/datatables/datatables.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('public/assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.js') }}" type="text/javascript"></script>
<!-- END PAGE LEVEL SCRIPTS -->
<script>
    $(function() {
        $('#form_fields_dt').DataTable({
            responsive: true,
            paging: false,
            info: false,
            filter: false,
            "order": [[ 7, "asc" ]],
        });
        
        @if(Session::has('formdatafieldedit-success'))
            show_push_notification('Success!', '{{ Session::get("formdatafieldedit-success") }}', 'success');
        @endif 
    });
</script>
@stop

@section('content')
<!-- BEGIN CONTENT -->
<div class="page-content-wrapper">
    <!-- BEGIN CONTENT BODY -->
    <div class="page-content">
        <!-- BEGIN PAGE HEADER-->
        <!-- BEGIN PAGE BAR -->
        <div class="page-bar">
            <h4 class="page-title margin_bottom_0"><strong> {{current_client(Auth::user()->id)->client_name}} </strong></h4>
            <ul class="page-breadcrumb">
                <li>
                    <a href="#">Data</a>
                    <i class="fa fa-angle-right"></i>
                </li>
                <li>
                    <a href="{{url('admin/data/forms')}}">Forms</a>
                    <i class="fa fa-angle-right"></i>
                </li>
                <li>
                    <span>Form Detail</span>
                </li>
            </ul>
        </div>
        <!-- END PAGE BAR -->
        <!-- BEGIN PAGE TITLE-->
        <h3 class="page-title"> </h3>
        <!-- END PAGE TITLE-->
        <div class="row">
            <div class="col-md-8">
                <div class="portlet light portlet-fit portlet-datatable bordered">
                    <div class="portlet-title">
                        <div class="caption">
                            <i class="fa fa-cogs"></i>
                            <span class="caption-subject font-dark sbold uppercase">{{ $dataForm->name }}</span>
                        </div>
                        <div class="actions">
                            @role(['superadmin','admin'])
                            <div class="btn-group pull-left" style="margin-right: 5px;">
                                <a href="{!! url('admin/data/forms/addfield/'.$dataForm->id) !!}" class="btn btn-fit-height blue" style="margin-right: 5px;"><i class="fa fa-plus-circle"></i> Add Data Field</a>
                            </div>
                            @endrole
                        </div>
                    </div>
                    <div class="portlet-body" style="height:auto !important;">
                        <div class="table-scrollable" id="form_fields-outer-div">    
                            <table id="form_fields_dt" class="table table-striped table-bordered table-hover " cellspacing="0" width="100%">
                                <thead>
                                    <tr>
                                        <th>Field ID</th>
                                        <th>Active</th>
                                        <th>Name</th>
                                        <th>Label</th>
                                        <th>Key</th>
                                        <th>External Key</th>
                                        <th>Required</th>
                                        <th class="text-center"> Order </th>
                                        <th class="text-right"> Actions </th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($formFields as $row)
                                    <tr>
                                        <td>{{ $row->form_field_id }}</td>
                                        <td>
                                            <div class="checkbox-list">
                                                <label><div class="checker disabled"><span class="{!! ($row->data_field_active == '1')?'checked':'' !!}"><input type="checkbox"></span></div></label>
                                            </div>
                                        </td>
                                        <td>{{ $row->data_field_name }}</td>
                                        <td>{{ $row->form_field_label }}</td>
                                        <td>{{ $row->key }}</td>
                                        <td>{{ $row->external_key }}</td>
                                        <td>{{{ ($row->required_field == '1')?'Yes':'No' }}}</td>
                                        <td class="text-center"> {{ $row->data_form_field_order }}</td>
                                        <td class="text-right">
                                            <div class="btn-group btn-group-xs">
                                                <a href="{{ url('admin/data/forms/editfield/'.$dataForm->id.'/'.$row->form_field_id)}}" class="btn btn-primary"><i class="fa fa-pencil"></i> Edit</a>
                                            </div>
                                        </td>
                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-md-4">
                <div class="portlet box blue-hoki">
                    <div class="portlet-title">
                        <div class="caption">
                            <i class="fa fa-pencil"></i>Form ID {{ $dataForm->id }} DEMO</div>
                        <div class="tools"></div>
                    </div>
                    <div class="portlet-body form">
                        <form class="horizontal-form" method="POST">
                            <div class="form-body">
                                @foreach($formFields as $row)
                                @if( $row->data_field_active == '1' )
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <label class="control-label">{{ $row->form_field_label }} </label>
                                            @if( $row->data_field_type == 'Textfield' )
                                            <input type="text" id="{{ $row->key }}" name="{{ $row->key }}" class="form-control" >
                                            @endif
                                            @if( $row->data_field_type_id == '2' || $row->data_field_type_id == '5' || $row->data_field_type_id == '6' || $row->data_field_type_id == '7' )
                                            <select class="form-control" id="{{ $row->key }}" name="{{ $row->key }}" >
                                                <option value="">Select</option>  
                                                @foreach(list_data_field_items($row->id) as $item)
                                                    @if( $row->id == '6' || $row->id == '37' )
                                                        <option value="{{ $item->external_value }}">{{ $item->value }}</option>  
                                                    @else    
                                                        <option value="{{ $item->id }}">{{ $item->value }}</option>  
                                                    @endif 
                                                @endforeach
                                            </select>
                                            @endif
                                        </div>
                                    </div>
                                    <!--/span-->
                                </div>
                                @endif
                                @endforeach
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <!-- END CONTENT BODY -->
</div>
<!-- END CONTENT WRAPPER -->    
@stop