add select imposicion datatable

ci4/app/Controllers/Configuracion/Imposiciones.php

@@ -106,6 +106,11 @@ class Imposiciones extends BaseController
     {
         if ($imposicion_id) {
             $bodyData = $this->request->getPost();
+            if(isset($bodyData["imposicion_esquema_id"])){
+                if($bodyData["imposicion_esquema_id"] == ""){
+                    $bodyData["imposicion_esquema_id"] = null;
+                }
+            }
             $status = $this->model->update($imposicion_id, $bodyData);
             if ($status) {
                 $imposicionEntity = $this->model->find($imposicion_id);
@@ -148,9 +153,10 @@ class Imposiciones extends BaseController
     {
         $q = $this->model->queryDatatable();
         return DataTable::of($q)
+            ->add('esquema', fn($q) => ["imposicionId" => $q->id,"esquemaId" => $q->esquemaId, "esquemaName" => $q->esquemaName])
             ->add(
                 'action',
-                fn($q) => "<div class='btn-group btn-group-md gap-2 w-100 d-flex justify-space-between'>". ImposicionModel::datatable_buttons($q->id)."</div>"
+                fn($q) => "<div class='btn-group btn-group-md gap-2 w-100 d-flex justify-space-between'>" . ImposicionModel::datatable_buttons($q->id) . "</div>"
             )
             ->toJson(true);
     }
@@ -160,7 +166,7 @@ class Imposiciones extends BaseController
         return DataTable::of($q)
             ->add(
                 'action',
-                fn($q) => "<div class='btn-group btn-group-md gap-2'>". ImposicionEsquemaModel::datatable_buttons($q->id)."</div>"
+                fn($q) => "<div class='btn-group btn-group-md gap-2'>" . ImposicionEsquemaModel::datatable_buttons($q->id) . "</div>"
             )
             ->toJson(true);
     }

ci4/app/Database/Migrations/2025-04-18-213000_AddFkEsquemaImposiciones.php

@@ -15,9 +15,10 @@ class AddFkEsquemaImposiciones extends Migration
             "imposicion_esquema_id" => [
                 "type" => "INT",
                 "unsigned" => true,
+                "null" => true
             ]
         ]);
-        $this->forge->addForeignKey(["imposicion_esquema_id"],"imposicion_esquemas",["id"]);
+        $this->forge->addForeignKey(["imposicion_esquema_id"],"imposicion_esquemas",["id"],'SET NULL','SET NULL');
         $this->forge->processIndexes("lg_imposiciones");
     }
 

ci4/app/Models/Configuracion/ImposicionEsquemaModel.php

@@ -93,7 +93,7 @@ class ImposicionEsquemaModel extends Model
             "id",
             "name",
             "svg_schema as description"
-        ]);
+        ])->where('deleted_at', null);
         if ($q) {
             $query->orLike("name", $q);
         }

ci4/app/Models/Configuracion/ImposicionModel.php

@@ -143,14 +143,18 @@ class ImposicionModel extends BaseModel
     {
         return $this->builder()
             ->select([
-                "id",
+                "lg_imposiciones.id",
-                "ancho",
+                "lg_imposiciones.ancho",
-                "alto",
+                "lg_imposiciones.alto",
-                "unidades",
+                "lg_imposiciones.unidades",
-                "maquina",
+                "lg_imposiciones.maquina",
-                "orientacion",
+                "lg_imposiciones.orientacion",
-                "etiqueta"
+                "lg_imposiciones.etiqueta",
-            ])->where('deleted_at', null);
+                "imposicion_esquemas.id as esquemaId",
+                "imposicion_esquemas.name as esquemaName"
+            ])
+            ->join("imposicion_esquemas","imposicion_esquemas.id = lg_imposiciones.imposicion_esquema_id","left")
+            ->where('lg_imposiciones.deleted_at', null);
     }
     public static function datatable_buttons(int $id)
     {

ci4/app/Views/themes/vuexy/form/configuracion/imposiciones/viewImposicionList.php

@@ -1,4 +1,5 @@
 <?= $this->include('themes/_commonPartialsBs/datatables') ?>
+<?= $this->include("themes/_commonPartialsBs/select2bs5") ?>
 <?= $this->include('themes/_commonPartialsBs/sweetalert') ?>
 <?= $this->extend('themes/vuexy/main/defaultlayout') ?>
 <?= $this->section('content');  ?>
@@ -31,6 +32,7 @@
                                     <th><?= lang('Imposiciones.orientacion') ?></th>
                                     <th><?= lang('Imposiciones.maquina') ?></th>
                                     <th><?= lang('Imposiciones.etiqueta') ?></th>
+                                    <th><?= lang('Imposiciones.imposicion_esquema') ?></th>
                                     <th class="text-nowrap"><?= lang('Basic.global.Action') ?></th>
                                 </tr>
                             </thead>

httpdocs/assets/js/safekat/components/datatables/ImposicionDatatable.js

@@ -1,3 +1,6 @@
+import ClassSelect from "../select2.js";
+import Ajax from "../ajax.js";
+
 
 class ImposicionDatatable {
     constructor(domItem) {
@@ -10,6 +13,7 @@ class ImposicionDatatable {
             { data: 'orientacion', searchable: true, sortable: true },
             { data: 'maquina', searchable: true, sortable: true },
             { data: 'etiqueta', searchable: true, sortable: true },
+            { data: 'esquema', searchable: true, sortable: true, render: this.renderImposicionEsquemaCell.bind(this) },
             { data: 'action', searchable: true, sortable: true },
         ]
         this.datatableEsquemaColumns = [
@@ -27,7 +31,7 @@ class ImposicionDatatable {
                 bottomEnd: 'paging'
             },
             columnDefs: [
-                { className: 'dt-center', targets: '_all' },
+                { className: 'dt-center', targets: [0, 1, 2, 3, 4, 5, 6] },
             ],
             serverSide: true,
             pageLength: 25,
@@ -36,29 +40,43 @@ class ImposicionDatatable {
             },
             columns: this.datatableColumns,
             ajax: '/imposiciones/datatable',
+            createdRow: (row, data, dataIndex) => {
+                this.createSelectImposicion(row, data)
+            }
         });
+        // this.datatable.on("draw.dt", this.createSelectImposicion.bind(this))
+        this.item.on("change", ".imposicion-esquema-select", this.handleChangeImposicionEsquema.bind(this))
     }
-    initEsquema() {
+
-        this.datatableEsquema = this.item.DataTable({
+    renderImposicionEsquemaCell(d, t) {
-            processing: true,
+        return `<select name="imposicion_esquema_id" data-id="${d.imposicionId}" class="select2 form-control imposicion-esquema-select"  data-input>
-            layout: {
+            </select>`
-                topStart: 'pageLength',
-                topEnd: 'search',
-                bottomStart: 'info',
-                bottomEnd: 'paging'
-            },
-            columnDefs: [
-                { className: 'dt-center', targets: '_all' },
-            ],
-            serverSide: true,
-            pageLength: 25,
-            language: {
-                url: "/themes/vuexy/vendor/libs/datatables-sk/plugins/i18n/es-ES.json"
-            },
-            columns: this.datatableEsquemaColumns,
-            ajax: '/imposiciones/esquema/datatable',
-        });
     }
+    createSelectImposicion(row, data) {
+        let selectEsquema = new ClassSelect($(row).find(".imposicion-esquema-select"), '/imposiciones/esquema/select', 'Seleccione un esquema', true)
+        selectEsquema.init()
+        if (data.esquema.esquemaId) {
+            selectEsquema.setOption(data.esquema.esquemaId, data.esquema.esquemaName)
+        }
+    }
+    handleChangeImposicionEsquema(event) {
+        let imposicionId = $(event.currentTarget).data("id")
+        let ajax = new Ajax(`/imposiciones/${imposicionId}`,
+            {
+                "imposicion_esquema_id": $(event.currentTarget).val(),
+            },
+            null,
+            this.handleChangeImposicionEsquemaSuccess.bind(this),
+            this.handleChangeImposicionEsquemaError.bind(this))
+        if (imposicionId) {
+            ajax.post()
+        }
+    }
+    handleChangeImposicionEsquemaSuccess(response) {
+        popSuccessAlert(response.message)
+    }
+    handleChangeImposicionEsquemaError() { }
+
 
 
 }

httpdocs/assets/js/safekat/components/forms/ImposicionEsquemaForm.js

@@ -4,7 +4,12 @@ import ImposicionEsquemaDrawing from '../imposicionEsquemaDrawing.js';
 class ImposicionEsquemaForm {
     constructor(domItem) {
         this.item = domItem
-        this.drawing = new ImposicionEsquemaDrawing($("#imposicion-esquema-drawing"))
+        if ($("#imposicion-esquema-drawing").length > 0) {
+
+            this.drawing = new ImposicionEsquemaDrawing($("#imposicion-esquema-drawing"))
+        } else {
+            this.drawing = null
+        }
         this.modelId = this.item.data("id");
         this.btnSubmitUpdateImposicion = this.item.find("#btnSubmitUpdateImposicionEsquema")
         this.btnSubmitNewImposicion = this.item.find("#btnSubmitNewImposicionEsquema")
@@ -29,31 +34,34 @@ class ImposicionEsquemaForm {
 
     }
     init() {
-        this.item.on("change", "#esquema-rows", (event) => {
+        if (this.drawing) {
-            let rows = $(event.currentTarget).val()
+            this.drawing.setOrientation($("#esquema-orientacion").val())
-            this.drawing.setRows(rows)
+            this.item.on("change", "#esquema-rows", (event) => {
-        })
+                let rows = $(event.currentTarget).val()
-        this.item.on("change", "#esquema-rotativa", (event) => {
+                this.drawing.setRows(rows)
-            let rotativa = $(event.currentTarget).prop("checked")
+            })
-            this.drawing.setRotativa(rotativa)
+            this.item.on("change", "#esquema-rotativa", (event) => {
-        })
+                let rotativa = $(event.currentTarget).prop("checked")
-        this.item.on("change", "#esquema-cosido", (event) => {
+                this.drawing.setRotativa(rotativa)
-            let cosido = $(event.currentTarget).prop("checked")
+            })
-            this.drawing.setCosido(cosido)
+            this.item.on("change", "#esquema-cosido", (event) => {
-        })
+                let cosido = $(event.currentTarget).prop("checked")
-        this.item.on("change", "#esquema-orientacion", (event) => {
+                this.drawing.setCosido(cosido)
-            let orientation = $(event.currentTarget).val()
+            })
-            this.drawing.setOrientation(orientation)
+            this.item.on("change", "#esquema-orientacion", (event) => {
-        })
+                let orientation = $(event.currentTarget).val()
-        this.item.on("change", "#esquema-columns", (event) => {
+                this.drawing.setOrientation(orientation)
-            let columns = $(event.currentTarget).val()
+            })
-            this.drawing.setColumns(columns)
+            this.item.on("change", "#esquema-columns", (event) => {
-        })
+                let columns = $(event.currentTarget).val()
-        if (this.modelId) {
+                this.drawing.setColumns(columns)
-            this.btnSubmitUpdateImposicion.on("click", this.handleUpdate.bind(this))
+            })
-            this.handleGetData()
+            if (this.modelId) {
-        } else {
+                this.btnSubmitUpdateImposicion.on("click", this.handleUpdate.bind(this))
-            this.initNew()
+                this.handleGetData()
+            } else {
+                this.initNew()
+            }
         }
     }
     initNew() {
@@ -156,6 +164,7 @@ class ImposicionEsquemaForm {
         this.disable()
         this.item.find(".invalid-feedback").remove()
         this.btnSubmitNewImposicion.addClass("d-none")
+        this.btnSubmitUpdateImposicion.addClass("d-none")
         popSuccessAlert(response.message)
     }
     postErrorNew(error) {

httpdocs/assets/js/safekat/components/imposicionEsquemaDrawing.js

@@ -7,14 +7,18 @@ class ImposicionEsquemaDrawing {
             height: 100,
         }
         this.rectangleCosidoDimensions = {
-            width: 50*2,
+            width: 50 * 2,
             height: 100,
         }
         this.offsetX = this.rectangleDimensions.width + 20
         this.offsetY = this.rectangleDimensions.height + 20
         this.offsetCosidoX = this.rectangleCosidoDimensions.width + 20
         this.offsetCosidoY = this.rectangleCosidoDimensions.height + 20
-        this.dw = new Two(this.params).appendTo(this.item[0])
+        this.dw = null
+        if (this.item.length > 0) {
+
+            this.dw = new Two(this.params).appendTo(this.item[0])
+        }
         this.rows = 1
         this.columns = 1
         this.rotativa = false
@@ -87,10 +91,10 @@ class ImposicionEsquemaDrawing {
     }
     drawRowsCosido(y = 0) {
         for (let index = 0; index < this.columns; index++) {
-            let rectangle = this.dw.makeRectangle(this.rectangleCosidoDimensions.width/2  + this.offsetCosidoX * index , this.rectangleCosidoDimensions.height /2 + y, this.rectangleCosidoDimensions.width, this.rectangleCosidoDimensions.height)
+            let rectangle = this.dw.makeRectangle(this.rectangleCosidoDimensions.width / 2 + this.offsetCosidoX * index, this.rectangleCosidoDimensions.height / 2 + y, this.rectangleCosidoDimensions.width, this.rectangleCosidoDimensions.height)
-            let textA = this.dw.makeText("N", this.rectangleCosidoDimensions.width/4 + this.offsetCosidoX * index, this.rectangleCosidoDimensions.height /2 + y)
+            let textA = this.dw.makeText("N", this.rectangleCosidoDimensions.width / 4 + this.offsetCosidoX * index, this.rectangleCosidoDimensions.height / 2 + y)
-            let textB = this.dw.makeText("1", this.rectangleCosidoDimensions.width*3/4 + this.offsetCosidoX * index, this.rectangleCosidoDimensions.height /2 + y)
+            let textB = this.dw.makeText("1", this.rectangleCosidoDimensions.width * 3 / 4 + this.offsetCosidoX * index, this.rectangleCosidoDimensions.height / 2 + y)
-            let line = this.dw.makeLine(rectangle.position.x,y,rectangle.position.x,this.rectangleCosidoDimensions.height + y)
+            let line = this.dw.makeLine(rectangle.position.x, y, rectangle.position.x, this.rectangleCosidoDimensions.height + y)
 
             this.textShapes.push(textA)
             this.textShapes.push(textB)
@@ -124,10 +128,10 @@ class ImposicionEsquemaDrawing {
     drawOrientationCosido() {
         let vector;
         if (this.orientation == "H") {
-            vector = this.dw.makeArrow(-this.rectangleDimensions.width/2, (this.offsetCosidoY) * this.rows, (this.offsetCosidoX) * (this.columns), (this.offsetCosidoY) * this.rows)
+            vector = this.dw.makeArrow(-this.rectangleDimensions.width / 2, (this.offsetCosidoY) * this.rows, (this.offsetCosidoX) * (this.columns), (this.offsetCosidoY) * this.rows)
             this.dw.renderer.setSize((this.offsetCosidoX) * this.columns, (this.offsetCosidoY) * this.rows)
-            let width = (this.offsetCosidoX) * this.columns*1.1
+            let width = (this.offsetCosidoX) * this.columns * 1.1
-            let height = (this.offsetCosidoY) * this.rows * 1.1 
+            let height = (this.offsetCosidoY) * this.rows * 1.1
             Two.SVGRenderer.Utils.setAttributes(this.dw.renderer.domElement, { viewBox: `0 0 ${width} ${height}` })
         } else {
             vector = this.dw.makeArrow((this.offsetCosidoX) * this.columns, 0, (this.offsetCosidoX) * this.columns, (this.offsetCosidoY) * this.rows)
@@ -141,23 +145,29 @@ class ImposicionEsquemaDrawing {
         this.vectorShapes.push(vector)
     }
     drawSchema() {
+    
         this.remove();
         for (let index = 0; index < this.rows; index++) {
-            if(this.cosido){
+            if (this.cosido) {
                 this.drawRowsCosido(this.offsetY * index)
-            }else{
+            } else {
                 this.drawRows(this.offsetY * index)
             }
         }
-        if(this.cosido){
+        if (this.cosido) {
             this.drawOrientationCosido()
-        }else{
+        } else {
             this.drawOrientation()
         }
         this.dw.update()
     }
     getSVG() {
-        return this.dw.renderer.domElement.outerHTML
+        if (this.dw) {
+
+            return this.dw.renderer.domElement.outerHTML
+        } else {
+            return null
+        }
     }
 }
 

httpdocs/assets/js/safekat/pages/configuracion/imposiciones/imposicion.js

@@ -20,6 +20,9 @@ class Imposicion {
         this.imposicionEsquemaDatatable.init()
         this.itemTable.on("click", ".imposicion-delete", this.deleteRow.bind(this))
         this.itemEsquemaTable.on("click", ".imposicion-esquema-delete", this.deleteEsquemaRow.bind(this))
+        this.imposicionEsquemaForm = new ImposicionEsquemaForm(this.itemEsquemaForm)
+        this.imposicionForm = new ImposicionForm(this.itemForm)
+
 
     }
     edit() {
@@ -47,7 +50,7 @@ class Imposicion {
         alertConfirmationDelete().then((result) => {
             if (result.isConfirmed) {
                 this.imposicionEsquemaForm.handleDelete(modelId)
-                this.imposicionEsquemaDatatable.datatableEsquema.ajax.reload()
+                this.imposicionEsquemaDatatable.datatable.ajax.reload()
             }
         })
     }