@extends('layouts.app')

@section('title', __('Projects'))

@push('css')
    @include('panel.inc.datatable.css')
@endpush

@section('content')
    <div class="page-header">
        <div class="row align-items-center">
            <div class="col-auto">
                <div class="page-pretitle">
                    {{ __('Projects') }}
                </div>
                <h2 class="page-title">
                    {{ __("Manage Projects") }}
                </h2>
            </div>
            <!-- Page title actions -->
            <div class="col-auto ml-auto d-print-none">
                <div class="btn-list">
                    @can('campaigns-add')
                        <a href="{{ route('panel.campaigns.add') }}" class="btn btn-primary">
                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><line x1="12" y1="5" x2="12" y2="19" /><line x1="5" y1="12" x2="19" y2="12" /></svg>
                            {{ __('Add') }}
                        </a>
                    @endcan
                </div>
            </div>
        </div>
    </div>

    @if(request()->is('panel/campaigns'))
        <div class="card mb">
            <div class="card-body">
                <div class="row justify-content-center align-items-center">

                    <div class="col-md-3">
                        <label class="form-label">Campaign Status</label>
                        <select name="campaignStatus" id="campaignStatus" class="campaignStatus">
                            <option value=""></option>
                            @foreach(\App\CampaignStatus::all() as $cStatus)
                                <option value="{{ $cStatus->id }}">{{ $cStatus->title }}</option>
                            @endforeach
                        </select>
                    </div>

                    <div class="col-md-3">
                        <label class="form-label">Customer Status</label>
                        <select name="customerStatus" id="customerStatus" class="customerStatus">
                            <option value=""></option>
                            @foreach(array_keys(\App\Customer::StatusColors) as $customerStatus)
                                <option value="{{ $customerStatus }}">{{ $customerStatus }}</option>
                            @endforeach
                        </select>
                    </div>

                </div>
            </div>
        </div>
    @endif


    <div class="card">
        {!! $dataTable->table() !!}
    </div>


@stop

@push('script')
    @include('panel.inc.datatable.js')
    {!! $dataTable->scripts() !!}

    <script !src="">
        $('.campaignStatus, .customerStatus').selectize({
            placeholder: 'Select Status',
            onChange: function (value) {
                $('#campaigns-table').DataTable().ajax.reload();
            }
        });

        $('#campaigns-table').on('preXhr.dt', function(e, settings, data){
            data.createdDate = '{{ request()->createdDate }}';
            data.salesAgent = '{{ request()->salesAgent }}';
            data.closer = '{{ request()->closer }}';
            data.dateRange = '{{ request()->dateRange }}';

            @if(request()->is('panel/campaigns'))
            data.campaignStatus = $('.campaignStatus').val();
            data.customerStatus = $('.customerStatus').val();
            @endif

            data.link = '{{ request()->url() }}';

            data.columns.push({data: 'customer.company'});
            data.columns.push({data: 'customer.phone_1'});
            data.columns.push({data: 'customer.phone_2'});
            data.columns.push({data: 'customer.email'});
        })

        @can('campaigns-delete')
        $(document).on('click', '.deleteModel', function(){
            let el = this;
            deletePopup({
                el: el,
                url: '{{ route('panel.campaigns.delete') }}',
                params:{
                    moduleID: $(el).data('model-id')
                },
                datatable: $('#campaigns-table').DataTable()
            });
        });
        @endcan
    </script>

@endpush