|
|
<!DOCTYPE html><html lang="en" xmlns:th="http://www.thymeleaf.org"><head th:replace="~{fragments/modules/base/head :: head}"></head> <body> <!--[if lt IE 8]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p> <![endif]-->
<div class="wrapper"> <!-- header top menu Start --> <header th:replace="~{fragments/modules/base/header :: header}"></header> <!-- header top menu end -->
<div class="page-wrap"> <!--=============== Left Menu side Start ================--> <div th:replace="~{fragments/modules/base/menu :: menu}"></div> <!--=============== Left side End ================--> <div class="main-content"> <div class="container-fluid"> <div class="page-header"> <div class="row align-items-end"> <div class="col-lg-6"> <div class="page-header-title"> <i class="fa fa-user bg-blue"></i> <div class="d-inline"> <h5>User List</h5> <span>GCC Application Configuration</span> </div> </div> </div> <div class="col-lg-6"> <nav class="breadcrumb-container" aria-label="breadcrumb"> <ol class="breadcrumb"> <li class="breadcrumb-item"> <a href="/index"><i class="ik ik-home"></i></a> </li> <li class="breadcrumb-item">Admin</li> <li class="breadcrumb-item active" aria-current="page">User List</li> </ol> </nav> </div> </div> </div> <hr> <div class="row"> <div class="col-md-12"> <div class="card"> <div class="card-block"> <div> <table id="assetDatatable" class="table table-striped table-bordered table-hover dataTable" role="grid" width="100%"> <thead class="thead-dark"> <tr class="table-bordered"> <th class="text-center no-sort">S.No</th> <th class="text-center">Name</th> <th class="text-center">E-mail</th> <th class="text-center">Mobile</th> <th class="text-center">Username</th> <th class="text-center">Role</th> <th class="text-center">Access Group</th> <th class="text-center" width="10%">Status</th> <th class="text-center" width="10%">Action</th> </tr> </thead> <tbody> <tr th:each="userlistData, i : ${userlist}" class="${userlist}"> <td th:utext="${i.count}">0</td> <td th:utext="${userlistData.userid.name}"></td> <td th:utext="${userlistData.userid.email}"></td> <td th:utext="${userlistData.userid.phone}"></td> <td th:text="${userlistData.username}"></td> <td th:utext="${userlistData.roles}" class="text-center"></td> <td th:text="${userlistData.usergroup_id.name}"></td> <td style="text-transform: capitalize;" th:utext="${userlistData.isActive} ? 'Active' : 'Inactive'" th:class="${userlistData.isActive} ? 'text-center text-green' : 'text-center text-red'"></td> <td class="text-center"> <a th:href="@{#}" th:onclick="return callUserDetails([[${userlistData.id}]]);" data-toggle="tooltip" data-animation="true" data-placement="top" title="View User Details" data-original-title="View User Details"><i class="ik ik-file-text text-green" style="font-size: 18px;"></i></a> </td> </tr> </tbody> <tfoot class="thead-dark"> <tr class="table-bordered"> <th class="text-center no-sort">S.No</th> <th class="text-center">Name</th> <th class="text-center">E-mail</th> <th class="text-center">Mobile</th> <th class="text-center">Username</th> <th class="text-center">Role</th> <th class="text-center">Access Group</th> <th class="text-center" width="10%">Status</th> <th class="text-center" width="10%">Action</th> </tr> </tfoot> </table> </div> </div> </div> </div> </div> </div> </div>
<footer th:replace="~{fragments/modules/base/footer :: footer}"></footer> </div> </div> <div th:replace="~{fragments/modules/admin/modal-box :: div}"></div> <div th:replace="~{fragments/modules/base/app_module_menu_box :: div}"></div> <script th:replace="~{fragments/modules/base/script :: script}"></script> <script th:inline="javascript"> //var qrAssetFeedbackApiUrl = "[[${qrAssetFeedbackApiUrl}]]"; $(document).ready(function() { var exportTitle = "GCC Application User List"; // DataTables buttons configuration var buttons = [ { extend: 'pageLength', className: 'btn btn-warning' }, { title: 'Data export', extend: 'copyHtml5', text: 'Copy', className: 'btn btn-secondary', id: 'copyBtn' }, { extend: 'excelHtml5', text: 'Excel', className: 'btn btn-secondary', id: 'excelBtn', title: exportTitle }, { extend: 'csvHtml5', text: 'CSV', className: 'btn btn-secondary', id: 'csvBtn', title: exportTitle }, { extend: 'pdfHtml5', text: 'PDF', className: 'btn btn-secondary', id: 'pdfBtn', title: exportTitle } ]; $('#assetDatatable').DataTable( { /* Disable initial sort */ aaSorting: [], columnDefs: [ { targets: 'no-sort', orderable: false } ], dom: 'Bftip', lengthMenu: [ [ 50, 100, 200, 500, -1 ], [ '50 rows', '100 rows', '200 rows','500 rows', 'Show all' ] ], scrollY: '50vh', fixedColumns: { left: 1, right: 1 }, buttons: [buttons], responsive: true, searching: false, select: false, processing: false, } ); } ); // For view user details function callUserDetails(userid){ $("#profilehtml").html(searchinfo("<b>Retrieving Information, Please Wait...<div id=\"loadingimg\"></div></b>")); call_loading("loadingimg","start");
$('#viewUserDetails').modal({ backdrop: 'static', keyboard: false }) $('#viewUserDetails').modal('show'); var userProfileHtml = ""; getUserDetails(userid).then(response => { // Handle the success response $("#profilehtml").html(response); }) .catch(error => { // Handle the error response $("#profilehtml").html(error); }); } function getUserDetails(userid){ const apiUrl = "/election/api/getUserProfile"; return new Promise((resolve, reject) => { $.ajax({ url: apiUrl, type: 'GET', dataType: 'text', data: { userId: userid}, success: function(response) { // Handle the success response resolve(response); }, error: function(error) { // Handle the error response console.error('API error:', error); reject(error); } }); }); } </script> </body></html>
|
