<x-admin-panel-layout>
    <x-slot name="title">
        تعریف خدمت جدید
    </x-slot>
    <x-slot name="main">
        <!-- Checked checkbox -->
        <div class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1 class="m-0 text-dark">ایجاد خدمت جدید</h1>
                    </div><!-- /.col -->
                    <div class="col-sm-6">
                        <ol class="breadcrumb float-sm-left">
                            <li class="breadcrumb-item"><a href="{{ route("admin.dashboard") }}">داشبورد</a></li>
                            <li class="breadcrumb-item"><a href="{{ route("service.index") }}">مدیریت خدمات</a></li>
                            <li class="breadcrumb-item active">ایجاد خدمت</li>
                        </ol>
                    </div><!-- /.col -->
                </div><!-- /.row -->
            </div><!-- /.container-fluid -->
        </div>
        <section class="content mt-sm-3 d-flex justify-content-around">
            <div class="card p-0 card-primary col-md-7 mx-auto mb-4">
                <div class="card-header">
                    <h3 class="card-title small">ایجاد خدمت</h3>
                </div>
            <!-- /.card-header -->
                <!-- form start -->
                <form class="mt-3 p-2" action="{{route('service.store')}}" method="post" enctype="multipart/form-data">
                    @csrf
                    <div class="form-group">
                        <select class="form-control" id="parent_id" required name="parent_id">
                            <option hidden disabled {{old('parent_id') != null ? '' : 'selected'}}>انتخاب سر دسته</option>
                            @foreach($services as $service)
                                <option value="{{$service->id}}" {{$service->id ==old('parent_id') ? 'selected' : ''}}>{{$service->name}}</option>
                            @endforeach
                        </select>
                        @error('parent_id')
                        <div class="invalid">
                            <p class="text-danger" style="font-size: 0.8rem;padding-right: 0.2rem">{{$message}}</p>
                        </div>
                        @enderror
                    </div>
                    <div class="form-group">
                        <input type="text" name='name' class="form-control" id="service"
                               placeholder="نام خدمت" value="{{old('name')}}" required>
                        @error('name')
                        <div class="invalid">
                            <p class="text-danger" style="font-size: 0.8rem;padding-right: 0.2rem">{{$message}}</p>
                        </div>
                        @enderror
                    </div>
                    <div class="form-group">
                        <input type="text" name='slug' class="form-control" id="slug"
                               placeholder="URL" value="{{old('slug')}}" required>
                        @error('slug')
                        <div class="invalid">
                            <p class="text-danger" style="font-size: 0.8rem;padding-right: 0.2rem">{{$message}}</p>
                        </div>
                        @enderror
                    </div>
                    <div class="form-group">
                        <input type="text" name='title' class="form-control" id="title"
                               placeholder="عنوان(اختیاری)" value="{{old('title')}}">
                        @error('title')
                        <div class="invalid">
                            <p class="text-danger" style="font-size: 0.8rem;padding-right: 0.2rem">{{$message}}</p>
                        </div>
                        @enderror
                    </div>
                    <div class="form-group">
                        <input type="number" name='priority' class="form-control" id="priority"
                               placeholder="الویت نمایش بصورت عدد وارد شود(اختیاری)" value="{{old('priority')}}">
                        @error('priority')
                        <div class="invalid">
                            <p class="text-danger" style="font-size: 0.8rem;padding-right: 0.2rem">{{$message}}</p>
                        </div>
                        @enderror
                    </div>
                    <div class="form-group">
                        <input type="number" name='days_provide' class="form-control" id="days_provide"
                               placeholder="از الان تا چند روز بعد قابل سفارش است پیشفرض ۱۰ روز و حداکثر ۳۰ روز"
                               value="{{old('days_provide')}}">
                        @error('days_provide')
                        <div class="invalid">
                            <p class="text-danger" style="font-size: 0.8rem;padding-right: 0.2rem">{{$message}}</p>
                        </div>
                        @enderror
                    </div>
                    <div class="form-group">
                        <input type="number" name='affiliate_percent' min="0" max="100" class="form-control" id="days_provide"
                               placeholder="درصد بازاریاب"
                               value="{{old('affiliate_percent')}}">
                        @error('affiliate_percent')
                        <div class="invalid">
                            <p class="text-danger" style="font-size: 0.8rem;padding-right: 0.2rem">{{$message}}</p>
                        </div>
                        @enderror
                    </div>

                    <div class="custom-file mb-sm-2 mb-5 withImgProf mx-auto position-relative">
                        <input type="file" name="img"
                               class="custom-file-input @error('img') is-invalid @enderror"
                               id="customFile" accept="image/*" value="{{ old('img') }}">
                        @error('img')
                        <div class="invalid-tooltip" style="top: 38px ;left: unset;">
                            <p style="font-size: 0.7rem">{{$message}}</p>
                        </div>
                        @enderror
                        <label class="custom-file-label paddingRight text-muted smallxsm" for="customFile">انتخاب
                            عکس
                           </label>
                        <small class="text-muted mr-sm-1">حجم حداکثر 1mb  فرمت jpeg یا jpg</small>
                    </div>
                    <button type="submit" class="btn btn-primary btn-block mt-3">ثبت</button>
                </form>
            </div>

            <div class="card p-0 card-primary col-md-4 mx-auto" style="height: min-content !important;">
                <div class="card-header">
                    <h3 class="card-title small">ایجاد خدمت سردسته</h3>
                </div>
                <form class="mt-3 p-2" action="{{route('service.store_parent')}}" method="post"
                      enctype="multipart/form-data">
                    @csrf
                    <div class="form-group">
                        <input type="text" name='name_parent' class="form-control" id="service_parent"
                               placeholder="نام خدمت" value="{{old('name_parent')}}" required>
                        @error('name_parent')
                        <div class="invalid">
                            <p class="text-danger" style="font-size: 0.8rem;padding-right: 0.2rem">{{$message}}</p>
                        </div>
                        @enderror
                    </div>
                    <div class="form-group">
                        <input type="text" name='slug_parent' class="form-control" id="slug_parent"
                               placeholder="URL" value="{{old('slug_parent')}}" required>
                        @error('slug_parent')
                        <div class="invalid">
                            <p class="text-danger" style="font-size: 0.8rem;padding-right: 0.2rem">{{$message}}</p>
                        </div>
                        @enderror
                    </div>
                    <div class="form-group">
                        <input type="text" name='title_parent' class="form-control" id="title_parent"
                               placeholder="عنوان" value="{{old('title_parent')}}">
                        @error('title_parent')
                        <div class="invalid">
                            <p class="text-danger" style="font-size: 0.8rem;padding-right: 0.2rem">{{$message}}</p>
                        </div>
                        @enderror
                    </div>
                    <div class="form-group">
                        <input type="number" name='priority_parent' class="form-control" id="priority_parent"
                               placeholder="الویت نمایش بصورت عدد وارد شود" value="{{old('priority_parent')}}">
                        @error('priority_parent')
                        <div class="invalid">
                            <p class="text-danger" style="font-size: 0.8rem;padding-right: 0.2rem">{{$message}}</p>
                        </div>
                        @enderror
                    </div>
                    <div class="custom-file mb-sm-2 mb-5 withImgProf mx-auto">
                        <input type="file" name="img_parent"
                               class="custom-file-input @error('img_parent') is-invalid @enderror"
                               id="customFile" accept="image/*" value="{{ old('img_parent') }}">
                        @error('img_parent')
                        <div class="invalid">
                            <p class="text-danger" style="font-size: 0.8rem;padding-right: 0.2rem">{{$message}}</p>
                        </div>
                        @enderror
                        <label class="custom-file-label paddingRight text-muted smallxsm" for="customFile">انتخاب
                            عکس
                            (اختیاری)</label>
{{--                        <small class="text-muted mr-sm-1">حجم حداکثر 1mb  فرمت jpeg یا jpg</small>--}}
                    </div>
                    <button type="submit" class="btn btn-primary btn-block mt-3">ثبت</button>
                </form>
            </div>
        </section>
    </x-slot>
    @if(session()->get('status') == 'created')
        <x-slot name="linkScript">
            <script>
                Swal.fire({
                    icon: 'success',
                    text: 'ایجاد خدمات با موفقیت انجام شد',
                })
            </script>
        </x-slot>
    @endif
    @if(session()->get('status') == 'updated')
        <x-slot name="linkScript">
            <script>
                Swal.fire({
                    icon: 'success',
                    text: 'ویرایش خدمات با موفقیت انجام شد',
                })
            </script>
        </x-slot>
    @endif
</x-admin-panel-layout>
