@extends('layouts.app')

@section('content')

<main class="content">
	<form method="POST" enctype="multipart/form-data">
		@csrf
		<div class="container-fluid p-0">

			<div class="mb-3">
				<h1 class="h3 d-inline align-middle">Configurações</h1>
			</div>

			<div class="alert alert-warning mb-3" role="alert">
				<span class="text-warning">
					Atualize a página para que a imagem enviada apareça.
				</span>
			</div>

			<div class="row">
				<div class="col-12 col-lg-12">
					<div class="card">
						<div class="card-header">
							<h5 class="card-title mb-0">Configurações do Sistema</h5>
						</div>
						<div class="card-body">
							<input type="hidden" name="empresa_cnpj" value="{{ Cookie::get('empresa_cnpj') ?? '' }}">
							<input type="file" id="logo" name="logo" class="form-control d-none @error('logo') is-invalid @enderror" placeholder="Input">

							<label for="logo">
								@php
									$logoPath = 'assets/img/logos/logo.png';
									if (Auth::check() && Cookie::get('empresa_cnpj')) {
										$cnpj = Cookie::get('empresa_cnpj');
										$extensoes = ['png', 'jpg', 'jpeg'];
										
										foreach ($extensoes as $ext) {
											$empresaLogo = "storage/logos/{$cnpj}.{$ext}";
											if (file_exists(public_path($empresaLogo))) {
												$logoPath = $empresaLogo;
												break;
											}
										}
									}
								@endphp
								<p class="fw-bold">Logo do Sistema</p>
								<img src="{{ asset($logoPath) }}" alt="Logo" width="200" id="image-preview">
								@error('logo')
									<span class="invalid-feedback" role="alert">
										<strong>{{ $message }}</strong>
									</span>
								@enderror
							</label>
						</div>
					</div>
				</div>
			</div>
			<div class="text-end">
				<button class="btn btn-primary">Salvar</button>
			</div>
		</div>
	</form>
</main>
@endsection

@section('scripts')
<script>
    function previewImage() {
        const image = document.getElementById('logo');
        const imagePreview = document.getElementById('image-preview');
        imagePreview.src = URL.createObjectURL(image.files[0]);
    }
    $(document).ready(function() {
        $('#logo').on('change', function() {
            previewImage();
        });
    });
</script>
@endsection