users.blade.php 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358
  1. @extends('layouts.app')
  2. @section('css')
  3. <link href="{!! env('APP_ASSETS') !!}css/outlets.css?v=1.3" rel="stylesheet" type="text/css">
  4. @endsection
  5. @section('content')
  6. <style>
  7. @-webkit-keyframes special {
  8. from { background-color: rgba(255, 121, 77, 0.27); }
  9. to { background-color: inherit; }
  10. }
  11. @-moz-keyframes special {
  12. from { background-color: rgba(255, 121, 77, 0.27);; }
  13. to { background-color: inherit; }
  14. }
  15. @-o-keyframes special {
  16. from { background-color: rgba(255, 121, 77, 0.27);; }
  17. to { background-color: inherit; }
  18. }
  19. @keyframes special {
  20. from { background-color: rgba(255, 121, 77, 0.27);; }
  21. to { background-color: inherit; }
  22. }
  23. .special {
  24. -webkit-animation: special 1s infinite; /* Safari 4+ */
  25. -moz-animation: special 1s infinite; /* Fx 5+ */
  26. -o-animation: special 1s infinite; /* Opera 12+ */
  27. animation: special 1s infinite; /* IE 10+ */
  28. }
  29. .btn-toggle.btn-sm,.btn-toggle.btn-sm > .handle{
  30. border-radius: 16px;
  31. }
  32. table.dataTable {
  33. clear: both;
  34. margin-top: 6px !important;
  35. margin-bottom: 6px !important;
  36. max-width: none !important;
  37. border-collapse: collapse !important;
  38. font-family: 'Open Sans';
  39. }
  40. .theme-primary .paging_simple_numbers .pagination .paginate_button.active a,.theme-primary .pagination li a:hover,.theme-primary .paging_simple_numbers .pagination .paginate_button:hover a{
  41. color: white !important;
  42. background: #ffa505 !important;
  43. }
  44. .search-outlet{
  45. width: 400px;
  46. background-color: white;
  47. }
  48. .search-buttom{
  49. top: 8px;
  50. right: 15px;
  51. font-size: 20px;
  52. color: #e1e1e1;
  53. }
  54. .btn-toggle.btn-sm:focus, .btn-toggle.btn-sm.focus, .btn-toggle.btn-sm:focus.active, .btn-toggle.btn-sm.focus.active{
  55. box-shadow: none;
  56. }
  57. .form-group.has-search input{
  58. width:100%;
  59. }
  60. .btn-toggle.active{
  61. color: white !important;
  62. background: #ffa505;
  63. }
  64. .dataTables_wrapper.container-fluid.dt-bootstrap4.no-footer{
  65. padding-right: 0px;
  66. }
  67. .content{
  68. padding-right:15px;
  69. }
  70. @media(max-width:767px)
  71. {
  72. .m-15{
  73. margin-left: 0px !important;
  74. }
  75. .content{
  76. padding-left:15px;
  77. }
  78. }
  79. .has-search{
  80. flex-grow: 2;
  81. }
  82. .orange_text{
  83. flex-grow: 8;
  84. }
  85. .add-outlet{
  86. }
  87. .outlet_col_div2{
  88. display: flex;
  89. align-items: center;
  90. justify-content: end;
  91. }
  92. </style>
  93. <!-- Content Wrapper. Contains page content -->
  94. <div class="content-wrapper">
  95. <div class="container-full">
  96. <!-- Main content -->
  97. <section class="content">
  98. <div class="row ">
  99. <div class="col-md-6">
  100. <div class="m-15">
  101. <h3 class="title">{{__('label.users')}}</h3>
  102. <p>Add user for handling this system</p>
  103. </div>
  104. </div>
  105. <div class="col-md-6 outlet_col_div2">
  106. <a href="{!! env('APP_URL') !!}admin/user/new" class="form-control btn btn-primary btn-md add-outlet text-center">
  107. <i class="fa fa-plus mr-2"></i>
  108. <!-- <i class="mdi mdi-plus-circle"></i> --> New User
  109. </a>
  110. </div>
  111. </div>
  112. <div class="row mt-15">
  113. <div class="col-md-12 pt-5">
  114. <div class="d-flex justify-content-between align-items-center">
  115. <h4 class="orange_text p-5" style="margin-left: 10px">{!! $users->count() !!} Users</h4>
  116. </div>
  117. </div>
  118. </div>
  119. <div class="table-responsive">
  120. <table class="table table-striped">
  121. <thead>
  122. <tr>
  123. <th scope="col">Name</th>
  124. <th scope="col">Email</th>
  125. <th scope="col">Phone</th>
  126. <th></th>
  127. </tr>
  128. </thead>
  129. <tbody>
  130. @if(isset($users) && $users->count() > 0)
  131. @foreach($users as $user)
  132. <tr>
  133. <td>{!! $user->first_name. ' ' . $user->last_name !!}</td>
  134. <td>{!! $user->users->email !!}</td>
  135. <td>
  136. {!! $user->mobile_number !!}
  137. </td>
  138. <td>
  139. <a href="javascript:;" data-id="{!! $user->id !!}" class="btn btn-sm btn-danger delete-user" data-toggle="tooltip" data-placement="top" title="Delete"><i class="glyphicon glyphicon-trash"></i></a>
  140. <a href="javascript:;" data-id="{!! $user->id !!}" class="btn btn-sm btn-danger resend-link" data-toggle="tooltip" data-placement="top" title="Resend Invite"><i class="glyphicon glyphicon-repeat"></i></a>
  141. </td>
  142. </tr>
  143. @endforeach
  144. @endif
  145. </tbody>
  146. </table>
  147. </div>
  148. </section>
  149. <!-- /.content -->
  150. </div>
  151. </div>
  152. <!-- /.content-wrapper -->
  153. <div class="modal" id="send-credentials" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
  154. <div class="modal-dialog">
  155. <div class="modal-content">
  156. <div class="modal-header">
  157. <h5 class="modal-title" id="staticBackdropLabel">{{__('label.user_new_credentails')}}</h5>
  158. <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  159. </div>
  160. <div class="modal-body">
  161. <p>{{__('label.you_credentails_submitting_by')}} <strong>{{__('label.save_credentails')}}</strong></p>
  162. <table border="0" style="width: 100%">
  163. <tr>
  164. <th width="30%"></th>
  165. <td id="username"></td>
  166. </tr>
  167. <tr>
  168. <th>{{__('label.password')}}</th>
  169. <td id="password"></td>
  170. </tr>
  171. </table>
  172. <div class="alert alert-success" style="display: none;">{{__('label.credentails_successful')}}</div>
  173. </div>
  174. <div class="modal-footer">
  175. <button type="button" class="btn btn-primary save-credentails">{{__('label.save_credentials')}}</button>
  176. <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
  177. </div>
  178. </div>
  179. </div>
  180. </div>
  181. <div class="modal" id="send-invitation-link" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
  182. <div class="modal-dialog">
  183. <div class="modal-content">
  184. <div class="modal-header">
  185. <h5 class="modal-title" id="staticBackdropLabel">{{__('label.resend_invitation_link')}}</h5>
  186. <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  187. </div>
  188. <div class="modal-body">
  189. <table border="0" style="width: 100%">
  190. <tr>
  191. <td id="link">
  192. <img src="{!! env('APP_ASSETS') !!}images/preloader-1.svg" style="height: 25px;">
  193. </td>
  194. </tr>
  195. </table>
  196. </div>
  197. </div>
  198. </div>
  199. </div>
  200. @endsection
  201. @section('js')
  202. <script>
  203. var user_id = 0;
  204. $(function () {
  205. $('.table').DataTable({
  206. paging: true,
  207. bLengthChange:false,
  208. searching: false,
  209. });
  210. $("body").on('click','.save-credentails',function () {
  211. var password = $("#password").html();
  212. $.ajax({
  213. url:"{!! env('APP_URL') !!}user/update/password",
  214. type:"POST",
  215. data:{
  216. user_id:user_id,
  217. password:password,
  218. '_token':"{!! csrf_token() !!}"
  219. },
  220. success:function (response) {
  221. $("#create-credentials .alert").show();
  222. setTimeout(function () {
  223. location.reload();
  224. },1500)
  225. }
  226. });
  227. });
  228. $("body").on("click",".credentials",function(e){
  229. var _id = $(this).data('id');
  230. user_id = _id;
  231. $("#username").html('<img src="{!! env('APP_ASSETS') !!}images/preloader-1.svg" style="height: 25px;">');
  232. $("#password").html('<img src="{!! env('APP_ASSETS') !!}images/preloader-1.svg" style="height: 25px;">');
  233. $.ajax({
  234. url:"{!! env('APP_URL') !!}user/get/credentials/"+_id,
  235. success:function (response) {
  236. $("#username").html(response.username);
  237. $("#password").html(response.password);
  238. }
  239. });
  240. $("#send-credentials").modal('show');
  241. e.preventDefault();
  242. e.stopPropagation();
  243. });
  244. $("body").on("click",".resend-link",function(e){
  245. var _id = $(this).data('id');
  246. $("#send-invitation-link").modal('show');
  247. $.ajax({
  248. url:"{!! env('APP_URL') !!}get/invitation/info/"+_id,
  249. success:function (response) {
  250. $("#link").html(response.message);
  251. setTimeout(function(){
  252. location.reload();
  253. },2500);
  254. }
  255. });
  256. e.preventDefault();
  257. e.stopPropagation();
  258. });
  259. $("body").on("click",".delete-user",function(e){
  260. var id = $(this).data('id');
  261. var _this = $(this);
  262. $.ajax({
  263. url:"{!! env('APP_URL') !!}delete/invitation/"+id,
  264. success:function(response){
  265. _this.parents('tr').remove();
  266. }
  267. });
  268. e.preventDefault();
  269. e.stopPropagation();
  270. });
  271. $("body").on("click","tr",function(){
  272. var id = $(this).data('id');
  273. // alert(id);
  274. if(id)
  275. window.location.href = "{!! env('APP_URL') !!}user/tanent/"+id;
  276. });
  277. $("body").on("click",".delete-saved-user",function(e){
  278. var id = $(this).data('id');
  279. var _this = $(this);
  280. $.ajax({
  281. url:"{!! env('APP_URL') !!}delete/saved/user/"+id,
  282. success:function(response){
  283. _this.parents('tr').remove();
  284. }
  285. });
  286. e.preventDefault();
  287. e.stopPropagation();
  288. });
  289. })
  290. </script>
  291. @endsection