section.widget.widget-search style="margin-top: 10px"
	header
		h5
			b CONSULTAR PAGAMENTOS

		.widget-controls
			a data-widgster="expand" href="#" style="display: none;" title="Expand"
				i.icone-cadastrar

			a data-widgster="collapse" href="#" title="Collapse"
				i.glyphicon.glyphicon-minus

	.widget-body
		= search_form_for @q, url: portal_da_transparencia_pagamentos_path, :html => {class: "form-vertical"}, builder: SimpleForm::FormBuilder do |f|
			fieldset
				.form-group
					.row.alinhar
						.col-sm-2
							= f.input :orcamento_id_eq, label: 'Exercicio' , collection: @orcamentos, label_method: :exercicio, selected: @orcamento.id, include_blank: 'Selecione', input_html: {class: 'form-control s2', id: 'exercicio_ano'}
						.col-sm-2
							= f.input :data_gteq, as: :string, wrapper: :calendar_field, label: 'Data Inicial', input_html: {class: 'form-control date-picker', id: 'data-inicial-receitas'}
						.col-sm-2
							= f.input :data_lteq, as: :string, wrapper: :calendar_field, label: 'Data Final', input_html: {class: 'form-control date-picker'}
						.col-sm-2
							= f.input :numero_eq, label: 'Nº do Pagamento', input_html: {class: 'form-control input-sm'}
						.col-sm-2
							= f.input :liquidacao_empenho_numero_formatado_liquidacao_eq, label: 'Nº da Liquidação', maxlength: 18, placeholder: "00000000.000", input_html: {class: 'form-control input-sm'}
						.col-sm-2
							= f.input :liquidacao_empenho_numero_do_empenho_eq, label: 'Nº do Empenho', input_html: {class: 'form-control input-sm'}

				.form-group
					.row.alinhar
						.col-sm-4
							= f.input :liquidacao_empenho_projeto_modalidade_de_licitacao_eq, label: 'Modalidade de Licitação', collection: @modalidades_de_licitacao, label_method: :first, value_method: :second, include_blank: 'Selecione', input_html: {class: 'form-control s2', id: 'modalidade_de_licitacao'}
						.col-sm-2
							= f.input :liquidacao_empenho_projeto_numero_do_processo_eq, label: 'Nº do Processo', input_html: {class: 'form-control input-sm'}
						.col-sm-2
							= f.input :liquidacao_contrato_numero_eq, label: 'Nº Contrato', input_html: {class: 'form-control input-sm'}
						.col-sm-4
							= f.input :liquidacao_empenho_orcamento_da_despesa_elemento_de_despesa_por_subacao_subacao_unidade_orcamentaria_unidade_gestora_id_eq, label: 'Unidade Gestora', collection: @unidades_gestoras, label_method: :codigo_e_nome, include_blank: 'Selecione', input_html: {class: 'form-control s2'}

				.form-group
					.row.alinhar
						.col-sm-2
							= f.input :liquidacao_empenho_orcamento_da_despesa_elemento_de_despesa_por_subacao_subacao_acao_natureza_da_acao_codigo_completo_eq, label: 'Proj/Atv', placeholder: "0.000", input_html: {class: 'form-control input-sm'}
						.col-sm-3
							= f.input :liquidacao_empenho_orcamento_da_despesa_elemento_de_despesa_por_subacao_elemento_de_despesa_codigo_eq, label: 'Elemento de Despesa', collection: @elementos_de_despesa, label_method: :descricao_e_codigo, value_method: :codigo, include_blank: 'Selecione', input_html: {class: 'form-control s2', id: 'elemento_de_despesa'}
						.col-sm-4
							= f.input :liquidacao_empenho_sub_elemento_de_despesa_codigo_eq, label: 'Sub-Elemento de Despesa', collection: @sub_elementos_de_despesa, label_method: :codigo_e_descricao, value_method: :codigo, include_blank: 'Selecione', input_html: {class: 'form-control s2', id: 'sub_elemento_de_despesa'}
						.col-sm-3
							=f.input :liquidacao_empenho_pessoa_id_eq, label: 'Fornecedor', collection: @fornecedores, label_method: :nome_e_cpf_ou_cnpj, include_blank: 'Selecione', input_html: {class: 'form-control s2', id: 'fornecedor'}

				.form-group
					.row.alinhar
						.col-sm-3
							= f.label :valor_gteq, 'Valor Minimo', class: 'control-label'
							= f.monetary_field :valor_gteq, class: "form-control input-sm"
						.col-sm-3
							= f.label :valor_lteq, 'Valor Máximo', class: 'control-label'
							= f.monetary_field :valor_lteq, class: "form-control input-sm"

							= f.hidden_field :liquidacao_empenho_orcamento_da_despesa_elemento_de_despesa_por_subacao_subacao_unidade_orcamentaria_tipo_de_unidade_administrativa_poder_associado_eq, value: "#{params[:tipo_de_poder] == 'camara' ? @tipos_de_poderes['legislativo'] : @tipos_de_poderes['executivo']}", input_html: {id: 'tipo_de_poder'}

				.form-group
					.row.alinhar
						.col-sm-7.filter_column
						.col-sm-5.filter_column style="text-align: right;"
							.form-actions.form-search-actions 
								= f.submit "Consultar", class: "btn btn_portal btn-default btn-md", id:"btn_consultar"

javascript:
	
	$("#elemento_de_despesa").on("change", function(){
		buscaSubElementosDeDespesa($(this));
	});

	function buscaSubElementosDeDespesa(elementoDeDespesa) {
		if ($("#elemento_de_despesa").val() != ""){
			limpaSelectBox($("#sub_elemento_de_despesa"))
			}
		$.ajax({
			method: "GET",
			url: root_url + "/pesquisas/" + elementoDeDespesa.val() +"/sub_elementos_filtrados_por_elemento_de_despesa?index_page='true'",
			beforeSend: function(){
				LoadingInterface("Aguarde...")
			},
			success: function(data,status,xhr){
				if($.trim(data) != ""){
					$.each(data, function(i,sub_elemento){
						option = new Option(sub_elemento.codigo_e_descricao, sub_elemento.codigo, true, true);
						select_box.append(option);
					})
					populaSelectBox(select_box);
				}
			}
		})
	}

	function limpaSelectBox(id){
		$(id).empty().trigger('change')
		select_box = $(id).select2({
			placeholder: "Selecione",
			allowClear: true
		})
		return(select_box);

	}

	function populaSelectBox(select_box){
		select_box.prepend(new Option('Selecione', '', true, true));
		select_box.trigger('change');

	}