<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Cache-control" content="no-cache">
    <title>Approve (v3.2)</title>
    <link rel="icon" type="image/x-icon" href="favicon.ico">
    <script src="js/viewmember/jquery-3.5.1.js"></script>
    <script src="js/viewmember/jquery.dataTables.min.js"></script>
    <script src="js/viewmember/dataTables.bootstrap5.min.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
    <link href="css/style_nav.css" rel="stylesheet">
    <script src="js/style_nav_c.js"></script>
    <link href="css/approve.css" rel="stylesheet">
    <script src="js/approve_c.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js"></script>
    <style>
        .navbar,
        hr {
            width: 1005%;
        }

        /*.editable {
            cursor: pointer;
        }*/
        .edit-btn,
        .save-btn {
            cursor: pointer;
            padding: 5px 20px;
        }
    </style>
</head>

<body>

    <nav class="navbar navbar-inverse">
        <div class="container-fluid">
            <div class="navbar-header">
                <img class="navbar-brand" id="navicon">
            </div>
            <ul class="nav navbar-nav">
                <li class="active"><a href="dashboard.html"><i class="fa fa-home"></i> Home</a></li>
                <li class="active"><a href="livecount.html"><i class="fa fa-eye"></i> Live Count</a></li>
                <li class="hidden" id="foradmin"><a href="audittrail.html"><i class="fa fa-history"></i> Audit Trail</a>
                </li>

                <li class="dropdown" id="foradmin1"><a class="dropdown-toggle" data-toggle="dropdown" href="#"><i
                            class="fa fa-hourglass-half"></i> Pending<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="pendingapproval.html">Pending Approval</a></li>
                        <li><a href="pendingrejected.html">Pending Rejected</a></li>
                    </ul>
                </li>

                <li class="hidden" id="pmcno"><a href="approve.html"><i class="fa fa-check-square-o"></i> View
                        Approval</a></li>
                <li class="hidden" id="pmcno1"><a href="reject.html"><i class="fa fa-times-circle"></i> View
                        Rejected</a></li>
                <li class="active"><a href="surveyreport.html"><i class="fa fa-desktop"></i> Survey Report</a></li>
                <!--<li class="hidden" id="gisadmin"><a href="gismap.html"><i class="fa fa-map-marker"></i> GIS Map</a></li>-->

                <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#"><i
                            class="fa fa-gear"></i> Settings<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li class="hidden" id="foradmin2"><a href="createlogin.html">Create Login</a></li>
                        <li><a href="logout.html"><span class="glyphicon glyphicon-log-out"
                                    style="color: goldenrod;"></span>
                                Logout</a></li>
                        <li><a id="usericon"></a></li>
                    </ul>
                </li>
                <div class="navbar-header">
                    <img class="navbar-brand" id="navicon1">
                </div>
            </ul>
        </div>
    </nav>

    <div class="example">

        <input id='myInput' onkeyup='searchTable()' type='text' placeholder="Search">

        <label id="title">SURVEY DATA APPROVAL</label>
        <hr id="hr">

        <div id="daterange" hidden>
            <label>From Date:</label>
            <input type="date" id="fdate">
            <label>To Date:</label>
            <input type="date" id="tdate">
            <input type="submit" class="btn btn-primary" id="bypass" onclick="submitBypass()">
        </div>

        <div id="trmid" hidden>
            <h4>Search by DTC TRM Id</h4>
            <label>Enter DTC TRM Id (in format 'id1','id2','id3',...): </label>
            <input type="text" id="dtcids" style="color: black;">
            <div id="dropdown">
                <select class="form-select hidden" id="circleselect">
                    <option value="0">Select Circle </option>
                    <option>BAGALKOT</option>
                    <option>BELAGAVI</option>
                    <option>BIJAPUR</option>
                    <option>CHIKODI</option>
                    <option>GADAG</option>
                    <option>HAVERI</option>
                    <option>HUBLI</option>
                    <option>SIRSI</option>
                </select>
            </div>
            <input type="submit" class="btn btn-primary" id="bypass_trmid" onclick="submit()">
            <!--<h3 id="reedit"><a href="reedit.html"> RE-EDIT</a></h3>-->
            <h3 id="reedit"><a id="reeditlink"> RE-EDIT</a></h3>
        </div>

        <div id="dropdown">
            <select class="form-select hidden" id="selectsurvey">
                <option value="0">Select Survey Type </option>
                <option>Pre-Survey</option>
                <option>Post-Survey</option>
            </select>
            <select class="form-select" id="selectzone" hidden>
                <option value="0">Select Zone </option>
            </select>
            <select class="form-select" id="selectcircle" hidden>
                <option value="0">Select Circle </option>
            </select>
            <select class="form-select" id="selectdivision" hidden>
                <option value="0">Select Division </option>
            </select>
            <select class="form-select" id="selectsubdivision" hidden>
                <option value="0">Select Sub Division </option>
            </select>
            <select class="form-select" id="selectsection" hidden>
                <option value="0">Select Section </option>
            </select>
            <select class="form-select" id="selectarea" hidden>
                <option value="0">Select Area </option>
                <option>RAPDRP (Urban)</option>
                <option>Non RAPDRP (Rural)</option>
            </select>
            <select class="form-select" id="selectfeeder" hidden>
                <option value="0">Select Feeder </option>
            </select>
            <select class="form-select" id="selectdtcname" hidden>
                <option value="0">Select DTC Name </option>
            </select>
            <select class="form-select" id="selectdtcid" hidden>
                <option value="0">Select DTC Id </option>
            </select>

            <input type="submit" class="btn btn-primary hidden" id="sub" onclick="submit()">
            <!--<button class="btn btn-primary" id="clr">Clear</button>-->

            <div class="container" id="approvecontainer" hidden>
                <div id="myBar" class="bar">0%
                </div>
                <p id="myBarcaption" style="color: white;"></p>
            </div>
            <button id="approveall" onclick="progressBarMove()" hidden> <i class="fa fa-check-square-o"
                    style="font-size:30px;color:white;"></i> Approve All</button>

            <!--<button id="genlink" onclick="genLink()" hidden> <i class="fa fa-link"
                    style="font-size:30px;color:white"></i> Gen Image Link</button>-->


            <button id="sendmail" onclick="sendMail('myTable', 'Survey_Data_')" hidden> <i class="fa fa-send-o"
                    style="font-size:30px;color:white"></i> Send Email</button>

            <button id="export" onclick="exportTableToExcel('myTable', 'Survey_Data')" hidden> <i
                    class="fa fa-file-excel-o" style="font-size:30px;color:white"></i> Export to Excel</button>

        </div>
        <hr id="hr1">

        <table id="myTable"></table>

        <!--<div>
            Show 
            <select id="rowsPerPageSelect" onchange="changeRowsPerPage()">
                <option value="5">5</option>
                <option value="10">10</option>
                <option value="20">20</option>
                <option value="50">50</option>
                <option value="100">100</option>
                <option value="all">All</option>
            </select> 
            rows per page
        </div>

        <div class="pagination">
            <button id="firstBtn" onclick="goToPage(1)">First</button>
            <button id="prevBtn" onclick="prevPage()">Prev</button>
            <span id="pageNumbers"></span>
            <button id="nextBtn" onclick="nextPage()">Next</button>
            <button id="lastBtn" onclick="goToPage(totalPages)">Last</button>
        </div>-->

        <div id="page_buttons">
            <button id="firstBtn" hidden>First</button>
            <button id="prevBtn" hidden>Previous</button>
            <button id="nextBtn" hidden>Next</button>
            <button id="lastBtn" hidden>Last</button>
        </div>

        <p id="pageno"></p>

        <p id="datasize" style="color: white; margin: 10px;"></p>
        <p id="downloadtime" style="color: white; margin: 10px;"></p>
        <p id="speed" style="color: white; margin: 10px;"></p>
    </div>

    <script src="js/com_config.js"></script>
    <script src="js/approve.js"></script>
</body>

</html>