99 lines
2.8 KiB
PHP
99 lines
2.8 KiB
PHP
<?= $this->extend('admin/layout') ?>
|
|
|
|
<?= $this->section('content') ?>
|
|
<div class='container-fluid'>
|
|
<div class="card bg-light">
|
|
<div class="card-body">
|
|
<h5 class="card-title">Messages</h5>
|
|
<form class="row g-2 align-items-center" id="myForm">
|
|
<div class="col-auto">
|
|
<label for="startDate" class="col-form-label">Date</label>
|
|
</div>
|
|
|
|
<div class="col-auto">
|
|
<input type="date" class="form-control form-control-sm" id="date1" name='date1'>
|
|
</div>
|
|
|
|
<div class="col-auto">
|
|
<span>-</span>
|
|
</div>
|
|
|
|
<div class="col-auto">
|
|
<input type="date" class="form-control form-control-sm" id="date2" name='date2'>
|
|
</div>
|
|
|
|
<div class="col-auto">
|
|
<button type="button" class="btn btn-sm btn-primary" onclick='searchMessages()'>Search</button>
|
|
</div>
|
|
</form>
|
|
|
|
<div class='table-responsive'>
|
|
<table class='table table-striped table-bordered' id='dataTable'>
|
|
<thead>
|
|
<tr>
|
|
<th>#</th> <th>Messages</th> <th>Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id='tbody'>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<?= $this->endSection() ?>
|
|
|
|
<?= $this->section('script') ?>
|
|
<script>
|
|
let curDate = new Date().toJSON().slice(0, 10);
|
|
$('#date1').val(curDate);
|
|
$('#date2').val(curDate);
|
|
|
|
function searchMessages() {
|
|
const url = '<?=base_url('');?>admin/api/HISMessages';
|
|
const form = document.getElementById('myForm');
|
|
const formData = new FormData(form);
|
|
|
|
fetch(url, {
|
|
method: 'POST',
|
|
body: formData
|
|
}).then(response => {
|
|
if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`); }
|
|
return response.json();
|
|
}).then(data => {
|
|
$("#dataTable").DataTable().destroy();
|
|
$("#tbody").html("");
|
|
let i = 1;
|
|
data.data.forEach(item => {
|
|
const row = `<tr>
|
|
<td>LogID : <b>${item.LOGID}</b><br />${item.LOGDATE}</td>
|
|
<td><a href="#" class="show-more" onclick='showmore(this)'>Show More</a> <span class='text-limit'>${item.BODY}</span> </td>
|
|
<td></td>
|
|
</tr>`;
|
|
$("#tbody").append(row);
|
|
});
|
|
$('#dataTable').DataTable({
|
|
"pageLength": 20,
|
|
"lengthMenu": [10, 20, 50, 100]
|
|
});
|
|
});
|
|
}
|
|
|
|
function showmore(element) {
|
|
event.preventDefault();
|
|
const limitedTextSpan = element.nextElementSibling;
|
|
console.log(limitedTextSpan.style.whiteSpace);
|
|
if (limitedTextSpan.style.whiteSpace == 'nowrap' || limitedTextSpan.style.whiteSpace == '') {
|
|
limitedTextSpan.style.whiteSpace = 'normal';
|
|
limitedTextSpan.style.overflow = 'visible';
|
|
element.textContent = 'Show Less';
|
|
console.log('show less');
|
|
} else {
|
|
limitedTextSpan.style.whiteSpace = 'nowrap';
|
|
limitedTextSpan.style.overflow = 'hidden';
|
|
element.textContent = 'Show More';
|
|
console.log('show more');
|
|
}
|
|
}
|
|
</script>
|
|
<?= $this->endSection() ?>
|