@extends('header.header')
@section('content')
    <div class="header pb-6 d-flex align-items-center" style="min-height: 200px; background-image: url(../assets/img/theme/profile-cover.jpg); background-size: cover; background-position: center top;">
        <!-- Mask -->
        <span class="mask bg-gradient-default opacity-8"></span>
        <!-- Header container -->

    </div>



    <div class="container-fluid mt--6  ">
        <div class="row">
            <div class="offset-xl-2 col-xl-8 order-xl-1 ">
                <div class="card">
                    <div class="card-header">
                        <div class="row align-items-center">
                            <div class="col-8">
                                <h3 class="mb-0">{{__('Edit User Vendor')}} </h3>
                            </div>

                        </div>
                    </div>
                    <div class="card-body">

                        <form method="post"  action="{{route("user_vendor.update", $user->id)}}"  enctype="multipart/form-data">
                            @csrf
                            @method("put")
                            <div class="pl-lg-4">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label class="form-control-label" for="input-username">{{__('user Name')}}</label>
                                            <input type="text" id="input-RestaurantName" name="name" class="form-control @if($errors->has('name')) is-invalid @endif" placeholder="{{__('User name')}}" value="{{ inputValue("name", $user) }}" required>
                                        </div>
                                        @error("name")
                                        <div class="input-error">{{$message}}</div>
                                        @enderror
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label class="form-control-label" for="input-username">{{__('Email')}}</label>
                                            <input type="email" id="input-RestaurantName" name="email" class="form-control @if($errors->has('email')) is-invalid @endif" placeholder="{{__('User email')}}" value="{{ inputValue("email", $user) }}" required>
                                        </div>
                                        @error("email")
                                        <div class="input-error">{{$message}}</div>
                                        @enderror
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label class="form-control-label" for="input-Tax">{{__('Password')}}</label>
                                            <input type="password" id="input-Tax" name="password" class="form-control @if($errors->has('password')) is-invalid @endif" placeholder="Enter Password" required>
                                        </div>
                                        @error("password")
                                        <div class="input-error">{{$message}}</div>
                                        @enderror
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label class="form-control-label" for="input-city">{{__('Phone Number')}}</label>
                                            <input type="text" id="input-city" name="phone_number" class="form-control @if($errors->has('phone_number')) is-invalid @endif"   placeholder="{{__('Phone Number')}}" value="{{ inputValue("phone_number", $user) }}" required>
                                        </div>
                                        @error("phone_number")
                                        <div class="input-error">{{$message}}</div>
                                        @enderror
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label class="form-control-label" for="input-phone_number">{{__('User Image')}} </label>
                                            <input type="file" id="input-phone_number" name="User_Image" class="form-control" placeholder="" value="Jesse" accept="image/x-png,image/gif,image/jpeg,image/png,image/jpg,image/svg">
                                        </div>
                                        @error("User_Image")
                                        <div class="input-error">{{$message}}</div>
                                        @enderror
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label class="form-control-label" for="input-classification">{{__('Stores')}} </label>
                                            <select name="vendor_id" class="form-control @if($errors->has('vendor_id')) is-invalid @endif" id="vendors" data-url="{{ route("user_vendor.get_by_vendor") }}">
                                                <option value="">{{__("Select Store")}}</option>
                                                @foreach($vendors as $vendor)
                                                    <option {{selected("vendor_id", $vendor->id)}} value="{{$vendor->id}}">{{$vendor->lang->getTitleAttribute()}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                        @error("vendor_id")
                                        <div class="input-error">{{$message}}</div>
                                        @enderror
                                    </div>
                                    <div class="col-lg-6" style="@if(!$errors->has('branch_id')) display: none;  @endif" id="selectBranches">
                                        <div class="form-group">
                                            <label class="form-control-label" for="input-classification">{{__('Branch store')}} </label>
                                            <select name="branch_id" class="form-control" id="branches">
                                                @foreach($Branches_stores as $branch)
                                                    <option {{selected("branch_id", $branch->id)}} value="{{$branch->id}}">{{$branch->lang->getTitleAttribute()}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                        @error("branch_id")
                                        <div class="input-error">{{$message}}</div>
                                        @enderror
                                    </div>

                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label class="form-control-label" for="input-classification">{{__('Roles')}} </label>
                                            <select class="form-control @if($errors->has('role')) is-invalid @endif" id="NavigateList" name="role_id">
                                                <option value="">{{__('None')}}</option>
                                                @foreach($roles as $role)
                                                    <option  {{selected("role_id", $role->id, $user)}} value="{{$role->id}}" @if(old("role")) {{selected("role", $role->id)}} @endif >{{$role->name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                        @error("role_id")
                                        <div class="input-error">{{$message}}</div>
                                        @enderror
                                    </div>
                                </div>
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <img src="{{$user->getFirstMediaFile() ? $user->getFirstMediaFile()->url : Null}}" width="250" alt="">
                                        </div>
                                    </div>
                                    <div class="col-lg-12">
                                        <div class="form-group">
                                            <button type='submit' class="btn btn-primary" name="addRestaurant">{{__('Submit')}}</button>
                                            <a href="{{route("user_vendor.index")}}" class="btn btn-danger">{{__('cancel')}}</a>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </form>
                                <hr class="my-4 ">
                                <!-- Address -->
                            </div>
                </div>
            </div>
        </div>
                    </div>


        </div>
    </div>


@endsection
@section("js-scripts")
    <script>
        $("#vendors").on("change", function (){
            console.log($(this).val())
            var url = $(this).data("url"),
                id = $(this).val();
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                type: 'GET',
                url:  url,
                data: {"id": id},
                success: function(response){
                    let data = response.data;
                    var select = $("#branches").empty(),
                        selectBranches = $("#selectBranches");

                    if(data != false){
                        $("<option value=''>none</option>").appendTo(select);
                        data.forEach(function (store){
                            $("<option value='" + store.id + "'>" + store.name + "</option>")
                                .appendTo(select);
                        });
                        selectBranches.fadeIn();
                    }
                },
                error: function(){

                }
            });
        })
    </script>
@endsection