{% extends "header.html.twig" %}


{% block body_content %}
    <div class="box">
        <div class="box-header">
            <h3 class="box-title">User Verification Details</h3>
        </div>

        <!-- /.box-header -->
        <div class="box-body">
            <table id="usertable" class="table table-bordered table-striped">
                <thead>
                {% for user in users %}
                    <tr>
                        <th>Profile Picture</th>
                        <td><img src="{{ base_url }}/uploads/user/profile/image/{{ user.profilepicture }}" height="100"
                                 width="100"></td>
                    </tr>
                    <tr>
                        <th>First name</th>
                        <td>{{ user.firstname }}</td>
                    </tr>
                    <tr>
                        <th>Last name</th>
                        <td>{{ user.lastname }}</td>
                    </tr>
                    <tr>
                        <th>Email</th>
                        <td>{{ user.email }}</td>
                    </tr>
                    <tr>
                        <th>Address 1</th>
                        <td>{{ user.address1 }}</td>
                    </tr>
                    <tr>
                        <th>Address 2</th>
                        <td>{{ user.address2 }}</td>
                    </tr>
                    <tr>
                        <th>City</th>
                        <td>{{ user.city }}</td>
                    </tr>
                    <tr>
                        <th>State</th>
                        <td>{{ user.state }}</td>
                    </tr>
                    <tr>
                        <th>Zipcode</th>
                        <td>{{ user.zipcode }}</td>
                    </tr>
                    <tr>
                        <th>User Type</th>
                        <td>{% if user.usertype == 2 %}Normal{% elseif user.usertype == 3 %}Neighborhood{% elseif user.usertype == 4 %}Professional{% endif %}</td>
                    </tr>
                    <tr>
                        <th>Postal Code</th>
                        <td>{{ user.postcode }}</td>
                    </tr>
                    <tr>
                        <th>Linkedin URL</th>
                        <td>
                            <span id="linkedinurl">{{ user.linkedinurl }}</span>&nbsp;&nbsp;
                            <button class="btn btn-bg  pull-right" onClick="copyToClipboard('linkedinurl')">
                                <i class="fa fa-clone" aria-hidden="true"></i>
                            </button>
                        </td>
                    </tr>
                    <tr>
                        <th>Instagram URL</th>
                        <td>
                            <span id="instagramurl">{{ user.instagramurl }}</span>&nbsp;&nbsp;
                            <button class="btn btn-bg pull-right" onClick="copyToClipboard('instagramurl')">
                                <i class="fa fa-clone" aria-hidden="true"></i>
                            </button>
                        </td>
                    </tr>
                    <tr>
                        <th>Facebook URL</th>
                        <td><span id="facebookurl">{{ user.facebookurl }}</span>&nbsp;&nbsp;
                            <button class="btn btn-bg pull-right" onClick="copyToClipboard('facebookurl')">
                                <i class="fa fa-clone" aria-hidden="true"></i>
                            </button>
                        </td>
                    </tr>
                    <tr>
                        <th>How did you heard about us</th>
                        <td>{{ user.getHowDidYouHear }}</td>
                    </tr>
                    <tr>
                        <th>Promocode</th>
                        <td>{{ user.referralcode }}</td>
                    </tr>
                    {% if user.isboarding == 1 %}
                        <tr>
                            <th>Boarding</th>
                            <td>Yes</td>
                        </tr>
                        <tr>
                            <th>Boarding Price</th>
                            <td>
                                <div class="input-group mb-3">
                                    <input type="number" id="boarding_price" class="form-control"
                                           value="{{ user.boardingprice }}"/>
                                    <div class="input-group-append">
                                        <span class="input-group-text">
                                             <a href="javascript:void(0)" id="boarding_price_update">Update</a>
                                        </span>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    {% endif %}
                    {% if user.issitting == 1 %}
                        <tr>
                            <th>Sitting</th>
                            <td>Yes</td>
                        </tr>
                        <tr>
                            <th>Sitting Price</th>
                            <td>
                                <div class="input-group mb-3">
                                    <input type="hidden" id="user_id" value="{{ user.id }}"/>
                                    <input type="number" id="sitting_price" class="form-control"
                                           value="{{ user.sittingprice }}"/>
                                    <div class="input-group-append">
                                        <span class="input-group-text">
                                             <a href="javascript:void(0)" id="sitting_price_update">Update</a>
                                        </span>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    {% endif %}
                    {% if user.isdogdaycare == 1 %}
                        <tr>
                            <th>Day Care</th>
                            <td>Yes</td>
                        </tr>

                        <tr>
                            <th>Day Care Price</th>
                            <td>
                                <div class="input-group mb-3">
                                    <input type="number" id="daycar_price" class="form-control"
                                           value="{{ user.daycarprice }}"/>
                                    <div class="input-group-append">
                                        <span class="input-group-text">
                                             <a href="javascript:void(0)" id="daycar_price_update">Update</a>
                                        </span>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    {% endif %}
                    {% if user.isdogwalking == 1 %}
                        <tr>
                            <th>Walking</th>
                            <td>Yes</td>
                        </tr>
                        <tr>
                            <th>Walking Price</th>
                            <td>
                                <div class="input-group mb-3">
                                    <input type="number" id="walking_price" class="form-control"
                                           value="{{ user.walkingprice }}"/>
                                    <div class="input-group-append">
                                        <span class="input-group-text">
                                             <a href="javascript:void(0)" id="walking_price_update">Update</a>
                                        </span>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    {% endif %}

                    {% if user.isDogCheckinVisit == 1 %}
                        <tr>
                            <th>Dog Checkin Visit</th>
                            <td>Yes</td>
                        </tr>
                        <tr>
                            <th>Dog Checkin Visit Price</th>
                            <td>
                                <div class="input-group mb-3">
                                    <input type="number" id="dog_checkin_visit_price" class="form-control"
                                           value="{{ user.dogcheckinvisitprice }}"/>
                                    <div class="input-group-append">
                                        <span class="input-group-text">
                                             <a href="javascript:void(0)" id="dog_checkin_visit_price_update">Update</a>
                                        </span>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    {% endif %}

                    {% if user.isCatBoarding == 1 %}
                        <tr>
                            <th>Cat Boarding</th>
                            <td>Yes</td>
                        </tr>
                        <tr>
                            <th>Cat Boarding Price</th>
                            <td>
                                <div class="input-group mb-3">
                                    <input type="number" id="cat_boarding_price" class="form-control"
                                           value="{{ user.catboardingprice }}"/>
                                    <div class="input-group-append">
                                        <span class="input-group-text">
                                             <a href="javascript:void(0)" id="cat_boarding_price_update">Update</a>
                                        </span>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    {% endif %}

                    {% if user.isCatSitting == 1 %}
                        <tr>
                            <th>Cat Sitting</th>
                            <td>Yes</td>
                        </tr>
                        <tr>
                            <th>Cat Sitting Price</th>
                            <td>
                                <div class="input-group mb-3">
                                    <input type="number" id="cat_sitting_price" class="form-control"
                                           value="{{ user.catsittingprice }}"/>
                                    <div class="input-group-append">
                                        <span class="input-group-text">
                                             <a href="javascript:void(0)" id="cat_sitting_price_update">Update</a>
                                        </span>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    {% endif %}

                    {% if user.isCatCheckinVisit == 1 %}
                        <tr>
                            <th>Cat Checkin Visit</th>
                            <td>Yes</td>
                        </tr>
                        <tr>
                            <th>Cat Checkin Visit Price</th>
                            <td>
                                <div class="input-group mb-3">
                                    <input type="number" id="cat_checkin_visit_price" class="form-control"
                                           value="{{ user.catcheckinvisitprice }}"/>
                                    <div class="input-group-append">
                                        <span class="input-group-text">
                                             <a href="javascript:void(0)" id="cat_checkin_visit_price_update">Update</a>
                                        </span>
                                    </div>
                                </div>
                            </td>
                        </tr>
                    {% endif %}

                    {% if user.tshirtsize %}
                        <tr>
                            <th>Tshirt Size</th>
                            <td>{{ user.tshirtsize }}</td>
                        </tr>
                        <tr>
                            <th>Tshirt Delivery Address</th>
                            <td>{{ user.tshirtDeliveryAddress }}</td>
                        </tr>
                    {% endif %}
                    {% if user.isverified != 2 %}
                        <tr>
                            <th>
                                <input type="checkbox" name="terms" class="terms" style="float:right"/>
                            </th>
                            <td>Please confirm evident verification is completed for the user
                                <span class="error-class" style="color:red;"></span>
                            </td>
                        </tr>

                        <tr>
                            <td><a href="{{ url('verify',{id:user.id}) }}"
                                   class="btn btn-success  pull-right">Confirm</a></td>
                            <td><a href="{{ url('declineVerify',{id:user.id}) }}" class="btn btn-danger">Decline</a>
                            </td>
                        </tr>
                    {% endif %}
                {% endfor %}

                </thead>
            </table>
        </div>
        <!-- /.box-body -->
    </div>
{% endblock body_content %}

{% block script_content %}
    <script>
      function copyToClipboard (id) {
        var copyText = document.getElementById(id)
        var textArea = document.createElement('textarea')
        textArea.value = copyText.textContent
        document.body.appendChild(textArea)
        textArea.select()
        document.execCommand('Copy')
        textArea.remove()
      }

      $('.btn-success').bind('click', false)

      $('.btn-success').click(function () {
        $('.error-class').text('')
        if ($('.terms').prop('checked') == true) {
          $('.btn-success').unbind('click', false)
        } else {
          $('.btn-success').bind('click', false)
          $('.error-class').text('Please check before confirm.')
        }
      })

      $('.terms').click(function () {
        if ($(this).prop('checked') == true) {
          $('.btn-success').unbind('click', false)
        } else {
          $('.btn-success').bind('click', false)
        }
      })
      $('#sitting_price_update').click(function () {
        var user_id = $('#user_id').val()
        var price = $('#sitting_price').val()
        window.location.href = '/user/sitting_price_update/' + user_id + '/' + price
      })
      $('#daycar_price_update').click(function () {
        var user_id = $('#user_id').val()
        var daycar_price = $('#daycar_price').val()
        window.location.href = '/user/daycar_price_update/' + user_id + '/' + daycar_price
      })
      $('#walking_price_update').click(function () {
        var user_id = $('#user_id').val()
        var walking_price = $('#walking_price').val()
        window.location.href = '/user/walking_price_update/' + user_id + '/' + walking_price
      })
      $('#boarding_price_update').click(function () {
        var user_id = $('#user_id').val()
        var walking_price = $('#boarding_price').val()
        window.location.href = '/user/boarding_price_update/' + user_id + '/' + walking_price
      })
      $('#cat_boarding_price_update').click(function () {
        var user_id = $('#user_id').val()
        var price = $('#cat_boarding_price').val()
        window.location.href = '/user/cat_boarding_price_update/' + user_id + '/' + price
      })
      $('#cat_sitting_price_update').click(function () {
        var user_id = $('#user_id').val()
        var price = $('#cat_sitting_price').val()
        window.location.href = '/user/cat_sitting_price_update/' + user_id + '/' + price
      })
      $('#cat_checkin_visit_price_update').click(function () {
        var user_id = $('#user_id').val()
        var price = $('#cat_checkin_visit_price').val()
        window.location.href = '/user/cat_checkin_visit_price_update/' + user_id + '/' + price
      })
      $('#dog_checkin_visit_price_update').click(function () {
        var user_id = $('#user_id').val()
        var price = $('#dog_checkin_visit_price').val()
        window.location.href = '/user/dog_checkin_visit_price_update/' + user_id + '/' + price
      })
    </script>
{% endblock script_content %}