{% include 'header.twig' %}
     
    <main><div class="main_container" id="main_container">
	<div class="content_area">
	  <div class="content">
        <div class="row">
  <div class="col-md-12">
    <div class="card card_v2 mb-5">
      <div class="card-body">
		<h3 style="font-family: " helvetica="" neue",="" helvetica,="" arial,="" sans-serif;="" color:="" rgb(0,="" 0,="" 0);="" text-align:="" center;"=""><br></h3>
      </div>
    </div>
  </div>
</div>

	    <!-- page and other top info -->
	    <div class="page_top_info" id="page_top_info"></div>
   
	    <section id="tickets_page">
		 <style>
		   .modal.fade.in {
			opacity: 1 !important;
		   }
		 </style>
		 <div class="container-fluid">
		   <div class="row">
			<div class="col-md-12">
			  <div class="card card_v2 mb-4">
			    <div class="card-body">
				 <div class="row mb-3">
				   <div class="tickets_flex" style="">
				   <div class="col-md-6">
					<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-favorite-tab"
						   data-toggle="pill"
						   href="#pills-favorite"
						   type="button"
						   role="tab"
						   aria-controls="pills-favorite"
						   aria-selected="false"
						 >
						   <i class="fas fa-history"></i> Tickets
						 </button>
					    </li>
					    <li class="nav-item" role="presentation">
						 <button
						   class="nav-link"
						   id="pills-favorite-tab"
						   data-toggle="modal"
						   data-target="#exampleModal"
						 >
						   <i class="fas fa-ticket-alt"></i>
						   New Ticket
						 </button>
					    </li>
					  </ul>
					</div>
				   </div>
				 
				   <div class="col-md-6">
					   <form action="" method="get" id="history-search">
						   <div class="input-group">
							 <input type="text" class="form-control" value="" name="search" placeholder="Search tickets">
							 <span class="input-group-btn">
							    <button type="submit" class="btn btn-default"><i class="fas fa-search" aria-hidden="true"></i></button>
							 </span>
						   </div>
						 </form>
				   </div>
				 </div>
			    </div>  
					  <div class="row">
				   <div class="col-md-12">
				   <div class="tab">
					   <div class="tabe" style="overflow: auto;">
						   <table class="table">
							   <thead>
								   <tr>
									   <th width="5%">ID</th>
									   <th>Subject</th>
									   <th width="13%">Status</th>
									   <th width="30%">Last update</th>
								   </tr>
							   </thead>
							   <tbody>
							       {% for ticket in ticketList %}
								   <tr >
    <td>{{ ticket['ticket_id'] }}</td>
    {% if ticket["support_new"] == 2 %}
    <td class=""><a href="tickets/{{ ticket['ticket_id'] }}"><strong>{{ ticket['subject'] }}</strong></a></td>
    {% else %}
    <td><a href="tickets/{{ ticket['ticket_id'] }}">{{ ticket['subject'] }}</a></td>
                  {% endif %}
    <td>{{ticket['status']}}</td>
    <td>{{ ticket['lastupdate_time'] }}</td>
</tr>

{% endfor %}
							   </tbody>
						   </table>
					   </div>
				   </div>
				   </div>
				 </div>
			    </div>
			  </div>
			</div>
		   </div>
		 </div>
		  <!-- Modal -->
		 <div
		   class="modal fade"
		   id="exampleModal"
		   data-backdrop="static"
		   data-keyboard="false"
		   tabindex="-1"
		   aria-labelledby="staticBackdropLabel"
		   aria-hidden="true"
		 >
		   <div class="modal-dialog">
			<div class="modal-content">
			  <div class="modal-header">
			    <h5 class="modal-title" id="exampleModalLabel">New Ticket</h5>
			    <div class="text-capitalize">
				   <!--  -->
			    </div>
			    <button
				 type="button"
				 class="close"
				 data-dismiss="modal"
				 aria-label="Close"
			    >
				 <span aria-hidden="true">&times;</span>
			    </button>
			  </div>
			  <div class="modal-body">
			   <div id="main-page" class="well well-float table-responsive"> 
					    
					    
					    
							        {% 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 %}
      

                      	<form method="post" action="" id="ticketsend"class="">
                      	        
                          <div class="alert alert-dismissible alert-danger ticket-danger " style="display: none">
                            <button type="button" class="close">&times;</button>
                            <div></div>
                          </div>
								       
									<div class="form-group subject-panel">
									  <label for="select_subject" class="form-label">Subject</label>
<select  type="text" class="form-control" id="subject" name="subject">
                                  {% 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</label>    
                             <textarea class="form-control" rows="4" cols="50" id="message" name="message" style="min-height: 100px; display: block;">{{ data['message'] }}</textarea>
								   </div>
                             <button type="submit" class="btn btn-primary d-blc w-100" id="sendTicket">Submit ticket</button>
                          </span>
                        </form>

                    </div>
                
                 

                 </div>
              </div>
           </div>
        </div>
        
    
							
							
							
							
							
							
							
						  							  </div>
						   </div>
						</div>
					 </div>
				</div>
			 </div>
         </div>
      </main>              
                                               
                                               
                                               
                                               
                                               
                                               
                                               
                                               
                                               
                                               
                                               
                                               
              
{% include 'footer.twig' %}