@extends('admin.layouts.app')

@section('title', 'Lojas')

@section('content')
<div class="container-fluid">
    <!-- Cabeçalho -->
    <div class="row">
        <div class="col-12">
            <div class="d-flex justify-content-between align-items-center mb-4">
                <h1 class="h3">
                    <i class="fas fa-store"></i>
                    Gerenciamento de Lojas
                </h1>
                <a href="{{ route('admin.lojas.create') }}" class="btn btn-primary">
                    <i class="fas fa-plus"></i> Nova Loja
                </a>
            </div>
        </div>
    </div>

    <!-- Estatísticas -->
    <div class="row mb-4">
        <div class="col-md-3">
            <div class="card bg-primary text-white">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <div>
                            <h5 class="card-title">Total</h5>
                            <h2>{{ $estatisticas['total'] }}</h2>
                        </div>
                        <div class="align-self-center">
                            <i class="fas fa-store fa-2x"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card bg-success text-white">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <div>
                            <h5 class="card-title">Ativas</h5>
                            <h2>{{ $estatisticas['ativas'] }}</h2>
                        </div>
                        <div class="align-self-center">
                            <i class="fas fa-check-circle fa-2x"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card bg-warning text-white">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <div>
                            <h5 class="card-title">Inativas</h5>
                            <h2>{{ $estatisticas['inativas'] }}</h2>
                        </div>
                        <div class="align-self-center">
                            <i class="fas fa-pause-circle fa-2x"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card bg-info text-white">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <div>
                            <h5 class="card-title">Com Produtos</h5>
                            <h2>{{ $estatisticas['com_produtos'] }}</h2>
                        </div>
                        <div class="align-self-center">
                            <i class="fas fa-box fa-2x"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Filtros -->
    <div class="card mb-4">
        <div class="card-body">
            <form method="GET" action="{{ route('admin.lojas.index') }}">
                <div class="row">
                    <div class="col-md-4">
                        <div class="form-group">
                            <label for="busca">Buscar</label>
                            <input type="text" class="form-control" id="busca" name="busca" 
                                   placeholder="Nome, endereço ou telefone..." 
                                   value="{{ request('busca') }}">
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label for="status">Status</label>
                            <select class="form-select" id="status" name="status">
                                <option value="">Todos</option>
                                <option value="ativa" {{ request('status') == 'ativa' ? 'selected' : '' }}>Ativa</option>
                                <option value="inativa" {{ request('status') == 'inativa' ? 'selected' : '' }}>Inativa</option>
                                <option value="manutencao" {{ request('status') == 'manutencao' ? 'selected' : '' }}>Manutenção</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label>&nbsp;</label>
                            <div class="d-grid">
                                <button type="submit" class="btn btn-primary">
                                    <i class="fas fa-search"></i> Filtrar
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <label>&nbsp;</label>
                            <div class="d-grid">
                                <a href="{{ route('admin.lojas.index') }}" class="btn btn-outline-secondary">
                                    <i class="fas fa-times"></i> Limpar
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <!-- Tabela -->
    <div class="card">
        <div class="card-header">
            <h5 class="card-title mb-0">
                <i class="fas fa-list"></i> Lista de Lojas
                <span class="badge bg-secondary">{{ $lojas->total() }}</span>
            </h5>
        </div>
        <div class="card-body">
            @if($lojas->count() > 0)
                <div class="table-responsive">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>Imagem</th>
                                <th>Nome</th>
                                <th>Endereço</th>
                                <th>Telefone</th>
                                <th>Status</th>
                                <th>Produtos</th>
                                <th>Taxa Entrega</th>
                                <th>Horários</th>
                                <th width="150">Ações</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($lojas as $loja)
                                <tr>
                                    <td>
                                        @if($loja->imagem)
                                            <img src="{{ asset('storage/' . $loja->imagem) }}" 
                                                 alt="{{ $loja->nome }}" 
                                                 class="rounded-circle" 
                                                 width="40" height="40">
                                        @else
                                            <div class="bg-secondary rounded-circle d-flex align-items-center justify-content-center" 
                                                 style="width: 40px; height: 40px;">
                                                <i class="fas fa-store text-white"></i>
                                            </div>
                                        @endif
                                    </td>
                                    <td>
                                        <strong>{{ $loja->nome }}</strong>
                                        @if($loja->descricao)
                                            <br><small class="text-muted">{{ Str::limit($loja->descricao, 50) }}</small>
                                        @endif
                                    </td>
                                    <td>{{ Str::limit($loja->endereco, 30) }}</td>
                                    <td>{{ $loja->telefone }}</td>
                                    <td>
                                        @switch($loja->status)
                                            @case('ativa')
                                                <span class="badge bg-success">Ativa</span>
                                                @break
                                            @case('inativa')
                                                <span class="badge bg-danger">Inativa</span>
                                                @break
                                            @case('manutencao')
                                                <span class="badge bg-warning">Manutenção</span>
                                                @break
                                        @endswitch
                                    </td>
                                    <td>
                                        <span class="badge bg-info">{{ $loja->produtos->count() }}</span>
                                    </td>
                                    <td>
                                        @if($loja->taxa_entrega)
                                            R$ {{ number_format($loja->taxa_entrega, 2, ',', '.') }}
                                        @else
                                            <span class="text-muted">Grátis</span>
                                        @endif
                                    </td>
                                    <td>
                                        <small>
                                            {{ date('H:i', strtotime($loja->horario_abertura)) }} - 
                                            {{ date('H:i', strtotime($loja->horario_fechamento)) }}
                                        </small>
                                    </td>
                                    <td>
                                        <div class="btn-group" role="group">
                                            <a href="{{ route('admin.lojas.show', $loja) }}" 
                                               class="btn btn-sm btn-outline-primary" 
                                               title="Visualizar">
                                                <i class="fas fa-eye"></i>
                                            </a>
                                            <a href="{{ route('admin.lojas.edit', $loja) }}" 
                                               class="btn btn-sm btn-outline-warning" 
                                               title="Editar">
                                                <i class="fas fa-edit"></i>
                                            </a>
                                            <button type="button" 
                                                    class="btn btn-sm btn-outline-danger" 
                                                    title="Excluir"
                                                    onclick="confirmarExclusao({{ $loja->id }})">
                                                <i class="fas fa-trash"></i>
                                            </button>
                                        </div>
                                        <form id="form-excluir-{{ $loja->id }}" 
                                              action="{{ route('admin.lojas.destroy', $loja) }}" 
                                              method="POST" 
                                              style="display: none;">
                                            @csrf
                                            @method('DELETE')
                                        </form>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

                <!-- Paginação -->
                <div class="d-flex justify-content-between align-items-center mt-3">
                    <div>
                        <small class="text-muted">
                            Mostrando {{ $lojas->firstItem() }} a {{ $lojas->lastItem() }} 
                            de {{ $lojas->total() }} resultados
                        </small>
                    </div>
                    <div>
                        {{ $lojas->links() }}
                    </div>
                </div>
            @else
                <div class="text-center py-4">
                    <i class="fas fa-store fa-3x text-muted mb-3"></i>
                    <h5 class="text-muted">Nenhuma loja encontrada</h5>
                    <p class="text-muted">Comece criando sua primeira loja.</p>
                    <a href="{{ route('admin.lojas.create') }}" class="btn btn-primary">
                        <i class="fas fa-plus"></i> Criar Loja
                    </a>
                </div>
            @endif
        </div>
    </div>
</div>

<!-- Dashboard GPS -->
<div class="fixed-bottom" style="right: 20px; bottom: 20px; z-index: 1000;">
    <a href="{{ route('admin.gps.dashboard') }}" 
       class="btn btn-info rounded-circle" 
       style="width: 60px; height: 60px; display: flex; align-items: center; justify-content: center;"
       title="Dashboard GPS">
        <i class="fas fa-map-marked-alt fa-lg"></i>
    </a>
</div>

@endsection

@section('scripts')
<script>
function confirmarExclusao(id) {
    if (confirm('Tem certeza que deseja excluir esta loja? Esta ação não pode ser desfeita.')) {
        document.getElementById('form-excluir-' + id).submit();
    }
}

// Auto-refresh para updates em tempo real (opcional)
@if(request()->filled('status') || request()->filled('busca'))
// Se há filtros ativos, não fazer auto-refresh
@else
// Auto-refresh a cada 2 minutos
setInterval(function() {
    // Apenas atualizar se não estiver com modal aberto ou formulário ativo
    if (!document.querySelector('.modal.show') && !document.querySelector('input:focus')) {
        location.reload();
    }
}, 120000);
@endif
</script>
@endsection