A little refactoring for crud template and project structure

preinfo/views/client_views.py

@@ -3,25 +3,53 @@ from django.contrib.auth.mixins import LoginRequiredMixin
 from django.forms import forms
 from django.forms.widgets import HiddenInput
 from django.http import JsonResponse
-from django.shortcuts import render, redirect
+from django.shortcuts import render, redirect, get_object_or_404
 from django.urls import reverse_lazy
+from django.utils import timezone
 from django.views import View
 from django.views.generic import TemplateView, FormView, CreateView, ListView
 
+from DepoT.mixins.crudListViewMixin import CRUDListViewMixin
+from common.models import ContainerTypeModel, LinesModel
 from common.utils.utils import filter_queryset_by_user, get_preinfo_by_number
-from preinfo.forms import PreinfoBaseForm, PreinfoCreateForm
+from preinfo.forms import PreinfoBaseForm, PreinfoCreateForm, PreinfoEditForm
 from preinfo.models import Preinfo
 
 
-
+class ClientPreinfoView(LoginRequiredMixin, CRUDListViewMixin, ListView):
-class ClientPreinfoView(LoginRequiredMixin, CreateView):
+    # template_name = 'client-preinfo-content.html'
-    template_name = 'client-preinfo-content.html'
-    form_class = PreinfoCreateForm
-    success_url = reverse_lazy('client_preinfo')
     model = Preinfo
+    template_name = 'client/preinfo-list.html'
+    create_form_class = PreinfoCreateForm
+    form_class = PreinfoEditForm
+    context_object_name = 'objects'
+    success_url = reverse_lazy('client_preinfo')
+    base_template = 'client-base.html'
+
+    def get_object_data(self, obj):
+        return {
+            'container_number': obj.container_number,
+            'container_type': obj.container_type.id,
+            'line': obj.line.id
+        }
+
+    def handle_form_submission(self, request, *args, **kwargs):
+        object_id = request.POST.get('object_id')
+        if object_id:
+            obj = get_object_or_404(self.model, id=object_id)
+            form = self.form_class(request.POST, instance=obj)
+        else:
+            form = self.create_form_class(request.POST)
+        if form.is_valid():
+            form.save()
+            return redirect(self.success_url)
+        return self.get(request, *args, **kwargs)
 
     def get_context_data(self, **kwargs):
         context = super().get_context_data(**kwargs)
+        context['form'] = self.form_class()  # Add empty form to context
+        context['create_form'] = self.create_form_class()  # Add empty form to context
+        context['base_template'] = self.base_template  # Add empty form to context
         queryset = self.model.objects.all().order_by('-created_on')
         user = self.request.user
 # !!! important
@@ -82,8 +110,33 @@ class PreinfoSearchView(View):
         return render(request, self.template_name, {'error': 'Not found'})
 
 
-class PreinfoListView(ListView):
+class PreinfoListView(CRUDListViewMixin, ListView):
     model = Preinfo
     template_name = 'employee/preinfo-list.html'
-    context_object_name = 'preinfos'
+    context_object_name = 'objects'
-    paginate_by = 30  # Number of items per page
+    paginate_by = 30
+    form_class = PreinfoEditForm
+    base_template = 'employee-base.html'
+
+    def get_object_data(self, obj):
+        return {
+            'container_number': obj.container_number,
+            'container_type': obj.container_type.id,
+            'line': obj.line.id
+        }
+
+    def handle_form_submission(self, request, *args, **kwargs):
+        object_id = request.POST.get('object_id')
+        if object_id:
+            obj = get_object_or_404(self.model, id=object_id)
+            form = self.form_class(request.POST, instance=obj)
+            if form.is_valid():
+                form.save()
+                return redirect('employee_preinfo')
+        return self.get(request, *args, **kwargs)
+
+    def get_context_data(self, **kwargs):
+        context = super().get_context_data(**kwargs)
+        context['form'] = self.form_class()  # Add empty form to context
+        context['base_template'] = self.base_template  # Add empty form to context
+        return context

templates/barrier/barrier-base.html

@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>$Title$</title>
+</head>
+<body>
+$END$
+</body>
+</html>

templates/client/preinfo-list.html

@@ -0,0 +1,25 @@
+{% extends 'list-crud.html' %}
+{% load static %}
+
+{% block table_header %}
+        <th style="display: none;">Select</th>
+        <th>Preinfo №</th>
+        <th>Container №</th>
+        <th>Container type</th>
+        <th>Line</th>
+        <th>Created on</th>
+        <th>Created by</th>
+{% endblock table_header %}
+
+{% block table_data %}
+    <td>{{ object.id }}</td>
+    <td>{{ object.container_number }}</td>
+    <td>{{ object.container_type }}</td>
+    <td>{{ object.line.short_name }}</td>
+    <td>{{ object.created_on }}</td>
+    <td>{{ object.created_by.username }}</td>
+{% endblock %}
+
+{% block modal_header %}
+            <h2>Edit Preinfo</h2>
+{% endblock modal_header %}

templates/list-crud.html

@@ -0,0 +1,157 @@
+{% extends 'employee-base.html' %}
+{% load static %}
+
+{% block content %}
+<table id="preinfoTable" class="table">
+    <tr>
+        <th style="display: none;">Select</th>
+        <th>Preinfo №</th>
+        <th>Container №</th>
+        <th>Container type</th>
+        <th>Line</th>
+        <th>Created on</th>
+        <th>Created by</th>
+    </tr>
+
+    {% for preinfo in preinfos %}
+        <tr class="selectable-row" data-preinfo-id="{{ preinfo.id }}">
+            <td style="display: none;"><input type="radio" name="preinfo_select" value="{{ preinfo.id }}"></td>
+            <td>{{ preinfo.id }}</td>
+            <td>{{ preinfo.container_number }}</td>
+            <td>{{ preinfo.container_type }}</td>
+            <td>{{ preinfo.line.short_name }}</td>
+            <td>{{ preinfo.created_on }}</td>
+            <td>{{ preinfo.created_by.username }}</td>
+        </tr>
+    {% endfor %}
+</table>
+
+    <div class="buttons-container">
+        <button id="editBtn" class="btn" disabled>Edit</button>
+        <button id="deleteBtn" class="btn" disabled>Delete</button>
+    </div>
+
+    <!-- Modal -->
+    <div id="editModal" class="modal" style="display: none;">
+        <div class="modal-content">
+            <span class="close">&times;</span>
+            <h2>Edit Preinfo</h2>
+            <form method="post">
+                {% csrf_token %}
+                <input type="hidden" name="preinfo_id" id="preinfoIdInput">
+                {{ form.as_p }}
+                <button type="submit">Save</button>
+            </form>
+        </div>
+    </div>
+
+    <style>
+        .selectable-row {
+            cursor: pointer;
+        }
+        .selected-row {
+            background-color: #e6f3ff;
+        }    
+        .modal {
+            display: none;
+            position: fixed;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background-color: rgba(0,0,0,0.4);
+        }
+        .modal-content {
+            background-color: #fefefe;
+            margin: 15% auto;
+            padding: 20px;
+            border: 1px solid #888;
+            width: 80%;
+            max-width: 500px;
+        }
+        .close {
+            float: right;
+            cursor: pointer;
+        }
+        .btn[disabled] {
+            opacity: 0.5;
+            cursor: not-allowed;
+        }
+    </style>
+
+    <script>
+        document.addEventListener('DOMContentLoaded', function() {
+            const editBtn = document.getElementById('editBtn');
+            const deleteBtn = document.getElementById('deleteBtn');
+            const modal = document.getElementById('editModal');
+            const closeBtn = document.querySelector('.close');
+            const preinfoIdInput = document.getElementById('preinfoIdInput');
+            const rows = document.querySelectorAll('.selectable-row');
+
+            rows.forEach(row => {
+                row.addEventListener('click', function() {
+                    // Remove previous selection
+                    document.querySelector('.selected-row')?.classList.remove('selected-row');
+                    
+                    // Select current row
+                    this.classList.add('selected-row');
+                    
+                    // Check the hidden radio button
+                    const radio = this.querySelector('input[type="radio"]');
+                    radio.checked = true;
+                    
+                    // Enable buttons
+                    editBtn.disabled = false;
+                    deleteBtn.disabled = false;
+                });
+            });            
+            
+            // Enable/disable buttons based on selection
+            document.querySelectorAll('input[name="preinfo_select"]').forEach(radio => {
+                radio.addEventListener('change', function() {
+                    console.log('Radio button changed:', this.value);  // Debug log
+                    editBtn.disabled = false;
+                    deleteBtn.disabled = false;
+                });
+            });
+
+            // Edit button click
+            editBtn.addEventListener('click', function() {
+                const selectedId = document.querySelector('input[name="preinfo_select"]:checked').value;
+                preinfoIdInput.value = selectedId;
+            
+                // Fetch preinfo data via AJAX
+                const formData = new FormData();
+                formData.append('preinfo_id', selectedId);
+            
+                fetch('', {
+                    method: 'POST',
+                    body: formData,
+                    headers: {
+                        'X-Requested-With': 'XMLHttpRequest',
+                        'X-CSRFToken': document.querySelector('[name=csrfmiddlewaretoken]').value
+                    }
+                })
+                .then(response => response.json())
+                .then(data => {
+                    document.getElementById('id_container_number').value = data.container_number;
+                    document.getElementById('id_container_type').value = data.container_type;
+                    document.getElementById('id_line').value = data.line;
+                    modal.style.display = 'block';
+                });
+            });
+
+            // Close modal
+            closeBtn.addEventListener('click', function() {
+                modal.style.display = 'none';
+            });
+
+            // Close modal when clicking outside
+            window.addEventListener('click', function(event) {
+                if (event.target == modal) {
+                    modal.style.display = 'none';
+                }
+            });
+        });
+    </script>
+{% endblock content %}