Modals dialogs for 'Build'

InvenTree/build/forms.py

@@ -14,11 +14,7 @@ class EditBuildForm(forms.ModelForm):
         super(EditBuildForm, self).__init__(*args, **kwargs)
         self.helper = FormHelper()
 
-        self.helper.form_id = 'id-edit-part-form'
-        self.helper.form_class = 'blueForms'
-        self.helper.form_method = 'post'
-
-        self.helper.add_input(Submit('submit', 'Submit'))
+        self.helper.form_tag = False
 
     class Meta:
         model = Build

InvenTree/build/templates/build/detail.html

@@ -1,4 +1,5 @@
 {% extends "base.html" %}
+{% load static %}
 
 {% block content %}
 <h3>Build Details</h3>
@@ -35,7 +36,53 @@
 {% endif %}
 </table>
 
+<h3>Required Parts</h3>
+<table class='table table-striped' id='build-list' data-sorting='true'>
+<thead>
+<tr>
+    <th>Part</th>
+    <th>Required</th>
+    <th>Available</th>
+</tr>
+</thead>
+<tbody>
+    {% for item in build.part.bom_items.all %}
+    <tr>
+        <td><a href="{% url 'part-detail' item.sub_part.id %}">{{ item.sub_part.name }}</a></td>
+        <td>{{ build.quantity }} &times {{ item.quantity }}</td>
+        <td>{{ item.sub_part.available_stock }}</td>
+    </tr>
+    {% endfor %}
+</tbody>
+</table>
+
 <div class='container-fluid'>
-<a href="{% url 'build-edit' build.id %}"><button class="btn btn-info">Edit Build</button></a>
+<button class="btn btn-info" id='edit-build'>Edit Build</button>
+</div>
+
+{% include 'modals.html' %}
+
+{% endblock %}
+
+{% block javascript %}
+
+<script type='text/javascript' src="{% static 'script/footable.js' %}"></script>
+<script type='text/javascript' src="{% static 'script/modal_form.js' %}"></script>
+
+<script type='text/javascript'>
+
+$(document).ready(function () {
+    $("#build-list").footable();
+
+    $("#edit-build").click(function () {
+        launchModalForm("#modal-form",
+                        "{% url 'build-edit' build.id %}",
+                        {
+                            reload: true
+                        });
+    });
+});
+
+</script>
 
 {% endblock %}

InvenTree/build/views.py

@@ -11,6 +11,7 @@ from .models import Build
 
 from .forms import EditBuildForm
 
+from InvenTree.views import AjaxUpdateView, AjaxCreateView
 
 class BuildIndex(ListView):
     model = Build
@@ -38,11 +39,13 @@ class BuildDetail(DetailView):
     context_object_name = 'build'
 
 
-class BuildCreate(CreateView):
+class BuildCreate(AjaxCreateView):
     model = Build
     template_name = 'build/create.html'
     context_object_name = 'build'
     form_class = EditBuildForm
+    ajax_form_title = 'Start new Build'
+    ajax_template_name = 'modal_form.html'
 
     def get_initial(self):
         initials = super(BuildCreate, self).get_initial().copy()
@@ -55,8 +58,10 @@ class BuildCreate(CreateView):
         return initials
 
 
-class BuildUpdate(UpdateView):
+class BuildUpdate(AjaxUpdateView):
     model = Build
     form_class = EditBuildForm
     context_object_name = 'build'
     template_name = 'build/update.html'
+    ajax_form_title = 'Edit Build Details'
+    ajax_template_name = 'modal_form.html'

InvenTree/part/templates/part/build.html

@@ -1,5 +1,5 @@
 {% extends "part/part_base.html" %}
-
+{% load static %}
 {% block details %}
 
 {% include 'part/tabs.html' with tab='build' %}
@@ -32,6 +32,30 @@
 </table>
 
 <div class='container-fluid'>
-<a href="{% url 'build-create' %}?part={{ part.id }}"><button class="btn btn-success">Start New Build</button></a>
+<button class="btn btn-success" id='start-build'>Start New Build</button>
+</div>
+
+{% include 'modals.html' %}
+
+{% endblock %}
+
+{% block javascript %}
+
+<script type='text/javascript' src="{% static 'script/modal_form.js' %}"></script>
+
+<script type='text/javascript'>
+$(document).ready(function() {
+    $("#start-build").click(function() {
+        launchModalForm("#modal-form",
+                        "{% url 'build-create' %}",
+                        {
+                            follow: true,
+                            data: {
+                                part: {{ part.id }}
+                            }
+                        });
+    });
+});
+</script>
 
 {% endblock %}