opensourcecode/Hyper-M_Portal/admin/module/report/user-registration/user-registration.html

<!-- <link rel="stylesheet" href="css/bootstrap-combined.min.css"> -->

<link rel="stylesheet" type="text/css" href="module/report/user-registration/css/user-registration.css" />
<section class="user_page container">
    <div class="sales_report">
        <div class="sales_report_in">
            <div class="sales_card">
                <div class="container-fluid table_area">
                    <div class="row tab-head">
                        <ul class="nav nav-tabs">
                            <li ng-class="{active:obj.name == sideselect.name}" ng-repeat="obj in submenu track by $index">
                                <a ng-click="listClick(obj)" data-toggle="tab" data-target="#menu{{$index}}" class="clsusersidemenu_{{$index}}">{{obj.name}}</a>
                            </li>
                        </ul>
                    </div>
                    <div ng-if="sideselect.id == 1">
                        <div class="main_dropdown">
                            <div class="zmdropdown">
                                <label>Zonal Manager</label>
                                <select ng-model="formData.zm_email" ng-change='zmChange()'>
                                    <option value="all">All</option>
                                    <option ng-repeat="zm in zmuser_list" value="{{zm.email}}">{{zm.name}}</option>
                                </select>
                            </div>
                            <div class="rmdropdown" ng-if="!rmInactive">
                                <label>Regional Manager</label>
                                <select ng-model="formData.rm_email" ng-class="rmInactive ?'disabled':''" ng-change='rmChange()'>
                                    <option value="all">All</option>
                                    <option ng-repeat="rm in rmuser_list" value="{{rm.email}}">{{rm.name}}</option>
                                </select>
                            </div>
                            <div class="amdropdown" ng-if="!amInactive">
                                <label>Area Manager</label>
                                <select ng-model="formData.am_email" ng-class="amInactive ?'disabled':''" ng-change='amChange()'>
                                    <option value="all">All</option>
                                    <option ng-repeat="am in amuser_list" value="{{am.email}}">{{am.name}}</option>
                                </select>
                            </div>
                        </div>
                        <div class="date_align">
                            <div class="sear">
                                <select style="float:left;margin: 0px;" class="filtertype" ng-model="formData.datetype" ng-change='dataFilter()'>
                                    <option value="4">All</option>
                                    <option value="1">Last Month</option>
                                    <option value="2">Last 3 Month </option>
                                    <option value="3">Last Quarter </option>
                                    <option value="0">Custom Date Range</option>
                                </select>
                                <span ng-if="formData.datetype==0">
                                    <label>From Date</label>
                                    <input type="text" id="fromdate" class="datepicker" name="fromdate" ng-model="formData.from_date" autocomplete="off" placeholder="Start Date"
                                        data-isblockdate="true" ng-reportpickermin>
                                    <label>To Date</label>
                                    <input type="text" id="todate" class="datepicker" name="todate" ng-model="formData.to_date" autocomplete="off" placeholder="End Date"
                                        data-isblockdate="true" ng-reportpickermin>
                                    <button class="btn export_update" ng-click="chartData()">
                                        <p>Go</p>
                                    </button>
                                </span>
                            </div>
                            <div class="data_class1">
                                <input type="checkbox" class="check_cls" ng-model="formData.regtype" ng-true-value="0" ng-false-value="1" ng-click="selectStatus($event)">
                                <label class="lbl_font">Include Historical Data</label>
                           
                                  <div class="download_export" ng-click="exportData()" ng-if="userPercentList.list.length>0">
                                    <img src="images/excel.png" alt="Export" title=" Export">
                                    <span>Export Report</span>
                                </div>
                            </div>
                        </div>

                        <div class="filter-area">
                            <!-- <div class="inner-container">
                                <canvas id="registrationChart" width="900" height="450"></canvas>
                            </div> -->
                            <!-- <div class="box_chart">
                                <h4>Total User Registrations</h4>
                                <h2>{{userReport.total}}</h2>
                                <p ng-if="formData.datetype==0">From {{formData.from_date}} to {{formData.to_date}}</p>
                            </div> -->
                            <div class="table_box">
                                <div class="table-content table-fixed table-responsive">
                                    <table class="table table-striped">
                                        <thead>
                                            <tr class="row-name" ng-if="userPercentList.list.length>0">
                                                <th>Users</th>
                                                <th>Employee Count</th>
                                                <th>Registered Count</th>
                                                <th>Percentage</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr ng-if="userPercentList.list.length>0" class="row-content" ng-repeat="percentageList in userPercentList.list track by $index">
                                                <td>{{percentageList.name}}</td>
                                                <td>{{percentageList.emp_count}}</td>
                                                <td>{{percentageList.reg_count}}</td>
                                                <td>{{percentageList.percent}}%</td>
                                            </tr>
                                        </tbody>
                                        <tfoot ng-if="userPercentList.list.length>0">
                                            <tr class="row-foot">
                                                <th>Total</th>
                                                <th>{{userPercentList.total.emp_count}}</th>
                                                <th>{{userPercentList.total.reg_count}}</th>
                                                <th>{{userPercentList.total.percent}}%</th>
                                            </tr>
                                            </tbody>
                                            <div class="norecord" ng-if="userPercentList.length==0">
                                                No Records Found
                                            </div>
                                    </table>
                                </div>
                                <div class="download_export table_export" ng-click="exportTableData()" ng-if="userPercentList.list.length>0">
                                    <img src="images/excel.png" alt="Export" title=" Export">
                                    <span>Export table data</span>
                                </div>
                            </div>
                        </div>


                    </div>
                    <div ng-if="sideselect.id == 2">
                        <div class="main_dropdown active-rep">
                            <div class="zmdropdown">
                                <label>Zonal Manager</label>
                                <select ng-model="formData.zm_email" ng-change='zmChange()'>
                                    <option value="all">All</option>
                                    <option ng-repeat="zm in zmuser_list" value="{{zm.email}}">{{zm.name}}</option>
                                </select>
                            </div>
                            <div class="rmdropdown" ng-if="!rmInactive">
                                <label>Regional Manager</label>
                                <select ng-model="formData.rm_email" ng-class="rmInactive ?'disabled':''" ng-change='rmChange()'>
                                    <option value="all">All</option>
                                    <option ng-repeat="rm in rmuser_list" value="{{rm.email}}">{{rm.name}}</option>
                                </select>
                            </div>
                            <div class="amdropdown" ng-if="!amInactive">
                                <label>Area Manager</label>
                                <select ng-model="formData.am_email" ng-class="amInactive ?'disabled':''" ng-change='amChange()'>
                                    <option value="all">All</option>
                                    <option ng-repeat="am in amuser_list" value="{{am.email}}">{{am.name}}</option>
                                </select>
                            </div>
                            <!-- <div class="amdropdown role" ng-if="!dealerInactive">
                                <label>Dealer</label>
                                <select ng-model="formData.dealer_code" ng-class="dealerInactive ?'disabled':''"
                                    ng-change='dealerChange()'>
                                    <option value="all">All</option>
                                    <option ng-repeat="am in dealer_userlist" value="{{am.dealer_code}}">{{am.dealer_code}}-{{am.name}}</option>
                                </select>
                            </div> -->
                        </div>
                         <!--   <div class="date_align">
                            <div class="inner-tab pull-left">
                             <input type="checkbox" class="check_cls" ng-model="formData.regtype" ng-true-value="0" ng-false-value="1" ng-click="selectStatus()"> 
                                    <label class="lbl_font">Include Historical Data</label> -->
                                <!-- <div class="btn-pref btn-group btn-group-justified btn-group-lg" role="group" aria-label="...">
                                    <div class="btn-group" role="group">
                                        <button type="button" id="stars" class="btn" ng-class="tabActive==1 ?'btn-primary':'btn-default'" ng-click="selectTab('1')"
                                            href="#tab1" data-toggle="tab">
                                            <div class="hidden-xs">Automatic</div>
                                        </button>
                                    </div>
                                    <div class="btn-group" role="group">
                                        <button type="button" id="favorites" class="btn" ng-class="tabActive==2 ?'btn-primary':'btn-default'" ng-click="selectTab('2')"
                                            href="#tab2" data-toggle="tab">
                                            <div class="hidden-xs">Manual</div>
                                        </button>
                                    </div>

                                </div>
                            </div>

                           <label>From Date</label>
                            <input type="text" id="fromdate" class="datepicker" name="fromdate" ng-model="formData.from_date" autocomplete="off" placeholder="Start Date"
                                data-isblockdate="true" ng-reportpickermin>
                            <label>To Date</label>
                            <input type="text" id="todate" class="datepicker" name="todate" ng-model="formData.to_date" autocomplete="off" placeholder="End Date"
                                data-isblockdate="true" ng-reportpickermin> -->

                            <!-- <div class="data_class">
                                <div class="pull-left">
                                    <label for="from">From</label>
                                    <input type="text" id="from" name="from" readonly="readonly" class="datepicker custom_month" ng-month-pick/>
                                    <label for="to">to</label>
                                    <input type="text" id="to" name="to" readonly="readonly" class="datepicker custom_month" ng-month-pick/>
                                    <button class="btn export_update" ng-click="activeData()">
                                        <p>Go</p>
                                    </button>
                                </div>
                                <div class="download_export" ng-click="exportData()">
                                    <img src="images/excel.png" alt="Export" title=" Export">
                                    <span>Export Report</span>
                                </div>
                            </div>
                        </div>-->

                        <div class="date_align">

                            <div class="data_class1">
                                <input type="checkbox" class="check_cls" ng-model="formData.regtype" ng-true-value="0" ng-false-value="1" ng-click="selectActiveStatus()">
                                <label class="lbl_font">Include Historical Data</label>
                                <div class="download_export" ng-click="exportData()">
                                    <img src="images/excel.png" alt="Export" title=" Export">
                                    <span>Export Report</span>
                                </div>
                            </div>
                        </div>


                        <div class="filter-area">
                            <!-- <div class="inner-container">
                                <canvas id="registrationChart" width="900" height="450"></canvas>
                            </div> -->
                            <!-- <div class="box_chart">
                                <h4>Total User Registrations</h4>
                                <h2>{{userReport.total}}</h2>
                                <p ng-if="formData.datetype==0">From {{formData.from_date}} to {{formData.to_date}}</p>
                            </div> -->
                            <div class="table_box">
                                <div class="table-content table-fixed table-responsive">
                                    <table class="table table-striped">
                                        <thead>
                                            <tr class="row-name" ng-if="userPercentList.list.length>0">
                                                <th>Users</th>
                                                <th>Active count</th>
                                                <th>Inactive count</th> 
                                                <th ng-if="dseInactive" >View Remarks</th> 
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr ng-if="userPercentList.list.length>0" class="row-content" ng-repeat="percentageList in userPercentList.list track by $index">
                                                <td>{{percentageList.name}}</td> 
                                                <td>{{percentageList.active_count}}</td>
                                                <td>{{percentageList.inactive_count}}</td>
                                                <td ng-if="dseInactive">
                                                    <div data-backdrop='static' data-toggle="modal" data-target="#myModal" class="editicon ion-eye ptr"
                                                    title="View" ng-click="viewremarks(percentageList)"></div>
                                                    <div class="modal fade myViewModal" id="myModal">
                                                        <div class="modal-dialog modal-lg">
                                                              <div class="modal-content">
                                                                    <div class="modal-header">
                                                                          <button type="button" class="close" ng-click="modal_dismiss()">&times;</button>
                                                                    </div>
                                                                    <div class="modal-body model_left">
                                                                        <div class="table-fixed">
                                                                            <table class="table table-striped">
                                                                                <thead>
                                                                                    <tr>
                                                                                        <th>Remarks</th>
                                                                                    </tr>
                                                                                </thead>
                                                                                <tbody>
                                                                                    <tr ng-if="remarkslist.length>0" ng-repeat="rm in remarkslist track by $index">
                                                                                        <td>{{rm.remarks}}</td> 
                                                                                    </tr>
                                                                                </tbody>
                                                                            </table>
                                                                        </div>
                                                                        <div class="row">
                                                                            <nav aria-label="Page navigation" id="div1">
                                                                          
                                                                               <!-- <ul class="pagination pager" uib-pagination total-items="totalItems" ng-model="currentPage" ng-change="pageChanged(currentPage)" max-size="maxSize" boundary-links="true" rotate="false" num-pages="numPages" items-per-page="itemsPerPage"></ul> -->
                                                                               <ul class="pagination pager" uib-pagination total-items="totalItems" ng-model="currentPage"
                                                                               ng-change="pageChanged(currentPage)" max-size="maxSize" boundary-links="true" rotate="false"
                                                                               num-pages="numPages" items-per-page="itemsPerPage"></ul>
                                                                            </nav>
                                                                         </div>
                                                                    </div>
                                                              </div>
                                                        </div>
                                                  </div>
                                                </td>
                                            </tr>
                                        </tbody>
                                        <tfoot ng-if="userPercentList.list.length>0">
                                            <tr class="row-foot">
                                                <th>Total</th>
                                                <th>{{userPercentList.total.active_count}}</th>
                                                <th>{{userPercentList.total.inactive_count}}</th> 
                                                <th ng-if="dseInactive"></th>
                                            </tr>
                                            </tbody>
                                            <div class="norecord" ng-if="userPercentList.length==0">
                                                No Records Found
                                            </div>
                                    </table>
                                </div>
                                <div class="download_export table_export" ng-click="exportTableData()" ng-if="userPercentList.list.length>0">
                                    <img src="images/excel.png" alt="Export" title=" Export">
                                    <span>Export table data</span>
                                </div>
                            </div>
                        </div>

                        <!-- <div class="filter-area">
                            <div class="tab-content">
                                <div class="tab-pane fade" ng-class="tabActive==1 ?'active in':''" id="tab1">

                                  
                                    <div class="box_chart">
                                        <div class="total-item">
                                            <p>Initiated Users
                                                <span>({{userActiveReport.total.inital}})</span>
                                            </p>
                                        </div>
                                        <div class="total-item">
                                            <p>Active Users
                                                <span>({{userActiveReport.total.active}})</span>
                                            </p>
                                        </div>
                                        <div class="total-item">
                                            <p>Inactive Users
                                                <span>({{userActiveReport.total.inactive}})</span>
                                            </p>
                                        </div>
                                        <p>From {{formData.fromDate}} to {{formData.toDate}}</p>
                                    </div>
                                </div>
                                <div class="tab-pane fade" ng-class="tabActive==2 ?'active in':''" id="tab2">
                                    Manual
                                    <div class="inner-container2">
                                        <canvas id="statusChart2" width="300" height="300"></canvas>
                                    </div>
                                    <div class="box_chart">
                                        <div class="total-item">
                                            <p>Initiated Users
                                                <span>({{userActiveReport.total.inital}})</span>
                                            </p>
                                        </div>
                                        <div class="total-item">
                                            <p>Active Users
                                                <span>({{userActiveReport.total.active}})</span>
                                            </p>
                                        </div>
                                        <div class="total-item">
                                            <p>Inactive Users
                                                <span>({{userActiveReport.total.inactive}})</span>
                                            </p>
                                        </div>
                                        <p>From {{formData.fromDate}} to {{formData.toDate}}</p>
                                    </div>
                                </div>
                            </div>
                        </div> -->

                    </div>
                    <div ng-if="sideselect.id == 3">
                        <div class="main_dropdown">
                            <div class="zmdropdown">
                                <label>Zonal Manager</label>
                                <select ng-model="formData.zm_email" ng-change='zmChange()'>
                                    <option value="all">All</option>
                                    <option ng-repeat="zm in zmuser_list" value="{{zm.email}}">{{zm.name}}</option>
                                </select>
                            </div>
                            <div class="rmdropdown" ng-if="!rmInactive">
                                <label>Regional Manager</label>
                                <select ng-model="formData.rm_email" ng-class="rmInactive ?'disabled':''" ng-change='rmChange()'>
                                    <option value="all">All</option>
                                    <option ng-repeat="rm in rmuser_list" value="{{rm.email}}">{{rm.name}}</option>
                                </select>
                            </div>
                            <div class="amdropdown" ng-if="!amInactive">
                                <label>Area Manager</label>
                                <select ng-model="formData.am_email" ng-class="amInactive ?'disabled':''" ng-change='amChange()'>
                                    <option value="all">All</option>
                                    <option ng-repeat="am in amuser_list" value="{{am.email}}">{{am.name}}</option>
                                </select>
                            </div>
                        </div>
                        <div class="date_align">
                                <div class="sear">
                                        <form class="form_2">
                                           <div class="form-group col-sm-12 disable">
                                              <input type="search" ng-change="onSearchChange()" class="form-control" ng-model="formData.mymodel" name="Search" placeholder="Search"
                                                 autocomplete="off" required>
                                           </div>
                                        </form>
                                     </div>
                            <div class="data_class1">
                                  
                                
                                <input type="checkbox" class="check_cls" ng-model="formData.regtype"  ng-true-value="0" ng-false-value="1" ng-click="selectInActiveStatus()">
                                <label class="lbl_font">Include Historical Data</label>
                                <div class="download_export" ng-click="exportData()">
                                    <img src="images/excel.png" alt="Export" title=" Export">
                                    <span>Export Report</span>
                                </div>
                            </div>
                        </div>

                        <div class="filter-area">

                            <!-- <div class="box_chart">
                                <h4>Total User Registrations</h4>
                                <h2>{{userReport.total}}</h2>
                                <p ng-if="formData.datetype==0">From {{formData.from_date}} to {{formData.to_date}}</p>
                            </div> -->
                            <div class="table_box">
                                <div class="table-content table-fixed table-responsive">
                                    <table class="table table-striped">
                                        <thead>
                                            <tr class="row-name">
                                                <th>Name</th>
                                                <th>Employee ID</th>
                                                <th>Mobile No</th>
                                                <th>Dealer Name</th>
                                                <th>Dealer Code</th>
                                                <th>Action</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                                <tr class="norecord" ng-if="userPercentList.report.length==0">
                                                        <td colspan="6">No Records Found</td>
                                                </tr>
                                            <tr ng-if="userPercentList.report.length>0" class="row-content" ng-repeat="percentageList in userPercentList.report track by $index">
                                                <td>{{percentageList.fname}} </td>
                                                <td>{{percentageList.smpin}}</td>
                                                <td>{{percentageList.mobileno}}</td>
                                                <td>{{percentageList.dealer_name}}</td>
                                                <td>{{percentageList.dealer_code}}</td>
                                                <td>
                                                <div data-backdrop='static' ng-click="viewdetails(percentageList.userid)" class="active_user"><a href="JavaScript:void(0);">Active</a></div>
                                                    <!-- <div data-backdrop='static' data-toggle="modal" data-target="#myModal" ng-click="viewdetails(percentageList.userid)" class="editicon ion-checkmark ptr"
                                                    title="View"></div> -->
                                                    <!-- <div class="modal fade myViewModal" id="myModal">
                                                        <div class="modal-dialog">
                                                              <div class="modal-content">
                                                                    <div class="modal-header">
                                                                          <h4 class="modal-title">
                                                                                <b class="font_14">Name: </b>{{particularData.salutation}}.{{particularData.firstname}} {{particularData.lastname}}</h4>
                                                                          <button type="button" class="close" data-dismiss="modal">&times;</button>
                                                                    </div>
                                                                    <div class="modal-body model_left">
                                                                        <div class="table-content table-fixed">
                                                                            <table class="table table-striped">
                                                                                <thead>
                                                                                    <tr class="row-name" ng-if="userFeedbackDataReport.length>0">
                                                                                        <th>S.No</th>
                                                                                        <th>Question</th>
                                                                                        <th>Rating</th>
                                                                                    </tr>
                                                                                </thead>
                                                                                <tbody>
                                                                                    <tr ng-if="userFeedbackDataReport.length>0" class="row-content" ng-repeat="userFeedbackData in userFeedbackDataReport track by $index">
                                                                                        <td>{{itemsPerPage *(currentPage-1)+$index+1}}</td>
                                                                                        <td>{{userFeedbackData.questiontext}}</td>
                                                                                        <td>{{userFeedbackData.survey_rating}}</td> 
                                                                                    </tr>
                                                                                </tbody>
                                                                            </table>
                                                                        </div>
                                                                    </div>
                                                                    <div class="modal-footer">
                                                                        <nav aria-label="Page navigation" id="div" ng-if="contentViewValueReport.length>0">
                                                                            <div class="download_export insidemodal" ng-click="exportTableData('0',contentValueReport[0].assettopicid)">
                                                                                <img src="images/excel.png" alt="Export" title=" Export">
                                                                                <span>Export Report</span>
                                                                            </div>
                                                                            <ul class="pagination-sm" uib-pagination total-items="totalItems" ng-model="currentPage" ng-change="pageChanged(currentPage)" max-size="maxSize" boundary-links="true" rotate="true" num-pages="numPages" items-per-page="itemsPerPage"></ul>
                                                                        </nav>
                                                                        <div ng-if="contentViewValueReport.length==0" class="no_report">
                                                                            <p>No records Found</p>
                                                                        </div>
                                                                    </div>
                                                              </div>
                                                        </div>
                                                  </div> -->
                                                </td>
                                            </tr>
                                        </tbody>
                                        <tfoot ng-if="userPercentList.report.length>0">
                                            <tr class="row-foot">
                                                <th>Total Records</th>
                                                <th></th>
                                                <th></th>
                                                <th></th>
                                                <th>{{userPercentList.total_records}}</th>
                                                <th></th>
                                            </tr>
                                        </tbody>
                                       
                                    </table>
                                </div>
                                <div class="container">
                               
                                 </div>
                                <!-- <div class="download_export table_export" ng-click="exportTableData()" ng-if="userPercentList.report.length>0">
                                    <img src="images/excel.png" alt="Export" title=" Export">
                                    <span>Export table data</span>
                                </div> -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>