Subversion Repositories SmartDukaan

Rev

Rev 35320 | Rev 35335 | Go to most recent revision | Blame | Compare with Previous | Last modification | View Log | RSS feed

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="description" content="Smart Dukaan FOCO Dashboard">
    <meta name="author" content="smartdukaan">
    <meta name="google-signin-client_id"
          content="$googleApiKey">
    <meta name="referer" content="no-referer">
    <meta name="referrer" content="no-referrer">
    <!--<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">-->
    <link rel="shortcut icon" href="assets/images/icons/favicon.png">

    <title>Smart Dukaan - FOCO Dashboard</title>

    <!-- Bootstrap CSS -->
    <!-- bootstrap theme -->
    <!--external css-->
    <!-- font icon -->
    <link href="resources/css/elegant-icons-style.css" rel="stylesheet"/>
    <link href="resources/css/font-awesome.min.css" rel="stylesheet"/>
    <!-- full calendar css-->
    <!-- owl carousel -->
    <link rel="stylesheet" href="resources/css/owl.carousel.css"
          type="text/css">
    <link href="resources/css/jquery-jvectormap-1.2.2.css" rel="stylesheet">
    <!-- Custom styles -->
    <link href="resources/css/widgets.css" rel="stylesheet">
    <link href="resources/css/multi.min.css?v=${cssVersion}" type="text/css"
          rel="stylesheet">
    <link href="resources/css/style.css?v=${cssVersion}" rel="stylesheet">
    <link href="resources/css/card.css?v=${cssVersion}" rel="stylesheet">
    <link href="resources/css/style-responsive.css" rel="stylesheet"/>
    <link href="resources/css/jquery-ui-1.10.4.min.css" rel="stylesheet">
    <link type="text/css" href="resources/css/bootstrap.css"
          rel="stylesheet">
    <!--<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap/3/css/bootstrap.css" />-->
    <link href="resources/css/bootstrap-theme.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css"
          href="resources/js/daterangepicker/daterangepicker.css"/>
    <link rel="stylesheet" type="text/css"
          href="resources/js/chosen.min.css"/>
    <link href="resources/css/bootstrap-duallistbox.css" rel="stylesheet"/>
    <link rel="stylesheet" type="text/css"
          href="resources/css/bootstrap-multiselect.css"/>
    <link rel="stylesheet" type="text/css"
          href="resources/css/datatables.bootstrap.min.css"/>
    <link rel='stylesheet'
          href='https://use.fontawesome.com/releases/v5.7.0/css/all.css'
          integrity='sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ'
          crossorigin='anonymous'>
    <link rel="stylesheet" type="text/css" href="resources/css/bootstrap-tagsinput.css">
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
    <script>
        function signOut() {
            var auth2 = gapi.auth2.getAuthInstance();
            auth2.signOut().then(function () {
                window.location.href = "${rc.contextPath}/logout";
                console.log('User signed out.');

            });
        }

        function onLoad() {
            gapi.load('auth2', function () {
                gapi.auth2.init();
            });
        }
    </script>

    <style type="text/css">
        .select2-container{
            display: block !important;
        }
        #sidebar {
            z-index: 999;
        }
        .loading {
            display: none;
        }

        .breadcrumb {
            padding: 0 15px;
        }

        .stars-outer {
            display: inline-block;
            position: relative;
            font-family: 'Mukta', FontAwesome, Hind;
        }

        .stars-outer::before {
            content: "\f006 \f006 \f006 \f006 \f006";
        }

        .stars-inner {
            position: absolute;
            top: 0;
            left: 0;
            white-space: nowrap;
            overflow: hidden;
            width: 0;
        }

        .stars-inner::before {
            content: "\f005 \f005 \f005 \f005 \f005";
            color: #f8ce0b;
        }

        .table-striped > tbody > tr:nth-child(odd) > td {
            background: white;
            background-color: #dae5f4;
        }

        .table-striped > tbody > tr:nth-child(even) > td {
            background: #f2f2f2;
            background-color: #b8d1f3;
        }

        .btn:hover {
            color: grey;
            text-decoration: none;
        }

        .btn-primary:hover {
            color: grey;
            text-decoration: none;
        }

        .sale-details {
            cursor: pointer;
        }

        .popover {
            min-width: 18%;
        }

        .fa-2x {
            font-size: 1.4em;
        }

        .cover {
            object-fit: cover;
            width: 100%;
            height: 90px;
            padding: 8px;
        }

        .info-box .notifications i {
            display: inline-block;
            margin-top: 0px;
            height: 25px;
            font-size: 16px;
            line-height: 25px;
            width: 25px;
            float: none;
            text-align: center;
            padding-right: 0px;
            color: #768399;
        }

        #preview {
            position: relative;
            color: #fff;
            float: left;
            width: 100%;
            -webkit-border-radius: 10px;
            -moz-border-radius: 10px;
            border-radius: 10px;
            clear: both;
        }

        #canvas-preview {
            width: 100%;
            position: relative;
            top: -15px;
        }

        #preview-textfield {
            position: absolute;
            top: -10px;
            left: 0;
            right: 0;
            text-align: center;
            font-size: 2em;
            font-weight: bold;
            color: white;
            font-family: 'Amaranth', sans-serif, 'Mukta';
        }
    </style>

    <script type="text/javascript">
        isAdmin = true;

        function getWarehousePartners(warehouseId) {

            doGetAjaxRequestHandler(context + "/getWarehousePartners?warehouseId=" + warehouseId,
                    function (response) {
                        $('#' + "main-content").html(response);
                        console.log(response)
                    });
        }


        function getWarehouseBrandStock(warehouseId) {

            doGetAjaxRequestHandler(context + "/getWarehouseWiseBrandStock?warehouseId=" + warehouseId,
                    function (response) {
                        $('#' + "main-content").html(response);
                        console.log(response)
                    });
        }


        function getWarehouseWiseBrandPartnerSale(brand) {

            doGetAjaxRequestHandler(context + "/getWarehouseWiseBrandPartnerSale?brand=" + brand,
                    function (response) {
                        $('#' + "main-content").html(response);
                        console.log(response)
                    });
        }

        function getWarehouseWiseBrandActivatedModel(brand) {

            doGetAjaxRequestHandler(context + "/getActivatedModelWarehouseWise?brand=" + brand,
                    function (response) {
                        $('#' + "main-content").html(response);
                        console.log(response)
                    });
        }

        function getWarehouseWiseAccessoriesBrandPartnerSale(brand) {
            doGetAjaxRequestHandler(context + "/getWarehouseWiseAccesoriesBrandPartnerSale?brand=" + brand,
                    function (response) {
                        $('#' + "main-content").html(response);
                        console.log(response)
                    });
        }


    </script>

    <script type="text/javascript">
        function getWarehouseWiseData() {
            doGetAjaxRequestHandler(context + "/getWarehouseWiseData",
                    function (response) {
                        $('#' + "main-content").html(response);
                        console.log(response)
                        if (response == 'true') {

                            window.location.href = $('.dashboardload').attr('href');
                        }
                    });
        }

        function getPartnersStat() {
            doGetAjaxRequestHandler(context + "/getPartnersStatData",
                    function (response) {
                        if (response == 'true') {
                            window.location.href = $('.dashboardload').attr('href');
                        }
                    });
        }


    </script>


</head>

<body style="background-color: #f7f7f7">
<div class="loading"><img src="resources/images/icons/loading.gif"></div>
<!-- container section start -->
<section id="container">


    <header class="header dark-bg">
        <div class="toggle-nav">
            <div class="icon-reorder tooltips"
                 data-original-title="Toggle Navigation" data-placement="bottom">
                <i class="icon_menu"></i>
            </div>
        </div>
        <div class="top-nav notification-row">
            <!-- notification dropdown start-->
            <ul class="nav pull-right top-menu">
                <!-- user login dropdown start-->
                <li class="dropdown"><a data-toggle="dropdown"
                                        class="dropdown-toggle" href="#"> <span class="profile-ava">
                                                                <img class="avatar-custom" id="photo" alt="" src="">
                                                </span> <span class="username" id="fofo_name"></span> <b class="caret"></b>
                </a>
                    <ul class="dropdown-menu extended logout">
                        <div class="log-arrow-up"></div>
                        <li class="eborder-top"><a class="change-auth-user-password"
                                                   href="javascript:void(0);"><i class=""></i>Change Password</a></li>
                        <li><a href="${rc.contextPath}/mobileapp"><i class="icon_key_alt" id="logout"></i>SD Mobile App</a>
                        </li>
                        ##                        <li><a href="${rc.contextPath}/logout"><i
                        ##                                class="icon_key_alt" id="logout"></i> Log Out</a></li>
                        <script src="https://apis.google.com/js/platform.js?onload=onLoad" async defer></script>

                        <li><a href="javascript:void(0);" onclick="signOut();"><i
                                class="icon_key_alt" id="logout"></i> Log Out</a></li>
                        <!--  <li> <a href="#" language='english' class="active">English</a>
                                       <a href="#" language='hindi'>Hindi</a></li>-->
                        <li>
                            <!-- <li> <a href"@{?lang=en}" class="active">English</a>-->
                            <!-- <a href='javascript:;' onclick='changelanguage("en");'>English ></a>
                             <a href='javascript:;' onclick='changelanguage("hi");'>Hindi ></a>
                                    <a href="ref"@{?lang=hi}">Hindi</a>
                                      </li>-->
                    </ul>
                </li>
                <!-- user login dropdown end -->
            </ul>
            <!-- notificatoin dropdown end-->
        </div>
    </header>
    <!--header end-->

    <!--sidebar start this-->
    <aside>
        <div id="sidebar" class="nav-collapse ">
            <!-- sidebar menu start-->
            <ul class="sidebar-menu">
                <li class="active"><a class="dashboardload"
                                      href="${rc.contextPath}/dashboard"> <i class="icon_house_alt"></i>
                    <span>Dashboard</span>
                </a></li>
                #foreach($menuItem in $menu)
                    <li class="sub-menu"><a href="javascript:;" class=""> <i
                            class="icon_document_alt"></i> <span>$menuItem.getDisplayText()</span>
                        <span class="menu-arrow arrow_carrot-right"></span>
                    </a>
                        <ul class="sub">
                            #foreach($subMenu in $menuItem.getSubMenus())
                                <li><a class="$subMenu.getActionClass()"
                                       href="javascript:void(0);">$subMenu.getDisplayText()</a></li> #end
                        </ul>
                    </li> #end
            </ul>
            <!-- sidebar menu end-->
        </div>
    </aside>
    <!--sidebar end-->

    <!--main content start-->
    <section id="main-content">
        <section class="wrapper">
            <!--overview start-->
            <div class="row">
                <div class="col-lg-12">
                    <h3 class="page-header">
                        <i class="fa fa-laptop"></i>
                        #springMessage("app.title")
                    </h3>
                    <ol class="breadcrumb">
                        <li>
                            <!-- <i class="fa fa-home"></i><a
                                href="${rc.contextPath}/dashboard">Home</a></li>-->
                            <i class="fa fa-home"></i><a
                                href="${rc.contextPath}/dashboard">#springMessage("home.home")</a></li>
                        <li><i class="fa fa-laptop"></i>Dashboard</li>
                    </ol>
                </div>
            </div>
            <!-- overview end -->

            #if($warehousePartnerDetailMap)
                <div class="row">

                    <div class="col-lg-6">

                        <div class="row col-lg-4">
                            <h3 style="margin-top: -2px; margin-bottom: 24px">
                                <strong>Partner Wise Report</strong>
                            </h3>
                        </div>
                        <div style="float: right">
                                                        <span style="margin-right: 10px">Last Fetch :-
                                $rctPartneStat.getLastCreatedTimestamp().format($dateTimeFormatter)</span>
                            <!--   <button class="btn btn-primary fetchPartnersData"
                                       onclick="getPartnersStat()" type="button">Fetch
                               </button> -->
                        </div>
                        <table class="table table-striped table-advance table-hover">
                            <tbody>
                            <tr>
                                <th>W/H Location</th>
                                <th>Partners</th>
                                <th>LMS</th>
                                <th>LMTD</th>
                                <th>MTD</th>
                                <th>Today Tertiary</th>
                                <th>Tickets</th>
                            </tr>
                                #foreach($name in $warehousePartnerDetailMap.keySet())
                                <tr onclick="getWarehousePartners($name)">
                                    <td>$warehouseMap.get($name)</td>
                                    <td>$warehousePartnerDetailMap.get($name).getCount()</td>
                                    <td class="currency">$warehousePartnerDetailMap.get($name).getLms()</td>
                                    <td class="currency">$warehousePartnerDetailMap.get($name).getLmtd()</td>
                                    <td class="currency">$warehousePartnerDetailMap.get($name).getMtd()</td>
                                    <td class="currency">$warehousePartnerDetailMap.get($name).getTodayTertiary()</td>

                                    <td>$warehousePartnerDetailMap.get($name).getTicket()</td>

                                </tr>
                                #end

                            </tbody>
                        </table>
                    </div>

                    <div class="col-lg-4">
                        <div class="row col-lg-8">
                            <h3 style="margin-top: -2px; margin-bottom: 24px">
                                <strong>Warehouse Wise Report</strong>
                            </h3>
                        </div>

                        <div style="float: right">
                                                        <span style="margin-right: 10px">Last Fetch :-
                                $reporticoDate.getLastCreatedTimestamp().format($dateTimeFormatter)</span>
                            <button class="btn btn-primary fetchWarehouseData"
                                    onclick="getWarehouseWiseData()" type="button">Fetch
                            </button>
                        </div>
                        <table class="table table-striped table-advance table-hover">
                            <tbody>
                            <tr>
                                <th>W/H Location</th>
                                <th>Total Stock</th>
                                <th>Total Value</th>
                                <th>Pending Indent</th>
                                <th>Tertiary</th>
                            </tr>
                                #foreach($key in $warehouseStockMap.keySet())
                                <tr
                                        onclick="getWarehouseBrandStock($warehouseStockMap.get($key).getWarehouseId())">
                                    <td>$warehouseMap.get($key)</td>
                                    #if($warehouseStockMap.get($key).getStockQty())
                                        <td>$warehouseStockMap.get($key).getStockQty()</td>
                                        <td class="currency">$warehouseStockMap.get($key).getStockValue()</td>
                                    #else
                                        <td>0</td>
                                        <td>0</td> #end
                                    #if($warehouseStockMap.get($key).getPendingIndent())
                                        <td>$warehouseStockMap.get($key).getPendingIndent()</td> #else
                                        <td>0</td> #end
                                    <td>$warehouseStockMap.get($key).getTertiary()</td>
                                </tr>
                                #end
                            </tbody>
                        </table>
                    </div>
                </div>
            #end
            <button class="btn btn-primary  clickshwograph"
                    style="display: none" type="button">Submit
            </button>

            <div class="row">
                #if($warehousePartnerDetailMap)



                    <div class="col-lg-6">


                        <div class="row chartfilterlmsContainer" style="margin: 5px"></div>

                        <div class="row col-lg-12">
                            <ul class="nav nav-tabs">
                                <li class="brand_month_sales"><a class="bms">BWMS</a></li>
                                <li class="brand_month_purchase"><a class="bmp">BWMP</a></li>
                            </ul>
                            <div class="row chartLmsContainer" style="margin:5px"></div>


                        </div>


                    </div>
                #end


                #if($warehousePartnerDetailMap)
                    <div class="col-lg-6">
                        <ul class="nav nav-tabs" style="margin: 5px">
                            <li class="mobile_based"><a class="ba">Mobile</a></li>
                            <li class="accessories_based"><a class="la">Accessories</a></li>
                            <li class="activation_summary"><a class="as">Activation Summary</a></li>
                            <li class="activation_updation"><a class="au">Activation Updation</a></li>


                        </ul>


                        <div class="row reportContainer" style="margin: 5px"></div>

                    </div>



                #end

            </div>

            <div class="row">


                <div class="col-lg-6">


                    <div class="row" style="margin-left:5px">
                        <h3 style="margin-top: -2px; margin-bottom: 24px">
                            <strong>Sale MileStone</strong>
                        </h3>
                    </div>

                    <div class="row saleMilestoneContainer" style="margin: 5px"></div>


                </div>


                <div class="col-lg-6">


                    <div class="row" style="margin-left:5px">
                        <h3 style="margin-top: -2px; margin-bottom: 24px">
                            <strong>Purchase MileStone</strong>
                        </h3>
                    </div>

                    <div class="row purchaseMilestoneContainer" style="margin: 5px"></div>


                </div>


            </div>


            <div class="row">
                #if($authUserTicketCount)

                    <div class="col-lg-6">
                        <div class="row col-lg-8">
                            <h3 style="margin-top: -2px; margin-bottom: 24px">
                                <strong>Auth User Tickets</strong>
                            </h3>
                        </div>

                        <table class="table table-striped table-advance table-hover"
                               style="width: 65%">
                            <tbody>
                            <tr>
                                <th>Auth User</th>
                                <th>Tickets</th>
                            </tr>
                                #foreach($authUserTicket in $authUserTicketCount.entrySet())
                                <tr>
                                    <td>$authUserTicket.getKey().getName()</td>
                                    <td>$authUserTicket.getValue()</td>
                                </tr>
                                #end
                            </tbody>
                        </table>

                    </div>
                #end
                <div class="col-lg-6">
                    <h3 style="margin-top: -2px; margin-bottom: 24px">
                        <strong>Loan Summary</strong>
                    </h3>

                    <table class="table table-striped table-advance table-hover loan-summary-table"
                           style="width: 50%">
                        <tbody>
                        <thead>
                        <tr>
                            <th></th>
                            <th>Loan Count</th>
                            <th>Loan Value</th>
                        </tr>

                        </thead>
                        <tr>

                            <th>Total Loan</th>
                            <td class="loan" data-type="TOTAL_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal">$loanSummary.getPendingLoansLoanAggregation().getPartnerCount()</td>
                            <td class="currency">$loanSummary.getPendingLoansLoanAggregation().getTotalValue()</td>

                        </tr>

                        <tr>
                            <th>Default Loan</th>
                            <td class="loan" data-type="DEFAULT_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal">$loanSummary.getDefaultLoansAggregation().getPartnerCount()</td>
                            <td class="currency">$loanSummary.getDefaultLoansAggregation().getTotalValue()</td>
                        </tr>
                        <tr>
                            <th>Due Loan</th>
                            <td class="loan" data-type="DUE_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal">$loanSummary.getDueLoansAggregation().getPartnerCount()</td>
                            <td class="currency">$loanSummary.getDueLoansAggregation().getTotalValue()</td>
                        </tr>

                        </tbody>
                    </table>
                </div>

                <div class="col-lg-12">
                    <h3><strong>State wise loan summary</strong></h3>
                    <select id="stateDropdown" class="form-control" style="width:200px;">
                        <option value="">Select State</option>
                        #foreach($entry in $stateWiseLoanSummaryMap.entrySet())
                            <option value="$entry.key">$entry.key</option>
                        #end
                    </select>

                    <br/>
                </div>
                <div class="col-lg-3">
                    <table class="table table-striped table-hover loan-summary-table">
                        <thead>
                        <tr>
                            <th>Category</th>
                            <th>Loan Count</th>
                            <th>Loan Value</th>
                        </tr>
                        </thead>

                        <tbody>
                        <!-- MAIN SUMMARY -->
                        <tr>
                            <th colspan="3">Overall Summary</th>
                        </tr>
                        <tr>
                            <td>Pending</td>
                            <td id="total-pending-count" class="state-wise-loan" data-days="" data-statename=""
                                data-type="TOTAL_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal"></td>
                            <td id="total-pending-value"></td>
                        </tr>
                        <tr>
                            <td>Default</td>
                            <td id="total-default-count" class="state-wise-loan" data-days="" data-statename=""
                                data-type="DEFAULT_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal"></td>
                            <td id="total-default-value"></td>
                        </tr>
                        <tr>
                            <td>Due</td>
                            <td id="total-due-count" class="state-wise-loan" data-days="" data-statename=""
                                data-type="DUE_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal"></td>
                            <td id="total-due-value"></td>
                        </tr>

                        </tbody>
                    </table>
                </div>
                <div class="col-lg-3">
                    <table class="table table-striped table-hover loan-summary-table">
                        <thead>
                        <tr>
                            <th>Category</th>
                            <th>Loan Count</th>
                            <th>Loan Value</th>
                        </tr>
                        </thead>

                        <tbody>

                        <!-- 30 DAYS -->
                        <tr>
                            <th colspan="3">Above 30 Days</th>
                        </tr>
                        <tr>
                            <td>Pending</td>
                            <td id="days30-pending-count" class="state-wise-loan" data-days="30" data-statename=""
                                data-type="TOTAL_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal"></td>
                            <td id="days30-pending-value"></td>
                        </tr>
                        <tr>
                            <td>Default</td>
                            <td id="days30-default-count" class="state-wise-loan" data-days="30" data-statename=""
                                data-type="DEFAULT_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal"></td>
                            <td id="days30-default-value"></td>
                        </tr>
                        <tr>
                            <td>Due</td>
                            <td id="days30-due-count" class="state-wise-loan" data-days="30" data-statename=""
                                data-type="DUE_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal"></td>
                            <td id="days30-due-value"></td>
                        </tr>
                        </tbody>
                    </table>
                </div>
                <div class="col-lg-3">
                    <table class="table table-striped table-hover loan-summary-table">
                        <thead>
                        <tr>
                            <th>Category</th>
                            <th>Loan Count</th>
                            <th>Loan Value</th>
                        </tr>
                        </thead>

                        <tbody>
                        <!-- 60 DAYS -->
                        <tr>
                            <th colspan="3">Above 60 Days</th>
                        </tr>
                        <tr>
                            <td>Pending</td>
                            <td id="days60-pending-count" class="state-wise-loan" data-days="60" data-statename=""
                                data-type="TOTAL_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal"></td>
                            <td id="days60-pending-value"></td>
                        </tr>
                        <tr>
                            <td>Default</td>
                            <td id="days60-default-count" class="state-wise-loan" data-days="60" data-statename=""
                                data-type="DEFAULT_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal"></td>
                            <td id="days60-default-value"></td>
                        </tr>
                        <tr>
                            <td>Due</td>
                            <td id="days60-due-count" class="state-wise-loan" data-days="60" data-statename=""
                                data-type="DUE_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal"></td>
                            <td id="days60-due-value"></td>
                        </tr>
                        </tbody>
                    </table>
                </div>
                <div class="col-lg-3">
                    <table class="table table-striped table-hover loan-summary-table">
                        <thead>
                        <tr>
                            <th>Category</th>
                            <th>Loan Count</th>
                            <th>Loan Value</th>
                        </tr>
                        </thead>

                        <tbody>
                        <!-- 180 DAYS -->
                        <tr>
                            <th colspan="3">Above 180 Days</th>
                        </tr>
                        <tr>
                            <td>Pending</td>
                            <td id="days180-pending-count" class="state-wise-loan" data-days="180" data-statename=""
                                data-type="TOTAL_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal"></td>
                            <td id="days180-pending-value"></td>
                        </tr>
                        <tr>
                            <td>Default</td>
                            <td id="days180-default-count" class="state-wise-loan" data-days="180" data-statename=""
                                data-type="DEFAULT_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal"></td>
                            <td id="days180-default-value"></td>
                        </tr>
                        <tr>
                            <td>Due</td>
                            <td id="days180-due-count" class="state-wise-loan" data-days="180" data-statename=""
                                data-type="DUE_LOAN" data-toggle="modal"
                                data-target="#loanSummaryModal"></td>
                            <td id="days180-due-value"></td>
                        </tr>

                        </tbody>
                    </table>
                </div>
            </div>
            #if($authUserTicketCount)
                <div class="row">
                    <div class="col-lg-6">


                        <div class="row col-lg-4">
                            <h3 style="margin-top: -2px; margin-bottom: 24px">
                                <strong>Reports</strong>
                            </h3>
                        </div>
                        <div class="row col-lg-12 info-box white-bg">
                            <table class="table table-striped reports-table"
                                   style="display: none">
                                <tbody>
                                <div class="list-group">
                                    #foreach($reporticoProjectEntry in
                                        $reporticoProjectMap.entrySet()) #foreach($reporticoUrlInfo in
                                        $reporticoProjectEntry.getValue()) <a
                                            href="${rc.contextPath}/reports/${reporticoProjectEntry.getKey()}${reporticoUrlInfo.getUrl()}"
                                            class="list-group-item"
                                        #if($reporticoUrlInfo.getParamsList())
                                            data-paramslist="$vmUtils.htmlJson($reporticoUrlInfo.getParamsList())"
                                        #end>
                                        <h4 class="list-group-item-heading">$reporticoUrlInfo.getTitle()</h4>
                                        <p class="list-group-item-text">$reporticoUrlInfo.getDescription()</p>
                                    </a> #end #end
                                </div>
                                </tbody>
                            </table>

                        </div>
                    </div>
                    <div class="col-lg-6">


                        <div class="row col-lg-12 info-box white-bg">
                            <div class="col-lg-4">
                                <h3 style="margin-top: -2px; margin-bottom: 24px">
                                    <strong>My Messages</strong>
                                </h3>
                            </div>
                            <div class="col-lg-4">
                                <div class="btn-group message-filter">
                                    <button data-messagetype="notification" type="button"
                                            class="btn btn-default" aria-label="Notifications"
                                            title="Notifications">
                                        <span class="glyphicon glyphicon-bell" aria-hidden="true"></span>
                                    </button>
                                    <button data-messagetype="announcement" type="button"
                                            class="btn btn-default" aria-label="Announcements"
                                            title="Announcements">
                                        <span class="glyphicon glyphicon-bullhorn" aria-hidden="true"></span>
                                    </button>
                                    <button data-messagetype="scheme" type="button"
                                            class="btn btn-default" aria-label="SmartDukaan Schemes"
                                            title="SmartDukaan Schemes">
                                        <span class="glyphicon glyphicon-tags" aria-hidden="true"></span>
                                    </button>
                                    <button data-messagetype="marketing" type="button"
                                            class="btn btn-default" aria-label="SmartDukaan Schemes"
                                            title="SmartDukaan Schemes">
                                        <span class="glyphicon glyphicon-picture" aria-hidden="true"></span>
                                    </button>
                                </div>
                            </div>
                            <div class="col-lg-12 row notification-container"
                                 style="max-height: 500px; overflow-y: scroll;"></div>
                        </div>
                    </div>

                </div>


            #end #if(!$authUserTicketCount)

            <div class="row">
                <div class="col-lg-6">
                    <div class="row col-lg-4">
                        <h3 style="margin-top: -2px; margin-bottom: 24px">
                            <strong>Reports</strong>
                        </h3>
                    </div>
                    <div class="row col-lg-12 info-box white-bg">
                        <table class="table table-striped reports-table"
                               style="display: none">
                            <tbody>
                            <div class="list-group">
                                #foreach($reporticoProjectEntry in
                                    $reporticoProjectMap.entrySet()) #foreach($reporticoUrlInfo in
                                    $reporticoProjectEntry.getValue()) <a
                                        href="${rc.contextPath}/reports/${reporticoProjectEntry.getKey()}${reporticoUrlInfo.getUrl()}"
                                        class="list-group-item"
                                    #if($reporticoUrlInfo.getParamsList())
                                        data-paramslist="$vmUtils.htmlJson($reporticoUrlInfo.getParamsList())"
                                    #end>
                                    <h4 class="list-group-item-heading">$reporticoUrlInfo.getTitle()</h4>
                                    <p class="list-group-item-text">$reporticoUrlInfo.getDescription()</p>
                                </a> #end #end
                            </div>
                            </tbody>
                        </table>

                    </div>

                </div>
                <div class="col-lg-6">
                    <div class="col-lg-12">
                        <div class="row col-lg-12 info-box white-bg">
                            <div class="col-lg-4">
                                <h3 style="margin-top: -2px; margin-bottom: 24px">
                                    <strong>My Messages</strong>
                                </h3>
                            </div>
                            <div class="col-lg-4">
                                <div class="btn-group message-filter">
                                    <button data-messagetype="notification" type="button"
                                            class="btn btn-default" aria-label="Notifications"
                                            title="Notifications">
                                        <span class="glyphicon glyphicon-bell" aria-hidden="true"></span>
                                    </button>
                                    <button data-messagetype="announcement" type="button"
                                            class="btn btn-default" aria-label="Announcements"
                                            title="Announcements">
                                        <span class="glyphicon glyphicon-bullhorn" aria-hidden="true"></span>
                                    </button>
                                    <button data-messagetype="scheme" type="button"
                                            class="btn btn-default" aria-label="SmartDukaan Schemes"
                                            title="SmartDukaan Schemes">
                                        <span class="glyphicon glyphicon-tags" aria-hidden="true"></span>
                                    </button>
                                    <button data-messagetype="marketing" type="button"
                                            class="btn btn-default" aria-label="SmartDukaan Schemes"
                                            title="SmartDukaan Schemes">
                                        <span class="glyphicon glyphicon-picture" aria-hidden="true"></span>
                                    </button>
                                </div>
                            </div>
                            <div class="col-lg-12 row notification-container"
                                 style="max-height: 500px; overflow-y: scroll;"></div>
                        </div>
                    </div>
                </div>
            </div>

        #end
        </section>
        <div class="text-center">
            <div class="credits">
                <p>All rights reserved.&copy;2017, Smart Dukaan</p>
            </div>
        </div>
    </section>

    <script type="text/javascript">
        context = "${rc.contextPath}";
        webApiScheme = "$webApiScheme";
        webApiRoot = "$webApiRoot";
        webApiHost = "$webApiHost";
        webApiPort = "$webApiPort";
            #if($authId)
            retailers = $retailers;
            warehouses = $warehouses;
            authId = $authId;
            #end


    </script>
    #parse("include-scripts.vm")

    <script>

        //knob
        $(function () {
            /*$(".knob").knob({
              'draw' : function () {
                $(this.i).val(this.cv + '%')
              }
            });*/
            $.fn.dataTable.moment('DD/MM/YYYY');
            $.fn.dataTable.moment('DD/MM/YYYY hh:mm');
            $('.currency').each(function (index, ele) {
                if (!isNaN(parseInt($(ele).html()))) {
                    $(ele).html(numberToComma($(ele).html()));
                }
            });
        });

        $(function () {
            var profile = localStorage.getItem('profile');
            if (profile) {
                $("#photo").attr("src", JSON.parse(profile).image_url);
                $("#fofo_name").text(JSON.parse(profile).name);
            } else {
                $("#photo").attr("src", "");
                $("#fofo_name").text("Welcome, User");
            }
        });


        $(function () {
            loaderDialogObj = bootbox.dialog({
                message: '<div class="container text-center"><i class="fa fa-spin fa-spinner"></i>Loading...</div>',
                show: false
            });
        });

        $(document).ready(function () {

            $(".clickshwograph").click();

            $(".mobile_based").click();

            $('div.message-filter').on('click', 'button', function () {
                messageType = $(this).data("messagetype");
                if ($(this).hasClass('btn-pressed')) {
                    messageType = "";
                    $('div.message-filter').find('button').removeClass('btn-pressed').addClass('btn-default');
                } else {
                    $('div.message-filter').find('button').removeClass('btn-pressed').addClass('btn-default');
                    $(this).addClass('btn-pressed').removeClass('btn-default');
                }
                notifyTypeChange(messageType);
            });
            notifyTypeChange("");
        });


        $(document).on("click", ".mobile_based",
                function () {

                    $(".ba").css("color", "blue");
                    $(".ba").css("background-color", "white");
                    $(".la").css("color", "white");
                    $(".la").css("background-color", "#C0C0C0");
                    $(".as").css("color", "white");
                    $(".as").css("background-color", "#C0C0C0");

                    $(".au").css("color", "white");
                    $(".au").css("background-color", "#C0C0C0");

                    doGetAjaxRequestHandler(context + "/getMobileBrandWise", function (response) {
                        $('.reportContainer').html(response);
                    });
                });

        $(document).on("click", ".accessories_based",
                function () {

                    $(".ba").css("color", "white");
                    $(".ba").css("background-color", "#C0C0C0");
                    $(".la").css("color", "blue");
                    $(".la").css("background-color", "white");
                    $(".as").css("color", "white");
                    $(".as").css("background-color", "#C0C0C0");

                    $(".au").css("color", "white");
                    $(".au").css("background-color", "#C0C0C0");
                    doGetAjaxRequestHandler(context + "/getAccessoriesBrandWise", function (response) {
                        $('.reportContainer').html(response);
                    });
                });


        $(document).on("click", ".activation_summary",
                function () {

                    $(".as").css("color", "blue");
                    $(".as").css("background-color", "white");
                    $(".ba").css("color", "white");
                    $(".ba").css("background-color", "#C0C0C0");
                    $(".la").css("color", "white");
                    $(".la").css("background-color", "#C0C0C0");

                    $(".au").css("color", "white");
                    $(".au").css("background-color", "#C0C0C0");
                    doGetAjaxRequestHandler(context + "/getActivatedModelByBrand", function (response) {
                        $('.reportContainer').html(response);
                    });
                });


        $(document).on("click", ".activation_updation",
                function () {

                    $(".as").css("color", "white");
                    $(".as").css("background-color", "#C0C0C0");
                    $(".au").css("color", "blue");
                    $(".au").css("background-color", "white");
                    $(".ba").css("color", "white");
                    $(".ba").css("background-color", "#C0C0C0");

                    $(".la").css("color", "white");
                    $(".la").css("background-color", "#C0C0C0");
                    doGetAjaxRequestHandler(context + "/getActivatedImeiUpdationDate", function (response) {
                        $('.reportContainer').html(response);
                    });
                });


        doGetAjaxRequestHandler(context + "/getSaleCountByMilestone", function (response) {
            $('.saleMilestoneContainer').html(response);
        });

        doGetAjaxRequestHandler(context + "/getPurchaseCountByMileStone", function (response) {
            $('.purchaseMilestoneContainer').html(response);
        });
        doGetAjaxRequestHandler(context + "/getMobileLMSFilter", function (response) {
            $('.chartfilterlmsContainer').html(response);
        });


        $('.loan-summary-table').on('click', '.loan', function () {
            console.log($(this));
            let loanSummaryType = $(this).data("type");
            doGetAjaxRequestHandler(`${context}/getPartnerWiseLoanSummary?loanSummaryType=${loanSummaryType}`, function (response) {
                $('#loanSummaryModal .modal-content').html(response);
            });
        });

        $(document).on('click', ".brand_month_sales", function () {
            $(".bms").css("color", "blue");
            $(".bms").css("background-color", "white");
            $(".bmp").css("color", "white");
            $(".bmp").css("background-color", "#C0C0C0");
            var warehouseId = $('#warehouseMap').val();
            var filterType = $('#monthDateFilter').val();

            var fofoIds = $('#fofo-users').val();
            if (typeof fofoIds === 'string') {
                fofoIds = fofoIds.split(',').map(id => parseInt(id.trim()));
            }
            const data = {
                warehouseId: warehouseId,
                date: getDatesFromPicker($('input[name="dateRange"]')).startDate,
                endDate: getDatesFromPicker($('input[name="dateRange"]')).endDate,
                fofoIds: fofoIds,
                filterType: filterType
            };

            doPostAjaxRequestWithJsonHandler(context + "/getMobileLMSGraph", JSON.stringify(data), function (response) {
                $('.chartLmsContainer').html(response);
            });
        });

        $('#fofo-users').multiselect({
            includeSelectAllOption: true,
            multiple: true,
            maxHeight: 200,
            buttonWidth: '180px',
            numberDisplayed: 1,
            nonSelectedText: 'Users',
            nSelectedText: ' - Users Selected',
            allSelectedText: 'All Users Selected',
            enableFiltering: true,
            enableCaseInsensitiveFiltering: true
        });

        function changelanguage(val) {
            console.log(val);
            document.documentElement.setAttribute('lang', val)
            var url = window.location.host;
            alert(url);
            //var path = window.location.path;
            alert(path);
            //window.location.href =url+"/dashboard?lang="+val;
            window.open(url + "/dashboard?lang=" + val, "_self");
        }

    </script>

    <script>
        var stateLoanData = {
            #foreach($entry in $stateWiseLoanSummaryMap.entrySet())
                "$entry.key": {

                    // --- Main Summary ---
                    pendingLoans: {
                        partnerCount: $entry.value.pendingLoansLoanAggregation.partnerCount,
                        totalValue: $entry.value.pendingLoansLoanAggregation.totalValue
                    },
                    defaultLoans: {
                        partnerCount: $entry.value.defaultLoansAggregation.partnerCount,
                        totalValue: $entry.value.defaultLoansAggregation.totalValue
                    },
                    dueLoans: {
                        partnerCount: $entry.value.dueLoansAggregation.partnerCount,
                        totalValue: $entry.value.dueLoansAggregation.totalValue
                    },

                    // --- Above 30 Days Summary ---
                    above30Days: {
                        pending: {
                            partnerCount: $entry.value.above30Days.pending.partnerCount,
                            totalValue: $entry.value.above30Days.pending.totalValue
                        },
                        defaults: {
                            partnerCount: $entry.value.above30Days.defaults.partnerCount,
                            totalValue: $entry.value.above30Days.defaults.totalValue
                        },
                        dues: {
                            partnerCount: $entry.value.above30Days.dues.partnerCount,
                            totalValue: $entry.value.above30Days.dues.totalValue
                        }
                    },

                    // --- Above 60 Days ---
                    above60Days: {
                        pending: {
                            partnerCount: $entry.value.above60Days.pending.partnerCount,
                            totalValue: $entry.value.above60Days.pending.totalValue
                        },
                        defaults: {
                            partnerCount: $entry.value.above60Days.defaults.partnerCount,
                            totalValue: $entry.value.above60Days.defaults.totalValue
                        },
                        dues: {
                            partnerCount: $entry.value.above60Days.dues.partnerCount,
                            totalValue: $entry.value.above60Days.dues.totalValue
                        }
                    },

                    // --- Above 180 Days ---
                    above180Days: {
                        pending: {
                            partnerCount: $entry.value.above180Days.pending.partnerCount,
                            totalValue: $entry.value.above180Days.pending.totalValue
                        },
                        defaults: {
                            partnerCount: $entry.value.above180Days.defaults.partnerCount,
                            totalValue: $entry.value.above180Days.defaults.totalValue
                        },
                        dues: {
                            partnerCount: $entry.value.above180Days.dues.partnerCount,
                            totalValue: $entry.value.above180Days.dues.totalValue
                        }
                    }

                }#if($foreach.hasNext),#end
            #end
        };

        $(document).ready(function () {

            var defaultState = "Delhi";

            // Wait until dropdown is fully rendered
            setTimeout(function () {

                if (stateLoanData[defaultState]) {
                    $("#stateDropdown").val(defaultState);
                    $("#stateDropdown").trigger("change");
                }

            }, 100);


            $("#stateDropdown").on("change", function () {

                var selectedState = $(this).val();

                if (!selectedState) {
                    $("td[id]").text("");
                    return;
                }

                var data = stateLoanData[selectedState];

                $(".state-wise-loan").attr("data-statename", selectedState);

                // MAIN SUMMARY
                $("#total-pending-count").text(data.pendingLoans.partnerCount);
                $("#total-pending-value").text(Number(data.pendingLoans.totalValue).toFixed(2));

                $("#total-default-count").text(data.defaultLoans.partnerCount);
                $("#total-default-value").text(Number(data.defaultLoans.totalValue).toFixed(2));

                $("#total-due-count").text(data.dueLoans.partnerCount);
                $("#total-due-value").text(Number(data.dueLoans.totalValue).toFixed(2));

                // ABOVE 30 DAYS
                $("#days30-pending-count").text(data.above30Days.pending.partnerCount);
                $("#days30-pending-value").text(Number(data.above30Days.pending.totalValue).toFixed(2));

                $("#days30-default-count").text(data.above30Days.defaults.partnerCount);
                $("#days30-default-value").text(Number(data.above30Days.defaults.totalValue).toFixed(2));

                $("#days30-due-count").text(data.above30Days.dues.partnerCount);
                $("#days30-due-value").text(Number(data.above30Days.dues.totalValue).toFixed(2));

                // ABOVE 60 DAYS
                $("#days60-pending-count").text(data.above60Days.pending.partnerCount);
                $("#days60-pending-value").text(Number(data.above60Days.pending.totalValue).toFixed(2));

                $("#days60-default-count").text(data.above60Days.defaults.partnerCount);
                $("#days60-default-value").text(Number(data.above60Days.defaults.totalValue).toFixed(2));

                $("#days60-due-count").text(data.above60Days.dues.partnerCount);
                $("#days60-due-value").text(Number(data.above60Days.dues.totalValue).toFixed(2));

                // ABOVE 180 DAYS
                $("#days180-pending-count").text(data.above180Days.pending.partnerCount);
                $("#days180-pending-value").text(Number(data.above180Days.pending.totalValue).toFixed(2));

                $("#days180-default-count").text(data.above180Days.defaults.partnerCount);
                $("#days180-default-value").text(Number(data.above180Days.defaults.totalValue).toFixed(2));

                $("#days180-due-count").text(data.above180Days.dues.partnerCount);
                $("#days180-due-value").text(Number(data.above180Days.dues.totalValue).toFixed(2));
            });

        });


        $('.loan-summary-table').on('click', '.state-wise-loan', function () {
            console.log($(this));
            let loanSummaryType = $(this).data("type");
            let stateName = $("#stateDropdown").val();
            let days = $(this).data("days");
            doGetAjaxRequestHandler(`${context}/getPartnerStateWiseLoanSummary?loanSummaryType=${loanSummaryType}&stateName=${stateName}&days=${days}`, function (response) {
                $('#loanSummaryModal .modal-content').html(response);
            });
        });


    </script>

    <div id="report-modal" class="modal" role="dialog"
         data-backdrop="static" data-keyboard="false">
        <div class="modal-dialog">

            <!-- Modal content-->
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title"></h4>
                </div>
                <div class="modal-body"></div>
                <div class="modal-footer">
                    <button type="button" data-dismiss="modal"
                            class="btn btn-default download-report">Download
                    </button>
                </div>
            </div>
        </div>
    </div>
</section>

<div id="loanSummaryModal" class="modal" role="dialog">
    <div class="modal-dialog modal-lg">
        <div class="modal-content"></div>

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


</html>