Rapport-Laravel/resources/views/neblogisticreport/abmapprove.blade.php

<!DOCTYPE html>
<html lang="en">

<head>

    @include('layouts.shared/title-meta', ['title' => "Log In"])
    @include('layouts.shared/head-css', ["mode" => $mode ?? '', "demo" => $demo ?? ''])
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,user-scalable=0"/>
</head>

<body class="loading authentication-bg authentication-bg-pattern">
    <div class="account-pages mt-3 mb-5">
        <div class="container">
        <div class="approval-container">
        <div class="approval-header">
            @if($success)
                <div class="approval-icon success-icon">
                    <i class="fas fa-check-circle"></i>
                </div>
                <h1 class="approval-title">Approval Successful</h1>
                <p class="approval-subtitle">The request has been successfully approved</p>
            @else
                <div class="approval-icon error-icon">
                    <i class="fas fa-exclamation-triangle"></i>
                </div>
                <h1 class="approval-title">Approval Failed</h1>
                <p class="approval-subtitle">The request could not be processed</p>
            @endif
        </div>

        <div class="approval-message {{ $success ? 'success-message' : 'error-message' }}">
            <h4>{{ $success ? 'Success!' : 'Error' }}</h4>
            <p class="mb-0">{{ $message }}</p>
        </div>

        @if(isset($record))
        <div class="approval-details">
            <h5>Request Details</h5>
            <div class="detail-row">
                <span class="detail-label">Submission ID:</span>
                <span class="detail-value">{{ $submission_id }}</span>
            </div>
            @if(isset($record->emp_name))
            <div class="detail-row">
                <span class="detail-label">Employee Name:</span>
                <span class="detail-value">{{ $record->emp_name }}</span>
            </div>
            @endif
            @if(isset($record->depot_name))
            <div class="detail-row">
                <span class="detail-label">Depot Name:</span>
                <span class="detail-value">{{ $record->depot_name }}</span>
            </div>
            @endif
            @if(isset($record->doctor_name))
            <div class="detail-row">
                <span class="detail-label">Doctor Name:</span>
                <span class="detail-value">{{ $record->doctor_name }}</span>
            </div>
            @endif
            @if(isset($previous_status))
            <div class="detail-row">
                <span class="detail-label">Previous Status:</span>
                <span class="detail-value">
                    <span class="status-badge status-pending">{{ $previous_status }}</span>
                </span>
            </div>
            @endif
            @if(isset($new_status))
            <div class="detail-row">
                <span class="detail-label">New Status:</span>
                <span class="detail-value">
                    <span class="status-badge status-approved">{{ $new_status }}</span>
                </span>
            </div>
            @endif
            @if(isset($record->created_at))
            <div class="detail-row">
                <span class="detail-label">Request Date:</span>
                <span class="detail-value">{{ \Carbon\Carbon::parse($record->created_at)->format('d M Y, h:i A') }}</span>
            </div>
            @endif
        </div>
        @endif
    </div>


            <!-- end row -->
        </div>
        <!-- end container -->
    </div>
    <!-- end page -->

    <footer class="footer footer-alt">
        2015 - <script>
            document.write(new Date().getFullYear())
        </script> &copy; Powered by <a href="https://stratawiz.com" target="_blank" class="text-white-50">Stratawiz</a>
    </footer>

    @include('layouts.shared/footer-script')


    <style>
    .approval-container {
        max-width: 800px;
        margin: 50px auto;
        padding: 30px;
        background: #fff;
        border-radius: 10px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    }
    
    .approval-header {
        text-align: center;
        margin-bottom: 30px;
        padding-bottom: 20px;
        border-bottom: 2px solid #f8f9fa;
    }
    
    .approval-icon {
        font-size: 4rem;
        margin-bottom: 20px;
    }
    
    .success-icon {
        color: #28a745;
    }
    
    .error-icon {
        color: #dc3545;
    }
    
    .approval-title {
        font-size: 2rem;
        font-weight: 600;
        margin-bottom: 10px;
    }
    
    .approval-subtitle {
        color: #6c757d;
        font-size: 1.1rem;
    }
    
    .approval-message {
        background: #f8f9fa;
        padding: 25px;
        border-radius: 8px;
        margin: 25px 0;
        border-left: 4px solid;
    }
    
    .success-message {
        border-left-color: #28a745;
        background: #d4edda;
        color: #155724;
    }
    
    .error-message {
        border-left-color: #dc3545;
        background: #f8d7da;
        color: #721c24;
    }
    
    .approval-details {
        background: #fff;
        border: 1px solid #dee2e6;
        border-radius: 8px;
        padding: 20px;
        margin: 25px 0;
    }
    
    .detail-row {
        display: flex;
        justify-content: space-between;
        padding: 10px 0;
        border-bottom: 1px solid #f1f3f4;
    }
    
    .detail-row:last-child {
        border-bottom: none;
    }
    
    .detail-label {
        font-weight: 600;
        color: #495057;
    }
    
    .detail-value {
        color: #212529;
    }
    
    .approval-actions {
        text-align: center;
        margin-top: 30px;
        padding-top: 20px;
        border-top: 2px solid #f8f9fa;
    }
    
    .btn-approval {
        padding: 12px 30px;
        font-size: 1.1rem;
        border-radius: 6px;
        text-decoration: none;
        display: inline-block;
        margin: 0 10px;
        transition: all 0.3s ease;
    }
    
    .btn-primary {
        background: #007bff;
        color: #fff;
        border: 1px solid #007bff;
    }
    
    .btn-primary:hover {
        background: #0056b3;
        border-color: #0056b3;
        color: #fff;
    }
    
    .btn-secondary {
        background: #6c757d;
        color: #fff;
        border: 1px solid #6c757d;
    }
    
    .btn-secondary:hover {
        background: #545b62;
        border-color: #545b62;
        color: #fff;
    }
    
    .status-badge {
        display: inline-block;
        padding: 6px 12px;
        border-radius: 20px;
        font-size: 0.9rem;
        font-weight: 600;
        text-transform: uppercase;
    }
    
    .status-pending {
        background: #fff3cd;
        color: #856404;
    }
    
    .status-approved {
        background: #d4edda;
        color: #155724;
    }
    
    .status-rejected {
        background: #f8d7da;
        color: #721c24;
    }
</style>


</body>

</html>