@extends('layouts.app')
@section('title', 'IoT / Predictive Maintenance')
@section('content')
@include('maintenance::layouts.nav')
<section class="content">
    <div class="row">
        <div class="col-md-6">
            <div class="box box-primary">
                <div class="box-header"><h3 class="box-title">IoT Devices</h3></div>
                <div class="box-body table-responsive">
                    <table class="table table-bordered"><thead><tr><th>UID</th><th>Name</th><th>Protocol</th><th>Last Seen</th></tr></thead>
                    <tbody>@foreach($devices as $d)<tr><td>{{ $d->device_uid }}</td><td>{{ $d->name }}</td><td>{{ $d->protocol }}</td><td>{{ $d->last_seen_at }}</td></tr>@endforeach</tbody></table>
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <div class="box box-warning">
                <div class="box-header"><h3 class="box-title">Open Alerts</h3></div>
                <div class="box-body">
                    <ul class="list-group">
                    @foreach($alerts as $a)
                        <li class="list-group-item">{{ $a->message }} <small class="text-muted">{{ $a->triggered_at }}</small></li>
                    @endforeach
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="box box-default">
        <div class="box-header"><h3 class="box-title">Register Device</h3></div>
        <form method="POST" action="{{ action([\Modules\Maintenance\Http\Controllers\IotController::class, 'storeDevice']) }}">
            @csrf
            <div class="box-body row">
                <div class="col-md-3"><input name="device_uid" class="form-control" placeholder="Device UID" required></div>
                <div class="col-md-3"><input name="name" class="form-control" placeholder="Name" required></div>
                <div class="col-md-2"><select name="protocol" class="form-control"><option value="mqtt">MQTT</option><option value="opcua">OPC-UA</option><option value="http">HTTP</option></select></div>
                <div class="col-md-2"><input name="topic" class="form-control" placeholder="Topic"></div>
                <div class="col-md-2"><button class="btn btn-primary">Add</button></div>
            </div>
        </form>
    </div>
</section>
@endsection