PK
<?php
ob_start();
//error_reporting(E_ALL ^ E_NOTICE);
@session_start();
ini_set('allow_url_include',1);
date_default_timezone_set("Asia/Kolkata");
set_time_limit(600);
ini_set('max_execution_time',600);
include_once '../admin/includes/settings/constant.php';
//include '../includes/settings/db.php';
require_once '../admin/includes/settings/PDODB.php';
include_once '../admin/includes/modules/functions.php';
$function = new FUNCTIONS();
if(empty($_SESSION['userId'])){
header("Location: ../index.php");
exit();
}
//print_r($_SESSION['house_no']); exit();
// Connect to MySQL using the below function
$pdodb = PDODB::getInstance();
$ticketdata = $function->getTickets($id=$_GET['id'], $uid=$_SESSION['userId'], $status=NULL, $orderBy='DESC');
// Check if ticket exists
if (!$ticketdata) {
exit('Invalid ticket ID!');
}
//print_r($comments); exit;
//$comments = $stmt->fetchAll();
//$comments = $stmt->fetchAll(PDO::FETCH_ASSOC);
PDODB::closeInstance();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>RWA Sectore 40 Noida</title>
<!-- Bootstrap core CSS -->
<link href="../vendor/bootstrap/css/bootstrap.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="../css/noida40.css" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link href="../css/bootstrap-dropdownhover.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" rel="stylesheet">
<style type="text/css">
* {
box-sizing: border-box;
font-family: -apple-system, BlinkMacSystemFont, "segoe ui", roboto, oxygen, ubuntu, cantarell, "fira sans", "droid sans", "helvetica neue", Arial, sans-serif;
font-size: 16px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body {
background-color: #FFFFFF;
margin: 0;
}
.navtop {
background-color: #3f69a8;
height: 60px;
width: 100%;
border: 0;
}
.navtop div {
display: flex;
margin: 0 auto;
width: 1000px;
height: 100%;
}
.navtop div h1, .navtop div a {
display: inline-flex;
align-items: center;
}
.navtop div h1 {
flex: 1;
font-size: 24px;
padding: 0;
margin: 0;
color: #ecf0f6;
font-weight: normal;
}
.navtop div a {
padding: 0 20px;
text-decoration: none;
color: #c5d2e5;
font-weight: bold;
}
.navtop div a i {
padding: 2px 8px 0 0;
}
.navtop div a:hover {
color: #ecf0f6;
}
.content {
width: 1000px;
margin: 0 auto;
}
.content h2 {
margin: 0;
padding: 25px 0;
font-size: 22px;
border-bottom: 1px solid #ebebeb;
color: #666666;
}
.btns {
display: flex;
}
.btns .btn {
display: inline-block;
text-decoration: none;
background-color: #38b673;
font-weight: bold;
font-size: 14px;
border-radius: 5px;
color: #FFFFFF;
padding: 10px 15px;
margin: 15px 10px 15px 0;
}
.btns .btn:hover {
background-color: #32a367;
}
.btns .btn.red {
background-color: #b63838;
}
.btns .btn.red:hover {
background-color: #a33232;
}
.home .tickets-list {
display: flex;
flex-flow: column;
}
.home .tickets-list .ticket {
padding: 15px 0;
width: 100%;
border-bottom: 1px solid #ebebeb;
display: flex;
text-decoration: none;
}
.home .tickets-list .ticket .con {
display: flex;
justify-content: center;
flex-flow: column;
}
.home .tickets-list .ticket i {
text-align: center;
width: 80px;
color: #b3b3b3;
}
.home .tickets-list .ticket .title {
font-weight: 600;
color: #666666;
}
.home .tickets-list .ticket .msg {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
max-width: 400px;
color: #999999;
font-size: 14px;
}
.home .tickets-list .ticket .created {
flex-grow: 1;
align-items: flex-end;
color: #999999;
font-size: 14px;
}
.home .tickets-list .ticket:last-child {
border-bottom: 0;
}
.home .tickets-list .ticket:hover {
background-color: #fcfcfc;
}
.view h2 .open, .view h2 .resolved {
color: #38b673;
}
.view h2 .closed {
color: #b63838;
}
.view .ticket {
padding: 20px 0;
}
.view .ticket .created {
color: gray;
}
.view .comments {
margin-top: 15px;
border-top: 1px solid #ebebeb;
padding: 25px 0;
}
.view .comments .comment {
display: flex;
padding-bottom: 5px;
}
.view .comments .comment div {
display: flex;
align-items: flex-start;
justify-content: center;
width: 70px;
color: #e6e6e6;
transform: scaleX(-1);
}
.view .comments .comment p {
margin: 0 0 20px 0;
}
.view .comments .comment p span {
display: flex;
font-size: 14px;
padding-bottom: 5px;
color: gray;
}
.create form, .view form {
padding: 15px 0;
display: flex;
flex-flow: column;
width: 400px;
}
.create form label, .view form label {
display: inline-flex;
width: 100%;
padding: 10px 0;
margin-right: 25px;
}
.create form input, .create form textarea, .view form input, .view form textarea {
padding: 10px;
width: 100%;
margin-right: 25px;
margin-bottom: 15px;
border: 1px solid #cccccc;
}
.create form textarea, .view form textarea {
height: 200px;
}
.create form input[type="submit"], .view form input[type="submit"] {
display: block;
background-color: #38b673;
border: 0;
font-weight: bold;
font-size: 14px;
color: #FFFFFF;
cursor: pointer;
width: 200px;
margin-top: 15px;
border-radius: 5px;
}
.create form input[type="submit"]:hover, .view form input[type="submit"]:hover {
background-color: #32a367;
}
/*chat*/
.inbox_msg {
border: 1px solid #c4c4c4;
clear: both;
overflow: hidden;
background-color: #ffffff;
}
.top_spac{ margin: 20px 0 0;}
.srch_bar {
display: inline-block;
text-align: right;
width: 60%;
}
.headind_srch{ padding:10px 29px 10px 20px; overflow:hidden; border-bottom:1px solid #c4c4c4;}
.recent_heading h4 {
color: #05728f;
font-size: 21px;
margin: auto;
}
.srch_bar input{ border:1px solid #cdcdcd; border-width:0 0 1px 0; width:80%; padding:2px 0 4px 6px; background:none;}
.srch_bar .input-group-addon button {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
border: medium none;
padding: 0;
color: #707070;
font-size: 18px;
}
.srch_bar .input-group-addon { margin: 0 0 0 -27px;}
.chat_ib h5{ font-size:15px; color:#464646; margin:0 0 8px 0;}
.chat_ib h5 span{ font-size:13px; float:right;}
.chat_ib p{ font-size:14px; color:#989898; margin:auto}
.chat_img {
float: left;
width: 11%;
}
.chat_ib {
float: left;
padding: 0 0 0 15px;
width: 88%;
}
.chat_people{ overflow:hidden; clear:both;}
.chat_list {
border-bottom: 1px solid #c4c4c4;
margin: 0;
padding: 18px 16px 10px;
}
.inbox_chat { height: 550px; overflow-y: scroll;}
.active_chat{ background:#ebebeb;}
.incoming_msg_img {
display: inline-block;
width: 7%;
}
.received_msg {
display: inline-block;
padding: 0 0 0 10px;
vertical-align: top;
width: 92%;
}
.received_withd_msg p {
background: #ebebeb none repeat scroll 0 0;
border-radius: 3px;
color: #646464;
font-size: 14px;
margin: 0;
padding: 5px 10px 5px 12px;
width: 100%;
}
.time_date {
color: #747474;
display: block;
font-size: 12px;
margin: 8px 0 0;
}
.received_withd_msg { width: 57%;}
.mesgs {
float: left;
padding: 30px 15px 0 25px;
width: 100%;
}
.sent_msg p {
background: #05728f none repeat scroll 0 0;
border-radius: 3px;
font-size: 14px;
margin: 0; color:#fff;
padding: 5px 10px 5px 12px;
width:100%;
}
.outgoing_msg{ overflow:hidden; margin:26px 0 26px;}
.sent_msg {
float: right;
width: 46%;
}
.input_msg_write textarea {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
border: medium none;
color: #4c4c4c;
font-size: 15px;
min-height: 48px;
width: 100%;
}
.type_msg {border-top: 1px solid #c4c4c4;position: relative;}
.msg_send_btn {
background: #05728f none repeat scroll 0 0;
border: medium none;
border-radius: 50%;
color: #fff;
cursor: pointer;
font-size: 17px;
height: 33px;
position: absolute;
right: 0;
top: 11px;
width: 33px;
}
.messaging { padding: 0 0 50px 0;}
.msg_history {
height: 516px;
overflow-y: auto;
}
@media (min-width:1px) and (max-width:767px){
.mesgs { padding: 30px 15px 0 15px; }
.sent_msg { width: 80%; }
.received_withd_msg { width: 80%; }
.incoming_msg_img { width: 15%; }
.received_msg { width: 82%; padding: 0px; }
}
.open{
background-color: #17a2b8;
color: #FFFFFF;
}
.resolved{
background-color: #28a745;
color: #FFFFFF;
}
.closed{
background-color: #dc3545;
color: #FFFFFF;
}
</style>
</head>
<body class="body-bg">
<?php include_once '../layout/header.php'; ?>
<header class="user-admin-hdr">
<div class="user-title">
<h1>Help Support</h1>
</div>
</header>
<!-- Page Content -->
<div class="container-fluid padding-0">
<!--container-->
<div class="container mt-4">
<div class="row">
<div class="col-lg-12 mb-4">
<div class="row m-0">
<div class="col-lg-3">
<button class="info-box bg-pink" style="margin-top: 15px;" onclick="history.back()"><i class="fa fa-arrow-left" aria-hidden="true"></i> Go Back</button>
</div>
</div>
</div>
<div class="col-lg-8">
<div class="<?=(!empty($ticketdata[0]['status']))?$ticketdata[0]['status']:'';?> text-center py-2">
<h2><?=html_entity_decode($ticketdata[0]['title']);?></h2>
<span><?=html_entity_decode($ticketdata[0]['msg']);?></span>
</div>
<div class="messaging">
<div class="inbox_msg">
<div class="mesgs">
<div class="msg_history" id="comments-container">
<!-- Comments will be loaded here via AJAX -->
</div>
<?php if ($ticketdata[0]['status'] == 'open') { ?>
<div class="type_msg">
<div class="input_msg_write">
<form id="comment-form" method="post">
<input type="hidden" name="ticket_id" value="<?=$_GET['id']?>">
<input type="hidden" name="uid" value="<?=$_SESSION['userId']?>">
<textarea class="write_msg" name="msg" placeholder="Type a message" required></textarea>
<button class="msg_send_btn" type="submit"><i class="fa fa-paper-plane-o" aria-hidden="true"></i></button>
</form>
</div>
</div>
<?php } ?>
</div>
</div>
</div>
</div>
</div>
</div>
<!--end container-->
</div>
<!-- end Page Content -->
<!-- Footer -->
<?php include_once'../layout/footer.php';?>
<!-- End Footer -->
<!-- Bootstrap core JavaScript -->
<script src="../vendor/jquery/jquery.min.js"></script>
<script src="../vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="../js/bootstrap-4-hover-navbar.js"></script>
<script>
$(document).ready(function() {
// Load comments initially
loadComments();
// Set interval to refresh comments every 5 seconds
var refreshInterval = setInterval(loadComments, 5000);
// Handle form submission
$('#comment-form').on('submit', function(e) {
e.preventDefault();
var form = $(this);
var button = form.find('button[type="submit"]');
var textarea = form.find('textarea[name="msg"]');
// Disable button during submission
button.prop('disabled', true);
button.html('<i class="fa fa-spinner fa-spin"></i>');
$.ajax({
url: 'ajax_save_comment.php',
type: 'POST',
data: form.serialize(),
dataType: 'json',
success: function(response) {
if(response && response.success) {
// Clear the message textarea
textarea.val('');
// Reload comments
loadComments();
} else {
showAlert('Error: ' + (response?.message || 'Unknown error occurred'));
}
},
error: function(xhr, status, error) {
console.error('AJAX Error:', xhr.responseText);
showAlert('Failed to send message. Please try again.');
},
complete: function() {
button.prop('disabled', false);
button.html('<i class="fa fa-paper-plane-o" aria-hidden="true"></i>');
}
});
});
function loadComments() {
$.ajax({
url: 'ajax_get_comments.php',
type: 'GET',
data: {
ticket_id: <?=$_GET['id']?>,
uid: <?=$_SESSION['userId']?>
},
dataType: 'html',
success: function(response) {
$('#comments-container').html(response);
// Scroll to bottom of comments
var container = $('.msg_history');
container.scrollTop(container[0].scrollHeight);
},
error: function(xhr, status, error) {
console.error('Error loading comments:', error);
}
});
}
function showAlert(message) {
// Create a temporary alert div
var alertDiv = $('<div class="alert alert-danger">'+message+'</div>');
$('.mesgs').prepend(alertDiv);
setTimeout(function() {
alertDiv.fadeOut(500, function() {
$(this).remove();
});
}, 3000);
}
});
</script>
</body>
</html>
PK 99