mirror of
https://github.com/inventree/InvenTree
synced 2024-08-30 18:33:04 +00:00
Edit / delete / add BOM items
- Remove x-editable inline editing - Uses only bootstrap-table and modal forms - Hide the 'part' field in the bom item edit
This commit is contained in:
Oliver Walters
parent
6e2b111b9c
commit
bad46f85f4
@ -78,8 +78,10 @@ class EditBomItemForm(HelperForm):
|
||||
fields = [
|
||||
'part',
|
||||
'sub_part',
|
||||
'quantity'
|
||||
'quantity',
|
||||
'note'
|
||||
]
|
||||
widgets = {'part': forms.HiddenInput()}
|
||||
|
||||
|
||||
class EditSupplierPartForm(HelperForm):
|
||||
|
||||
@ -17,6 +17,11 @@
|
||||
<div><br></div>
|
||||
|
||||
{% if editing_enabled %}
|
||||
<div class='btn-group' style='float: left;'>
|
||||
<button class='btn btn-basic' type='button' id='bom-item-new'>New</button>
|
||||
<button class='btn btn-basic' type='button' id='bom-item-new'>Edit</button>
|
||||
<button class='btn btn-basic' type='button' id='bom-item-new'>Delete</button>
|
||||
</div>
|
||||
<div style='float: right;'>
|
||||
<button class='btn btn-warning' type='button' id='editing-cancel'>Cancel</button>
|
||||
<button class='btn btn-success' type='button' id='editing-finish'>Save Changes</button>
|
||||
@ -49,26 +54,17 @@
|
||||
loadBomTable($("#bom-table"), {
|
||||
editable: {{ editing_enabled }},
|
||||
bom_url: "{% url 'api-bom-list' %}",
|
||||
part_url: "{% url 'api-part-list' %}",
|
||||
parent_id: {{ part.id }}
|
||||
});
|
||||
|
||||
{% if editing_enabled %}
|
||||
$("#editing-finish").click(function() {
|
||||
alert("Finished!");
|
||||
location.href = "{% url 'part-bom' part.id %}";
|
||||
});
|
||||
|
||||
$("#editing-cancel").click(function() {
|
||||
alert("Cancelled!");
|
||||
location.href = "{% url 'part-bom' part.id %}";
|
||||
});
|
||||
|
||||
{% else %}
|
||||
|
||||
$("#edit-bom").click(function () {
|
||||
|
||||
{% if editing_enabled %}
|
||||
location.href = "{% url 'part-bom' part.id %}";
|
||||
{% else %}
|
||||
location.href = "{% url 'part-bom' part.id %}?edit=True";
|
||||
|
||||
{% endif %}
|
||||
});
|
||||
|
||||
$("#export-bom").click(function () {
|
||||
@ -76,6 +72,8 @@
|
||||
location.href = "{% url 'bom-export' part.id %}";
|
||||
});
|
||||
|
||||
{% endif %}
|
||||
$("#bom-item-new").click(function () {
|
||||
launchModalForm("{% url 'bom-item-create' %}?parent={{ part.id }}", {});
|
||||
});
|
||||
|
||||
{% endblock %}
|
||||
4052
InvenTree/static/css/select2-bootstrap.css
Normal file
4052
InvenTree/static/css/select2-bootstrap.css
Normal file
File diff suppressed because it is too large
Load Diff
@ -18,6 +18,7 @@ function loadBomTable(table, options) {
|
||||
* Following options are available:
|
||||
* editable - Should the BOM table be editable?
|
||||
* bom_url - Address to request BOM data from
|
||||
* part_url - Address to request Part data from
|
||||
* parent_id - Parent ID of the owning part
|
||||
*
|
||||
* BOM data are retrieved from the server via AJAX query
|
||||
@ -34,7 +35,14 @@ function loadBomTable(table, options) {
|
||||
];
|
||||
|
||||
if (options.editable) {
|
||||
// TODO - Add checkbox column
|
||||
cols.push({
|
||||
formatter: function(value, row, index, field) {
|
||||
var bEdit = "<button class='btn btn-success bom-edit-button btn-sm' type='button' url='" + row.url + "edit'>Edit</button>";
|
||||
var bDelt = "<button class='btn btn-danger bom-delete-button btn-sm' type='button' url='" + row.url + "delete'>Delete</button>";
|
||||
|
||||
return "<div class='btn-group'>" + bEdit + bDelt + "</div>";
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Part column
|
||||
@ -44,21 +52,9 @@ function loadBomTable(table, options) {
|
||||
title: 'Part',
|
||||
sortable: true,
|
||||
formatter: function(value, row, index, field) {
|
||||
if (options.editable) {
|
||||
return renderEditable(value.name,
|
||||
{
|
||||
_pk: row.pk,
|
||||
_type: 'select',
|
||||
_title: 'Part',
|
||||
_class: 'editable-part',
|
||||
_value: 1,
|
||||
});
|
||||
}
|
||||
else {
|
||||
return renderLink(value.name, value.url);
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
// Part description
|
||||
@ -76,18 +72,6 @@ function loadBomTable(table, options) {
|
||||
title: 'Required',
|
||||
searchable: false,
|
||||
sortable: true,
|
||||
formatter: function(value, row, index, field) {
|
||||
if (options.editable) {
|
||||
return renderEditable(value,
|
||||
{
|
||||
_pk: row.pk,
|
||||
_title: 'Quantity',
|
||||
});
|
||||
}
|
||||
else {
|
||||
return value;
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
@ -98,19 +82,6 @@ function loadBomTable(table, options) {
|
||||
title: 'Notes',
|
||||
searchable: true,
|
||||
sortable: false,
|
||||
formatter: function(value, row, index, field) {
|
||||
if (options.editable) {
|
||||
return renderEditable(value,
|
||||
{
|
||||
_pk: row.pk,
|
||||
_title: 'Note',
|
||||
_empty: 'Enter note',
|
||||
});
|
||||
}
|
||||
else {
|
||||
return value;
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
@ -145,6 +116,7 @@ function loadBomTable(table, options) {
|
||||
table.bootstrapTable({
|
||||
sortable: true,
|
||||
search: true,
|
||||
clickToSelect: true,
|
||||
queryParams: function(p) {
|
||||
return {
|
||||
part: options.parent_id,
|
||||
@ -154,19 +126,78 @@ function loadBomTable(table, options) {
|
||||
url: options.bom_url
|
||||
});
|
||||
|
||||
// In editing mode, attached editables to the appropriate table elements
|
||||
if (options.editable) {
|
||||
|
||||
table.on('click', '.bom-delete-button', function() {
|
||||
var button = $(this);
|
||||
|
||||
launchDeleteForm(button.attr('url'), {
|
||||
success: function() {
|
||||
reloadBomTable(table);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
table.on('click', '.bom-edit-button', function() {
|
||||
var button = $(this);
|
||||
|
||||
launchModalForm(button.attr('url'), {
|
||||
success: function() {
|
||||
reloadBomTable(table);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Callback when the BOM data are successfully loaded
|
||||
table.on('load-success.bs.table', function() {
|
||||
table.find('.editable-item').editable();
|
||||
$("#bom-table").find('.editable-part').editable({
|
||||
source: [
|
||||
// Dummy data (for now)
|
||||
{value: 1, text: 'Apple'},
|
||||
{value: 2, text: 'Banana'},
|
||||
{value: 3, text: 'Carrot'},
|
||||
]
|
||||
|
||||
// Table has loaded - Request list of available parts
|
||||
// Request list of parts which could (potentially) be added to this BOM
|
||||
$.ajax({
|
||||
url: options.part_url,
|
||||
method: 'GET',
|
||||
data: {
|
||||
consumable: true, // Only list parts that can be used in other parts
|
||||
},
|
||||
success: function(result, status, xhr) {
|
||||
// Convert returned data to select2 format
|
||||
var data = $.map(result, function(obj) {
|
||||
obj.id = obj.id || obj.pk; // Part ID is supplied as field 'pk'
|
||||
obj.text = obj.text || obj.name; // Part text is supplied as field 'name'
|
||||
|
||||
return obj;
|
||||
});
|
||||
|
||||
table.find('.part-select').select2({
|
||||
data: data,
|
||||
dropdownAutoWidth: true,
|
||||
}).select2('val', 1);
|
||||
|
||||
/*
|
||||
// Insert these data into each row drop-down
|
||||
table.find('.editable-part').editable({
|
||||
source: data,
|
||||
select2: {
|
||||
placeholder: 'Select Part',
|
||||
minimumInputLength: 3,
|
||||
dropdownAutoWidth: true,
|
||||
}
|
||||
}).on('shown', function(e, editable){
|
||||
editable.input.$input.select2({
|
||||
//data: data,
|
||||
minimumResultsForSearch: Infinity,
|
||||
dropdownAutoWidth: true,
|
||||
dropdownParent: table,
|
||||
});
|
||||
editable.input.$input.select2('val', editable.input.$input.val());
|
||||
});
|
||||
*/
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@ -10,8 +10,9 @@
|
||||
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" href="{% static 'css/bootstrap_3.3.7_css_bootstrap.min.css' %}">
|
||||
<link rel="stylesheet" href="{% static 'css/select2.css' %}">
|
||||
<link rel="stylesheet" href="{% static 'css/bootstrap-table.css' %}">
|
||||
<link rel="stylesheet" href="{% static 'css/select2.css' %}">
|
||||
<link rel="stylesheet" href="{% static 'css/select2-bootstrap.css' %}">
|
||||
<link rel="stylesheet" href="{% static 'css/inventree.css' %}">
|
||||
|
||||
{% block css %}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user