@extends('layouts.admin_layout')
@section('content')
<div class="container-fluid">
    <div class="row column_title">
    <div class="col-md-12">
        <div class="page_title">
            <h2>Manage Alliances Partnerships</h2>
        </div>
    </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <div class="white_shd full margin_bottom_30">
                <div class="full graph_head">
                    <div class="heading1 margin_0">
                    <h2>Create New Alliances Partnership</h2>
                    </div>
                </div>
                <div class="padding_infor_info">
                    <form action="{{url('admin/manage-alliances-partnerships')}}" method="POST" enctype="multipart/form-data">
                 @csrf
                <div class="form-group">
                    <label>Category</label>
                    <select name="category_id" class="form-control" required id="category_id">
                        <option value="">-- select category name --</option>
                        @foreach($categories as $category)
                        <option value="{{$category->id}}">{{$category->category}}</option>
                        @endforeach
                    </select>
                </div>

                <div class="form-group">
                    <label>Sub Category</label>
                    <select name="sub_category_id" class="form-control" id="sub_category_id">
                    </select>
                </div>

            
                <div class="form-group">
                    <label>Name</label>
                    <input class="form-control" type="text" placeholder="Name" name="name" required>
                </div>

                <div class="form-group">
                    <label>Logo <span class="text-danger">[91 * 91]</span></label>
                    <input class="form-control" type="file" placeholder="Logo" name="logo" required>
                </div> 

                <div class="form-group">
                    <label>Description</label>
                    <textarea class="form-control ckEditor"placeholder="Description"  name="description" ></textarea>
                </div>

                <div class="form-group">
                    <label>Sorting</label>
                    <input class="form-control" type="number" placeholder="Number"  name="sorting" >
                </div>

                <div class="form-group">
                    <label>Managing Directors</label>
                    <select name="directors[]" class="form-control" id="directors" multiple="true">
                        <option value="">-- select director name --</option>
                        @foreach($directors as $director)
                        <option value="{{$director->id}}">{{$director->name}}</option>
                        @endforeach
                    </select>
                </div>

                <label>Contact Person</label>
                <div id="contactPersons">
                    <div class="row">
                        <div class="col-md-3">
                            <div class="form-group">
                                <label>Name</label>
                                <input class="form-control" type="text" placeholder="Person Name" name="contact_name[]" >
                            </div> 
                        </div>
                        <div class="col-md-3">
                            <div class="form-group">
                                <label>email</label>
                                <input class="form-control" type="email" placeholder="Email Id" name="contact_email[]">
                            </div> 
                        </div>
                        <div class="col-md-3">
                            <div class="form-group">
                                <label>phone</label>
                                <input class="form-control" type="number" placeholder="Phone Number" name="contact_phone[]">
                            </div> 
                        </div>
                        <div class="col-md-3">
                            <div class="form-group">
                                <label>Profile Image</label>
                                <input class="form-control" type="file" placeholder="Profile Image" name="contact_photo[]">
                            </div> 
                        </div>
                    </div>
                        <div class="text-end mb-5 ">
                            <span class="btn bg-success text-white fs-18 remove-conatct-input float-right" id="addMore">+Add</span>
                        </div>
                </div>

                <div class="form-group">
                      <label >Status</label>
                        <div class="custom-control custom-radio mb-3">
                            <input type="radio" id="customRadio1"  class="custom-control-input" value="1" name="status">
                            <label class="custom-control-label" for="customRadio1">Active</label>
						</div>
                        <div class="custom-control custom-radio mb-5">
                            <input type="radio" id="customRadio2"  class="custom-control-input" value="0" name="status" checked="">
                            <label class="custom-control-label" for="customRadio2">In-Active</label>
                        </div>
                  </div>
                    <div class="form-group">
                        <button type="submit" class="btn btn-primary">Submit</button>
                        <a href="{{ url('admin/manage-alliances-partnerships')}}" class="btn btn-danger">Cancel</a>
                    </div>
		        </form>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Sub categories dynamic -->
<script type="text/javascript">
    $(document).ready(function(e){
    $("#category_id").on('change',function(e){
            e.preventDefault();
           var category_id= $('#category_id option:selected').val();
      $.ajax({
         url:'{{url("admin/get_ecosystem_sub_categories")}}',
         type:'GET',
         data:{category_id:category_id},
         dataType:'JSON',
         success:function(data)
         {
            $('select[name="sub_category_id"').html('');
             $('select[name="sub_category_id"').append('<option value="">..choose..</option>');
           $.each(data,function(value,id){
               $('select[name="sub_category_id"').append('<option value='+id+'>'+value+'</option>');
           })
         }
      })
       });
    });
  </script>

<script>
    $(document).ready(function(){
    var i = 0;
    $("#addMore").click(function () {
        ++i;
        if(i == 1){
            var pxl = '-10px';
        }else{
            var pxl = '0px';
        }
        $("#contactPersons").append(
            `<div class="removeConatct mt-2">
                <div class="row">
                    <div class="col-md-3">
                         <div class="form-group style="margin-left:`+pxl+`;"">
                            <label>Name</label>
                            <input class="form-control" type="text" placeholder="Person Name" name="contact_name[]" >
                        </div> 
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label>email</label>
                            <input class="form-control" type="email" placeholder="Email Id" name="contact_email[]">
                        </div> 
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label>phone</label>
                            <input class="form-control" type="number" placeholder="Phone Number" name="contact_phone[]">
                        </div> 
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label>Profile Image</label>
                            <input class="form-control" type="file" placeholder="Profile Image" name="contact_photo[]">
                        </div> 
                    </div>
                </div>
                <div class="text-end mb-5 ">
                    <span class="btn bg-danger text-white fs-18 remove-conatct-input float-right">- Remove</span>
                </div>
            </div>
            `
        );
    });

    });
     $(document).on('click', '.remove-conatct-input', function () {
        $(this).parents('.removeConatct').remove();
    });
</script>
@endsection