first commit
This commit is contained in:
@@ -0,0 +1,230 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-10">
|
||||
<h4>Notifications</h4>
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<!-- <?= $alerts_recieved ?> -->
|
||||
|
||||
<div>
|
||||
<form id="notifications-form">
|
||||
<div class="form-group">
|
||||
<div class="trigger_key">
|
||||
<label for="trigger_key" class="font-weight-bold col-lg-6 col-form-label">
|
||||
Trigger Key
|
||||
</label>
|
||||
<div class="col-lg-12">
|
||||
<input type="search" name="trigger_key" id="trigger_key" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="msg_status">
|
||||
<label for="msg_status" class="font-weight-bold col-lg-6 col-form-label">
|
||||
Message Status
|
||||
</label>
|
||||
<div class="col-lg-12">
|
||||
<?= $card_msg_status ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="added">
|
||||
<label for="start_date" class="font-weight-bold col-lg-6 col-form-label">
|
||||
Added
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="start_date" id="start_date" class="form-control">
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="end_date" id="end_date" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input type="button" name="search-notifications" id="search-notifications" value="Search" class="btn btn-info" />
|
||||
|
||||
</div>
|
||||
<input type="hidden" name="member_id" value='<?= $member_id ?>'>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
<div id="pagination-notifications"></div>
|
||||
<table id="notifications-list" class="table-bordered table-condensed table-hover table-striped table-condensed col-lg-12" style="padding:0px; background-color:aliceblue;">
|
||||
<thead class="bg-indigo">
|
||||
<th>Added</th>
|
||||
<th>Expire</th>
|
||||
<th>Send Alert</th>
|
||||
<th>Email Alert</th>
|
||||
<th>Trigger Key</th>
|
||||
<th>Notice Type</th>
|
||||
<th>Message</th>
|
||||
<th>Message Status</th>
|
||||
<th>Mmode</th>
|
||||
<th>Send</th>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2">
|
||||
<h4>*</h4>
|
||||
<!-- Members online -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- /members online -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script type="text/javascript" src="/assets/js/app.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function() {
|
||||
// Datepicker
|
||||
$("input[name='start_date']").datepicker({
|
||||
defaultDate: "+1w",
|
||||
changeMonth: true,
|
||||
numberOfMonths: 3,
|
||||
format: "yyyy-mm-dd",
|
||||
onClose: function(selectedDate) {
|
||||
$("#start_date").datepicker("option", "minDate", selectedDate);
|
||||
}
|
||||
});
|
||||
|
||||
$("input[name='end_date']").datepicker({
|
||||
defaultDate: "+1w",
|
||||
changeMonth: true,
|
||||
numberOfMonths: 3,
|
||||
format: "yyyy-mm-dd",
|
||||
onClose: function(selectedDate) {
|
||||
$("input[name='end_date']").datepicker("option", "minDate", selectedDate);
|
||||
}
|
||||
});
|
||||
|
||||
setDefaultDate($('#notifications-form'));
|
||||
|
||||
// Oauth2 Tokens
|
||||
function createNotificationsTable(result) {
|
||||
|
||||
$('#notifications-list tbody').empty();
|
||||
|
||||
for (index in result) {
|
||||
let tr =
|
||||
`<tr>
|
||||
<td>${result[index].added}</td>
|
||||
<td>${result[index].expire}</td>
|
||||
<td>${result[index].sendalert}</td>
|
||||
<td>${result[index].emailalert}</td>
|
||||
<td>${result[index].trigger_key}</td>
|
||||
<td>${result[index].notice_type}</td>
|
||||
<td>${result[index].msg}</td>
|
||||
<td>${result[index].msg_status}</td>
|
||||
<td>${result[index].mmode}</td>
|
||||
<td>
|
||||
<button
|
||||
type="button"
|
||||
onclick="pushNotification(
|
||||
'${result[index].id_members_notification}',
|
||||
'${result[index].id_members}'
|
||||
);"
|
||||
class="btn btn-danger"
|
||||
id="acc'${result[index].id_members_notification}'"
|
||||
>Send
|
||||
</button>
|
||||
<div id="msgl${result[index].id_members_notification}"></div>
|
||||
</td>
|
||||
</tr>`;
|
||||
|
||||
$('#notifications-list tbody').append(tr);
|
||||
}
|
||||
}
|
||||
// Detect pagination click
|
||||
$('#pagination-notifications').on('click', 'a', function(e) {
|
||||
e.preventDefault();
|
||||
var pageno = $(this).attr('data-ci-pagination-page');
|
||||
loadNotificationsRecord(pageno);
|
||||
});
|
||||
|
||||
// Detect search click
|
||||
$('#search-notifications').on('click', function(e) {
|
||||
setDefaultDate($(this).closest('form'));
|
||||
loadNotificationsRecord(0);
|
||||
});
|
||||
|
||||
// Prevent submit form by press the enter button
|
||||
$(window).keydown(function(event) {
|
||||
if (event.keyCode == 13) {
|
||||
loadNotificationsRecord(0);
|
||||
event.preventDefault();
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
function loadNotificationsRecord(pagno, btnSearch = null) {
|
||||
loadingButton(btnSearch);
|
||||
$.ajax({
|
||||
url: '/member/loadNotificationsRecord?row_no=' + pagno,
|
||||
type: 'get',
|
||||
dataType: 'json',
|
||||
data: $('#notifications-form').serialize(),
|
||||
success: function(response) {
|
||||
$('#pagination-notifications').html(response.pagination);
|
||||
createNotificationsTable(response.result);
|
||||
},
|
||||
complete: function() {
|
||||
stopLoadingButton(btnSearch);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
loadNotificationsRecord(0);
|
||||
})
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
function pushNotification(notice_id, member_id) {
|
||||
$('#msgl' + notice_id).html('Processing...');
|
||||
$('#acc' + notice_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/notifications/sendnotification?notice_id=" + notice_id + "&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#msgl'+ notice_id).html(data);
|
||||
$('#acc' + notice_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
|
||||
return false;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#notifications-form .form-group {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.added {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.search-by-range {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.search-by-range div {
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
.panel-heading {
|
||||
padding: 15px 0px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user