@extends('adminlte::page')

@section('title', 'Produto')

@section('content_header')
    <div class="row">
    </div>
@stop

@section('content')
    @if(Session::has('error'))
        @php
            $data = Session::get('error');
        @endphp

        @if (is_array($data))
            @foreach ($data as $msg)
                <div class="alert alert-danger auto-dismiss" role="alert">
                    <i class="fa fa-times"></i>
                    {{ $msg }}
                </div>
            @endforeach
        @else
            <div class="alert alert-danger auto-dismiss" role="alert">
                <i class="fa fa-times"></i>
                {{ $data }}
            </div>
        @endif
    @endif
    <div class="col-md-12">
        <form method="POST" id="formEnvioDados" action="{{ route('products.store') }}">
            @method('POST')
            @csrf
            <div class="card">
                <div class="card-header">
                    <div class="row">
                        <div class="col-md-8 col-8">
                            <h3>Produto</h3>
                        </div>
                        <div class="col-md-4 col-4 text-lg-end" style="text-align: right;">
                            <button type="button" id="btnSearch" title="Pesquisar" class="btn btn-info">
                                <i class="fa fa-search"></i>
                            </button>
                            <button type="button" id="btnSalvar" title="Salvar" class="btn btn-success">
                                <i class="fa fa-save"></i>
                            </button>
                        </div>
                    </div>
                </div>
                <div class="card-body">
                    <div class="custom-control custom-checkbox">
                        <input type="checkbox" class="custom-control-input" id="inativo_produto" name="inativo_produto">
                        <label class="custom-control-label" for="inativo_produto">
                            Item Bloqueado
                        </label>
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            <label for="referencia_produto" class="col-form-label text-md-end">{{ __('Referência') }}</label>
                            <input id="referencia_produto" type="text" class="form-control @error('referencia_produto') is-invalid @enderror" name="referencia_produto" value="{{ old('referencia_produto')}}" required autocomplete="referencia_produto" autofocus>

                            @error('referencia_produto')
                                <span class="invalid-feedback" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="nome_produto" class="col-form-label text-md-end">{{ __('Descrição') }}</label>
                            <input id="nome_produto" type="text" class="form-control @error('nome_produto') is-invalid @enderror" name="nome_produto" value="{{ old('nome_produto') }}" required autocomplete="nome_produto" autofocus>

                            @error('nome_produto')
                                <span class="invalid-feedback" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="codigo_de_barras_produto" class="col-form-label text-md-end" id="label_razao_social_nome">{{ __('Cód. de Barra') }}</label>
                            <input id="codigo_de_barras_produto" type="number" class="form-control @error('codigo_de_barras_produto') is-invalid @enderror" name="codigo_de_barras_produto" value="{{old('codigo_de_barras_produto')}}" autocomplete="codigo_de_barras_produto" autofocus>

                            @error('codigo_de_barras_produto')
                                <span class="invalid-feedback" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>
                        <div class="col-md-1">
                            <label>&nbsp;</label>
                            <div class="d-flex align-items-end mt-1">
                                <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#edicoesModal">
                                    {{ __('Edições') }}
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3">
                            <label for="editora" class="col-form-label text-md-end">{{ __('Editora') }}</label>
                            <input id="editora" type="text" class="form-control @error('editora') is-invalid @enderror" name="editora" value="{{ old('editora') }}" autocomplete="editora" autofocus>

                            @error('editora')
                                <span class="invalid-feedback" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>
                        <div class="col-md-3">
                            <label for="fabricante" class="col-form-label text-md-end">{{ __('Fabricante') }}</label>
                            <input id="fabricante" type="text" class="form-control @error('fabricante') is-invalid @enderror" name="fabricante" value="{{ old('fabricante') }}" autocomplete="fabricante" autofocus>

                            @error('fabricante')
                                <span class="invalid-feedback" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>
                        <div class="col-md-6">
                            <label for="grupo_produto" class="col-form-label text-md-end">{{ __('Classe') }}</label>
                            <select id="grupo_produto" type="text" class="custom-select @error('grupo_produto') is-invalid @enderror select2" name="grupo_produto" value="{{ old('grupo_produto') }}" required autocomplete="grupo_produto" autofocus>
                            </select>

                            @error('grupo_produto')
                                <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3">
                            <label for="balcao" class="col-form-label text-md-end">{{ __('Balcão') }}</label>
                            <input id="balcao" type="text" class="form-control @error('balcao') is-invalid @enderror" name="balcao" value="{{ old('balcao') }}" autocomplete="balcao" autofocus>

                            @error('balcao')
                                <span class="invalid-feedback" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>
                        <div class="col-md-3">
                            <label for="local_estoque" class="col-form-label text-md-end">{{ __('Local Estoque') }}</label>
                            <input id="local_estoque" type="text" class="form-control @error('local_estoque') is-invalid @enderror" name="local_estoque" value="{{ old('local_estoque') }}" autocomplete="local_estoque" autofocus>

                            @error('local_estoque')
                                <span class="invalid-feedback" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>
                        
                        <div class="col-md-3">
                            <label for="dias_devol" class="col-form-label text-md-end">{{ __('N dias Devol.') }}</label>
                            <input id="dias_devol" type="number" class="form-control @error('dias_devol') is-invalid @enderror" name="dias_devol" value="{{ old('dias_devol') }}" autocomplete="dias_devol" autofocus>

                            @error('dias_devol')
                                <span class="invalid-feedback" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>
                        <div class="col-md-3">
                            <label for="prazo_pedido" class="col-form-label text-md-end">{{ __('Prazo Pedidos') }}</label>
                            <input id="prazo_pedido" type="number" class="form-control @error('prazo_pedido') is-invalid @enderror" name="prazo_pedido" value="{{ old('prazo_pedido') }}" autocomplete="prazo_pedido" autofocus>

                            @error('prazo_pedido')
                                <span class="invalid-feedback" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3">
                            <label for="estoque_min" class="col-form-label text-md-end d-block text-truncate" style="min-height: 2rem;">{{ __('Estoque Min.') }}</label>
                            <input id="estoque_min" type="text" class="form-control @error('estoque_min') is-invalid @enderror" name="estoque_min" value="{{ old('estoque_min','0,00') }}" autocomplete="estoque_min" autofocus oninput="formatarValor(this)">
                            @error('estoque_min')
                                <span class="invalid-feedback" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>
                        <div class="col-md-3">
                            <label for="estoque_max" class="col-form-label text-md-end d-block text-truncate" style="min-height: 2rem;">{{ __('Estoque Max') }}</label>
                            <input id="estoque_max" type="text" class="form-control @error('estoque_max') is-invalid @enderror" name="estoque_max" value="{{ old('estoque_max','0,00') }}" autocomplete="estoque_max" autofocus oninput="formatarValor(this)">
                            @error('estoque_max')
                                <span class="invalid-feedback" role="alert">
                                    <strong>{{ $message }}</strong>
                                </span>
                            @enderror
                        </div>
                    </div>
                    <div class="d-flex flex-wrap gap-2 mr-2 mt-3">
                        <button type="button" class="btn btn-primary flex-fill mr-2 mb-2" data-toggle="modal" data-target="#autoresModal">
                            {{ __('Autores') }}
                        </button>

                        <button type="button" class="btn btn-primary flex-fill mr-2 mb-2" data-toggle="modal" data-target="#assuntosModal">
                            {{ __('Assuntos') }}
                        </button>

                        <button type="button" class="btn btn-primary flex-fill mr-2 mb-2" data-toggle="modal" data-target="#fornecedoresModal">
                            {{ __('Fornecedores') }}
                        </button>

                        <button type="button" class="btn btn-primary flex-fill mr-2 mb-2" data-toggle="modal" data-target="#OutrasInformacoesModal">
                            {{ __('Outros Inform.') }}
                        </button>

                        <button type="button" class="btn btn-primary flex-fill mr-2 mb-2" data-toggle="modal" data-target="#PrecoVendaModal">
                            {{ __('Preço de Venda') }}
                        </button>

                        <button type="button" class="btn btn-primary flex-fill mr-2 mb-2" data-toggle="modal" data-target="#InventarioModal">
                            {{ __('Inventário') }}
                        </button>
                    </div>
                </div>
            </div>
            <div class="modal" tabindex="-1" role="dialog" id="edicoesModal" style="z-index: 9999;">
                <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">Edições</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <div class="row mb-3">
                                <div class="col-md-4">
                                    <label for="edicao" class="col-form-label text-md-end">{{ __('Edição') }}</label>
                                    <input id="edicao" type="text" class="form-control @error('edicao') is-invalid @enderror" name="edicao" value="{{ old('edicao') }}" autocomplete="edicao" autofocus>
                                </div>
                                <div class="col-md-4">
                                    <label for="coddebarras" class="col-form-label text-md-end">{{ __('Cód. de Barras') }}</label>
                                    <input id="coddebarras" type="number" class="form-control" name="coddebarras" value="{{ old('coddebarras') }}" autocomplete="coddebarras" autofocus>
                                </div>
                                <div class="col-md-2">
                                    <label for="qtde_edicao" class="col-form-label text-md-end">{{ __('Quantidade') }}</label>
                                    <input id="qtde_edicao" type="number" class="form-control" name="qtde_edicao" value="{{ old('qtde_edicao') }}" min="1" autocomplete="qtde_edicao" autofocus>
                                </div>
                                <div class="col-md-2 d-flex align-items-end">
                                    <button type="button" class="btn btn-success w-100" tittle="Salvar" onclick="addEdicao()">
                                        <i class="fa fa-save"></i>
                                    </button>
                                </div>
                            </div>
                            <div class="table-responsive">
                                <table class="table table-striped table-bordered">
                                    <thead>
                                        <tr>
                                            <th scope="col" class="col-md-6 col-12">Edição</th>
                                            <th scope="col" class="col-md-3 col-12">Cód. de Barras</th>
                                            <th scope="col" class="col-md-3 col-12">Quantidade</th>
                                            <th scope="col" class="col-sm-3">Ação</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>

                                        </tr>    
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                        </div>
                    </div>
                </div>
            </div>

            <div class="modal" tabindex="-1" role="dialog" id="autoresModal" style="z-index: 9999;">
                <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">Autores</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Fechar">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">    
                            <div class="row">
                                <div class="col-auto">
                                    <button type="button" id="searchAuthorBtn" title="Pesquisar" class="btn btn-primary d-flex flex-column align-items-center" style="width: 65px; height: 55px;">
                                    <i class="fa fa-search"></i>
                                    <span>Pesquisa</span>
                                    </button>
                                </div>
                                <div class="col-auto">
                                    <button type="button" id="addAuthorBtn" title="Salvar" class="btn btn-success d-flex flex-column align-items-center" style="width: 65px; height: 55px;">
                                    <i class="fa fa-save"></i>
                                    <span>Inclui</span>
                                    </button>
                                </div>
                                <div class="col-auto">
                                    <button type="button" id="deleteAuthorBtn" title="Excluir" class="btn btn-danger d-flex flex-column align-items-center" style="width: 65px; height: 55px;">
                                    <i class="fa fa-trash"></i>
                                    <span>Exclui</span>
                                    </button>
                                </div>
                            </div>
                            <div class="row mt-2">
                                <div class="col-md-12">
                                    <input type="text" id="authorInput" class="form-control" placeholder="Digite o nome do autor...">
                                </div> 
                            </div>
                            <div class="row mt-2">
                                <div class="col-md-5">
                                    <h6>Autores</h6>
                                    <select id="availableAuthors" multiple class="form-control" size="10" style="height: 200px; font-family: monospace;"></select>
                                </div>
                                <div class="col-md-2 d-flex flex-column justify-content-center align-items-center">
                                    <button type ="button" class="btn btn-sm btn-success mb-2" id="moveRight">> ></button>
                                    <button type ="button" class="btn btn-sm btn-danger" id="moveLeft">< <</button>
                                </div>
                                <div class="col-md-5">
                                    <h6>Autores por Produto</h6>
                                    <select id="selectedAuthors" name="autores[]" multiple class="form-control" size="10" style="height: 200px; font-family: monospace;"></select>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                        </div>
                    </div>
                </div>
            </div>

            <div class="modal" tabindex="-1" role="dialog" id="assuntosModal" style="z-index: 9999;">
                <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">Assuntos</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Fechar">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">    
                            <div class="row">
                                <div class="col-auto">
                                    <button type="button" id="searchSubjectBtn" title="Pesquisar" class="btn btn-primary d-flex flex-column align-items-center" style="width: 65px; height: 55px;">
                                    <i class="fa fa-search"></i>
                                    <span>Pesquisa</span>
                                    </button>
                                </div>
                                <div class="col-auto">
                                    <button type="button" id="addSubjectBtn" title="Salvar" class="btn btn-success d-flex flex-column align-items-center" style="width: 65px; height: 55px;">
                                    <i class="fa fa-save"></i>
                                    <span>Inclui</span>
                                    </button>
                                </div>
                                <div class="col-auto">
                                    <button type="button" id="deleteSubjectBtn" title="Excluir" class="btn btn-danger d-flex flex-column align-items-center" style="width: 65px; height: 55px;">
                                    <i class="fa fa-trash"></i>
                                    <span>Exclui</span>
                                    </button>
                                </div>
                            </div>
                            <div class="row mt-2">
                                <div class="col-md-12">
                                    <input type="text" id="subjectInput" class="form-control" placeholder="Digite o assunto">
                                </div> 
                            </div>
                            <div class="row mt-2">
                                <div class="col-md-5">
                                    <h6>Assuntos</h6>
                                    <select id="availableSubjects" multiple class="form-control" size="10" style="height: 200px; font-family: monospace;"></select>
                                </div>
                                <div class="col-md-2 d-flex flex-column justify-content-center align-items-center">
                                    <button type ="button" class="btn btn-sm btn-success mb-2" id="moveRightSubject">> ></button>
                                    <button type ="button" class="btn btn-sm btn-danger" id="moveLeftSubject">< <</button>
                                </div>
                                <div class="col-md-5">
                                    <h6>Assuntos por Produto</h6>
                                    <select id="selectedSubjects" name="assuntos[]" multiple class="form-control" size="10" style="height: 200px; font-family: monospace;"></select>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                        </div>
                    </div>
                </div>
            </div>

            <div class="modal" tabindex="-1" role="dialog" id="fornecedoresModal" style="z-index: 9999;">
                <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">Fornecedores</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Fechar">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>

                        <div class="modal-body" style="max-height: 80vh; overflow-y: auto;">
                            <div class="form-row mb-3">
                                <div class="col-md-6">
                                    <input type="text" id="searchNome" class="form-control" placeholder="Razão Social ou Fantasia">
                                </div>
                                <div class="col-md-4">
                                    <input type="text" id="searchCnpj" class="form-control" placeholder="CNPJ">
                                </div>
                                <div class="col-md-2">
                                    <button class="btn btn-primary btn-block" onclick="buscarFornecedores()">
                                        <i class="fa fa-search"></i>
                                    </button>
                                </div>
                            </div>

                            <h6>Fornecedores</h6>
                            <div style="max-height: 200px; overflow-y: auto; margin-bottom: 10px; border: 1px solid #dee2e6;">
                                <table class="table table-bordered mb-0" id="tabelaFornecedores">
                                    <thead>
                                        <tr>
                                            <th>Razão Social</th>
                                            <th>Fantasia</th>
                                            <th>CNPJ / CPF</th>
                                            <th>Endereço</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>
                            </div>

                            <div class="text-center mb-3">
                                <button type="button" class="btn btn-success" onclick="incluirFornecedor()">Incluir</button>
                                <button type="button" class="btn btn-danger" onclick="excluirFornecedor()">Excluir</button>
                            </div>

                            <h6>Fornecedores por Produto</h6>
                            <div style="max-height: 200px; overflow-y: auto; border: 1px solid #dee2e6;">
                                <table class="table table-bordered mb-0" id="tabelaSelecionados">
                                    <thead>
                                        <tr>
                                            <th>Produto</th>
                                            <th>Fornecedor</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    </tbody>
                                </table>
                            </div>
                        </div>

                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                        </div>
                    </div>
                </div>
            </div>


            <div class="modal" tabindex="-1" role="dialog" id="OutrasInformacoesModal" style="z-index: 9999;">
                <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">Outras Informações</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <div class="row">
                                <div class="col-md-6">
                                    <label for="referencia" class="col-form-label text-md-end">{{ __('Referencia') }}</label>
                                    <input id="referencia" type="text" class="form-control @error('referencia') is-invalid @enderror" name="referencia" value="{{ old('referencia') }}" disabled autocomplete="referencia" autofocus>    
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    <label for="valor_venda" class="col-form-label text-md-end d-block text-truncate" style="min-height: 2rem;">{{ __('Preço de Venda') }}</label>
                                    <input id="valor_venda" type="text" class="form-control @error('valor_venda') is-invalid @enderror" name="valor_venda" value="{{ old('valor_venda','0,00') }}" disabled autocomplete="valor_venda" autofocus>
                                </div>
                                <div class="col-md-6">
                                    <label for="desconto_entrada" class="col-form-label text-md-end">{{ __('Desconto (%)') }}</label>
                                    <input id="desconto_entrada" type="text" class="form-control @error('desconto_entrada') is-invalid @enderror" name="desconto_entrada" value="{{ old('desconto_entrada','0,00') }}" autocomplete="desconto_entrada" autofocus oninput="formatarValor(this)">

                                    @error('desconto_entrada')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    <label for="valor_custo_produto" class="col-form-label text-md-end d-block text-truncate" style="min-height: 2rem;">{{ __('Valor de Custo') }}</label>
                                    <input id="valor_custo_produto" type="text" class="form-control @error('valor_custo_produto') is-invalid @enderror" name="valor_custo_produto" value="{{ old('valor_custo_produto','0,00') }}" autocomplete="valor_custo_produto" autofocus oninput="formatarValor(this)">
                                    
                                    @error('valor_custo_produto')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                                <div class="col-md-6">
                                    <label for="desconto_markup" class="col-form-label text-md-end">{{ __('Markup (%)') }}</label>
                                    <input id="desconto_markup" type="text" class="form-control @error('desconto_markup') is-invalid @enderror" name="desconto_markup" value="{{ old('desconto_markup','0,00') }}" autocomplete="desconto_markup" autofocus oninput="formatarValor(this)">

                                    @error('desconto_markup')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                        </div>
                    </div>
                </div>
            </div>

            <div class="modal" tabindex="-1" role="dialog" id="PrecoVendaModal" style="z-index: 9999;">
                <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">Preço de Venda</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <div class="row">
                                <div class="col-md-6">
                                    <label for="referencia_preco_venda" class="col-form-label text-md-end">{{ __('Referencia') }}</label>
                                    <input id="referencia_preco_venda" type="text" class="form-control @error('referencia_preco_venda') is-invalid @enderror" name="referencia_preco_venda" value="{{ old('referencia_preco_venda') }}" disabled autocomplete="referencia_preco_venda" autofocus>    
                                </div>
                                <div class="col-md-6">
                                    <label for="descricao" class="col-form-label text-md-end">{{ __('Descrição') }}</label>
                                    <input id="descricao" type="text" class="form-control @error('descricao') is-invalid @enderror" name="descricao" value="{{ old('descricao') }}" disabled autocomplete="descricao" autofocus>    
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-3">
                                    <label for="valor_venda_produto" class="col-form-label text-md-end d-block text-truncate" style="min-height: 2rem;">{{ __('Preço de Venda') }}</label>
                                    <input id="valor_venda_produto" type="text" class="form-control @error('valor_venda_produto') is-invalid @enderror" name="valor_venda_produto" value="{{ old('valor_venda_produto','0,00') }}" required autocomplete="valor_venda_produto" autofocus oninput="formatarValor(this)">
                                    
                                    @error('valor_venda_produto')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                        </div>
                    </div>
                </div>
            </div>

            <div class="modal" tabindex="-1" role="dialog" id="InventarioModal" style="z-index: 9999;">
                <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title">Inventario</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <div class="row">
                                <div class="col-md-6">
                                    <label for="referencia_inventario" class="col-form-label text-md-end">{{ __('Referencia') }}</label>
                                    <input id="referencia_inventario" type="text" class="form-control @error('referencia_inventario') is-invalid @enderror" name="referencia_inventario" value="{{ old('referencia_inventario') }}" disabled autocomplete="referencia_inventario" autofocus>    
                                </div>
                                <div class="col-md-6">
                                    <label for="descricao_inventario" class="col-form-label text-md-end">{{ __('Descricao') }}</label>
                                    <input id="descricao_inventario" type="text" class="form-control @error('descricao_inventario') is-invalid @enderror" name="descricao_inventario" value="{{ old('descricao_inventario') }}" disabled autocomplete="descricao_inventario" autofocus>    
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    <label for="saldo" class="col-form-label text-md-end">{{ __('Quantidade') }}</label>
                                    <input id="saldo" type="text" class="form-control @error('saldo') is-invalid @enderror" name="saldo" value="{{ old('saldo','0,00') }}" autocomplete="saldo" autofocus oninput="formatarValor(this)">

                                    @error('saldo')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    <label for="valor_venda_inventario" class="col-form-label text-md-end">{{ __('Preço de Venda') }}</label>
                                    <input id="valor_venda_inventario" type="text" class="form-control @error('valor_venda_inventario') is-invalid @enderror" name="valor_venda_inventario" value="{{ old('valor_venda_inventario') }}" disabled autocomplete="valor_venda_inventario" autofocus>    
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>

    <div class="modal fade" id="modalProduct" tabindex="-1" aria-labelledby="modalProductLabel" aria-hidden="true" style="z-index: 9999;">
        <div class="modal-dialog modal-lg modal-dialog-centered">
            <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="modalProductLabel">Lista de Produtos</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
            </div>
            <div class="modal-body">
                <input type="text" id="searchProduct" class="form-control mb-3" placeholder="Digite para buscar...">

                <div style="max-height: 400px; overflow-y: auto;">
                    <table class="table table-bordered table-striped">
                        <thead>
                            <tr>
                                <th>Ref.</th>
                                <th>Cód. de Barra</th>
                                <th>Descrição</th>
                                <th>Preço</th>
                                <th>Saldo</th>
                                <th>Ação</th>
                            </tr>
                        </thead>
                        <tbody id="productList">
                            <tr><td colspan="4" class="text-center">Carregando...</td></tr>
                        </tbody>
                    </table>
                </div>
                <div id="productEdicoes" class="mt-4" style="display:none;">
                <h5>Edições do Produto</h5>
                <div id="productEdicoesContent">
                    <p class="text-muted">Selecione um produto para ver as edições.</p>
                </div>
            </div>
            </div>
            
            </div>
        </div>
    </div>

    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2-bootstrap-theme/0.1.0-beta.10/select2-bootstrap.min.css" rel="stylesheet" />

    <style>

        .btn-fixed {
            width: 100%;
            white-space: nowrap;
        }

        .select2-container {
            width: 100% !important;
        }

        .select2-selection--single {
            border: 1px solid #ced4da;
            border-radius: 4px;
            padding: 10px;
            height: 40px !important;
            box-sizing: border-box; 
        }

        .select2-selection__arrow {
            height: 38px; 
        }

        .select2-selection__rendered {
            color: #495057; 
            line-height: 40px; 
        }

        .select2-container--default .select2-selection--single .select2-selection__placeholder {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            left: 14px;
            color: #6c757d;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .select2-container--default.select2-container--focus .select2-selection--single {
            border-color: #80bdff; 
        }

        .campo-obrigatorio-faltando {
            border: 2px solid red;
        }

        .col-form-label {
            min-width: 120px;
            text-align: left; 
        }

        .swal2-container {
            z-index: 10000 !important;
        }
 
    </style>

@stop
@section('js')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/i18n/pt-BR.js"></script>
    <script>
        let allAuthors = [];

        function loadAuthors() {
            $.get('/buscar-autores', function (authors) {
                allAuthors = authors;
                renderAuthors(authors);
            });
        }

        function renderAuthors(authors) {
            const available = $('#availableAuthors');
            available.empty();

            authors.forEach(author => {
                available.append(`<option value="${author.id}"> ${author.nome_autor}</option>`);
            });
        }

        $('#searchAuthorBtn').on('click', function () {
            const term = $('#authorInput').val().trim().toLowerCase();
            if (term === '') {
                renderAuthors(allAuthors);
                return;
            }

            const filtered = allAuthors.filter(a => a.nome_autor.toLowerCase().includes(term));
            renderAuthors(filtered);
        });

        $('#addAuthorBtn').on('click', function () {
            const name = $('#authorInput').val().trim();
            if (name === '') return;

            const exists = allAuthors.some(a => a.nome_autor.toLowerCase() === name.toLowerCase());
            if (exists) {
                Swal.fire({
                    icon: 'error',
                    title: 'Cadastro',
                    text: 'Autor já existe!',
                });
                return;
            }

            $.ajax({
                url: '/inserir-autor',
                type: 'POST',
                data: { nome_autor: name },
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                success: function (response) {
                    const newAuthor = { id: response.id, nome_autor: response.nome_autor };
                    allAuthors.push(newAuthor);
                    renderAuthors(allAuthors);
                    $('#authorInput').val('');
                },
                error: function (xhr) {
                    if (xhr.status === 422 && xhr.responseJSON.errors) {
                        alert(Object.values(xhr.responseJSON.errors).flat().join('\n'));
                    } else if (xhr.status === 403) {
                        Swal.fire({
                            icon: 'error',
                            title: 'Erro',
                            text: 'Acesso negado.',
                        });
                    } else {
                        Swal.fire({
                            icon: 'error',
                            title: 'Erro',
                            text: 'Erro ao salvar o autor',
                        });
                    }
                }
            });
        });

        $('#moveRight').on('click', function () {
            $('#availableAuthors option:selected').each(function () {
                $('#selectedAuthors').append($(this).clone());
                $(this).remove();
            });
        });

        $('#moveLeft').on('click', function () {
            $('#selectedAuthors option:selected').each(function () {
                $('#availableAuthors').append($(this).clone());
                $(this).remove();
            });
        });

        $('#autoresModal').on('shown.bs.modal', function () {
            loadAuthors();
        });
            $('#availableAuthors').on('dblclick', 'option', function () {
            const selected = $(this).clone();
            $('#selectedAuthors').append(selected);
            $(this).remove();
        });

        $('#selectedAuthors').on('dblclick', 'option', function () {
            const selected = $(this).clone();
            $('#availableAuthors').append(selected);
            $(this).remove();
        });

        $('#deleteAuthorBtn').on('click', function () {
            const selected = $('#availableAuthors option:selected');

            if (selected.length === 0) {
                Swal.fire({
                    icon: 'warning',
                    title: 'Excluir',
                    text: 'Selecione um autor para excluir.',
                });
                return;
            }

            const authorId = selected.val();

            if (String(authorId).startsWith('temp-')) {
                Swal.fire({
                    icon: 'error',
                    title: 'Erro',
                    text: 'Este autor ainda não foi salvo no banco de dados.',
                });
                return;
            }

            const btn = $(this);

            Swal.fire({
                title: 'Tem certeza?',
                text: 'Você realmente deseja excluir este autor?',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#d33',
                cancelButtonColor: '#3085d6',
                confirmButtonText: 'Sim, excluir',
                cancelButtonText: 'Cancelar'
            }).then((result) => {
                if (!result.isConfirmed) return;

                btn.prop('disabled', true);

                $.ajax({
                    url: `/excluir-autores/${authorId}`,
                    type: 'DELETE',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    success: function () {
                        allAuthors = allAuthors.filter(a => a.id != authorId);
                        renderAuthors(allAuthors);

                        Swal.fire({
                            icon: 'success',
                            title: 'Excluir',
                            text: 'Autor excluído com sucesso!',
                        });
                    },
                    error: function (xhr) {
                        let msg = 'Erro ao excluir o autor.';
                        if (xhr.responseJSON && xhr.responseJSON.message) {
                            msg += '\n' + xhr.responseJSON.message;
                        }
                        alert(msg);
                    },
                    complete: function () {
                        btn.prop('disabled', false);
                    }
                });
            });
        });

        let allSubjects = [];

        function loadSubjects() {
            $.get('/buscar-assuntos', function (subjects) {
                allSubjects = subjects;
                renderSubjects(subjects);
            });
        }

        function renderSubjects(subjects) {
            const available = $('#availableSubjects');
            available.empty();

            subjects.forEach(subject => {
                available.append(`<option value="${subject.id}"> ${subject.assunto}</option>`);
            });
        }

        $('#searchSubjectBtn').on('click', function () {
            const term = $('#subjectInput').val().trim().toLowerCase();
            if (term === '') {
                renderSubjects(allSubjects);
                return;
            }

            const filtered = allSubjects.filter(a => a.assunto.toLowerCase().includes(term));
            renderSubjects(filtered);
        });

        $('#addSubjectBtn').on('click', function () {
            const name = $('#subjectInput').val().trim();
            if (name === '') return;

            const exists = allSubjects.some(a => a.assunto.toLowerCase() === name.toLowerCase());
            if (exists) {
                Swal.fire({
                    icon: 'error',
                    title: 'Cadastro',
                    text: 'Assunto já existe!',
                });
                return;
            }

            $.ajax({
                url: '/inserir-assunto',
                type: 'POST',
                data: { assunto: name },
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                success: function (response) {
                    const newSubject = { id: response.id, assunto: response.assunto };
                    allSubjects.push(newSubject);
                    renderSubjects(allSubjects);
                    $('#subjectInput').val('');
                },
                error: function (xhr) {
                    if (xhr.status === 422 && xhr.responseJSON.errors) {
                        alert(Object.values(xhr.responseJSON.errors).flat().join('\n'));
                    } else if (xhr.status === 403) {
                        Swal.fire({
                            icon: 'error',
                            title: 'Erro',
                            text: 'Acesso negado.',
                        });
                    } else {
                        Swal.fire({
                            icon: 'error',
                            title: 'Erro',
                            text: 'Erro ao salvar o autor.',
                        });
                    }
                }
            });
        });

        $('#moveRightSubject').on('click', function () {
            $('#availableSubjects option:selected').each(function () {
                $('#selectedSubjects').append($(this).clone());
                $(this).remove();
            });
        });

        $('#moveLeftSubject').on('click', function () {
            $('#selectedSubjects option:selected').each(function () {
                $('#availableSubjects').append($(this).clone());
                $(this).remove();
            });
        });

        $('#assuntosModal').on('shown.bs.modal', function () {
            loadSubjects();
        });
            $('#availableSubjects').on('dblclick', 'option', function () {
            const selected = $(this).clone();
            $('#selectedSubjects').append(selected);
            $(this).remove();
        });

        $('#selectedSubjects').on('dblclick', 'option', function () {
            const selected = $(this).clone();
            $('#availableSubjects').append(selected);
            $(this).remove();
        });

        $('#deleteSubjectBtn').on('click', function () {
            const selected = $('#availableSubjects option:selected');

            if (selected.length === 0) {
                Swal.fire({
                    icon: 'warning',
                    title: 'Excluir',
                    text: 'Selecione um assunto para excluir.',
                });
                return;
            }

            const subjectId = selected.val();

            if (String(subjectId).startsWith('temp-')) {
                Swal.fire({
                    icon: 'error',
                    title: 'Erro',
                    text: 'Este autor ainda não foi salvo no banco de dados.',
                });
                return;
            }

            const btn = $(this);

            Swal.fire({
                title: 'Tem certeza?',
                text: 'Você realmente deseja excluir este assunto?',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#d33',
                cancelButtonColor: '#3085d6',
                confirmButtonText: 'Sim, excluir',
                cancelButtonText: 'Cancelar'
            }).then((result) => {
                if (!result.isConfirmed) return;

                btn.prop('disabled', true);

                $.ajax({
                    url: `/excluir-assuntos/${subjectId}`,
                    type: 'DELETE',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    success: function () {
                        allSubjects = allSubjects.filter(a => a.id != subjectId);
                        renderSubjects(allSubjects);

                        Swal.fire({
                            icon: 'success',
                            title: 'Excluir',
                            text: 'Assunto excluído com sucesso!',
                        });
                    },
                    error: function (xhr) {
                        let msg = 'Erro ao excluir o autor.';
                        if (xhr.responseJSON && xhr.responseJSON.message) {
                            msg += '\n' + xhr.responseJSON.message;
                        }
                        alert(msg);
                    },
                    complete: function () {
                        btn.prop('disabled', false);
                    }
                });
            });
        });

        
        let fornecedores = []; 
        let fornecedoresSelecionados = [];
        let indexSelecionado = null;
        let indexSelecionadoSelecionado = null;

        $('#fornecedoresModal').on('shown.bs.modal', function () {
            buscarFornecedores();
        });

        function buscarFornecedores() {
            const nome = encodeURIComponent(document.getElementById('searchNome').value.trim());
            const cnpj = encodeURIComponent(document.getElementById('searchCnpj').value.trim());

            fetch(`/buscar-fornecedores?nome=${nome}&cnpj=${cnpj}`)
                .then(response => response.json())
                .then(data => {
                    fornecedores = data;
                    renderizarTabelaFornecedores();
                })
                .catch(error => {
                    console.error('Erro ao buscar fornecedores:', error);
                });
        }

        function renderizarTabelaFornecedores() {
            const tbody = document.querySelector('#tabelaFornecedores tbody');
            tbody.innerHTML = '';

            fornecedores.forEach((f, index) => {
                tbody.innerHTML += `
                    <tr onclick="selecionarFornecedor(${index})" style="cursor: pointer;">
                        <td>${f.razao_social_nome}</td>
                        <td>${f.fantasia ?? ''}</td>
                        <td>${f.cnpj_cpf ?? ''}</td>
                        <td>${f.logradouro ?? ''}</td>
                    </tr>
                `;
            });
        }

        function selecionarFornecedor(index) {
            indexSelecionado = index;
            document.querySelectorAll('#tabelaFornecedores tbody tr').forEach((linha, i) => {
                linha.classList.toggle('table-primary', i === index);
            });
        }

        function incluirFornecedor() {
            if (indexSelecionado === null) {
                 Swal.fire({
                    icon: 'warning',
                    title: 'Cadastro',
                    text: 'Selecione um fornecedor para incluir.',
                });
                return;
            }

            const referencia = document.getElementById('referencia_produto').value.trim();
            if (!referencia) {
                 Swal.fire({
                    icon: 'warning',
                    title: 'Produto',
                    text: 'Informe a referência do produto antes de incluir um fornecedor.',
                });
                return;
            }

            const fornecedor = { ...fornecedores[indexSelecionado] };
            fornecedor.referencia_produto = referencia;

            const jaExiste = fornecedoresSelecionados.some(f => f.id === fornecedor.id);
            if (!jaExiste) {
                fornecedoresSelecionados.push(fornecedor);
                renderizarTabelaSelecionados();
            }

            indexSelecionado = null;
            document.querySelectorAll('#tabelaFornecedores tbody tr').forEach(tr => tr.classList.remove('table-primary'));
        }

        function selecionarSelecionado(index) {
            indexSelecionadoSelecionado = index;
            document.querySelectorAll('#tabelaSelecionados tbody tr').forEach((linha, i) => {
                linha.classList.toggle('table-danger', i === index);
            });
        }

        function excluirFornecedor() {
            if (indexSelecionadoSelecionado === null) {
                 Swal.fire({
                    icon: 'error',
                    title: 'Excluir',
                    text: 'Selecione um fornecedor para excluir.',
                });
                return;
            }

            fornecedoresSelecionados.splice(indexSelecionadoSelecionado, 1);
            renderizarTabelaSelecionados();
            indexSelecionadoSelecionado = null;
        }

        function renderizarTabelaSelecionados() {
            const tbody = document.querySelector('#tabelaSelecionados tbody');
            tbody.innerHTML = '';

            fornecedoresSelecionados.forEach((f, index) => {
                tbody.innerHTML += `
                    <tr onclick="selecionarSelecionado(${index})" style="cursor: pointer;" data-fornecedor-id="${f.id}">
                        <td>${f.referencia_produto ?? ''}</td>
                        <td>${f.fantasia ?? f.razao_social_nome}</td>
                    </tr>
                `;
            });
        }

                
        $(document).ready(function() {
            $('#ncm_produto').select2({
                theme: 'default',
                language: "pt-BR",
                width: '100%',
                ajax: {
                    url: '/buscar-ncm',
                    dataType: 'json',
                    delay: 250,
                    data: function (params) {
                        return {
                            q: params.term
                        };
                    },
                    processResults: function (data) {
                        return {
                            results: data.results
                        };
                    },
                    cache: true
                },
                minimumInputLength: 1,
                placeholder: 'Digite o NCM'
            });

        });

        $(document).ready(function() {
            $('#grupo_produto').select2({
                theme: 'default',
                language: "pt-BR",
                width: '100%',
                ajax: {
                    url: '/buscar-group',
                    dataType: 'json',
                    delay: 250,
                    data: function (params) {
                        return {
                            q: params.term
                        };
                    },
                    processResults: function (data) {
                        return {
                            results: data.results
                        };
                    },
                    cache: true
                },
                minimumInputLength: 1,
                placeholder: 'Digite a classe'
            });

        });

        $(document).on('select2:open', (e) => {
            const selectId = e.target.id;
            $(".select2-search__field[aria-controls='select2-" + selectId + "-results']").each(function (key, value) {
                value.focus();
            });
        })

        let edicoes = [];

        function addEdicao() {
            const edicao = document.getElementById('edicao').value.trim();
            const coddebarras = document.getElementById('coddebarras').value.trim();
            const qtde = document.getElementById('qtde_edicao').value.trim();

            if (!edicao || !coddebarras || !qtde) {
                Swal.fire({
                    icon: 'error',
                    title: 'Erro',
                    text: 'Preencha todos os campos!',
                });
                
                return;
            }

            if (edicoes.find(e => e.coddebarras === coddebarras)) {
                Swal.fire({
                    icon: 'error',
                    title: 'Código de Barras',
                    text: 'Este código de barras já foi adicionado à lista',
                });
                return;
            }

            fetch('/verificar-codigobarras', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
                },
                body: JSON.stringify({ codigo: coddebarras }),
            })
            .then(response => response.json())
            .then(data => {
                if (data.existe) {
                    Swal.fire({
                    icon: 'error',
                    title: 'Código de Barras',
                    text: 'Este código de barras já está em uso no sistema',
                });
                } else {
                    edicoes.push({ edicao, coddebarras, qtde });
                    atualizarTabela();
                    limparCampos();
                }
            })
            .catch(error => {
                console.error('Erro ao verificar código de barras:', error);
            });
        }

        function atualizarTabela() {
            const tbody = document.querySelector('.table tbody');
            tbody.innerHTML = '';

            edicoes.forEach((item, index) => {
                const row = document.createElement('tr');

                row.innerHTML = `
                    <td>${item.edicao}</td>
                    <td>${item.coddebarras}</td>
                    <td>${item.qtde}</td>
                    <td>
                        <button class="btn btn-danger btn-sm" onclick="removerEdicao(${index})"><i class="fa fa-trash"></i></button>
                    </td>
                `;

                tbody.appendChild(row);
            });
        }

        function removerEdicao(index) {
            edicoes.splice(index, 1);
            atualizarTabela();
        }

        function limparCampos() {
            document.getElementById('edicao').value = '';
            document.getElementById('coddebarras').value = '';
            document.getElementById('qtde_edicao').value = '';
        }

        function formatarValor(input) {
            let valor = input.value.replace(/\D/g, '');
            valor = (valor / 100).toFixed(2);
            valor = valor.replace('.', ',');
            valor = valor.replace(/\B(?=(\d{3})+(?!\d))/g, ".");
            input.value = valor;
        }

        document.getElementById('btnSalvar').addEventListener('click', function(event) {
            event.preventDefault();

            if (camposObrigatoriosPreenchidos()) {
                Swal.fire({
                    title: 'Confirmação',
                    text: 'Deseja realmente gravar esse Produto?',
                    icon: 'question',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Confirmar',
                    cancelButtonText: 'Cancelar'
                }).then((result) => {
                    if (result.isConfirmed) {
                        const selectedAuthors = document.getElementById('selectedAuthors');
                        for (let option of selectedAuthors.options) {
                            option.selected = true;
                        }
                        const selectedSubjects = document.getElementById('selectedSubjects');
                        for (let option of selectedSubjects.options) {
                            option.selected = true;
                        }

                        const oldInputs = document.querySelectorAll('input[name="fornecedores[]"]');
                        oldInputs.forEach(input => input.remove());

                        const tabelaSelecionados = document.querySelectorAll('#tabelaSelecionados tbody tr');
                        const form = document.getElementById('formEnvioDados');

                        tabelaSelecionados.forEach(tr => {
                            const fornecedorId = tr.getAttribute('data-fornecedor-id');
                            if (fornecedorId) {
                                const input = document.createElement('input');
                                input.type = 'hidden';
                                input.name = 'fornecedores[]';
                                input.value = fornecedorId;
                                form.appendChild(input);
                            }
                        });

                        const oldEdicoesInputs = document.querySelectorAll('input[name^="edicoes"]');
                        oldEdicoesInputs.forEach(input => input.remove());

                        edicoes.forEach((item, index) => {
                            for (const key in item) {
                                if (item.hasOwnProperty(key)) {
                                    const input = document.createElement('input');
                                    input.type = 'hidden';
                                    input.name = `edicoes[${index}][${key}]`;
                                    input.value = item[key];
                                    form.appendChild(input);
                                }
                            }
                        });

                        form.submit();
                    }
                });
            } else {
                Swal.fire({
                    title: 'Erro',
                    text: 'Por favor, preencha todos os campos obrigatórios.',
                    icon: 'error',
                    confirmButtonColor: '#3085d6',
                    confirmButtonText: 'OK'
                });
            }
        });

        function camposObrigatoriosPreenchidos() {
            var campos = $('input[required], select[required], textarea[required]');
            var Preenchidos = true;

            campos.each(function() {
                if ($(this).is('select') && $(this).hasClass('select2-hidden-accessible')) {
                    var select2Val = $(this).val();
                    if (!select2Val) {
                        Preenchidos = false;
                        $(this).next('.select2-container').addClass('campo-obrigatorio-faltando');
                    } else {
                        $(this).next('.select2-container').removeClass('campo-obrigatorio-faltando');
                    }
                } else {
                    if (!$(this).val().trim()) {
                        Preenchidos = false;
                        $(this).addClass('campo-obrigatorio-faltando');
                    } else {
                        $(this).removeClass('campo-obrigatorio-faltando');
                    }
                }
            });

            return Preenchidos;
        }

        $(document).ready(function() {
            $('input[required], select[required], textarea[required]').on('input change', function() {
                if ($(this).is('select') && $(this).hasClass('select2-hidden-accessible')) {
                    var select2Val = $(this).val();
                    if (!select2Val) {
                        $(this).next('.select2-container').addClass('campo-obrigatorio-faltando');
                    } else {
                        $(this).next('.select2-container').removeClass('campo-obrigatorio-faltando');
                    }
                } else {
                    if (!$(this).val().trim()) {
                        $(this).addClass('campo-obrigatorio-faltando');
                    } else {
                        $(this).removeClass('campo-obrigatorio-faltando');
                    }
                }
            });
        });

        document.addEventListener('DOMContentLoaded', function () {
            const hiddenInput = document.getElementById('edicoes-hidden');
            if (hiddenInput && hiddenInput.value) {
                try {
                    let dados = JSON.parse(hiddenInput.value);

                    if (Array.isArray(dados)) {
                        dados.forEach(function (item) {
                            edicoes.push({
                                edicao: item.edicao || '',
                                coddebarras: item.coddebarras || '',
                                quantidade: item.quantidade || '0'
                            });
                        });

                        atualizarTabelaEdicoes();
                    }
                } catch (e) {
                    console.error('Erro ao restaurar edições do hidden:', e);
                }
            }
        });

        function atualizarEdicoesHidden() {
            let inputHidden = document.getElementById('edicoes-hidden');
            if (!inputHidden) {
                inputHidden = document.createElement('input');
                inputHidden.type = 'hidden';
                inputHidden.id = 'edicoes-hidden';
                inputHidden.name = 'edicoes';
                document.getElementById('formEnvioDados').appendChild(inputHidden);
            }

            inputHidden.value = JSON.stringify(edicoes);
        }

        function adicionarEdicao(edicao, coddebarras, quantidade) {
            edicoes.push({ edicao, coddebarras, quantidade });
            atualizarTabelaEdicoes();
        }

        function atualizarCamposReferenciaDescricao() { 
            const ref = document.getElementById('referencia_produto')?.value || '';
            const nome = document.getElementById('nome_produto')?.value || '';
            const vlr = document.getElementById('valor_venda_produto')?.value || '';

            const refs = [
                document.getElementById('referencia'),
                document.getElementById('referencia_preco_venda'),
                document.getElementById('referencia_inventario'),
            ];
            refs.forEach(el => {
                if (el) el.value = ref;
            });

            const descs = [
                document.getElementById('descricao'),
                document.getElementById('descricao_inventario')
            ];
            descs.forEach(el => {
                if (el) el.value = nome;
            });

            const valores = [
                document.getElementById('valor_venda'),
                document.getElementById('valor_venda_inventario')
            ];
            valores.forEach(el => {
                if (el) el.value = vlr;
            });
        }

        window.addEventListener('DOMContentLoaded', () => {
            const refInput = document.getElementById('referencia_produto');
            const nomeInput = document.getElementById('nome_produto');
            const valorInput = document.getElementById('valor_venda_produto');

            if (refInput) {
                refInput.addEventListener('input', atualizarCamposReferenciaDescricao);
            }

            if (nomeInput) {
                nomeInput.addEventListener('input', atualizarCamposReferenciaDescricao);
            }

            if (valorInput) {
                valorInput.addEventListener('input', atualizarCamposReferenciaDescricao);
            }

            atualizarCamposReferenciaDescricao();
        });
    </script>
    <script src="{{ URL::asset('js/Modal/ListProduct.js') }}"></script>
@stop