@props(['calculationGroup','calculations','moduleId','fieldsList','mainCalculations'])

@php
$Calculations=['1'=>'Sum','2'=>'Product','3'=>'Average','4'=>'Percentage','5'=>'Difference','6'=>'Division','7'=>'Concatenate','8'=>'Add Time','9'=>'Subtract Time','10'=>'Date Difference'];
$WorkFlowCalculationGroupId=$calculationGroup->WorkFlowCalculationGroupId;

$selectedVal=$calculationGroup->Operator;
$GroupSortOrder= $calculationGroup->SortOrder;


$ModuleId="";
if(isset($moduleId))
$ModuleId=$moduleId;


@endphp


<div id="CalculationGroupAccordian{{$WorkFlowCalculationGroupId}}" class="accordion">

	<div class="card">
		<div class="card-header" id="...">
			<section class="mb-0 mt-0">
				<div role="menu" class="" data-bs-toggle="collapse" data-bs-target="#CalculationGroupAccordianOne{{$WorkFlowCalculationGroupId}}" aria-expanded="true" aria-controls="CalculationGroupAccordianOne{{$WorkFlowCalculationGroupId}}">

					<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-trash-2 text-danger" onclick="DeleteCalculationGroup('{{$WorkFlowCalculationGroupId}}')" height="17" width="17" style="position: relative;top: -3;"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>

					&nbsp;&nbsp;&nbsp;

					<x-workflow.calculationGroupOperators :selectedVal="$selectedVal" :workFlowCalculationGroupId="$WorkFlowCalculationGroupId"/>

					<div class="icons"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9"></polyline></svg></div>
				</div>
			</section>
		</div>

		<div id="CalculationGroupAccordianOne{{$WorkFlowCalculationGroupId}}" class="collapse show" aria-labelledby="..." data-bs-parent="#CalculationGroupAccordian{{$WorkFlowCalculationGroupId}}">
			<div class="card-body">



				<div class="form-group row">


					<div class="col-md-1">
						<a href="javascript:void(0);" class="text-primary" onClick="AddCalculation('{{$WorkFlowCalculationGroupId}}')">
							<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-plus-circle"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg> Add
						</a>

					</div>
					<div class="col-md-2">
						<input class="form-control" type="text" placeholder="SortOrder" name="SortOrder" value="{{$GroupSortOrder}}" onchange="UpdateGroup('{{$WorkFlowCalculationGroupId}}','SortOrder',this.value)">
					</div>

				</div>


				<div id="CalculationsDiv{{$WorkFlowCalculationGroupId}}">

					@if(isset($calculations))


					@foreach($calculations as $calculation)
					@php
					$WorkFlowCalculationId=$calculation->WorkFlowCalculationId;
					@endphp	
					<x-workflow.calculation :workFlowCalculationGroupId="$WorkFlowCalculationGroupId" :workFlowCalculationId="$WorkFlowCalculationId" :moduleId="$ModuleId" :calculation="$calculation" :fieldsList="$fieldsList" :mainCalculations="$mainCalculations"/>
					@endforeach




					@endif

				</div>

			</div>
		</div>
	</div>


</div>