@extends('layouts.app')
@section('content')
<!-- Main Container -->
<main id="main-container">
    <!-- Hero -->
    <div class="bg-image" style="background-image: url('{{asset('website/assets/media/photos/photo17@2x.jpg')}}');">
        <div class="bg-black-75">
            <div class="content content-full">
                <div class="py-5 text-center">
                    <a class="img-link" href="javascript:void(0)">
                        <img class="img-avatar img-avatar96 img-avatar-thumb" src="{{asset($user->image)}}" alt="">
                    </a>
                    <h1 class="font-w700 my-2 text-white">{{trans('web.edit')}}</h1>
                    <h2 class="h4 font-w700 text-white-75">
                        {{$user->name}}
                    </h2>
                    <a class="btn btn-hero-dark" href="{{route('website.users.show',$user->id)}}">
                        <i class="fa fa-fw fa-arrow-left"></i> {{trans('web.back')}}
                    </a>
                </div>
            </div>
        </div>
    </div>
    <!-- END Hero -->

    <!-- Page Content -->
    <div class="content content-full content-boxed">
        <div class="block block-rounded">
            <div class="block-content">
                <form action="{{route('website.users.update',$user->id)}}" method="POST" enctype="multipart/form-data" >
                    @csrf
                        {{method_field('put')}}
                    <!-- User Profile -->
                    <h2 class="content-heading pt-0">
                        <i class="fa fa-fw fa-user-circle text-muted mr-1"></i> {{trans('web.profile')}}
                    </h2>
                    <div class="row push">
                        <div class="col-lg-4">
                            <p class="text-muted">
                                {{trans('web.profile_info')}}

                            </p>
                        </div>
                        <div class="col-lg-8 col-xl-5">
                            <div class="form-group">
                                <label for="dm-profile-edit-name">{{trans('web.name')}}</label>
                                <input type="text" class="form-control" id="dm-profile-edit-name" name="name" placeholder="Enter your name.." value="{{$user->name}}">
                            </div>
                            <div class="form-group">
                                <label for="dm-profile-edit-email">{{trans('web.email')}}</label>
                                <input type="email" class="form-control" id="dm-profile-edit-email" name="email" placeholder="Enter your email.." value="{{$user->email}}">
                            </div>
                            <div class="form-group">
                                <label>{{trans('web.password')}}</label>
                                <input type="password" class="form-control" id="dm-profile-edit-email" name="password">
                            </div>
                            <div class="form-group">
                                <label>{{trans('web.image')}}</label>
                                <div class="push">
                                    <img class="img-avatar" src="{{asset($user->image)}}" alt="">
                                </div>
                                <div class="custom-file">
                                    <!-- Populating custom file input label with the selected filename (data-toggle="custom-file-input" is initialized in Helpers.coreBootstrapCustomFileInput()) -->
                                    <input type="file" class="custom-file-input" data-toggle="custom-file-input" id="dm-profile-edit-avatar" name="image">
                                    <label class="custom-file-label" for="dm-profile-edit-avatar">Choose a new avatar</label>
                                </div>
                            </div>
                            <div class="form-group">
                                <select required class="form-control form-control-alt" id="stage_id" name="stage_id[]" style="width: 100%;" data-placeholder="@lang('web.stage')">
                                    <option selected disabled value="">{{trans('web.stage')}}</option><!-- Required for data-placeholder attribute to work with Select2 plugin -->
                                    @foreach(\App\Stage::all() as $stage)
                                        <option value="{{$stage->id}}" {{(in_array($stage->id,$user_stages))?'selected':''}}>{{$stage->name}}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div id="class_container">
                                <div class="form-group d-flex justify-content-between">
                                    <select multiple required class="js-select2 form-control form-control-alt" data-placeholder="@lang('web.class')" id="class_id" onchange="getSubjects()" name="class_id[]">
                                        <option></option><!-- Required for data-placeholder attribute to work with Select2 plugin -->
                                        {{--                                                <option value="" selected disabled>@lang('web.class')</option>--}}
                                        @foreach(\App\StageClass::all() as $class)
                                            <option value="{{$class->id}}" {{(in_array($class->id,$user_classes))?'selected':''}}>{{$class->name.' ('.$class->stage->name.')'}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div id="subject_container">
                                <div class="form-group">
                                    <select class="js-select2 form-control form-control-alt" id="subject_id" name="subject_id[]" style="width: 100%;" data-placeholder="@lang('web.subject')" multiple>
                                        <option></option><!-- Required for data-placeholder attribute to work with Select2 plugin -->
                                        @foreach(\App\Subject::all() as $subject)
                                            <option value="{{$subject->id}}" {{(in_array($subject->id,$user_subjects))?'selected':''}}>{{$subject->name.' ('.$subject->stageClass->name.' - '.$subject->stageClass->stage->name.')'}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                         </div>
                    </div>
                    <!-- END User Profile -->

{{--                    <!-- Change Password -->--}}
{{--                    <h2 class="content-heading pt-0">--}}
{{--                        <i class="fa fa-fw fa-asterisk text-muted mr-1"></i> Change Password--}}
{{--                    </h2>--}}
{{--                    <div class="row push">--}}
{{--                        <div class="col-lg-4">--}}
{{--                            <p class="text-muted">--}}
{{--                                Changing your sign in password is an easy way to keep your account secure.--}}
{{--                            </p>--}}
{{--                        </div>--}}
{{--                        <div class="col-lg-8 col-xl-5">--}}
{{--                            <div class="form-group">--}}
{{--                                <label for="dm-profile-edit-password">Current Password</label>--}}
{{--                                <input type="password" class="form-control" id="dm-profile-edit-password" name="dm-profile-edit-password">--}}
{{--                            </div>--}}
{{--                            <div class="form-group row">--}}
{{--                                <div class="col-12">--}}
{{--                                    <label for="dm-profile-edit-password-new">New Password</label>--}}
{{--                                    <input type="password" class="form-control" id="dm-profile-edit-password-new" name="dm-profile-edit-password-new">--}}
{{--                                </div>--}}
{{--                            </div>--}}
{{--                            <div class="form-group row">--}}
{{--                                <div class="col-12">--}}
{{--                                    <label for="dm-profile-edit-password-new-confirm">Confirm New Password</label>--}}
{{--                                    <input type="password" class="form-control" id="dm-profile-edit-password-new-confirm" name="dm-profile-edit-password-new-confirm">--}}
{{--                                </div>--}}
{{--                            </div>--}}
{{--                        </div>--}}
{{--                    </div>--}}
{{--                    <!-- END Change Password -->--}}


                    <!-- Submit -->
                    <div class="row push">
                        <div class="col-lg-8 col-xl-5 offset-lg-4">
                            <div class="form-group">
                                <button type="submit" class="btn btn-alt-primary">
                                    <i class="fa fa-check-circle mr-1"></i> {{trans('web.edit')}}
                                </button>
                            </div>
                        </div>
                    </div>
                    <!-- END Submit -->
                </form>
            </div>
        </div>
    </div>
    <!-- END Page Content -->
</main>
<!-- END Main Container -->
@endsection
@section('script')
    <script>
        $('#stage_id').change(function (){
            //get company_services
            $.ajax({
                url: '{{route("get_stage_classes")}}',
                type: 'GET',
                data: {
                    'id': $('#stage_id').val(),
                },
                dataType: 'json',
                success: function (response) {
                    var data = response.data;
                    if (data){
                        $('#class_container').empty();
                        $('#class_container').append(data);
                    }else {

                    }

                },
                error: function () {

                }

            });
        });
        function getSubjects(){
            //get company_services
            $.ajax({
                url: '{{route("get_class_subjects")}}',
                type: 'GET',
                data: {
                    'id': $('#class_id').val(),
                },
                dataType: 'json',
                success: function (response) {
                    var data = response.data;
                    if (data){
                        $('#subject_container').empty();
                        $('#subject_container').append(data);
                    }else {

                    }

                },
                error: function () {

                }

            });
        }
    </script>
@endsection