{{-- Extends layout --}}
@extends('layout.default')

{{-- Styles Section --}}
@section('styles')
    <link href="{{ asset('plugins/custom/datatables/datatables.bundle.css') }}" rel="stylesheet" type="text/css"/>
    <link href="{{ asset('css/custom.datatable.css') }}" rel="stylesheet" type="text/css"/>
@endsection
@section('subheaderRightToolbar')
    @PermissionsCan(groupPermissionName('color.create'))
    <!--begin::Button-->
    @php
        $favourite = \Modules\User\Entities\Favourite::where(['user_id'=> auth()->user()->id,'route_name' => request()->route()->getName()])->count();
    @endphp
    <button class="btn btn-{{ ($favourite === 0 ? 'info' : 'danger') }} font-weight-bolder add-to-favourite-js mr-2"
            data-url="{{ route('user.favourite.make') }}"
            data-title="Department"
            data-activity="{{ ($favourite === 0 ? 'Create' : 'Remove') }}"
            data-path="{{ request()->route()->getName() }}">
        <i class="la la-star"></i> {{ __(($favourite === 0 ? "Add To" : "Remove From")." Favourite ") }}
    </button>
    <a href="{{ route('color.create') }}" class="btn btn-primary font-weight-bolder">
        <i class="la la-plus"></i><u>N</u>ew Color</a>
    <!--end::Button-->
    @endPermissionsCan

    <!--begin::Settings button-->
    {{--@include('_components/setting-drawer-button',
                        [
                            'label' => 'Settings',
                            'service' => 'Color',
                            'module' => 'Color',
                            'action' => 'getDrawer',
                            'class' => 'userDatatableDrawerForm-js',
                            'event' => 'userDatatableDrawerFormLoaded'
                        ])--}}
    <!--end::Settings button-->
@endsection

{{-- Content --}}
@section('content')
    <div class="card card-custom">
        <div class="card-body">
            @component('_components._table', ['id' => 'color_datatable', 'columns' => $datatableColumns])
                @slot('url')
                    {{ route('color.datatable') }}
                @endslot
            @endcomponent
        </div>
    </div>
@endsection

@section('scripts')
    <script src="{{ asset('plugins/custom/datatables/datatables.bundle.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/global-datatable.js?v='.time()) }}" type="text/javascript"></script>
    <script type="text/javascript" src="{{ asset('js/modules/color/index.js?v='.time()) }}"></script>
@endsection