@extends('layouts.app')
@section('head')
    @include('components.meta')
@endsection
@section('content')
@include('components.breadcrumbs')
<div class="container">
    @if ($errors->any())
        <div class="alert alert-danger flex green-btn space-between">
          <ul>
            @foreach ($errors->all() as $error)
            <li>{{ $error }}</li>
            @endforeach
          </ul>
        </div>
    @endif
    @if (Session::has('success'))
        <br>
        <div class="alert alert-success flex green-btn space-between" >
          <p>{{ Session::get('success') }}</p>
        </div>
    @endif
</div>

<div class="container inner-page faq">
    <div class="programme flex flex-row flex-wrap">
        {{-- <div class="left bg-white" >
            <div class="hour">
                <div class="flex flex-row flex-wrap space-between align-center clickable " onclick="openPlan(this)">
                    <span class="name">Как стать абонентом</span>
                    <span class="right-arrow"></span>
                </div>
                <div class="flex-row flex-wrap description ">
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                </div>
            </div>
            <div class="hour">
                <div class="flex flex-row flex-wrap space-between align-center clickable " onclick="openPlan(this)">
                    <span class="name">Личный кабинет</span>
                    <span class="right-arrow"></span>
                </div>
                <div class="flex-row flex-wrap description ">
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                </div>
            </div>
            <div class="hour">
                <div class="flex flex-row flex-wrap space-between align-center clickable " onclick="openPlan(this)">
                    <span class="name">Настройка ТВ</span>
                    <span class="right-arrow"></span>
                </div>
                <div class="flex-row flex-wrap description ">
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                </div>
            </div>
            <div class="hour">
                <div class="flex flex-row flex-wrap space-between align-center clickable " onclick="openPlan(this)">
                    <span class="name">Название категории</span>
                    <span class="right-arrow"></span>
                </div>
                <div class="flex-row flex-wrap description ">
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                </div>
            </div>
            <div class="hour">
                <div class="flex flex-row flex-wrap space-between align-center clickable " onclick="openPlan(this)">
                    <span class="name">Название категории</span>
                    <span class="right-arrow"></span>
                </div>
                <div class="flex-row flex-wrap description ">
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                    <a href="">Как восстановить забытый пароль</a>
                </div>
            </div>
        </div> --}}
        <div class="right" style="width: 100%; padding: 0;">
            <h2 class="text-uppercase page-title">{{$title}}</h2>
            {{-- @if (Session::has('success'))
                <p id="evaluate-form"></p>
                <div class="container" >
                    <br>
                    <div class="alert alert-success flex green-btn space-between" >
                      <p>{{ Session::get('success') }}</p>
                    </div>
                    <br>
                </div>
            @endif --}}
            <div class=" bg-white evaluate faqs-form @if (Session::has('success')) display-hidden @endif">
                <p>{{$survey->getQuestion()}}</p>
                <form action="{{ route('survey-answer',app()->getLocale()) }}" method="post">
                   @csrf
                    <input type="hidden" name="question" value="{{$survey->getQuestion()}}">
                    <p>
                        <input type="radio" name="answer" value='{{$survey->getAnswerA()}}' id="getAnswerA" required> <label for="getAnswerA" >{{$survey->getAnswerA()}}</label>
                    </p>
                    <p>
                        <input type="radio" name="answer" value='{{$survey->getAnswerB()}}' id="getAnswerB"><label for="getAnswerB"> {{$survey->getAnswerB()}}  </label>
                    </p>
                    <p>
                        <input type="radio" name="answer" value='{{$survey->getAnswerC()}}' id="getAnswerC"><label for="getAnswerC"> {{$survey->getAnswerC()}} </label>
                    </p>
                    <input class="green-btn" type="submit" value="{{__('site.send')}}">
                </form>
            </div>
            @foreach ($faqs as $f)
                <div class="hour">
                    <h4>{{$f->getQuestionAttribute()}}</h4>
                    <p>{{$f->getAnswerAttribute()}} </p>
                    <a href="{{ route('faq',['language'=>app()->getLocale(),'link'=>$f->id]) }}">{{__('site.read_more')}}</a>
                </div>
            @endforeach
            <br>
            <br>


            <form class="question bg-white @if (Session::has('success'))  display-hidden @endif" action="{{ route('ask-faq', app()->getLocale()) }}" method='post'>
                @csrf
                <h3>{{__('site.ask_question')}}</h3>
                <br>
                <p class="red">{{__('site.name')}}*</p>
                <input type="text" placeholder="{{__('site.write_name')}}" name="name" required="">
                <br>
                <div class="flex flex-row">
                    <div class="col-6">
                        <p class="red">
                            {{__('site.phone_number')}}*
                        </p>
                        <input type="text" placeholder="+998" name="phone" required>
                    </div>
                    <div class="col-6">
                        <p>
                            e-mail
                        </p>
                        <input type="text" placeholder="{{__('site.write_email')}}" name="email">
                    </div>
                </div>
                <p class="red">{{__('site.your_question')}}*</p>
                <textarea name="question" placeholder="{{__('site.your_question')}}" required></textarea>
                <input class="green-btn" type="submit" value="{{__('site.send_question')}}">
            </form>

        </div>
    </div>
</div>
@endsection
@section('foot')
    <script>
        function openPlan(ele){
            if($(ele).children('span.right-arrow').hasClass('active')){
                $(".hour").removeClass("active");
                $(".right-arrow").removeClass("active");
            }else{
                $(".hour").removeClass("active");
                $(".right-arrow").removeClass("active");
                $(ele).parent().addClass("active");
                $(ele).children('span.right-arrow').addClass("active");
            }
        }
    </script>
@endsection