<div class="row">
	<div class="col-md-12">
		<div class="panel panel-inverse" data-sortable-id="form-stuff-3">
             <div class="panel-heading">
                 <h4 class="panel-title">Query</h4>
             </div>
             <div class="panel-body">
                 <fieldset>
                    <div class="form-group col-md-12">
                        <label for="Events_collections">Enter your Query: </label>
                      <!--  <select class="event_lists form-control" ng-model="explore.event" ng-change="getEventSchema();">
                            <option ng-repeat="event in eventList" ng-value="event.event">{{event.event}}</option>
                        </select> -->
												<textarea name="queryarea" rows="4" cols="80" class="form-control" id="queryarea" ng-model="explore.query"></textarea>
												<div class="row">
													<button type="submit" class="btn btn-sm btn-primary m-r-5 margin-top" ng-click="execute();">{{action}}</button>
													<button type="button" name="checkTable" data-toggle="modal" data-target="#tableModal" class="btn btn-sm btn-primary m-r-5 margin-top pull-right">Available Tables</button>
												</div>
												<div class="modal fade" id="tableModal" role="dialog">
													<div class="modal-dialog" style="width:80%;">
														<div class="modal-content">
															<div class="modal-header">
																<button type="button" name="closeButtonHeader" class="close" data-dismiss="modal">&times;</button>
																<h4 class="modal-title">Table</h4>
															</div>
															<div class="modal-body" style="height:300px; overflow-y:auto;">
																<div class="table-responsive">
																	<table class="table table-bordered">
																		<thead>
																			<tr>
																				<th>S.No</th>
																				<th>Table Name</th>
																				<th></th>
																			</tr>
																		</thead>
																		<tbody>
																			<tr ng-repeat="table in tables" style="width:5%">
																				<td>{{$index+1}}</td>
																				<td>{{table.table_name}}</td>
																				<td>
																						<table class="table table-bordered columns" id="{{table.table_name}}" style="overflow-wrap:break-word;width:500px; display:none;">
																						<thead>
																							<tr>
																								<th>Column Name</th>
																							</tr>
																						</thead>
																						<tbody>
																							<tr ng-repeat="column in eventSchema" style="width:5%">
																								<td>{{column.column_name}}</td>
																							</tr>
																						</tbody>
																					</table>
																					<button class="btn btn-primary {{table.table_name}}" ng-click="getEventSchema(table.table_name); manageEvent(table.table_name);">Show Column</button></td>
																			</tr>
																		</tbody>
																	</table>
																</div>
															</div>
															<div class="modal-footer">
																<button type="button" name="closeButtonFooter" class="btn btn-primary" ng-click="closeModel();" data-dismiss="modal">Close</button>
															</div>
														</div>
													</div>
												</div>

									  </div>
                  <!--  <div class="form-group col-md-12" ng-if="eventSchema.length > 0">
                        <div>
                            <label for="Events_collections">Select Columns *</label>
                        </div>
                        <div class="clearfix"></div>
                        <span ng-repeat="schema in eventSchema track by $index">
                            <input
                                type="checkbox"
                                name="selectedSchema[]"
                                value="{{schema.name}}"
                                ng-model="schema.selected"
                                ng-clicked="columnAction($index)"
                              >
                            {{schema.name}}&nbsp;&nbsp;&nbsp;
                        </span>
                    </div> -->
                <!--   <div class="form-group col-md-12">
                        <div>
                             <label for="exampleInputEmail1">Timeframe *</label>
                        </div>
                        <div class="clearfix"></div>
                        <div class="col-md-6" style="padding-left: 0px!important;">
                            <div class="input-group date" id="start_date" data-date-format="dd-mm-yyyy">
                                <input type="text" class="form-control" placeholder="Select Date" ng-model="explore.startDate">
                                <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="input-group date" id="end_date" data-date-format="dd-mm-yyyy">
                                <input type="text" class="form-control" placeholder="End Date" ng-model="explore.endDate">
                                <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                            </div>
                        </div>

                    </div> -->
                 </fieldset>
             </div>
         </div>
		<div class="panel panel-inverse" data-sortable-id="form-stuff-3">
             <div class="panel-body">
                 <fieldset>
                     <div class="form-group">
                        <legend class="pull-left width-full">Result</legend>
                     </div>
                     <div class="form-group">
                         <div style="height:250px; overflow:auto; width:100%;" id="exploreData"></div>
                     </div>
                     <legend class="pull-left width-full"></legend>
                     <div class="form-group" ng-if="isError">
                         <div style="color:red;">{{error}}</div>
                     </div>

                    <!-- <button type="submit" class="btn btn-sm btn-primary m-r-5" ng-click="execute();">{{action}}</button> -->
                     <a id="downloadAnchorElem" class="btn btn-sm btn-primary m-r-5 pull-right" ng-click="download();" ng-show="isDownload">Download</a>
                 </fieldset>
             </div>
         </div>
	</div>
</div>
