@extends('layouts.app')

@section('styles')
@endsection

@section('content')
    @php
        $content_page_name = 'Business';
    @endphp

    <!-- PAGE-HEADER -->
    <div class="page-header">
        <h1 class="page-title">{{ $content_page_name }}</h1>
        <div>
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Home</a></li>
                <li class="breadcrumb-item active" aria-current="page">{{ $content_page_name }}</li>
            </ol>
        </div>
    </div>
    <!-- PAGE-HEADER END -->

    <!-- ROW-1 OPEN -->
    @canany(['homebanner-create', 'homebanner-edit'])
        <div class="row">
            <div class="col-lg-12 col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title"><span id="content_page_form_action_name">Update</span> {{ $content_page_name }}
                        </h3>
                    </div>
                    <div class="card-body">
                        <form method="POST" id="createForm" class="myform" enctype="multipart/form-data" >
                            <input id="csrf_token" type="hidden" value="{{ csrf_token() }}">
                            <input id="row_id" name="row_id" type="hidden" value="{{$business->id ?? ''}}">
                            <input id="method" name="_method" type="hidden" value="PUT">
                            @csrf
                            <div class="form-row">

                                <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Business Name </label>
                                    <input data-parsley-required-message="Business Name Required" type="text"
                                        class="form-control" name="business_name" id="business_name" value="{{ $attributes->business_name ?? '' }}">

                                </div>
                                <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Business Address </label>
                                    <input data-parsley-required-message="Business Address Required" type="text"
                                        class="form-control" name="business_address" id="business_address"
                                        value="{{ $attributes->business_address ?? '' }}">

                                </div>
                                <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Business Email 1 </label>
                                    <input data-parsley-required-message="invalid email" type="email" class="form-control"
                                        name="email_1" id="email_1" value="{{ $attributes->email_1 ?? '' }}">

                                </div>
                                {{-- <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Business Email 2 </label>
                                    <input data-parsley-required-message="invalid email" type="email" class="form-control"
                                        name="email_2" id="email_2" value="{{ $attributes->email_2 ?? '' }}">

                                </div> --}}

                                <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Business Number 1 </label>
                                    <input data-parsley-required-message="" type="text" class="form-control" name="number_1"
                                        id="number_1" value="{{ $attributes->number_1 ?? '' }}">

                                </div>
                                {{-- <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Business Number 2 </label>
                                    <input data-parsley-required-message="" type="number" class="form-control" name="number_2"
                                        id="number_2" value="{{ $attributes->number_2 ?? '' }}">

                                </div> --}}

                                <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Facebook</label>
                                    <input data-parsley-required-message="" type="text" class="form-control" name="facebook"
                                        id="facebook" value="{{ $attributes->facebook ?? '' }}">

                                </div>
                                <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Instagram</label>
                                    <input data-parsley-required-message="" type="text" class="form-control" name="instagram"
                                        id="instagram" value="{{ $attributes->instagram ?? '' }}">

                                </div>

                                <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Linkedin</label>
                                    <input data-parsley-required-message="" type="text" class="form-control" name="linkedin"
                                        id="linkedin" value="{{ $attributes->linkedin ?? '' }}">

                                </div>
                                {{-- <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Twitter</label>
                                    <input data-parsley-required-message="" type="text" class="form-control"
                                        name="twitter" id="twitter" value="{{ $attributes->twitter ?? '' }}">

                                </div> --}}

                                <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Youtube</label>
                                    <input data-parsley-required-message="" type="text" class="form-control"
                                        name="youtube" id="youtube" value="{{ $attributes->youtube ?? '' }}">

                                </div>
                                {{-- <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Medium</label>
                                    <input data-parsley-required-message="" type="text" class="form-control"
                                        name="medium" id="medium" value="{{ $attributes->medium ?? '' }}">

                                </div> --}}
                                <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Testimonials Video Link</label>
                                    <input data-parsley-required-message="" type="text" class="form-control"
                                        name="testimonials_video_link" id="testimonials_video_link"
                                        value="{{ $attributes->testimonials_video_link ?? '' }}">

                                </div>

                                <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip01">Location Map Link</label>
                                    <input data-parsley-required-message="" type="text" class="form-control"
                                        name="location_map_link" id="location_map_link"
                                        value="{{ $attributes->location_map_link ?? '' }}">

                                </div>


                                {{-- <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip02">Header logo ({{ env('HEADER_LOGO_SIZE') }})</label>
                                    <input type="file" data-parsley-required-message=""
                                        class="form-control custom-input-file image_upload" name="header_logo" id="header_logo"
                                        value="" accept="image/*,.svg">
                                    <input type="image" class="image_upload_preview" id="header_log" style="width:90px; height:70px"
                                        src="@isset($business->header_logo){{ asset($business->header_logo) }} @endisset" />
                                </div>

                                <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip02">Footer logo ({{ env('FOOTER_LOGO_SIZE') }})</label>
                                    <input type="file" data-parsley-required-message=""
                                        class="form-control custom-input-file image_upload" name="footer_logo" id="footer_logo"
                                        value="" accept="image/*,.svg">
                                    <input type="image" class="image_upload_preview" id="footer_log" style="width:90px; height:70px"
                                        src="@isset($business->footer_logo){{ asset( $business->footer_logo) }}@endisset" />
                                </div> --}}

                                {{-- <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip02">Fav Icon ({{ env('FAV_ICON_SIZE') }})</label>
                                    <input type="file" data-parsley-required-message=""
                                        class="form-control custom-input-file image_upload" name="fav_icon" id="fav_icon" value=""
                                        accept="image/*,.svg">
                                    <input type="image" class="image_upload_preview" id="fav_ico" style="width:90px; height:70px"
                                        src="@isset($business->fav_icon){{ asset($business->fav_icon) }}@endisset" />
                                </div> --}}

                                {{-- <div class="col-xl-6 mb-3">
                                    <label for="validationTooltip02">Business Brochure </label>
                                    <input type="file" data-parsley-required-message=""
                                        class="form-control custom-input-file" name="brochure" id="brochure" value=""
                                        accept="application/pdf">
                                        @isset($business->brochure)
                                    <a href="{{asset($business->brochure)}}" target="_blank" id="brochure_file">{{ basename($business->brochure) ?? '' }}</a>
                                    @endisset
                                </div> --}}




                            </div>

                             @can('homebanner-edit')
                                @php
                                $url_var = route('business.update',1);
                                @endphp
                                <a id="create_btn" href="#" onclick="createOrUpdate('{{$url_var}}','POST', 'createForm', '', 'table_datatable' ,'self' ) " class="btn btn-primary"><i class="fa fa-save"></i> Update</a>
                            @endcan
                        </form>
                    </div>
                </div>
            </div>
        </div>
    @endcanany
    <!-- /ROW-1 CLOSED -->

    <!-- Row -->
    {{-- @can('homebanner-list')
        <div class="row row-sm">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-header">
                       <h3 class="card-title">View {{ $content_page_name }}s</h3>
                    </div>
                    <div class="card-body">
                        <div class="table-responsive">
                            <table class="table table-bordered text-nowrap border-bottom dataTable no-footer "
                                style="width: 100% !important;" id="table_datatable">
                                <thead class="text-center">
                                    <tr>
                                        <th class="wd-15p border-bottom-0" >#</th>
                                        <th class="wd-15p border-bottom-0">Name</th>
                                        <th class="wd-15p border-bottom-0">Link</th>
                                        <th class="wd-15p border-bottom-0">Description</th>
                                        <th class="wd-15p border-bottom-0">Image</th>
                                        <th class="wd-15p border-bottom-0">Image Alt</th>
                                        <th class="wd-15p border-bottom-0">Status</th>
                                        <th class="wd-10p border-bottom-0">Actions</th>
                                    </tr>
                                </thead>

                            </table>

                            <div class="col-sm-12 col-md-12">
                            </div>
                        </div>
                    </div>


                </div>

            </div>
        </div>
    @endcan --}}
    <!-- End Row -->

    <!-- Modal -->



    {{-- <div class="modal  fade" id="smallmodal" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-sm" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Delete</h5>
                    <button class="btn-close text-danger" data-bs-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                </div>
                <div class="modal-body">
                    <p>Do you want to delete the Banner ?</p>
                </div>
                <div class="modal-footer">
                    <button class="btn custom-btn-warning" data-bs-dismiss="modal">Close</button>
                    <button onclick="delete_item()" class="btn custom-btn-danger">Delete</button>
                </div>
            </div>
        </div>
    </div> --}}




@endsection
@section('scripts')
    {{-- ################################Jquery Datatable########################### --}}
    {{-- <script src="{{asset('assets/jquery-datatable/jquery.min.js')}}"></script> --}}
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/jquery-datatable/jquery.dataTables.css?v3') }}">
    <script src="{{ asset('assets/jquery-datatable/jquery.dataTables.js') }}"></script>






    <!--##################################Color Picker Section#############################-->

    <!-- TIMEPICKER JS -->
    <script src="{{ asset('assets/plugins/time-picker/jquery.timepicker.js') }}"></script>
    <script src="{{ asset('assets/plugins/time-picker/toggles.min.js') }}"></script>

    <!-- DATEPICKER JS -->
    <script src="{{ asset('assets/plugins/date-picker/date-picker.js') }}"></script>
    <script src="{{ asset('assets/plugins/date-picker/jquery-ui.js') }}"></script>
    <script src="{{ asset('assets/plugins/input-mask/jquery.maskedinput.js') }}"></script>

    <!-- FORMELEMENTS JS -->
    <script src="{{ asset('assets/js/formelementadvnced.js') }}"></script>
    <script src="{{ asset('assets/js/form-elements.js?v10') }}"></script>

    <!--##################################End Of Color Picker Section#############################-->



    {{-- ########################################################################## --}}
    <script>

//         $( document ).ready(function() {
//            var jsonStr = '{{$business->attributes}}'; // Assuming $business->attributes contains a valid JSON string
// var jsonData = JSON.parse(jsonStr);
// console.log(jsonData);
//         });
        // var token = $("meta[name=csrf-token]").attr("content");
        // var datatable_name = "table_datatable";
        // $('#table_datatable').DataTable({
        //     "responsive": true,
        //     "serverSide": true,
        //     "ordering": true,
        //     "searching": true,
        //     "bLengthChange": true,
        //     "info": false,
        //     "bSort": true,
        //     "order": [
        //         [0, 'desc']
        //     ],
        //     "columnDefs": [{
        //             "defaultContent": "-",
        //             "targets": "_all"
        //         },
        //         {
        //             "className": "text-center",
        //             "targets": [0, 1, 3, 4, 5 , 6, 7]
        //         },
        //         {
        //             "className": "text-left",
        //             "targets": []
        //         }

        //     ],
        //     "displayLength": 10,
        //     "ajax": {
        //         "url": "{{ route('home_banner.index') }}",
        //         "type": "get",
        //         "data": function(data) {
        //             data._token = token;

        //             return data;

        //         }
        //     },
        //     "AutoWidth": true,


        //     "fnCreatedRow": function(nRow, aData, iDataIndex) {
        //         var info = this.dataTable().api().page.info();
        //         var page = info.page;
        //         var length = info.length;
        //         var index = (page * length + (iDataIndex + 1));
        //         var action = "";

        //         /////attribute setting
        //         var jsonObject = JSON.parse(aData.attributes);
        //         var row_id = aData.id;

        //         $('td:eq(0)', nRow).html(index);
        //         $('td:eq(1)', nRow).html(jsonObject.banner_name);
        //         $('td:eq(2)', nRow).html(jsonObject.banner_link);
        //         $('td:eq(3)', nRow).html(jsonObject.banner_description);
        //         $('td:eq(5)', nRow).html(jsonObject.banner_image_alt);


        //         if (aData.image == "" || aData.image == null) {
        //             aData.image = "no_image.png";
        //         }
        //         var image = '<a href="/' + aData.image + ' " target="_blank"><img style="width:102px; height:46px" src="/' + aData
        //             .image + '"></a>';

        //         $('td:eq(4)', nRow).html(image);


        //         ////status
        //         var status = aData.status;
        //         if(status == 1)
        //         {
        //             var status_htl = '<span style="color:green;font-weight:bolder" class="">Active</span>';
        //         }
        //         else{
        //             var status_htl = '<span style="color:red;font-weight:bolder" class="">In Active</span>';
        //         }
        //         $('td:eq(6)', nRow).html(status_htl);
        //         //Edit Action

        //             var action = action + '&nbsp;<button title="Edit"  onclick=edit(' + row_id +
        //                 ') id="bEdit" type="button" class="btn btn-sm custom-btn-info"><span class="fe fe-edit"> </span></button>';

        //         //Delete Action

        //             var action = action + '&nbsp;<button title="Delete" onclick="delete_modal(' + row_id +
        //                 ')" id="bDel" type="button" class="btn  btn-sm custom-btn-danger"><span class="fe fe-trash-2"> </span></button>';


        //         $('td:eq(7)', nRow).html(action);




        //     }
        // });

        // #################### Edit Section ############################
        // function edit(id) {
        //     var temp_url = "{{ route('home_banner.edit', 'temp_id') }}";
        //     temp_url = temp_url.replace("temp_id", id);

        //     $.ajax({
        //         type: 'GET',
        //         data: {
        //             "_token": token,
        //             "id": id
        //         },
        //         url : temp_url ,
        //         success: function(result) {

        //             //////set image sections
        //             if('image' in result)
        //             {
        //             $('#banner_image').attr('required', false);
        //             $('#img_preview').attr('src', '/'+  result.image);
        //             }


        //             /////set status
        //             if('status' in result)
        //             {

        //                 if(result.status == 1)
        //                 {
        //                     $('#status').val('1');

        //                 }
        //                 else{
        //                     $('#status').val('0');

        //                 }
        //             }

        //             if('attributes' in result)
        //             {
        //                 var jsonData = JSON.parse(result.attributes);

        //                 for (var key in jsonData) {
        //                     var id = "#" + key;
        //                     var value = jsonData[key];

        //                     if ($(id).length) {
        //                         $(id).val(value);
        //                     }
        //                 }
        //             }
        //             $('#method').val('PUT');
        //             $('#content_page_form_action_name').text('Edit')
        //             // $('#banner_id').val(result.data.s_id);
        //             // $('#slider_name').val(result.data.s_title);
        //             // $('#slider_url').val(result.data.s_link);
        //             // $('#slider_desc').val(result.data.s_desc);

        //             var route = "{{ route('home_banner.update', '') }}";

        //             var updatedRoute = route + '/' + result.id

        //             $('#update_btn').attr('onclick', "createOrUpdate('" + updatedRoute +
        //                 "', 'POST', 'createForm', '', 'table_datatable', '')");



        //             $('#create_btn').hide();
        //             $('#update_btn').show();
        //             $('#back-to-top').click();

        //         }
        //     })
        // }
        // #################### End Of Edit Section ####################
        // #################### Delete Section ##########################
        // function delete_modal(id) {
        //     $('#row_id').val(id);
        //     $('#smallmodal').modal('show');
        // }

        // function delete_item() {
        //     var id = $('#row_id').val();

        //      var route = "{{ route('home_banner.destroy', '') }}";

        //     var updatedRoute = route + '/' + id

        //     $.ajax({
        //         type: 'DELETE',
        //         data: {
        //             "_token": token,
        //             "id": id
        //         },
        //         url: updatedRoute,
        //         success: function(result) {
        //             $('#smallmodal').modal('hide');
        //             toast(result, datatable_name);
        //         }
        //     })
        // }
        // #################### End Of Delete Section ##################


        //End Of Slider Type Change Function
    </script>
@endsection