@extends('layouts.main')

@once
    @push('stylesheets')
        {{--        <link rel="stylesheet" href="{{asset('css/edit-user.css')}}"/>--}}
    @endpush
@endonce





@section('content')
    <div blade="{{ $viewName ?? 'unknown' }}">
    <div>
        <form action="{{route('management-activation.automated-activation-request.update',['id' => $activation_request->id])}}" data-tab="personal"
              class="personal-info-form" method="POST" id="update-personal-form">
            @csrf

            <div class="mb-5">
                <x-page-header>
                    INFO
                </x-page-header>
                <div class="row g-4">

                    <div class="col-6">
                        <x-ui.input-field
                            label="ΑΦΜ"
                            name="afm"
                            value="{{$activation_request->afm}}"
                        >
                        </x-ui.input-field>
                    </div>


                </div>
            </div>

            <div class="mb-5">
                <x-page-header>
                    PERSONAL
                </x-page-header>
                <div class="row g-4">

                    <div class="col-6">
                        <x-ui.input-field
                            label="EMAIL"
                            name="personal_email"
                            value="{{$activation_request->personal_email}}"
                        >
                        </x-ui.input-field>
                    </div>

                    <div class="col-6">
                        <x-ui.input-field
                            label="USERNAME"
                            name="username"
                            value="{{$activation_request->username}}"
                        >
                        </x-ui.input-field>
                    </div>

                    <div class="col-6">
                        <x-ui.input-field
                            label="ΟΝΟΜΑ"
                            name="firstname_el"
                            value="{{$activation_request->firstname_el}}"
                        >
                        </x-ui.input-field>
                    </div>

                    <div class="col-6">
                        <x-ui.input-field
                            label="ΕΠΙΘΕΤΟ"
                            name="lastname_el"
                            value="{{$activation_request->lastname_el}}"
                        >
                        </x-ui.input-field>
                    </div>


                    <div class="col-6">
                        <x-ui.input-field
                            label="NAME"
                            name="firstname_en"
                            value="{{$activation_request->firstname_en}}"
                        >
                        </x-ui.input-field>
                    </div>


                    <div class="col-6">
                        <x-ui.input-field
                            label="SURNAME"
                            name="lastname_en"
                            value="{{$activation_request->lastname_en}}"
                        >
                        </x-ui.input-field>
                    </div>



                    <div class="col-6">
                        <x-ui.select
                            label="UNIT"
                            name="unit"
                            :selected="$activation_request->unit"
                            :options="$units"
                            propertyAsValue="view_name"
                        >
                        </x-ui.select>
                    </div>

                    <div class="col-6">
                        <x-ui.select
                            label="GROUP"
                            name="research_group"
                            :clearable='true'
                            :selected="$activation_request->research_group"
                            :options="$groups"
                            propertyAsValue="view_name"
                        >
                        </x-ui.select>
                    </div>

                    <div class="col-6">
                        <x-ui.select
                            label="DEPARTMENT"
                            name="department"
                            :clearable='true'
                            :selected="$activation_request->department"
                            :options="$departments"
                            propertyAsValue="view_name"
                        >
                        </x-ui.select>
                    </div>


                    <div class="col-6">
                        <x-ui.select
                            label="WORK RELATION"
                            name="work_relation"
                            :clearable='true'
                            :selected="$activation_request->work_relation"
                            :options="$work_relations"
                            propertyAsValue="view_name"
                        >
                        </x-ui.select>
                    </div>


                    <div class="col-6">
                        <x-ui.select
                            label="COLLABORATION TYPE"
                            name="collaboration_type"
                            :clearable='true'
                            :selected="$activation_request->collaboration_type"
                            :options="$collaboration_types"
                            propertyAsValue="view_name"
                        >
                        </x-ui.select>
                    </div>


                    <div class="col-6">
                        <x-ui.select
                            label="SCIENTIFIC SUPERVISOR"
                            name="scientific_supervisor"
                            :clearable='true'
                            :selected="$activation_request->scientific_supervisor"
                            :options="$users"
                            propertyAsValue="view_name"
                        >
                        </x-ui.select>
                    </div>

                    <div class="col-6">
                        <x-ui.select
                            label="PARTNER"
                            name="partner"
                            :clearable='true'
                            :selected="$activation_request->partner"
                            :options="$users"
                            propertyAsValue="view_name"
                        >
                        </x-ui.select>
                    </div>


                </div>
            </div>

            <div class="mb-5">
                <x-page-header>
                    REQUEST
                </x-page-header>
                <div class="row g-4">

                    <div class="col-6">

                        <x-ui.select
                            label="ΤΥΠΟΣ"
                            name="type"
                            :selected="$activation_request->type->name"
                            :options="$types"
                            propertyAsValue="name"
                        >
                        </x-ui.select>
                    </div>


                    <div class="col-6">

                        <x-ui.select
                            label="ΚΑΤΑΣΤΑΣΗ"
                            name="status"
                            :selected="$activation_request->status->name"
                            :options="$statuses"
                            propertyAsValue="name"
                        >
                        </x-ui.select>
                    </div>

                </div>

            </div>

            <div class="mb-5">
                <x-page-header>
                    OTHER
                </x-page-header>
                <div class="row g-4">

                    <div class="col-6">
                        <x-ui.input-field
                            label="ΓΡΑΦΕΙΟ"
                            name="office"
                            value="{{$activation_request->office}}"
                        >
                        </x-ui.input-field>
                    </div>

                    <div class="col-6">
                        <x-ui.input-field
                            label="ΤΗΛ ΓΡΑΦΕΙΟΥ"
                            name="office_phone"
                            value="{{$activation_request->office_phone}}"
                        >
                        </x-ui.input-field>
                    </div>

                    <div class="col-6">
                        <x-ui.input-field
                            label="ΚΙΝΗΤΟ ΤΗΛΕΦΩΝΟ"
                            name="mobile_phone"
                            value="{{$activation_request->mobile_phone}}"
                        >
                        </x-ui.input-field>
                    </div>


                </div>
            </div>


            <x-unsaved-changes form="update-personal-form"/>
        </form>


    </div>

    </div>
@endsection

{{--@section('javascripts')--}}
{{--    <script>--}}
{{--        $q = jQuery.noConflict();--}}
{{--        $q(document).ready(function () {--}}

{{--            const copyUrlImages = document.querySelectorAll('.copy-url');--}}
{{--            const ldapForm = $q('#ldap-form');--}}
{{--            const form = $q('.update-form');--}}


{{--            $q('input[type=text]').on('input,change', function () {--}}

{{--                const greekPattern = /^(?:[Α-Ω-ΪΫ]*)?$/;--}}
{{--                const engPattern = /^[A-Z]$/;--}}
{{--                const emailPattern = /^[A-Za-z0-9$%*#!=+_?.@-]$/;--}}
{{--                const numberPattern = /^[0-9]$/;--}}
{{--                const projectTitlePattern = /^[Α-Ωα-ωίϊΐόάέύϋΰήώΊΪΌΆΈΎΫΉΏa-zA-Z0-9\s\(\)\/-]{1,}$/;--}}
{{--                const datePattern = /^[0-9\-]+$/;--}}
{{--                const ldapPattern = /^[A-Za-z0-9$%*#!=+_?.@-]$/;--}}
{{--                // && ldapOldPattern.test(inputValue[i])--}}

{{--                const inputField = $q(this);--}}
{{--                let inputValue = $q(inputField).val();--}}
{{--                let validInput = '';--}}
{{--                for (let i = 0; i < inputValue.length; i++) {--}}

{{--                    if(inputField.hasClass('greek-input')) {--}}
{{--                        if (greekPattern.test(inputValue[i])) {--}}
{{--                            validInput += inputValue[i];--}}
{{--                        }--}}
{{--                    } else if (inputField.hasClass('eng-input')) {--}}
{{--                        if (engPattern.test(inputValue[i])) {--}}
{{--                            validInput += inputValue[i];--}}
{{--                        }--}}
{{--                    } else if (inputField.hasClass('number-input')) {--}}
{{--                        if (numberPattern.test(inputValue[i])) {--}}
{{--                            validInput += inputValue[i];--}}
{{--                        }--}}
{{--                    } else if (inputField.hasClass('project-title-input')) {--}}
{{--                        if (projectTitlePattern.test(inputValue[i])) {--}}
{{--                            validInput += inputValue[i];--}}
{{--                        }--}}
{{--                    } else if (inputField.hasClass('date-input')) {--}}
{{--                        if (datePattern.test(inputValue[i])) {--}}
{{--                            validInput += inputValue[i];--}}
{{--                        }--}}
{{--                    } else if (inputField.hasClass('ldap-input')) {--}}
{{--                        if (ldapPattern.test(inputValue[i])) {--}}
{{--                            validInput += inputValue[i];--}}
{{--                        }--}}
{{--                    }  else {--}}
{{--                        continue;--}}
{{--                    }--}}
{{--                    $q(inputField).val(validInput);--}}
{{--                }--}}

{{--            })--}}
{{--            $q('input[type=email]').on('input', function () {--}}
{{--                const emailPattern = /^[A-Za-z0-9$%&*#!=+_?.@-]$/;--}}
{{--                const inputField= $q(this);--}}
{{--                let inputValue = $q(inputField).val();--}}
{{--                let validInput = '';--}}

{{--                for (let i = 0; i < inputValue.length; i++) {--}}
{{--                    if(inputField.hasClass('email-input')) {--}}
{{--                        if (emailPattern.test(inputValue[i])) {--}}
{{--                            validInput += inputValue[i];--}}
{{--                        }--}}
{{--                    }--}}
{{--                    $q(inputField).val(validInput);--}}
{{--                }--}}
{{--            });--}}
{{--        });--}}
{{--    </script>--}}
{{--@endsection--}}