@extends('layouts.header')
@section('content')
<!--  BEGIN CONTENT AREA  -->
		<div class="page-header">
		<br>
		 <div class="breadcrumb-four">
				<ul class="breadcrumb">
				 @php
					$Dashboard=url('dashboard');
				@endphp
					<li><a href="{{$Dashboard}}"><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 class="active">
						<a href="{{url('List-Tm_Team')}}" title="List Teams">
						<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-list"><line x1="8" y1="6" x2="21" y2="6"></line><line x1="8" y1="12" x2="21" y2="12"></line><line x1="8" y1="18" x2="21" y2="18"></line><line x1="3" y1="6" x2="3.01" y2="6"></line><line x1="3" y1="12" x2="3.01" y2="12"></line><line x1="3" y1="18" x2="3.01" y2="18"></line></svg>List Teams</a>
					</li>
					<li >
						<a href="javascript:void(0);" title="Create Team"  class="active">
						<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"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg>Create Teams</a>
					</li>
					
				</ul>
			</div>
		</div>
		<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>Create Team</h4>
							</div>          
						</div>
					</div>
					<div class="widget-content widget-content-area">
						<form action="{{url('/store-Tm_Team')}}" method="POST" >
							@csrf
							<div class="row">
								<div class="col-xs-12 col-sm-12 col-md-12">
									<div class="form-group">
										<strong>Team Name :  <font color="red">*</font></strong>
										<input type="text" name="TeamName" id="TeamName" class="form-control" placeholder="TeamName" onchange="CheckTeamExists()" required>
										<div id="DisplayTeamError" style="display:none;"><font color="red"><small><i>Role is Already Exists</i></small></font></div>
									</div>
								</div>
								<div class="col-xs-12 col-sm-12 col-md-12">
									<div class="form-group">
										<strong>Description:</strong>
										<textarea class="form-control" style="height:50px" name="Description"
											placeholder="Description" id="Description" required></textarea>
									</div>
								</div>
								<div class="col-xs-12 col-sm-12 col-md-12 text-center">
									<button type="submit" class="btn btn-primary" id="TeamSubmitBtn">Submit</button>
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
        <!--  END CONTENT AREA  -->
	<script>
	CheckTeamExists=()=>
	{
		var TeamName=document.getElementById('TeamName').value;
		 var formData = {
			TeamName : TeamName,
		};
		$.ajax({
			type:"post",
			url: "{{url('CheckTeamExists')}}",
			data: formData,
			beforeSend:function() {
			},
			success:function(result)
			{
				if(result==0)
				{
					document.getElementById('DisplayTeamError').style.display="none"; 
					$('#TeamSubmitBtn').prop("disabled", false); 
				}
				else
				{
					document.getElementById('DisplayTeamError').style.display="block"; 
					$('#TeamSubmitBtn').prop("disabled", true); 
				}
			},
			complete: function() {
			},
			error:function(response)
			{
				alert("error:"+response);
			}
		});
	}
</script>
@endsection