@extends('layouts.header')
@section('content')
<!--  BEGIN CONTENT AREA  -->
<br/>
<div class="page-header">
	<div class="breadcrumb-four">
		<ol class="breadcrumb">
			<ul class="breadcrumb">
				<li><a href="{{url('dashboard')}}" title="Go to Home Page!"><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-home"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg></a></li>
				<li>
				<a href="{{url('Admin-Panel')}}" title="Administration">
						<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-unlock"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 9.9-1"></path></svg>
					Admin Panel
				</a>
				</li>
				<li class="active">
				<a href="{{url('ModuleAssociationConfig')}}" class="active" title="Module Association Configuration">
					<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-repeat"><polyline points="17 1 21 5 17 9"></polyline><path d="M3 11V9a4 4 0 0 1 4-4h14"></path><polyline points="7 23 3 19 7 15"></polyline><path d="M21 13v2a4 4 0 0 1-4 4H3"></path></svg>
					Module Association
				</a>
				</li>
			</ul>
		</ol>
	</div>
</div>
<br>
		<div class="row">
		<div class="col-lg-12 col-md-12 layout-spacing">
			<div>
				<!--  class="statbox widget box box-shadow"
				<div class="widget-header">
					<div class="row">
						<div class="col-xl-12 col-md-12 col-sm-12 col-12">
							<h4>Association Configuration</h4>
						</div>          
					</div>
				</div> -->
				<div class="widget-content widget-content-area" height="800">
					<div class="row">
						<div class="col-md-4">
							<label for="Module" class="text-primary">Primary Module</label>
							<select id="PrimaryModule" name="PrimaryModule" class="form-control" onchange="LoadSecondaryModules()">
								<option value="">-- Select Module --</option>
								@foreach ($ModulesArray as $ModuleKey=>$ModuleValue)
									<option value="{{$ModuleKey}}">{{$ModuleValue}}</option>
								@endforeach
							</select>
						</div>
						<div class="col-md-4">
							<label for="Module" class="text-primary">Seconday Module</label>
							<select id="SecondayModule" name="SecondayModule" class="form-control">
							</select>
						</div>
						<div class="col-md-4">
							<label for="Module" class="text-primary">Select Association</label>
							<select id="ModuleAssociation" name="ModuleAssociation" class="form-control">
								<option value="0">-- Select Association --</option>
								<option value="1">One to One</option>
								<option value="2">One to Many</option>
								<option value="3">Many to Many</option>
							</select>
						</div>
					</div>
					<br/>
					<div class="row">
							<div class="col-md-5"></div>
							<div class="col-md-2">
							<input type="button" name="Associate" id="Associate" value="Associate" class="btn btn-primary" onclick="AssociateModules()" />
							</div>
							<div class="col-md-5"></div>
					</div>
					<br><br>
					<div class="row" name="AssociatedModulesDiv" id="AssociatedModulesDiv" ></div>
				</div>
				
			</div>
		</div>

	</div>
        <!--  END CONTENT AREA  -->
@endsection