section.widget.widget-search
	header
		h5 Filtros

		.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
		= form_for( @filtro_inicio, url: url_for(controller: 'obra/inicio', action: :index), html: {method: "get", class: "form-vertical" }, role: "form" ) do |f|
			fieldset
				.form-group
					.col-sm-2.filter_column
						label.control-label for="normal-field" Data Inicial
						.input-group
							= f.text_field :data_inicial, class: "form-control input-sm date-picker", autocomplete: "off"
							span.input-group-addon
								span.icone-calendario

					.col-sm-2.filter_column
						label.control-label for="normal-field" Data Final
						.input-group
							= f.text_field :data_final, class: "form-control input-sm date-picker", autocomplete: "off"
							span.input-group-addon
								span.icone-calendario

			.form-actions.form-search-actions
				= f.submit "Filtrar", class: "btn btn-default btn-sm"

.widget
	.widget-body
		- if @obras.any? { |obra| !obra.teve_movimentacoes_nos_ultimos_120_dias? || (obra.porcentagem_de_vigencia_da_obra_maior_ou_igual_a_80_por_cento? && obra.porcentagem_de_medicao_da_obra_menor_ou_igual_a_50_por_cento?) }
			.row
				.col-md-12
					.alert.alert-danger style="font-weight: 500;"
						span.fw-bold Aviso!
						'  Existe pelo menos uma obra sem medições e pagamentos por mais de 120 dias e/ou a vigência do contrato está em 80% ou mais e execução está com 50% ou menos.
						strong Para ver mais detalhes!
						==< " "
						= link_to 'Clique aqui.', obra_index_obras_alertas_inicio_path, class: 'alert-link'

		- if @transferencias.any? { |transferencia| transferencia.porcentagem_de_vigencia_maior_ou_igual_a_80_por_cento? && transferencia.porcentagem_de_execucao_menor_ou_igual_a_50_por_cento? }
			.row
				.col-md-12
					.alert.alert-danger style="font-weight: 500;"
						span.fw-bold Aviso!
						'  Existe pelo menos um convênio com a vigência em 80% ou mais e execução está com 50% ou menos.
						strong Para ver mais detalhes!
						==< " "
						= link_to 'Clique aqui.', obra_index_convenios_alertas_inicio_path, class: 'alert-link'

		.panel.panel-primary
			.panel-heading Painel de Informações Gerenciais - Período #{@filtro_inicio.data_inicial} a #{@filtro_inicio.data_final}
			.panel-body

				.row
					.col-md-6
						= column_chart @qtd_por_status, title: "Quantidade de Obras por Status", label: "Qtd", width: "500px",
							library: {                                               \
								tooltip: {                                             \
									pointFormat: 'Total: <b>{point.y}</b>'        \
								},                                                     \
								yAxis: {                   \
									allowDecimals: false,    \
									title: {                 \
											text: '<b>Quantidade</b>'   \
									}                        \
								},                         \
								xAxis: {                   \
									allowDecimals: false,    \
									title: {                 \
											text: '<b>Status</b>'  \
									}                        \
								}                          \
							}

					.col-md-6
						= column_chart @valor_total_por_status, title: "Valor (R$) por Status", label: "Valor Total", prefix: "R$ ", thousands: ".", decimal: ",", width: "450px",
							library: {                                               \
								tooltip: {                                             \
									pointFormat: 'Valor Total: R$ <b>{point.y:.2f}</b>'        \
								},                                                     \
								yAxis: {                   \
									allowDecimals: false,    \
									title: {                 \
											text: '<b>Valor Total (R$)</b>'   \
									}                        \
								},                         \
								xAxis: {                   \
									allowDecimals: false,    \
									title: {                 \
											text: '<b>Status</b>'  \
									}                        \
								}                          \
							}

				br
				.row
					.col-md-6 style="margin-left: -15px;"

						= pie_chart @obras_por_unidade_orcamentaria, title: "Quantidades de Obras por UG",  width: "500px", label: "Total",
							library: {                                               \
								tooltip: {                                             \
									pointFormat: 'Total: <b>{point.y}</b>'        \
								},                                                      \
								plotOptions: {                                          \
									pie: {                                                \
										dataLabels: {                                       \
											enabled: false                                    \
										},                                                  \
										showInLegend: true                                  \
									}                                                     \
								}                                                       \
							}

					.col-md-6
						= column_chart @top_5_obras_valor_total, title: "Top 5 - Maiores Obras (R$)", label: "Valor Total", prefix: "R$ ", thousands: ".", decimal: ",", width: "450px",
							library: {                                               \
								tooltip: {                                             \
									pointFormat: 'Valor Total: R$ <b>{point.y:.2f}</b>'        \
								},                                                     \
								yAxis: {                   \
									allowDecimals: false,    \
									title: {                 \
											text: '<b>Valor Total (R$)</b>'   \
									}                        \
								},                         \
								xAxis: {                   \
									allowDecimals: false,    \
									title: {                 \
											text: '<b>Obra</b>'  \
									}                        \
								}                          \
							}