@extends('adminlte::page')

@section('title', 'Workstreams')

@section('content_header')
<div class="row mb-2">
    <div class="col-sm-6">
        <h1>Workstreams List</h1>
    </div>
    <div class="col-sm-6">
        <ol class="breadcrumb float-sm-right">
            <li class="breadcrumb-item"><a href="{{route('dashboard')}}">Dashboard</a></li>
            <li class="breadcrumb-item active">Workstreams List</li>
        </ol>
    </div>
</div>
@endsection

@section('content')
<!-- User Table -->
<div class="card">
    <div class="card-header d-flex align-items-center">
        <h3 class="card-title"><b>Workstream List</b></h3>

        <a href="{{ route('workstreams.create') }}" class="btn btn-sm bg-gradient-primary ml-auto"
            title="Add New Workstream">
            Add New Workstream
        </a>
    </div>
    <div class="card-body">
        <table id="workstream_table" class="table table-bordered table-striped"
            data-url="{{ route('workstreams.list') }}">
            <thead>
                <tr>
                    <th>#</th>
                    <th>Workstream Name</th>
                    <th>Workstream Lead (1st Approver)</th>
                    <th>Workstream Sponser (2nd Approver)</th>
                    <th>Finance Sponsor</th>
                    <th>Created By</th>
                    <th>Created At</th>
                    <th>Action</th>
                </tr>
            </thead>
        </table>
    </div>
</div>
@endsection

@push('js')
<!-- Include jQuery, AdminLTE JS, and DataTables JS -->
<script>
    const routes = {
        workstream: "{{ route('workstreams.index') }}",
        isEditMode: 'false',
    };
</script>

<!-- Include jQuery, AdminLTE JS, and DataTables JS -->
<script src="{{ asset('assets/js/backend/workstreams/workstreams.js') }}"></script>
@endpush