<!doctype html>
<html class="no-js" lang="zxx" xmlns:th="http://www.w3.org/1999/xhtml" xmlns:sec="https://www.thymeleaf.org/thymeleaf-extras-springsecurity5">    <head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>Detalji o oglasu </title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="manifest" href="site.webmanifest">
    <link rel="shortcut icon" type="image/x-icon" href="assets/img/favicon.ico">
    <link rel="stylesheet" type="text/css" href="assets/css/comments.css">

    <!-- CSS here -->
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/owl.carousel.min.css">
    <link rel="stylesheet" href="assets/css/flaticon.css">
    <link rel="stylesheet" href="assets/css/slicknav.css">
    <link rel="stylesheet" href="assets/css/price_rangs.css">
    <link rel="stylesheet" href="assets/css/animate.min.css">
    <link rel="stylesheet" href="assets/css/magnific-popup.css">
    <link rel="stylesheet" href="assets/css/fontawesome-all.min.css">
    <link rel="stylesheet" href="assets/css/themify-icons.css">
    <link rel="stylesheet" href="assets/css/slick.css">
    <link rel="stylesheet" href="assets/css/nice-select.css">
    <link rel="stylesheet" href="assets/css/style.css">
</head>

<body>
<!-- Preloader Start -->
<div id="preloader-active">
    <div class="preloader d-flex align-items-center justify-content-center">
        <div class="preloader-inner position-relative">
            <div class="preloader-circle"></div>
            <div class="preloader-img pere-text">
                <img src="assets/img/logo/imi-logo.png" alt="">
            </div>
        </div>
    </div>
</div>
<!-- Preloader Start -->
<header>
    <!-- Header Start -->
    <div class="header-area header-transparrent">
        <div class="headder-top header-sticky">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-3 col-md-2">
                        <!-- Logo -->
                        <div class="logo">
                            <a th:href="@{/}"><img src="assets/img/logo/imi-logo.png" alt=""></a>
                        </div>
                    </div>
                    <div class="col-lg-9 col-md-9">
                        <div class="menu-wrapper">
                            <!-- Main-menu -->
                            <div class="main-menu">
                                <nav class="d-none d-lg-block">
                                    <ul id="navigation">
                                        <li><a th:href="@{/}">Pocetna</a></li>
                                        <li><a th:href="@{/lista_poslova}">Pronadji Poslove </a></li>
                                        <li><a th:href="@{/lista_poslodavaca}">Poslodavci</a></li>
                                        <li sec:authorize="isAuthenticated()" ><b > <a href="#" sec:authentication="name"></a></b>
                                            <ul class="submenu">
                                                <li><a  sec:authorize="hasRole('ADMIN')" th:href="@{/admin_stranica}">Admin stranica</a></li>
                                                <li><a sec:authorize="hasAnyRole('NEZAPOSLENI','ADMIN')"  th:href="@{/moje_prijave}">Moje prijave</a></li>
                                                <li><a sec:authorize="hasAnyRole('POSLODAVAC','ADMIN')"  th:href="@{/moji_oglasi}">Moji oglasi</a></li>
                                                <li><a sec:authorize="hasAnyRole('POSLODAVAC','ADMIN')"  th:href="@{/postavi_oglas}">Postavi oglas</a></li>
                                                <li><a sec:authorize="hasAnyRole('POSLODAVAC','ADMIN','NEZAPOSLENI')"  th:href="@{/izmena_podataka}">Izmeni podatke</a></li>
                                            </ul>
                                        </li>
                                    </ul>
                                </nav>
                            </div>
                            <div class="header-btn d-none f-right d-lg-block">
                                <div sec:authorize="isAnonymous()" class="header-btn d-none f-right d-lg-block">
                                    <a th:href="@{/registracija}" class="btn head-btn1">Registracija</a>
                                    <a th:href="@{/login}" class="btn head-btn2">Prijava</a>
                                </div>
                                <div sec:authorize="isAuthenticated()">
                                    <form th:action="@{/logout}" method="post">
                                        <input type="submit" value="Izloguj Se" class="btn head-btn1"/>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Mobile Menu -->
                    <div class="col-12">
                        <div class="mobile_menu d-block d-lg-none"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Header End -->
</header>
    <main>

        <!-- Hero Area Start-->
        <div class="slider-area ">
        <div class="single-slider section-overly slider-height2 d-flex align-items-center" data-background="assets/img/hero/about.jpg">
            <div class="container">
                <div class="row">
                    <div class="col-xl-12">
                        <div class="hero-cap text-center">
                            <h2>Vise o oglasu</h2>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        </div>
        <!-- Hero Area End -->
        <!-- job post company Start -->
        <div class="job-post-company pt-120 pb-120">
            <div class="container">
                <div class="row justify-content-between">
                    <!-- Left Content -->
                    <div class="col-xl-7 col-lg-8">
                        <span style="color:gray;" th:text="${oglas.brojPregleda+1}"></span><span style="color:gray;"> pregleda</span>
                        <h4 th:text="${oglas.naslov}"></h4>
                        <div class="job-post-details">
                            <div class="post-details1 mb-50">
                                <!-- Small Section Tittle -->
                                <div class="small-section-tittle">
                                    <h4>Opis posla</h4>
                                </div>
                                <p th:text="${oglas.opis}"></p>
                            </div>
                            <div class="post-details2  mb-50">
                                 <!-- Small Section Tittle -->
                                <div class="small-section-tittle">
                                    <h4>Potrebne vestine</h4>
                                </div>
                               <ul>
                                   <th:block  th:each="vestina :${listaVestina}">
                                       <li th:text="${vestina.naziv}"></li>
                                   </th:block>
                               </ul>
                            </div>
                            <!-- job single -->
                            <h4>O poslodavcu</h4>
                            <div class="single-job-items mb-50">
                                <div class="job-items">
                                    <div class="company-img company-img-details">
                                        <a href="#"><img th:src="@{'data:image/jpeg;base64,'+${poslodavac.encodedPic}}" alt="slika korisnika"></a>
                                    </div>
                                    <div class="job-tittle">
                                        <a th:href="@{/poslodavac_profil(id=${poslodavac.idKorisnika})}">
                                            <h4>
                                                <th:block th:text="${poslodavac.ime}"></th:block>
                                                <span>&nbsp</span>
                                                <th:block th:text="${poslodavac.prezime}"></th:block>
                                            </h4>
                                        </a>
                                        <div class="small-section-tittle"><b><span th:text="${poslodavac.ocena}"></span><span>/5.0 </span></b><img style="height:20px" src="assets/img/elements/star.ico" alt="stars"></div>
                                        <ul>
                                            <li th:text="${poslodavac.username}"></li>
                                            <li th:text="${poslodavac.email}"></li>
                                            <li th:text="${poslodavac.telefon}"></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Right Content -->
                    <div class="col-xl-4 col-lg-4">
                        <div class="post-details3  mb-50">
                            <!-- Small Section Tittle -->
                           <div class="small-section-tittle">
                               <h4>Ukratko o poslu</h4>
                           </div>
                          <ul>
                              <li>Lokacija : <span th:text="${lokacija.naziv}"></span></li>
                              <li>Pozicija : <span th:text="${oglas.pozicija}"></span></li>
                              <li>Oblast : <span th:text="${kategorija.naziv}"></span></li>
                              <li>Plata : <span th:if="${oglas.plata}" th:text="${oglas.plata} + ' RSD'"></span></li>
                              <li>Moguc rad od kuce :  <span th:text="${oglas.radOdKuce}? 'da':'ne'"></span></li>
                          </ul>
                         <div class="apply-btn2">
                             <form id="prijava-na-oglas-form" sec:authorize="hasAnyRole('ADMIN','NEZAPOSLENI')" th:action="@{/proces_prijava}" method="post" th:object="${prijava}">
                                 <button type="submit" id="dugme-prijava-na-oglas" class="btn" value="Prijava">Prijava</button>
                                 <button type="submit" th:formaction="@{/lajk_proces}" style="float:right;padding:0px;" class="btn"><img style="height:50px" src="assets/img/elements/lajk.webp" alt="lajk dugme"></button>
                                 <div  style="display:none" class="form-group row">
                                     <label class="col-form-label col-4" hidden></label>
                                     <div class="hidden">
                                         <select class="form-control" aria-label=".form-select-lg example" th:field="*{idKorisnika}" required hidden>
                                             <option th:value="${#request.userPrincipal.principal.korisnikId}">[[${#request.userPrincipal.principal.korisnikId}]]</option>
                                         </select>
                                     </div>
                                     <div style="visibility:hidden" class="form-group row">
                                         <label class="col-form-label col-4" hidden></label>
                                         <div class="hidden">
                                             <select class="form-control" aria-label=".form-select-lg example" th:field="*{idOglasa}" required hidden>
                                                 <option th:value="${oglas.idOglasa}">[[${oglas.idOglasa}]]</option>
                                             </select>
                                         </div>
                                     </div>
                                 </div>
                             </form>
                             <form sec:authorize="hasRole('POSLODAVAC')" th:action="@{/lajk_proces}" method="post" th:object="${prijava}">
                                 <button disabled class="btn" type="submit" value="Prijava">Prijava</button>
                                 <button type="submit" style="float:right;padding:0px;" class="btn"><img style="height:50px" src="assets/img/elements/lajk.webp" alt="lajk dugme"></button>
                                 <div  style="display:none" class="form-group row">
                                     <label class="col-form-label col-4" hidden></label>
                                     <div class="hidden">
                                         <select class="form-control" aria-label=".form-select-lg example" th:field="*{idKorisnika}" required hidden>
                                             <option th:value="${#request.userPrincipal.principal.korisnikId}">[[${#request.userPrincipal.principal.korisnikId}]]</option>
                                         </select>
                                     </div>
                                     <div style="visibility:hidden" class="form-group row">
                                         <label class="col-form-label col-4" hidden></label>
                                         <div class="hidden">
                                             <select class="form-control" aria-label=".form-select-lg example" th:field="*{idOglasa}" required hidden>
                                                 <option th:value="${oglas.idOglasa}">[[${oglas.idOglasa}]]</option>
                                             </select>
                                         </div>
                                     </div>
                                 </div>
                             </form>
                             <form sec:authorize="isAnonymous()" action="" method="post">
                                 <input disabled class="btn" type="submit" value="Prijava">
                                 <button disabled type="submit"  style="float:right;padding:0px;" class="btn"><img style="height:50px" src="assets/img/elements/lajk.webp" alt="lajk dugme"></button>
                             </form>
                         </div>
                          <div style="color:gray;text-align:right;" > <span th:text="${oglas.brojLajkova}"></span><span> lajkova</span></div>
                            <div style="width:100%;padding:5px;background-color:Pink;" th:if="${message}"><th:block th:text="${message}"></th:block></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- job post company End -->
        <div  class="container">
                    <div class="comment-wrapper">
                        <div class="panel panel-info">
                            <div class="panel-heading">
                                <span th:text="${oglas.brojKomentara}"></span>
                                <span> komentara</span>
                            </div>
                            <div class="panel-body">
                                <form sec:authorize="isAuthenticated()" th:action="@{/proces_postavi_komentar}" method="post">
                                    <input style="display:none;" type="text" th:value="${oglas.idOglasa}" name="idOglasa">
                                    <textarea name="tekstKomentara" class="form-control" placeholder="Objavite komentar, postavite pitanje..." rows="3"></textarea>
                                    <br>
                                    <button type="submit" class="btn btn-info pull-right">Post</button>
                                </form>
                                <form sec:authorize="isAnonymous()" action="" method="post">
                                    <input style="display:none;" type="text" th:value="${oglas.idOglasa}" name="idOglasa">
                                    <textarea disabled name="tekstKomentara" class="form-control" placeholder="Morate biti prijavljeni da bi ostavili komentar" rows="3"></textarea>
                                    <br>
                                    <button disabled type="submit" class="btn btn-info pull-right">Post</button>
                                </form>
                                <hr>
                                <ul class="media-list">
                                    <th:block th:each="komentar:${oglas.komentari}">
                                        <li  class="media">
                                            <a  style="padding-right:10px;" href="#" class="pull-left">
                                                <img th:src="@{'data:image/jpeg;base64,'+${komentar.korisnik.encodedPic}}" alt="slika korisnika" class="img-circle">
                                            </a>
                                            <div class="media-body">
                                                <strong class="text-success" th:text="${komentar.korisnik.username}"></strong>
                                                <p>
                                                    <th:block th:text="${komentar.tekstKomentara}"></th:block>
                                                </p>
                                            </div>
                                        </li>
                                    </th:block>
                                </ul>

                            </div>
                        </div>
                    </div>
        </div>
    </main>
    <footer>
        <!-- Footer Start-->
        <div class="footer-area footer-bg footer-padding">
            <div class="container">
                <div class="row d-flex justify-content-between">
                    <div class="col-xl-3 col-lg-3 col-md-4 col-sm-6">
                        <div class="single-footer-caption mb-50">
                            <div class="single-footer-caption mb-30">
                                <div class="footer-tittle">
                                    <h4>O nama</h4>
                                    <div class="footer-pera">
                                        <p>Oglasi imi je sajt na kojem mozete da nadjete veliki broj razlitih poslova</p>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-3 col-md-4 col-sm-5">
                        <div class="single-footer-caption mb-50">
                            <div class="footer-tittle">
                                <h4>Kontakt</h4>
                                <ul>
                                    <li>
                                        <p>Address : Petra Petrovica 1</p>
                                    </li>

                                    <li><a href="#">Phone : +8880 44338899</a></li>
                                    <li><a href="#">Email : info@imijobs.com</a></li>
                                </ul>
                            </div>

                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-3 col-md-4 col-sm-5">
                        <div class="single-footer-caption mb-50">
                            <div class="footer-tittle">
                                <h4>Bitni Linkovi</h4>
                                <ul>
                                    <li><a href="#">Vidi Projekte</a></li>
                                    <li><a href="#">Kontakt</a></li>
                                    <li><a href="#">Podrska</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-3 col-md-4 col-sm-5">
                        <div class="single-footer-caption mb-50">
                            <div class="footer-tittle">
                                <h4>Posta</h4>
                                <div class="footer-pera footer-pera2">
                                    <p>Pretplati se da bi dobijao informaciju od nas kada se ukaze prilika za novi posao.</p>
                                </div>
                                <!-- Form -->
                                <div class="footer-form" >
                                    <div id="mc_embed_signup">
                                        <form target="_blank" action="https://spondonit.us12.list-manage.com/subscribe/post?u=1462626880ade1ac87bd9c93a&amp;id=92a4423d01"
                                              method="get" class="subscribe_form relative mail_part">
                                            <input type="email" name="email" id="newsletter-form-email" placeholder="Email Address"
                                                   class="placeholder hide-on-focus" onfocus="this.placeholder = ''"
                                                   onblur="this.placeholder = ' Email Address '">
                                            <div class="form-icon">
                                                <button type="submit" name="submit" id="newsletter-submit"
                                                        class="email_icon newsletter-submit button-contactForm"><img src="assets/img/icon/form.png" alt=""></button>
                                            </div>
                                            <div class="mt-10 info"></div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!--  -->
                <div class="row footer-wejed justify-content-between">
                    <div class="col-xl-3 col-lg-3 col-md-4 col-sm-6">
                        <!-- logo -->
                        <div class="footer-logo mb-20">
                            <a href="#"><img src="assets/img/logo/imi-logo-white.png" alt=""></a>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-3 col-md-4 col-sm-5">
                        <div class="footer-tittle-bottom">
                            <span>5000+</span>
                            <p>Raznih poslova</p>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-3 col-md-4 col-sm-5">
                        <div class="footer-tittle-bottom">
                            <span>200+</span>
                            <p>Poslodavaca</p>
                        </div>
                    </div>
                    <div class="col-xl-3 col-lg-3 col-md-4 col-sm-5">
                        <!-- Footer Bottom Tittle -->
                        <div class="footer-tittle-bottom">
                            <span>50+</span>
                            <p>Gradova sirom Srbije</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- footer-bottom area -->
        <div class="footer-bottom-area footer-bg">
            <div class="container">
                <div class="footer-border">
                    <div class="row d-flex justify-content-between align-items-center">
                        <div class="col-xl-10 col-lg-10 ">
                            <div class="footer-copy-right">
                                <p><!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
                                    Copyright &copy;<script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="fa fa-heart" aria-hidden="true"></i>
                                    <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. --></p>
                            </div>
                        </div>
                        <div class="col-xl-2 col-lg-2">
                            <div class="footer-social f-right">
                                <a href="#"><i class="fab fa-facebook-f"></i></a>
                                <a href="#"><i class="fab fa-twitter"></i></a>
                                <a href="#"><i class="fas fa-globe"></i></a>
                                <a href="#"><i class="fab fa-behance"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Footer End-->
    </footer>

	<!-- JS here -->
	
		<!-- All JS Custom Plugins Link Here here -->
        <script src="./assets/js/vendor/modernizr-3.5.0.min.js"></script>
		<!-- Jquery, Popper, Bootstrap -->
		<script src="./assets/js/vendor/jquery-1.12.4.min.js"></script>
        <script src="./assets/js/popper.min.js"></script>
        <script src="./assets/js/bootstrap.min.js"></script>
	    <!-- Jquery Mobile Menu -->
        <script src="./assets/js/jquery.slicknav.min.js"></script>

		<!-- Jquery Slick , Owl-Carousel Plugins -->
        <script src="./assets/js/owl.carousel.min.js"></script>
        <script src="./assets/js/slick.min.js"></script>
        <script src="./assets/js/price_rangs.js"></script>
        
		<!-- One Page, Animated-HeadLin -->
        <script src="./assets/js/wow.min.js"></script>
		<script src="./assets/js/animated.headline.js"></script>
        <script src="./assets/js/jquery.magnific-popup.js"></script>

		<!-- Scrollup, nice-select, sticky -->
        <script src="./assets/js/jquery.scrollUp.min.js"></script>
        <script src="./assets/js/jquery.nice-select.min.js"></script>
		<script src="./assets/js/jquery.sticky.js"></script>
        
        <!-- contact js -->
        <script src="./assets/js/contact.js"></script>
        <script src="./assets/js/jquery.form.js"></script>
        <script src="./assets/js/jquery.validate.min.js"></script>
        <script src="./assets/js/mail-script.js"></script>
        <script src="./assets/js/jquery.ajaxchimp.min.js"></script>
        
		<!-- Jquery Plugins, main Jquery -->	
        <script src="./assets/js/plugins.js"></script>
        <script src="./assets/js/main.js"></script>
        
    </body>
</html>
