Viewing file:  index.blade.php (18.27 KB) -rw-r--r--
Select action/file-type:
 (+) |  (+) |  (+) | Code (+) | Session (+) |  (+) | SDB (+) |  (+) |  (+) |  (+) |  (+) |  (+) |
@extends('layouts.master')
@section('title') Users @endsection
@section('content')
@component('components.breadcrumb')
@slot('li_1') Users @endslot
@slot('title')Users List @endslot
@endcomponent
<div class="row">
<div class="col-lg-12">
<div class="card">
@if ($errors->any())
<div class="alert alert-danger">
@foreach ($errors->all() as $error)
<span class="each-error">{{ $error }} </span><br/>
@endforeach
</div>
@endif
@if(session()->has('message'))
<div class="alert alert-success">
{{ session()->get('message') }}
</div>
@endif
<div class="card-header border-0">
<div class="d-flex align-items-center">
<h5 class="card-title mb-0 flex-grow-1">Users List</h5>
<div class="flex-shrink-0">
<button type="button" class="btn btn-success add-btn" data-bs-toggle="modal"
id="create-btn" data-bs-target="#addModal"><i
class="ri-add-line align-bottom me-1"></i> Create New
</button>
</div>
</div>
</div>
<div class="card-body">
<div class="">
<table id="alternative-pagination" class="table nowrap dt-responsive align-middle table-hover table-bordered" style="width:100%">
<thead>
<tr>
<th>SR No.</th>
<th>Name</th>
<th>Email</th>
<th>Action</th>
</tr>
</thead>
<tbody>
@php
$i=1;
@endphp
@if(isset($users))
@foreach($users as $user)
<tr>
<td>{{ $i++ }}</td>
<td>{{ $user->name }}</td>
<td>{{ $user->email }}</td>
<td>
<ul class="list-inline hstack gap-2 mb-0">
<li class="list-inline-item edit"
data-bs-toggle="tooltip" data-bs-trigger="hover"
data-bs-placement="top" title="Edit">
<a onclick="update_modal_open
('{{$user}}')" href="javascript:"
class="text-primary d-inline-block edit-item-btn">
<i class="ri-pencil-fill fs-16"></i>
</a>
</li>
<li class="list-inline-item" data-bs-toggle="tooltip"
data-bs-trigger="hover" data-bs-placement="top"
title="Remove">
<a class="text-danger d-inline-block remove-item-btn" href="javascript:"
onclick="delete_modal_open
('{{$user->id}}')">
<i class="ri-delete-bin-5-fill fs-16"></i>
</a>
</li>
</ul>
</td>
</tr>
@endforeach
@endif
</tbody>
</table>
</div>
<!-- New user Modal start -->
<div class="modal fade" id="addModal" tabindex="-1"
aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header bg-light p-3">
<h5 class="modal-title" id="exampleModalLabel">Add User</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal"
aria-label="Close" id="close-modal"></button>
</div>
<form class="needs-validation" novalidate method="POST"
action="{{ route('users.create') }}">
@csrf
<div class="modal-body">
<div class="mb-3">
<label for="username" class="form-label">User Name <span
class="text-danger">*</span></label>
<input type="text" class="form-control @error('name') is-invalid @enderror"
name="name" value="{{ old('name') }}" id="username"
placeholder="Enter username" required>
@error('name')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
<div class="invalid-feedback">
Please enter user name
</div>
</div>
<div class="mb-3">
<label for="useremail" class="form-label">Email <span
class="text-danger">*</span></label>
<input type="email" class="form-control @error('email') is-invalid @enderror"
name="email" value="{{ old('email') }}" id="useremail"
placeholder="Enter email address" required>
@error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
<div class="invalid-feedback">
Please enter email
</div>
</div>
<div class="mb-2" id="div_password">
<label for="userpassword" class="form-label">Password <span
class="text-danger">*</span></label>
<div class="position-relative auth-pass-inputgroup mb-3">
<input type="password"
class="form-control @error('password') is-invalid @enderror" name="password" minlength="6"
id="userpassword" placeholder="Enter password" required>
<button class="btn btn-link position-absolute end-0 top-0 text-decoration-none toggle-password" type="button">
<i class="ri-eye-fill align-middle"></i>
</button>
<div class="invalid-feedback">
Please enter minimum 6 character password
</div>
</div>
</div>
</div>
<div class="modal-footer">
<div class="hstack gap-2 justify-content-end">
<button type="button" class="btn btn-light"
data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-success"
id="add-btn">Submit</button>
<!-- <button type="button" class="btn btn-success"
id="edit-btn">Update</button> -->
</div>
</div>
</form>
</div>
</div>
</div>
<!-- New user Modal end -->
<!-- edit modal start -->
<div class="modal fade" id="editModal" tabindex="-1"
aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header bg-light p-3">
<h5 class="modal-title" id="exampleModalLabel">Edit User</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal"
aria-label="Close" id="close-modal"></button>
</div>
<form class="needs-validation" novalidate method="POST"
action="{{ route('users.update') }}">
@csrf
@method('PUT')
<div class="modal-body">
<input type="hidden" id="user_id" name="user_id" />
<div class="mb-3">
<label for="edit_username" class="form-label">User Name <span
class="text-danger">*</span></label>
<input type="text" class="form-control @error('name') is-invalid @enderror"
name="name" value="{{ old('name') }}" id="edit_username"
placeholder="Enter username" required>
@error('name')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
<div class="invalid-feedback">
Please enter user name
</div>
</div>
<div class="mb-3">
<label for="edit_useremail" class="form-label">Email <span
class="text-danger">*</span></label>
<input type="email" class="form-control @error('email') is-invalid @enderror"
name="email" value="{{ old('email') }}" id="edit_useremail"
placeholder="Enter email address" required>
@error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
<div class="invalid-feedback">
Please enter email
</div>
</div>
<div class="mb-2" id="div_password">
<label for="edit_password" class="form-label">Password</label>
<div class="position-relative auth-pass-inputgroup mb-3">
<input type="password"
class="form-control @error('password') is-invalid @enderror" name="password" minlength="6"
id="edit_password" placeholder="Enter password">
<button class="btn btn-link position-absolute end-0 top-0 text-decoration-none toggle-password" type="button">
<i class="ri-eye-fill align-middle"></i>
</button>
<div class="invalid-feedback">
Please enter minimum 6 character password
</div>
</div>
</div>
</div>
<div class="modal-footer">
<div class="hstack gap-2 justify-content-end">
<button type="button" class="btn btn-light"
data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-success"
id="edit-btn">Update</button>
<!-- <button type="button" class="btn btn-success"
id="edit-btn">Update</button> -->
</div>
</div>
</form>
</div>
</div>
</div>
<!-- edit modal end -->
<!-- delete modal start -->
<div class="modal fade flip" id="deleteuser" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body p-5 text-center">
<lord-icon src="https://cdn.lordicon.com/gsqxdxog.json"
trigger="loop" colors="primary:#405189,secondary:#f06548"
style="width:90px;height:90px"></lord-icon>
<div class="mt-4 text-center">
<h4>You are about to delete a User ?</h4>
<div class="hstack gap-2 justify-content-center remove">
<form method="POST"class="needs-validation" action="{{route('users.delete')}}">
@csrf
@method('DELETE')
<input type="hidden" id="del_id" name="user_id" />
<button type="button"
class="btn btn-link link-success fw-medium text-decoration-none"
data-bs-dismiss="modal" id="deleteRecord-close" ><i
class="ri-close-line me-1 align-middle"></i>
Close</button>
<button class="btn btn-danger" type="submit" id="delete-record">Yes,
Delete It</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- delete modal end -->
</div>
</div>
</div>
<!--end col-->
</div>
<!--end row-->
@endsection
@section('script')
<script>
document.getElementById("addModal").addEventListener("hidden.bs.modal", function() {
$(this).find('form').trigger('reset');
});
$(document).ready(function() {
$("#edit_userGroup-field").select2({
dropdownParent: $("#editModal")
});
$("#userGroup-field").select2({
dropdownParent: $("#addModal")
});
document.querySelectorAll('.toggle-password').forEach(function(button) {
button.addEventListener('click', function() {
const input = this.closest('.auth-pass-inputgroup').querySelector('input');
const icon = this.querySelector('i');
const type = input.getAttribute('type') === 'password' ? 'text' : 'password';
input.setAttribute('type', type);
icon.classList.toggle('ri-eye-fill');
icon.classList.toggle('ri-eye-off-fill');
});
});
});
function update_modal_open(data) {
data=JSON.parse(data);
$("#user_id").val(data.id);
$("#edit_username").val(data.name);
$("#edit_useremail").val(data.email);
$('#edit_userGroup-field').trigger('change.select2');
$('#editModal').modal('toggle');
}
function delete_modal_open(id) {
$("#del_id").val(id);
$('#deleteuser').modal('toggle');
}
</script>
@endsection
|