@extends('helper.include.view.modal', ['id' => 'modal-CADDEMODELFICHATECNICA_CORES_INC_GRUPO_CONSUMO', 'class_size' => 'modal-lg'])

@section('modal-start')
    <form class="form-inline">
@overwrite

@section('modal-header-left')

<h4 class="modal-title">
	<span>22430 - Consumo - Incluir</span>
</h4>

@overwrite

@section('modal-header-right')

	<button ng-click="vm.CADDEMODELFICHATECNICA_CORES.confimCorGrupoConsumo();" type="button" class="btn btn-primary" data-hotkey="f1">
		<span class="glyphicon glyphicon-ok"></span> Confirmar
	</button>

	<button ng-click="vm.CADDEMODELFICHATECNICA_CORES.cancelarCorGrupoConsumo();" type="button" class="btn btn-danger btn-cancelar" data-hotkey="esc">
		<span class="glyphicon glyphicon-ban-circle"></span> Cancelar
	</button>

@overwrite

@section('modal-header-end')

@overwrite

@section('modal-body')
<div style="height: calc(100vh - 300px); min-height: 300px;">

	<div class="row">

		<div class="form-group">
			<label>Cor Selecionada:</label>
			<div class="input-group">
				<div 
					class="ng-scope" 
					ng-mouseover="vm.CADDEMODELFICHATECNICA_CORES.ZoominItem($event);" 
					ng-mouseleave="vm.CADDEMODELFICHATECNICA_CORES.ZoomoutItem($event);" 
					style="padding: 12px; border-radius: 3px; box-shadow: rgb(100, 100, 100) 0px 1px 3px; transform-origin: left top; transition: all 0.5s ease 0s; position: inherit; cursor: zoom-in; transform: scale(1); z-index: 0; width: 150px;" 
					ng-style="{'background-color':(vm.CADDEMODELFICHATECNICA_CORES.COR_SELECIONADA == true)?'rgb('+vm.CADDEMODELFICHATECNICA_CORES.INC_GRUPO_CONSUMO.INFO_COR.AMOSTRA_RGB+')':'transparent'}">
				</div>
				<input 
					type="text" 
					class="form-control input-maior" 
					ng-model="vm.CADDEMODELFICHATECNICA_CORES.INC_GRUPO_CONSUMO.INFO_COR.DESC_COR" 
					ng-readonly="true" 
					ng-disabled="true">
			</div>
		</div>

		<br>

		<div class="tabela_inc_consumogrupo" id="tabela_inc_consumogrupo"></div>

	</div>

</div>
</form>

@overwrite