@extends('adminlte::page')
@section('title', 'OWL CRM Dashboard')
@section('content_header')
<h1>User</h1>
@stop
@section('content')
@if (session('error'))
<h6 class="alert alert-danger">
{{ session('error') }}
</h6>
@endif
@if ($errors->any())
<div class="alert alert-danger">
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
{{-- <p>Welcome to the OWL CRM admin panel.</p> --}}
<div class="row justify-content-between mb-5">
<div class="col-auto">
<a href="{{ route('users.index') }}" class="btn btn-secondary">
<i class="fas fa-arrow-left"></i> Back to staff
</a>
</div>
<div class="col-auto">
{{-- <a href="{{ route('project.update', $project->id) }}" class="btn btn-primary">
<i class="fas fas fa-save"></i> Save Project
</a> --}}
</div>
@if ($user->is_admin !== 1)
<div class="col-auto">
<a href="{{ route('users.edit', $user->id) }}" class="btn btn-primary">
<i class="fas fa-pencil-alt"></i> Edit staff
</a>
<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#delete">
<i class="fa fa-trash-alt"></i> Delete staff
</button>
</div>
@endif
</div>
<div class="row">
<div class="col-12 col-sm-6">
<div class="card card-dark">
<div class="card-header">
<h3 class="card-title">staff Information</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-card-widget="collapse">
<i class="fas fa-minus"></i>
</button>
{{-- <button type="button" class="btn btn-tool" data-card-widget="remove">
<i class="fas fa-times"></i>
</button> --}}
</div>
</div>
<div class="card-body">
<ul class="list-group list-group-flush">
<li class="list-group-item"><b>First Name:</b> {{ $user->first_name }}</li>
<li class="list-group-item"><b>Last Name:</b> {{ $user->last_name }}</li>
<li class="list-group-item"><b>Email:</b> {{ $user->email }}</li>
<li class="list-group-item"><b>Status:</b> {{ $user->status == 0 ? 'in-active' : 'active' }}
</li>
<li class="list-group-item">
<b>Parent:</b>
{{ $user->admin->first_name ?? 'n/a' }} {{ $user->admin->last_name ?? '' }}
</li>
<li class="list-group-item">
<b>Created By:</b>
{{ $user->user->first_name ?? 'n/a' }} {{ $user->admin->last_name ?? '' }}
</li>
</ul>
</div>
</div>
<div class="card card-dark">
<div class="card-header">
<h3 class="card-title">Attachments</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-card-widget="collapse">
<i class="fas fa-minus"></i>
</button>
</div>
</div>
<div class="card-body">
<form action="{{ route('userMedia.upload', ['user' => $user->id]) }}" class="dropzone jqueryValidation"
id="file-dropzone" method="POST" enctype="multipart/form-data">
@csrf
<div class="form-group">
<label for="title">Title</label>
<x-adminlte-input class="form-control" id="title" name="title" placeholder="Enter title"
value="{{ old('title') }}" required />
</div>
<div class="card-body border p-4 form-group" id="fileDropArea">
<div class="dz-message">
Drag and drop files here or click to upload
</div>
</div>
<div id="uploadedFiles" class="mt-3"></div>
<div class="d-flex justify-content-end">
<button type="submit" class="btn btn-primary mx-1">Save</button>
</div>
</form>
</div>
<div class="card-body">
@foreach ($user->getMedia('users') as $media)
<div class="row align-items-center">
<!-- File Link (60% width) -->
<div class="col-12 col-md-7 col-lg-6">
<p>File: <a href="{{ $media->getUrl() }}">{{ $media->file_name }}</a></p>
</div>
<!-- Delete Button (40% width) -->
<div class="col-12 col-md-5 col-lg-4 d-flex justify-content-end">
<button type="button" class="btn btn-dark btn-sm" data-toggle="modal"
data-target="#delete{{ $media->id }}">
<i class="fa fa-trash-alt"></i>
</button>
{{-- delete record modal --}}
<div class="modal fade" id="delete{{ $media->id }}" tabindex="-1" role="dialog"
aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">{{ $media->name }}</h5>
<button type="button" class="close" data-dismiss="modal"
aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>This will delete this record permanently</p>
<p>Are you sure?</p>
</div>
<div class="modal-footer">
<form method="POST"
action="{{ route('destroy.usermedia.records', $media->id) }}">
<!-- CSRF Token -->
@csrf
<!-- Hidden input to simulate DELETE method -->
<input type="hidden" name="_method" value="DELETE">
<button type="submit" class="btn btn-danger" id="delete_btn"
data-id="' . $user->id . '">Yes,
Delete</button>
</form>
<button type="button" class="btn btn-secondary"
data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<p>Title: {{ $media->getCustomProperty('title') }}
<hr>
</p>
</div>
</div>
@endforeach
</div>
</div>
</div>
<div class="col-12 col-sm-6">
<div class="card card-dark">
<div class="card-header">
<h3 class="card-title">Reminders</h3>
<div class="card-tools">
<button type="button" class="btn btn btn-dark" data-toggle="modal"
data-target="#add_reminder{{ $user->id }}">
<i class="fas fa-plus"></i>
Add Reminders
</button>
<button type="button" class="btn btn-tool" data-card-widget="collapse">
<i class="fas fa-minus"></i>
</button>
<!-- Add Reminder Modal -->
<div class="modal fade" id="add_reminder{{ $user->id }}" tabindex="-1" role="dialog"
aria-labelledby="addReminderModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title" id="addReminderModalLabel">Add Reminders</h3>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form method="POST" action="{{ route('addUserReminder', $user->id) }}"
class="jqueryValidation">
<!-- CSRF Token -->
@csrf
<div class="modal-body">
<div class="form-group">
<label for="reminder_date">Reminder Date</label>
<input type="datetime-local" class="form-control" id="reminder_date"
name="reminder_date" placeholder="Enter Reminder Date and Time"
required />
</div>
<div class="form-group">
<label for="reminder_to">Reminder To</label>
<select class="form-control" name="reminder_to" id="reminder_to"
required>
<option value="">--Select--</option>
@foreach ($users as $item)
<option value="{{ $item->id }}">
{{ $item->first_name . $item->last_name }}</option>
@endforeach
</select>
</div>
<div class="form-group">
<label for="description">Description</label>
<textarea class="form-control" id="description" name="description" rows="4" placeholder="Enter Description"
required></textarea>
</div>
<div class="form-group">
<input type="checkbox" id="email_notification" name="email_notification"
value="0">
<label for="email_notification">Email Notification</label>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-danger" id="add_btn"
data-id="' . $user->id . '">
Save</button>
<button type="button" class="btn btn-secondary"
data-dismiss="modal">Close</button>
</div>
</form>
</div>
</div>
</div>
<!--End Add Reminder Modal -->
</div>
</div>
<div class="card-body">
@if (session('success-reminder'))
<h6 class="alert alert-success">
{{ session('success-reminder') }}
</h6>
@endif
@if (session('error-reminder'))
<h6 class="alert alert-danger">
{{ session('error-reminder') }}
</h6>
@endif
<table class="table table-bordered userReminder-datatable">
<thead>
<tr>
<th>Reminder To</th>
<th>User</th>
{{-- <th>Description</th> --}}
<th>Reminder Date</th>
<th>Is Notified</th>
{{-- <th>Status</th> --}}
<th>Actions</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
<div class="card card-dark">
<div class="card-header">
<h3 class="card-title">Notes</h3>
<div class="card-tools">
<button type="button" class="btn btn btn-dark" data-toggle="modal"
data-target="#add_note{{ $user->id }}">
<i class="fas fa-plus"></i>
Add Note
</button>
<button type="button" class="btn btn-tool" data-card-widget="collapse">
<i class="fas fa-minus"></i>
</button>
<!-- Add Note Modal -->
<div class="modal fade" id="add_note{{ $user->id }}" tabindex="-1" role="dialog"
aria-labelledby="addNoteModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title" id="addNoteModalLabel">Add Note</h3>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form method="POST" action="{{ route('addUserNotes', $user->id) }}"
class="jqueryValidation">
<!-- CSRF Token -->
@csrf
<div class="modal-body">
<div class="form-group">
<label for="notes">Notes</label>
<textarea class="form-control" id="notes" name="notes" rows="4" placeholder="Enter Note" required></textarea>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-danger" id="add_btn"
data-id="' . $user->id . '">
Save</button>
<button type="button" class="btn btn-secondary"
data-dismiss="modal">Close</button>
</div>
</form>
</div>
</div>
</div>
<!--End Add Note Modal -->
</div>
</div>
<div class="card-body">
<div class="card-body">
@if (session('success-usernote'))
<h6 class="alert alert-success">
{{ session('success-usernote') }}
</h6>
@endif
@if (session('error-usernote'))
<h6 class="alert alert-danger">
{{ session('error-usernote') }}
</h6>
@endif
<table class="table table-bordered adduserNotes-datatable">
<thead>
<tr>
<th>User</th>
<th>Notes</th>
<th>Date</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
<div class="card card-dark">
<div class="card-header">
<h3 class="card-title">Tasks</h3>
<div class="card-tools">
<button type="button" class="btn btn btn-dark" data-toggle="modal"
data-target="#add_task{{ $user->id }}">
<i class="fas fa-plus"></i>
Add Task
</button>
<button type="button" class="btn btn-tool" data-card-widget="collapse">
<i class="fas fa-minus"></i>
</button>
</div>
</div>
<div class="card-body">
<!-- Add Task Modal -->
<div class="modal fade" id="add_task{{ $user->id }}" tabindex="-1" role="dialog"
aria-labelledby="addTaskModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title" id="addTaskModalLabel">Add Task</h3>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form method="POST" action="{{ route('addUserTask', $user->id) }}"
class="jqueryValidation">
<!-- CSRF Token -->
@csrf
<div class="modal-body">
<div class="form-group">
<label for="user_id">Assigned To</label>
<select class="form-control" name="user_id" id="" required>
<option value="">--Select--</option>
@foreach ($users as $value)
<option value="{{ $value->id }}">
{{ $value->first_name . ' ' . $value->last_name }}
</option>
@endforeach
</select>
</div>
<div class=" form-group">
<label for="subject">Subject</label>
<x-adminlte-input class="form-control" id="subject" name="subject"
placeholder="Enter Subject" value="{{ old('subject') }}" required />
</div>
<div class=" form-group">
<label for="start_date">Start Date</label>
<x-adminlte-input type="date" class="form-control" id="start_date "
name="start_date" placeholder="Enter Start Date" required />
</div>
<div class=" form-group">
<label for="due_date">Due Date</label>
<x-adminlte-input type="date" class="form-control" id="due_date "
name="due_date" placeholder="Enter Due Date" required />
</div>
<div class=" form-group">
<label for="priority">Priority</label>
<select name="priority" id="priority" class="form-control">
@foreach (App\Models\Task::PRIORITIES as $key => $priority)
<option value="{{ $key }}">{{ $priority }}
</option>
@endforeach
</select>
</div>
<div class="form-group">
<label for="state"> State </label>
<select name="state" id="state" class="form-control">
@foreach (App\Models\task::States as $key => $state)
<option value="{{ $key }}">{{ $state }}
</option>
@endforeach
</select>
</div>
<div class="form-group">
<label for="description">Description</label>
<textarea class="form-control" id="description" name="description" rows="4" placeholder="Enter Description"
required></textarea>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-danger" id="add_btn"
data-id="' . $user->id . '">
Save</button>
<button type="button" class="btn btn-secondary"
data-dismiss="modal">Close</button>
</div>
</form>
</div>
</div>
</div>
<!--End Add Task Modal -->
</div>
<div class="card-body">
@if (session('success-usertask'))
<h6 class="alert alert-success">
{{ session('success-usertask') }}
</h6>
@endif
@if (session('error-usertask'))
<h6 class="alert alert-danger">
{{ session('error-usertask') }}
</h6>
@endif
<table class="table table-bordered userTask-datatable">
<thead>
<tr>
<th>Assigned To</th>
<th>User</th>
<th>subject</th>
{{-- <th>Status</th> --}}
<th>Actions</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
<div class="card card-dark">
<div class="card-header">
<h3 class="card-title">Activity logs </h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-card-widget="collapse">
<i class="fas fa-minus"></i>
</button>
{{-- <button type="button" class="btn btn-tool" data-card-widget="remove">
<i class="fas fa-times"></i>
</button> --}}
</div>
</div>
<div class="card-body">
@include('users.user.partially.user-activity-timeline')
</div>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="delete" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>This will delete this user permanently</p>
<p>Are you sure?</p>
</div>
<div class="modal-footer">
<form method="POST" action="{{ route('users.destroy', $user->id) }}">
<!-- CSRF Token -->
@csrf
<!-- Hidden input to simulate DELETE method -->
<input type="hidden" name="_method" value="DELETE">
<button type="submit" class="btn btn-danger" id="delete_btn" data-id="' . $row->id . '">Yes,
Delete</button>
</form>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
@stop
@section('css')
{{-- Add here extra stylesheets --}}
{{-- <link rel="stylesheet" href="/css/admin_custom.css"> --}}
@stop
@section('js')
<script>
console.log("Hi, I'm using the Laravel-AdminLTE package!");
</script>
@stop
@push('js')
{{-- <script type="text/javascript">
$(document).ready(function() {
// Initialize Dropzone
var myDropzone = new Dropzone("#file-dropzone", {
autoProcessQueue: false, // Prevent Dropzone from automatically uploading
paramName: "file",
maxFilesize: 2, // MB
acceptedFiles: ".jpeg,.jpg,.png,.pdf",
addRemoveLinks: true,
init: function() {
var dz = this;
dz.on("addedfile", function(file) {
console.log("File added: ", file.name);
});
dz.on("success", function(file, response) {
console.log("File uploaded successfully");
displayFileDetails(response.file);
});
dz.on("error", function(file, response) {
console.log("File upload error: ", response);
});
dz.on("queuecomplete", function() {
// When all files are processed, clear the Dropzone
dz.removeAllFiles(true);
console.log("All files have been processed and uploaded.");
});
}
});
// jQuery Validation
$("#file-dropzone").validate({
rules: {
title: {
required: true,
minlength: 3
},
file: {
required: true
},
},
messages: {
title: {
required: "Please enter a title",
minlength: "Title must be at least 3 characters long"
},
file: {
required: "Please drop a file"
},
},
submitHandler: function(form) {
// Prevent form submission when the save button is clicked
console.log("Form is valid and ready for submission");
// Check if there are files to upload
if (myDropzone.getQueuedFiles().length > 0) {
// Add the title to each file being uploaded
myDropzone.on("sending", function(file, xhr, formData) {
var fileTitle = $('#title').val();
formData.append("title", fileTitle);
});
// Manually process the queue
myDropzone.processQueue();
} else {
alert('Please select files to upload.');
}
}
});
// Function to display uploaded file details
function displayFileDetails(file) {
var fileDetails = `
<p>File: <a href="${file.url}" target="_blank">${file.name}</a></p>
<p>Title: ${file.title}</p>
`;
$('#uploadedFiles').append(fileDetails);
}
});
</script> --}}
<script type="text/javascript">
$(function() {
var csrfToken = $('meta[name="csrf-token"]').attr('content');
var dataTable = $('.adduserNotes-datatable').DataTable({
processing: true,
serverSide: true,
pageLength: 3,
searching: false,
order: [
[0, 'asec']
],
'ajax': {
'url': "{{ route('userNotes.index') }}",
type: "POST",
headers: {
'X-CSRF-TOKEN': csrfToken // Include CSRF token in headers
},
data: {
user_id: "{{ $user->id }}",
},
},
columns: [
{
data: 'user',
name: 'User'
},
{
data: 'notes',
name: 'Notes'
},
{
data: 'date',
name: 'Date'
},
{
data: 'action',
name: 'Actions',
},
]
});
});
</script>
<script type="text/javascript">
$(function() {
var csrfToken = $('meta[name="csrf-token"]').attr('content');
var dataTable = $('.userReminder-datatable').DataTable({
processing: true,
serverSide: true,
pageLength: 3,
searching: false,
order: [
[0, 'asec']
],
'ajax': {
'url': "{{ route('userReminder.index') }}",
type: "POST",
headers: {
'X-CSRF-TOKEN': csrfToken // Include CSRF token in headers
},
data: {
user: "{{ $user->id }}",
},
},
columns: [{
data: 'reminder_to',
name: 'Reminder To'
},
{
data: 'user',
name: 'User'
},
// {
// data: 'description',
// name: 'Description'
// },
{
data: 'reminder_date',
name: 'Reminder Date',
},
{
data: 'is_notified',
name: 'Is Notified',
},
{
data: 'action',
name: 'Actions',
},
]
});
// Event listener for opening any modal
$('body').on('shown.bs.modal', function(event) {
var modal = $(event.target);
var form = modal.find('form.jqueryValidation');
// Reinitialize validation
form.validate();
});
// Clear the form and validation when any modal is hidden
$('body').on('hidden.bs.modal', function(event) {
var modal = $(event.target);
var form = modal.find('form.jqueryValidation');
// Reset form and validation
form.validate().resetForm();
form[0].reset();
});
});
</script>
<script type="text/javascript">
$(function() {
var csrfToken = $('meta[name="csrf-token"]').attr('content');
var dataTable = $('.userTask-datatable').DataTable({
processing: true,
serverSide: true,
pageLength: 3,
searching: false,
order: [
[0, 'asec']
],
'ajax': {
'url': "{{ route('userTask.index') }}",
type: "GET",
headers: {
'X-CSRF-TOKEN': csrfToken // Include CSRF token in headers
},
data: {
user: "{{ $user->id }}",
},
},
columns: [
{
data: 'assigned_to',
name: 'Assigned To'
},
{
data: 'user',
name: 'User'
},
{
data: 'subject',
name: 'Subject'
},
{
data: 'action',
name: 'Actions',
},
]
});
});
</script>
@endpush