@extends('admin.layouts.default')

@section('header_styles')
<link href="{{ asset('admin_assets/plugins/bootstrap-toggle/css/bootstrap-toggle.min.css') }}" rel="stylesheet">
<style>
    .hide {
        display: none;
    }

    project-actions a {
        float: left;
        margin-left: 5px;
    }

    @media screen and (max-width: 750px) {
        .project-actions a {
            float: left;
            margin-left: 5px;
        }
    }
</style>
@stop

@section('content')
<!-- Content Header (Page header) -->
<div class="content-header">
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-sm-6">
                {{-- <h1 class="m-0 text-dark">--}}
                {{-- @yield('title', 'Add Subrestaurants')--}}
                {{-- </h1>--}}
            </div><!-- /.col -->
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item">{{ Breadcrumbs::render('restaurants') }}</li>

                </ol>
            </div><!-- /.col -->
        </div><!-- /.row -->
    </div><!-- /.container-fluid -->
</div>
<!-- /.content-header -->
<!-- Main content -->
<section class="content">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">

                    @if(session()->has('message'))
                    <div class="alert alert-success">
                        {{ session()->get('message') }}
                    </div>
                    @endif

                    @if ($errors->any())
                    <div class="alert alert-danger">
                        <ul>
                            @foreach($errors->all() as $error)
                            <li>{{ $error }}</li>
                            @endforeach
                        </ul>
                    </div>
                    @endif
                </div>


                <!-- /.card-header -->
                <div class="col-lg-12">
                    <a href="#" data-toggle="modal" data-target="#modal-lg" class="btn btn-block bg-gradient-success btn-sm col-sm-2">Add Branch</a>

                </div>

                <div class="card-body p-0">
                    <table class="table table-striped projects">
                        <thead>
                            <tr>
                                <th></th>
                                <th>@sortablelink('Owner')</th>
                                <th>@sortablelink('Name')</th>
                                <th>Email</th>
                                <th>Phone</th>
                                <th>@sortablelink('Post Code')</th>
                                <th>@sortablelink('Status')</th>
                                <th>Logo</th>

                            </tr>
                        </thead>
                        <tbody>
                            @foreach($subrestaurant as $i=>$restaurant)
                            <tr data-toggle="collapse" href="#multiCollapseExample{{ $i+1 }}" aria-expanded="false" aria-controls="multiCollapseExample{{ $i+1 }}">
                                <td>{{ $i+1 }}</td>
                                <td>{{ $restaurant->first_name }}</td>
                                <td>{{ $restaurant->name }}</td>
                                <td>{{ $restaurant->email }}</td>
                                <td>{{ $restaurant->phone }}</td>
                                <td>{{ $restaurant->postal_code }}</td>
                                <td>
                                    @if($restaurant->status == '1')
                                    {{ 'Active' }}
                                    @else
                                    {{ 'Inactive' }}
                                    @endif
                                </td>
                                <td>
                                    @if($restaurant->logo)
                                    <img class="profile-user-img img-fluid img-circle"
                                        src="{{ URL::to('uploads/files/'.$restaurant->logo) }}"
                                        alt="Logo picture">
                                    @else
                                    <img class="profile-user-img img-fluid img-circle"
                                        src="{{ URL::to('admin_assets/images/default-image.png') }}"
                                        alt="Default Logo">
                                    @endif
                                </td>
                            </tr>
                            <tr class="hiddenRow" align="center">

                                <td colspan="7">
                                    <div class="accordian-body collapse" id="multiCollapseExample{{ $i+1 }}" style="list-style: none;">
                                        <a href="{{ URL::to('administrator/restaurants/subrestaurants/view/'.encrypt($restaurant->restaurants_id)) }}" class="btn btn-success">
                                            <i class="far fa-eye"></i> View
                                        </a>

                                        <a href="{{ URL::to('administrator/restaurants/subrestaurants/'.encrypt($restaurant->restaurants_id).'/edit') }}" class="btn btn-primary">
                                            <i class="far fa-edit" aria-hidden="true"></i> Edit
                                        </a>
                                    </div>

                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- .modal -->
<div class="modal fade" id="modal-lg">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Add Subrestaurants</h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="card card-primary">
                    <div class="card-header">
                        <h3 class="card-title">Create Subrestaurants</h3>
                    </div>
                    <!-- /.card-header -->
                    <!-- form start -->
                    <form role="form" action="{{ route('administrator.subrestaurants.create') }}" method="POST" enctype="multipart/form-data" id="uploadForm" class="editrestaurant_form">
                        {{ csrf_field() }}
                        <input type="hidden" name="parent_id" value="{{ request()->id }}">

                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputName">Business <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="text" name="name" class="form-control" value="{{ old('name') }}" id="name" placeholder="Business Name" autocomplete="off">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputAddress">Address <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="text" name="address" class="form-control" value="{{ old('address') }}" id="address" placeholder="Enter Address" autocomplete="off">
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label>Country <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <select class="form-control select2" id="country" name="country" style="width: 100%;" autocomplete="off">
                                                <option value="">Select Country</option>
                                                @foreach($countries as $country)
                                                <option value="{{ $country->id }}"
                                                    @if(old('country')==$country->id)
                                                    {{ 'selected=selected' }}
                                                    @endif
                                                    >{{ $country->name }}
                                                </option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label>States/County <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <select class="form-control select2" id="state" name="state" style="width: 100%;" autocomplete="off">
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-md-6">

                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label>City <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <select class="form-control select2" name="city" id="city" style="width: 100%;" autocomplete="off">
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputPCode">Postal Code <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="text" name="postal_code" value="{{ old('postal_code') }}" class="form-control" id="postal_code" placeholder="Enter Postal Code" autocomplete="off">
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputPhone">Business Phone <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="text" name="phone" class="form-control" value="{{ old('phone') }}" id="phone" placeholder="Enter Phone" autocomplete="off">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputEmail">Business Email <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="email" name="email" class="form-control" value="{{ old('email') }}" id="email" placeholder="Bussiness Email" autocomplete="off">
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="row">

                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputSupportEmail">Support Email <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="email" name="support_email" class="form-control" value="{{ old('support_email') }}" id="support_email" placeholder="Enter Your Support Email" autocomplete="off">
                                        </div>
                                    </div>
                                </div>


                            </div>

                            <div class="row">

                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputNotiEmail">Online Notification Email <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="email" name="online_notification_email" class="form-control" value="{{ old('online_notification_email') }}" id="online_notification_email" placeholder="Enter Online Notification Email" autocomplete="off">
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputSupportMobile">Support Mobile <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="text" name="support_mobile" class="form-control" value="{{ old('support_mobile') }}" id="support_mobile" placeholder="Enter Your Support Mobile" autocomplete="off">
                                        </div>
                                    </div>
                                </div>


                            </div>

                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputTimezone">Timezone</label>
                                        </div>
                                        <div class="col-sm-8">
                                            <select name="timezone" class="form-control select2">
                                                <option value="">Select Timezone</option>
                                                @foreach($timezones as $timezone)
                                                <option value="{{ $timezone->timezone }}">{{ $timezone->timezone }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="currency">Currency <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <select class="form-control select2" name="currency" id="currency" style="width: 100%;" autocomplete="off">
                                                <option value="">Select Currency</option>
                                                @foreach($currency as $curr)
                                                <option value="{{ $curr->code }}">{{ $curr->code }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>

                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="language">Language <span style="color:red">*</span></label>
                                        </div>
                                        <div class="col-sm-8">
                                            <select class="form-control select2" name="language" id="language" style="width: 100%;" autocomplete="off">
                                                <option value="">Select Language</option>
                                                @foreach($language as $lang)
                                                <option value="{{ $lang->name }}">{{ $lang->name }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputLongitude">Longitude</label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="text" name="longitude" class="form-control" value="{{ old('longitude') }}" id="exampleInputLongitude" placeholder="Enter Longitude" autocomplete="off">
                                        </div>
                                    </div>
                                </div>

                            </div>

                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputLatitude">Latitude</label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="text" name="latitude" class="form-control" value="{{ old('latitude') }}" id="exampleInputLatitude" placeholder="Enter Latitude" autocomplete="off">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputFile">Logo</label>
                                        </div>
                                        <div class="col-sm-8">
                                            <div class="input-group">
                                                <div class="custom-file">
                                                    <input type="file" class="custom-file-input" name="logo" id="file">
                                                    <label class="custom-file-label" for="exampleInputFile">Choose file</label>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                </div>

                            </div>

                            <div class="row">

                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputTaxIncluded">Tax Included</label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="checkbox" name="tax_included" value="0"
                                                data-bootstrap-switch
                                                data-off-color="danger" data-on-color="success">
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-3">
                                            <label for="exampleInputTaxRate">Tax Rate</label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="text" name="tax_rate" class="form-control" value="{{ old('tax_rate') }}" id="exampleInputTaxRate" placeholder="Enter Tax Rate" autocomplete="off">
                                        </div>
                                    </div>
                                </div>

                            </div>

                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-4">
                                            <label for="exampleInputTimezone">Reservation Status</label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="checkbox" name="reservation_status" value="0"
                                                data-bootstrap-switch
                                                data-off-color="danger" data-on-color="success">
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-6">

                                    <div class="form-group row">
                                        <div class="col-sm-4">
                                            <label for="exampleInputTaxIncluded">Feedback Status</label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="checkbox" name="feedback_status" value="0"
                                                data-bootstrap-switch
                                                data-off-color="danger" data-on-color="success">
                                        </div>
                                    </div>
                                </div>

                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group row">
                                        <div class="col-sm-4">
                                            <label for="exampleInputTimezone">Status</label>
                                        </div>
                                        <div class="col-sm-8">
                                            <input type="checkbox" name="status" value="0"
                                                data-bootstrap-switch
                                                data-off-color="danger" data-on-color="success">
                                        </div>
                                    </div>

                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group row">
                                        <div class="col-sm-4">
                                            <label>Logo Preview</label>
                                        </div>
                                        <div class="col-sm-8">
                                            <img src="#" id="pic" class="hide" alt="Logo" style="border-radius: 5px;">
                                            <img src="{{ asset('default/150x150_default.png') }}" id="placeholder" class="" alt="profile pic" style="border-radius: 5px;">
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div> <!-- /.card-body -->

                        <div class="card-footer">
                            <button type="submit" class="btn btn-primary createButton">Submit</button>
                        </div>
                    </form>
                </div>

            </div>
        </div>
    </div>
    <!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->
@stop

@section('footer_scripts')

<!-- Select2 -->
<script src="{{ asset('admin_assets/plugins/select2/js/select2.full.min.js') }}"></script>
<!-- Bootstrap Switch -->
<script src="{{ asset('admin_assets/plugins/bootstrap-switch/js/bootstrap-switch.min.js') }}"></script>
<script src="{{ asset('admin_assets/plugins/jquery-validation/jquery.validate.js') }}"></script>
<script src="{{ asset('js/subrestaurant-validation.js') }}"></script>
<script>
    $(function() {
        $('.select2').select2()
    });

    $("input[data-bootstrap-switch]").each(function() {
        $(this).bootstrapSwitch('state', $(this).prop('checked'));
    });
</script>

<script>
    $(document).ready(function() {
        $("#country").change(function() {
            var id = $("#country").val();
            $.ajax({
                url: '{{ URL::to('
                administrator / restaurants / states ') }}',
                type: 'POST',
                data: {
                    'id': id,
                    '_token': '{{ csrf_token() }}'
                },
                success: function(html) {
                    $("#state").html(html);
                }
            });
        });
    });
</script>

<script>
    $(document).ready(function() {
        $("#state").change(function() {
            var id = $("#state").val();
            $.ajax({
                url: '{{ URL::to("administrator/restaurants/cities") }}',
                type: 'POST',
                data: {
                    'id': id,
                    '_token': '{{ csrf_token() }}'
                },
                success: function(html) {
                    $("#city").html(html);
                }
            });
        });
    });
</script>
<script>
    function filePreview(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();
            reader.onload = function(e) {
                $('#pic').attr('src', e.target.result)
                    .height(150)
                    .width(150);
                $("#pic").removeClass('hide');
                $("#placeholder").addClass('hide');
            };
            reader.readAsDataURL(input.files[0]);
        }
    }

    $("#file").change(function() {
        filePreview(this);
    });
</script>
@stop