From 40f11382c3f886a8a31b5858a0f15c7755123497 Mon Sep 17 00:00:00 2001 From: Jonathan Alexis Perez Morales Date: Sat, 6 Jul 2024 13:40:59 -0700 Subject: [PATCH 1/2] --Actualizar eventos desde diagrama de grantt --- Ashx/CargaEventos.ashx | 10 +- Transportes/RepContratosCalendario.aspx | 304 ++++++++++++--------- Transportes/RepContratosCalendario.aspx.vb | 8 +- 3 files changed, 181 insertions(+), 141 deletions(-) diff --git a/Ashx/CargaEventos.ashx b/Ashx/CargaEventos.ashx index ed78666f4..42e76b85e 100644 --- a/Ashx/CargaEventos.ashx +++ b/Ashx/CargaEventos.ashx @@ -1,4 +1,4 @@ -<%@ WebHandler Language="VB" Class="CargaEventos" %> +<%@ WebHandler Language="VB" Class="CargaEventos" %> Option Explicit Off Option Strict On @@ -488,7 +488,13 @@ Public Class CargaEventos : Implements IHttpHandler, IRequiresSessionState DT_SubProyectos.Columns.Add("backgroundColor") DT_EstatusOS.Columns.Add("", GetType(Integer)) - If ObjContratos.GetContratos(-1, usuarioActual_.CveEmpresa, TipoContrato:=34) Then + Dim cveContrato As Integer = -1 + + If context.Request("cveContrato") IsNot Nothing Then + cveContrato = context.Request("cveContrato").ToEntero() + End If + + If ObjContratos.GetContratos(cveContrato, usuarioActual_.CveEmpresa, TipoContrato:=34) Then If ObjContratos.DtResultados.Rows.Count > 0 Then diff --git a/Transportes/RepContratosCalendario.aspx b/Transportes/RepContratosCalendario.aspx index 04147c7a9..bd09289db 100644 --- a/Transportes/RepContratosCalendario.aspx +++ b/Transportes/RepContratosCalendario.aspx @@ -94,10 +94,10 @@ <%-- Cliente --%>
-
<%-- Estatus --%> @@ -116,7 +116,7 @@ @@ -500,7 +500,7 @@ - + @@ -627,7 +627,7 @@ series.columns.template.setAll({ templateField: "columnSettings", strokeOpacity: 0, - tooltipText: "{category}: {openValueX} - {valueX}" + tooltipText: "UNIDAD: {unidad} -- CONTRATO: {contrato} -- CÓDIGO: {category} -- DURACIÓN: {openValueX} - {valueX}" }); series.data.processor = am5.DataProcessor.new(root, { @@ -655,12 +655,27 @@ chart.set("scrollbarY", scrollbarY); + + //MOSTRAR MODAL DE CONTRATO AL HACER CLICK + series.columns.template.events.on("click", e => { + let cveContrato = e.target.dataItem.dataContext.cveContrato; + + $('#CveContrato').val(cveContrato); + + let url = '/Ashx/CargaEventos.ashx?METODO=contrato_transportes' ; + let parametros = '&cveContrato=' + cveContrato +'&U=' + '<%= UsuarioActual.CveUsuario %>' + '&E='+ '<%= UsuarioActual.CveEmpresa %>'+ '&tipoVista=' + '<%= RBTipoVista.Text %>' + '&CveUsuarioPara:' + $('#DdlTecnico').val(); + '&CveSubProyecto:' + $('#DdlSubProyecto').val(); + + fetch(url + parametros).then(response => response.json()).then(json => { + console.log(json); + updateEvent(json[0],null,false); + }).catch(err => console.log('Solicitud fallida', err)); + }); series.events.on("datavalidated", function (ev) { let cellSize = 45; if (TipoVista == 1) { - cellSize = 60; + cellSize = 60; } //let series = ev.target; //let chart = series.chart; @@ -671,7 +686,20 @@ // Set it on chart's container chart.root.dom.style.height = chartHeight + "px"; + + //ev.target.get("xAxis").zoomToValues(100, 200); }); + + //series.events.once("datavalidated", function(ev) { + + //}); + + //chart.events.on("ready", function () { + // dateAxis.zoomToDates( + // new Date(2024, 7, 4), + // new Date(2024, 7, 15) + // ); + //}) //root.language.setTranslationAny("May", "Mayo"); // Make stuff animate on load @@ -705,7 +733,7 @@ function selectDate(start, end, allDay) { } - function updateEvent(event, element) { + function updateEvent(event, element, esCalendario = true) { $('#<%=TxtCantidadPasajeros.ClientID%>').val(event.CantidadPasajeros); $('#<%=TxtFolio.ClientID%>').val(event.NumeroContrato); @@ -714,8 +742,12 @@ $('#<%=TxtUbicacion.ClientID%>').val(event.NombreAcercamiento); - - $('#<%=TxtFechaSalida.ClientID%>').val(formatearFechaISO(event.start._i)); + if (esCalendario) { + $('#<%=TxtFechaSalida.ClientID%>').val(formatearFechaISO(event.start._i)); + }else{ + $('#<%=TxtFechaSalida.ClientID%>').val(formatearFechaISO(event.start)); + } + $('#<%=TxtFechaRegreso.ClientID%>').val(formatearFechaISO(event.FechaFinal)); $('#<%=DdlClientes.ClientID%>').val(event.CveCliente); @@ -737,142 +769,142 @@ $('#HidModCveCliente').val(event.CveCliente); - $('#<%=BtnModal.ClientID%>').click(); + $('#<%=BtnModal.ClientID%>').click(); } - function formatearFechaISO(fechaISO) { - let fecha = new Date(fechaISO); + function formatearFechaISO(fechaISO) { + let fecha = new Date(fechaISO); - // Formatear la fecha en DD/MM/YYYY - let dia = fecha.getDate().toString().padStart(2, '0'); - let mes = (fecha.getMonth() + 1).toString().padStart(2, '0'); // getMonth() devuelve mes de 0-11 - let año = fecha.getFullYear(); + // Formatear la fecha en DD/MM/YYYY + let dia = fecha.getDate().toString().padStart(2, '0'); + let mes = (fecha.getMonth() + 1).toString().padStart(2, '0'); // getMonth() devuelve mes de 0-11 + let año = fecha.getFullYear(); - // Formatear la hora en formato 12 horas con AM/PM - let horas = fecha.getHours(); - let minutos = fecha.getMinutes().toString().padStart(2, '0'); - let periodo = 'a. m.'; - if (horas >= 12) { - periodo = 'p. m.'; - horas = horas > 12 ? horas - 12 : horas; // Convertir hora de formato 24 a 12 horas - } - if (horas === 0) horas = 12; // Medianoche se muestra como 12 a.m. - horas = horas.toString().padStart(2, '0'); + // Formatear la hora en formato 12 horas con AM/PM + let horas = fecha.getHours(); + let minutos = fecha.getMinutes().toString().padStart(2, '0'); + let periodo = 'a. m.'; + if (horas >= 12) { + periodo = 'p. m.'; + horas = horas > 12 ? horas - 12 : horas; // Convertir hora de formato 24 a 12 horas + } + if (horas === 0) horas = 12; // Medianoche se muestra como 12 a.m. + horas = horas.toString().padStart(2, '0'); - // Combinar la fecha y la hora - return `${dia}/${mes}/${año} ${horas}:${minutos}:00 ${periodo}`; - } - - function RadionButtonSelectedValueSet(name, SelectdValue) { - $('input[name="' + name + '"][value="' + SelectdValue + '"]').prop('checked', true); - } - - function updateEventOnDropResize(event, allDay) { - var eventToUpdate = { - id: event.id, - start: event.start - }; - - if (event.end === null) { - eventToUpdate.end = eventToUpdate.start; - } - else { - eventToUpdate.end = event.end; - } - var endDate; - if (!event.allDay) { - endDate = new Date(eventToUpdate.end + 60 * 60000); - endDate = endDate.toJSON(); - } - else { - endDate = eventToUpdate.end.toJSON(); + // Combinar la fecha y la hora + return `${dia}/${mes}/${año} ${horas}:${minutos}:00 ${periodo}`; } - eventToUpdate.start = eventToUpdate.start.toJSON(); - eventToUpdate.end = eventToUpdate.end.toJSON(); //endDate; - eventToUpdate.allDay = event.allDay; + function RadionButtonSelectedValueSet(name, SelectdValue) { + $('input[name="' + name + '"][value="' + SelectdValue + '"]').prop('checked', true); + } - PageMethods.ActualizaEvento(eventToUpdate, UpdateTimeSuccess); - } + function updateEventOnDropResize(event, allDay) { + var eventToUpdate = { + id: event.id, + start: event.start + }; - function eventDropped(event, dayDelta, minuteDelta, allDay, revertFunc) { - if ($(this).data("qtip")) $(this).qtip("destroy"); - updateEventOnDropResize(event); - } + if (event.end === null) { + eventToUpdate.end = eventToUpdate.start; + } + else { + eventToUpdate.end = event.end; + } + var endDate; + if (!event.allDay) { + endDate = new Date(eventToUpdate.end + 60 * 60000); + endDate = endDate.toJSON(); + } + else { + endDate = eventToUpdate.end.toJSON(); + } - function eventResized(event, dayDelta, minuteDelta, revertFunc) { - if ($(this).data("qtip")) $(this).qtip("destroy"); + eventToUpdate.start = eventToUpdate.start.toJSON(); + eventToUpdate.end = eventToUpdate.end.toJSON(); //endDate; + eventToUpdate.allDay = event.allDay; - updateEventOnDropResize(event); - } + PageMethods.ActualizaEvento(eventToUpdate, UpdateTimeSuccess); + } - function Calendario(mes = -1, anio = -1) { + function eventDropped(event, dayDelta, minuteDelta, allDay, revertFunc) { + if ($(this).data("qtip")) $(this).qtip("destroy"); + updateEventOnDropResize(event); + } + + function eventResized(event, dayDelta, minuteDelta, revertFunc) { + if ($(this).data("qtip")) $(this).qtip("destroy"); + + updateEventOnDropResize(event); + } + + function Calendario(mes = -1, anio = -1) { - let fechaActual = new Date(); - if (mes === -1) { - mes = fechaActual.getMonth() + 1; - } - if (anio === -1) { - anio = fechaActual.getFullYear(); - } + let fechaActual = new Date(); + if (mes === -1) { + mes = fechaActual.getMonth() + 1; + } + if (anio === -1) { + anio = fechaActual.getFullYear(); + } - let mesFormateado = ('0' + mes).slice(-2); - let fechaInicio = `${anio}-${mesFormateado}-01`; + let mesFormateado = ('0' + mes).slice(-2); + let fechaInicio = `${anio}-${mesFormateado}-01`; - var date = new Date(); - var d = date.getDate(); - var m = date.getMonth(); - var y = date.getFullYear(); - var h = {}; + var date = new Date(); + var d = date.getDate(); + var m = date.getMonth(); + var y = date.getFullYear(); + var h = {}; - //alert(fechaInicio); - if ($('#calendar').width() <= 400) { - $('#calendar').addClass("mobile"); - h = { - left: 'title, prev, next', - center: '', - right: 'today,month,agendaWeek,agendaDay' - }; - } else { - $('#calendar').removeClass("mobile"); + //alert(fechaInicio); + if ($('#calendar').width() <= 400) { + $('#calendar').addClass("mobile"); + h = { + left: 'title, prev, next', + center: '', + right: 'today,month,agendaWeek,agendaDay' + }; + } else { + $('#calendar').removeClass("mobile"); - h = { - left: 'title', - center: '', - right: 'prev,next,today,month,agendaWeek,agendaDay' - }; - } + h = { + left: 'title', + center: '', + right: 'prev,next,today,month,agendaWeek,agendaDay' + }; + } - $('#calendar').fullCalendar('destroy'); - $('#calendar').fullCalendar({ - defaultDate: fechaInicio, - header: h, - monthNames: ["Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre"], - monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'], - dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'], - dayNamesShort: ['Dom', 'Lun', 'Mar', 'Mié', 'Jue', 'Vie', 'Sáb'], - buttonText: { - today: 'Hoy', - week: 'Semana', - month: 'Mes', - day: 'Día' - }, - eventClick: updateEvent, - selectable: true, - selectHelper: true, - select: selectDate, - editable: true, - minTime: "00:00:00", - maxTime: "24:00:00", - events: { - url: '/Ashx/CargaEventos.ashx', - type: 'GET', - data: { - U: ' <%= UsuarioActual.CveUsuario %>', + $('#calendar').fullCalendar('destroy'); + $('#calendar').fullCalendar({ + defaultDate: fechaInicio, + header: h, + monthNames: ["Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre"], + monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'], + dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'], + dayNamesShort: ['Dom', 'Lun', 'Mar', 'Mié', 'Jue', 'Vie', 'Sáb'], + buttonText: { + today: 'Hoy', + week: 'Semana', + month: 'Mes', + day: 'Día' + }, + eventClick: updateEvent, + selectable: true, + selectHelper: true, + select: selectDate, + editable: true, + minTime: "00:00:00", + maxTime: "24:00:00", + events: { + url: '/Ashx/CargaEventos.ashx', + type: 'GET', + data: { + U: ' <%= UsuarioActual.CveUsuario %>', E: '<%= UsuarioActual.CveEmpresa %>', tipoVista: '<%= RBTipoVista.Text %>', METODO: 'contrato_transportes', @@ -896,24 +928,24 @@ }); } - function obtenerFechaInicio(mes = -1, anio = -1) { - let fechaActual = new Date(); + function obtenerFechaInicio(mes = -1, anio = -1) { + let fechaActual = new Date(); - if (mes === -1) { - mes = fechaActual.getMonth() + 1; // getMonth() es base 0, así que se suma 1 - } - if (anio === -1) { - anio = fechaActual.getFullYear(); - } + if (mes === -1) { + mes = fechaActual.getMonth() + 1; // getMonth() es base 0, así que se suma 1 + } + if (anio === -1) { + anio = fechaActual.getFullYear(); + } - let mesFormateado = ('0' + mes).slice(-2); + let mesFormateado = ('0' + mes).slice(-2); - let fechaInicio = `${anio}-${mesFormateado}-01`; + let fechaInicio = `${anio}-${mesFormateado}-01`; - return fechaInicio; - } + return fechaInicio; + } diff --git a/Transportes/RepContratosCalendario.aspx.vb b/Transportes/RepContratosCalendario.aspx.vb index 5695af9fd..8ab2c39c0 100644 --- a/Transportes/RepContratosCalendario.aspx.vb +++ b/Transportes/RepContratosCalendario.aspx.vb @@ -32,8 +32,8 @@ Partial Class RepContratosCalendario Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load If Not IsPostBack Then - txtFechaI.Text = DateTime.Now.AddMonths(-1).ToShortDateString - txtFechaF.Text = DateTime.Now.AddDays(7).ToShortDateString + txtFechaI.Text = DateTime.Now.ToShortDateString + txtFechaF.Text = DateTime.Now.AddMonths(1).ToShortDateString InicializaCombos() InicializaCalendar() CargaDatos() @@ -85,7 +85,9 @@ Partial Class RepContratosCalendario New JProperty("columnSettings", New JObject( New JProperty("fill", String.Format("#{0:X6}", random.Next(16777216))) )), - New JProperty("task", Row("NombreAF")) + New JProperty("unidad", Row("NombreAF")), + New JProperty("cveContrato", Row("CveContrato")), + New JProperty("contrato", Row("NumeroContrato")) ) jsonData.Add(obj) strAF.AppendFormat("{0},", Row("CveAF")) From 4f5aec24f1a32056b58eacd5f8be7ec40e8f6588 Mon Sep 17 00:00:00 2001 From: Jonathan Alexis Perez Morales Date: Mon, 8 Jul 2024 14:40:33 -0700 Subject: [PATCH 2/2] --zoom a a diagrama segun filtros de fechas --- Transportes/RepContratosCalendario.aspx | 32 ++++++++++------------ Transportes/RepContratosCalendario.aspx.vb | 18 ++++++++---- 2 files changed, 28 insertions(+), 22 deletions(-) diff --git a/Transportes/RepContratosCalendario.aspx b/Transportes/RepContratosCalendario.aspx index aac9025d4..e099a267b 100644 --- a/Transportes/RepContratosCalendario.aspx +++ b/Transportes/RepContratosCalendario.aspx @@ -541,6 +541,7 @@ "December": "Diciembre", }; + var dateAxis; function cargaDiagramaGrant(data, categorias, TipoVista) { @@ -564,7 +565,7 @@ // Create chart // https://www.amcharts.com/docs/v5/charts/xy-chart/ var chart = root.container.children.push(am5xy.XYChart.new(root, { - panX: false, + panX: true, panY: false, wheelX: "panX", wheelY: "zoomX", @@ -599,12 +600,14 @@ yAxis.data.setAll(categorias); - var dateAxis = am5xy.DateAxis.new(root, { + dateAxis = am5xy.DateAxis.new(root, { baseInterval: { timeUnit: "minute", count: 1 }, renderer: am5xy.AxisRendererX.new(root, { minorGridEnabled: true, minGridDistance: 90 }) + //min: new Date(2024, 6, 15).getTime(), + //max: new Date(2024, 6, 31).getTime() }); var xAxis = chart.xAxes.push( @@ -627,7 +630,7 @@ series.columns.template.setAll({ templateField: "columnSettings", strokeOpacity: 0, - tooltipText: "UNIDAD: {unidad} -- CONTRATO: {contrato} -- CÓDIGO: {category} -- DURACIÓN: {openValueX} - {valueX}" + tooltipText: "UNIDAD: {category}-{unidad} \nCONTRATO: {contrato} \nDURACIÓN: {openValueX} - {valueX}" }); series.data.processor = am5.DataProcessor.new(root, { @@ -666,7 +669,6 @@ let parametros = '&cveContrato=' + cveContrato +'&U=' + '<%= UsuarioActual.CveUsuario %>' + '&E='+ '<%= UsuarioActual.CveEmpresa %>'+ '&tipoVista=' + '<%= RBTipoVista.Text %>' + '&CveUsuarioPara:' + $('#DdlTecnico').val(); + '&CveSubProyecto:' + $('#DdlSubProyecto').val(); fetch(url + parametros).then(response => response.json()).then(json => { - console.log(json); updateEvent(json[0],null,false); }).catch(err => console.log('Solicitud fallida', err)); }); @@ -687,29 +689,25 @@ // Set it on chart's container chart.root.dom.style.height = chartHeight + "px"; - //ev.target.get("xAxis").zoomToValues(100, 200); + // ev.target.get("xAxis").zoomToValues(new Date(2024,6,15).getTime(), new Date(2024,6,20).getTime()); }); - //series.events.once("datavalidated", function(ev) { - - //}); - - //chart.events.on("ready", function () { - // dateAxis.zoomToDates( - // new Date(2024, 7, 4), - // new Date(2024, 7, 15) - // ); - //}) - //root.language.setTranslationAny("May", "Mayo"); - // Make stuff animate on load // https://www.amcharts.com/docs/v5/concepts/animations/ series.appear(); chart.appear(1000, 100); + }); // end am5.ready() } + function zoomAxis(anioI,mesI,diaI,anioF,mesF,diaF) { + setTimeout(() => { + dateAxis.zoomToDates(new Date(anioI, mesI, diaI), new Date(anioF, mesF, diaF)); + }, 1500); + + } + var PrimeraCargaCalendario = true; var currentUpdateEvent; var addStartDate; diff --git a/Transportes/RepContratosCalendario.aspx.vb b/Transportes/RepContratosCalendario.aspx.vb index c8ae56d44..beaf9c67a 100644 --- a/Transportes/RepContratosCalendario.aspx.vb +++ b/Transportes/RepContratosCalendario.aspx.vb @@ -42,8 +42,8 @@ Partial Class RepContratosCalendario Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load If Not IsPostBack Then - txtFechaI.Text = DateTime.Now.ToShortDateString - txtFechaF.Text = DateTime.Now.AddMonths(1).ToShortDateString + txtFechaI.Text = NowADS().FirstDayOfMonth.ToShortDateString() + txtFechaF.Text = GetLastDayOfMonth(NowADS()).ToShortDateString() InicializaCombos() InicializaCalendar() CargaDatos() @@ -71,6 +71,9 @@ Partial Class RepContratosCalendario End Sub + Public Shared Function GetLastDayOfMonth(ByVal dateTime As DateTime) As DateTime + Return New DateTime(dateTime.Year, dateTime.Month, DateTime.DaysInMonth(dateTime.Year, dateTime.Month)) + End Function Private Sub CargaCronograma(Optional TipoVista As Integer = -1) If DtAvance IsNot Nothing Then @@ -94,13 +97,14 @@ Partial Class RepContratosCalendario Dim obj As New JObject( New JProperty("category", Row("CodigoAF")), New JProperty("fromDate", Row("FechaInicial").ToString().ToDateTime().ToString("dd/MM/yyyy HH:mm").ToDateTime()), - New JProperty("toDate", Row("FechaFinal").ToString().ToDateTime().ToString("dd/MM/yyyy HH:mm").ToDateTime()), + New JProperty("toDate", Row("FechaFinal").ToString().ToDateTime.ToString("dd/MM/yyyy HH:mm").ToDateTime()), New JProperty("columnSettings", New JObject( New JProperty("fill", String.Format("#{0:X6}", random.Next(16777216))) )), New JProperty("unidad", Row("NombreAF")), New JProperty("cveContrato", Row("CveContrato")), - New JProperty("contrato", Row("NumeroContrato")) + New JProperty("contrato", Row("NumeroContrato")), + New JProperty("fechaFinalViaje", Row("FechaFinal").ToString().ToDateTime().ToString("dd/MM/yyyy HH:mm")) ) jsonData.Add(obj) strAF.AppendFormat("{0},", Row("CveAF")) @@ -117,8 +121,12 @@ Partial Class RepContratosCalendario ) jsonCategorias.Add(obj) Next + Dim FechaI = txtFechaI.Text.ToDateTime() + Dim FechaF = txtFechaF.Text.ToDateTime() - RegistraScript($"cargaDiagramaGrant({jsonData.ToString()},{jsonCategorias.ToString()},{TipoVista});", "A1") + Dim ScriptZoom = $"zoomAxis({FechaI.Year},{FechaI.Month - 1},{FechaI.Day},{FechaF.Year},{FechaF.Month - 1},{FechaF.Day});" + + RegistraScript($"cargaDiagramaGrant({jsonData.ToString()},{jsonCategorias.ToString()},{TipoVista});{ScriptZoom}", "A1") UPPGantt.Update() End If End Sub