{{define "title"}}Statup | Dashboard{{end}}
{{define "content"}}
<div class="container col-md-7 col-sm-12 mt-md-5 bg-light">
{{template "nav" }}
    <div class="col-12 mt-3">
        <div class="row stats_area mb-5">
            <div class="col-4">
                <span class="lg_number">{{ CoreApp.ServicesCount }}</span>
                Total Services
            </div>
            <div class="col-4">
                <span class="lg_number">{{ CoreApp.Count24HFailures }}</span>
                Failures last 24 Hours
            </div>
            <div class="col-4">
                <span class="lg_number">{{ CoreApp.CountOnline }}</span>
                Online Services
            </div>
        </div>
        <div class="row mt-4">
            <div class="col-12">
                <h3>Services</h3>
                <div class="list-group mb-5 mt-3">
                {{ range Services }}
                    <a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
                        <div class="d-flex w-100 justify-content-between">
                            <h5 class="mb-1">{{.Name}}</h5>
                            <small>{{if .Online}} <span class="badge badge-success">ONLINE</span> {{else}} <span class="badge badge-danger">OFFLINE</span> {{end}}</small>
                        </div>
                        <p class="mb-1">{{.SmallText}}</p>
                    </a>
                {{ end }}
                </div>

            {{ range Services }}
            {{ if .LimitedFailures }}
                <h4 class="text-truncate">{{.Name}} Failures</h4>
                <div class="list-group mt-3 mb-4">
                {{ range .LimitedFailures }}
                    <a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
                        <div class="d-flex w-100 justify-content-between">
                            <h5 class="mb-1">{{.ParseError}}</h5>
                            <small>{{.Ago}}</small>
                        </div>
                        <p class="mb-1">{{.Issue}}</p>
                    </a>
                {{ end }}
                </div>
            {{ end }}
            {{ end }}


            </div>
        </div>
    </div>
</div>
{{end}}