<ng-include src="'/static/job_runner/templates/run_modal.html'"></ng-include>

<section id="dashboard">
    <div class="row">
        <form class="navbar-search pull-right">
            <input ng-model="global_state.data.runFilter._job_title" type="text" class="search-query" placeholder="Filter" />
        </form>
    </div>
    <div class="row">
        <div class="tabbable">
            <ul class="nav nav-tabs">
                <li ng-class="{active: global_state.data.runTab == 'scheduled'}" ng-click="setTab('scheduled')">
                    <a href="#scheduled" data-toggle="tab" target="_self">Scheduled ({{ (runs | filter:runFilter('scheduled') | filter:enqueueEnabledFilter(true)).length }})</a>
                </li>
                <li ng-class="{active: global_state.data.runTab == 'scheduled_enqueue_disabled'}" ng-click="setTab('scheduled_enqueue_disabled')">
                    <a href="#scheduled_enqueue_disabled" data-toggle="tab" target="_self">Enqueue suspended ({{ (runs | filter:runFilter('scheduled') | filter:enqueueEnabledFilter(false)).length }})</a>
                </li>
                <li ng-class="{active: global_state.data.runTab == 'inqueue'}" ng-click="setTab('inqueue')">
                    <a href="#inqueue" data-toggle="tab" target="_self">In queue ({{ (runs | filter:runFilter('in_queue')).length }})</a>
                </li>
                <li ng-class="{active: global_state.data.runTab == 'started'}" ng-click="setTab('started')">
                    <a href="#started" data-toggle="tab" target="_self">Started ({{ (runs | filter:runFilter('started')).length }})</a>
                </li>
                <li ng-class="{active: global_state.data.runTab == 'completed'}" ng-click="setTab('completed')">
                    <a href="#completed" data-toggle="tab" target="_self">Completed ({{ (runs | filter:runFilter('completed')).length }})</a>
                </li>
                <li ng-class="{active: global_state.data.runTab == 'error'}" ng-click="setTab('error')">
                    <a href="#error" data-toggle="tab" target="_self">Completed with error ({{ (runs | filter:runFilter('completed_with_error')).length }})</a>
                </li>
            </ul>
            <div class="tab-content">
                <div id="scheduled" ng-class="{active: global_state.data.runTab == 'scheduled', 'tab-pane': true}">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th>Job</th>
                                <th class="width15pc">Scheduled</th>
                                <th class="width15pc">Worker pool</th>
                                <th class="width15pc">Assigned worker</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="run in runs | filter:runFilter('scheduled') | filter:global_state.data.runFilter | filter:enqueueEnabledFilter(true) | orderBy:'schedule_dts'">
                                <td><a href="{{ run.id }}/">{{ run.get_job().title }}</a> (<a href="../jobs/{{ run.get_job().id }}/">job</a>)</td>
                                <td>{{ run.schedule_dts | formatdts }}</td>
                                <td>{{ run.get_job().get_worker_pool().title }}</td>
                                <td>{{ run.get_worker().title }}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div id="scheduled_enqueue_disabled" ng-class="{active: global_state.data.runTab == 'scheduled_enqueue_disabled', 'tab-pane': true}">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th>Job</th>
                                <th class="width15pc">Scheduled</th>
                                <th class="width15pc">Worker pool</th>
                                <th class="width15pc">Assigned worker</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="run in runs | filter:runFilter('scheduled') | filter:global_state.data.runFilter | filter:enqueueEnabledFilter(false) | orderBy:'schedule_dts'">
                                <td><a href="{{ run.id }}/">{{ run.get_job().title }}</a> (<a href="../jobs/{{ run.get_job().id }}/">job</a>)</td>
                                <td>{{ run.schedule_dts | formatdts }}</td>
                                <td>{{ run.get_job().get_worker_pool().title }}</td>
                                <td>{{ run.get_worker().title }}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div id="inqueue" ng-class="{active: global_state.data.runTab == 'inqueue', 'tab-pane': true}">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th>Job</th>
                                <th class="width15pc">In queue</th>
                                <th class="width15pc">Worker pool</th>
                                <th class="width15pc">Assigned worker</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="run in runs | filter:runFilter('in_queue') | filter:global_state.data.runFilter | orderBy:'enqueue_dts'">
                                <td><a href="{{ run.id }}/">{{ run.get_job().title }}</a> (<a href="../jobs/{{ run.get_job().id }}/">job</a>)</td>
                                <td>{{ run.enqueue_dts | formatdts }}</td>
                                <td>{{ run.get_job().get_worker_pool().title }}</td>
                                <td>{{ run.get_worker().title }}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div id="started" ng-class="{active: global_state.data.runTab == 'started', 'tab-pane': true}">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th>Job</th>
                                <th class="width15pc">Started</th>
                                <th class="width15pc">Worker pool</th>
                                <th class="width15pc">Assigned worker</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="run in runs | filter:runFilter('started') | filter:global_state.data.runFilter | orderBy:'-start_dts'">
                                <td><a href="{{ run.id }}/">{{ run.get_job().title }}</a> (<a href="../jobs/{{ run.get_job().id }}/">job</a>)</td>
                                <td>{{ run.start_dts | formatdts }}</td>
                                <td>{{ run.get_job().get_worker_pool().title }}</td>
                                <td>{{ run.get_worker().title }}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div id="completed" ng-class="{active: global_state.data.runTab == 'completed', 'tab-pane': true}">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th>Job</th>
                                <th class="width15pc">Duration</th>
                                <th class="width15pc">Returned</th>
                                <th class="width15pc">Worker pool</th>
                                <th class="width15pc">Assigned worker</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="run in runs | filter:runFilter('completed') | filter:global_state.data.runFilter | orderBy:'-return_dts'">
                                <td><a href="{{ run.id }}/">{{ run.get_job().title }}</a> (<a href="../jobs/{{ run.get_job().id }}/">job</a>)</td>
                                <td>{{ run.get_duration_string() }}</td>
                                <td>{{ run.return_dts | formatdts }}</td>
                                <td>{{ run.get_job().get_worker_pool().title }}</td>
                                <td>{{ run.get_worker().title }}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div id="error" ng-class="{active: global_state.data.runTab == 'error', 'tab-pane': true}">
                    <table class="table table-striped">
                        <thead>
                            <tr>
                                <th>Job</th>
                                <th class="width15pc">Duration</th>
                                <th class="width15pc">Returned</th>
                                <th class="width15pc">Worker pool</th>
                                <th class="width15pc">Assigned worker</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="run in runs | filter:runFilter('completed_with_error') | filter:global_state.data.runFilter | orderBy:'-return_dts'">
                                <td><a href="{{ run.id }}/">{{ run.get_job().title }}</a> (<a href="../jobs/{{ run.get_job().id }}/">job</a>)</td>
                                <td>{{ run.get_duration_string() }}</td>
                                <td>{{ run.return_dts | formatdts }}</td>
                                <td>{{ run.get_job().get_worker_pool().title }}</td>
                                <td>{{ run.get_worker().title }}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

    </div>
</section>
