744 lines
38 KiB
Plaintext
744 lines
38 KiB
Plaintext
<%@ Page Title="" Language="VB" MasterPageFile="~/Site.master" AutoEventWireup="false" CodeFile="RepAnexoCatalogoMensual.aspx.vb" Inherits="Contabilidad2_RepAnexoCatalogoMensual" EnableEventValidation="false" %>
|
|
|
|
<asp:Content ID="Content1" ContentPlaceHolderID="CP" runat="Server">
|
|
</asp:Content>
|
|
<asp:Content ID="Content2" ContentPlaceHolderID="Css" runat="Server">
|
|
<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
|
|
<style>
|
|
#chartdiv {
|
|
width: 100%;
|
|
height: 700px;
|
|
}
|
|
|
|
.fa.fa-bar-chart {
|
|
width: 16px;
|
|
height: 14px;
|
|
}
|
|
|
|
/*#C_GvMensual2 > tbody > tr:nth-child(1) > th:nth-child(1), #C_GvMensual2 > tbody > tr:nth-child(2) > td:nth-child(1) {
|
|
width: 500px !important;
|
|
}*/
|
|
</style>
|
|
</asp:Content>
|
|
<asp:Content ID="Content3" ContentPlaceHolderID="E" runat="Server">
|
|
Anexo del Catálogo - Mensual
|
|
|
|
</asp:Content>
|
|
<asp:Content ID="Content4" ContentPlaceHolderID="HB" runat="Server">
|
|
</asp:Content>
|
|
<asp:Content ID="Content5" ContentPlaceHolderID="H" runat="Server">
|
|
|
|
<asp:UpdatePanel runat="server" UpdateMode="Conditional" ID="UpAcciones">
|
|
<ContentTemplate>
|
|
|
|
<li>
|
|
<asp:LinkButton ID="LnkExportar" runat="server" Visible="false"><i class="fa fa-ad-excel"></i> Generar Excel</asp:LinkButton>
|
|
</li>
|
|
|
|
</ContentTemplate>
|
|
<Triggers>
|
|
<asp:PostBackTrigger ControlID="LnkExportar" />
|
|
</Triggers>
|
|
</asp:UpdatePanel>
|
|
|
|
|
|
</asp:Content>
|
|
<asp:Content ID="Content6" ContentPlaceHolderID="HA" runat="Server">
|
|
</asp:Content>
|
|
<asp:Content ID="Content7" ContentPlaceHolderID="C" runat="Server">
|
|
|
|
<asp:UpdatePanel runat="server" UpdateMode="Conditional" ID="UpFiltros">
|
|
<ContentTemplate>
|
|
<asp:Panel runat="server" DefaultButton="BtnCargaAsignados">
|
|
<div class="portlet solid grey-cascade portlet-filter">
|
|
<div class="portlet-title portlet-filterT smalltitle magindate">
|
|
<div class="tools">
|
|
<asp:Button ID="BtnCargaAsignados" runat="server" Text="Consultar" class="btn btn-default" />
|
|
<a href="javascript:;" data-idchekbox="<%= chkexpand.ClientID%>" class=" <%= IIf(chkexpand.Checked = True, "collapse", "expand")%>"></a><%--class="expand"--%>
|
|
<asp:CheckBox ID="chkexpand" CssClass="hidden" runat="server" />
|
|
</div>
|
|
<div class="titlefiltros caption ">
|
|
<div class="row">
|
|
<div class="col-md-1 truncate">
|
|
Cuenta:
|
|
</div>
|
|
<div class="col-md-2">
|
|
<asp:DropDownList ID="DdlCuentas" runat="server" AppendDataBoundItems="true" DataTextField="CuentaFormatoNombre" DataValueField="CveCuenta" CssClass="form-control input-sm select2me" Enabled="true" >
|
|
<asp:ListItem Selected="True" Text="Seleccione" Value="-1"></asp:ListItem>
|
|
</asp:DropDownList>
|
|
<asp:RequiredFieldValidator ID="RFVDdlCuentas" runat="server" InitialValue="-1" ControlToValidate="DdlCuentas" Display="None" ErrorMessage="<b><span style='text-decoration: underline'>ERROR:</span></b><br />El campo <b>''Cuenta''</b> es necesario, por favor ingréselo." ValidationGroup="GrpConsulta"></asp:RequiredFieldValidator>
|
|
<ajax:ValidatorCalloutExtender ID="CERFVDdlCuentas" runat="server" HighlightCssClass="vco" TargetControlID="RFVDdlCuentas" Width="350px"></ajax:ValidatorCalloutExtender>
|
|
</div>
|
|
<div class="col-md-1 truncate">
|
|
Ejercicio:
|
|
</div>
|
|
<div class="col-md-1">
|
|
<asp:DropDownList ID="DdlEjercicio" runat="server" DataTextField="Ejercicio" DataValueField="Ejercicio" CssClass="form-control input-sm select2me" Style="width: 100px !important;" ValidationGroup="GrpCargaAsignados"></asp:DropDownList>
|
|
</div>
|
|
<asp:Label ID="LblProyecto" runat="server" class="col-md-1 truncate">Proyecto:</asp:Label>
|
|
<div runat="server" id="DivProyecto" class="col-md-2">
|
|
<asp:DropDownList ID="DdlProyecto" runat="server" AutoPostBack="true" AppendDataBoundItems="true" DataTextField="Proyecto" DataValueField="CveProyecto" Class="table-group-action-input form-control input-inline input-small input-sm select2me"></asp:DropDownList>
|
|
</div>
|
|
<asp:Label runat="server" ID="LblSubProyecto" CssClass="col-md-1">SubProyecto:</asp:Label>
|
|
<div class="col-md-2">
|
|
<asp:DropDownList ID="DdlSubproyecto" CssClass="form-control input-sm select2me" runat="server" DataTextField="SubProyecto" DataValueField="CveSubProyecto" Width="95%" AutoPostBack="True">
|
|
</asp:DropDownList>
|
|
</div>
|
|
<div class="col-md-1 truncate" style="display:none;">
|
|
Periodo:
|
|
</div>
|
|
<div class="col-md-1" style="display:none;">
|
|
<asp:DropDownList ID="DdlPeriodo" runat="server" CssClass="select2me">
|
|
<asp:ListItem Text="Enero" Value="1"></asp:ListItem>
|
|
<asp:ListItem Text="Febrero" Value="2"></asp:ListItem>
|
|
<asp:ListItem Text="Marzo" Value="3"></asp:ListItem>
|
|
<asp:ListItem Text="Abril" Value="4"></asp:ListItem>
|
|
<asp:ListItem Text="Mayo" Value="5"></asp:ListItem>
|
|
<asp:ListItem Text="Junio" Value="6"></asp:ListItem>
|
|
<asp:ListItem Text="Julio" Value="7"></asp:ListItem>
|
|
<asp:ListItem Text="Agosto" Value="8"></asp:ListItem>
|
|
<asp:ListItem Text="Septiembre" Value="9"></asp:ListItem>
|
|
<asp:ListItem Text="Octubre" Value="10"></asp:ListItem>
|
|
<asp:ListItem Text="Noviembre" Value="11"></asp:ListItem>
|
|
<asp:ListItem Text="Diciembre" Value="12" Selected="True"></asp:ListItem>
|
|
</asp:DropDownList>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
<div class="portlet-body" <%= IIf(chkexpand.Checked = True, "", "style=""display:none;""")%>>
|
|
<div class="row">
|
|
<div class="col-md-1 truncate">
|
|
Divisor:
|
|
</div>
|
|
<div class="col-md-1">
|
|
<asp:DropDownList ID="DdlDivisor" Width="100px" runat="server" CssClass="form-control input-sm select2me">
|
|
<asp:ListItem Text="1" Value="1" Selected="True"></asp:ListItem>
|
|
<asp:ListItem Text="1,000" Value="1000"></asp:ListItem>
|
|
<asp:ListItem Text="1,000,000" Value="1000000"></asp:ListItem>
|
|
</asp:DropDownList>
|
|
</div>
|
|
<div class="col-md-1 truncate">
|
|
Trimestre Cuatrimestre:
|
|
</div>
|
|
<div class="col-md-1">
|
|
<asp:DropDownList ID="DdlTri" runat="server" CssClass="select2me" Width="100px" >
|
|
<asp:ListItem Value="0">NO</asp:ListItem>
|
|
<asp:ListItem Value="1">Trimestre</asp:ListItem>
|
|
<asp:ListItem Value="2">Cuatrimestre</asp:ListItem>
|
|
</asp:DropDownList>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</asp:Panel>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
|
|
|
|
<asp:UpdatePanel ID="UpMensual" UpdateMode="Conditional" runat="server">
|
|
<ContentTemplate>
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div style="background-color: #fff;">
|
|
<asp:GridView ID="GvMensual2" runat="server" AutoGenerateColumns="False" ShowHeader="true" EmptyDataText="No se encontraron datos" GridLines="none"
|
|
DataKeyNames="Level,CveCuenta"
|
|
CssClass="ADSCROLLER2 table table-striped table-advance table-hover" data-cols="2" data-heightmenos="300">
|
|
<Columns>
|
|
|
|
<asp:TemplateField>
|
|
<HeaderTemplate>
|
|
<%--<asp:HyperLink ID="Hypgrafica" runat="server" CssClass="Texto Hypgrafica gral" NavigateUrl="javascript:void(0);" onclick="return cargaGraficaBarras2();"><i class="fa fa-bar-chart" aria-hidden="true"></i></asp:HyperLink>--%>
|
|
<asp:HyperLink ID="hpl2" runat="server" CssClass="Texto Hypgrafica" NavigateUrl="javascript:void(0);" >
|
|
<i class="fa fa-bar-chart" aria-hidden="true"></i></asp:HyperLink>
|
|
</HeaderTemplate>
|
|
<ItemTemplate>
|
|
<div style="white-space: nowrap">
|
|
<%--<asp:HyperLink ID="Hypgrafica" runat="server" CssClass="Texto Hypgrafica" NavigateUrl="javascript:void(0);" onclick="return HandlerGraf(this, event);"><i class="fa fa-bar-chart" aria-hidden="true"></i></asp:HyperLink>
|
|
<asp:CheckBox ID="chkgraf" CssClass="chkgraf" runat="server" />--%>
|
|
<asp:HyperLink ID="hpl2" runat="server" CssClass="Texto Hypgrafica" NavigateUrl="javascript:void(0);" >
|
|
<i class="fa fa-bar-chart" aria-hidden="true"></i></asp:HyperLink>
|
|
<asp:CheckBox ID="chkgraf" CssClass="chkgraf" runat="server" />
|
|
</div>
|
|
</ItemTemplate>
|
|
</asp:TemplateField>
|
|
|
|
<asp:TemplateField ItemStyle-HorizontalAlign="Left" ItemStyle-Width="250px" ControlStyle-Width="250px">
|
|
<HeaderTemplate>
|
|
<div style="width: 200px;">Nombre</div>
|
|
</HeaderTemplate>
|
|
<ItemTemplate>
|
|
<asp:Label ID="LblNombre" runat="server" Text='<%# Eval("Nombre")%>'></asp:Label>
|
|
</ItemTemplate>
|
|
</asp:TemplateField>
|
|
|
|
<asp:BoundField HeaderText="Enero" DataField="Enero" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="Febrero" DataField="Febrero" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="$" DataField="VariacionFebreroImporte" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="75px" />
|
|
<asp:BoundField HeaderText="%" DataField="VariacionFebreroPorcentaje" DataFormatString="{0:N2}%" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="50px" />
|
|
<asp:BoundField HeaderText="Marzo" DataField="Marzo" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="$" DataField="VariacionMarzoImporte" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="75px" />
|
|
<asp:BoundField HeaderText="%" DataField="VariacionMarzoPorcentaje" DataFormatString="{0:N2}%" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="50px" />
|
|
|
|
<asp:BoundField HeaderText="T1" DataField="Tri1" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
|
|
<asp:BoundField HeaderText="Abril" DataField="Abril" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="$" DataField="VariacionAbrilImporte" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="75px" />
|
|
<asp:BoundField HeaderText="%" DataField="VariacionAbrilPorcentaje" DataFormatString="{0:N2}%" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="50px" />
|
|
|
|
<asp:BoundField HeaderText="C1" DataField="Cua1" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
|
|
<asp:BoundField HeaderText="Mayo" DataField="Mayo" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="$" DataField="VariacionMayoImporte" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="75px" />
|
|
<asp:BoundField HeaderText="%" DataField="VariacionMayoPorcentaje" DataFormatString="{0:N2}%" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="50px" />
|
|
<asp:BoundField HeaderText="Junio" DataField="Junio" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="$" DataField="VariacionJunioImporte" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="75px" />
|
|
<asp:BoundField HeaderText="%" DataField="VariacionJunioPorcentaje" DataFormatString="{0:N2}%" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="50px" />
|
|
|
|
<asp:BoundField HeaderText="T2" DataField="Tri2" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
|
|
<asp:BoundField HeaderText="Julio" DataField="Julio" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="$" DataField="VariacionJulioImporte" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="75px" />
|
|
<asp:BoundField HeaderText="%" DataField="VariacionJulioPorcentaje" DataFormatString="{0:N2}%" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="50px" />
|
|
<asp:BoundField HeaderText="Agosto" DataField="Agosto" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="$" DataField="VariacionAgostoImporte" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="75px" />
|
|
<asp:BoundField HeaderText="%" DataField="VariacionAgostoPorcentaje" DataFormatString="{0:N2}%" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="50px" />
|
|
|
|
<asp:BoundField HeaderText="C2" DataField="Cua2" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
|
|
<asp:BoundField HeaderText="Septiembre" DataField="Septiembre" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="$" DataField="VariacionSeptiembreImporte" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="75px" />
|
|
<asp:BoundField HeaderText="%" DataField="VariacionSeptiembrePorcentaje" DataFormatString="{0:N2}%" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="50px" />
|
|
|
|
<asp:BoundField HeaderText="T3" DataField="Tri3" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
|
|
<asp:BoundField HeaderText="Octubre" DataField="Octubre" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="$" DataField="VariacionOctubreImporte" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="75px" />
|
|
<asp:BoundField HeaderText="%" DataField="VariacionOctubrePorcentaje" DataFormatString="{0:N2}%" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="50px" />
|
|
<asp:BoundField HeaderText="Noviembre" DataField="Noviembre" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="$" DataField="VariacionNoviembreImporte" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="75px" />
|
|
<asp:BoundField HeaderText="%" DataField="VariacionNoviembrePorcentaje" DataFormatString="{0:N2}%" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="50px" />
|
|
<asp:BoundField HeaderText="Diciembre" DataField="Diciembre" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="$" DataField="VariacionDiciembreImporte" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="75px" />
|
|
<asp:BoundField HeaderText="%" DataField="VariacionDiciembrePorcentaje" DataFormatString="{0:N2}%" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="50px" />
|
|
|
|
<asp:BoundField HeaderText="T4" DataField="Tri1" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="C4" DataField="Cua1" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
<asp:BoundField HeaderText="Total" DataField="Total" DataFormatString="{0:N2}" ItemStyle-HorizontalAlign="Right" ItemStyle-CssClass="ceros" ItemStyle-Width="100px" />
|
|
|
|
</Columns>
|
|
</asp:GridView>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
|
|
<div id="DivModalGrafica" class="modal ADS fade" role="dialog">
|
|
<asp:UpdatePanel class="modal-dialog modal-lg" runat="server" ID="UPModalProd" UpdateMode="Conditional">
|
|
<ContentTemplate>
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal">×</button>
|
|
<h4 class="modal-title">
|
|
<asp:Label ID="LblTituloGrafica" CssClass="LblTituloGrafica" runat="server" ClientIDMode="Static" Text=""></asp:Label>
|
|
</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="row">
|
|
<div class="col-md-2"></div>
|
|
<label class="col-md-1 truncate">Grafica:</label>
|
|
<div class="col-md-2">
|
|
|
|
|
|
<select id="DdlGrafica" class="DdlGrafica select2me" >
|
|
<option value="column">Barras</option>
|
|
<option value="line">Lineas</option>
|
|
<option value="pie">Pastel</option>
|
|
</select>
|
|
|
|
<%-- <asp:UpdatePanel runat="server">
|
|
<ContentTemplate>
|
|
<asp:DropDownList ID="DdlGrafica" runat="server" ClientIDMode="Static" AppendDataBoundItems="true" Class="DdlGrafica select2me" AutoPostBack="true" OnSelectedIndexChanged="DdlGrafica_SelectedIndexChanged">
|
|
<asp:ListItem Selected="True" Text="Barras" Value="line"></asp:ListItem>
|
|
<asp:ListItem Text="Pastel" Value="pie"></asp:ListItem>
|
|
<asp:ListItem Text="Lineas" Value="column"></asp:ListItem>
|
|
</asp:DropDownList>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>--%>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
<br />
|
|
<%--<div id="chartdiv" runat="server">
|
|
</div>--%>
|
|
<div runat="server" id="chartdiv2"></div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-danger" data-dismiss="modal">Cerrar</button>
|
|
</div>
|
|
</div>
|
|
</ContentTemplate>
|
|
</asp:UpdatePanel>
|
|
</div>
|
|
</asp:Content>
|
|
<asp:Content ID="Content8" ContentPlaceHolderID="JS" runat="Server">
|
|
|
|
<script>
|
|
|
|
$(document).ready(function () {
|
|
$('#DdlGrafica').change(function () {
|
|
recargaGrafica();
|
|
});
|
|
});
|
|
|
|
var hplControl = "";
|
|
|
|
function recargaGrafica() {
|
|
$(`#${hplControl}`).click();
|
|
}
|
|
|
|
|
|
function graficahighchartsFinan(idcontainer, titulo, subtitulo, ytitulo, datos, xtitulo, labelpoint, media, datospie1, datospie2, idChkSeleccionado,ControlID) {
|
|
|
|
|
|
let tipoGrafico = $(`#DdlGrafica`).val();
|
|
let esPie = tipoGrafico == 'pie'?true:false;
|
|
hplControl = ControlID;
|
|
|
|
if(idChkSeleccionado=='' & esPie ){
|
|
$('#DdlGrafica').val('column');
|
|
tipoGrafico = $(`#DdlGrafica`).val();
|
|
esPie = false;
|
|
}
|
|
|
|
|
|
|
|
|
|
$('#LblTituloGrafica').text(titulo)
|
|
|
|
$(document).ready(function () {
|
|
$(".chartcheckboxes").remove();
|
|
});
|
|
|
|
var Monedas = '';
|
|
if (datospie1.length > 0) {
|
|
Monedas = 'Monedas';
|
|
}
|
|
|
|
let datosSeries = [];
|
|
let datosCategorias = [];
|
|
let datosRaw = [];
|
|
|
|
|
|
if (idChkSeleccionado.trim().length > 0) {
|
|
|
|
let dataName = $(`#${idChkSeleccionado}`).data('name');
|
|
let dataData = $(`#${idChkSeleccionado}`).data('data');
|
|
datosRaw = dataData
|
|
datosCategorias = $(`#${idChkSeleccionado}`).data('categorias');
|
|
|
|
|
|
let serieDato = {
|
|
name: dataName,
|
|
data: dataData
|
|
}
|
|
datosSeries.push(serieDato);
|
|
console.log("data-name:", dataName);
|
|
console.log("data-data:", dataData);
|
|
|
|
|
|
} else {
|
|
$(document).ready(function () {
|
|
$('.chksel').each(function () {
|
|
if ($(this).prop('checked')) {
|
|
|
|
var dataName = $(this).data('name');
|
|
var dataData = $(this).data('data');
|
|
datosCategorias = $(this).data('categorias');
|
|
|
|
let serieDato = {
|
|
name: dataName,
|
|
data: dataData
|
|
}
|
|
datosSeries.push(serieDato);
|
|
console.log("data-name:", dataName);
|
|
console.log("data-data:", dataData);
|
|
|
|
}
|
|
});
|
|
});
|
|
}
|
|
|
|
console.log("serieDato:", datosSeries);
|
|
console.log("datosCategorias:", datosCategorias);
|
|
|
|
if(esPie){
|
|
let datosPie = [];
|
|
|
|
for (let i = 0; i < datosCategorias.length; i++) {
|
|
|
|
let objpie = {
|
|
name: datosCategorias[i],
|
|
y:datosRaw[i]
|
|
}
|
|
datosPie.push(objpie);
|
|
}
|
|
|
|
|
|
datosSeries = [{
|
|
name: 'Importe',
|
|
colorByPoint : true,
|
|
data : datosPie
|
|
}]
|
|
|
|
|
|
}
|
|
|
|
Highcharts.chart(idcontainer, {
|
|
|
|
chart: {
|
|
type: tipoGrafico
|
|
},
|
|
|
|
title: {
|
|
text: titulo,
|
|
align: 'left'
|
|
},
|
|
|
|
subtitle: {
|
|
text: subtitulo,
|
|
align: 'left'
|
|
},
|
|
|
|
yAxis: {
|
|
title: {
|
|
text: ytitulo
|
|
}
|
|
},
|
|
|
|
xAxis: {
|
|
categories: datosCategorias,
|
|
title: {
|
|
text: xtitulo
|
|
}
|
|
},
|
|
|
|
legend: {
|
|
layout: 'vertical',
|
|
align: 'right',
|
|
verticalAlign: 'middle'
|
|
},
|
|
|
|
plotOptions: {
|
|
series: {
|
|
label: {
|
|
connectorAllowed: false
|
|
}
|
|
}
|
|
},
|
|
|
|
series: datosSeries ,
|
|
|
|
responsive: {
|
|
rules: [{
|
|
condition: {
|
|
maxWidth: 500
|
|
},
|
|
chartOptions: {
|
|
legend: {
|
|
layout: 'horizontal',
|
|
align: 'center',
|
|
verticalAlign: 'bottom'
|
|
}
|
|
}
|
|
}]
|
|
},
|
|
credits: {
|
|
enabled: false
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
</script>
|
|
|
|
|
|
<%-- <script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
|
|
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
|
|
<script src="https://www.amcharts.com/lib/3/pie.js"></script>
|
|
<script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
|
|
<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
|
|
<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
|
|
|
|
<script>
|
|
let cdatos;
|
|
let currentid = 1;
|
|
function HandlerGraf(obj, evt) {
|
|
$("#DivModalGrafica").modal();
|
|
cdatos = $(obj).data('values');
|
|
if (currentid == 1) {
|
|
CargaGraficaBarras();
|
|
} else {
|
|
CargaGraficaPastel();
|
|
}
|
|
$('.LblTituloGrafica').text($(obj).closest('tr').text().trim());
|
|
}
|
|
function CargaGraficaBarras() {
|
|
let data = cdatos;
|
|
var chart = AmCharts.makeChart("chartdiv", {
|
|
"type": "serial",
|
|
"theme": "light",
|
|
"dataProvider": data,
|
|
"startDuration": 2,
|
|
"valueAxes": [{
|
|
"position": "left",
|
|
"title": "Ventas"
|
|
}],
|
|
"graphs": [{
|
|
"balloonText": "[[category]]: <b>[[value]]</b> [[Moneda]]",
|
|
"colorField": "Color",
|
|
"fillAlphas": 1,
|
|
"lineAlpha": 0.1,
|
|
"type": "column",
|
|
"valueField": "Valor"
|
|
}],
|
|
"depth3D": 20,
|
|
"angle": 30,
|
|
"chartCursor": {
|
|
"categoryBalloonEnabled": false,
|
|
"cursorAlpha": 0,
|
|
"zoomable": false
|
|
},
|
|
"categoryField": "Texto",
|
|
"categoryAxis": {
|
|
"gridPosition": "start",
|
|
"labelRotation": 90
|
|
},
|
|
"export": {
|
|
"enabled": true
|
|
}
|
|
});
|
|
}
|
|
function CargaGraficaPastel() {
|
|
let data = cdatos;
|
|
var chart = AmCharts.makeChart("chartdiv", {
|
|
"type": "pie",
|
|
"theme": "light",
|
|
"dataProvider":
|
|
data,
|
|
"valueField": "Valor",
|
|
"titleField": "Texto",
|
|
"outlineAlpha": 0.4,
|
|
"depth3D": 0,
|
|
"balloonText": "[[title]]<br><span style='font-size:14px'><b>[[value]]</b> ([[percents]]% [[Moneda]])</span>",
|
|
"angle": 0,
|
|
"export": {
|
|
"enabled": true
|
|
}
|
|
});
|
|
}
|
|
function ADSBegin() {
|
|
$('.DdlGrafica').on('select2:select', function (e) {
|
|
var data = e.params.data;
|
|
currentid = data.id;
|
|
if (currentid == 1) {
|
|
CargaGraficaBarras();
|
|
} else {
|
|
CargaGraficaPastel();
|
|
}
|
|
});
|
|
$('.DdlGrafica').removeClass('DdlGrafica')
|
|
initamgrafica();
|
|
}
|
|
|
|
function cargaGraficaBarras2() {
|
|
//Hypgrafica
|
|
$("#DivModalGrafica").modal();
|
|
$('.LblTituloGrafica').text('grafica');
|
|
let items = []
|
|
let data;
|
|
let series = [];
|
|
$('.chkgraf input:checked').each(function () {
|
|
data = $(this).closest('tr').find('.Hypgrafica').data('values')
|
|
let name = $(this).closest('tr').text().trim()
|
|
items.push({ data: data, name: name })
|
|
});
|
|
if (items) {
|
|
data = items[0].data;
|
|
series.push({
|
|
"balloonText": "[[title]]: <b>[[value]]</b> [[Moneda]]",
|
|
"colorField": "Color",
|
|
"fillAlphas": 1,
|
|
"lineAlpha": 0.1,
|
|
"type": "column",
|
|
"title": items[0].name,
|
|
"valueField": 'Valor'
|
|
})
|
|
for (var indexcol = 1; indexcol < items.length; indexcol++) {
|
|
let cdatos = items[indexcol].data;
|
|
let valueField = 'Valor' + indexcol;
|
|
for (var i = 0; i < cdatos.length; i++) {
|
|
data[i][valueField] = cdatos[i].Valor
|
|
}
|
|
series.push({
|
|
"balloonText": "[[title]]: <b>[[value]]</b> [[Moneda]]",
|
|
"colorField": "Color",
|
|
"fillAlphas": 1,
|
|
"lineAlpha": 0.1,
|
|
"type": "column",
|
|
"title": items[indexcol].name,
|
|
"valueField": valueField
|
|
})
|
|
}
|
|
var chart = AmCharts.makeChart("chartdiv", {
|
|
"type": "serial",
|
|
"theme": "light",
|
|
"dataProvider": data,
|
|
"startDuration": 2, "legend": {
|
|
|
|
"generateFromData": true // "data": data.map(function(num) { return {title:num.Texto ,color:num.Color}; })
|
|
},
|
|
"valueAxes": [{
|
|
"position": "left",
|
|
"title": "Ventas"
|
|
}],
|
|
"graphs": series,
|
|
"depth3D": 20,
|
|
"angle": 30,
|
|
"chartCursor": {
|
|
"categoryBalloonEnabled": false,
|
|
"cursorAlpha": 0,
|
|
"zoomable": false
|
|
},
|
|
"categoryField": "Texto",
|
|
"categoryAxis": {
|
|
"gridPosition": "start",
|
|
"labelRotation": 90
|
|
},
|
|
"export": {
|
|
"enabled": true
|
|
}
|
|
});
|
|
}
|
|
}
|
|
function initamgrafica() {
|
|
AmCharts.addInitHandler(function (chart) {
|
|
function handleCustomMarkerToggle(legendEvent) {
|
|
var dataProvider = legendEvent.chart.dataProvider;
|
|
var itemIndex;
|
|
legendEvent.chart.toggleLegend = true;
|
|
if (undefined !== legendEvent.dataItem.hidden && legendEvent.dataItem.hidden) {
|
|
legendEvent.dataItem.hidden = false;
|
|
dataProvider.push(legendEvent.dataItem.storedObj);
|
|
legendEvent.dataItem.storedObj = undefined;
|
|
dataProvider.sort(function (lhs, rhs) {
|
|
return lhs.dataIdx - rhs.dataIdx;
|
|
});
|
|
} else {
|
|
legendEvent.dataItem.hidden = true;
|
|
for (var i = 0; i < dataProvider.length; ++i) {
|
|
if (dataProvider[i].dataIdx === legendEvent.dataItem.dataIdx) {
|
|
itemIndex = i;
|
|
break;
|
|
}
|
|
}
|
|
legendEvent.dataItem.storedObj = dataProvider[itemIndex];
|
|
dataProvider.splice(itemIndex, 1);
|
|
}
|
|
legendEvent.chart.validateData();
|
|
}
|
|
if (!chart.legend || !chart.legend.enabled || !chart.legend.generateFromData) {
|
|
return;
|
|
}
|
|
var categoryField = chart.categoryField;
|
|
var colorField = chart.graphs[0].lineColorField || chart.graphs[0].fillColorsField || chart.graphs[0].colorField;
|
|
var legendData = chart.dataProvider.map(function (data, idx) {
|
|
var markerData = {
|
|
"title": data[categoryField],
|
|
"color": data[colorField],
|
|
"dataIdx": idx
|
|
};
|
|
if (!markerData.color) {
|
|
markerData.color = chart.graphs[0].lineColor;
|
|
}
|
|
data.dataIdx = idx;
|
|
return markerData;
|
|
});
|
|
|
|
chart.legend.data = legendData;
|
|
chart.legend.switchable = true;
|
|
chart.legend.addListener("clickMarker", handleCustomMarkerToggle);
|
|
|
|
}, ["serial"]);
|
|
}
|
|
|
|
</script>
|
|
<script>
|
|
function LimpiaCeros() {
|
|
|
|
let Divisor = 1;
|
|
|
|
$('.ceros').each(function (i, obj) {
|
|
|
|
if ($(this).html() == '0.00' || $(this).html() == '0.00%') {
|
|
$(this).html('-');
|
|
}
|
|
|
|
if (!($(this).html() == '-' || $(this).html() == '' || ~$(this).html().indexOf("%"))) {
|
|
if (Divisor > 1) {
|
|
$(this).attr('data-toggle', 'tooltip');
|
|
$(this).attr('data-container', 'body');
|
|
$(this).attr('title', $(this).html());
|
|
}
|
|
$(this).html(FormatoNumeroIPP(ToDouble($(this).html()) / Divisor, ((Divisor == 1) ? 2 : 0)));
|
|
}
|
|
|
|
if (ToDouble($(this).html()) < 0) {
|
|
$(this).css("color", "red");
|
|
}
|
|
});
|
|
}
|
|
|
|
function FormatoNumeroIPP(Importe, Decimales) {
|
|
if (typeof Decimales === 'undefined') { Decimales = 2; }
|
|
|
|
if (isNaN(parseInt(Importe))) return "NaN";
|
|
|
|
var tmpNum = Importe;
|
|
|
|
tmpNum = tmpNum.toFixed(Decimales).replace(/./g, function (c, i, a) {
|
|
return i && c !== "." && !((a.length - i) % 3) ? ',' + c : c;
|
|
});
|
|
|
|
return tmpNum;
|
|
}
|
|
|
|
|
|
function pageLoad(sender, e) {
|
|
$(document).ready(function () {
|
|
$('[data-toggle="tooltip"]').tooltip();
|
|
});
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</script>--%>
|
|
|
|
</asp:Content>
|
|
|