@extends('layouts.app')
@php $categories = get_categories(['type'=>'category']) @endphp
@php $category_ids = array_column(change_object_to_array($categories) , 'id' )  @endphp
@php $male_theme_color = get_dropdown_data(['type'=>'kids-theme-color','name'=>'Kids male theme color'],'single') @endphp
@php $female_theme_color = get_dropdown_data(['type'=>'kids-theme-color','name'=>'Kids female theme color'],'single') @endphp
@php 
	$male_color = json_decode($male_theme_color->data);
	$female_color = json_decode($female_theme_color->data);
@endphp
@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-xl-12">
            <div class="card">
                <div class="card-body">
                    <h4 class="card-title">Add {{ $name }}</h4>
                    <p class="card-title-desc"></p>

                    <form class="needs-validation" novalidate action="{{ route('save.dropdowns') }}" method="POST">
                    	
                    	<div class="hidden-fields">
                    		@csrf
                    		<input type="hidden" name="type" value="{{ $type }}">
                    		<input type="hidden" name="id[0]" value="{{$male_theme_color->id}}">
                    		<input type="hidden" name="name[0]" value="Kids male theme color">
                    	</div>
                    	<div class="row alignCenter">
                    		<label>Male</label>
                    		<div class="col-md-3 add-content noMargin">
	                            <div class="form-group">
	                            	<input type="color" class="form-control" name="data[0][male][background]" value="{{$male_color->male->background}}">
	                                <span class="invalid-feedback" role="alert">
	                                    <strong>{{ $name }} is required</strong>
	                                </span>
	                            </div>                    			
                    		</div>	
                    		<div class="col-md-3 add-content noMargin">
	                            <div class="form-group">
	                            	<input type="color" class="form-control" name="data[0][male][card]" value="{{$male_color->male->card}}">
	                                <span class="invalid-feedback" role="alert">
	                                    <strong>{{ $name }} is required</strong>
	                                </span>
	                            </div>                    			
                    		</div>	
                    	</div>
                    	<div class="row alignCenter">
                    		<input type="hidden" name="id[1]" value="{{$female_theme_color->id}}">
                    		<input type="hidden" name="name[1]" value="Kids female theme color">
                    		<label>Female</label>
                    		<div class="col-md-3 add-content noMargin">
	                            <div class="form-group">
	                            	<input type="color" class="form-control" name="data[1][female][background]" value="{{$female_color->female->background}}">
	                                <span class="invalid-feedback" role="alert">
	                                    <strong>{{ $name }} is required</strong>
	                                </span>
	                            </div>                    			
                    		</div>	
                    		<div class="col-md-3 add-content noMargin">
	                            <div class="form-group">
	                            	<input type="color" class="form-control" name="data[1][female][card]" value="{{$female_color->female->background}}">
	                                <span class="invalid-feedback" role="alert">
	                                    <strong>{{ $name }} is required</strong>
	                                </span>
	                            </div>                    			
                    		</div>	
                    	</div>
                		<div class="col-md-4">
                			<button type="submit" class="btn btn-primary waves-effect waves-light custombtn">Submit</button>
                            <button type="reset" class="btn btn-secondary waves-effect">Cancel</button>
                		</div>                    	
						
						@if (session('success'))
						    <div class="alert alert-success">{{ session('success') }}</div>
						@elseif (session('error'))   
							<div class="alert alert-danger">{{ session('error') }}</div>
						@endif
                    </form>

                    <div class="row mgt10">

				        <div class="col-md-12">
				            @if (session('delete_success'))
				                <div class="alert alert-success">{{ session('delete_success') }}</div>
				            @elseif (session('delete_error'))   
				                <div class="alert alert-danger">{{ session('delete_error') }}</div>
				            @endif        
				        </div>   
				                            	
			            <table class="datatable table table-bordered dt-responsive nowrap w-100">
			                <thead>
			                    <tr>
			                        <th>ID</th>
			                        <th>Name</th>
			                        <th>Color</th>
			                        <th>Action</th>
			                    </tr>
			                </thead>

			                <tbody>
			                    @if( $list )
			                        @foreach( $list as $index => $values )
			                            <tr>
			                                <td>{{ $values->id }}</td>
			                                <td>
			                                	{{ $values->name }}
			                                </td>
			                                <td>
			                                	@php
			                                	 $theme_color = (array) json_decode($values->data) 
			                                	@endphp 
			                                	 	
			                                	@foreach($theme_color as $i=>$c)
		                                	 	  Card <i style="padding: 3px 15px 3px 10px;background: {{ $c->card }};"></i>
		                                	 	  &nbsp;
		                                	 	  Background <i style="padding: 3px 15px 3px 10px;background: {{ $c->background }};"></i>
			                                	@endforeach			                                	
			                                </td>
											<td>
			                                   {{ get_edit_button( url('dropdowns/edit/'.$type.'/'.$values->id),$values->id,'black text-primary' , 'Edit') }}
			                                   {{ get_delete_button(url('dropdowns/delete/'.$type.'/'.$values->id),$values->id,'black text-danger deleteRecord','Delete')}}
			                                </td>			                                
			                            </tr>
			                        @endforeach
			                    @endif
			                    </tbody>
			            </table>                    	
                    </div>	

                </div>
            </div>
        </div> <!-- end col -->
    </div> 
</div>
@endsection