Merge pull request #5019 from DimDz/master

Fix for Calendar View Create Card
This commit is contained in:
Lauri Ojansivu 2023-07-20 14:34:44 +03:00 committed by GitHub
commit 2846522450
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 57 additions and 27 deletions

View file

@ -168,11 +168,28 @@
color: #fff !important;
}
/* Modal Styles */
.modal {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 9999;
background-color: rgba(0, 0, 0, 0.5);
width: 100%;
height: 100%;
}
.modal-dialog {
display: flex;
justify-content: center;
align-items: center;
height: 70%;
height: 25%; /* Adjust the height to make it smaller */
position: relative;
margin: 10% auto; /* This margin will help center the modal vertically */
max-width: 400px; /* Adjust the max-width to make it smaller */
background-color: #fff;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}
.modal-header {
display: flex;
@ -203,4 +220,5 @@
top: 5px;
right: 5px;
font-size: 25px;
cursor: pointer;
}

View file

@ -417,35 +417,37 @@ BlazeComponent.extendComponent({
revertFunc();
}
},
select: function(startDate) {
select: function (startDate) {
const currentBoard = Utils.getCurrentBoard();
const currentUser = ReactiveCache.getCurrentUser();
const $modal = $(`
<div class="modal fade" tabindex="-1" role="dialog">
<div class="modal-dialog justify-content-center align-items-center" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">${TAPi18n.__('r-create-card')}</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body text-center">
<input type="text" class="form-control" id="card-title-input" placeholder="">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" id="create-card-button">${TAPi18n.__('add-card')}</button>
</div>
</div>
const modalElement = document.createElement('div');
modalElement.classList.add('modal', 'fade');
modalElement.setAttribute('tabindex', '-1');
modalElement.setAttribute('role', 'dialog');
modalElement.innerHTML = `
<div class="modal-dialog justify-content-center align-items-center" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">${TAPi18n.__('r-create-card')}</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body text-center">
<input type="text" class="form-control" id="card-title-input" placeholder="">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" id="create-card-button">${TAPi18n.__('add-card')}</button>
</div>
</div>
`);
$modal.modal('show');
$modal.find('#create-card-button').click(function() {
const myTitle = $modal.find('#card-title-input').val();
</div>
`;
const createCardButton = modalElement.querySelector('#create-card-button');
createCardButton.addEventListener('click', function () {
const myTitle = modalElement.querySelector('#card-title-input').value;
if (myTitle) {
const firstList = currentBoard.draggableLists().fetch()[0];
const firstSwimlane = currentBoard.swimlanes().fetch()[0];
const firstList = currentBoard.draggableLists()[0];
const firstSwimlane = currentBoard.swimlanes()[0];
Meteor.call('createCardWithDueDate', currentBoard._id, firstList._id, myTitle, startDate.toDate(), firstSwimlane._id, function(error, result) {
if (error) {
console.log(error);
@ -453,10 +455,20 @@ BlazeComponent.extendComponent({
console.log("Card Created", result);
}
});
$modal.modal('hide');
closeModal();
}
});
},
document.body.appendChild(modalElement);
const openModal = function() {
modalElement.style.display = 'flex';
};
const closeModal = function() {
modalElement.style.display = 'none';
};
const closeButton = modalElement.querySelector('[data-dismiss="modal"]');
closeButton.addEventListener('click', closeModal);
openModal();
}
};
},
isViewCalendar() {