@extends('layouts.app')
@section('title', __('vrc::lang.technicians'))
@section('content')
<section class="content-header"><h1>@lang('vrc::lang.technicians')
    <a href="{{ route('vrc.reports.technician-productivity') }}" class="btn btn-default btn-sm pull-right"><i class="fa fa-bar-chart"></i> @lang('vrc::lang.productivity')</a>
</h1></section>
<section class="content">
    @component('components.widget', ['class' => 'box-primary'])
        @can('vrc.technician.manage')
            @slot('tool')<div class="box-tools"><button class="btn btn-primary vrc-modal-btn" data-href="{{ route('vrc.technicians.create') }}"><i class="fa fa-plus"></i> @lang('messages.add')</button></div>@endslot
        @endcan
        <table class="table table-bordered table-striped" id="vrc_tech_table">
            <thead><tr><th>@lang('vrc::lang.technician')</th><th>@lang('vrc::lang.hourly_rate')</th><th>@lang('vrc::lang.commission')</th><th>@lang('vrc::lang.status')</th><th>@lang('messages.action')</th></tr></thead>
        </table>
    @endcomponent
    <div class="modal fade vrc_modal" tabindex="-1" role="dialog"></div>
</section>
@endsection
@section('javascript')
<script>
$(function () {
    var table = $('#vrc_tech_table').DataTable({
        processing: true, serverSide: true, ajax: '{{ route('vrc.technicians.index') }}',
        columns: [
            { data: 'name', name: 'name' }, { data: 'hourly_rate', name: 'hourly_rate' },
            { data: 'commission_pct', name: 'commission_pct' },
            { data: 'is_active', name: 'is_active', orderable: false },
            { data: 'action', name: 'action', orderable: false, searchable: false },
        ],
    });
    window.__vrcTables = window.__vrcTables || []; window.__vrcTables.push(table);
});
</script>
@include('vrc::partials.crud_scripts')
@endsection
