Files
ERP-upgrade/resources/views/reports/index.blade.php
2026-09-08 08:01:08 +00:00

216 lines
11 KiB
PHP

@extends('layouts.masterbeta')
@section('title', 'Click ERP - My Daily Reports')
@section('breadcrumbs')
<a href="{{ url('/') }}" class="text-secondary text-decoration-none"><i class="bi bi-house me-2"></i></a>
<i class="bi bi-chevron-right text-secondary me-2" style="font-size: 0.8rem;"></i>
<span class="fw-bold" style="font-size: 0.95rem;">Daily Reports</span>
@endsection
@section('content')
<div class="d-flex justify-content-between align-items-center mb-4">
<div>
<h4 class="fw-bold mb-1">My Daily Reports</h4>
<p class="text-secondary mb-0" style="font-size: 0.9rem;">Submit and track your daily activity and progress.</p>
</div>
<button class="btn text-white fw-bold d-flex align-items-center" style="background-color: #5c4df0; border-radius: 8px;" data-bs-toggle="modal" data-bs-target="#submitReportModal">
<i class="bi bi-plus-lg me-2"></i> Submit Report
</button>
</div>
<div class="content-card shadow-sm bg-white rounded-3 overflow-hidden">
<div class="table-responsive">
<table class="table table-hover align-middle mb-0">
<thead class="table-light text-secondary" style="font-size: 0.85rem;">
<tr>
<th class="ps-4">Report Date</th>
<th>Content Preview</th>
<th>Submitted At</th>
<th class="text-end pe-4">Action</th>
</tr>
</thead>
<tbody>
@forelse($reports as $report)
<tr>
<td class="ps-4 fw-medium text-dark">
<i class="bi bi-calendar-check text-primary me-2"></i>
{{ \Carbon\Carbon::parse($report->report_date)->format('D, d M Y') }}
</td>
<td class="text-secondary" style="max-width: 400px; font-size: 0.9rem;">
{{ Str::limit(strip_tags($report->content), 80) }}
</td>
<td class="text-secondary" style="font-size: 0.85rem;">
<i class="bi bi-clock me-1"></i> {{ $report->created_at->format('d M Y, H:i') }}
</td>
<td class="text-end pe-4">
<button class="btn btn-sm btn-light text-primary btn-view-report"
data-date="{{ \Carbon\Carbon::parse($report->report_date)->format('D, d M Y') }}"
data-content="{{ htmlspecialchars($report->content) }}">
<i class="bi bi-eye"></i> View
</button>
</td>
</tr>
@empty
<tr>
<td colspan="4" class="text-center py-5 text-secondary">
<i class="bi bi-journal-x fs-1 text-muted mb-2 d-block"></i>
No reports submitted yet.
</td>
</tr>
@endforelse
</tbody>
</table>
</div>
@if($reports->hasPages())
<div class="card-footer bg-white border-top p-3 d-flex justify-content-center">
{{ $reports->links('pagination::bootstrap-5') }}
</div>
@endif
</div>
@endsection
@push('modals')
<!-- SUBMIT REPORT MODAL -->
<div class="modal fade" id="submitReportModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content">
<div class="modal-header bg-light border-bottom-0">
<h5 class="modal-title fw-bold">Submit Daily Report</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form id="submitReportForm">
@csrf
<div class="modal-body p-4">
<!-- <div id="reportModalAlert"></div> -->
<div class="mb-3">
<label class="form-label text-secondary fw-semibold small">Report Date *</label>
<input type="date" class="form-control" name="report_date" id="report_date" required max="{{ now()->format('Y-m-d') }}" value="{{ now()->format('Y-m-d') }}">
<div class="form-text text-muted" style="font-size: 0.75rem;">Standard submission window is 48 hours from the report date.</div>
</div>
<div class="mb-3">
<label class="form-label text-secondary fw-semibold small">Activities & Progress *</label>
<textarea class="form-control" name="content" id="report_content" rows="8" required placeholder="Detail your tasks, achievements, and blockers for the day..."></textarea>
</div>
</div>
<div class="modal-footer bg-light border-top-0">
<button type="button" class="btn btn-outline-secondary btn-sm" data-bs-dismiss="modal">Cancel</button>
<button type="submit" id="btnSaveReport" class="btn text-white btn-sm fw-bold px-4" style="background-color: #5c4df0;">
Submit Report
</button>
</div>
</form>
</div>
</div>
</div>
<!-- VIEW REPORT MODAL -->
<div class="modal fade" id="viewReportModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content">
<div class="modal-header bg-light border-bottom-0">
<h5 class="modal-title fw-bold">Report Details: <span id="viewReportDate" class="text-primary"></span></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body p-4">
<div class="bg-light p-3 rounded border" style="white-space: pre-wrap;" id="viewReportContent"></div>
</div>
<div class="modal-footer border-top-0">
<button type="button" class="btn btn-secondary btn-sm" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
@endpush
@push('scripts')
<script>
$(document).ready(function() {
$('#submitReportForm').on('submit', function(e) {
e.preventDefault();
let $form = $(this);
let $submitBtn = $('#btnSaveReport');
let originalText = $submitBtn.html();
$submitBtn.html('<span class="spinner-border spinner-border-sm me-2"></span>Sending...').prop('disabled', true);
// Clear previous validation errors
$form.find('.is-invalid').removeClass('is-invalid');
$form.find('.invalid-feedback').remove();
$.ajax({
url: "{{ url('reports') }}",
type: 'POST',
data: $form.serialize(),
success: function(response) {
if(response.success) {
$('#submitReportModal').modal('hide');
Swal.fire({
icon: 'success',
title: 'Report Submitted!',
text: response.message,
showConfirmButton: false,
timer: 1500
}).then(() => location.reload());
}
},
error: function(xhr) {
if (xhr.status === 422) {
let errors = xhr.responseJSON.errors;
// If the 48-hour validation fails, trigger a SweetAlert warning
if (errors.report_date && errors.report_date[0].includes('48-hour')) {
$('#submitReportModal').modal('hide');
Swal.fire({
icon: 'warning',
title: 'Submission Locked',
text: errors.report_date[0],
confirmButtonColor: '#5c4df0'
}).then(() => $('#submitReportModal').modal('show')); // reopen if they dismiss
} else {
// For standard field validation, show inline text errors
$.each(errors, function(key, value) {
let $input = $form.find('[name="' + key + '"]');
if ($input.length) {
$input.addClass('is-invalid');
$input.parent().append('<div class="invalid-feedback d-block fw-medium">' + value[0] + '</div>');
}
});
}
} else {
// Generic server errors
Swal.fire({
icon: 'error',
title: 'Server Error',
text: 'An unexpected error occurred. Please try again.',
confirmButtonColor: '#5c4df0'
});
}
},
complete: function() {
$submitBtn.html(originalText).prop('disabled', false);
}
});
});
// View Report Modal Population
$('.btn-view-report').on('click', function() {
$('#viewReportDate').text($(this).data('date'));
$('#viewReportContent').text($(this).data('content'));
new bootstrap.Modal(document.getElementById('viewReportModal')).show();
});
// Reset modal on close
$('#submitReportModal').on('hidden.bs.modal', function () {
$('#submitReportForm')[0].reset();
$('#report_date').val("{{ now()->format('Y-m-d') }}");
$('#submitReportForm').find('.is-invalid').removeClass('is-invalid');
$('#submitReportForm').find('.invalid-feedback').remove();
});
});
</script>
@endpush