@extends('master')

@section('head')
<meta name="csrf-token" content="{{ csrf_token() }}">
@stop

@section('title')
        <div class="title m-b-md">
            Search monitoring
        </div>
@stop

@section('links')
        <div class="links">
            <a href="{{ url('/') }}">Monitoring</a>
        </div>                    
@stop

@section('content')
<div id="app">
            <search-multiple-input ref="search"></search-multiple-input>
            <search-table :data="table_data" ref="table"></search-table>
</div>

@isset($data)
<table class="table">
    <thead class="thead-dark">
      <tr>
        <th scope="col">IP</th>
        <th scope="col">Meno PC</th>
        <th scope="col">Užívateľ</th>
        <th scope="col">Od</th>
        <th scope="col">Do</th>
      </tr>
    </thead>
    <tbody>

        @foreach ($data as $r)
        <tr>
        <th scope="row">{{$r->ip}}</th>
        <td>{{$r->comp}}</td>
        <td>{{$r->name}}</td>
        <td>{{$r->f}}</td>
        <td>{{$r->t}}</td>
        </tr>
        @endforeach
    
    </tbody>
  </table>



</div>
@endisset

<script>
    $(document).ready( function() {
    
    function sleep (time) {
         return new Promise((resolve) => setTimeout(resolve, time));
    }
    
        var app = new Vue({
            el: "#app",
            data: {
                counter: 0,
                table_data: []
            },
            methods: {
                
            },
            mounted: function() {
              console.log("START TABLE");
            } 
            
        });

});
  </script>
@stop