mirror of
https://git.imnavajas.es/jjimenez/safekat.git
synced 2025-07-25 22:52:08 +00:00
terminando servicios manipulados y preimpresion
This commit is contained in:
@ -1,380 +0,0 @@
|
||||
/**
|
||||
* App Email
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
(function () {
|
||||
const emailList = document.querySelector('.email-list'),
|
||||
emailListItems = [].slice.call(document.querySelectorAll('.email-list-item')),
|
||||
emailListItemInputs = [].slice.call(document.querySelectorAll('.email-list-item-input')),
|
||||
emailView = document.querySelector('.app-email-view-content'),
|
||||
emailFilters = document.querySelector('.email-filters'),
|
||||
emailFilterByFolders = [].slice.call(document.querySelectorAll('.email-filter-folders li')),
|
||||
emailEditor = document.querySelector('.email-editor'),
|
||||
appEmailSidebar = document.querySelector('.app-email-sidebar'),
|
||||
appOverlay = document.querySelector('.app-overlay'),
|
||||
emailReplyEditor = document.querySelector('.email-reply-editor'),
|
||||
bookmarkEmail = [].slice.call(document.querySelectorAll('.email-list-item-bookmark')),
|
||||
selectAllEmails = document.getElementById('email-select-all'),
|
||||
emailSearch = document.querySelector('.email-search-input'),
|
||||
toggleCC = document.querySelector('.email-compose-toggle-cc'),
|
||||
toggleBCC = document.querySelector('.email-compose-toggle-bcc'),
|
||||
emailCompose = document.querySelector('.app-email-compose'),
|
||||
emailListDelete = document.querySelector('.email-list-delete'),
|
||||
emailListRead = document.querySelector('.email-list-read'),
|
||||
refreshEmails = document.querySelector('.email-refresh'),
|
||||
emailViewContainer = document.getElementById('app-email-view'),
|
||||
emailFilterFolderLists = [].slice.call(document.querySelectorAll('.email-filter-folders li')),
|
||||
emailListItemActions = [].slice.call(document.querySelectorAll('.email-list-item-actions li'));
|
||||
|
||||
// Initialize PerfectScrollbar
|
||||
// ------------------------------
|
||||
// Email list scrollbar
|
||||
if (emailList) {
|
||||
let emailListInstance = new PerfectScrollbar(emailList, {
|
||||
wheelPropagation: false,
|
||||
suppressScrollX: true
|
||||
});
|
||||
}
|
||||
|
||||
// Sidebar tags scrollbar
|
||||
if (emailFilters) {
|
||||
new PerfectScrollbar(emailFilters, {
|
||||
wheelPropagation: false,
|
||||
suppressScrollX: true
|
||||
});
|
||||
}
|
||||
|
||||
// Email view scrollbar
|
||||
if (emailView) {
|
||||
new PerfectScrollbar(emailView, {
|
||||
wheelPropagation: false,
|
||||
suppressScrollX: true
|
||||
});
|
||||
}
|
||||
|
||||
// Initialize Quill Editor
|
||||
// ------------------------------
|
||||
if (emailEditor) {
|
||||
new Quill('.email-editor', {
|
||||
modules: {
|
||||
toolbar: '.email-editor-toolbar'
|
||||
},
|
||||
placeholder: 'Write your message... ',
|
||||
theme: 'snow'
|
||||
});
|
||||
}
|
||||
|
||||
if (emailReplyEditor) {
|
||||
new Quill('.email-reply-editor', {
|
||||
modules: {
|
||||
toolbar: '.email-reply-toolbar'
|
||||
},
|
||||
placeholder: 'Write your message... ',
|
||||
theme: 'snow'
|
||||
});
|
||||
}
|
||||
|
||||
// Bookmark email
|
||||
if (bookmarkEmail) {
|
||||
bookmarkEmail.forEach(emailItem => {
|
||||
emailItem.addEventListener('click', e => {
|
||||
let emailItem = e.currentTarget.parentNode.parentNode;
|
||||
let starredAttr = emailItem.getAttribute('data-starred');
|
||||
e.stopPropagation();
|
||||
if (!starredAttr) {
|
||||
emailItem.setAttribute('data-starred', 'true');
|
||||
} else {
|
||||
emailItem.removeAttribute('data-starred');
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Select all
|
||||
if (selectAllEmails) {
|
||||
selectAllEmails.addEventListener('click', e => {
|
||||
if (e.currentTarget.checked) {
|
||||
emailListItemInputs.forEach(c => (c.checked = 1));
|
||||
} else {
|
||||
emailListItemInputs.forEach(c => (c.checked = 0));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Select single email
|
||||
if (emailListItemInputs) {
|
||||
emailListItemInputs.forEach(emailListItemInput => {
|
||||
emailListItemInput.addEventListener('click', e => {
|
||||
e.stopPropagation();
|
||||
// Check input count to reset the indeterminate state
|
||||
let emailListItemInputCount = 0;
|
||||
emailListItemInputs.forEach(emailListItemInput => {
|
||||
if (emailListItemInput.checked) {
|
||||
emailListItemInputCount++;
|
||||
}
|
||||
});
|
||||
|
||||
if (emailListItemInputCount < emailListItemInputs.length) {
|
||||
if (emailListItemInputCount == 0) {
|
||||
selectAllEmails.indeterminate = false;
|
||||
} else {
|
||||
selectAllEmails.indeterminate = true;
|
||||
}
|
||||
} else {
|
||||
if (emailListItemInputCount == emailListItemInputs.length) {
|
||||
selectAllEmails.indeterminate = false;
|
||||
selectAllEmails.checked = true;
|
||||
} else {
|
||||
selectAllEmails.indeterminate = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Search email based on searched text
|
||||
if (emailSearch) {
|
||||
emailSearch.addEventListener('keyup', e => {
|
||||
let searchValue = e.currentTarget.value.toLowerCase(),
|
||||
searchEmailListItems = {},
|
||||
selectedFolderFilter = document.querySelector('.email-filter-folders .active').getAttribute('data-target');
|
||||
|
||||
// Filter emails based on selected folders
|
||||
if (selectedFolderFilter != 'inbox') {
|
||||
searchEmailListItems = [].slice.call(
|
||||
document.querySelectorAll('.email-list-item[data-' + selectedFolderFilter + '="true"]')
|
||||
);
|
||||
} else {
|
||||
searchEmailListItems = [].slice.call(document.querySelectorAll('.email-list-item'));
|
||||
}
|
||||
|
||||
// console.log(searchValue);
|
||||
searchEmailListItems.forEach(searchEmailListItem => {
|
||||
let searchEmailListItemText = searchEmailListItem.textContent.toLowerCase();
|
||||
if (searchValue) {
|
||||
if (-1 < searchEmailListItemText.indexOf(searchValue)) {
|
||||
searchEmailListItem.classList.add('d-block');
|
||||
} else {
|
||||
searchEmailListItem.classList.add('d-none');
|
||||
}
|
||||
} else {
|
||||
searchEmailListItem.classList.remove('d-none');
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Filter based on folder type (Inbox, Sent, Draft etc...)
|
||||
emailFilterByFolders.forEach(emailFilterByFolder => {
|
||||
emailFilterByFolder.addEventListener('click', e => {
|
||||
let currentTarget = e.currentTarget,
|
||||
currentTargetData = currentTarget.getAttribute('data-target');
|
||||
|
||||
appEmailSidebar.classList.remove('show');
|
||||
appOverlay.classList.remove('show');
|
||||
|
||||
// Remove active class from each folder filters
|
||||
Helpers._removeClass('active', emailFilterByFolders);
|
||||
// Add active class to selected folder filters
|
||||
currentTarget.classList.add('active');
|
||||
emailListItems.forEach(emailListItem => {
|
||||
// If folder filter is Inbox
|
||||
if (currentTargetData == 'inbox') {
|
||||
emailListItem.classList.add('d-block');
|
||||
emailListItem.classList.remove('d-none');
|
||||
} else if (emailListItem.hasAttribute('data-' + currentTargetData)) {
|
||||
emailListItem.classList.add('d-block');
|
||||
emailListItem.classList.remove('d-none');
|
||||
} else {
|
||||
emailListItem.classList.add('d-none');
|
||||
emailListItem.classList.remove('d-block');
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// Toggle CC/BCC input
|
||||
if (toggleBCC) {
|
||||
toggleBCC.addEventListener('click', e => {
|
||||
Helpers._toggleClass(document.querySelector('.email-compose-bcc'), 'd-block', 'd-none');
|
||||
});
|
||||
}
|
||||
|
||||
if (toggleCC) {
|
||||
toggleCC.addEventListener('click', e => {
|
||||
Helpers._toggleClass(document.querySelector('.email-compose-cc'), 'd-block', 'd-none');
|
||||
});
|
||||
}
|
||||
|
||||
// Empty compose email message inputs when modal is hidden
|
||||
emailCompose.addEventListener('hidden.bs.modal', event => {
|
||||
document.querySelector('.email-editor .ql-editor').innerHTML = '';
|
||||
$('#emailContacts').val('');
|
||||
initSelect2();
|
||||
});
|
||||
|
||||
// Delete multiple email
|
||||
if (emailListDelete) {
|
||||
emailListDelete.addEventListener('click', e => {
|
||||
emailListItemInputs.forEach(emailListItemInput => {
|
||||
if (emailListItemInput.checked) {
|
||||
emailListItemInput.parentNode.closest('li.email-list-item').remove();
|
||||
}
|
||||
});
|
||||
selectAllEmails.indeterminate = false;
|
||||
selectAllEmails.checked = false;
|
||||
});
|
||||
}
|
||||
|
||||
// Mark as read
|
||||
if (emailListRead) {
|
||||
emailListRead.addEventListener('click', e => {
|
||||
emailListItemInputs.forEach(emailListItemInput => {
|
||||
if (emailListItemInput.checked) {
|
||||
emailListItemInput.checked = false;
|
||||
emailListItemInput.parentNode.closest('li.email-list-item').classList.add('email-marked-read');
|
||||
let emailItemEnvelop = emailListItemInput.parentNode
|
||||
.closest('li.email-list-item')
|
||||
.querySelector('.email-list-item-actions li');
|
||||
|
||||
if (Helpers._hasClass('email-read', emailItemEnvelop)) {
|
||||
emailItemEnvelop.classList.remove('email-read');
|
||||
emailItemEnvelop.classList.add('email-unread');
|
||||
emailItemEnvelop.querySelector('i').classList.remove('ti-mail-opened');
|
||||
emailItemEnvelop.querySelector('i').classList.add('ti-mail');
|
||||
}
|
||||
}
|
||||
});
|
||||
selectAllEmails.indeterminate = false;
|
||||
selectAllEmails.checked = false;
|
||||
});
|
||||
}
|
||||
|
||||
// Refresh Mails
|
||||
|
||||
if (refreshEmails && emailList) {
|
||||
let emailListJq = $('.email-list'),
|
||||
emailListInstance = new PerfectScrollbar(emailList, {
|
||||
wheelPropagation: false,
|
||||
suppressScrollX: true
|
||||
});
|
||||
// ? Using jquery vars due to BlockUI jQuery dependency
|
||||
refreshEmails.addEventListener('click', e => {
|
||||
emailListJq.block({
|
||||
message: '<div class="spinner-border text-primary" role="status"></div>',
|
||||
timeout: 1000,
|
||||
css: {
|
||||
backgroundColor: 'transparent',
|
||||
border: '0'
|
||||
},
|
||||
overlayCSS: {
|
||||
backgroundColor: '#000',
|
||||
opacity: 0.1
|
||||
},
|
||||
onBlock: function () {
|
||||
emailListInstance.settings.suppressScrollY = true;
|
||||
},
|
||||
onUnblock: function () {
|
||||
emailListInstance.settings.suppressScrollY = false;
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Earlier msgs
|
||||
// ? Using jquery vars due to jQuery animation (slideToggle) dependency
|
||||
let earlierMsg = $('.email-earlier-msgs');
|
||||
if (earlierMsg.length) {
|
||||
earlierMsg.on('click', function () {
|
||||
let $this = $(this);
|
||||
$this.parents().find('.email-card-last').addClass('hide-pseudo');
|
||||
$this.next('.email-card-prev').slideToggle();
|
||||
$this.remove();
|
||||
});
|
||||
}
|
||||
|
||||
// Email contacts (select2)
|
||||
// ? Using jquery vars due to select2 jQuery dependency
|
||||
let emailContacts = $('#emailContacts');
|
||||
function initSelect2() {
|
||||
if (emailContacts.length) {
|
||||
function renderContactsAvatar(option) {
|
||||
if (!option.id) {
|
||||
return option.text;
|
||||
}
|
||||
let $avatar =
|
||||
"<div class='d-flex flex-wrap align-items-center'>" +
|
||||
"<div class='avatar avatar-xs me-2'>" +
|
||||
"<img src='" +
|
||||
assetsPath +
|
||||
'img/avatars/' +
|
||||
$(option.element).data('avatar') +
|
||||
"' alt='avatar' class='rounded-circle' />" +
|
||||
'</div>' +
|
||||
option.text +
|
||||
'</div>';
|
||||
|
||||
return $avatar;
|
||||
}
|
||||
emailContacts.wrap('<div class="position-relative"></div>').select2({
|
||||
placeholder: 'Select value',
|
||||
dropdownParent: emailContacts.parent(),
|
||||
closeOnSelect: false,
|
||||
templateResult: renderContactsAvatar,
|
||||
templateSelection: renderContactsAvatar,
|
||||
escapeMarkup: function (es) {
|
||||
return es;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
initSelect2();
|
||||
|
||||
// Scroll to bottom on reply click
|
||||
// ? Using jquery vars due to jQuery animation dependency
|
||||
let emailViewContent = $('.app-email-view-content');
|
||||
emailViewContent.find('.scroll-to-reply').on('click', function () {
|
||||
if (emailViewContent[0].scrollTop === 0) {
|
||||
emailViewContent.animate(
|
||||
{
|
||||
scrollTop: emailViewContent[0].scrollHeight
|
||||
},
|
||||
1500
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
// Close view on email filter folder list click
|
||||
if (emailFilterFolderLists) {
|
||||
emailFilterFolderLists.forEach(emailFilterFolderList => {
|
||||
emailFilterFolderList.addEventListener('click', e => {
|
||||
emailViewContainer.classList.remove('show');
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Email List Items Actions
|
||||
if (emailListItemActions) {
|
||||
emailListItemActions.forEach(emailListItemAction => {
|
||||
emailListItemAction.addEventListener('click', e => {
|
||||
e.stopPropagation();
|
||||
let currentTarget = e.currentTarget;
|
||||
if (Helpers._hasClass('email-delete', currentTarget)) {
|
||||
currentTarget.parentNode.closest('li.email-list-item').remove();
|
||||
} else if (Helpers._hasClass('email-read', currentTarget)) {
|
||||
currentTarget.parentNode.closest('li.email-list-item').classList.add('email-marked-read');
|
||||
Helpers._toggleClass(currentTarget, 'email-read', 'email-unread');
|
||||
Helpers._toggleClass(currentTarget.querySelector('i'), 'ti-mail-opened', 'ti-mail');
|
||||
} else if (Helpers._hasClass('email-unread', currentTarget)) {
|
||||
currentTarget.parentNode.closest('li.email-list-item').classList.remove('email-marked-read');
|
||||
Helpers._toggleClass(currentTarget, 'email-read', 'email-unread');
|
||||
Helpers._toggleClass(currentTarget.querySelector('i'), 'ti-mail-opened', 'ti-mail');
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
})();
|
||||
});
|
||||
Reference in New Issue
Block a user