radfusion/resources/views/staff/worklist/index.blade.php

@php
    $configData = App\Services\ThemeHelper::appClasses();
    $container = 'container-fluid';
    $containerNav = 'container-fluid';
    /*
    $isNavbar = false;
    $navbarType = 'layout-navbar-hidden';
    $isMenu = false;
    $navbarHideToggle = false;
    */
@endphp

@extends('layouts.layoutMaster')

@section('title', 'Worklist')

@section('vendor-style')
    @vite([
        'resources/fontawesome/scss/fontawesome.scss',
        //'resources/fontawesome/scss/solid.scss',
        'resources/fontawesome/scss/light.scss',
        'resources/assets/vendor/libs/datatables-bs5/datatables.bootstrap5.scss',
        'resources/assets/vendor/libs/datatables-responsive-bs5/responsive.bootstrap5.scss',
        //'resources/assets/vendor/libs/datatables-checkboxes-jquery/datatables.checkboxes.scss',
        //'resources/assets/vendor/libs/datatables-buttons-bs5/buttons.bootstrap5.scss'
    ])
@endsection

@section('vendor-script')
    <script src="https://code.jquery.com/jquery-3.7.1.min.js" crossorigin="anonymous"></script>

    @vite([
        'resources/assets/vendor/libs/datatables-bs5/datatables-bootstrap5.js',
    ])
@endsection

@section('page-script')
    @vite([
        'resources/assets/js/ui-popover.js'
    ])

    {{ $dataTable->scripts() }}

    <script type="text/javascript">
        $(function() {
            $('body').on('click', '.showStudy', function () {
                var study_id = $(this).data('id');
                $.get("{{ route('staff.studies.show') }}", {hashid: study_id}, function (data) {
                    $('#study-details').html(data);
                    $('#study-modal').modal('show');
                });
            });

            $('body').on('click', '.show-attach', function () {
                var study_id = $(this).data('id');
                $.get("{{ route('staff.studies.attach') }}", {hashid: study_id}, function (data) {
                    $('#study-details').html(data);
                    $('#study-modal').modal('show');
                });
            });


            $('body').on('click', '.show-assign', function () {
                var study_id = $(this).data('id');
                $.get("{{ route('staff.assign.show') }}", {hashid: study_id}, function (data) {
                    $('#assign-details').html(data);
                    $('#assign-modal').modal('show');
                });
            });


            $('body').on('click', '.show-reports', function () {
                var study_id = $(this).data('id');
                $.get("{{ route('staff.report.popup') }}", {hashid: study_id}, function (data) {
                    $('#report-details').html(data);
                    $('#report-modal').modal('show');
                });
            });

        });

    </script>

    <script type="text/javascript">
        $(function() {
            let _status = '';

            function initTable() {
                const tableId = '#worklist-table';
                if ($.fn.dataTable.isDataTable(tableId)) {
                    console.log('getting old table');
                    return $(tableId).DataTable();
                }

                console.log('Creating new table');
                return $(tableId).DataTable(
                    {
                        destroy: true,
                        retrieve: true
                    }
                );
            }

            function filterTable(status) {
                _status = status;
                const table = initTable();
                console.log(table);
                //table.clear();
                table.ajax.url('{{ route('staff.worklist.index') }}?status=' + status).load();
            }

            // Set default filter to 'Pending'
            filterTable('unread');

            $('a[data-bs-toggle="tab"]').on('click', function (e) {
                console.log($(e.target).attr('id'));
                const tab_status = $(e.target).attr('id').replace('nav-', '');
                filterTable(tab_status);
            });
        });
    </script>

@endsection

@section('content')
    @include('staff.worklist.partials._stats')

    @include('staff.worklist.partials._nav-top')

    <div class="table-responsive text-nowrap">
        {{ $dataTable->table(['class' => 'table table-sm'], true) }}
    </div>

    <div class="modal fade" id="study-modal" tabindex="-1" aria-labelledby="studyModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-xl">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="studyModalLabel">Study Information</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div id="study-details"></div>
                </div>
            </div>
        </div>
    </div>


    <div class="modal fade" id="attach-modal" tabindex="-1" aria-labelledby="label-attach" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="label-attach">Attached Docs</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div id="attach-details"></div>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="assign-modal" tabindex="-1" aria-labelledby="label-assign" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="label-assign">Assign Radiologist</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div id="assign-details"></div>
                </div>
            </div>
        </div>
    </div>


    <div class="modal fade" id="report-modal" tabindex="-1" aria-labelledby="label-report" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="label-report">Reports</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div id="report-details"></div>
                </div>
            </div>
        </div>
    </div>

@endsection