369 lines
15 KiB
PHP
369 lines
15 KiB
PHP
|
<script>
|
||
|
"use strict";
|
||
|
|
||
|
// Class definition
|
||
|
var KTAppInbox = function() {
|
||
|
// Private properties
|
||
|
var _asideEl;
|
||
|
var _listEl;
|
||
|
var _viewEl;
|
||
|
var _composeEl;
|
||
|
var _replyEl;
|
||
|
var _asideOffcanvas;
|
||
|
|
||
|
// Public methods
|
||
|
return {
|
||
|
// Public functions
|
||
|
init: function() {
|
||
|
// Init variables
|
||
|
_asideEl = KTUtil.getById('kt_inbox_aside');
|
||
|
_listEl = KTUtil.getById('kt_inbox_list');
|
||
|
_viewEl = KTUtil.getById('kt_inbox_view');
|
||
|
_composeEl = KTUtil.getById('kt_inbox_compose');
|
||
|
_replyEl = KTUtil.getById('kt_inbox_reply');
|
||
|
|
||
|
// Init handlers
|
||
|
KTAppInbox.initAside();
|
||
|
KTAppInbox.initList();
|
||
|
KTAppInbox.initView();
|
||
|
},
|
||
|
|
||
|
initAside: function() {
|
||
|
// Mobile offcanvas for mobile mode
|
||
|
_asideOffcanvas = new KTOffcanvas(_asideEl, {
|
||
|
overlay: true,
|
||
|
baseClass: 'offcanvas-mobile',
|
||
|
//closeBy: 'kt_inbox_aside_close',
|
||
|
toggleBy: 'kt_subheader_mobile_toggle'
|
||
|
});
|
||
|
|
||
|
// View list
|
||
|
KTUtil.on(_asideEl, '.list-item[data-action="list"]', 'click', function(e) {
|
||
|
var type = KTUtil.attr(this, 'data-type');
|
||
|
var listItemsEl = KTUtil.find(_listEl, '.kt-inbox__items');
|
||
|
var navItemEl = this.closest('.kt-nav__item');
|
||
|
var navItemActiveEl = KTUtil.find(_asideEl, '.kt-nav__item.kt-nav__item--active');
|
||
|
|
||
|
// demo loading
|
||
|
var loading = new KTDialog({
|
||
|
'type': 'loader',
|
||
|
'placement': 'top center',
|
||
|
'message': 'Loading ...'
|
||
|
});
|
||
|
loading.show();
|
||
|
|
||
|
setTimeout(function() {
|
||
|
loading.hide();
|
||
|
|
||
|
KTUtil.css(_listEl, 'display', 'flex'); // show list
|
||
|
KTUtil.css(_viewEl, 'display', 'none'); // hide view
|
||
|
|
||
|
KTUtil.addClass(navItemEl, 'kt-nav__item--active');
|
||
|
KTUtil.removeClass(navItemActiveEl, 'kt-nav__item--active');
|
||
|
|
||
|
KTUtil.attr(listItemsEl, 'data-type', type);
|
||
|
}, 600);
|
||
|
});
|
||
|
},
|
||
|
|
||
|
initList: function() {
|
||
|
// View message
|
||
|
KTUtil.on(_listEl, '[data-inbox="message"]', 'click', function(e) {
|
||
|
e.preventDefault();
|
||
|
e.stopImmediatePropagation();
|
||
|
var actionsEl = KTUtil.find(this, '[data-inbox="actions"]');
|
||
|
var idmmp = $(this).data('idmmp');
|
||
|
|
||
|
// skip actions click
|
||
|
if (e.target === actionsEl || (actionsEl && actionsEl.contains(e.target) === true)) {
|
||
|
return false;
|
||
|
}
|
||
|
var is_read = false;
|
||
|
var type_inbox = $('#type_inbox').val();
|
||
|
var formData = new FormData();
|
||
|
formData.append('id', idmmp)
|
||
|
formData.append('type', type_inbox)
|
||
|
// Demo loading
|
||
|
var loading = new KTDialog({
|
||
|
'type': 'loader',
|
||
|
'placement': 'top center',
|
||
|
'message': 'Loading ...'
|
||
|
});
|
||
|
loading.show();
|
||
|
doPost(base_url+'projects/get_any/get_det_inbox', formData, function (msg, data) {
|
||
|
var data = data.data;
|
||
|
$('#tittle_view').html(data.tittle)
|
||
|
var img_user = "{{asset('assets/media/logos/no_img.png')}}";
|
||
|
if (data.image_url) {
|
||
|
img_user = data.image_url;
|
||
|
}
|
||
|
is_read = data.is_read;
|
||
|
$('#user_img_view').css('background-image',`url('${img_user}')`)
|
||
|
$('#name_user_view').html(data.full_name)
|
||
|
$('#name_user_from_view').html(data.full_name)
|
||
|
$('#send_date_view').html(G_formatDate(data.send_date, 'd-M-Y H:i'))
|
||
|
$('#send_date_view2').html(G_formatDate(data.send_date, 'd-M-Y H:i'))
|
||
|
$('#subject_view').html(data.tittle)
|
||
|
if(type_inbox=='meetings') {
|
||
|
$('#message_view').html(data.inv_content)
|
||
|
} else {
|
||
|
var description = data.inv_content?data.inv_content:'Tidak Ada Notes';
|
||
|
$('#message_view').html(`
|
||
|
<p>
|
||
|
Notes:
|
||
|
<br>
|
||
|
${description}
|
||
|
</p>
|
||
|
`);
|
||
|
}
|
||
|
var countInbox = $('#countInbox').html();
|
||
|
// setTimeout(function() {
|
||
|
$.when(update_read(idmmp, type_inbox)).done(function() {
|
||
|
if(!is_read) {
|
||
|
if(countInbox > 0) {
|
||
|
$('#countInbox').html(countInbox - 1);
|
||
|
}
|
||
|
}
|
||
|
loading.hide();
|
||
|
|
||
|
KTUtil.addClass(_listEl, 'd-none');
|
||
|
KTUtil.removeClass(_listEl, 'd-block');
|
||
|
|
||
|
KTUtil.addClass(_viewEl, 'd-block');
|
||
|
KTUtil.removeClass(_viewEl, 'd-none');
|
||
|
})
|
||
|
// }, 700);
|
||
|
});
|
||
|
|
||
|
});
|
||
|
|
||
|
// Group selection
|
||
|
KTUtil.on(_listEl, '[data-inbox="group-select"] input', 'click', function() {
|
||
|
var messages = KTUtil.findAll(_listEl, '[data-inbox="message"]');
|
||
|
|
||
|
for (var i = 0, j = messages.length; i < j; i++) {
|
||
|
var message = messages[i];
|
||
|
var checkbox = KTUtil.find(message, '.checkbox input');
|
||
|
checkbox.checked = this.checked;
|
||
|
|
||
|
if (this.checked) {
|
||
|
KTUtil.addClass(message, 'active');
|
||
|
} else {
|
||
|
KTUtil.removeClass(message, 'active');
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
|
||
|
// Individual selection
|
||
|
KTUtil.on(_listEl, '[data-inbox="message"] [data-inbox="actions"] .checkbox input', 'click', function() {
|
||
|
var item = this.closest('[data-inbox="message"]');
|
||
|
|
||
|
if (item && this.checked) {
|
||
|
KTUtil.addClass(item, 'active');
|
||
|
} else {
|
||
|
KTUtil.removeClass(item, 'active');
|
||
|
}
|
||
|
});
|
||
|
},
|
||
|
|
||
|
initView: function() {
|
||
|
// Back to listing
|
||
|
KTUtil.on(_viewEl, '[data-inbox="back"]', 'click', function() {
|
||
|
// demo loading
|
||
|
var loading = new KTDialog({
|
||
|
'type': 'loader',
|
||
|
'placement': 'top center',
|
||
|
'message': 'Loading ...'
|
||
|
});
|
||
|
|
||
|
loading.show();
|
||
|
|
||
|
setTimeout(function() {
|
||
|
loading.hide();
|
||
|
|
||
|
KTUtil.addClass(_listEl, 'd-block');
|
||
|
KTUtil.removeClass(_listEl, 'd-none');
|
||
|
|
||
|
KTUtil.addClass(_viewEl, 'd-none');
|
||
|
KTUtil.removeClass(_viewEl, 'd-block');
|
||
|
}, 700);
|
||
|
});
|
||
|
|
||
|
// Expand/Collapse reply
|
||
|
KTUtil.on(_viewEl, '[data-inbox="message"]', 'click', function(e) {
|
||
|
var message = this.closest('[data-inbox="message"]');
|
||
|
|
||
|
var dropdownToggleEl = KTUtil.find(this, '[data-toggle="dropdown"]');
|
||
|
var toolbarEl = KTUtil.find(this, '[data-inbox="toolbar"]');
|
||
|
|
||
|
// skip dropdown toggle click
|
||
|
if (e.target === dropdownToggleEl || (dropdownToggleEl && dropdownToggleEl.contains(e.target) === true)) {
|
||
|
return false;
|
||
|
}
|
||
|
|
||
|
// skip group actions click
|
||
|
if (e.target === toolbarEl || (toolbarEl && toolbarEl.contains(e.target) === true)) {
|
||
|
return false;
|
||
|
}
|
||
|
|
||
|
if (KTUtil.hasClass(message, 'toggle-on')) {
|
||
|
KTUtil.addClass(message, 'toggle-off');
|
||
|
KTUtil.removeClass(message, 'toggle-on');
|
||
|
} else {
|
||
|
KTUtil.removeClass(message, 'toggle-off');
|
||
|
KTUtil.addClass(message, 'toggle-on');
|
||
|
}
|
||
|
});
|
||
|
},
|
||
|
};
|
||
|
}();
|
||
|
|
||
|
/* // Class Initialization
|
||
|
jQuery(document).ready(function() {
|
||
|
KTAppInbox.init();
|
||
|
}); */
|
||
|
|
||
|
var url = '{{ route('inboxMeetingData') }}';
|
||
|
var keyword;
|
||
|
var typeInbox=$('#type_inbox').val();
|
||
|
var is_read=$('#is_read').val();
|
||
|
$(document).ready(function() {
|
||
|
keyword = $("#keyword").val();
|
||
|
load_data_inbox(url, keyword, is_read, typeInbox);
|
||
|
|
||
|
$("#keyword").on('keyup', function (e) {
|
||
|
if (e.key === 'Enter' || e.keyCode === 13) {
|
||
|
e.preventDefault();
|
||
|
load_data_inbox(url, $("#keyword").val(), 'all', typeInbox);
|
||
|
}
|
||
|
});
|
||
|
});
|
||
|
|
||
|
$(document).on('click', '.pagination-wrapper a', function(e){
|
||
|
e.preventDefault();
|
||
|
e.stopImmediatePropagation();
|
||
|
var page = $(this).attr('href').split('page=')[1];
|
||
|
url = base_url + 'projects/data?page=' + page;
|
||
|
keyword = $("#keyword").val();
|
||
|
typeInbox=$('#type_inbox').val();
|
||
|
is_read=$('#is_read').val();
|
||
|
load_data_inbox(url, keyword, is_read, typeInbox);
|
||
|
});
|
||
|
|
||
|
function load_data_inbox(url, keyword, is_read='all', type='meetings') {
|
||
|
$.ajax({
|
||
|
type: 'GET',
|
||
|
url: url,
|
||
|
data: {
|
||
|
keyword : keyword,
|
||
|
is_read : is_read,
|
||
|
type: type
|
||
|
},
|
||
|
beforeSend: function () {
|
||
|
znLoadingPage()
|
||
|
$("#list_inbox").html('');
|
||
|
},
|
||
|
success: function (response) {
|
||
|
znLoadingPageEnd()
|
||
|
if ( response.rc == 200 ) {
|
||
|
var data = response.data.inbox.data;
|
||
|
var links = response.data.paginateLinks;
|
||
|
|
||
|
if ( data.length <= 0 ) {
|
||
|
znLoadingPageEnd()
|
||
|
// znNotif('warning', 'Data Project belum tersedia')
|
||
|
$('#list_inbox').append(`
|
||
|
<x-other.no_data
|
||
|
messageTitle="Maaf data Inbox saat ini tidak ditemukan."
|
||
|
subMessage=""
|
||
|
/>
|
||
|
`)
|
||
|
return false;
|
||
|
}
|
||
|
// var arr = _.chunk(data, 3);
|
||
|
znLoadingPageEnd()
|
||
|
var html = "";
|
||
|
// arr.forEach(function(items, index) {
|
||
|
// html += `<div class="row">`;
|
||
|
// items.forEach(function (value, index) {
|
||
|
data.forEach(function (value, index) {
|
||
|
var url_img = "{{asset('assets/media/logos/no_img.png')}}";
|
||
|
if (value.image_url) {
|
||
|
url_img = value.image_url;
|
||
|
}
|
||
|
|
||
|
var send_date = G_formatDate(value.send_date, 'd-M-Y H:i');
|
||
|
var is_read = '';
|
||
|
if(value.is_read) {
|
||
|
is_read = '<span class="label label-light-success font-weight-bold label-inline mr-1">Read</span>';
|
||
|
}
|
||
|
|
||
|
html += `<div class="list list-hover min-w-500px" data-inbox="list">
|
||
|
<!--begin::Item-->
|
||
|
<div class="d-flex align-items-start list-item card-spacer-x py-3" data-inbox="message" data-idmmp='${value.id}'>
|
||
|
<!--begin::Toolbar-->
|
||
|
<div class="d-flex align-items-center">
|
||
|
<!--begin::Author-->
|
||
|
<div class="d-flex align-items-center flex-wrap w-xxl-200px mr-3" data-toggle="view">
|
||
|
<span class="symbol symbol-60 mr-3">
|
||
|
<span class="symbol-label" style="background-image: url('${url_img}')"></span>
|
||
|
</span>
|
||
|
<a href="#" class="font-weight-bold text-dark-75 text-hover-primary">${value.full_name}</a>
|
||
|
</div>
|
||
|
<!--end::Author-->
|
||
|
</div>
|
||
|
<!--end::Toolbar-->
|
||
|
<!--begin::Info-->
|
||
|
<div class="flex-grow-1 mt-2 mr-2" data-toggle="view">
|
||
|
<div>
|
||
|
<span class="font-weight-bolder font-size-lg mr-2">${value.tittle} - </span>
|
||
|
<span class="text-muted">${value.project_name}</span>
|
||
|
</div>
|
||
|
<div class="mt-2">
|
||
|
<span class="label label-light-primary font-weight-bold label-inline mr-1">inbox</span>
|
||
|
${is_read}
|
||
|
</div>
|
||
|
</div>
|
||
|
<!--end::Info-->
|
||
|
<!--begin::Datetime-->
|
||
|
<div class="mt-2 mr-3 font-weight-bolder text-right" data-toggle="view">${send_date}</div>
|
||
|
<!--end::Datetime-->
|
||
|
</div>
|
||
|
<!--end::Item-->
|
||
|
</div>`;
|
||
|
});
|
||
|
// html += `</div>`;
|
||
|
// });
|
||
|
$('#is_read').val(is_read)
|
||
|
$('#type_inbox').val(type)
|
||
|
$("#list_inbox").html(html);
|
||
|
$(".pagination-wrapper").html(links);
|
||
|
$('[data-toggle="popover"]').popover();
|
||
|
KTUtil.scrollTop();
|
||
|
KTAppInbox.init();
|
||
|
} else {
|
||
|
znLoadingPageEnd()
|
||
|
// notifToast('error', 'Terjadi Kesalahan');
|
||
|
znNotif('error', 'Terjadi Kesalahan');
|
||
|
}
|
||
|
}
|
||
|
}).done(function (msg) {
|
||
|
}).fail(function (msg) {
|
||
|
znLoadingPageEnd()
|
||
|
znNotif('error', 'Terjadi Kesalahan');
|
||
|
});
|
||
|
}
|
||
|
|
||
|
function update_read(id, type) {
|
||
|
var formData = new FormData();
|
||
|
formData.append('id', id)
|
||
|
formData.append('type', type)
|
||
|
var is_read = $('#is_read').val();
|
||
|
// znLoadingPage()
|
||
|
doPost(base_url+'projects/act_any/read_inbox', formData, function (msg, data) {
|
||
|
// znLoadingPageEnd()
|
||
|
load_data_inbox(url, keyword, is_read, type)
|
||
|
});
|
||
|
}
|
||
|
|
||
|
</script>
|