@extends('layouts.app')

@section('title', 'Blade Files - ISP ERP System')

@section('page-title', 'Blade Files Management')

@section('styles')
<style>
/* Custom styles for blade files */
.blade-file-card {
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    margin-bottom: 1rem;
}

.blade-file-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

.blade-file-header {
    background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%);
    padding: 1rem 1.5rem;
    color: white;
}

.blade-file-header h6 {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.blade-file-header small {
    font-size: 0.85rem;
    opacity: 0.9;
}

.blade-file-content {
    padding: 1.5rem;
    background-color: #fff;
}

.blade-type-badge {
    font-size: 0.75rem;
    padding: 0.25rem 1.75rem;
    border-radius: 0.375rem;
    font-weight: 500;
}

.blade-type-index {
    background-color: #d4edda;
    color: #155724;
}

.blade-type-create {
    background-color: #cce5ff;
    color: #004085;
}

.blade-type-edit {
    background-color: #fff3cd;
    color: #856404;
}

.blade-type-show {
    background-color: #d1ecf1;
    color: #0c5460;
}

.blade-type-tree {
    background-color: #f8d7da;
    color: #721c24;
}

.blade-type-other {
    background-color: #e2e3e5;
    color: #383d41;
}

.file-info {
    display: flex;
    justify-content-between;
    align-items-center;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
}

.file-path {
    font-family: 'Courier New', monospace;
    font-size: 0.85rem;
    color: #6c757d;
    background-color: #f8f9fa;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
}

.file-stats {
    display: flex;
    gap: 1rem;
    font-size: 0.8rem;
    color: #6c757d;
}

.stats-item {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

/* CRUD URLs styling */
.crud-urls {
    background-color: #f8f9fa;
    padding: 1rem;
    border-radius: 0.375rem;
    border: 1px solid #e9ecef;
}

.crud-urls h6 {
    color: #495057;
    font-size: 0.9rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
}

.url-item {
    margin-bottom: 0.5rem;
}

.url-item small {
    font-size: 0.75rem;
    font-weight: 500;
    display: block;
    margin-bottom: 0.25rem;
}

.url-link {
    font-size: 0.8rem;
    word-break: break-all;
}

.url-link a {
    text-decoration: none;
    font-family: 'Courier New', monospace;
    padding: 0.25rem 0.5rem;
    background-color: #fff;
    border-radius: 0.25rem;
    border: 1px solid #dee2e6;
    display: inline-block;
    transition: all 0.3s ease;
}

.url-link a:hover {
    background-color: #e9ecef;
    border-color: #adb5bd;
}

/* Responsive design */
@media (max-width: 768px) {
    .blade-file-header {
        padding: 0.75rem 1rem;
    }
    
    .blade-file-content {
        padding: 1rem;
    }
    
    .file-info {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .file-stats {
        flex-wrap: wrap;
    }
    
    .crud-urls {
        padding: 0.75rem;
    }
    
    .url-link a {
        font-size: 0.75rem;
        padding: 0.2rem 0.4rem;
    }
}
</style>
@endsection

@section('content')
<div class="container-fluid">
    <!-- Page Header -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="custom-card">
                <div class="custom-card-header">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <h3 class="mb-0">
                                <i class="fas fa-code me-2"></i>
                                Blade Files Management
                            </h3>
                            <p class="mb-0 opacity-75">View and manage all blade template files</p>
                        </div>
                        <div class="d-flex gap-2">
                            <button type="button" class="btn btn-info btn-custom" onclick="refreshBladeFiles()">
                                <i class="fas fa-sync me-2"></i>Refresh
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Blade Files Grid -->
    <div class="row">
        @if(count($bladeFiles) > 0)
            @foreach($bladeFiles as $file)
                <div class="col-lg-4 col-md-6">
                    <div class="blade-file-card">
                        <div class="blade-file-header">
                            <h6 class="mb-0">
                                <i class="fas fa-file-code me-2"></i>
                                {{ $file['name'] }}
                            </h6>
                            <small>{{ $file['type'] }} blade file</small>
                        </div>
                        <div class="blade-file-content">
                            <div class="d-flex justify-content-between align-items-center mb-3">
                                <span class="blade-type-badge blade-type-{{ $file['type'] }}">
                                    {{ ucfirst($file['type']) }}
                                </span>
                                <span class="text-muted">
                                    <i class="fas fa-calendar me-1"></i>
                                    {{ \Carbon\Carbon::parse($file['modified'])->format('M d, Y') }}
                                </span>
                            </div>
                            
                            <div class="file-info">
                                <div class="file-path">
                                    {{ $file['path'] }}
                                </div>
                                <div class="file-stats">
                                    <div class="stats-item">
                                        <i class="fas fa-weight-hanging"></i>
                                        {{ $file['size'] }}
                                    </div>
                                    <div class="stats-item">
                                        <i class="fas fa-clock"></i>
                                        {{ \Carbon\Carbon::parse($file['modified'])->format('H:i') }}
                                    </div>
                                </div>
                            </div>
                            
                            <!-- CRUD URLs Section -->
                            <div class="crud-urls mt-3">
                                <h6 class="mb-2">
                                    <i class="fas fa-link me-1"></i>CRUD URLs
                                </h6>
                                <div class="row g-2">
                                    <div class="col-6">
                                        <div class="url-item">
                                            <small class="text-muted">Index:</small>
                                            <div class="url-link">
                                                <a href="{{ $file['urls']['index'] }}" target="_blank" class="text-primary">
                                                    {{ $file['urls']['index'] }}
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="url-item">
                                            <small class="text-muted">Create:</small>
                                            <div class="url-link">
                                                <a href="{{ $file['urls']['create'] }}" target="_blank" class="text-success">
                                                    {{ $file['urls']['create'] }}
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="url-item">
                                            <small class="text-muted">Edit:</small>
                                            <div class="url-link">
                                                <a href="{{ $file['urls']['edit'] }}" target="_blank" class="text-warning">
                                                    {{ $file['urls']['edit'] }}
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="url-item">
                                            <small class="text-muted">Show:</small>
                                            <div class="url-link">
                                                <a href="{{ $file['urls']['show'] }}" target="_blank" class="text-info">
                                                    {{ $file['urls']['show'] }}
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12">
                                        <div class="url-item">
                                            <small class="text-muted">Delete:</small>
                                            <div class="url-link">
                                                <a href="{{ $file['urls']['delete'] }}" target="_blank" class="text-danger">
                                                    {{ $file['urls']['delete'] }}
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            @endforeach
        @else
            <div class="col-12">
                <div class="text-center py-5">
                    <div class="mb-4">
                        <i class="fas fa-file-code fa-3x text-muted"></i>
                    </div>
                    <h4 class="text-muted">No Blade Files Found</h4>
                    <p class="text-muted">No blade template files were found in the resources/views directory.</p>
                </div>
            </div>
        @endif
    </div>

    <!-- Statistics -->
    @if(count($bladeFiles) > 0)
        <div class="row mt-4">
            <div class="col-12">
                <div class="custom-card">
                    <div class="custom-card-header">
                        <h5 class="mb-0">
                            <i class="fas fa-chart-bar me-2"></i>
                            Blade Files Statistics
                        </h5>
                    </div>
                    <div class="custom-card-body">
                        <div class="row">
                            <div class="col-md-2">
                                <div class="text-center">
                                    <div class="h4 text-primary">{{ collect($bladeFiles)->where('type', 'index')->count() }}</div>
                                    <small class="text-muted">Index Files</small>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="text-center">
                                    <div class="h4 text-info">{{ collect($bladeFiles)->where('type', 'create')->count() }}</div>
                                    <small class="text-muted">Create Files</small>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="text-center">
                                    <div class="h4 text-warning">{{ collect($bladeFiles)->where('type', 'edit')->count() }}</div>
                                    <small class="text-muted">Edit Files</small>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="text-center">
                                    <div class="h4 text-success">{{ collect($bladeFiles)->where('type', 'show')->count() }}</div>
                                    <small class="text-muted">Show Files</small>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="text-center">
                                    <div class="h4 text-danger">{{ collect($bladeFiles)->where('type', 'tree')->count() }}</div>
                                    <small class="text-muted">Tree Files</small>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="text-center">
                                    <div class="h4 text-secondary">{{ collect($bladeFiles)->where('type', 'other')->count() }}</div>
                                    <small class="text-muted">Other Files</small>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif
</div>

@section('scripts')
<script>
function refreshBladeFiles() {
    location.reload();
}
</script>
@endsection
@endsection