@extends('layouts.admin.master')
@section('content')
<div class="container-xxl flex-grow-1 container-p-y">
    @include('common.messages')
    @include('common.errors')
    <!-- Hoverable Table rows -->
    <div class="card">
        <div class="row">
            <div class="col-md-9">                                    
                <h5 class="card-header">{{ $monitor->monitor_number.' - '.$monitor->inbuild_location.' '.$monitor->build_location}}</h5>            
            </div>
            <div class="col-md-3" style="margin-top:20px;">                                    
                <a href="{{ URL::previous() }}" class="btn btn-dark pull-right"><i class="bx bx-left-arrow"></i> Back</a>
            </div>
            <div class="container">
                <div class="row">
                    @if(!empty($rating))
                        @foreach($servey_data['question_data'] as $key=>$q)
                        <div class="card mb-5">
                            <ul class="list-group list-group-flush">
                                <li class="list-group-item"><b>Question {{$key+1}} : </b>{{ $q['question'] }}</li>
                                @if(!empty($q['rating']))
                                    <li class="list-group-item w-50"><b>Rating : </b> 
                                    @if($q['question_type']==6) 
                                        {{ ($q['rating']==1) ? 'Yes' : 'No' }}
                                    @else
                                    {{$q['rating']}}
                                    @endif

                                    @if($q['question_type']==1)
                                        @if($q['icon_type']==1)
                                            @if($q['rating']==1)
                                            <label class="form-check-label" for="Radio1"><img class="w-25" src="{{ asset('admin/images/emojis/smile1-4.png') }}" class="emojis-part" /></label>
                                            @elseif($q['rating']==2)
                                            <label class="form-check-label" for="Radio1"><img class="w-25" src="{{ asset('admin/images/emojis/smile1-3.png') }}" class="emojis-part" /></label>
                                            @elseif($q['rating']==3)
                                            <label class="form-check-label" for="Radio1"><img class="w-25" src="{{ asset('admin/images/emojis/smile1-2.png') }}" class="emojis-part" /></label>
                                            @elseif($q['rating']==4)
                                            <label class="form-check-label" for="Radio1"><img class="w-25" src="{{ asset('admin/images/emojis/smile1-1.png') }}" class="emojis-part" /></label>
                                            @endif
                                        @elseif($q['icon_type']==2)
                                            @if($q['rating']==1)
                                            <label class="form-check-label" for="Radio1"><img class="w-25" src="{{ asset('admin/images/emojis/smile2-4.png') }}" class="emojis-part" /></label>
                                            @elseif($q['rating']==2)
                                            <label class="form-check-label" for="Radio1"><img class="w-25" src="{{ asset('admin/images/emojis/smile2-3.png') }}" class="emojis-part" /></label>
                                            @elseif($q['rating']==3)
                                            <label class="form-check-label" for="Radio1"><img class="w-25" src="{{ asset('admin/images/emojis/smile2-2.png') }}" class="emojis-part" /></label>
                                            @elseif($q['rating']==4)
                                            <label class="form-check-label" for="Radio1"><img class="w-25" src="{{ asset('admin/images/emojis/smile2-1.png') }}" class="emojis-part" /></label>
                                            @endif
                                        @elseif($q['icon_type']==3)
                                            @if($q['rating']==1)
                                            <label class="form-check-label" for="Radio1"><img class="w-25" src="{{ asset('admin/images/emojis/smile3-1.gif') }}" class="emojis-part" /></label>
                                            @elseif($q['rating']==2)
                                            <label class="form-check-label" for="Radio1"><img class="w-25" src="{{ asset('admin/images/emojis/smile3-2.gif') }}" class="emojis-part" /></label>
                                            @elseif($q['rating']==3)
                                            <label class="form-check-label" for="Radio1"><img class="w-25" src="{{ asset('admin/images/emojis/smile3-3.gif') }}" class="emojis-part" /></label>
                                            @elseif($q['rating']==4)
                                            <label class="form-check-label" for="Radio1"><img class="w-25" src="{{ asset('admin/images/emojis/smile3-4.gif') }}" class="emojis-part" /></label>
                                            @endif
                                        @endif
                                    @elseif($q['question_type']==2)
                                        <div class="form-check w-25">
                                            @for($i=1;$i<=$q['rating'];$i++)
                                            <span class="reset-rating rating-{{$i}}" data-rating="{{$i}}">
                                            @if($q['icon_type']==1)
                                                <img class="w-25" src="{{ asset('admin/images/cup_un_select.png') }}" class="rating-img-part" /> 
                                            @elseif($q['icon_type']==2)
                                                <img class="w-25" src="{{ asset('admin/images/thumb_unselect.png') }}" class="rating-img-part" />  
                                            @elseif($q['icon_type']==3)
                                                <img class="w-25" src="{{ asset('admin/images/ic_star_unselected.png') }}" class="rating-img-part" /> 
                                            @elseif($q['icon_type']==4)
                                                <img class="w-25" src="{{ asset('admin/images/tick_unselected.png') }}" class="rating-img-part" />  
                                            @endif
                                            </span>
                                            @endfor
                                        </div>
                                    @elseif($q['question_type']==4)
                                        @if($q['icon_type']==1)
                                        <div class="form-check rectangular-without-space-part w-25">
                                            @for($i=1;$i<=$q['rating'];$i++)
                                            <span class="reset-rating rating-{{$i}} w-25" data-rating="{{$i}}" style="font-size:20px;">{{$i}}</span>
                                            @endfor
                                        </div>
                                        @elseif($q['icon_type']==2)
                                        <div class="form-check rectangular-without-space-part w-25">
                                            @for($i=1;$i<=$q['rating'];$i++)
                                                <span class="reset-rating rating-{{$i}} w-25" data-rating="{{$i}}" style="font-size:20px;">{{$i}}</span>
                                            @endfor
                                        </div>
                                        @elseif($q['icon_type']==3)
                                        <div class="form-check rectangular-space w-25">
                                            @for($i=1;$i<=$q['rating'];$i++)
                                                <span class="reset-rating rating-{{$i}} w-25" data-rating="{{$i}}" style="font-size:20px;">{{$i}}</span>
                                            @endfor
                                        </div>
                                        @elseif($q['icon_type']==4)
                                        <div class="form-check rectangular-space w-25">
                                            @for($i=1;$i<=$q['rating'];$i++)
                                                <span class="w-25 reset-rating rating-{{$i}}" data-rating="{{$i}}" style="font-size:20px;">{{$i}}</span>
                                            @endfor
                                        </div>
                                        @elseif($q['icon_type']==5)
                                        <div class="form-check ronded-space-part w-25">
                                            @for($i=1;$i<=$q['rating'];$i++)
                                                <span class="w-25 reset-rating rating-{{$i}}" data-rating="{{$i}}" style="font-size:20px;">{{$i}}</span>
                                            @endfor
                                        </div>
                                        @elseif($q['icon_type']==6)
                                        <div class="form-check ronded-space-part w-25">
                                            @for($i=1;$i<=$q['rating'];$i++)
                                                <span class="w-25 reset-rating rating-{{$i}}" data-rating="{{$i}}" style="font-size:20px;">{{$i}}</span>
                                            @endfor
                                        </div>
                                        @endif
                                    @endif
                                </li> 
                                @endif
                                @if($q['question_type']==1 || $q['question_type']==2 || $q['question_type']==4)
                                    
                                    @if(!empty($q['feedback_question_values'])) <li class="list-group-item"><b>Rating Text : </b> {{  implode(',',$q['feedback_question_values']) }}</li> @endif

                                @elseif($q['question_type']==3)
                                
                                @if(!empty($q['options_value']))
                                <li class="list-group-item">
                                    <b>Rating Text</b> 
                                    @foreach($q['options_value'] as $o)
                                        <img src="{{ url($o) }}" width="50"/>
                                    @endforeach
                                </li>
                                @endif
                                

                                @elseif($q['question_type']==5 || $q['question_type']==8)
                                <li class="list-group-item">
                                    <b>Rating Text : </b> {{  implode(',',$q['options_value']) }}
                                </li> 
                                @elseif($q['question_type']==4)
                                @elseif($q['question_type']==9)
                                @if(!empty($q['sub_questions']))
                                <li class="list-group-item">
                                    @foreach($q['sub_questions'] as $sub)
                                        <p><b>{{$sub['sub_question']}} </b> : {{$sub['options_value']}}</p>
                                    @endforeach
                                </li> 
                                @endif
                                @else
                                
                                @endif
                            </ul>
                        </div>
                        @endforeach

                        @if($rating->customer_details)
                        <div class="card mb-5">
                            <h5 class="mb-2">Customer Details</h5><hr/>
                            <ul class="list-group list-group-flush">
                                <li class="list-group-item"><b> Name : {{$rating->customer_details->name}}</b></li>
                                <li class="list-group-item"><b> Email : {{$rating->customer_details->email}}</b></li>
                                <li class="list-group-item"><b> Phone no : {{$rating->customer_details->phone_no}}</b></li>
                            </ul>
                        </div>
                        @endif

                    @endif

                    <!-- <div class="scale-ration-option-setup">
                      <div class="star-rating">
                        <input type="radio" id="5-stars" name="rating" value="5" />
                        <label for="5-stars" class="star last-rate-set">5</label>
                        <input type="radio" id="4-stars" name="rating" value="4" />
                        <label for="4-stars" class="star">4</label>
                        <input type="radio" id="3-stars" name="rating" value="3" />
                        <label for="3-stars" class="star">3</label>
                        <input type="radio" id="2-stars" name="rating" value="2" />
                        <label for="2-stars" class="star">2</label>
                        <input type="radio" id="1-star" name="rating" value="1" />
                        <label for="1-star" class="star first-rate-set">1</label>
                      </div>
                      <div class="star-rating2 star-scale-rate-second">
                        <input type="radio" id="10-stars" name="rating" value="10" />
                        <label for="10-stars" class="star last-rate-set">10</label>
                        <input type="radio" id="9-stars" name="rating" value="9" />
                        <label for="9-stars" class="star">9</label>
                        <input type="radio" id="8-stars" name="rating" value="8" />
                        <label for="8-stars" class="star">8</label>
                        <input type="radio" id="7-stars" name="rating" value="7" />
                        <label for="7-stars" class="star">7</label>
                        <input type="radio" id="6-stars" name="rating" value="6" />
                        <label for="6-stars" class="star">6</label>
                        <input type="radio" id="5-stars" name="rating" value="5" />
                        <label for="5-stars" class="star">5</label>
                        <input type="radio" id="4-stars" name="rating" value="4" />
                        <label for="4-stars" class="star">4</label>
                        <input type="radio" id="3-stars" name="rating" value="3" />
                        <label for="3-stars" class="star">3</label>
                        <input type="radio" id="2-stars" name="rating" value="2" />
                        <label for="2-stars" class="star">2</label>
                        <input type="radio" id="1-star" name="rating" value="1" />
                        <label for="1-star" class="star first-rate-set">1</label>
                      </div>
                    </div> -->

                    
                </div>

                <div class="row">
                    <div class="col-md-3 mb-5" style="margin-top:20px;">                                    
                        <a href="{{URL::previous()}}" class="btn btn-dark"><i class="bx bx-left-arrow"></i> Back</a>
                    </div>
                </div>

            </div>
            
        </div>
    </div>
</div>  
@endsection