mirror of
https://github.com/inventree/InvenTree
synced 2024-08-30 18:33:04 +00:00
Add a secondary modal in modals.html
This commit is contained in:
parent
a96cd2240c
commit
dc3abec899
@ -51,7 +51,7 @@
|
||||
background: #eee;
|
||||
display: none;
|
||||
position: absolute;
|
||||
z-index: 999;
|
||||
z-index: 400;
|
||||
border: 1px solid #555;
|
||||
max-width: 250px;
|
||||
}
|
||||
@ -159,7 +159,15 @@
|
||||
|
||||
.modal {
|
||||
overflow: hidden;
|
||||
z-index: 99999999;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.modal-primary {
|
||||
z-index: 10000;
|
||||
}
|
||||
|
||||
.modal-secondary {
|
||||
z-index: 11000;
|
||||
}
|
||||
|
||||
.js-modal-form .checkbox {
|
||||
@ -227,7 +235,7 @@
|
||||
margin-top: 20px;
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
z-index: 999999;
|
||||
z-index: 5000;
|
||||
pointer-events: none; // Prevent this div from blocking links underneath
|
||||
}
|
||||
|
||||
|
@ -354,15 +354,41 @@ function injectModalForm(modal, form_html) {
|
||||
}
|
||||
|
||||
|
||||
function insertNewItemButton(modal, field, text) {
|
||||
function insertNewItemButton(modal, options) {
|
||||
/* Insert a button into a modal form, after a field label.
|
||||
* Looks for a <label> tag inside the form with the attribute "for='id_<field>'"
|
||||
* Inserts a button at the end of this lael element.
|
||||
*/
|
||||
|
||||
var html = "<span style='float: right;'>";
|
||||
|
||||
html += "<div type='button' class='btn btn-primary' id='btn-new-" + field + "'>" + text + "</div>";
|
||||
html += "<div type='button' class='btn btn-primary'";
|
||||
|
||||
if (options.title) {
|
||||
html += " title='" + options.title + "'";
|
||||
}
|
||||
|
||||
html += " id='btn-new-" + options.field + "'>" + options.label + "</div>";
|
||||
|
||||
html += "</span>";
|
||||
|
||||
$(modal).find('label[for="id_'+ field + '"]').append(html);
|
||||
$(modal).find('label[for="id_'+ options.field + '"]').append(html);
|
||||
}
|
||||
|
||||
|
||||
function attachSecondaryModal(modal, options) {
|
||||
/* Attach a secondary modal form to the primary modal form.
|
||||
* Inserts a button into the primary form which, when clicked,
|
||||
* will launch the secondary modal to do /something/ and then return a result.
|
||||
*
|
||||
* options:
|
||||
* field: Name of the field to attach to
|
||||
* label: Button text
|
||||
* title: Hover text to display over button (optional)
|
||||
*/
|
||||
|
||||
// Insert the button
|
||||
insertNewItemButton(modal, options);
|
||||
}
|
||||
|
||||
|
||||
|
@ -345,32 +345,6 @@ function moveStockItems(items, options) {
|
||||
});
|
||||
}
|
||||
|
||||
function deleteStockItems(items, options) {
|
||||
|
||||
var modal = '#modal-delete';
|
||||
|
||||
if ('modal' in options) {
|
||||
modal = options.modal;
|
||||
}
|
||||
|
||||
if (items.length == 0) {
|
||||
alert('No stock items selected');
|
||||
return;
|
||||
}
|
||||
|
||||
function doDelete(parts) {
|
||||
//TODO
|
||||
}
|
||||
|
||||
openModal({
|
||||
modal: modal,
|
||||
title: 'Delete ' + items.length + ' stock items'
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
function loadStockTable(table, options) {
|
||||
|
||||
table.bootstrapTable({
|
||||
|
@ -123,9 +123,28 @@
|
||||
{% if location %}
|
||||
location: {{ location.id }}
|
||||
{% endif %}
|
||||
},
|
||||
after_render: function(modal, response) {
|
||||
|
||||
attachSecondaryModal(modal,
|
||||
{
|
||||
'field': 'part',
|
||||
'label': 'New Part',
|
||||
'title': 'Create New Part',
|
||||
}
|
||||
);
|
||||
|
||||
attachSecondaryModal(modal,
|
||||
{
|
||||
'field': 'location',
|
||||
'label': 'New Location',
|
||||
'title': 'Create New Location'
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
|
@ -1,4 +1,4 @@
|
||||
<div class='modal fade modal-fixed-footer' tabindex='-1' role='dialog' id='modal-form'>
|
||||
<div class='modal fade modal-fixed-footer modal-primary' tabindex='-1' role='dialog' id='modal-form'>
|
||||
<div class='modal-dialog'>
|
||||
<div class='modal-content'>
|
||||
<div class="modal-header">
|
||||
@ -17,27 +17,25 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class='modal fade modal-fixed-footer' tabindex='-1' role='dialog' id='modal-delete'>
|
||||
<div class='modal-dialog'>
|
||||
<div class='modal-content'>
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
<h3 id='modal-title'>Confirm Item Deletion</h3>
|
||||
</div>
|
||||
<form action='' method='post' id='delete-form'>
|
||||
{% csrf_token %}
|
||||
</form>
|
||||
<div class='modal-form-content'>
|
||||
</div>
|
||||
<div class='modal-footer'>
|
||||
<button type='button' class='btn btn-default' data-dismiss='modal'>Cancel</button>
|
||||
<button type='button' class='btn btn-danger' id='modal-form-delete'>Delete</button>
|
||||
<div class='modal fade modal-fixed-footer modal-secondary' tabindex='-1' role='dialog' id='modal-form-secondary'>
|
||||
<div class='modal-dialog'>
|
||||
<div class='modal-content'>
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
<h3 id='modal-title'>Form Title Here</h3>
|
||||
</div>
|
||||
<div class='modal-form-content'>
|
||||
</div>
|
||||
<div class='modal-footer'>
|
||||
<button type='button' class='btn btn-default' id='modal-form-close' data-dismiss='modal'>Close</button>
|
||||
<button type='button' class='btn btn-primary' id='modal-form-submit'>Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class='modal fade modal-fixed-footer' tabindex='-1' role='dialog' id='modal-question-dialog'>
|
||||
<div class='modal-dialog'>
|
||||
|
Loading…
Reference in New Issue
Block a user