chatbot / includes / chat-sessions / reports / view / reporting-highlights.php

reporting-highlights.php in WPBot – AI ChatBot for Live Support, Lead Generation, WordPress Automation, AI Services 8.7.0, at includes/chat-sessions/reports/view/reporting-highlights.php

436 lines 12.8 KB

Raw Download Zip

1	<?php if ( ! defined( 'ABSPATH' ) ) { exit; } ?>
2	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
3
4	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css" integrity="sha384-4LISF5TTJX/fLmGSxO53rV4miRxdg84mZsxmO8Rx5jGtp/LbrixFETvWa5a6sESd" crossorigin="anonymous">
5
6	<link href="<?php echo esc_url( QCLD_wpCHATBOT_HISTORY_PLUGIN_URL . '/reports/view/assets/style.css' ); ?>" rel="stylesheet">
7
8	<main id="main" class="main clearfix wpbot-reports-dashboard">
9
10	<div class="pagetitle">
11	<h1><?php echo esc_html__( 'Bot - Reporting Dashboard', 'chatbot' ); ?></h1>
12	</div><!-- End Page Title -->
13
14	<section class="section dashboard">
15	<div class="row">
16
17	<!-- Left side columns -->
18	<div class="col-lg-12">
19	<div class="row">
20
21	<!-- Card 1 -->
22	<div class="col-xxl-4 col-md-6">
23	<div class="card info-card sales-card">
24
25	<div class="card-body">
26	<h5 class="card-title">Total Conversations</span></h5>
27
28	<div class="d-flex align-items-center">
29	<div class="card-icon rounded-circle d-flex align-items-center justify-content-center">
30	<i class="bi bi-wechat"></i>
31	</div>
32	<div class="ps-3">
33	<h6>
34	<?php echo intval( botreports_get_total_conversation_count() ); ?>
35	</h6>
36	<span class="text-success small pt-1 fw-bold">
37	<?php echo intval( botreports_get_todays_conversation_count() ); ?>
38	</span>
39	<span class="text-muted small pt-2 ps-1">Today</span>,
40	<span class="text-success small pt-1 fw-bold">
41	<?php echo intval( botreports_get_weeks_conversation_count() ); ?>
42	</span>
43	<span class="text-muted small pt-2 ps-1">Last Week</span>
44
45	</div>
46	</div>
47	</div>
48
49	</div>
50	</div><!-- End Card 1 -->
51	<!-- Card 1 -->
52	<div class="col-xxl-4 col-md-6">
53	<div class="card info-card sales-card feedback-card feedback-card--like" data-type="like" style="cursor:pointer;">
54	<div class="card-body">
55	<h5 class="card-title">Positive Feedback</h5>
56	<div class="d-flex align-items-center">
57	<div class="card-icon rounded-circle d-flex align-items-center justify-content-center">
58	<i class="bi bi-hand-thumbs-up"></i>
59	</div>
60	<div class="ps-3">
61	<h6><?php echo intval( wpbot_get_report_stats_count()['likes'] ); ?></h6>
62	</div>
63	</div>
64	</div>
65	</div>
66	</div>
67
68	<div class="col-xxl-4 col-md-6">
69	<div class="card info-card sales-card feedback-card feedback-card--dislike" data-type="dislike" style="cursor:pointer;">
70	<div class="card-body">
71	<h5 class="card-title">Negative Feedback</h5>
72	<div class="d-flex align-items-center">
73	<div class="card-icon rounded-circle d-flex align-items-center justify-content-center">
74	<i class="bi bi-hand-thumbs-down"></i>
75	</div>
76	<div class="ps-3">
77	<h6><?php echo intval( wpbot_get_report_stats_count()['dislikes'] ); ?></h6>
78	</div>
79	</div>
80	</div>
81	</div>
82	</div>
83	<div id="feedback-results" class="col-12" style="margin-top:8px;"></div>
84
85
86
87	<!-- Card 2 -->
88	<div class="col-xxl-4 col-md-6">
89	<div class="card info-card sales-card">
90
91	<div class="card-body">
92	<h5 class="card-title">Conversations in Last 30 Days</span></h5>
93
94	<div class="d-flex align-items-center">
95	<div class="card-icon rounded-circle d-flex align-items-center justify-content-center">
96	<i class="bi bi-bar-chart-steps"></i>
97	</div>
98	<div class="ps-3">
99	<h6>
100	<?php echo intval( botreports_get_last30days_conversation_count() ); ?>
101	</h6>
102	</div>
103	</div>
104	</div>
105
106	</div>
107	</div><!-- End Card 2 -->
108
109	<!-- Card 3 -->
110	<div class="col-xxl-4 col-md-6">
111	<div class="card info-card sales-card">
112
113	<div class="card-body">
114	<h5 class="card-title">Average Daily Conversation</span></h5>
115
116	<div class="d-flex align-items-center">
117	<div class="card-icon rounded-circle d-flex align-items-center justify-content-center">
118	<i class="bi bi-bar-chart"></i>
119	</div>
120	<div class="ps-3">
121	<h6><?php echo esc_html( botreports_get_last30days_conversation_average() ); ?></h6>
122	<span class="text-muted small">In</span>
123	<span class="text-success small pt-1 fw-bold">Last 30</span>
124	<span class="text-muted small pt-2 ps-1">Days</span>
125	</div>
126	</div>
127	</div>
128
129	</div>
130	</div><!-- End Card 3 -->
131
132	<!-- Reports: Conversation Density Chart -->
133	<div class="col-lg-12">
134	<div class="card wpbot-report-panel" style="max-width: 100% !important;">
135	<div class="card-body">
136	<h5 class="card-title">Conversation Density Chart</h5>
137
138	<!-- Area Chart -->
139	<div id="areaChart" style="min-height: 365px;"></div>
140
141	<?php
142
143	$densityTable = botreports_get_last30days_conversation_density();
144
145	$dates = array();
146	$conversation_count_in_date = array();
147
148	foreach ( $densityTable as $data ) {
149	array_push( $dates, $data->CONVERSATION_DATE );
150	array_push( $conversation_count_in_date, $data->CONVERSATION_NUM );
151	}
152
153	?>
154
155	<script>
156	document.addEventListener("DOMContentLoaded", () => {
157	const series = {
158	"monthDataSeries1": {
159	"count": <?php echo wp_json_encode( $conversation_count_in_date ); ?>,
160	"dates": <?php echo wp_json_encode( $dates ); ?>,
161	},
162	}
163	new ApexCharts(document.querySelector("#areaChart"), {
164	series: [{
165	name: "Conversation Count",
166	data: series.monthDataSeries1.count
167	}],
168	chart: {
169	type: 'bar',
170	height: 350,
171	fontFamily: '"DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
172	zoom: {
173	enabled: false
174	}
175	},
176	colors: ['#5B4E96'],
177	plotOptions: {
178	bar: {
179	horizontal: false,
180	borderRadius: 6,
181	columnWidth: '55%'
182	}
183	},
184	dataLabels: {
185	enabled: true,
186	style: { colors: ['#5B4E96'] }
187	},
188	labels: series.monthDataSeries1.dates,
189	xaxis: {
190	type: 'datetime',
191	},
192	yaxis: {
193	opposite: true
194	},
195	grid: {
196	borderColor: '#e4e0f2',
197	strokeDashArray: 4
198	},
199	legend: {
200	horizontalAlign: 'left'
201	}
202	}).render();
203	});
204	</script>
205	<!-- End Area Chart -->
206
207	</div>
208	</div>
209	</div><!-- End Reports: Conversation Density Chart -->
210
211	<!-- Recent Conversations -->
212	<div class="col-lg-12 clearfix">
213	<div class="card wpbot-report-panel" style="max-width: 100% !important;">
214
215	<div class="card-body">
216	<h5 class="card-title">Recent 5 Conversations</h5>
217
218	<?php
219
220	$results = botreports_get_last5_conversations();
221
222	$numberOfRecords = count( $results );
223
224	if ( $numberOfRecords > 0 ) :
225
226	?>
227
228	<table class="table table-hover wpbot-report-table">
229	<thead>
230	<tr class="first-row text-center">
231	<th scope="col">#</th>
232	<th scope="col">Date & Time</th>
233	<th scope="col">Session ID</th>
234	<th scope="col">Interaction Count</th>
235	<th scope="col">Action</th>
236	</tr>
237	</thead>
238	<tbody>
239
240	<?php
241
242	$counter = count( $results ) === 5 ? 5 : count( $results );
243
244	foreach ( $results as $result ) {
245
246	?>
247
248	<tr class="text-center">
249	<th scope="row">
250	<a href="<?php echo esc_url( admin_url( "admin.php?page=wbcs-botsessions-page&userid={$result->user_id}" ) ); ?>">
251	<?php echo esc_html( $counter ); ?>
252	</a>
253	</th>
254	<td><?php echo esc_html( date( 'd M, Y g:i A', strtotime( $result->date ) ) ); ?></td>
255	<td><?php echo esc_html( $result->session_id ); ?></td>
256	<td><?php echo intval( get_user_interaction_count( $result->conversation ) ); ?></td>
257	<td>
258	<a href="<?php echo esc_url( admin_url( "admin.php?page=wbcs-botsessions-page&userid={$result->user_id}" ) ); ?>" class="btn btn-primary">
259	<i class="bi bi-eyeglasses"></i> View Chat
260	</a>
261	</td>
262	</tr>
263
264	<?php
265
266	--$counter;
267
268	}
269
270	?>
271
272
273	</tbody>
274
275	</table>
276
277	<?php else : ?>
278
279	<div class="alert alert-info">No chat records were found in the database.</div>
280
281	<?php endif; ?>
282
283	</div>
284
285	</div>
286	</div><!-- End Recent Conversations -->
287	<!-- Reports Conversations -->
288	<div class="col-lg-12 clearfix">
289	<div class="card wpbot-report-panel" style="max-width: 100% !important;">
290
291	<div class="card-body">
292	<h5 class="card-title">Conversations Reports</h5>
293
294	<?php
295
296	$reports_count = wpbot_get_report_stats_count()['reports_only'];
297
298
299
300	if ( $reports_count > 0 ) :
301
302	?>
303
304	<table class="table table-hover wpbot-report-table">
305	<thead>
306	<tr class="first-row text-center">
307	<th scope="col">#</th>
308	<th scope="col">Id</th>
309	<th scope="col">Email</th>
310	<th scope="col">Message</th>
311	<th scope="col">Report Text</th>
312	<th scope="col">Date</th>
313	</tr>
314	</thead>
315	<tbody>
316
317	<?php
318	$rests = wpbot_get_reports_list();
319	$counter = count( $rests ) === 5 ? 5 : count( $rests );
320
321	foreach ( $rests as $report ) {
322	$meta = maybe_unserialize( $report['meta_info'] );
323	$email = isset($meta['email']) ? $meta['email'] : '';
324	$report_text = isset($meta['report_text']) ? $meta['report_text'] : '';
325	?>
326
327	<tr class="text-center">
328	<th scope="row">
329	<?php echo esc_html( $counter ); ?>
330	</th>
331	<td><?php echo esc_html( $report['id'] ); ?></td>
332	<td><?php echo esc_html( $email ); ?></td>
333	<td><?php echo esc_html( $report['message'] ); ?></td>
334	<td><?php echo esc_html( $report_text ); ?></td>
335	<td><?php echo esc_html( $report['created_at'] ); ?></td>
336	</tr>
337
338	<?php
339
340	--$counter;
341
342	}
343
344	?>
345
346
347	</tbody>
348
349	</table>
350
351	<?php else : ?>
352
353	<div class="alert alert-info">No chat records were found in the database.</div>
354
355	<?php endif; ?>
356
357	</div>
358
359	</div>
360	</div><!-- End Reports Conversations -->
361
362	</div>
363
364	<div class="wpbot-report-actions">
365	<a href="<?php echo esc_url( admin_url( 'admin.php?page=wbcs-botsessions-page' ) ); ?>" class="btn btn-primary">
366	<i class="bi bi-gear-wide-connected me-1"></i> Manage All Conversations
367	</a>
368
369	<button id="wpbot-clear-feedback" class="btn btn-danger"><i class="bi bi-trash me-1"></i>Clear All Feedback</button>
370	<div id="wpbot-clear-feedback-msg"></div>
371	</div>
372
373	</div><!-- End Left side columns -->
374
375	</div>
376	</section>
377
378	</main><!-- End #main -->
379
380	<script src="<?php echo esc_url( QCLD_wpCHATBOT_HISTORY_PLUGIN_URL . '/reports/view/assets/apexcharts.min.js' ); ?>"></script>
381	<script>
382	jQuery(document).ready(function($) {
383	$(".feedback-card").on("click", function() {
384	let type = $(this).data("type");
385	$("#feedback-results").html("<p>Loading...</p>");
386
387	$.post(ajaxurl, {
388	action: "wpbot_get_feedback_ajax",
389	feedback_type: type
390	}, function(response) {
391	if (response.success) {
392	$("#feedback-results").html(response.data.html);
393	} else {
394	$("#feedback-results").html("<p>No results found.</p>");
395	}
396	});
397	});
398	});
399	jQuery(document).on("click", ".wpbot-page-link", function(e) {
400	e.preventDefault();
401
402	let page = jQuery(this).data("page");
403	let type = jQuery(this).data("type");
404
405	jQuery.post(ajaxurl, {
406	action: "wpbot_get_feedback_ajax",
407	feedback_type: type,
408	page: page
409	}, function(response) {
410	if (response.success) {
411	jQuery("#feedback-results").html(response.data.html);
412	}
413	});
414	});
415	jQuery(document).on("click", "#wpbot-clear-feedback", function (e) {
416	console.log('kardi');
417	e.preventDefault();
418
419	if (!confirm("Are you sure you want to delete all feedback?")) {
420	return;
421	}
422
423	jQuery.post(ajaxurl, {
424	action: "wpbot_clear_all_feedback"
425	}, function (response) {
426	if (response.success) {
427	jQuery("#wpbot-clear-feedback-msg").text(response.data.message).css("color", "green");
428	// Optionally reload counters
429	location.reload();
430	} else {
431	jQuery("#wpbot-clear-feedback-msg").text(response.data.message).css("color", "red");
432	}
433	});
434	});
435
436	</script>