{% include 'header.twig' %}



           <!-- // page and other top info -->
                    <section id="tickets_page">
  <div class="container-fluid">
     <div class="row">
        <div class="col-md-12">
           <div class="card card_v2 mb-4">
              <div class="card-body">
                 <form action="/tickets" method="get" id="history-search">
                    <div class="input-group">
                       <input type="text" name="search" class="form-control" value=""
                          placeholder="Search">
                       <span class="input-group-btn">
                       <button type="submit" class="btn btn-default"><i class="fa fa-search" aria-hidden="true"></i></button>
                       </span>
                    </div>
                 </form>
              </div>
           </div>
        </div>
     </div>
     <div class="row">
        <div class="col-md-6">
           <div class="card card_v2">
              <div class="card-body">
                 <div  id="newOrderTabsWrap">
                    <ul class="nav nav-pills tab_btn_wrap mb-3" id="pills-tab" role="tablist">
                       <li class="nav-item" role="presentation">
                          <button class="nav-link active" id="pills-order-tab" data-bs-toggle="pill" data-bs-target="#pills-order" type="button" role="tab" aria-controls="pills-order" aria-selected="true"> <i class="fas fa-ticket-alt"></i> New Ticket</button>
                       </li>
                       <li class="nav-item" role="presentation">
                          <button class="nav-link" id="pills-favorite-tab" data-bs-toggle="pill" data-bs-target="#pills-favorite" type="button" role="tab" aria-controls="pills-favorite" aria-selected="false"> <i class="fas fa-history"></i>
                          Ticket History </button>
                       </li>
                    </ul>
                 </div>
                 
                    {% if error %}
        <div class="alert alert-dismissible alert-danger {% if site['rtl'] %} rtl-alert {% endif %}">
          <button type="button" class="close" data-dismiss="alert">×</button>
          {{ errorText }}
        </div>
      {% elseif success %}
        <div class="alert alert-dismissible alert-success {% if site['rtl'] %} rtl-alert {% endif %}">
          <button type="button" class="close" data-dismiss="alert">×</button>
          {{ successText }}
        </div>
      {% endif %}
                 
                 <div class="tab-content tab_wrap" id="pills-tabContent">
                    <div class="tab-pane fade show active" id="pills-order" role="tabpanel" aria-labelledby="pills-order-tab">
                       <form method="post" action="" id="ticketsend">   
                          <div class="alert alert-dismissible alert-danger ticket-danger " style="display: none">
                            <button type="button" class="close">&times;</button>
                            <div></div>
                          </div>
                          <div class="siginInRow form-group">
                            <label class="control-label">Subject</label>
                            <select class="form-control" id="subject" name="subject" onchange="handleOrderType(this)">
                                                           {% for subjects in orders %}
                   <option value"{{ subjects['subject'] }}">{{ subjects['subject'] }}</option>
                  {% endfor %}
                              </select>
                          </div>
                        
                            
                             <div class="siginInRow form-group ticket-textarea" >
                              <label class="control-label">Message<span id="optional"> (optional) </span></label>    
                              <textarea rows="7" id="message" name="message"  style="min-height: 100px;" class="form-control">{{ data['message'] }}</textarea>
                            </div>    
                           
                          
                            <button type="submit" class="btn btn-primary d-blc w-100" id="sendTicket">Submit ticket</button>
                          </span>
                        </form>



                    </div>
                
    
    
                    <div class="tab-pane fade" id="pills-favorite" role="tabpanel" aria-labelledby="pills-favorite-tab">
                      
                      <div class="btn-group w-100 gap-2" role="group" id="ticket_filter_wrap">
                         <button type="button" class="btn btn-secondary ticket_btn_active" id="ticket_all" onclick="showAll()">All</button>
                         <button type="button" class="btn btn-secondary" id="ticket_pending" onclick="showPending()">Pending</button>
                         <button type="button" class="btn btn-secondary" id="ticket_answered" onclick="showAns()">Answered</button>
                       </div>
                    
                      
                                            <!-- ticket item Edited -->
                                             {% for ticket in ticketList %}
                                            
                      <a href="tickets/{{ ticket['ticket_id'] }}" class="ticket_link ticket_status_Closed" >
                         <div class="ticket_item ticket_Closed">
                            <div class="item_left text-start">
                                <div class="ticket_icon">
                                    <i class="fas fa-ticket-alt"></i>
                                </div>
                                <div>
                                  <h3>{{ ticket['subject'] }}</h3>
                                  <p>{{ ticket['status'] }}</p>
                                </div>
                            </div>
                            <div class="item_right text-end">
                                <p>#{{ ticket['ticket_id'] }}</p>
                                <p>{{ ticket['lastupdate_time'] }}</p>
                            </div>
                        </div>
                      </a>
                      {% endfor %}
                      <!-- ## ticket item Edited -->
                                                                  

                                              

                   
                    </div>

                 </div>
              </div>
           </div>
        </div>
        <div class="col-md-6">
           <div class="card card_v2">
              <div class="card-body">
                 <div id="def_side_title">
                    <div class="icon">
                       <i class="fas fa-question"></i>
                    </div>
                    <div class="name">
                       Read Before Create Tickets.
                    </div>
                 </div>
              </div>
           </div>
        </div>
     </div>
  </div>
</section>

{% include 'footer.twig' %}
