CRUD de Servicios Demo

8/18/2019 CRUD de Servicios Demo

1/24

CRUD de Servicios

Index.php

Personal Grupo Hurtado

//Las siguientes 5 líneas de código invocan al grid de servicios, además de darle formato al

mismo.

//Las siguientes líneas crean una ventana oculta de editar servicios

Editar


2/24

Servicio:

Descripcion:

Fecha_Servicio:

Costo:

Vehiculo:


3/24

Proveedor:

No_Factura:

// Este es el fin de la ventana emergente de editar servicios.

// Las siguientes líneas crean el botón de exportar el contenido de grid a un archivo Excel.


4/24

// Este es el fin del código que crea el botón de exportar a Excel.

// Fin del index.php del crud de vehículos.

Servicios.class.php

Este archivo php contiene las funciones que conectan con el servidor MySQL


5/24

// Función de conexión

function conMySQL(){

global $server;

// Variables de conexión

$user = $server['muser'];

$pass = $server['mpass'];

$serv = $server['mserver'];

// Conexión a MySQL mediante PDO.

$this->cMySQL = new PDO('mysql:host='.$serv.';dbname=control_vehicular;charset=utf8',

"$user", "$pass", array(PDO::ATTR_EMULATE_PREPARES => false,

PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,

PDO::MYSQL_ATTR_INIT_COMMAND => "SET NAMES utf8"));

}

// Función para obtener datos del servicio

function getServicios(){

// Consulta para obtener servicios mecánicos

$consulta = "SELECT s.idservicio, s.tipo, ts.tipo as tipo2, s.descripcion, s.fecha_servicio,

s.costo, s.idvehiculo, CONCAT('Vehiculo: ', m.marca,' color: ', c.color, ' adquirido: ',

v.fechaadquisicion) as vehiculo, s.idproveedor, CONCAT('', p.razon_social,', Encargado: ',

p.nombre) as proveedor, s.nofactura FROM control_vehicular.servicios as s,

control_vehicular.catalogo_tipo_servicio as ts, control_vehicular.vehiculos as v,

control_vehicular.catalogo_color as c, control_vehicular.catalogo_marca as m,

control_vehicular.proveedor as p WHERE s.idservicio > 0 and

s.tipo=ts.idcatalogo_tipo_servicio and v.color=c.idcatalogo_color and

s.idvehiculo=v.idvehiculo and v.idvehiculo > 0 and v.marca=m.idcatalogo_marca and

v.estatus = 'activo' and c.estatus = 'activo' and m.estatus = 'activo' and


6/24

s.idproveedor=p.idproveedor and p.idproveedor > 0 and p.estatus = 'activo' and s.estatus =

'activo' and ts.estatus= 'activo'";

//Ejecución de la consulta.

$query = $this->cMySQL->query($consulta);

// Retorno de resultados de la consulta.

return json_encode($query->fetchAll(PDO::FETCH_ASSOC));

}

// Consultas para obtener catálogos

// Catalogo de tipos de servicios mecánicos

function getCatalogoTS(){ //$empresa = "4"

$consulta = "SELECT idcatalogo_tipo_servicio,tipo FROM

control_vehicular.catalogo_tipo_servicio WHERE estatus = 'activo' ORDER BY

idcatalogo_tipo_servicio";



}

// Catalogo de vehiculos

function getCatalogoV(){

$consulta = "SELECT v.idvehiculo, CONCAT('Vehiculo: ', m.marca,' color: ', c.color, '

adquirido: ', v.fechaadquisicion) as vehiculo FROM control_vehicular.vehiculos as v,

control_vehicular.catalogo_marca as m, control_vehicular.catalogo_color as c WHERE

v.color=c.idcatalogo_color and v.marca=m.idcatalogo_marca and v.estatus= 'activo' and

m.estatus= 'activo' and c.estatus= 'activo'";




7/24

}

// Catalogo de mecanicos

function getCatalogoC(){

$consulta = "SELECT idproveedor, CONCAT('', razon_social,', Encargado: ', nombre) as

nombre FROM control_vehicular.proveedor WHERE estatus = 'activo' ORDER BY

idproveedor";



}

// Fin de consultas de catalogos

// Actualizar Servicios

function ActualizaServicios($idservicio, $tipo, $descripcion, $fecha_servicio, $costo,

$idvehiculo, $idproveedor, $nofactura){

// La función pide como parámetros datos de la ventana emergente de editar servicios para poder actualizar.

$msg = "";

$qryI = "";

$ok = "ok";

//Dentro del try se trata de hacer la actualización de los datos y la recarga de la pantalla para

que se aprecie la actualización del registro.

try{

$this->cMySQL->beginTransaction();


8/24

$qryI = "UPDATE control_vehicular.servicios SET tipo = '$tipo', descripcion =

'$descripcion', fecha_servicio = '$fecha_servicio', costo = '$costo', idvehiculo =

'$idvehiculo', idproveedor = '$idproveedor', nofactura = '$nofactura' WHERE idservicio =

'$idservicio'";

$msg = "Registro Actualizado";

$stmt = $this->cMySQL->prepare($qryI);

$stmt->execute();

$registro=$this->cMySQL->lastInsertId();

$this->cMySQL->commit();

}

// Si el try no funciona se restablece a un estado anterior mediante la función rollBack() para

no tener errores dentro de la base de datos.

catch(PDOException $ex){

$this->cMySQL->rollBack();

$msg = $ex->getMessage();

$ok = "error";

}

}

//Esta función actualiza el estatus del servicio para darlo de baja.

function ActualizaEstatus($idservicio){

$msg = "";

$qryI = "";

$ok = "ok";


9/24

// Dentro del try se hace la consulta si el parámetro existe y no hay error durante el proceso

se da de baja el registro.

try{

$this->cMySQL->beginTransaction();

$qryI = "UPDATE control_vehicular.servicios SET estatus = 'inactivo'

WHERE idservicio = '$idservicio'";

$msg = "Registro Actualizado";

$stmt = $this->cMySQL->prepare($qryI);

$stmt->execute();

$registro=$this->cMySQL->lastInsertId();

$this->cMySQL->commit();

}

// Si el try no funciona se restablece a un estado anterior mediante la función rollBack() para

no tener errores dentro de la base de datos.

catch(PDOException $ex){

$this->cMySQL->rollBack();

$msg = $ex->getMessage();

$ok = "error";

}

}


10/24

//La función procesar se encarga de enviar y recibir la información de las consultas MySQL

realizadas en las funciones anteriores.

function procesar(){

if (isset($_POST['getservicios'])){

echo $this->getServicios("04");

}

if (isset($_POST['getcatalogots'])){

echo $this->getCatalogoTS("04");

}

if (isset($_POST['getcatalogov'])){

echo $this->getCatalogoV("04");

}

if (isset($_POST['getcatalogoc'])){

echo $this->getCatalogoC("04");

}

if (isset($_POST['actualizaServicios'])){

echo $this->ActualizaServicios($_POST['idservicio'], $_POST['tipo'],

$_POST['descripcion'], $_POST['fecha_servicio'], $_POST['costo'],

$_POST['idvehiculo'], $_POST['idproveedor'], $_POST['nofactura']);

}

if (isset($_POST['actualizaEstatus'])){

echo $this->ActualizaEstatus($_POST['idservicio']);

}


11/24

}

}

// Fin de la función procesar

// Objeto de la clase de operaciones.

$obj = new operaciones();

?>

//Fin de vehículos.class.php

Servicio.js

$(document).ready(function () {

var theme = "";

// Datos de catálogos

// Datos de catálogo de marcas

var srcCTS = {

async: false,

datatype: "json",

datafields: [

{name: 'idcatalogo_tipo_servicio', type: 'integer'},

{name: 'tipo', type: 'string'}

],

type: 'POST',

url: 'servicio.class.php',

root: 'data',


12/24

id: "idcatalogo_tipo_servicio",

data: {

getcatalogots: 'y',

}

};

var daCTS = new $.jqx.dataAdapter(srcCTS);

// Datos de catalogo de clases

var srcCVehiculo = {

async: false,

datatype: "json",

datafields: [

{name: 'idvehiculo', type: 'integer'},

{name: 'vehiculo', type: 'string'}

],

type: 'POST',


root: 'data',

id: "idvehiculo",

data: {

getcatalogov: 'y',

}

};

var daCVehiculos = new $.jqx.dataAdapter(srcCVehiculo);


13/24

// Datos de catálogo de proveedores

var srcCProveedor = {

async: false,

datatype: "json",

datafields: [

{name: 'idproveedor', type: 'integer'},

{name: 'nombre', type: 'string'}

],

type: 'POST',


root: 'data',

id: "idproveedor",

data: {

getcatalogoc: 'y',

}

};

var daCProveedores = new $.jqx.dataAdapter(srcCProveedor);

// Función para dar formato a tipo date para el php

function Fecha2Str(fecha) {

return ([fecha.getFullYear(), fecha.getMonth() + 1 < 10 ? "0" + (fecha.getMonth() + 1) :

fecha.getMonth() + 1, fecha.getDate() < 10 ? "0" + fecha.getDate() :

fecha.getDate()].join('/'));


14/24

}

// Datos de grid o tabla principal que se muestra en el index.php

var srcServicios = {

async: false,

datatype: "json",

datafields: [

{name: 'idservicio', type: 'integer'},

{name: 'tipo', type: 'integer'},

{name: 'tipo2', type: 'string'},

{name: 'descripcion', type: 'string'},

{name: 'fecha_servicio', type: 'date', format: 'yyyy-MM-dd'},

{name: 'costo', type: 'double'},

{name: 'idvehiculo', type: 'integer'},

{name: 'vehiculo', type: 'string'},

{name: 'idproveedor', type: 'integer'},

{name: 'proveedor', type: 'string'},

{name: 'nofactura', type: 'string'}

],

type: 'POST',


root: 'data',

data: {


15/24

getservicios: 'y',

}

};

var daServicios = new $.jqx.dataAdapter(srcServicios);

// Inicializar los campos de la ventana emergente de editar

//Elemento lista desplegable de tipo

$("#tipo").jqxDropDownList({ selectedIndex: -1, source: daCTS, displayMember: "tipo",

valueMember: "idcatalogo_tipo_servicio", width: 150, height: 23, placeHolder:"ServicioMecanico:" });

//Elemento de área de texto para la descripción

$("#descripcion").jqxTextArea({width: 150, height: 60});

//Elemento calendario para fecha de servicio

$("#fecha_servicio").jqxDateTimeInput({ width: 150, height: 23 });

//elemento de números para modificar el costo

$("#costo").jqxNumberInput({spinMode: 'simple', width: 150, height: 23, min: 0,

decimalDigits: 0, spinButtons: true });

//Elemento lista desplegable de vehiculos

$("#idvehiculo").jqxDropDownList({ selectedIndex: -1, source: daCVehiculos,

displayMember: "vehiculo", valueMember: "idvehiculo", width: 150, height: 23,

placeHolder:"Vehiculos:" });

//Elemento lista desplegable de proveedor

$("#idproveedor").jqxDropDownList({ selectedIndex: -1, source: daCProveedores,

displayMember: "nombre", valueMember: "idproveedor", width: 150, height: 23,

placeHolder:"Proveedor:" });


16/24

//Elemento de entrada simple de texto para capturar el número de factura

$("#nofactura").jqxInput({width: 150, height: 23});

// Botón de cancelar

$("#Cancel").jqxButton({ theme: theme });

//Ventana emergente

$("#popupWindow").jqxWindow({width: 450, resizable: false, isModal: true, autoOpen:

false, cancelButton: $("#Cancel"), modalOpacity: 0.01});

//Botón de guardar función que realizará cuando se de click

$("#save").jqxButton({ theme: theme }).click(function (){

//Arreglo que contiene los datos del registro utilizado para la función de actualizar servicios

en el archivo servicio.class.php

var reg = {

idservicio : $("#idservicio").val(),

tipo : $("#tipo").val(),

descripcion : $("#descripcion").val(),

fecha_servicio : Fecha2Str($("#fecha_servicio").jqxDateTimeInput('value')),

costo : $("#costo").val(),

idvehiculo : $("#idvehiculo").val(),

idproveedor : $("#idproveedor").val(),

nofactura : $("#nofactura").val(),

actualizaServicios : 'y'

}


17/24

//Función que evalúa si existen realmente valores en el registro.

if(reg.idservicio && reg.tipo && reg.descripcion && reg.fecha_servicio && reg.costo &&

reg.idvehiculo && reg.idproveedor && reg.nofactura){

//Si la condición se cumple se realiza la actualización del registro.

$.ajax({

async: false,


type: 'POST',

dataType: 'xml/html/script/json/jsonp',

data: reg,

complete: function(data, xhr, textStatus){

daServicios.dataBind();

},

success: function(data, textStatus, xhr) {

},

error: function(xhr, textStatus, errorThrown) {}

});

}else{

// En caso contrario de no cumplirse se manda una alerta diciendo que los datos no están

completos y estos deben ser verificados.

alert("No se han proporcionado los datos completos, por favor verifíquelos");

}

});


18/24

// Creación del botón de guardar

$("#popupWindow").jqxWindow({

width: 450, resizable: false, isModal: true, autoOpen: false, cancelButton: $("#save"),

modalOpacity: 0.01});

//Creación del grid o tabla principal que muestra la información del crud

$("#jqxgrid").jqxGrid(

{

width: "100%",

source: daServicios,

showfilterrow: true,

filterable: true,

pageable: true,

autoheight: true,

sortable: true,

altrows: true,

columnsresize: true,

enabletooltips: true,

editable: false,

selectionmode: 'multiplecellsadvanced',

columns: [

{ text: 'ID', datafield: 'idservicio', hidden: true},

{ text: 'tipo', datafield: 'tipo', cellsalign: 'right', align: 'right', width: "8%", hidden: true },


19/24

{ text: 'SERVICIO MECANICO', datafield: 'tipo2', columntype: 'textbox', filtertype:

'textbox', cellsalign: 'right', align: 'right', width: "10%"},

{ text: 'DESCRIPCION', datafield: 'descripcion', columntype: 'textbox', filtertype: 'textbox',

cellsalign: 'right', align: 'right', width: "16%" },

{ text: 'FECHA DE SERVICIO', datafield: 'fecha_servicio', columntype: 'datetimeinput',

filtertype: 'date', cellsalign: 'right', cellsformat: 'dd/MM/yyyy', width: "10%" },

{ text: 'COSTO', datafield: 'costo', columntype: 'textbox', filtertype: 'textbox', cellsalign:

'right', width: "5%" },

{ text: 'idvehiculo', datafield: 'idvehiculo', align: 'right', cellsalign: 'right', width: "8%",

hidden: true },

{ text: 'VEHICULO', datafield: 'vehiculo', columntype: 'textbox', filtertype: 'textbox',

cellsalign: 'right', align: 'right', width: "30%"},

{ text: 'idproveedor', datafield: 'idproveedor', cellsalign: 'right', width: "8%", hidden: true },

{ text: 'PROVEEDOR', datafield: 'proveedor', columntype: 'textbox', filtertype: 'textbox',

cellsalign: 'right', align: 'right', width: "30%"},

{ text: 'NO_FACTURA', datafield: 'nofactura', columntype: 'textbox', filtertype: 'textbox',cellsalign: 'right', width: "8%" },

{ text: 'EDITAR', datafield: 'Editar', columntype: 'button', width: "8%", cellsrenderer:

function () {

return "Editar";

}, buttonclick: function (fila) {

// Cuando el usuario de click en el botón de editar, se pasaran los datos del registroseleccionado a la ventana emergente, para que puedan ser modificados, para lograr esto se

debe primero inicializar los campos y luego validar que se envíen de la siguiente forma:

editrow = fila;

var offset = $("#jqxgrid").offset();


20/24

$("#popupWindow").jqxWindow({ position: { x: parseInt(offset.left) + 100, y:

parseInt(offset.top) + 100 } });

var dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow);

// ID del servicio

$("#idservicio").val(dataRecord.idservicio);

//Catálogo de tipo de servicio

if ($("#tipo").jqxDropDownList('getItemByValue', dataRecord.tipo))

$("#tipo").jqxDropDownList('selectItem',dataRecord.tipo);

else

$("#tipo").jqxDropDownList('selectItem',"OTRO");

// Descripción de servicio

$("#descripcion").val(dataRecord.descripcion);

//Fecha de servicio

if (dataRecord.fecha_servicio=='0000-00-00'){

parts =dataRecord.fecha_servicio.replace('/', '-').split('-');

fecha = new Date(parts[0], parts[1]-1, parts[2]);

$("#fecha_servicio").jqxDateTimeInput({ value: new Date(fecha) });

}else

$("#fecha_servicio").jqxDateTimeInput({ value: dataRecord.fecha_servicio });

// Costo

$("#costo").val(dataRecord.costo);

$("#costo").jqxNumberInput({ decimal: dataRecord.costo });

// Catalogo de vehículos


21/24

if ($("#idvehiculo").jqxDropDownList('getItemByValue', dataRecord.idvehiculo))

$("#idvehiculo").jqxDropDownList('selectItem',dataRecord.idvehiculo);

else

$("#idvehiculo").jqxDropDownList('selectItem',"OTRO");

// Catalogo de mecanicos

if ($("#idproveedor").jqxDropDownList('getItemByValue', dataRecord.idproveedor))

$("#idproveedor").jqxDropDownList('selectItem',dataRecord.idproveedor);

else

$("#idproveedor").jqxDropDownList('selectItem',"OTRO");

//Factura

$("#nofactura").val(dataRecord.nofactura);

// Muestra la ventana emergente

$("#popupWindow").jqxWindow('open');

}

}, // Inicio del botón de bajas

{ text: 'BAJA', datafield: 'Baja', columntype: 'button', width: "8%", cellsrenderer: function

() {

return "Baja";

}, buttonclick: function (fila) {

// La función da de baja el registro al presionar el botón

editrow = fila;

var offset = $("#jqxgrid").offset();

var dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow);


22/24

var reg = {

idservicio : dataRecord.idservicio,

actualizaEstatus : 'y'

}

if(reg.idservicio){

$.ajax({

async: false,


type: 'POST',

dataType: 'xml/html/script/json/jsonp',

data: reg,

complete: function(data, xhr, textStatus){

daServicios.dataBind();

},

success: function(data, textStatus, xhr) {

},

error: function(xhr, textStatus, errorThrown) {}

});

}else{

// Si el parámetro no se encuentra manda una advertencia, señalando que no se han

proporcionado correctamente los datos y deben ser verificados.

alert("No se han proporcionado los datos completos, por favor verifíquelos");

}


23/24

}

}

]

});

// Exportar el contenido de la tabla.

$("#excelExport").jqxButton();

// Función para ocultar las columnas de los botones de editar y baja del grid

function ocultar(){

$("#jqxgrid").jqxGrid('hidecolumn', 'Editar');

$("#jqxgrid").jqxGrid('hidecolumn', 'Baja');

}

// Función para mostrar las columnas de los botones de editar y baja del grid

function mostrar(){

$("#jqxgrid").jqxGrid('showcolumn', 'Editar');

$("#jqxgrid").jqxGrid('showcolumn', 'Baja');

}

//Función que permite exportar el contenido del grid a un archivo de Excel.

function exportar(){

$("#jqxgrid").delay(1000).jqxGrid('exportdata', 'xls', 'Servicio');

}

// Función que se ejecuta al momento de dar click en el botón de exportar a Excel en el

index.php

$("#excelExport").click(function () {


24/24

ocultar();

exportar();

mostrar();

});

});

CRUD de Servicios Demo

Documents

Transcript of CRUD de Servicios Demo