diff --git a/InvenTree/part/templates/part/bom.html b/InvenTree/part/templates/part/bom.html
index 1f019bd205..2ed84c188b 100644
--- a/InvenTree/part/templates/part/bom.html
+++ b/InvenTree/part/templates/part/bom.html
@@ -45,88 +45,11 @@
{% block js_ready %}
{{ block.super }}
- function reloadBom() {
- $("#bom-table").bootstrapTable('refresh');
- }
- // Load the BOM data
- $("#bom-table").bootstrapTable({
- sortable: true,
- search: true,
- queryParams: function(p) {
- return {
- part: {{ part.id }}
- }
- },
- columns: [
- {
- field: 'pk',
- title: 'ID',
- visible: false,
- },
- {
- field: 'sub_part',
- title: 'Part',
- sortable: true,
- formatter: function(value, row, index, field) {
- return renderLink(value.name, value.url);
- }
- },
- {
- field: 'sub_part.description',
- title: 'Description',
- },
- {
- field: 'quantity',
- title: 'Required',
- searchable: false,
- sortable: true,
- formatter: function(value, row, index, field) {
- return renderEditable(value,
- {
- _pk: row.pk,
- _title: 'Quantity',
- enabled: {{ editing_enabled }},
- }
- );
- }
- },
- {
- field: 'note',
- title: 'Note',
- searchable: true,
- sortable: false,
- formatter: function(value, row, index, field) {
- return renderEditable(value,
- {
- _pk: row.pk,
- _title: 'Note',
- _empty: 'Enter note',
- enabled: {{ editing_enabled }},
- });
- }
- },
- {
- field: 'sub_part.available_stock',
- title: 'Available',
- searchable: false,
- sortable: true,
- formatter: function(value, row, index, field) {
- var text = "";
- if (row.quantity < row.sub_part.available_stock)
- {
- text = "" + value + "";
- }
- else
- {
- text = "" + value + "";
- }
-
- return renderLink(text, row.sub_part.url + "stock/");
- }
- },
- ],
- url: "{% url 'api-bom-list' %}"
+ loadBomTable($("#bom-table"), {
+ editable: {{ editing_enabled }},
+ bom_url: "{% url 'api-bom-list' %}",
+ parent_id: {{ part.id }}
});
{% if editing_enabled %}
@@ -140,45 +63,15 @@
location.href = "{% url 'part-bom' part.id %}";
});
- $("#bom-table").on('load-success.bs.table', function() {
- // Make the table elements editable
- $("#bom-table").find('.editable-item').editable();
- });
-
{% else %}
$("#edit-bom").click(function () {
location.href = "{% url 'part-bom' part.id %}?edit=1";
- /*
- editBOM(
- {
- url: "{% url 'api-bom-list' %}",
- part_name: "{{ part.name }}",
- part_id: "{{ part.id }}",
- }
- );
- */
- /*
- launchModalForm(
- "{% url 'bom-item-create' %}",
- {
- reload: true,
- data: {
- parent: {{ part.id }}
- }
- });
- */
});
$("#export-bom").click(function () {
- /*
- launchModalForm(
- "{% url 'bom-export' part.id %}",
- {
- });
- */
//TODO - Select format of the data
location.href = "{% url 'bom-export' part.id %}";
});
diff --git a/InvenTree/static/script/inventree/bom.js b/InvenTree/static/script/inventree/bom.js
index c8bfa4270c..bdbceeb049 100644
--- a/InvenTree/static/script/inventree/bom.js
+++ b/InvenTree/static/script/inventree/bom.js
@@ -6,77 +6,167 @@
*/
-function refreshBOM(){
- // TODO - Update the BOM data once the data are read from the server
+function reloadBomTable(table, options) {
+
+ table.bootstrapTable('refresh');
}
-function editBOM(options){
-
- /* Launch a modal window to edit the BOM options.
- * The caller should pass the following key:value data in 'options':
- * part_name: The name of the part being edited
- * part_id: The pk of the part (for AJAX lookup)
- * url: The JSON API URL to get BOM data
+function loadBomTable(table, options) {
+ /* Load a BOM table with some configurable options.
+ *
+ * Following options are available:
+ * editable - Should the BOM table be editable?
+ * bom_url - Address to request BOM data from
+ * parent_id - Parent ID of the owning part
+ *
+ * BOM data are retrieved from the server via AJAX query
*/
- // Default modal target if none is supplied
- var modal = options.modal || '#modal-form';
-
- var title = 'Edit BOM for ' + options.part_name;
+ // Construct the table columns
- var body = `
-
-
-
-
- `;
-
- openModal(
+ var cols = [
{
- modal: modal,
- content: body,
- title: title,
- submit_text: 'Save',
- close_text: 'Cancel',
+ field: 'pk',
+ title: 'ID',
+ visible: false,
+ }
+ ];
+
+ if (options.editable) {
+ // TODO - Add checkbox column
+ }
+
+ // Part column
+ cols.push(
+ {
+ field: 'sub_part',
+ 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);
+ }
+ }
}
);
- $('#new-bom-item').click(function() {
- alert("New BOM item!");
- });
+ // Part description
+ cols.push(
+ {
+ field: 'sub_part.description',
+ title: 'Description',
+ }
+ );
- $('#modal-bom-table').bootstrapTable({
+ // Part quantity
+ cols.push(
+ {
+ field: 'quantity',
+ 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;
+ }
+ }
+ }
+ );
+
+ // Part notes
+ cols.push(
+ {
+ field: 'note',
+ 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;
+ }
+ }
+ }
+ );
+
+ // If we are NOT editing, display the available stock
+ if (!options.editable) {
+ cols.push(
+ {
+ field: 'sub_part.available_stock',
+ title: 'Available',
+ searchable: false,
+ sortable: true,
+ formatter: function(value, row, index, field) {
+ var text = "";
+
+ if (row.quantity < row.sub_part.available_stock)
+ {
+ text = "" + value + "";
+ }
+ else
+ {
+ text = "" + value + "";
+ }
+
+ return renderLink(text, row.sub_part.url + "stock/");
+ }
+ }
+ );
+ }
+
+ // Configure the table (bootstrap-table)
+
+ table.bootstrapTable({
sortable: true,
search: true,
queryParams: function(p) {
return {
- part: options.part_id,
+ part: options.parent_id,
}
},
- //data: {},
- columns: [
- {
- field: 'pk',
- title: 'ID',
- visible: false
- },
- {
- field: 'sub_part.name',
- title: 'Part',
- sortable: true,
- },
- {
- field: 'sub_part.description',
- title: 'Description',
- },
- {
- field: 'quantity',
- title: 'Required',
- searchable: false,
- sortable: true,
- }
- ],
- url: options.url,
+ columns: cols,
+ url: options.bom_url
});
+
+ if (options.editable) {
+ // 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'},
+ ]
+ });
+ });
+ }
+
}
\ No newline at end of file
diff --git a/InvenTree/static/script/tables.js b/InvenTree/static/script/tables.js
index 13bb6dc7b9..c6ff11525a 100644
--- a/InvenTree/static/script/tables.js
+++ b/InvenTree/static/script/tables.js
@@ -25,16 +25,9 @@ function renderEditable(text, options) {
* _empty - placeholder text to show when field is empty
* _class - html class (default = 'editable-item')
* _id - id
- *
- * And some further parameters:
- * enabled - if 1 or true, render the editable.
- * otherwise, just return the supplied text
+ * _value - Initial value of the editable (default = blank)
*/
- if (!options.enabled) {
- return text;
- }
-
// Default values (if not supplied)
var _type = options._type || 'text';
var _class = options._class || 'editable-item';
@@ -53,6 +46,10 @@ function renderEditable(text, options) {
html = html + " data-title='" + options._title + "'";
}
+ if (options._value) {
+ html = html + " data-value='" + options._value + "'";
+ }
+
if (options._empty) {
html = html + " data-placeholder='" + options._empty + "'";
html = html + " data-emptytext='" + options._empty + "'";