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...