@extends('layouts.publicador.novo_padrao')

@section('content')
    <div class="card shadow-sm">
        <div class="card-body">
            <h3 class="card-title mb-4">{{ isset($senha) ? 'Editar Licença' : 'Cadastrar Nova Licença' }}</h3>

            <form action="{{ isset($senha) ? route('publicador.licencas.salvar') : route('publicador.licencas.insert') }}"
                method="POST">
                @csrf
                @if (isset($senha))
                    <input type="hidden" name="id" value="{{ $senha->id }}">
                @endif

                <div class="row g-3">
                    <div class="col-md-12">
                        <label for="produto" class="form-label">Produto</label>
                        <input type="text" class="form-control @error('produto') is-invalid @enderror" id="produto"
                            name="produto" value="{{ old('produto', $senha->produto ?? '') }}" required>
                        @error('produto')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-6">
                        <label for="login" class="form-label">Login</label>
                        <input type="text" class="form-control @error('login') is-invalid @enderror" id="login"
                            name="login" value="{{ old('login', $senha->login ?? '') }}" required>
                        @error('login')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-6">
                        <label for="senha" class="form-label">Senha</label>
                        <div class="input-group">
                            <input type="text" class="form-control @error('senha') is-invalid @enderror" id="senha"
                                name="senha" value="{{ old('senha', $senha->decrypted_senha ?? '') }}"
                                {{ isset($senha) ? '' : 'required' }}>
                            <div class="input-group-append">
                                <button class="btn btn-outline-secondary" type="button" id="toggleSenha">
                                    <i class="fa fa-lock-open"></i>
                                </button>
                            </div>
                        </div>
                        @error('senha')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-6">
                        <label for="contrato" class="form-label">Contrato</label>
                        <input type="text" class="form-control @error('contrato') is-invalid @enderror" id="contrato"
                            name="contrato" value="{{ old('contrato', $senha->contrato ?? '') }}">
                        @error('contrato')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-6">
                        <label for="data_expiracao" class="form-label">Data de Expiração</label>
                        <input type="date" class="form-control @error('data_expiracao') is-invalid @enderror"
                            id="data_expiracao" name="data_expiracao"
                            value="{{ old('data_expiracao', isset($senha->data_expiracao) ? $senha->data_expiracao->format('Y-m-d') : '') }}">
                        @error('data_expiracao')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-12">
                        <label for="usuarios_disponiveis" class="form-label">Usuários Disponíveis</label>
                        <select class="form-control custom-select" id="usuarios_disponiveis">
                            <option value="nao" selected>Não</option>
                            <option value="sim">Sim</option>
                        </select>
                    </div>

                    <div class="col-md-6">
                        <label for="user_1" class="form-label">Usuário 1</label>
                        <input type="text" class="form-control @error('user_1') is-invalid @enderror" id="user_1"
                            name="user_1" value="{{ old('user_1', $senha->user_1 ?? '') }}">
                        @error('user_1')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-6">
                        <label for="user_2" class="form-label">Usuário 2</label>
                        <input type="text" class="form-control @error('user_2') is-invalid @enderror" id="user_2"
                            name="user_2" value="{{ old('user_2', $senha->user_2 ?? '') }}">
                        @error('user_2')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-6">
                        <label for="local_1" class="form-label">Local 1</label>
                        <input type="text" class="form-control @error('local_1') is-invalid @enderror" id="local_1"
                            name="local_1" value="{{ old('local_1', $senha->local_1 ?? '') }}">
                        @error('local_1')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-6">
                        <label for="local_2" class="form-label">Local 2</label>
                        <input type="text" class="form-control @error('local_2') is-invalid @enderror" id="local_2"
                            name="local_2" value="{{ old('local_2', $senha->local_2 ?? '') }}">
                        @error('local_2')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-6">
                        <label for="patrimonio_1" class="form-label">Patrimônio 1</label>
                        <input type="text" class="form-control @error('patrimonio_1') is-invalid @enderror"
                            id="patrimonio_1" name="patrimonio_1"
                            value="{{ old('patrimonio_1', $senha->patrimonio_1 ?? '') }}">
                        @error('patrimonio_1')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-6">
                        <label for="patrimonio_2" class="form-label">Patrimônio 2</label>
                        <input type="text" class="form-control @error('patrimonio_2') is-invalid @enderror"
                            id="patrimonio_2" name="patrimonio_2"
                            value="{{ old('patrimonio_2', $senha->patrimonio_2 ?? '') }}">
                        @error('patrimonio_2')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-12">
                        <label for="obs" class="form-label">Observações</label>
                        <textarea class="form-control @error('obs') is-invalid @enderror" id="obs" name="obs" rows="3">{{ old('obs', $senha->obs ?? '') }}</textarea>
                        @error('obs')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                <div class="mt-4">
                    <button type="submit"
                        class="btn btn-primary">{{ isset($senha) ? 'Atualizar' : 'Cadastrar' }}</button>
                    <a href="{{ route('publicador.licencas.index') }}" class="btn btn-secondary">Cancelar</a>
                </div>
            </form>
        </div>
    </div>

    <style>
        .card {
            border-radius: 0.5rem;
        }

        .form-label {
            font-weight: 500;
        }

        h3.card-title.mb-4 {
            text-align: center;
        }

        .mt-4 {
            text-align: center;
        }

        /* Custom styles for select */
        .custom-select {
            display: inline-block;
            width: 100%;
            height: calc(1.5em + 0.75rem + 2px);
            padding: 0.375rem 1.75rem 0.375rem 0.75rem;
            font-size: 1rem;
            font-weight: 400;
            line-height: 1.5;
            color: #495057;
            vertical-align: middle;
            background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px;
            border: 1px solid #ced4da;
            border-radius: 0.25rem;
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
        }

        .custom-select:focus {
            border-color: #80bdff;
            outline: 0;
            box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
        }
    </style>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const senhaInput = document.getElementById('senha');
            const toggleSenha = document.getElementById('toggleSenha');
            const usuariosDisponiveis = document.getElementById('usuarios_disponiveis');
            const produtoInput = document.getElementById('produto');
            const user1Input = document.getElementById('user_1');
            const user2Input = document.getElementById('user_2');
            const local1Input = document.getElementById('local_1');
            const local2Input = document.getElementById('local_2');
            const patrimonio1Input = document.getElementById('patrimonio_1');
            const patrimonio2Input = document.getElementById('patrimonio_2');

            // Password toggle functionality
            toggleSenha.innerHTML = '<i class="fa fa-lock-open"></i>';
            senhaInput.type = 'text';

            toggleSenha.addEventListener('click', function() {
                if (senhaInput.type === 'text') {
                    senhaInput.type = 'password';
                    toggleSenha.innerHTML = '<i class="fa fa-lock"></i>';
                } else {
                    senhaInput.type = 'text';
                    toggleSenha.innerHTML = '<i class="fa fa-lock-open"></i>';
                }
            });

            function createOrUpdateHiddenInput(visibleInput, value) {
                let hiddenInput = document.getElementById('hidden_' + visibleInput.id);
                if (!hiddenInput) {
                    hiddenInput = document.createElement('input');
                    hiddenInput.type = 'hidden';
                    hiddenInput.name = visibleInput.name;
                    hiddenInput.id = 'hidden_' + visibleInput.id;
                    visibleInput.parentNode.insertBefore(hiddenInput, visibleInput.nextSibling);
                }
                hiddenInput.value = value;
            }

            function removeHiddenInput(inputId) {
                const hiddenInput = document.getElementById('hidden_' + inputId);
                if (hiddenInput) {
                    hiddenInput.remove();
                }
            }

            function handleUsuariosDisponiveisChange() {
                const isDisponivel = usuariosDisponiveis.value === 'sim';
                const isAdobeCreativeCloud = produtoInput.value.trim().toLowerCase() === 'adobe creative cloud';
                const fieldsToToggle = [user1Input, user2Input, local1Input, local2Input, patrimonio1Input,
                    patrimonio2Input
                ];

                if (isDisponivel) {
                    if (isAdobeCreativeCloud) {
                        // Para Adobe Creative Cloud
                        [user1Input, user2Input].forEach(userInput => {
                            if (!userInput.value) {
                                userInput.value = 'Disponível';
                                userInput.disabled = true;
                                createOrUpdateHiddenInput(userInput, 'Disponível');
                            }
                        });

                        // Para locais e patrimônios
                        [local1Input, local2Input, patrimonio1Input, patrimonio2Input].forEach(field => {
                            if (!field.value) {
                                field.value = '--';
                                field.disabled = true;
                                createOrUpdateHiddenInput(field, '--');
                            }
                        });
                    } else {
                        // Para outros produtos
                        if (!user1Input.value) {
                            user1Input.value = 'Disponível';
                            user1Input.disabled = true;
                            createOrUpdateHiddenInput(user1Input, 'Disponível');
                        }
                        [user2Input, local1Input, local2Input, patrimonio1Input, patrimonio2Input].forEach(
                            field => {
                                if (!field.value) {
                                    field.value = '--';
                                    field.disabled = true;
                                    createOrUpdateHiddenInput(field, '--');
                                }
                            });
                    }
                } else {
                    // Remover todos os inputs hidden e habilitar todos os campos
                    fieldsToToggle.forEach(field => {
                        field.disabled = false;
                        if (field.value === 'Disponível' || field.value === '--') {
                            field.value = '';
                        }
                        removeHiddenInput(field.id);
                    });
                }
            }

            // Handle usuarios_disponiveis change
            usuariosDisponiveis.addEventListener('change', handleUsuariosDisponiveisChange);

            // Handle produto change
            produtoInput.addEventListener('change', handleUsuariosDisponiveisChange);

            // Check initial state on page load
            if (user1Input.value === 'Livre' || user1Input.value === 'Disponível' ||
                user2Input.value === 'Livre' || user2Input.value === 'Disponível') {
                usuariosDisponiveis.value = 'sim';
                handleUsuariosDisponiveisChange();
            }
        });
    </script>
@endsection