<div class="form-add-box">
	<div class="top-add-form">
		<span><?php echo e($title_form); ?></span>
		<img src="img/close-form-add.png" alt="Close">
	</div>

	<div class="cont">
		<form action="#" id="form-ordem-compra-ajax">
			<div class="cont-form-box">
				<ul class="tabs-novo-list">
					<li data-tab="1" class="active">Informações</li>
					<li data-tab="2">Produtos</li>
					<li data-tab="3" class="hidden">Lorem 3</li>
				</ul>

				<div class="tabs-novo active" data-tab="1">
					<div class="bloco-form-big">
						<div class="right">

							<input type="hidden" name="ordem_compra_id" id="ordem_compra_id" value="<?php echo (isset($ordem_compra) ? $ordem_compra->id : "")?>">

							<div class="form-metade">
								<div class="grupo-novo">
									<select class="input-novo <?php echo set_digitado($objectOrdemCompra, 'unidade_negocio_id'); ?>" name="unidade_negocio_id">
										<option value="" selected disabled>Selecione</option>
										<?php $__currentLoopData = $unidades; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
										<option <?php echo (isset($ordem_compra) && ($ordem_compra->unidade_negocio_id == $item->id) ) ? 'selected' : ''; ?> value="<?php echo e($item->id); ?>"><?php echo e($item->nome); ?></option>
										<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
									</select>
									<label class="required">Unidade de Negócio</label>
								</div>
								<div class="grupo-novo">
									<select class="input-novo <?php echo set_digitado($objectOrdemCompra, 'empresa_id'); ?>" name="empresa_id">
										<option value="" selected disabled>Selecione</option>
										<?php $__currentLoopData = $empresas; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
										<option <?php echo (isset($ordem_compra) && ($ordem_compra->empresa_id == $item->id) ) ? 'selected' : ''; ?> value="<?php echo e($item->id); ?>"><?php echo e($item->nome); ?></option>
										<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
									</select>
									<label class="required">Empresa</label>
								</div>
							</div>

							<div class="form-metade">
								<div class="grupo-novo">
									<input type="date" class="input-novo <?php echo set_digitado($objectOrdemCompra, 'previsao_entrega'); ?>" name="previsao_entrega" value="<?php echo (isset($ordem_compra) ? $ordem_compra->previsao_entrega : "")?>">
									<label>Previsão Entrega</label>
								</div>
								<div class="grupo-novo">
									<input type="date" class="input-novo <?php echo set_digitado($objectOrdemCompra, 'data_entrega'); ?>" name="data_entrega" value="<?php echo (isset($ordem_compra) ? $ordem_compra->data_entrega : "")?>">
									<label>Data Entrega</label>
								</div>
							</div>

							<div class="form-metade">
								<div class="grupo-novo">
									<select class="input-novo <?php echo set_digitado($objectOrdemCompra, 'status'); ?>" name="status">
										<option value="" selected disabled>Selecione</option>
										<?php $__currentLoopData = $listaStatus; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
										<option <?php echo (isset($ordem_compra) && ($ordem_compra->status == $item->chave) ) ? 'selected' : ''; ?> value="<?php echo e($item->chave); ?>"><?php echo e($item->valor); ?></option>
										<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
									</select>
									<label class="required">Status</label>
								</div>
								<div class="grupo-novo">
									<select class="input-novo <?php echo set_digitado($objectOrdemCompra, 'responsavel_id'); ?>" name="responsavel_id">
										<option value="" selected disabled>Selecione</option>
										<?php $__currentLoopData = $responsaveis; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
										<option <?php echo (isset($ordem_compra) && ($ordem_compra->responsavel_id == $item->id) ) ? 'selected' : ''; ?> value="<?php echo e($item->id); ?>"><?php echo e($item->first_name); ?> <?php echo e($item->last_name); ?></option>
										<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
									</select>
									<label class="required">Responsável</label>
								</div>
							</div>

							<div class="form-metade">
								<div class="grupo-novo">
									<select class="input-novo <?php echo set_digitado($objectOrdemCompra, 'fornecedor_id'); ?>" name="fornecedor_id">
										<option value="" selected disabled>Selecione</option>
										<?php $__currentLoopData = $fornecedores; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
										<option <?php echo (isset($ordem_compra) && ($ordem_compra->fornecedor_id == $item->id) ) ? 'selected' : ''; ?> value="<?php echo e($item->id); ?>"><?php echo e($item->nome); ?></option>
										<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
									</select>
									<label class="required">Fornecedor</label>
								</div>
								<div class="grupo-novo">
									
								</div>
							</div>

						</div>
					</div>
					<div class="bloco-form-big">
						<div class="right">
							<textarea name="observacoes" id="observacoes">
								<?php echo (isset($ordem_compra) ? $ordem_compra->observacoes : "Digite aqui o texto da ordem de compra")?>
							</textarea>
						</div>
					</div>
				</div>

				<div class="tabs-novo" data-tab="2">
					<div class="bloco-form-big">
						<div class="right">
							<div class="row">
								<div class="col-md-6" id="combo-produto">
									<label for="qtd_produto">Produto</label>
									<select id="id_produto" class="default-select select2-produto input-novo" name="produto" ></select>
									<select id="produto_id" class="form-control hidden" name="produto_id" ></select>
								</div>
								<div class="col-md-2">
									<label for="qtd_produto">Qtde.</label>
									<input type="number" value="1" style="padding:10px; width: 75px;" class="form-control" id="qtd_produto" name="qtd_produto" />
								</div>
								<div class="col-md-2">
									<label for="preco_custo">Preço Custo</label>
									<input type="number" value="0.00" style="padding:10px;" class="form-control" id="preco_custo" name="preco_custo" />
								</div>
								<div class="col-md-2">
									<label>&nbsp;</label>
									<button class="btn btn-primary btn-block" type="button" id="add-produto-to-ordem">Adicionar</button>
									<div style="display: block;"></div>
									<button class="btn btn-primary hidden" type="button" id="alterar-produto-ordem">Alterar</button>
									<button class="btn btn-danger hidden" type="button" id="cancelar-produto-ordem">Cancelar</button>
								</div>
							</div>

						</div>
					</div>
					<div class="bloco-form-big">
						<div class="right">
							<div id="lista-produtos"></div>
						</div>
					</div>
					<div class="bloco-form-big">
						<div class="right">
							
							<div class="form-metade">
								<div class="grupo-novo">
									<input type="number" class="input-novo <?php echo set_digitado($objectOrdemCompra, 'quantidade'); ?>" name="quantidade" id="quantidade" value="<?php echo isset($ordem_compra) ? $ordem_compra->quantidade : ''?>">
									<label class="required">Quantidade</label>
								</div>
								<div class="grupo-novo">
									<input type="number" class="input-novo <?php echo set_digitado($objectOrdemCompra, 'valor_total'); ?>" name="valor_total" id="valor_total" value="<?php echo isset($ordem_compra) ? $ordem_compra->valor_total : ''?>">
									<label class="required">Valor Total</label>
								</div>
							</div>

						</div>
					</div>
				</div>
				
				<div class="tabs-novo" data-tab="3">
					<div class="bloco-form-big">
						<div class="right">
							<h5>Lorem ipsum 3</h5>
						</div>
					</div>
				</div>
			</div>
			<div class="bottom-form-box">
				<button class="main-btn-style" type="button" id="btn-save-ordem-compra-ajax"><i class="fa fa-spin fa-spinner"></i>Salvar</button>
			</div>
		</form>
	</div>
</div>
<div class="form-add-mask"></div>

<script type="text/javascript">
	/** CKEditor config */
	ClassicEditor
		.create( document.querySelector( '#observacoes' ),{
			language: 'pt-br',
			toolbar: [ 
				'heading', 
				'|', 
				'bold', 'italic', 'link', 
				'|', 
				'bulletedList', 'numberedList', 
				'imageUpload',  
			],
			heading: {
				options: [
					{ model: 'paragraph', title: 'Parágrafo', class: 'ck-heading_paragraph' },
					{ model: 'heading2', view: 'h2', title: 'Subtítulo', class: 'ck-heading_heading2' }
				]
			},
			// cloudServices: {
			// 	tokenUrl: 'https://example.com/cs-token-endpoint',
			// 	uploadUrl: 'https://your-organization-id.cke-cs.com/easyimage/upload/'
			// }
			// Instruções backend (upload de imagens): https://ckeditor.com/ckeditor-cloud-services/easy-image/
		} )
		.then( editor => {
			window.editor = editor;
		} )
		.catch( err => {
			console.error( err.stack );
		} );

</script>

<script type="text/javascript">

	$(document).ready(function(){

		$('.select2-produto').on('select2:select', function(e){
             var data = e.params.data;
             $("#preco_custo").val(data.preco_custo);
        });

		<?php if(isset($ordem_compra) && $ordem_compra->id): ?>
			OrdemCompra.loadProdutosOrdemCompra(<?php echo e($ordem_compra->id); ?>);
		<?php else: ?>
			OrdemCompra.loadProdutosOrdemCompra(0);
		<?php endif; ?>

		$('#add-produto-to-ordem').click(function(){

			var id_produto         = $(".select2-produto").val();
			var text_produto       = $(".select2-produto option:selected").text();
			var quantidade_produto = $("#qtd_produto").val();
			var preco_custo        = $('#preco_custo').val();

			if(quantidade_produto){

				if (id_produto) {

					var dataSelect = $(".select2-produto").select2('data')[0];

					console.log('dataSelect');
					console.log(dataSelect);

					var produto = {
						id: 	id_produto,
						nome: 	text_produto,
						quantidade: 	quantidade_produto,
						preco_mercado:  dataSelect.preco_mercado,
						preco_custo: 	dataSelect.preco_custo,
						preco_venda: 	dataSelect.preco_venda,
					};

					OrdemCompra.loadProdutoOrdemCompra(produto);

				}else{
					alertUtil.alertWarning('Você deve selecionar um produto');
				}
			}else{
				alertUtil.alertWarning('Você deve digitar a quantidade');
			}
			
		});

		$('#alterar-produto-ordem').click(function(){

			var $produto_id  = $('#produto_id').val();
			var $quantidade  = $('#qtd_produto').val();
			var $preco_custo = $('#preco_custo').val();

			$('#produto-' + $produto_id).find('.quantidade').text($quantidade);
			$('#produto-' + $produto_id).find('.preco-custo').text(number_format($preco_custo,2,',','.'));
			$('#produto-' + $produto_id).find('.total').text(number_format($quantidade * $preco_custo,2,',','.'));

			$('#produto-quantidade-' + $produto_id).val($quantidade);
			$('#produto-preco-custo-' + $produto_id).val($preco_custo);

		 	$('#alterar-produto-ordem, #cancelar-produto-ordem').addClass('hidden');
		 	$('#combo-produto').find('#produto_id').addClass('hidden');

			$('#combo-produto').find('.select2-container').removeClass('hidden');
		 	$('#add-produto-to-ordem').removeClass('hidden');

		 	$('#qtd_produto').val(1);
			$('#preco_custo').val(0);

			setTimeout(function() {
				OrdemCompra.calcularOrdemCompra();
			}, 100);

		});

		$('#cancelar-produto-ordem').click(function(){

			$('#alterar-produto-ordem, #cancelar-produto-ordem').addClass('hidden');
		 	$('#combo-produto').find('#produto_id').addClass('hidden');

			$('#combo-produto').find('.select2-container').removeClass('hidden');
		 	$('#add-produto-to-ordem').removeClass('hidden');

		 	$('#qtd_produto').val(1);
			$('#preco_custo').val(0);
			$('#id_produto').val('').trigger('change');

		});

		$(document).on('click', '.removeProduto', function(){
			var $tr = $(this).closest('tr');
			$tr.remove();
			OrdemCompra.calcularOrdemCompra();
		});

		$(document).on('click', '.alteraProduto', function(){
			
		 	var produto_id  = $(this).data('id');
		 	var quantidade  = $('#produto-quantidade-' + produto_id).val();
		 	var preco_custo = $('#produto-preco-custo-' + produto_id).val();

		 	$('#combo-produto').find('.select2-container').addClass('hidden');
		 	$('#add-produto-to-ordem').addClass('hidden');

		 	$('#combo-produto').find('#produto_id').removeClass('hidden');
		 	$('#alterar-produto-ordem, #cancelar-produto-ordem').removeClass('hidden');

		 	$.ajax({
			  	url: '/admin/produto/buscar',
				dataType: 'json',
				type: "POST",
				data: {produto_id: produto_id},
			}) .done(function( data ) {

				$(data.items).each(function(index, item){
					$("#produto_id").append('<option value="' + produto_id + '">' + item.nome + '</option>');
				});

				$("#produto_id").val(produto_id);
				$("#qtd_produto").val(quantidade);
				$('#preco_custo').val(preco_custo);

			});

		});

		$('#btn-save-ordem-compra-ajax').click(function(){
			OrdemCompra.saveFormOrdemCompra();
		});

		$(".select2-produto").select2({
			minimumInputLength: 2,
			placeholder: 'Buscar Produtos',
			ajax: {
				url: '/admin/produto/buscar',
				dataType: 'json',
				type: "POST",
				data: function (term) {
					return {
						term 	: term,
						origem  : 'ordem-compra'
					};
				},
				processResults: function (data, params) {
					console.log(data);
		          return {
			        results: $.map(data.items, function (item) {
			        	return {
								text: item.nome+' - SKU: '+item.sku,
								slug: item.slug,
								id: item.id,
								preco_mercado: item.preco_mercado,
								preco_custo: item.preco_custo,
								preco_venda: item.preco_de_venda,
								disponibilidade : item.disponibilidade
							}
						})
			       
			      };
			    }
			}
		});

	});

</script>