From 969966ac7859a175932292542f24c193e6f7d627 Mon Sep 17 00:00:00 2001 From: amazuecos Date: Mon, 21 Apr 2025 08:32:21 +0200 Subject: [PATCH] add select imposicion datatable --- .../Configuracion/Imposiciones.php | 10 ++- ...-04-18-213000_AddFkEsquemaImposiciones.php | 3 +- .../Configuracion/ImposicionEsquemaModel.php | 2 +- .../Models/Configuracion/ImposicionModel.php | 20 +++--- .../imposiciones/viewImposicionList.php | 2 + .../datatables/ImposicionDatatable.js | 60 +++++++++++------- .../components/forms/ImposicionEsquemaForm.js | 61 +++++++++++-------- .../components/imposicionEsquemaDrawing.js | 38 +++++++----- .../configuracion/imposiciones/imposicion.js | 5 +- 9 files changed, 127 insertions(+), 74 deletions(-) diff --git a/ci4/app/Controllers/Configuracion/Imposiciones.php b/ci4/app/Controllers/Configuracion/Imposiciones.php index 83da4971..e47ad6be 100755 --- a/ci4/app/Controllers/Configuracion/Imposiciones.php +++ b/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) => "
". ImposicionModel::datatable_buttons($q->id)."
" + fn($q) => "
" . ImposicionModel::datatable_buttons($q->id) . "
" ) ->toJson(true); } @@ -160,7 +166,7 @@ class Imposiciones extends BaseController return DataTable::of($q) ->add( 'action', - fn($q) => "
". ImposicionEsquemaModel::datatable_buttons($q->id)."
" + fn($q) => "
" . ImposicionEsquemaModel::datatable_buttons($q->id) . "
" ) ->toJson(true); } diff --git a/ci4/app/Database/Migrations/2025-04-18-213000_AddFkEsquemaImposiciones.php b/ci4/app/Database/Migrations/2025-04-18-213000_AddFkEsquemaImposiciones.php index 83fd8d30..fd0fe949 100644 --- a/ci4/app/Database/Migrations/2025-04-18-213000_AddFkEsquemaImposiciones.php +++ b/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"); } diff --git a/ci4/app/Models/Configuracion/ImposicionEsquemaModel.php b/ci4/app/Models/Configuracion/ImposicionEsquemaModel.php index 448054dd..220ad4b5 100644 --- a/ci4/app/Models/Configuracion/ImposicionEsquemaModel.php +++ b/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); } diff --git a/ci4/app/Models/Configuracion/ImposicionModel.php b/ci4/app/Models/Configuracion/ImposicionModel.php index 02af0411..9fb05470 100755 --- a/ci4/app/Models/Configuracion/ImposicionModel.php +++ b/ci4/app/Models/Configuracion/ImposicionModel.php @@ -143,14 +143,18 @@ class ImposicionModel extends BaseModel { return $this->builder() ->select([ - "id", - "ancho", - "alto", - "unidades", - "maquina", - "orientacion", - "etiqueta" - ])->where('deleted_at', null); + "lg_imposiciones.id", + "lg_imposiciones.ancho", + "lg_imposiciones.alto", + "lg_imposiciones.unidades", + "lg_imposiciones.maquina", + "lg_imposiciones.orientacion", + "lg_imposiciones.etiqueta", + "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) { diff --git a/ci4/app/Views/themes/vuexy/form/configuracion/imposiciones/viewImposicionList.php b/ci4/app/Views/themes/vuexy/form/configuracion/imposiciones/viewImposicionList.php index b1e233f9..8f445874 100644 --- a/ci4/app/Views/themes/vuexy/form/configuracion/imposiciones/viewImposicionList.php +++ b/ci4/app/Views/themes/vuexy/form/configuracion/imposiciones/viewImposicionList.php @@ -1,4 +1,5 @@ include('themes/_commonPartialsBs/datatables') ?> +include("themes/_commonPartialsBs/select2bs5") ?> include('themes/_commonPartialsBs/sweetalert') ?> extend('themes/vuexy/main/defaultlayout') ?> section('content'); ?> @@ -31,6 +32,7 @@ + diff --git a/httpdocs/assets/js/safekat/components/datatables/ImposicionDatatable.js b/httpdocs/assets/js/safekat/components/datatables/ImposicionDatatable.js index 166760be..8b3132be 100644 --- a/httpdocs/assets/js/safekat/components/datatables/ImposicionDatatable.js +++ b/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({ - processing: true, - layout: { - 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', - }); + + renderImposicionEsquemaCell(d, t) { + return `` } + 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() { } + } diff --git a/httpdocs/assets/js/safekat/components/forms/ImposicionEsquemaForm.js b/httpdocs/assets/js/safekat/components/forms/ImposicionEsquemaForm.js index c5183bbb..7110795b 100644 --- a/httpdocs/assets/js/safekat/components/forms/ImposicionEsquemaForm.js +++ b/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) => { - let rows = $(event.currentTarget).val() - this.drawing.setRows(rows) - }) - this.item.on("change", "#esquema-rotativa", (event) => { - let rotativa = $(event.currentTarget).prop("checked") - this.drawing.setRotativa(rotativa) - }) - this.item.on("change", "#esquema-cosido", (event) => { - let cosido = $(event.currentTarget).prop("checked") - this.drawing.setCosido(cosido) - }) - this.item.on("change", "#esquema-orientacion", (event) => { - let orientation = $(event.currentTarget).val() - this.drawing.setOrientation(orientation) - }) - this.item.on("change", "#esquema-columns", (event) => { - let columns = $(event.currentTarget).val() - this.drawing.setColumns(columns) - }) - if (this.modelId) { - this.btnSubmitUpdateImposicion.on("click", this.handleUpdate.bind(this)) - this.handleGetData() - } else { - this.initNew() + if (this.drawing) { + this.drawing.setOrientation($("#esquema-orientacion").val()) + this.item.on("change", "#esquema-rows", (event) => { + let rows = $(event.currentTarget).val() + this.drawing.setRows(rows) + }) + this.item.on("change", "#esquema-rotativa", (event) => { + let rotativa = $(event.currentTarget).prop("checked") + this.drawing.setRotativa(rotativa) + }) + this.item.on("change", "#esquema-cosido", (event) => { + let cosido = $(event.currentTarget).prop("checked") + this.drawing.setCosido(cosido) + }) + this.item.on("change", "#esquema-orientacion", (event) => { + let orientation = $(event.currentTarget).val() + this.drawing.setOrientation(orientation) + }) + this.item.on("change", "#esquema-columns", (event) => { + let columns = $(event.currentTarget).val() + this.drawing.setColumns(columns) + }) + if (this.modelId) { + this.btnSubmitUpdateImposicion.on("click", this.handleUpdate.bind(this)) + 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) { diff --git a/httpdocs/assets/js/safekat/components/imposicionEsquemaDrawing.js b/httpdocs/assets/js/safekat/components/imposicionEsquemaDrawing.js index 406469a3..f6522914 100644 --- a/httpdocs/assets/js/safekat/components/imposicionEsquemaDrawing.js +++ b/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 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 line = this.dw.makeLine(rectangle.position.x,y,rectangle.position.x,this.rectangleCosidoDimensions.height + y) + 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 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) 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 height = (this.offsetCosidoY) * this.rows * 1.1 + let width = (this.offsetCosidoX) * this.columns * 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 + } } } diff --git a/httpdocs/assets/js/safekat/pages/configuracion/imposiciones/imposicion.js b/httpdocs/assets/js/safekat/pages/configuracion/imposiciones/imposicion.js index 14bc9ca9..5d51fd5f 100644 --- a/httpdocs/assets/js/safekat/pages/configuracion/imposiciones/imposicion.js +++ b/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() } }) }