@extends('layouts.mainlayout')
@section('content')
    <div class="card mb-3">
        <div class="card-header"><i class="fas fa-table"></i>
            <h4 class="">Alma János adatai</h4></div>
        <div class="card-body">
            <div class="row">
                <nav>
                    <div class="nav nav-tabs" id="nav-tab" role="tablist"><a class="nav-item nav-link active"
                                                                             id="nav-home-tab" data-toggle="tab"
                                                                             href="#nav-home" role="tab"
                                                                             aria-controls="nav-home"
                                                                             aria-selected="true">Registered details</a>
                        <a class="nav-item nav-link" id="nav-profile-tab" data-toggle="tab" href="#nav-profile"
                           role="tab" aria-controls="nav-profile" aria-selected="false">Személyes adatok</a> <a
                            class="nav-item nav-link" id="nav-contact-tab" data-toggle="tab" href="#nav-contact"
                            role="tab" aria-controls="nav-contact" aria-selected="false">Munka adatok</a> <a
                            class="nav-item nav-link" id="nav-contact-tab" data-toggle="tab" href="#nav-contact"
                            role="tab" aria-controls="nav-contact" aria-selected="false">Értékelés</a> <a
                            class="nav-item nav-link" id="nav-contact-tab" data-toggle="tab" href="#nav-contact"
                            role="tab" aria-controls="nav-contact" aria-selected="false">Dokumentumok</a> <a
                            class="nav-item nav-link" id="nav-contact-tab" data-toggle="tab" href="#nav-contact"
                            role="tab" aria-controls="nav-contact" aria-selected="false">Megjegyzések</a> <a
                            class="nav-item nav-link" id="nav-contact-tab" data-toggle="tab" href="#nav-contact"
                            role="tab" aria-controls="nav-contact" aria-selected="false">Megjegyzések</a> <a
                            class="nav-item nav-link" id="nav-contact-tab" data-toggle="tab" href="#nav-contact"
                            role="tab" aria-controls="nav-contact" aria-selected="false">Megjegyzések</a></div>
                </nav>
            </div>
            <div class="row">
                <div class="container">
                    <div class="tab-content" id="nav-tabContent">
                        <div class="tab-pane fade show active" id="nav-home" role="tabpanel"
                             aria-labelledby="nav-home-tab">
                            <form class="form-horizontal" role="form">
                                <div class="row">
                                    <div class="container">
                                        @foreach ($ourstaffs as $ourstaff)
                                            <div class="row">
                                                <div class="col-xs-12 col-lg-3">
                                                    <div class="col-sm-12"><img src="zelki_janos.jpg"
                                                                                class="img-fluid img-responsive"
                                                                                alt="Cinque Terre"></div>
                                                </div>
                                                <div class="col-xs-12 col-lg-3">
                                                    <div class="col-sm-12">
                                                        <label for="firstname"
                                                               class="col-sm-12 control-label">First name</label>
                                                        <input type="text" id="firstname" class="form-control col-sm-12"
                                                               placeholder="First name" required="true"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    </div>
                                                    <div class="col-sm-12">
                                                        <label for="lastname"
                                                               class="col-sm-12 control-label">Last name</label>
                                                        <input type="text" id="lastname" class="form-control col-sm-12"
                                                               placeholder="Lastname" required="true"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    </div>
                                                    <div class="col-sm-12">
                                                        <label for="lnev" class="col-sm-12 control-label">Lánykori név (ha
                                                            szükséges)</label>
                                                        <input type="text" id="lnev" class="form-control col-sm-12"
                                                               placeholder="Lánykori név (ha szökséges)"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    </div>
                                                    <div class="col-sm-12">
                                                        <label for="csalapot" class="col-sm-12 control-label">Családi
                                                            állapot</label>
                                                        <select class="form-control col-sm-12" id="csalapot" required="true"
                                                                oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                            <option value=""></option>
                                                            <option value="0">Hajadon</option>
                                                            <option value="1">Házas</option>
                                                            <option value="3">Özvegy</option>
                                                            <option value="4">Elvált</option>
                                                        </select>
                                                    </div>
                                                    <div class="col-sm-12">
                                                        <label for="sex" class="col-sm-12 control-label">Neme (Szex)</label>
                                                        <select class="form-control col-sm-12" id="sex" required="true"
                                                                oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                            <option value=""></option>
                                                            <option value="0">Nő</option>
                                                            <option value="1">Férfi</option>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-lg-3">
                                                    <div class="col-sm-12">
                                                        <label for="szdatum" class="col-sm-12 control-label">Születési
                                                            dátum</label>
                                                        <input type="text" id="szdatum"
                                                               class="form-control col-sm-12 data jquery-datepicker__input"
                                                               required="true"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                        <script>
                                                            $('#szdatum').datepicker({
                                                                uiLibrary: 'bootstrap4',
                                                                format: 'dd-mm-yyyy'
                                                            });
                                                        </script>
                                                    </div>
                                                    <div class="col-sm-12">
                                                        <label for="szorszag" class="col-sm-12 control-label">Születési
                                                            ország</label>
                                                        <input type="text" id="szorszag" class="form-control col-sm-12"
                                                               placeholder="Születési ország" required="true"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    </div>
                                                    <div class="col-sm-12">
                                                        <label for="szmegye" class="col-sm-12 control-label">Születési
                                                            megye</label>
                                                        <input type="text" id="szmegye" class="form-control col-sm-12"
                                                               placeholder="Születési megye" required="true"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    </div>
                                                    <div class="col-sm-12">
                                                        <label for="szhely" class="col-sm-12 control-label">Születési
                                                            hely</label>
                                                        <input type="text" id="szhely" class="form-control col-sm-12"
                                                               placeholder="Születési hely" equired="true"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    </div>
                                                    <div class="col-sm-12">
                                                        <label for="szszam" class="col-sm-12 control-label">Szemelyi szám
                                                            (CNP)</label>
                                                        <input type="number" id="szszam" class="form-control col-sm-12"
                                                               placeholder="Szemelyi szám (CNP)" equired="true"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-lg-3">
                                                    <div class="col-sm-12">
                                                        <label for="lorszag" class="col-sm-12 control-label">Lakhely
                                                            ország</label>
                                                        <input type="text" id="lorszag" class="form-control col-sm-12"
                                                               placeholder="Lakhely ország" required="true"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    </div>
                                                    <div class="col-sm-12">
                                                        <label for="lmegye" class="col-sm-12 control-label">Lakhely
                                                            megye</label>
                                                        <input type="text" id="lmegye" class="form-control col-sm-12"
                                                               placeholder="Lakhely megye" required="true"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    </div>
                                                    <div class="col-sm-12">
                                                        <label for="lhely"
                                                               class="col-sm-12 control-label">Lakhely/Város</label>
                                                        <input type="text" id="lhely" class="form-control col-sm-12"
                                                               placeholder="Lakhely/Város" equired="true"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    </div>
                                                    <div class="col-sm-12">
                                                        <label for="lcim" class="col-sm-12 control-label">Cim (utca,
                                                            házszám)</label>
                                                        <input type="text" id="lcim" class="form-control col-sm-12"
                                                               placeholder="Cim (utca, házszám)" equired="true"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    </div>
                                                    <div class="col-sm-12">
                                                        <label for="lzip"
                                                               class="col-sm-12 control-label">Irányítószám/Zip</label>
                                                        <input type="text" id="lzip" class="form-control col-sm-12"
                                                               placeholder="Irányítószám/Zip" equired="true"
                                                               oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    </div>
                                                </div>
                                            </div>
                                        @endforeach
                                        <hr>
                                        <div class="row">
                                            <div class="col-xs-12 col-lg-3">
                                                <div class="col-sm-12">
                                                    <label for="email" class="col-sm-12 control-label">E-mail</label>
                                                    <input type="email" id="email" class="form-control col-sm-12"
                                                           placeholder="E-mail" required="true"
                                                           oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                </div>
                                                <div class="col-sm-12">
                                                    <label for="telefon" class="col-sm-12 control-label">Telefon</label>
                                                    <input type="text" id="telefon" class="form-control col-sm-12"
                                                           placeholder="Telefon" required="true"
                                                           oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                </div>
                                                <div class="col-sm-12">
                                                    <label for="mobil" class="col-sm-12 control-label">Mobil</label>
                                                    <input type="text" id="mobil" class="form-control col-sm-12"
                                                           placeholder="Mobil" required="true"
                                                           oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                </div>
                                            </div>
                                            <div class="col-xs-12 col-lg-3">
                                                <div class="col-sm-12">
                                                    <label for="allampolgarsag" class="col-sm-12 control-label">Állampolgárság</label>
                                                    <input type="text" id="allampolgarsag"
                                                           class="form-control col-sm-12" placeholder="Állampolgárság"
                                                           required="true"
                                                           oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                </div>
                                                <div class="col-sm-12">
                                                    <label for="nemzetiseg"
                                                           class="col-sm-12 control-label">Nemztiség</label>
                                                    <input type="text" id="nemzetiseg" class="form-control col-sm-12"
                                                           placeholder="Nemzetiség" required="true"
                                                           oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                </div>
                                                <div class="col-sm-12">
                                                    <label for="anyanyelv"
                                                           class="col-sm-12 control-label">Anyanyelv</label>
                                                    <input type="text" id="anyanyelv" class="form-control col-sm-12"
                                                           placeholder="Anyanyelv" required="true"
                                                           oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                </div>
                                            </div>
                                            <div class="col-xs-12 col-lg-3">
                                                <div class="col-sm-12">
                                                    <label for="icszam" class="col-sm-12 control-label">IC szám
                                                        (szemelyazonossági szám)</label>
                                                    <input type="text" id="icszam" class="form-control col-sm-12"
                                                           placeholder="IC szám (szemelyazonossági szám)"
                                                           required="true"
                                                           oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                </div>
                                                <div class="col-sm-12">
                                                    <label for="iclejar" class="col-sm-12 control-label">IC lejárása
                                                        (szemelyazonossági lejárása)</label>
                                                    <input type="text" id="iclejar"
                                                           class="form-control col-sm-12 data jquery-datepicker__input"
                                                           required="true"
                                                           oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')"
                                                           oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                    <script>
                                                        $('#iclejar').datepicker({
                                                            uiLibrary: 'bootstrap4',
                                                            format: 'dd-mm-yyyy'
                                                        });
                                                    </script>
                                                </div>
                                                <div class="col-sm-12">
                                                    <label for="hkeresztnev" class="col-sm-12 control-label">Hozzátartozó
                                                        Keresztnév</label>
                                                    <input type="text" id="hkeresztnev" class="form-control col-sm-12"
                                                           placeholder="Hozzátartozó Keresztnév" required="true"
                                                           oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                </div>
                                            </div>
                                            <div class="col-xs-12 col-lg-3">
                                                <div class="col-sm-12">
                                                    <label for="hvezeteknev" class="col-sm-12 control-label">Hozzátartozó
                                                        vezetéknév</label>
                                                    <input type="text" id="hvezeteknev" class="form-control col-sm-12"
                                                           placeholder="Keresztnév" required="true"
                                                           oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                </div>
                                                <div class="col-sm-12">
                                                    <label for="htel" class="col-sm-12 control-label">Hozzátartozó
                                                        telefonszam</label>
                                                    <input type="text" id="htel" class="form-control col-sm-12"
                                                           placeholder="Hozzátartozó telefonszam" required="true"
                                                           oninvalid="this.setCustomValidity('Incorrect Format / Empty Field')">
                                                </div>
                                                <div class="col-sm-12">
                                                    <label for="keresztnev" class="col-sm-12 control-label">Fénykép
                                                        feltöltése</label>
                                                    <input type="file" class="form-control-file"
                                                           id="exampleFormControlFile1"></div>
                                            </div>
                                        </div>
                                        <div class="row margin-10px">
                                            <div class="container">
                                                <button type="submit" class="btn btn-primary btn-block">Mentés</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab">
                            ...
                        </div>
                        <div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">
                            ...
                        </div>
                        <div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">
                            ...
                        </div>
                        <div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">
                            ...
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>
    </div>
    </div>
    <a class="scroll-to-top rounded" href="#page-top"> <i class="fas fa-angle-up"></i></a>
    <div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
         aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Ready to Leave?</h5>
                    <button class="close" type="button" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">×</span></button>
                </div>
                <div class="modal-body">Select "Logout" below if you are ready to end your current session.</div>
                <div class="modal-footer">
                    <button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
                    <a class="btn btn-primary" href="login.html">Logout</a></div>
            </div>
        </div>
    </div>
    <script src="/vendor/jquery/jquery.min.js"></script>
@endsection