test view
unknown
html
3 years ago
11 kB
5
Indexable
<link rel="stylesheet" href="<?=base_url('assets/css/new_login.css')?>"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <style type="text/css"> body{ font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"!important; } .timer{ font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"!important; } .swal-wide { width:50rem !important; } .comment-section textarea{ width: 50%; height: 100px; margin-bottom: 20px; } /* set all stars to 'empty star' */ .stars-container { display: inline-block; vertical-align: top; } /* set all stars to 'empty star' */ .stars-container .star { float: right; display: inline-block; padding: 2px; color: orange; cursor: pointer; font-size: 28px; } .stars-container .star:before { content:"\f006"; /* fontAwesome empty star code */ } /* set hovered/selected star to 'filled star' */ .star:hover:before, .star.selected:before { content:"\f005"; /* fontAwesome filled star code */ } /* set all stars after hovered/selected to'filled star' ** it will appear that it selects all after due to positioning */ .star:hover ~ .star:before, .star.selected ~ .star:before { content:"\f005"; /* fontAwesome filled star code */ } </style> <div style="position: fixed;width: 100%;z-index: 3;"> <div class="container-fluid"> <div class="row" id="login_header"> <!-- TOP BAR --> <div class="col-md-4 d-none d-md-block"> <span class="navbar-text font-weight-bold d-lg-block timer"> <span id="date" class="text-uppercase"></span> , <span id="time">Loading...</span> <span id="time_ampm"></span> </span> </div> <div class="col-md-4 text-center pb-1"> <img src="https://quezoncity.gov.ph/wp-content/themes/qcproject/images/qclogo_main.png" class="d-md-none img-fluid" width="15%"> </div> <div class="col-md-4 text-right d-none d-md-block"> <span class="navbar-text font-weight-bold text-uppercase d-none"> OPERATION HOURS: <span class="text-success">OPEN</span> 8:00 AM - 5:00 PM </span> </div> <!-- TOP BAR END --> </div> </div> <!-- SECOND BAR --> <header id="header" style="border-bottom: 1px solid #f0f0f0"> <div class="d-flex align-items-center topnav"> <div class="dropdown d-none" style="z-index: 2"> <button class="btn menu-btn " data-toggle="dropdown"> <img src="https://quezoncity.gov.ph/wp-content/themes/qcproject/images/menu.png"> </button> </div> <img src="<?=base_url('assets/images/QC eServices Logo1.png'); ?>" alt="" height="50px" style="margin-left: 10px;margin-top: 5px"> <span style="color: #B9B9B9">BETA VERSION</span> <div class="search-container d-none"> <div class="input-group "> <div class="input-group-prepend"> <span class="input-group-text text-danger" id="search_btn"><i class='fas fa-search'></i></span> </div> <input type="text" class="form-control" placeholder="Search ..." id="txt_search"> </div> </div> </div> <!-- COMMENT THIS TO REMOVE NOTICE!!! BBP --> <div class="d-flex align-items-center topnav"> <div class="ml-2 navbar-text font-weight-bold d-lg-block"> We have a daily scheduled maintenance from 2:00 AM - 2:30 AM. </div> </div> <!-- --> </header> <!-- END SECOND BAR --> <!-- CENTERED IMAGE --> <div class="qclogo_main text-center d-none d-md-block"> <img src="https://quezoncity.gov.ph/wp-content/themes/qcproject/images/qclogo_main.png" width="8.5%"> </div> <!-- CLOSE CENTERED IMAGE --> </div> <br> <!-- body --> <div class="container-fluid p-5" id="content" style="background-image: url('<?=base_url()?>assets/images/Pylon Background.png'); background-size: cover; margin-top: 100px;"> <div class="jumbotron mt-2" id="login_container"> <div class="row"> <div class="col-lg-12 text-center d-none d-sm-block"> <form method="POST"> <h1 style="font-weight: bold; font-size: 2rem;">CUSTOMER FEEDBACK FORM </h1> <p>Your feedback is important to us. Let us know how our service helps you in achieving your needs.</p> <p>Service: <strong><?php echo $res->data->service; ?></strong></p> <p>Rate your experience:</p> <span class="stars-container"> <span id="star5" class="fa fa-star-o star"></span> <span id="star4" class="fa fa-star-o star"></span> <span id="star3" class="fa fa-star-o star"></span> <span id="star2" class="fa fa-star-o star"></span> <span id="star1" class="fa fa-star-o star"></span> </span> <input type="hidden" name="rating" id="rating"> <input type="hidden" id="burl" value="<?php echo base_url(); ; ?>"> <input type="hidden" name="feedback_id" id="feedback_id" value="<?php echo @$_GET['ky']; ?>"> <div class="comment-section"> <p>Comments/Suggestions:</p> <textarea name="feedback" id="feedback"></textarea> </div> <input type="button" data-row='0' name="btn_submit" id="btn_submit" value="SUBMIT YOUR FEEDBACK" class="btn btn-default-qc"> </form> </div> </div> </div> </div> <!-- body - end --> <div class="container-fluid" > <div class="row p-5" id="login_footer"> <!-- FOOTER BAR --> <div class="col-md-3 "> <b>Quezon City E-Services</b> <br><br> <!-- <small> Need Help? Send an email at<br> <a href="https://qceservices.quezoncity.gov.ph/" style="color: #ffffff">qceservices.quezoncity.gov.ph</a> </small> --> <small> For any inquiries, please call 122 or email <br> helpdesk@quezoncity.gov.ph </small> </div> <div class="col-md-4 "> <div class="row"> <!-- FILLER --> </div> </div> <div class="col-md-5 text-right"> <br> <a style="cursor: pointer; font-size: 9pt; display: inline-grid;" class="text-white footer_link" data-target="#toc_modal" data-toggle="modal"> <b> TERMS OF SERVICE </b> </a> | <a style="cursor: pointer; font-size: 9pt; display: inline-grid;" class="text-white footer_link" data-target="#dop_modal" data-toggle="modal"> <b> PRIVACY POLICY </b> </a> <a href="https://www.facebook.com/QCGov/" target="_blank"> <i class="fa fa-facebook footer_icon"></i> </a> <a href="https://twitter.com/qcgov?s=11" target="_blank"> <i class="fa fa-twitter footer_icon"></i> </a> </div> <!-- FOOTER BAR END --> </div> </div> <script defer src="<?=base_url('assets/js/login_v2.js');?>"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> <script defer type="text/javascript" src="<?=base_url('assets/js/browser_checker.js')?>"></script> <script> $( document ).ready(function() { $(window).resize(function() { $('#content').css("margin-top", $("header").height()); }).resize(); }); $(document).on('click', 'input#btn_submit',function(){ let base_url = $('#burl').val() + "index.php/feedback/submit_applicant_feedback"; let data = { rating : $('#rating').val(), feedback : $('#feedback').val(), feedback_id : $('#feedback_id').val(), } if($('#rating').val() == ''){ Swal.fire({ title : "<h5 style='color:red'>REQUIRED FIELD</h5>", html : 'You must set your feedback rating.', button: 'OK', icon : "error", allowOutsideClick: false }); }else{ $.ajax({ type: "POST", enctype: 'multipart/form-data', url: base_url, data: data, success: function(res){ var response = JSON.parse(res); // console.log(response); // Swal.fire({ // html : response.meta.message, // icon : "success", // button: 'Ok' // }); if(response.meta.code == 'ok'){ Swal.fire({ html : response.meta.message, button: 'OK', icon : "success", allowOutsideClick: false }).then(function(){ location.reload(); } ); }else if(response.meta.code == 'already_submitted'){ Swal.fire({ html : response.meta.message, button: 'OK', icon : "error", allowOutsideClick: false }); }else if(response.meta.code == 'link_expired'){ Swal.fire({ title : "<h5 style='color:red; font-weight: 700;'>LINK EXPIRED</h5>", html : response.meta.message, button: 'OK', icon : "error", allowOutsideClick: false }); }else if(response.meta.code == 'not_found'){ Swal.fire({ title : "<h5 style='color:red'>INVALID LINK</h5>", html : response.meta.message, button: 'OK', icon : "error", allowOutsideClick: false }); } } }); } }); </script> <script type="text/javascript"> /* Prototype code for Rating System */ // basic click event sets selected class $('.star').on('click', function () { resetStars(); //add select class $(this).addClass('selected'); if($('#star5').hasClass('selected')){ $('input[name="rating"]').val(5) }else if($('#star4').hasClass('selected')){ $('input[name="rating"]').val(4) }else if($('#star3').hasClass('selected')){ $('input[name="rating"]').val(3) }else if($('#star2').hasClass('selected')){ $('input[name="rating"]').val(2) }else if($('#star1').hasClass('selected')){ $('input[name="rating"]').val(1) } }); function resetStars() { //resets stars by removing selected class $('.star').removeClass('selected'); } </script>
Editor is loading...