<%@ page language="C#" masterpagefile="~/MasterFile/TimeCheck.master" autoeventwireup="true" inherits="DashBoardChart, App_Web_s4ghy04d" %>


<%@ Register TagPrefix="dxGridview" Namespace="DevExpress.Web" Assembly="DevExpress.Web.v14.2" %>
<%@ Register Assembly="DevExpress.XtraCharts.v14.2.Web" Namespace="DevExpress.XtraCharts.Web"
    TagPrefix="devxCharts" %>

<%@ Register Src="~/UserControls/TA_uc_OrganizationLevels.ascx" TagName="OrganizationLevel"
    TagPrefix="uc" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="BodyContentPH" runat="Server">
    <link rel="stylesheet" href="plugins/select2/select2.min.css">
    <%--<script>
        $.widget.bridge('uibutton', $.ui.button);
    </script>--%>
<%--    <script src="plugins/jQuery/jQuery-2.1.4.min.js" type="text/javascript"></script>
    <script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="dist/js/app.min.js" type="text/javascript"></script>
    <script src="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js" type="text/javascript"></script>--%>
   <%-- <script src="plugins/moment.min.js" type="text/javascript"></script>
    <script src="plugins/daterangepicker/moment.js" type="text/javascript"></script>
    <script src="plugins/datepicker/bootstrap-datepicker.js"></script>
    <script type="text/javascript" src="js/DateTimeValidation.js"></script>
    <script src="js/GetNotification.js"></script>
    <script language="javascript" src="../js/jquery.autocomplete.js" type="text/javascript"></script>--%>

    <script src="https://cdn.jsdelivr.net/npm/apexcharts@3.28.2/dist/apexcharts.min.js"></script>

    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>


    <script src="js/ApexChartData.js"></script>

 
    <%--<script>
        $(function () {
            $('#ctl00_BodyContentPH_txtFrom').datetimepicker({ format: document.getElementById('ctl00_BodyContentPH_Hidden1').value }
            );
        });
        $(function () {
            $('#ctl00_BodyContentPH_txtTo').datetimepicker({ format: document.getElementById('ctl00_BodyContentPH_Hidden1').value }
            );
        });
    </script>--%>
    <%--<script>
        //$(function () {
        //    $("#ctl00_BodyContentPH_News").draggable();
        //});
        //function CloseNews() {
        //    document.getElementById('ctl00_BodyContentPH_News').style.display = "none";
        //    return false;
        //}
    </script>--%>


<%--    <script type="text/javascript">
         function setFocusToGridView() {
            debugger;
            // Set focus to the GridView
            window.scrollTo(0, document.body.scrollHeight);
        var gridView = document.getElementById('<%= Secoundgrid.ClientID %>');
        if (gridView != null) {
            gridView.focus();
        }
    }
</script>--%>

    <style type="text/css">
        /*#chart {
    max-width: 650px;
    margin: 35px auto;
      }*/


        @import url('https://fonts.googleapis.com/css?family=Poppins');

        * {
            font-family: 'Poppins', sans-serif;
        }

        #chart {
            max-width: 800px;
            margin: 40px auto;
            opacity: 0.9;
        }

        #timeline-chart .apexcharts-toolbar {
            opacity: 1;
            border: 0;
        }
    </style>


    <%--<script type="text/javascript">

        function loadChart(jsonData) {
            debugger;
            var chartData = JSON.parse(jsonData);
            var options = {
                chart: {
                    type: "area",
                    height: 300,
                    foreColor: "#999",
                    stacked: true,
                    dropShadow: {
                        enabled: false,
                        enabledSeries: [0],
                        top: -2,
                        left: 2,
                        blur: 5,
                        opacity: 0.06
                    }
                },
                colors: ['#00E396', '#ad0000', '#0090FF', '#250696'],
                stroke: {
                    curve: "smooth",
                    width: 3
                },
                dataLabels: {
                    enabled: true
                },
                series: [{
                    name: 'Leave',
                    data: chartData,
                }, {
                    name: 'Absent',
                    data: generateDayWiseTimeSeries(1, 18)
                }, {
                    name: 'LateIn',
                    data: generateDayWiseTimeSeries(1, 18)
                },
                {
                    name: 'EarlyExit',
                    data: generateDayWiseTimeSeries(1, 18)
                }],
                markers: {
                    size: 0,
                    strokeColor: "#fff",
                    strokeWidth: 3,
                    strokeOpacity: 1,
                    fillOpacity: 1,
                    hover: {
                        size: 6
                    }
                },
                xaxis: {
                    type: "datetime",
                    axisBorder: {
                        show: false
                    },
                    axisTicks: {
                        show: false
                    }
                },
                yaxis: {
                    labels: {
                        offsetX: 14,
                        offsetY: -5
                    },
                    tooltip: {
                        enabled: true
                    }
                },
                grid: {
                    padding: {
                        left: -5,
                        right: 5
                    }
                },
                tooltip: {
                    x: {
                        format: "dd MMM yyyy"
                    },
                },
                legend: {
                    position: 'top',
                    horizontalAlign: 'left'
                },
                fill: {
                    type: "solid",
                    fillOpacity: 0.7
                }
            };
            document.addEventListener("DOMContentLoaded", function () {
                var chart = new ApexCharts(document.querySelector("#timeline-chart"), options);

                chart.render();
            });

        }
         //document.addEventListener("DOMContentLoaded", function () {
         //    var chart = new ApexCharts(document.querySelector("#chart"), options);
         //    chart.render();
         //});
         //var chart = new ApexCharts(document.querySelector("#chart"), options);

         //chart.render();


         function generateDayWiseTimeSeries(s, count) {
             debugger;
             var EnterFromDate = "Select From Date and To Date";

             //document.addEventListener("DOMContentLoaded", function () {

             var Leave = document.getElementById("ctl00_BodyContentPH_LblHdnLeave");

                 //const sessionValue = data.HdnLeave;
                 //var check = Leave.value;
                 //var Date = document.getElementById("ctl00_BodyContentPH_txtFrom").valueOf;
                 if (Leave) {
                     var hiddenValue = Leave.value;

                 }
                 else {
                     var values = [[4, 3, 10, 9, 29, 19, 25, 9, 12, 7, 19, 5, 13, 9, 17, 2, 7, 5],
                     [
                       2, 3, 8, 7, 22, 16, 23, 7, 11, 5, 12, 5, 10, 4, 15, 2, 6, 2
                     ]];
                     var i = 0;
                     var series = [];
                     var x = new Date("11 Nov 2012").getTime();
                     while (i < count) {
                         series.push([x, values[s][i]]);
                         x += 86400000;
                         i++;
                     }
                     return series;
                 }
             //});

             
         }



         //function generateDayWiseTimeSeries(s, count) {
         //    var values = [[
         //      4, 3, 10, 9, 29, 19, 25, 9, 12, 7, 19, 5, 13, 9, 17, 2, 7, 5
         //    ], [
         //      2, 3, 8, 7, 22, 16, 23, 7, 11, 5, 12, 5, 10, 4, 15, 2, 6, 2
         //    ]];
         //    var i = 0;
         //    var series = [];
         //    var x = new Date("11 Nov 2012").getTime();
         //    while (i < count) {
         //        series.push([x, values[s][i]]);
         //        x += 86400000;
         //        i++;
         //    }
         //    return series;
         //}


    </script>--%>





    <style type="text/css">
        /*This Style set the popup for the Attendance chart */
        .new-text {
            display: block;
            font-size: 20px;
            font-weight: bold;
            font-family: HelveticaNeueCondensed;
            margin: 0px 0px 10px;
            white-space: nowrap;
            padding: 0px;
            text-align: center;
        }

        .modalBackground {
            background-color: Black;
            filter: alpha(opacity=60);
            opacity: 0.6;
        }
        /*End the attendance Chect*/
        /*This style Created the style for the Exception data chart*/
        .modalPopup1 {
            background-color: #FFFFFF;
            border: 3px solid #DD4B39;
            border-radius: 12px;
            padding: 0;
        }

            .modalPopup1 .header {
                background-color: #DD4B39;
                height: 30px;
                color: White;
                line-height: 30px;
                text-align: center;
                font-weight: bold;
                font-size: 18px;
                font-family: Arial;
                border-top-left-radius: 6px;
                border-top-right-radius: 6px;
            }

            .modalPopup1 .body {
                min-height: 50px;
                line-height: 30px;
                text-align: center;
                font-weight: bold;
            }

            .modalPopup1 .footer {
                padding: 6px;
            }

            .modalPopup1 .yes, .modalPopup .no {
                height: 23px;
                color: White;
                line-height: 23px;
                text-align: center;
                font-weight: bold;
                cursor: pointer;
                border-radius: 4px;
            }

            .modalPopup1 .yes {
                background-color: #DD4B39;
                border: 1px solid #0DA9D0;
            }

            .modalPopup1 .no {
                background-color: #DD4B39;
                border: 1px solid #5C5C5C;
            }
        /* End of the exception chart */
        /* This is Created for the Approval data chart */
        .modalPopup2 {
            background-color: #FFFFFF;
            border: 3px solid #00A65A;
            border-radius: 12px;
            padding: 0;
            width: 950px;
        }

            .modalPopup2 .header {
                background-color: #00A65A;
                height: 30px;
                color: White;
                line-height: 30px;
                text-align: center;
                font-weight: bold;
                font-size: 18px;
                font-family: Arial;
                border-top-left-radius: 6px;
                border-top-right-radius: 6px;
            }

            .modalPopup2 .body {
                min-height: 50px;
                line-height: 30px;
                text-align: center;
                font-weight: bold;
            }

            .modalPopup2 .footer {
                padding: 6px;
            }

            .modalPopup2 .yes, .modalPopup .no {
                height: 23px;
                color: White;
                line-height: 23px;
                text-align: center;
                font-weight: bold;
                cursor: pointer;
                border-radius: 4px;
            }

            .modalPopup2 .yes {
                background-color: #DD4B39;
                border: 1px solid #0DA9D0;
            }

            .modalPopup2 .no {
                background-color: #00A65A;
                border: 1px solid #5C5C5C;
            }
    </style>



    <%--    <script type="text/javascript">
        debugger;
        document.addEventListener("DOMContentLoaded", function () {
            debugger;
            var canvas = document.getElementById("waveChart");
            var ctx = canvas.getContext("2d");

            // Create the data for your chart
            var data = {
                labels: ["Label 1", "Label 2", "Label 3", "Label 4"],
                datasets: [{
                    data: [3, 5, 2, 7],
                    backgroundColor: "rgba(75, 192, 192, 0.2", // Customize the bar color
                    borderColor: "rgba(75, 192, 192, 1)", // Customize the bar border color
                    borderWidth: 1, // Customize the border width
                }]
            };
        

        // Create a chart using Chart.js
        var myChart = new Chart(ctx, {
            type: 'bar',
            data: data,
            options: {
                scales: {
                    y: {
                        beginAtZero: true
                    }
                }
            }
        });
        });

    </script>--%>


    <%--<script type="text/javascript" language="javascript">
        var valOpen = 0;
        function Keypress_Event(e) {
            // Here we need not backspace keycode = 8
            if (!e) e = window.event;
            var c = (window.event) ? e.keyCode : e.which;
            if (c == 8) {
                //For IE
                if (window.ActiveXObject) {
                    e.keyCode = 0;
                    return true;
                }
                    //For firefox.
                else if (window.XMLHttpRequest) {
                    return false;
                }
            }
            return true;
        }
        function getFilter() {
            $('#collapseThree').collapse('show');
            if (document.getElementById('ctl00_BodyContentPH_trFiller').style.display == "none") {
                document.getElementById('ctl00_BodyContentPH_trFiller').style.display = "";
            }
            else {
                document.getElementById('ctl00_BodyContentPH_trFiller').style.display = "none";
            }
            return false;
        }
        function BtnExpGrid() {
            document.getElementById('ctl00_BodyContentPH_dvExceptionGrid').style.display = "none";
            document.getElementById('ctl00_BodyContentPH_dvExceptionChart').style.display = "block";
            document.getElementById('ctl00_BodyContentPH_btnExpGrid').disabled = false;
            document.getElementById('ctl00_BodyContentPH_btnExpChart').disabled = true;
            document.getElementById('ctl00_BodyContentPH_lblCount2').style.display = "none";
            return false;
        }
        function BtnExpChart() {
            document.getElementById('ctl00_BodyContentPH_dvExceptionGrid').style.display = "block";
            document.getElementById('ctl00_BodyContentPH_dvExceptionChart').style.display = "none";
            document.getElementById('ctl00_BodyContentPH_btnExpGrid').disabled = true;
            document.getElementById('ctl00_BodyContentPH_btnExpChart').disabled = false;
            document.getElementById('ctl00_BodyContentPH_lblCount2').style.display = "block";
            return false;
        }
        function load() {
            document.getElementById('ctl00_BodyContentPH_btnAttGrid').disabled = false;
        }

    </script>
    <script type="text/javascript">
        //Board 1
        function ClickAttendance(Code) {
            document.getElementById('ctl00_BodyContentPH_hdAttendance').value = Code;
        }
        //Board 2
        function ClickApproval(Code) {
            document.getElementById('ctl00_BodyContentPH_hdApproval').value = Code;
        }
        //Board 3
        function ClickException(Code) {
            document.getElementById('ctl00_BodyContentPH_hdException').value = Code;
        }
    </script>--%>
    <script type="text/javascript" language="javascript">
        //values for check date
        var Monthfourdigit = 'Please enter valid date as month, day, and four digit year : Format MM/dd/yyyy.';
        //Adding this line var Datefourdigit='Please enter valid date with correct format dd/MM/yyyy'; as newly
        var Datefourdigit = 'Please enter valid date with correct format dd/MM/yyyy';
        var Invalidyearentry = 'Invalid year entry';
        var Invalidmonthentry = 'Invalid month entry';
        var Invaliddateentry = 'Invalid date entry';
        var DateformatDDMONYYYY = 'Please enter valid date with correct format dd-MMM-yyyy';
        var Entertime = 'Enter time';
        var Valueforhours = 'Invalid value for hours:';
        var Invalidvalueforminutes = 'Invalid value for minutes:';
        var Invalidtimeformat = 'Invalid time format:';
        var EntervalidDateandTime = 'Please enter valid Date and Time';
        var ValiddatemonthMMDDYYHHMM = 'Please enter valid Date and Time MM/dd/yyyy HH:mm';
        var ValiddatemonthMMDDYYHHMMTT = 'Please enter valid Date and Time MM/dd/yyyy hh:mm tt';
        var EntervalidDateandTime = 'Please enter valid Date and Time';
        var Invalidvalueforhours = 'Invalid value for hours:';
        var Invalidvalueforminites = 'Invalid value for minutes:';
        var MaxLength = "Maximum length is ";
        var FromDate = "Enter Valid From Date";
        var ToDate = "Enter Valid To Date";
        var SelectShiftdate = "Select Year";
        //function SetAlertMessages(fromdate, enterToDate, selectShiftdate) {
        //    FromDate = fromdate;
        //    ToDate = enterToDate;
        //    SelectShiftdate = selectShiftdate;
        //}
        function MaxLengthh(maxLength) {
            MaxLength = maxLength;
        }
        function SetAlertCheckDate(monthfourdigit, datefourdigit, invalidyearentry, invalidmonthentry, invaliddateentry, dateformatDDMONYYYY, entertime, valueforhours, invalidvalueforminutes, invalidtimeformat, entervalidDateandTime, validdatemonthMMDDYYHHMM, validdatemonthMMDDYYHHMMTT, entervalidDateandTime, invalidvalueforhours, invalidvalueforminites) {

            Monthfourdigit = monthfourdigit;
            Datefourdigit = datefourdigit;
            Invalidyearentry = invalidyearentry;
            Invalidmonthentry = invalidmonthentry;
            Invaliddateentry = invaliddateentry;
            DateformatDDMONYYYY = dateformatDDMONYYYY;
            Entertime = Entertime;
            Valueforhours = valueforhours;
            Invalidvalueforminutes = invalidvalueforminutes;
            Invalidtimeformat = invalidtimeformat;
            EntervalidDateandTime = entervalidDateandTime;
            ValiddatemonthMMDDYYHHMM = validdatemonthMMDDYYHHMM;
            ValiddatemonthMMDDYYHHMMTT = validdatemonthMMDDYYHHMMTT;
            EntervalidDateandTime = entervalidDateandTime;
            Invalidvalueforhours = invalidvalueforhours;
            Invalidvalueforminites = invalidvalueforminites;
        }
        //function validation() {
        //    if (document.getElementById('ctl00_BodyContentPH_txtFrom').value == '') {
        //        alert(SelectShiftdate);
        //        return false;
        //    }
        //    else {
        //        if (document.getElementById('ctl00_BodyContentPH_txtFrom').value != '') {
        //            var weekDay = document.getElementById('ctl00_BodyContentPH_txtFrom');
        //            var DateFormat = document.getElementById('ctl00_BodyContentPH_Hidden1').value;
        //            if (checkDate(weekDay, DateFormat, Monthfourdigit, Datefourdigit, Invalidyearentry, Invalidmonthentry, Invaliddateentry, DateformatDDMONYYYY, Entertime, Valueforhours, Invalidvalueforminutes, Invalidtimeformat, EntervalidDateandTime, ValiddatemonthMMDDYYHHMM, ValiddatemonthMMDDYYHHMMTT, EntervalidDateandTime, Invalidvalueforhours, Invalidvalueforminites)) {
        //            }
        //            else {
        //                return false;
        //            }
        //        }
        //        else {
        //            alert(EnterFromDate);
        //            return false;
        //        }
        //    }
        //}
        function validations() {
            if (document.getElementById('ctl00_BodyContentPH_DllYear').value == '-Select-') {
                alert(SelectShiftdate);
                return false;
            }
            
        }
        function DateEntryValidation() {
            if (document.getElementById('ctl00_BodyContentPH_txtFrom').value != '') {
                var weekDay = document.getElementById('ctl00_BodyContentPH_txtFrom');
                var DateFormat = document.getElementById('ctl00_BodyContentPH_Hidden1').value;
                if (checkDate(weekDay, DateFormat, Monthfourdigit, Datefourdigit, Invalidyearentry, Invalidmonthentry, Invaliddateentry, DateformatDDMONYYYY, Entertime, Valueforhours, Invalidvalueforminutes, Invalidtimeformat, EntervalidDateandTime, ValiddatemonthMMDDYYHHMM, ValiddatemonthMMDDYYHHMMTT, EntervalidDateandTime, Invalidvalueforhours, Invalidvalueforminites)) {
                }
                else {
                    return false;
                }
            }
            else {
                alert(EnterFromDate);
                return false;
            }
        }
    </script>
    <%--<div class="modalPopupNews" id="News" runat="server">
        <div class="header" style="cursor: pointer;">
            <div class="row">
                <div class="col-md-12">
                    News
                    <div class="pull-right">
                        <asp:Button ID="btnCloseNews" runat="server" Text="X" CssClass="no" Style="font-size: 10px; border-top-right-radius: 6px;"
                            OnClientClick="return CloseNews();" />
                    </div>
                </div>
            </div>
        </div>
        <div class="body">
            <div class="row">
                <div class="col-md-12" style="min-height: 200px; min-width: 250px;">
                    <asp:Literal ID="litLeftNews" runat="server"></asp:Literal>
                </div>
            </div>
        </div>
    </div>--%>
    <div id="trDashboard" runat="server">
        
        <div style="display: none">
            <iframe id="exportData" runat="server"></iframe>
        </div>
        <div class="dashboard">
            <h3>
                <asp:Label ID="lbl_DashHeader" runat="server" Text="Dashboard"></asp:Label></h3>
            <asp:HiddenField ID="Hidden1" runat="server" />
            <asp:HiddenField ID="hdAttendance" runat="server" />
            <asp:HiddenField ID="hdApproval" runat="server" />
            <asp:HiddenField ID="hdException" runat="server" />


        </div>
        <!-- Main content -->
        <div class="content">
            <div class="row">
                <div class="col-md-12">
                    <div class="panel-group" id="accordion" style="margin-bottom: 0px">
                        <div class="panel panel-default">
                            <div class="panel-heading" id="trFilterShowHide" runat="server">
                                <%-- <div class="row">
                                    <div class="col-sm-4">
                                        <h4 class="pull-left">
                                            <asp:Label ID="lbl_Filter" runat="server" Text="DashBoard"></asp:Label></h4>
                                    </div>
                                    <div class="col-sm-5" style="padding-top: 8px">
                                        <div class="col-sm-4">
                                            <asp:Label ID="lblDataFor" Style="font-size: 13px;" runat="server"></asp:Label>
                                        </div>
                                        <div class="col-sm-4">
                                            <asp:Label ID="lbldisplayShiftDate" Style="font-size: 13px;" runat="server"></asp:Label>
                                        </div>

                                    </div>
                                     
                                    <div class="col-sm-3">

                                        <div class="pull-right">
                                        <h4 >
                                            <asp:Label ID="Label1" runat="server" Text="Chart"></asp:Label></h4>
                                        </div>
                                        <div class="pull-right">
                                            <button class="btn fil-btn" onclick="return getFilter();">
                                                <img src="dist/img/but1.jpg" class="img-responsive"></button>
                                        </div>
                                    </div>
                                   
                                </div>--%>

                                <div class="row">
                                    <div class="col-sm-3">
                                        <h4 class="pull-left">
                                            <asp:Label ID="lbl_Filter" runat="server" Text="Filters"></asp:Label></h4>
                                    </div>

                                    <div class="col-sm-6" style="padding-top:8px">
                                        <div class="col-sm-4">
                                            <asp:Label ID="lblDataFor" Style="font-size: 11px; display: none" runat="server"></asp:Label>
                                        </div>
                                        <div class="col-sm-4">
                                            <asp:Label ID="lbldisplayShiftDate" Style="font-size: 11px; display: none" runat="server"></asp:Label>
                                        </div>

                                    </div>

                                    <div class="col-sm-3">

                                        <div class="pull-right">
                                            <h4>
                                                <asp:LinkButton ID="Label1" runat="server" OnClick="Label1_Click" PostBackUrl="DashBoard.aspx" Text="Dash Board"></asp:LinkButton>


                                            </h4>
                                        </div>
                                       <%-- <div class="pull-right">
                                            <button class="btn fil-btn" onclick="return getFilter();">
                                                <img src="dist/img/but1.jpg" class="img-responsive"></button>
                                        </div>--%>
                                    </div>

                                </div>



                            </div>
                        </div>
                        <asp:HiddenField ID="DllSelectYear" Value="" runat="server" />
                        <asp:HiddenField ID="LblHdnLeave" Value="" runat="server" />
                        <asp:HiddenField ID="HdnLate" Value="" runat="server" />
                        <asp:HiddenField ID="HdnEarlyExit" Value="" runat="server" />
                        <asp:HiddenField ID="HdnAbsent" Value="" runat="server" />
                        <div class="panel-collapse" id="trFiller"  runat="server">
                            <%--style="display: none;"--%>
                            <div class="panel-body drop-table">
                                <div class="emp-filter">
                                    <div class="row">
                                        <div class="col-md-11">
                                            <div class="form-horizontal">
                                                <div id="divFilter" runat="server" align="left">
                                                    <div>
                                                        <div class="box-body">
                                                            <div class="row form-group" id="OrgFilter" runat="server">
                                                                <div class="col-md-12">
                                                                    <asp:UpdatePanel ID="upOrgLevel" Style="display: none" runat="server" UpdateMode="Conditional">
                                                                        <ContentTemplate>
                                                                            <asp:PlaceHolder ID="PlaceHolderAbsentees" runat="server">
                                                                                <uc:OrganizationLevel ID="ucOrganizationLevel" runat="server" />
                                                                            </asp:PlaceHolder>
                                                                        </ContentTemplate>
                                                                    </asp:UpdatePanel>
                                                                </div>
                                                            </div>
                                                            <div class="clearfix">
                                                            </div>
                                                            <div class="row form-group">
                                                            <%--<div class="row">--%>
                                                                <div class="col-md-2">
                                                                    Employee Id
                                                                </div>
                                                                <div class="col-md-3">
                                                                    <asp:TextBox ID="txtEmployeeId" runat="server" CssClass="form-control">
                                                                    </asp:TextBox>
                                                                </div>
                                                                <div class="col-md-12" style="width: 0%">
                                                                    <asp:DropDownList ID="ddlSession" runat="server" Style="display: none">
                                                                        <asp:ListItem Text="First Session" Value="0">
                                                                        </asp:ListItem>
                                                                        <asp:ListItem Text="Second Session" Value="1">
                                                                        </asp:ListItem>
                                                                    </asp:DropDownList>
                                                                </div>
                                                            <%--</div>--%>
                                                            </div>
                                                            <div class="row form-group">
                                                                <div class="col-md-2">
                                                                    <asp:Label ID="lblShiftDate" runat="server" Text="Select Year"></asp:Label>
                                                                </div>
                                                                <div class="col-md-3">
                                                                    <asp:TextBox ID="txtFrom" runat="server" Style="display: none" CssClass="form-control">
                                                                    </asp:TextBox>

                                                                    <asp:DropDownList ID="DllYear" CssClass="form-control select2" AutoPostBack="false" runat="server"
                                                                        OnSelectedIndexChanged="DllYear_SelectedIndexChanged">
                                                                         <asp:ListItem Text="-Select-" Value="-Select-">
                                                                        </asp:ListItem>
                                                                    </asp:DropDownList>


                                                                    <%--To--%>
                                                                </div>
                                                                <div class="col-md-1">
                                                                    <asp:LinkButton ID="btnGo" OnClick="imgbtnSearch_Click" runat="server" CssClass="btn src-btn fa-search"
                                                                       OnClientClick="return validations();"  Text="&nbsp;&nbsp;Search"></asp:LinkButton>
                                                                </div>
                                                                <div class="col-md-1">
                                                                </div>
                                                                <div class="col-md-2">
                                                                    <asp:Label ID="lbl_ToDate" runat="server" Style="display: none" Text="To Date"></asp:Label>
                                                                </div>
                                                                <div class="col-md-3">
                                                                    <%--<asp:DropDownList ID="ddlShift" runat="server" CssClass="form-control select2">
                                                                    </asp:DropDownList>--%>
                                                                    <asp:TextBox ID="txtTo" runat="server" Style="display: none" CssClass="form-control">
                                                                    </asp:TextBox>
                                                                </div>
                                                                
                                                            </div>
                                                            
                                                            <%-- <div class="row" style="margin-top: 10px"> OnClientClick="return validation();"
                                                                <div class="col-md-6">
                                                                </div>
                                                                <div class="col-md-5">
                                                                    <div class="pull-right-button">
                                                                    </div>
                                                                </div>
                                                            </div>--%>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="clearfix">
                        </div>
                    </div>
                </div>
            </div>
            <br />
            <%--<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                <ContentTemplate>--%>




            <div class="row">
                <div class="col-md-12" id="PredictionChart" runat="server">
                    <!--Approval Data-->
                    <div class="nav-tabs-custom">
                        <!-- Tabs within a box -->
                        <ul class="nav nav-tabs pull-right" id="tablist2">
                            <li class="pull-left header">
                                <img src="dist/img/app-date.png" class="att-date"><asp:Label ID="lblAppData" Text="Leave Analysis Chart" runat="server"></asp:Label></li>
                        </ul>

                        <div class="row form-group">

                            <div class="tab col-md-3" style="width: 1600px">

                                <%--<div id="tab6" style="position:relative" runat="server">--%>

                                <div id="chart" class="col-md-6" style="padding-left: 80px">
                                    <div id="timeline-chart"></div>
                                </div>

                                <%--</div>--%>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-md-12" id="PredictionChart1" runat="server">
                    <!--Month Grid Data-->
                    <div class="nav-tabs-custom">

                        <ul class="nav nav-tabs pull-right" id="tablist3">
                            <li class="pull-left header">
                                <img src="dist/img/app-date.png" class="att-date"><asp:Label ID="Label3" Text="Month Wise Leave Deatils" runat="server"></asp:Label></li>
                        </ul>

                        <div class="row form-group">
                            <div class="col-md-12">
                                <div class="table-responsive">
                                    <asp:GridView ID="grv_AnalysisYear" runat="server" AutoGenerateColumns="true" AllowPaging="true"
                                        PageSize="10" CellPadding="4" OnSelectedIndexChanged="grv_AnalysisYear_SelectedIndexChanged"
                                        OnRowDataBound="grv_AnalysisYear_RowDataBound"
                                        AutoGenerateSelectButton="true" CssClass="table das-table1">
                                        <RowStyle Height="30px" CssClass="table-bg" BorderColor="#C5DFFC" />
                                        <PagerStyle Font-Overline="False" HorizontalAlign="Right" CssClass="GridPager" />
                                        <SelectedRowStyle BackColor="Yellow" />
                                        <%--<PagerSettings FirstPageText="<<" LastPageText=">>" Mode="NumericFirstLast" NextPageText=">"
                                                    PreviousPageText="<" />--%>
                                        <AlternatingRowStyle BackColor="white" />
                                    </asp:GridView>


                                    <%--<div class="row">
                                        <div class="col-md-12">
                                        </div>
                                    </div>--%>
                                    <div class="clearfix">
                                    </div>


                                    <div class="row" style="padding-top:20px;">
                                        <div class="clearfix">
                                    </div>
                                        <div class="col-md-12" id="PredictionChart2" runat="server">
                                            <!--Selected One Month Grid Data-->
                                            <div class="nav-tabs-custom">

                                                <ul class="nav nav-tabs pull-right" id="tablist4">
                                                    <li class="pull-left header">
                                                        <img src="dist/img/app-date.png" class="att-date"><asp:Label ID="Label2" 
                                                            Text="Selected Month Leave Deatils"
                                                             runat="server"></asp:Label></li>
                                                </ul>

                                                <div class="row form-group">
                                                    <div class="col-md-12">

                                                        <div class="row form-group" id="Secoundgrid" runat="server">
                                                            
                                                            <asp:GridView ID="grv_EmployeesLeaveDetail" runat="server" AutoGenerateColumns="False" AllowPaging="true"
                                                                PageSize="10" OnPageIndexChanging="grv_EmployeesLeaveDetail_PageIndexChanging" CellPadding="4"
                                                                CssClass="table das-table1">
                                                                <Columns>

                                                                    <asp:TemplateField HeaderText="Employee_Code_Id" HeaderStyle-CssClass="empheader"
                                                                        ItemStyle-CssClass="table-icons">
                                                                        <ItemTemplate>
                                                                            <itemstyle horizontalalign="Center" />
                                                                            <headerstyle horizontalalign="Center" />
                                                                            <asp:Label ID="lbl_EmpAutoId" Text='<%# Eval("Employee_Code_Id")%>' runat="server"></asp:Label>
                                                                        </ItemTemplate>
                                                                    </asp:TemplateField>
                                                                    <asp:TemplateField HeaderText="Employee Name" HeaderStyle-CssClass="empheader"
                                                                        ItemStyle-CssClass="table-icons">
                                                                        <ItemTemplate>
                                                                            <itemstyle horizontalalign="Center" />
                                                                            <headerstyle horizontalalign="Center" />
                                                                            <asp:Label ID="lbl_LoginEmployeeId" Text='<%# Eval("EmployeeName")%>' runat="server"></asp:Label>
                                                                        </ItemTemplate>
                                                                    </asp:TemplateField>
                                                                    <asp:TemplateField HeaderText="Leave_ApplicationDate" HeaderStyle-CssClass="empheader">
                                                                        <ItemTemplate>
                                                                            <itemstyle horizontalalign="Center" />
                                                                            <headerstyle horizontalalign="Center" />
                                                                            <asp:Label ID="lbl_EmpId" Text='<%# Eval("Leave_ApplicationDate")%>' runat="server"></asp:Label>
                                                                        </ItemTemplate>
                                                                    </asp:TemplateField>
                                                                    <asp:TemplateField HeaderText="Leave_FromDate" HeaderStyle-CssClass="empheader">
                                                                        <ItemTemplate>
                                                                            <itemstyle horizontalalign="Center" />
                                                                            <headerstyle horizontalalign="Center" />
                                                                            <asp:Label ID="lbl_EmpName" Text='<%# Eval("Leave_FromDate")%>' runat="server"></asp:Label>
                                                                        </ItemTemplate>
                                                                    </asp:TemplateField>
                                                                    <asp:TemplateField HeaderText="Leave_ToDate" HeaderStyle-CssClass="empheader">
                                                                        <ItemTemplate>
                                                                            <itemstyle horizontalalign="Center" />
                                                                            <headerstyle horizontalalign="Center" />
                                                                            <asp:Label ID="lbl_EmpName" Text='<%# Eval("Leave_ToDate")%>' runat="server"></asp:Label>
                                                                        </ItemTemplate>
                                                                    </asp:TemplateField>
                                                                    <asp:TemplateField HeaderText="Number Of Leave Days" HeaderStyle-CssClass="empheader" HeaderStyle-Width="150px">
                                                                        <ItemTemplate>
                                                                            <itemstyle horizontalalign="Center" />
                                                                            <headerstyle horizontalalign="Center" />
                                                                            <asp:Label ID="lbl_EmpName" Text='<%# Eval("NumberOfDays")%>' runat="server"></asp:Label>
                                                                        </ItemTemplate>
                                                                    </asp:TemplateField>

                                                                </Columns>
                                                                <RowStyle Height="30px" CssClass="table-bg" BorderColor="#C5DFFC" />
                                                                <PagerStyle Font-Overline="False" HorizontalAlign="Right" CssClass="GridPager" />
                                                                <%--<PagerSettings FirstPageText="<<" LastPageText=">>" Mode="NumericFirstLast" NextPageText=">"
                                                    PreviousPageText="<"/>--%>
                                                                <AlternatingRowStyle BackColor="white" />
                                                            </asp:GridView>

                                                        </div>
                                                     
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                </div>






                            </div>
                        </div>


                    </div>
                </div>
            </div>



        </div>
    </div>
    <div id="trLanding" visible="false" runat="server">
        <div class="dashboard">
            <h3>Home</h3>
        </div>
        <div class="panel-body" style="text-align: center;">
            <div>
                <div class="table">
                    <div class="row" runat="server">
                        <div class="col-md-12" style="margin-top: 30%">
                            <asp:Label ID="lblDemo" runat="server" Font-Bold="True" Font-Names="Verdana" Font-Size="XX-Large"
                                ForeColor="Gray" Visible="false"></asp:Label>
                            <asp:HiddenField ID="hfLogout" runat="server" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
   <%-- <script src="plugins/select2/select2.full.min.js"></script>--%>
    
</asp:Content>
