@extends('theme.default')
@section('title')
   Payout list
@endsection

@section('canonical')
   <link rel="canonical" href="https://www.surveybakery.com/checklist">
@endsection

@section('content')
   <section class="contact checklsec  pad-btm pad-top ">
      <div class="container">
         <div class="row">
            <div class="col-md-12">
               <div class="constes checjlsi m3-h  wow fadeInUp">
                  <h2>CheckList Progress </h2>
               </div>
            </div>
            <div class="col-md-12">
               <div class="addserbv p10 m3-h  wow fadeInUp">
                  <div class="pasicpx checkpalt m3-h">
                     <ul>
                        <li>
                           <div class="cpshead chepro-para ggarsu">
                              <p>Sign Up</p>
                           </div>
                           <div class="signup">
                              <div class="balnosrsopn icoschek ggarsusa">
                                 <div class="tecp">
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <div class="teclist garstar">
                                       <p>Complete</p>
                                    </div>
                                 </div>
                              </div>
                           </div>
                           <div class="custom-model-main_signup">
                              <div class="custom-model-inner">
                                 <!-- <div class="close-btn">×</div> -->
                                 <div class="custom-model-wrap">
                                    <div class="pop-up-content-wrap">
                                       <div class="bgreico">
                                          <div class="sigms">
                                             <i class="fa-sharp fa-solid fa-star"></i>
                                             <div class="teclist garstar">
                                                <p>Sign Up</p>
                                             </div>
                                          </div>
                                       </div>

                                       <div class="contgram m4-h">
                                          <h2>This Section Has Been Completed</h2>

                                       </div>
                                    </div>
                                 </div>
                              </div>
                              <div class="bg-overlay"></div>
                           </div>
                        </li>
                        <li>
                           <div class="cpshead chepro-para ggarsu">
                              <p>Email Verification</p>
                           </div>
                           <div class="email">
                              <div class="balnosrsopn icoschek ggarsusa">
                                 <div class="tecp">
                                    <i class="fa-regular fa-envelope"></i>
                                    <div class="teclist garstar">
                                       <p>Complete</p>
                                    </div>
                                 </div>
                              </div>
                           </div>

                           <div class="custom-model-main_email">
                              <div class="custom-model-inner">
                                 <!-- <div class="close-btn">×</div> -->
                                 <div class="custom-model-wrap">
                                    <div class="pop-up-content-wrap">
                                       <div class="bgreico">
                                          <div class="sigms">
                                             <i class="fa-regular fa-envelope"></i>
                                             <div class="teclist garstar">
                                                <p>Email Verification</p>
                                             </div>
                                          </div>
                                       </div>

                                       <div class="contgram m4-h">
                                          <h2>This Section Has Been Completed</h2>
                                       </div>
                                    </div>
                                 </div>
                              </div>
                              <div class="bg-overlay"></div>
                           </div>
                        </li>
                        <li>
                           <div class="cpshead chepro-para">
                              <p>SMS Verification</p>
                           </div>
                           <div class="sms">
                              <div class="balnosrsopn icoschek">
                                 <div class="tecp">
                                    <i class="fa-sharp fa-solid fa-phone-volume"></i>
                                    <div class="teclist">
                                       <p>30 Points</p>
                                    </div>
                                 </div>
                              </div>
                           </div>

                           <div class="custom-model-main_sms">
                              <div class="custom-model-inner">
                                 <!-- <div class="close-btn">×</div> -->
                                 <div class="custom-model-wrap">
                                    <div class="pop-up-content-wrap">
                                       <div class="bgreico">
                                          <div class="sigms">
                                             <i class="fa-sharp fa-solid fa-phone-volume"></i>
                                             <div class="teclist garstar">
                                                <p>SMS Verification</p>
                                             </div>
                                          </div>
                                       </div>

                                       <div class="contgram general_data_of_question m4-h">
                                          <h2>Coming Soon</h2>

                                          <!-- <div class="row">
                                             <div class="col-md-4"></div>
                                             <div class="col-md-4 " style="text-align: left;background: #41b8004d;margin-bottom: 5px;border-radius: 9px;padding: 11px 0px 0px 30px;">
                                                <input class="form-check-input" type="checkbox" value="" id="flexCheckDefault">
                                                <label class="form-check-label" for="flexCheckDefault">
                                                   <p style="color:#000;">Urban – Densely populated, city or large town</p>
                                                </label>
                                             </div>
                                             <div class="col-md-4"></div>
                                          </div>


                                          <div class="row">
                                             <div class="col-md-4"></div>
                                             <div class="col-md-4 " style="text-align: left;background: #41b8004d;margin-bottom: 5px;border-radius: 9px;padding: 11px 0px 0px 30px;">
                                                <input class="form-check-input" type="checkbox" value="" id="flexCheckDefault">
                                                <label class="form-check-label" for="flexCheckDefault">
                                                   <p style="color:#000;">Suburban – Mainly residential, bordering a city or large town</p>
                                                </label>
                                             </div>
                                             <div class="col-md-4"></div>
                                          </div>


                                          <div class="row">
                                             <div class="col-md-4"></div>
                                             <div class="col-md-4 " style="text-align: left;background: #41b8004d;margin-bottom: 5px;border-radius: 9px;padding: 11px 0px 0px 30px;">
                                                <input class="form-check-input" type="checkbox" value="" id="flexCheckDefault">
                                                <label class="form-check-label" for="flexCheckDefault">
                                                   <p style="color:#000;">Rural – Sparsely populated, small town or village</p>
                                                </label>
                                             </div>
                                             <div class="col-md-4"></div>
                                          </div>

                                          <div class="brnchck">
                                             <a name="" id="" class="btn-e" href="#" role="button">Continue</a>
                                          </div> -->
                                          <br>
                                       </div>
                                    </div>
                                 </div>
                              </div>
                              <div class="bg-overlay"></div>
                           </div>
                        </li>
                        <li>
                           <div class="cpshead chepro-para">
                              <p>Connected PayPal</p>
                           </div>
                           <div class="connected paypal">
                              <div class="balnosrsopn icoschek">
                                 <div class="tecp">
                                    <i class="fa-duotone fa-dollar-sign"></i>
                                    <div class="teclist">
                                       <p>30 Points</p>
                                    </div>
                                 </div>
                              </div>
                           </div>

                           <div class="custom-model-main_connected">
                              <div class="custom-model-inner">
                                 <!-- <div class="close-btn">×</div> -->
                                 <div class="custom-model-wrap">
                                    <div class="pop-up-content-wrap">
                                       <div class="bgreico">
                                          <div class="sigms">
                                             <i class="fa-duotone fa-dollar-sign"></i>
                                             <div class="teclist garstar">
                                                <p>Connected PayPal</p>
                                             </div>
                                          </div>
                                       </div>
                                       <div class="contgram general_data_of_question m4-h">
                                          <h2>Coming Soon</h2>

                                       </div>
                                    </div>
                                 </div>
                              </div>
                              <div class="bg-overlay"></div>
                           </div>
                        </li>
                        <li>
                           <div class="cpshead chepro-para @if(empty($general_profile)) ggarsu @endif" onclick="">
                              <p>General Profile</p>
                           </div>
                           <div class="general">
                              <div class="balnosrsopn icoschek">
                                 <div class="tecp">
                                    <i class="fa-solid fa-user"></i>
                                    <div class="teclist @if(empty($general_profile))garstar @endif">
                                       <p>   @if(empty($general_profile))Complete @else 30 Points @endif</p>
                                    </div>
                                 </div>
                              </div>
                           </div>
                           <div id="general_" class="custom-model-main_general">
                              <div class="custom-model-inner">
                                 <!-- <div class="close-btn">×</div> -->
                                 <div class="custom-model-wrap">
                                    <div class="pop-up-content-wrap">
                                       <div class="bgreico">
                                          <div class="sigms">
                                             <i class="fa-solid fa-user"></i>
                                             <div class="teclist garstar">
                                                <p>General Profile</p>
                                             </div>
                                          </div>
                                       </div>
                                       <div class="contgram general_data_of_question m4-h">


                                       </div>
                                    </div>
                                 </div>
                              </div>
                              <div class="bg-overlay"></div>
                           </div>
                        </li>



                        <li>
                           <div class="cpshead chepro-para @if(empty($household_profile)) ggarsu @endif">
                              <p>Household Profile</p>
                           </div>
                           <div class="household ">
                              <div class="balnosrsopn icoschek">
                                 <div class="tecp">
                                    <i class="fa-solid fa-house"></i>
                                    <div class="teclist @if(empty($household_profile))garstar @endif">
                                       <p>   @if(empty($household_profile))Complete @else 30 Points @endif</p>
                                    </div>
                                 </div>
                              </div>
                           </div>

                           <div class="custom-model-main_household">
                              <div class="custom-model-inner">
                                 <!-- <div class="close-btn">×</div> -->
                                 <div class="custom-model-wrap">
                                    <div class="pop-up-content-wrap">
                                       <div class="bgreico">
                                          <div class="sigms">
                                             <i class="fa-solid fa-house"></i>
                                             <div class="teclist garstar">
                                                <p>Household Profile</p>
                                             </div>
                                          </div>
                                       </div>

                                       <div class="contgram general_data_of_question m4-h">
                                          {{--  darara --}}
                                       </div>
                                    </div>
                                 </div>
                              </div>
                              <div class="bg-overlay"></div>
                           </div>
                        </li>
                        <li>
                           <div class="cpshead chepro-para @if(empty($roles_profile)) ggarsu @endif">
                              <p>Roles Profile</p>
                           </div>
                           <div class="roles profileRole">
                              <div class="balnosrsopn icoschek">
                                 <div class="tecp">
                                    <i class="fa fa-light fa-briefcase"></i>
                                    <div class="teclist @if(empty($roles_profile))garstar @endif">
                                       <p>   @if(empty($roles_profile))Complete @else 30 Points @endif</p>
                                    </div>
                                 </div>
                              </div>
                           </div>

                           <div class="custom-model-main_roles">
                              <div class="custom-model-inner">
                                 <!-- <div class="close-btn">×</div> -->
                                 <div class="custom-model-wrap">
                                    <div class="pop-up-content-wrap">
                                       <div class="bgreico">
                                          <div class="sigms">
                                             <i class="fa fa-light fa-briefcase"></i>
                                             <div class="teclist garstar">
                                                <p>Roles Profile</p>
                                             </div>
                                          </div>
                                       </div>

                                       <div class="contgram general_data_of_question m4-h">
                                          {{-- fdfdfgdddg --}}
                                       </div>
                                    </div>
                                 </div>
                              </div>
                              <div class="bg-overlay"></div>
                           </div>
                        </li>
                        <li>
                           <div class="cpshead chepro-para @if(empty($hobbies_profile)) ggarsu @endif">
                              <p>Hobbies Profile</p>
                           </div>

                           <div class="hobbies hobies">
                              <div class="balnosrsopn icoschek">
                                 <div class="tecp">
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <div class="teclist @if(empty($hobbies_profile))garstar @endif">
                                       <p>   @if(empty($hobbies_profile))Complete @else 30 Points @endif</p>
                                    </div>
                                 </div>
                              </div>
                           </div>

                           <div class="custom-model-main_hobbies">
                              <div class="custom-model-inner">
                                 <!-- <div class="close-btn">×</div> -->
                                 <div class="custom-model-wrap">
                                    <div class="pop-up-content-wrap">
                                       <div class="bgreico">
                                          <div class="sigms">
                                             <i class="fa-sharp fa-solid fa-star"></i>
                                             <div class="teclist garstar">
                                                <p>Hobbies Profile</p>
                                             </div>
                                          </div>
                                       </div>
                                       <div class="contgram  general_data_of_question m4-h">
                                          {{-- gdhjkzsxdcfvgbhjnmkk, --}}
                                       </div>
                                    </div>
                                 </div>
                              </div>
                              <div class="bg-overlay"></div>
                           </div>
                        </li>
                        <li>
                           <div class="cpshead chepro-para @if(empty($electronic_profile)) ggarsu @endif">
                              <p>Electronic Profile</p>
                           </div>

                           <div class="electronics">
                              <div class="balnosrsopn icoschek">
                                 <div class="tecp">
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <div class="teclist @if(empty($electronic_profile))garstar @endif">
                                       <p>   @if(empty($electronic_profile))Complete @else 30 Points @endif</p>
                                    </div>
                                 </div>
                              </div>
                           </div>

                           <div class="custom-model-main_electronics">
                              <div class="custom-model-inner">
                                 <!-- <div class="close-btn">×</div> -->
                                 <div class="custom-model-wrap">
                                    <div class="pop-up-content-wrap">
                                       <div class="bgreico">
                                          <div class="sigms">
                                             <i class="fa-sharp fa-solid fa-star"></i>
                                             <div class="teclist garstar">
                                                <p>Electronic Profile</p>
                                             </div>
                                          </div>
                                       </div>
                                       <div class="contgram  general_data_of_question m4-h">
                                          {{-- gdhjkzsxdcfvgbhjnmkk, --}}
                                       </div>
                                    </div>
                                 </div>
                              </div>
                              <div class="bg-overlay"></div>
                           </div>
                        </li>
                        <li>
                           <div class="cpshead chepro-para @if(empty($health_profile)) ggarsu @endif">
                              <p>Health Profile</p>
                           </div>

                           <div class="health">
                              <div class="balnosrsopn icoschek">
                                 <div class="tecp">
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <div class="teclist @if(empty($health_profile))garstar @endif">
                                       <p>   @if(empty($health_profile))Complete @else 30 Points @endif</p>
                                    </div>
                                 </div>
                              </div>
                           </div>

                           <div class="custom-model-main_health">
                              <div class="custom-model-inner">
                                 <!-- <div class="close-btn">×</div> -->
                                 <div class="custom-model-wrap">
                                    <div class="pop-up-content-wrap">
                                       <div class="bgreico">
                                          <div class="sigms">
                                             <i class="fa-sharp fa-solid fa-star"></i>
                                             <div class="teclist garstar">
                                                <p>Health Profile</p>
                                             </div>
                                          </div>
                                       </div>
                                       <div class="contgram  general_data_of_question m4-h">
                                          {{-- gdhjkzsxdcfvgbhjnmkk, --}}
                                       </div>
                                    </div>
                                 </div>
                              </div>
                              <div class="bg-overlay"></div>
                           </div>
                        </li>

                        <li>
                           <div class="cpshead chepro-para @if(empty($transport_profile)) ggarsu @endif">
                              <p>Transportation  Profile</p>
                           </div>

                           <div class="transportation">
                              <div class="balnosrsopn icoschek">
                                 <div class="tecp">
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <div class="teclist @if(empty($transport_profile))garstar @endif">
                                       <p>   @if(empty($transport_profile))Complete @else 30 Points @endif</p>
                                    </div>
                                 </div>
                              </div>
                           </div>

                           <div class="custom-model-main_transportation">
                              <div class="custom-model-inner">
                                 <!-- <div class="close-btn">×</div> -->
                                 <div class="custom-model-wrap">
                                    <div class="pop-up-content-wrap">
                                       <div class="bgreico">
                                          <div class="sigms">
                                             <i class="fa-sharp fa-solid fa-star"></i>
                                             <div class="teclist garstar">
                                                <p>Transportation Profile</p>
                                             </div>
                                          </div>
                                       </div>
                                       <div class="contgram  general_data_of_question m4-h">
                                          {{-- gdhjkzsxdcfvgbhjnmkk, --}}
                                       </div>
                                    </div>
                                 </div>
                              </div>
                              <div class="bg-overlay"></div>
                           </div>
                        </li>
                     </ul>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </section>
@endsection

@section('script')
   <script>

      $(".general").on('click', function() {
         get_question('General Profile');
      });
//      $(".paypal").on('click', function() {
//         get_question('Connected PayPal');
//      });
//      $(".sms").on('click', function() {
//         get_question('HSMS Verification');
//      });
      $(".household").on('click', function() {
         get_question('Household Profile');
      });
      $(".profileRole").on('click', function() {
         get_question('Roles Profile');
      });
      $(".hobies").on('click', function() {
         get_question('Hobbies Profile');
      });
      $(".health").on('click', function() {
         get_question('Health Profile');
      });
      $(".electronics").on('click', function() {
         get_question('Electronics Profile');
      });
      $(".transportation").on('click', function() {
         get_question('Transportation Profile');
      });

      function get_question(category)
      {
         $.ajax({
            url: "{{ route('question.getQuestionData') }}",
            method: "GET",
            data:{category:category},
            success: function(response) {
               $('.general_data_of_question').html(response);

            },
            error: function(jqXHR, textStatus, errorThrown) {
               console.log(textStatus, errorThrown);
               // Handle the error here
            }
         });
      }

      $('input[type="radio"]').click(function() {
         if ($(this).is(':checked')) {
            $(this).prop('checked', false);
         } else {
            $(this).prop('checked', true);
         }
      });



   </script>


@endsection