@extends('layouts.main')
@section('stylesheets')
    <link rel="stylesheet" href="{{asset('css/edit.css')}}"/>
    <link rel="stylesheet" href="{{asset('css/forms.css')}}"/>
    <link rel="stylesheet" href="{{asset('css/tabs.css')}}"/>
    <link rel="stylesheet" href="{{asset('css/general-inner.css')}}"/>
    <link rel="stylesheet" href="{{asset('css/attach-units.css')}}"/>
    <link rel="stylesheet" href="{{asset('css/general-modal.css')}}"/>
@endsection
@section('content')
    <script type="text/javascript" src="{{asset('js/jquery.min.js')}}"></script>
    <div class="main-wrapper">
        <div class="row justify-content-between Header mb-5">
            <div class="col-md-8 d-flex flex-column justify-content-center justify-content-md-start Header-breadcrumbs">

                {{ Breadcrumbs::render('edituser', $user->id) }}
                <h2 class="page-title">Edit User {{$user->firstname}},{{$user->lastname}}</h2>
            </div>
            <div class="col-md-4 d-flex justify-content-center justify-content-md-end Header-buttons">

            </div>
        </div>

        @if ($errors->any())
            <div class="alert alert-danger">
                <strong>Whoops!</strong> There were some problems with your input.<br><br>
                <ul>
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif

        @csrf
        <div class="form-inner-container">
            <!--Tabs-->
            <div class="form-tabs-container">
                <ul class="nav form-tabs-container--ul nav-pills mb-3" id="pills-tab" role="tablist">
                    <li class="nav-item" role="presentation">
                        <button class="btn form-tabs-container--ul--btn active tab-btn" id="pills-first-tab"
                                data-bs-toggle="pill" data-bs-target="#pills-first" type="button" role="tab"
                                aria-controls="pills-first" aria-selected="true"><img
                                src="{{asset('images/personal-info.svg')}}" class="tab-img"><span>Personal Info</span>
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="btn form-tabs-container--ul--btn tab-btn" id="pills-second-tab"
                                data-bs-toggle="pill" data-bs-target="#pills-second" type="button" role="tab"
                                aria-controls="pills-second" aria-selected="true"><img
                                src="{{asset('images/one-to-one.svg')}}"
                                class="tab-img"><span>Relations</span></button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="btn form-tabs-container--ul--btn tab-btn" id="pills-third-tab"
                                data-bs-toggle="pill" data-bs-target="#pills-third" type="button" role="tab"
                                aria-controls="pills-third" aria-selected="false"><img
                                src="{{asset('images/unit.svg')}}" class="tab-img"><span>Units</span></button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="btn form-tabs-container--ul--btn tab-btn" id="pills-fourth-tab"
                                data-bs-toggle="pill" data-bs-target="#pills-fourth" type="button" role="tab"
                                aria-controls="pills-fourth" aria-selected="false"><img
                                src="{{asset('images/role.svg')}}" class="tab-img"><span>Roles</span></button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="btn form-tabs-container--ul--btn tab-btn" id="pills-fifth-tab"
                                data-bs-toggle="pill" data-bs-target="#pills-fifth" type="button" role="tab"
                                aria-controls="pills-fifth" aria-selected="false"><img
                                src="{{asset('images/microservice.svg')}}" class="tab-img"><span>Microservices</span>
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="btn form-tabs-container--ul--btn tab-btn" id="pills-sixth-tab"
                                data-bs-toggle="pill" data-bs-target="#pills-sixth" type="button" role="tab"
                                aria-controls="pills-sixth" aria-selected="false"><img
                                src="{{asset('images/profile.svg')}}" class="tab-img"><span>Profile</span></button>
                    </li>

                    @if($user->work_relation_id === 2)
                        <li class="nav-item" role="presentation">
                            <button class="btn form-tabs-container--ul--btn tab-btn" id="pills-seventh-tab"
                                    data-bs-toggle="pill" data-bs-target="#pills-seventh" type="button" role="tab"
                                    aria-controls="pills-seventh" aria-selected="false"><img
                                    src="{{asset('images/profile.svg')}}" class="tab-img"><span>Contracts</span></button>
                        </li>
                    @endif
                </ul>
                <div class="tab-content" id="pills-tabContent">
                    <form class="tab-pane fade show active card update-form" id="pills-first" role="tabpanel"
                          aria-labelledby="pills-first-tab" action="{{route('user.update',['user' => $user])}}"
                          method="POST">
                        <div class="card-body">
                            <div class="edit-tab-btn-container">
                                <a class="edit-tab-btn edit-btn"><span>Edit</span><img
                                        src="{{asset('images/edit.svg')}}" class="tab-img"></a>
                                <a class="edit-tab-btn cancel-btn"><span>Cancel</span><img
                                        src="{{asset('images/cancel.svg')}}" class="tab-img"></a>
                            </div>
                            @csrf
                            <div class="card-body-inner">
                                <div class="form-group">
                                    <label>Firstname:</label>
                                    <input type="text" name="firstname" class="form-control name personal-info readonly"
                                           value="{{$user->firstname}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Lastname:</label>
                                    <input type="text" name="lastname" class="form-control name personal-info readonly"
                                           value="{{$user->lastname}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Firstname English:</label>
                                    <input type="text" name="firstname_en"
                                           class="form-control name personal-info readonly"
                                           value="{{$user->firstname_en}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Lastname English:</label>
                                    <input type="text" name="lastname_en"
                                           class="form-control name personal-info readonly"
                                           value="{{$user->lastname_en}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Father name:</label>
                                    <input type="text" name="father_name"
                                           class="form-control name personal-info readonly"
                                           value="{{$user->father_name}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Father name English:</label>
                                    <input type="text" name="father_name_en"
                                           class="form-control name personal-info readonly"
                                           value="{{$user->father_name_en}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Mother name:</label>
                                    <input type="text" name="mother_name"
                                           class="form-control name personal-info readonly"
                                           value="{{$user->mother_name}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Mother name English:</label>
                                    <input type="text" name="mother_name_en"
                                           class="form-control name personal-info readonly"
                                           value="{{$user->mother_name_en}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>AFM:</label>
                                    <input type="text" name="afm" class="form-control name personal-info readonly"
                                           value="{{$user->afm}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>AMKA:</label>
                                    <input type="text" name="amka" class="form-control name personal-info readonly"
                                           value="{{$user->amka}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Email :</label>
                                    <input type="text" name="email" class="form-control name personal-info readonly"
                                           value="{{$user->email}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Personal Email :</label>
                                    <input type="text" name="personal_email" class="form-control name personal-info readonly"
                                           value="{{$user->personal_email}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Phone :</label>
                                    <input type="text" name="phone" class="form-control name personal-info readonly"
                                           value="{{$user->phone}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Mobile Phone :</label>
                                    <input type="text" name="mobile_phone" class="form-control name personal-info readonly"
                                           value="{{$user->mobile_phone}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Office Number :</label>
                                    <input type="text" name="office_number" class="form-control name personal-info readonly"
                                           value="{{$user->office_number}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="gender">Gender</label>
                                    <select class="form-select personal-info-select disabled" name="gender" id="gender"
                                            disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        <option @if ($user->gender == "male") selected @endif  value="male">Male
                                        </option>
                                        <option @if ($user->gender == "female") selected @endif value="female">Female
                                        </option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label>Password :</label>
                                    <input type="text" name="password" class="form-control name readonly"
                                           value="{{$user->password}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>Age :</label>
                                    <input type="text" name="age" class="form-control name readonly"
                                           value="{{$user->age}}" readonly>
                                </div>
                                <div class="form-group">
                                    <label>LDAP uid :</label>
                                    <input type="text" name="ldap_uid" class="form-control name readonly"
                                           value="{{$user->ldap_uid}}" readonly>
                                </div>
                            </div>
                            <div class="form-group-container last-row-edit">
                                <div class="form-group d-flex email-verified-group-v2">
                                    <label>Email Verified at :</label>
                                    <input type="datetime-local" class="date disabled" name="email_verified_at" disabled
                                           value="{{$user->email_verified_at}}">
                                </div>
                                <div class="form-group">
                                    <label class="form-check-label">Active :</label>
                                    <input class="form-check-input disabled" type="checkbox" name="isActive" disabled
                                           @if($user->isActive == 1) checked @endif>
                                </div>
                            </div>
                            <div class="btn-container">
                                <button type="submit" class="btn update-btn"><span>Update User</span><img
                                        src="{{asset('images/update.svg')}}" class="tab-img"></button>
                            </div>
                        </div>
                    </form>
                    <form class="tab-pane fade show card  update-form" id="pills-second" role="tabpanel"
                          aria-labelledby="pills-second-tab" action="{{route('user.update',['user' => $user])}}"
                          method="POST">
                        <div class="card-body">
                            <div class="edit-tab-btn-container">
                                <a class="edit-tab-btn edit-btn"><span>Edit</span><img
                                        src="{{asset('images/edit.svg')}}" class="tab-img"></a>
                                <a class="edit-tab-btn cancel-btn"><span>Cancel</span><img
                                        src="{{asset('images/cancel.svg')}}" class="tab-img"></a>
                            </div>
                            @csrf
                            <div class="card-body-inner">
                                <div class="form-group">
                                    <label class="form-select-label" for="staff_categories"> Staff Categories</label>
                                    <select class="form-select personal-info-select disabled" name="staff_category_id"
                                            id="staff_categories" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($staff_categories as $staff_category)
                                            <option @if($staff_category->id == $user->staff_category_id) selected
                                                    @endif value="{{$staff_category->id}}">{{$staff_category->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="industries"> Industries</label>
                                    <select class="form-select personal-info-select disabled" name="industry_id"
                                            id="industries" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($industries as $industry)
                                            <option @if($user->industry_id == $industry->id) selected
                                                    @endif value="{{$industry->id}}">{{$industry->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="specializations"> Specializations</label>
                                    <select class="form-select personal-info-select disabled" name="specialization_id"
                                            id="specializations" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($specializations as $specialization)
                                            <option @if ($user->specialization_id == $specialization->id) selected
                                                    @endif value="{{$specialization->id}}">{{$specialization->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="work_relations">Work Relations</label>
                                    <select class="form-select personal-info-select disabled" name="work_relation_id"
                                            id="work_relations" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($work_relations as $work_relation)
                                            <option @if ($user->work_relation_id == $work_relation->id) selected
                                                    @endif value="{{$work_relation->id}}">{{$work_relation->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="salary_levels">Salary levels</label>
                                    <select class="form-select personal-info-select disabled" name="salary_level_id"
                                            id="salary_levels" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($salary_levels as $salary_level)
                                            <option @if ($user->salary_level_id == $salary_level->id) selected
                                                    @endif value="{{$salary_level->id}}">{{$salary_level->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="education_categories">Education
                                        Categories</label>
                                    <select class="form-select personal-info-select disabled"
                                            name="education_category_id" id="education_categories" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($education_categories as $education_category)
                                            <option
                                                @if ($user->education_category_id == $education_category->id) selected
                                                @endif value="{{$education_category->id}}">{{$education_category->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="grades">Grades</label>
                                    <select class="form-select personal-info-select disabled" name="grade_id"
                                            id="grades" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($grades as $grade)
                                            <option @if ($user->grade_id == $grade->id) selected
                                                    @endif value="{{$grade->id}}">{{$grade->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="ages">Ages</label>
                                    <select class="form-select " name="age_id" id="ages"
                                            disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($ages as $age)
                                            <option
                                                @if($user->age >= substr($age->name, 0 ,2)  && $user->age <= substr($age->name, 3 ,2)) selected
                                                @endif value="{{$age->id}}">{{$age->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="ranks"> Ranks</label>
                                    <select class="form-select personal-info-select disabled" name="rank_id"
                                            id="ranks" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($ranks as $rank)
                                            <option @if($rank->id == $user->rank_id) selected
                                                    @endif value="{{$rank->id}}">{{$rank->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="departments"> Departments</label>
                                    <select class="form-select personal-info-select disabled" name="department_id"
                                            id="departments" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($departments as $department)
                                            <option @if($department->id == $user->department_id) selected
                                                    @endif value="{{$department->id}}">{{$department->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="research_groups"> Research Groups</label>
                                    <select class="form-select personal-info-select disabled" name="research_group_id"
                                            id="research_groups" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($research_groups as $research_group)
                                            <option @if($research_group->id == $user->research_group_id) selected
                                                    @endif value="{{$research_group->id}}">{{$research_group->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="buildings"> Buildings</label>
                                    <select class="form-select personal-info-select disabled" name="building_id"
                                            id="buildings" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($buildings as $building)
                                            <option @if($building->id == $user->building_id) selected
                                                    @endif value="{{$building->id}}">Building {{$building->number}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="scientific_supervisors"> Scientific Supervisor</label>
                                    <select class="form-select personal-info-select disabled" name="scientific_supervisor_id"
                                            id="scientific_supervisors" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($scientific_supervisors as $scientific_supervisor)
                                            <option @if($scientific_supervisor['id'] == $user->scientific_supervisor_id) selected
                                                    @endif value="{{$scientific_supervisor['id']}}">{{$scientific_supervisor['firstname']}} {{$scientific_supervisor['lastname']}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="form-select-label" for="partners"> Partners</label>
                                    <select class="form-select personal-info-select disabled" name="partner_id"
                                            id="partners" disabled>
                                        <option value="" disabled selected hidden>Παρακαλώ επιλέξτε...</option>
                                        @foreach($partners as $partner)
                                            <option @if($partner['id'] == $user->partner_id) selected
                                                    @endif value="{{$partner['id']}}">{{$partner['firstname']}} {{$partner['lastname']}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="btn-container">
                                <button type="submit" class="btn update-btn"><span>Update User</span><img
                                        src="{{asset('images/update.svg')}}" class="tab-img"></button>
                            </div>
                        </div>
                    </form>
                    <div class="tab-pane fade card" id="pills-third" role="tabpanel" aria-labelledby="pills-third-tab">
                        <div class="card-body">
                            <div class="d-flex justify-content-center justify-content-md-end">
                                <a href="#" class="Header-buttons--button me-3" data-bs-toggle="modal"
                                   data-bs-target="#attachUnits" title="attach units">
                                    <p class="Header-buttons--button--text">Attach New Units to User</p>
                                    <img src="{{asset('images/plus.svg')}}" class="homeHeader-buttons--button--img">
                                </a>
                                @include('superadmin.modals.attach_units',['user' => $user])
                            </div>
                            <div class="main-info-container user-units">
                                <div class="row main-info-container--header-row">
                                    <p class="number">No</p>
                                    <p class="unit-name">Unit Name</p>
                                    <p class="view-name">View Name</p>
                                    <p class="number">Is Default</p>
                                    <p class="action">Actions</p>
                                </div>

                                @foreach ($user->units as $unit)
                                    <div class=" row main-info-container--row">
                                        <p class="number"><span>{{ $unit->id }}</span></p>
                                        <p class="unit-name">{{ $unit->name }}</p>
                                        <p class="view-name">{{ $unit->acronym }}</p>
                                        <p class="number">@if($unit->pivot->is_default){{$unit->pivot->is_default}}@endif</p>
                                            <form  class="number" action="{{route('users.units.default', ['user' => $user, 'unit' => $unit])}}" method="post">
                                                @csrf
                                                <button
                                                    onclick="return confirm('{{ __('If there is another unit set as default it will be removed and this one will be made Default. Continue?') }}')"
                                                    type="submit" class="btn main-info-container--btn remove"><span>Make Default</span></button>
                                            </form>
                                            <form class="number" action="{{route('users.units.remove',['user' => $user, 'unit'=> $unit])}}"
                                                  method="POST">
                                                @csrf
                                                @method('DELETE')
                                                <button
                                                    onclick="return confirm('{{ __('Are you sure you want to remove?') }}')"
                                                    type="submit" class="btn main-info-container--btn remove"><span>Remove Unit</span><img
                                                        src="{{asset('images/remove.svg')}}" class="tab-img"></button>
                                            </form>

                                    </div>
                                @endforeach
                            </div>
                        </div>
                    </div>


                    <div class="tab-pane fade card" id="pills-fourth" role="tabpanel"
                         aria-labelledby="pills-fourth-tab">
                        <div class="card-body">
                            <div class="d-flex justify-content-end Header-buttons">
                                <a href="{{route('users.roles.attach',['user' => $user])}}"
                                   class="Header-buttons--button me-3">
                                    <p class="Header-buttons--button--text">Attach New Role to User</p>
                                    <img src="{{asset('images/plus.svg')}}" class="homeHeader-buttons--button--img">
                                </a>
                            </div>
                            <div class="main-info-container user-units">
                                <div class="row main-info-container--header-row">
                                    <p class="number">No</p>
                                    <p class="role-name">Role Name</p>
                                    <p class="view-name">View Name</p>
                                    <p class="action">Action</p>
                                </div>
                                @foreach ($roles as $role)
                                    <div class=" row main-info-container--row">
                                        <p class="number"><span>{{ $role->id }}</span></p>
                                        <p class="role-name">{{ $role->name }}</p>
                                        <p class="view-name">{{ $role->view_name }}</p>
                                        <form class="action"
                                              action="{{route('users.roles.remove',['user' => $user, 'role'=> $role])}}"
                                              method="POST">
                                            @csrf
                                            @method('DELETE')
                                            <button
                                                onclick="return confirm('{{ __('Are you sure you want to remove?') }}')"
                                                type="submit" class="btn main-info-container--btn remove"><span>Remove Role</span><img
                                                    src="{{asset('images/remove.svg')}}" class="tab-img"></button>
                                        </form>
                                    </div>
                                @endforeach
                            </div>
                        </div>
                    </div>
                    <form class="tab-pane fade card update-form" id="pills-fifth" role="tabpanel"
                          aria-labelledby="pills-fifth-tab" action="{{route('users.services.add',['user' => $user])}}"
                          method="POST">
                        <div class="card-body">
                            <div class="edit-tab-btn-container">
                                <a class="edit-tab-btn edit-btn"><span>Edit</span><img
                                        src="{{asset('images/edit.svg')}}" class="tab-img"></a>
                                <a class="edit-tab-btn cancel-btn"><span>Cancel</span><img
                                        src="{{asset('images/cancel.svg')}}" class="tab-img"></a>
                            </div>
                            @csrf
                            <div class="main-info-container">
                                <div class="row main-info-container--header-row">
                                    <p class="microservice">Microservice</p>
                                    <div class="user-code-input-container">
                                        <p class="user-code">User Code</p>
                                    </div>
                                </div>
                                @foreach($user->microservices as $microservice)
                                    <div class=" row main-info-container--row">
                                        <p>{{ $microservice->view_name }}</p>
                                        <div class="user-code-input-container">
                                            <input type="number" class="user-code-input disabled"
                                                   value="{{ $microservice->pivot->user_code }}"
                                                   name="{{ $microservice->name . '_' . $microservice->id }}" disabled/>
                                        </div>
                                    </div>
                                @endforeach
                                @foreach($user->microservicesNotBound() as $microservice)
                                    <div class=" row main-info-container--row">
                                        <p>{{ $microservice->view_name }}</p>
                                        <div class="user-code-input-container">
                                            <input type="number" class="user-code-input disabled" value=""
                                                   name="{{ $microservice->name . '_' . $microservice->id }}" disabled/>
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                            <div class="btn-container microservices-update">
                                <button type="submit" class="btn update-btn"><span>Update User</span><img
                                        src="{{asset('images/update.svg')}}" class="tab-img"></button>
                            </div>
                        </div>
                    </form>
                    <form class="tab-pane fade card update-form" id="pills-sixth" role="tabpanel"
                          aria-labelledby="pills-sixth-tab"
                          action="{{route('superadmin.profile.set.keys',['user' => $user])}}" method="POST">
                        <div class="card-body">
                            <div class="edit-tab-btn-container">
                                <a class="edit-tab-btn edit-btn"><span>Edit</span><img
                                        src="{{asset('images/edit.svg')}}" class="tab-img"></a>
                                <a class="edit-tab-btn cancel-btn"><span>Cancel</span><img
                                        src="{{asset('images/cancel.svg')}}" class="tab-img"></a>
                            </div>
                            @csrf
                            <div class="main-info-container">
                                <div class="row main-info-container--header-row">
                                    <p class="microservice">Property</p>
                                    <div class="user-code-input-container">
                                        <p class="user-code">Value</p>
                                    </div>
                                </div>
                                @if(!is_null($user->profile))
                                    @if(!empty($user->profile->data))
                                        @foreach($user->profile->data as $key => $data)
                                            <div class=" row main-info-container--row">
                                                <p>{{ $key }}</p>
                                                <div class="user-code-input-container">
                                                    <input type="text" class="user-code-input disabled" value="{{ $data }}"
                                                           name="{{$key}}" disabled/>
                                                </div>
                                            </div>
                                        @endforeach
                                    @endif
                                @endif
                                    @foreach($user->propertiesNotBound() as $data)
                                        <div class=" row main-info-container--row">
                                            <p>{{$data}}</p>
                                            <div class="user-code-input-container">
                                                <input type="text" class="user-code-input disabled" value=""
                                                       name="{{$data}}" disabled/>
                                            </div>
                                        </div>
                                    @endforeach

                            </div>
                            <div class="btn-container microservices-update">
                                <button type="submit" class="btn update-btn"><span>Update User</span><img
                                        src="{{asset('images/update.svg')}}" class="tab-img"></button>
                            </div>
                        </div>
                    </form>

                    @if($user->work_relation_id === 2)
                    <form class="tab-pane fade card update-form" id="pills-seventh" role="tabpanel"
                          aria-labelledby="pills-seventh-tab"
                          action="{{route('users.update.contract',['user' => $user])}}" method="POST">

                        <div class="card-body">
                            @if($contract_data!= null)
                            <div class="database-info">
                                <p>Database id: {{$contract_data->id}}</p>
                                @if($contract_data->created_at === null)
                                 <p>Created at: -</p>
                                @else
                                <p>Created at: {{ \Carbon\Carbon::parse($contract_data->created_at)->format('d/m/Y') }}</p>
                                @endif
                                <p>Updated at: {{ \Carbon\Carbon::parse($contract_data->updated_at)->format('d/m/Y') }}</p>
                            </div>
                            <div class="edit-tab-btn-container">
                                <a class="edit-tab-btn edit-btn"><span>Edit</span><img
                                        src="{{asset('images/edit.svg')}}" class="tab-img"></a>
                                <a class="edit-tab-btn cancel-btn"><span>Cancel</span><img
                                        src="{{asset('images/cancel.svg')}}" class="tab-img"></a>
                            </div>
                            @else
                            <p class="no-contract-data">Δεν βρέθηκε σύμβαση</p>
                            @endif
                            @csrf
                            <div class="card-body-inner">
                            @if($contract_data!= null)
                                    @foreach($contract_data as $key => $data)
                                    @if($key == 'id' || $key == 'created_at' || $key == 'updated_at') @continue @endif
                                        <div class="form-group">
                                            <label>{{ $key }}</label>
                                            <input type="text" class="form-control name contract-info readonly"
                                                value="{{ $data }}" name="{{$key}}" readonly>
                                        </div>
                                    @endforeach
                            @endif

                            </div>
                            <div class="btn-container microservices-update">
                                <button type="submit" class="btn update-btn"><span>Update User</span><img
                                        src="{{asset('images/update.svg')}}" class="tab-img"></button>
                            </div>
                        </div>
                    </form>
                    @endif
                </div>
            </div>
        </div>
    </div>
@endsection
@section('javascripts')

    <script>

        $q = jQuery.noConflict();
        $q(document).ready(function () {


            $q('.update-btn').hide();

            let editing = false;
            $q(document).on('show.bs.tab', function (e) {
                if (editing) {
                    alert('You have unsaved changes, cancel or save them')
                    e.stopPropagation();
                    e.preventDefault()
                }
            })

            $q('.update-form').each(function () {
                let initialEntries = {};
                let initialCheckboxValues = {};
                const form = $q(this);
                form.find('.edit-btn').on('click', () => {
                    editing = true
                    form.find('.personal-info').removeAttr('readonly');
                    form.find('.contract-info').removeAttr('readonly');
                    form.find('[type=checkbox]').prop('disabled', false);
                    form.find('[type=text]').prop('disabled', false);
                    form.find('[type=url]').prop('disabled', false);
                    form.find('[type=number]').prop('disabled', false);
                    form.find('[type=datetime-local]').prop('disabled', false);
                    form.find('.personal-info-select').prop('disabled', false);
                    form.find('[type=checkbox]').each(function (checkbox) {
                        console.log($q(this).attr('name'));
                        console.log(!!$q(this).attr('checked'));
                        initialCheckboxValues[$q(this).attr('name')] = !!$q(this).attr('checked');
                    });
                    console.log(initialCheckboxValues);
                    var {_token, ...entries} = Object.fromEntries(new FormData(form[0]));
                    initialEntries = entries;
                    console.log(initialEntries);
                    form.find('.edit-btn').hide();
                    form.find('.cancel-btn').css('display', 'flex');
                    form.find('.update-btn').show();
                });

                form.find('.cancel-btn').on('click', () => {
                    editing = false
                    // console.log(Object.entries(initialEntries));
                    Object.entries(initialEntries).map((entry) => {
                        $q(`[name=${entry[0]}]`).val(entry[1]);
                        console.log($q(`[name=${entry[0]}]`));
                        console.log(entry);
                    });

                    Object.entries(initialCheckboxValues).map((entry) => {
                        if (entry[1]) {
                            $q(`[name=${entry[0]}]`).prop('checked', true);
                        } else {
                            $q(`[name=${entry[0]}]`).prop('checked', false);
                        }

                        console.log(entry);
                    });
                    form.find('.personal-info').prop('readonly', true);
                    form.find('.contract-info').prop('readonly', true);
                    form.find('.personal-info-select').prop('disabled', true);
                    form.find('[type=checkbox]').prop('disabled', true);
                    form.find('[type=text]').prop('disabled', true);
                    form.find('[type=url]').prop('disabled', true);
                    form.find('[type=number]').prop('disabled', true);
                    form.find('[type=datetime-local]').prop('disabled', true);
                    form.find('.cancel-btn').css('display', 'none');
                    form.find('.edit-btn').show();
                    form.find('.update-btn').hide();
                });

                form.on('submit', (e) => {
                    e.preventDefault();
                    const formData = new FormData(form[0]);
                    const finalData = Object.fromEntries(formData);

                    // form.find("input[type=checkbox]").each(function () {
                    //     console.log($q(this).attr('name'))
                    //     console.log($q(this).attr('checked'))
                    //     console.log($q(this).val())
                    //     finalData[$q(this).attr('name')] = $q(this).attr('checked') ? 1 : 0;
                    //
                    // });

                    $q.ajax({
                        method: "POST",
                        url: form.attr('action'),
                        data: finalData
                    }).done(function (response) {
                        console.log(response);
                    }).fail(function (error) {
                        console.log(error);
                        console.log('ERROR');
                        form.find('.personal-info').prop('readonly', true);
                        form.find('.contract-info').prop('readonly', true);
                        form.find('.personal-info-select').prop('disabled', true);
                        form.find('[type=checkbox]').prop('disabled', true);
                        form.find('[type=number]').prop('disabled', true);
                        form.find('[type=text]').prop('disabled', true);
                        form.find('[type=url]').prop('disabled', true);
                        form.find('[type=datetime-local]').prop('disabled', true);
                        form.find('.cancel-btn').css('display', 'none');
                        form.find('.edit-btn').show();
                        form.find('.update-btn').hide();
                    }).always(function () {
                        $q('.personal-info').prop('readonly', true);
                        $q('.contract-info').prop('readonly', true);
                        $q('.personal-info-select').prop('disabled', true);
                        $q('[type=number]').prop('disabled', true);
                        $q('[type=checkbox]').prop('disabled', true);
                        $q('[type=text]').prop('disabled', true);
                        $q('[type=url]').prop('disabled', true);
                        $q('[type=datetime-local]').prop('disabled', true);
                        $q('.update-btn').hide();
                        $q('.cancel-btn').css('display', 'none');
                        $q('.edit-btn').show();
                        editing = false
                    });
                });
            })
        });

    </script>

@endsection