@extends('layouts.app')
@section('title')
{{ __("messages.Shows") }}
@endsection
@section('style')
@include('admin.shows.inc.style')
@endsection
@section('content')
<div class="container-xxl flex-grow-1 container-p-y">
    @include('inc.breadcrumb' , ['breadcrumb_items'=>[
         __("messages.Home")=>route('home'),
                __('messages.Shows') => route('admin.shows.index'),
          $show->name =>null,
          __("messages.New show date")=>"active"
    ]])



    <div class="row justify-content-center">
        <!-- Form controls -->
        <div class="col-md-12">
            <!-- Multi Column with Form Separator -->
            <div class="card mb-4">
              <h5 class="card-header">{{ __("messages.Theatrical show data") }}</h5>
              <form class="card-body" action="{{ route('admin.shows.store_new_date' , $show->id) }}" id="form_submit" method="POST" enctype="multipart/form-data">
                @csrf

                <div class="row g-3">
                    <div class="col-12 repeater ">
                        <div class="row "  data-repeater-list="dates">
                            <div class="col-12">
                                <div class="row">
                                    <div class="d-flex justify-content-end mb-3">
                                        <button type="button"   data-bs-toggle="modal"
                                        data-bs-target="#exLargeModal"  class="btn rounded-pill btn-label-success waves-effect mx-2">
                                            <span class="fa-solid fa-eye  me-1"></span>{{ __("messages.Show Hall") }}
                                        </button>
{{--
                                        <button  data-repeater-create type="button" class="btn rounded-pill btn-label-primary waves-effect">
                                            <span class="fa-solid fa-circle-plus  me-1"></span>{{ __("messages.New show date") }}
                                        </button> --}}


                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mt-3" data-repeater-item>



                                <div class="row border border-dark p-4 rounded ">
                                    <div class="col-12">
                                        <div class="d-flex justify-content-end">
                                            <button data-repeater-delete type="button" class="btn rounded-pill btn-icon btn-outline-danger waves-effect">
                                                <span class="ti ti-x"></span>
                                            </button>
                                        </div>

                                    </div>
                                    <div class="mbsc-col-sm-12 mbsc-col-md-4 rounded mb-3" >
                                        <label for="flatpickr-multi" class="form-label">اضغط لظهور المواعيد  </label>
                                        <input type="text"  name="dates" class="form-control" placeholder="YYYY-MM-DD HH:MM" id="flatpickr-multi" />
                                        {{-- <label class="form-label mb-3">{{ __('messages.Show dates') }}</label>
                                        <label>
                                            <input style="
                                            border-radius: 10px;
                                            padding: 19px;
                                            background: #7367f0;
                                        " class="calendar" name="dates" value="" mbsc-input placeholder="اضغط لظهور المواعيد .. " />
                                        </label> --}}
                                    </div>
                                    {{-- <div class="col-12 mb-3">
                                        <label  class="form-label">{{ __('messages.Show Time') }}</label>
                                        <input type="time" name="time"   class="form-control mt-2" />
                                    </div> --}}
                                    {{-- <div class="col-6">

                                    </div> --}}
                                    <div class="col-12 inner-repeater">
                                        <div class="row" data-repeater-list="categories">
                                            <div class="col-12">
                                                <div class="d-flex justify-content-end">
                                                    <button  data-repeater-create type="button" class="btn rounded-pill btn-label-primary waves-effect new_price_category">
                                                        <span class="fa-solid fa-circle-plus  me-1"></span>{{ __("messages.New price category") }}
                                                    </button>
                                                </div>
                                            </div>

                                            <div class="col-12" data-repeater-item>
                                                <div class="row border mt-5  border-dark p-4 rounded">
                                                    <div class="col-12">
                                                        <div class="d-flex justify-content-end">
                                                            <button data-repeater-delete type="button" class="btn rounded-pill btn-icon btn-outline-danger waves-effect">
                                                                <span class="ti ti-x"></span>
                                                            </button>
                                                        </div>

                                                    </div>
                                                      <!-- Multiple -->
                                                    <div class="col-md-6">
                                                        <label class="form-label mb-3">{{ __("messages.Rows") }}</label>
                                                        <select name="rows"  class="select2 form-select" multiple>
                                                            @foreach ($rows as $row )
                                                            <option value="{{ $row->row_name }},{{ $row->section }}">{{ $row->row_name }} - {{ $row->section }}</option>
                                                            @endforeach

                                                        </select>
                                                    </div>
                                                    <div class="col-6">
                                                        <label class="form-label" >{{ __("messages.Group") }}</label>
                                                        <select name="group" class="form-control  mt-2">
                                                            <option value="">----</option>
                                                            @foreach ($groups as  $group)
                                                            <option value="{{ $group->id }}">{{ $group->name }}</option>
                                                            @endforeach
                                                        </select>
                                                    </div>
                                                    <div class="col-6 mt-1">
                                                        <label  class="form-label">{{ __("messages.Price") }}</label>
                                                        <input type="number" name="price"   step=".0001"  class="form-control mt-2" />
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                    </div>

                                </div>

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

                 </div>
                <div class="pt-4">
                    <button  type="submit" class="btn btn-primary me-sm-3 me-1 btn_with_load">{{ __('messages.Save') }}

                    </button>
                    <button type="reset" class="btn btn-label-secondary">{{ __('messages.Cancel') }}</button>
                </div>
              </form>
            </div>
        </div>
    </div>

 </div>
@endsection
@section('script')
<script src="{{asset('assets/vendor/libs/toastr/toastr.js')}}"></script>
<script src="{{asset('assets/vendor/libs/jquery-repeater/jquery-repeater.js')}}"></script>
{{-- <script src="{{asset('assets/lib/clender/js/mobiscroll.jquery.min.js')}}"></script> --}}
<script>

    mobiscroll.setOptions({
locale: mobiscroll.localeAr,          // Specify language like: locale: mobiscroll.localePl or omit setting to use default
theme: 'windows',
themeVariant: 'dark'           // More info about themeVariant: https://mobiscroll.com/docs/jquery/datepicker/api#opt-themeVariant
});

$(function () {
//     var show_dates="{{ $dates_show }}".split(",");
//     var colors_show_dates=[];
//     $.each(show_dates,function(key,val){
//         var c_date ={
//             date:val,
//             background:"#737373",

//         }
//         colors_show_dates.push(c_date)
//     })

//     $('.calendar').mobiscroll().datepicker({
//     controls: ['calendar'],
//     selectMultiple: true,
//     pages: 2,

//     colors: colors_show_dates,
//     invalid: show_dates
// });

});


</script>
@include('admin.shows.inc.script_submit')

@endsection