@extends('adminlte::page')

@section('title', 'AdminLTE')

@section('content_header')
    <h1>觀看<span style="color:red">{{ $main_data[0]->nickname }}</span>紀錄:</h1>
@stop

@section('content')

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css">

使用紀錄
<div class="panel-group" id="accordion">
  <div class="panel panel-default">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a data-toggle="collapse" data-parent="#accordion" 
           href="#collapseOne">
          1.文字翻譯
        </a>
      </h4>
    </div>
    <div id="collapseOne" class="panel-collapse collapse in">
      <div class="panel-body">
  <table class="table">
  <thead>
    <tr>
      <th>開始時間</th>
      <th>使用時間(sec)</th>
      <th>使用字數</th></tr>
  </thead>
  <tbody>
    @foreach($tran_his as $key => $row)
    @if(!empty($row->end_time))
    <tr>
      <td>{{ $row->start_time }}</td>
            <td>{{ $Timesub }}</td>
      <td>{{ $row->char_count }}</td>
    </tr>
   
    @endif
    @endforeach
  </tbody>

</table>
      </div>
    </div>
  </div>
  <div class="panel panel-success">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a data-toggle="collapse" data-parent="#accordion" 
           href="#collapseTwo">
          2.字稿紀錄
        </a>
      </h4>
    </div>
    <div id="collapseTwo" class="panel-collapse collapse">
      <div class="panel-body">
      <table class="table">
  <thead>
    <tr>
      <th>開始時間</th>
      <th>使用時間(sec)</th>
      
    </tr>
  </thead>
  <tbody>
    @foreach($speech_his as $key => $row)
    @if(!empty($row->end_time))
    <tr>
      <td>{{ $row->start_time }}</td>
            <td>{{ $Timesub }}</td>
      
    </tr>
   
    @endif
    @endforeach
  </tbody>

</table>
      </div>
    </div>
  </div>
  <div class="panel panel-info">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a data-toggle="collapse" data-parent="#accordion" 
           href="#collapseThree">
          3.房間使用紀錄
        </a>
      </h4>
    </div>
    <div id="collapseThree" class="panel-collapse collapse">
      <div class="panel-body">
       <table class="table">
  <thead>
    <tr>
      <th>開始時間</th>
      <th>人數</th>
      
    </tr>
  </thead>
  <tbody>
    @foreach($room_his as $key => $row)
    
    <tr>
      <td>{{ $row->process_time }}</td>
      
      <td>{{ $row->people_count }}</td>
      
    </tr>
   
  
    @endforeach
  </tbody>

</table>
      </div>
    </div>
  </div>
  
</div>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script type="text/javascript">
  $(function () { $('#collapseFour').collapse({
    toggle: false
  })});
  $(function () { $('#collapseTwo').collapse('show')});
  $(function () { $('#collapseThree').collapse('toggle')});
  $(function () { $('#collapseOne').collapse('hide')});
</script>  




@stop