@extends('layouts.app')

@section('title', __('Project View'))

@push('css')
    @include('panel.inc.filepond.css')
    @include('panel.inc.datatable.css')
    <style>
        .card-body{
            font-size: 18px;
        }
    </style>
@endpush

@section('content')
    <div class="page-header">
        <div class="row align-items-center">
            <div class="col-md-2">
                <div class="page-pretitle">
                    {{ __('Projects') }}
                </div>
                <h2 class="page-title">
                    {{ $campaign->title }}
                    @if($campaign->flagged_status)
                        <a href="#flagDetails" class="text-danger ml">Flagged</a>
                    @endif
                </h2>
            </div>

            <div class="col-md-6">
                <div class="row">
                    <div class="col-md-6">
                        <div class="card card-sm">
                            <div class="card-body">
                                <div class="row align-items-center">
                                    <div class="col-auto">
                        <span class="bg-blue text-white avatar">
                            <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="6" y1="4" x2="18" y2="4" /><line x1="12" y1="4" x2="12" y2="20" /></svg>
                        </span>
                                    </div>
                                    <div class="col">
                                        <div class="font-weight-medium">
                                            @include('panel.campaigns._type', ['type' => $campaign->type])
                                        </div>
                                        <div class="text-muted">
                                            Type
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="card card-sm">
                            <div class="card-body">
                                <div class="row align-items-center">
                                    <div class="col-auto">
                        <span class="bg-blue text-white avatar">
                            <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"/><path d="M17 8a4 4 0 0 0 -4 -4h-2a4 4 0 0 0 0 8h2a4 4 0 0 1 0 8h-2a4 4 0 0 1 -4 -4" /></svg>
                        </span>
                                    </div>
                                    <div class="col">
                                        <div class="font-weight-medium">
                                            @include('panel.campaigns._status', ['status' => $campaign->status])
                                        </div>
                                        <div class="text-muted">
                                            Status
                                        </div>
                                    </div>
                                    @if(\Gate::allows('campaigns-status-update'))
                                        <div class="col-auto">
                                            <button class="btn btn-sm btn-primary" onclick="fetchModal({el: this})" data-modal="#campaignStatusModal" data-modal-url="{{ route('panel.campaigns.status', $campaign->id) }}" type="button">Update</button>
                                        </div>
                                    @endif
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>


            <div class="col-auto ml-auto d-print-none">
                <div class="btn-list">
                    @if(\Gate::allows('customers-view'))
                        <a href="{{ route('panel.customers.view', $campaign->customer_id) }}" class="btn btn-cyan">
                            View Customer
                        </a>
                    @endif
                    @if(\Gate::allows('campaigns-edit'))
                        <a href="{{ route('panel.campaigns.edit', $campaign->id) }}" 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"/><path d="M9 7h-3a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-3" /><path d="M9 15h3l8.5 -8.5a1.5 1.5 0 0 0 -3 -3l-8.5 8.5v3" /><line x1="16" y1="5" x2="19" y2="8" /></svg>
                            Edit Project
                        </a>
                    @endif

                    @if(!$campaign->flagged_status && \Gate::allows('campaigns-flag'))
                        <a href="javascript:void(0)" class="btn btn-danger" onclick="fetchModal({el: this})" data-modal="#campaignFlagModal" data-modal-url="{{ route('panel.campaigns.flag', $campaign->id) }}">
                            <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="5" y1="5" x2="5" y2="21" /><line x1="19" y1="5" x2="19" y2="14" /><path d="M5 5a5 5 0 0 1 7 0a5 5 0 0 0 7 0" /><path d="M5 14a5 5 0 0 1 7 0a5 5 0 0 0 7 0" /></svg>
                            Flag
                        </a>
                    @endif

                    @if($campaign->flagged_status && \Gate::allows('campaigns-flag'))
                        <a href="javascript:void(0)" class="btn btn-success" onclick="fetchModal({el: this})" data-modal="#campaignFlagModal" data-modal-url="{{ route('panel.campaigns.flag', $campaign->id) }}">
                            <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="5" y1="5" x2="5" y2="21" /><line x1="19" y1="5" x2="19" y2="14" /><path d="M5 5a5 5 0 0 1 7 0a5 5 0 0 0 7 0" /><path d="M5 14a5 5 0 0 1 7 0a5 5 0 0 0 7 0" /></svg>
                            Un-Flag
                        </a>
                    @endif

                </div>
            </div>

        </div>
    </div>


    <div class="row">
        <div class="col-md-4">
            @include('panel.customers._customer-details', ['customer' => $campaign->customer, 'isMini' => true])
        </div>

        <div class="col-md-8">

            @include('panel.campaigns.pages._navigation', ['campaign' => $campaign])

            <div class="row">

                {{--<div class="col-md-4 mb">
                    <div class="card card-sm">
                        <div class="card-body">
                            <div class="row align-items-center">
                                <div class="col-auto">
                        <span class="bg-blue text-white avatar">
                            <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="6" y1="4" x2="18" y2="4" /><line x1="12" y1="4" x2="12" y2="20" /></svg>
                        </span>
                                </div>
                                <div class="col">
                                    <div class="font-weight-medium">
                                        @include('panel.campaigns._type', ['type' => $campaign->type])
                                    </div>
                                    <div class="text-muted">
                                        Type
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-md-4 mb">
                    <div class="card card-sm">
                        <div class="card-body">
                            <div class="row align-items-center">
                                <div class="col-auto">
                        <span class="bg-blue text-white avatar">
                            <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"/><path d="M17 8a4 4 0 0 0 -4 -4h-2a4 4 0 0 0 0 8h2a4 4 0 0 1 0 8h-2a4 4 0 0 1 -4 -4" /></svg>
                        </span>
                                </div>
                                <div class="col">
                                    <div class="font-weight-medium">
                                        @include('panel.campaigns._status', ['status' => $campaign->status])
                                    </div>
                                    <div class="text-muted">
                                        Status
                                    </div>
                                </div>
                                @if(\Gate::allows('campaigns-status-update'))
                                    <div class="col-auto">
                                        <button class="btn btn-sm btn-primary" onclick="fetchModal({el: this})" data-modal="#campaignStatusModal" data-modal-url="{{ route('panel.campaigns.status', $campaign->id) }}" type="button">Update</button>
                                    </div>
                                @endif
                            </div>
                        </div>
                    </div>
                </div>--}}

                <div class="col-md-4 mb">
                    <div class="card card-sm">
                        <div class="card-body">
                            <div class="row align-items-center">
                                <div class="col">
                                    <div class="font-weight-medium">{{ $campaign->sales_agent_id ? $campaign->salesAgent->name : '-' }}</div>
                                    <div class="text-muted">Sales Agent</div>
                                </div>

                                @if(\Gate::allows('campaigns-assign-sales-agent'))
                                    <div class="col-auto">
                                        <button class="btn btn-sm btn-primary" onclick="fetchModal({el: this, extraParams: { agentType: '{{ \App\User::SalesAgent }}' } })" data-modal="#agentModal" data-modal-url="{{ route('panel.campaigns.agent', $campaign->id) }}" type="button">Update</button>
                                    </div>
                                @endif

                                <div class="col-auto">
                                    <span class="avatar avatar-md rounded" style="background-image: url({{ $campaign->sales_agent_id ? $campaign->salesAgent->getFirstMediaUrl('avatar', 'thumb') : asset('tabler/static/avatar.jpg') }})"></span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-md-4 mb">
                    <div class="card card-sm">
                        <div class="card-body">
                            <div class="row align-items-center">
                                <div class="col">
                                    <div class="font-weight-medium">
                                        {{ $campaign->support_agent_id ? $campaign->supportAgent->name : '-' }}
                                        @if(isUser([\App\User::Admin, \App\User::SuperAdmin, \App\User::QualityDepartmentExecutive]))
                                        <br>
                                        <small class="font-weight-normal text-muted">{{ $campaign->support_agent_assigned_date ? $campaign->support_agent_assigned_date->format('F d, Y - h:i A') : '' }}</small>
                                        @endif
                                    </div>
                                    <div class="text-muted">Support Agent</div>
                                </div>
                                @if(\Gate::allows('campaigns-support-sales-agent'))
                                    <div class="col-auto">
                                        <button class="btn btn-sm btn-primary" onclick="fetchModal({el: this, extraParams: { agentType: '{{ \App\User::SupportAgent }}' } })" data-modal="#agentModal" data-modal-url="{{ route('panel.campaigns.agent', $campaign->id) }}" type="button">Update</button>
                                    </div>
                                @endif

                                <div class="col-auto">
                                    <span class="avatar avatar-md rounded" style="background-image: url({{ $campaign->support_agent_id ? $campaign->supportAgent->getFirstMediaUrl('avatar', 'thumb') : asset('tabler/static/avatar.jpg') }})"></span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-md-4 mb">
                    <div class="card card-sm">
                        <div class="card-body">
                            <div class="row">
                                <div class="col">
                                    <div class="font-weight-medium">{{ $campaign->creator->name }}</div>
                                    <div class="text-muted">Creator</div>
                                </div>
                                <div class="col-auto">
                                    <span class="avatar avatar-md rounded" style="background-image: url({{ $campaign->creator->getFirstMediaUrl('avatar', 'thumb') }})"></span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>

            <div class="row">

                <div class="col-md-8">
                    <div class="row row-deck">

                        @if($campaign->type == \App\Campaign::Recurring && \Gate::allows('campaigns-payment-date'))
                        <div class="col-md-6 mb">
                            <div class="card">
                                <div class="card-body">
                                    <label class="form-label">
                                        {{ now()->monthName }} Payment Date
                                        <a data-toggle="modal" data-target="#paymentDateModal" href="javascript:void(0)" class="btn btn-warning btn-sm float-right">
                                            Payment Date
                                        </a>
                                    </label>
                                    {{ $campaign->payment_date ? now()->monthName. ' '. $campaign->payment_date. ', '.now()->year : '-' }}
                                </div>
                            </div>

                            <div class="modal modal-blur fade" id="paymentDateModal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static">
                                <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
                                    <div class="modal-content">
                                        <form id="paymentDateForm" method="post" action="{{ route('panel.campaigns.payment-date', $campaign->id) }}">
                                            <div class="modal-header">
                                                <h5 class="modal-title">{{ __('Payment Date')  }}</h5>
                                                <button type="button" class="btn-close" data-dismiss="modal" aria-label="Close"></button>
                                            </div>
                                            <div class="modal-body">
                                                <div class="mb">
                                                    <select name="payment_date" class="form-select">
                                                        @for($i = 1; $i <= 28; $i++)
                                                            <option {{ $campaign->payment_date == $i ? 'selected' : '' }} value="{{ $i }}">{{ $i }}</option>
                                                        @endfor
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-outline-danger mr-auto" data-dismiss="modal">{{ __('Close') }}</button>
                                                <button type="submit" class="btn btn-primary submission">{{ __('Submit') }}</button>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>

                            @push('script')
                                <script !src="">
                                    $('#paymentDateForm').submit(function (e) {
                                        let form = this;
                                        $(form).find('.submission').btnloading();

                                        formHandler({form, e }).then(function (r) {
                                            notify('success', r.data.message);
                                            $('#paymentDateModal').modal('hide');
                                            setTimeout(function () {
                                                location.relaod();
                                            }, 1000)

                                        }).catch(function (e) {
                                            notify('error', e.response.data.message);
                                        }).then(function () {
                                            $(form).find('.submission').btnreset();
                                        })
                                    });
                                </script>
                            @endpush
                        </div>
                        @endif

                        <div class="col-md-6 mb">
                            <div class="card">
                                <div class="card-body">
                                    <label class="form-label">{{ __('Website') }}</label>
                                    {{ $campaign->website ?? '-' }}
                                </div>
                            </div>
                        </div>

                        @if($campaign->type == \App\Campaign::OneTime)
                            <div class="col-md-6 mb">
                                <div class="card">
                                    <div class="card-body">
                                        <label class="form-label">{{ __('Due Date') }}</label>
                                        {{ $campaign->due_date ? $campaign->due_date->format('F d, Y') : '' }}
                                    </div>
                                </div>
                            </div>
                        @endif

                        @if($campaign->flagged_status && \Gate::allows('campaigns-flag'))
                            <div class="col-md-6 mb">
                                <div class="card bg-red-lt" id="flagDetails">
                                    <div class="card-body">
                                        <div class="mb">
                                            <label class="form-label">{{ __('Flagged Date') }}</label>
                                            {{ $campaign->flagged_datetime ? $campaign->flagged_datetime->format('h:i A - F d, Y') : '-' }}
                                        </div>
                                        <div class="mb">
                                            <label class="form-label">{{ __('Flagged Attachment') }}</label>
                                            @if($campaign->getMedia('flaggedReason')->count())
                                                <a href="{{ $campaign->getFirstMediaUrl('flaggedReason') }}" download="{{ $campaign->getMedia('flaggedReason')->first()->name }}">
                                                    Download Attachment
                                                </a>
                                            @else
                                                No Attachment Found!
                                            @endif
                                        </div>
                                        <div class="mb">
                                            <label class="form-label">{{ __('Flagged Note') }}</label>
                                            {!! nl2br($campaign->flagged_note) !!}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endif

                        @if(!$campaign->flagged_status && $campaign->flagged_note && \Gate::allows('campaigns-flag'))
                            <div class="col-md-6 mb">
                                <div class="card bg-green-lt" id="flagDetails">
                                    <div class="card-body">
                                        <div class="mb">
                                            <label class="form-label">{{ __('UnFlagged Attachment') }}</label>
                                            @if($campaign->getMedia('flaggedReason')->count())
                                                <a href="{{ $campaign->getFirstMediaUrl('flaggedReason') }}" download="{{ $campaign->getMedia('flaggedReason')->first()->name }}">
                                                    Download Attachment
                                                </a>
                                            @else
                                                No Attachment Found!
                                            @endif
                                        </div>
                                        <div class="mb">
                                            <label class="form-label">{{ __('UnFlagged Note') }}</label>
                                            {!! nl2br($campaign->flagged_note) !!}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endif

                        <div class="col-md-6 mb">
                            <div class="card">
                                <div class="card-body">
                                    <div class="mb">
                                        <label class="form-label">{{ __('Target Cities') }}</label>
                                        @if($campaign->targeted_cities)
                                            @foreach(explode(',', $campaign->targeted_cities) as $city)
                                                <span class="badge bg-primary">{{ \Str::title($city) }}</span>
                                            @endforeach
                                        @endif
                                    </div>
                                    <div class="mb">
                                        <label class="form-label">{{ __('Target Services') }}</label>
                                        @if($campaign->targeted_services)
                                            @foreach(explode(',', $campaign->targeted_services) as $service)
                                                <span class="badge bg-primary text-wrap h-auto" >{{ \Str::title($service) }}</span>
                                            @endforeach
                                        @endif
                                    </div>

                                    <div class="mb">
                                        <label class="form-label">{{ __('Target Keywords') }}</label>
                                        @php($keywords = $campaign->targeted_keywords ? explode(',', $campaign->targeted_keywords) : [])
                                        @if($keywords)
                                            @foreach($keywords as $keyword)
                                                <span class="badge bg-primary">{{ $keyword }}</span>
                                            @endforeach
                                        @else
                                            -
                                        @endif
                                    </div>
                                    <div class="mb">
                                        <label class="form-label">{{ __('Target Radius Mile') }}</label>
                                        {{ $campaign->targeted_radius ?? '-' }}
                                    </div>
                                    <div class="mb">
                                        <label class="form-label">{{ __('Yelp Profile Link') }}</label>
                                        @if($campaign->yelp_profile)
                                            <a href="{{ $campaign->yelp_profile }}" target="_blank">Click Here</a>
                                        @else
                                            -
                                        @endif
                                    </div>
                                </div>
                            </div>
                        </div>

                        @if(isUser([ \App\User::SuperAdmin, \App\User::Admin, \App\User::SupportAgent ]))
                            <div class="col-md-6 mb">
                                <div class="card">
                                    <div class="card-body">
                                        <label class="form-label">{{ __('Payment Method') }}</label>
                                        {{ $campaign->payment_method }}

                                        @if($campaign->payment_method == \App\Campaign::Card)
                                            <br>
                                            <br>

                                            Type: {{ $campaign->card_type }} <br>
                                            Number: {{ $campaign->card_number }} <br>
                                            Expiry: {{ $campaign->card_expire }} <br>
                                            Holder: {{ $campaign->card_holder }} <br>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        @endif

                            <div class="col-md-6 mb">
                                <div class="card">
                                    <div class="card-body">
                                        <label class="form-label">
                                            {{ __('Login Details') }}
                                            @if(isUser(\App\User::SupportAgent))
                                                <a href="javascript:void(0)" class="btn btn-dark btn-sm float-right" onclick="fetchModal({el: this})" data-modal="#loginDetailModal" data-modal-url="{{ route('panel.campaigns.login-details', $campaign->id) }}">
                                                    Update Login
                                                </a>
                                            @endif
                                            @if(isUser(\App\User::SuperAdmin))
                                                <a href="javascript:void(0)" class="btn btn-dark btn-sm float-right" onclick="fetchModal({el: this})" data-modal="#loginDetailModal" data-modal-url="{{ route('panel.campaigns.login-credentials', $campaign->id) }}">
                                                    Add Credentials
                                                </a>
                                            @endif
                                        </label>
                                        {!! $campaign->login ? nl2br($campaign->login) : '-' !!}

                                        @if($campaign->type == \App\Campaign::Recurring)

                                            <div class="mb">
                                                <label class="form-label">GMB Listing Address</label>
                                                {!! $campaign->gmp_listing_address ? nl2br($campaign->gmp_listing_address) : '-' !!}
                                            </div>

                                            <div class="mb">
                                                <label class="form-label">Listing Status</label>
                                                {{ $campaign->listing_status ?? '-' }}
                                            </div>

                                            @if($campaign->listing_status)
                                                <div class="mb">
                                                    <label class="form-label">Listing Access</label>
                                                    {{ $campaign->listing_access ?? '-' }}
                                                </div>
                                            @endif

                                            <div class="mb">
                                                <label class="form-label">Access Email</label>
                                                {{ $campaign->access_email ?? '-' }}
                                            </div>

                                            @if(isUser([\App\User::SuperAdmin, \App\User::SupportAgent, \App\User::Admin]))
                                            <div class="mb">
                                                <h2>Credentials</h2>
                                                Email: {{ $campaign->credential_email ?? '-' }}<br>
                                                Password: {{ $campaign->credential_password ?? '-' }}
                                            </div>
                                            @endif

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

                        {{--<div class="col-md-6 mb">
                            <div class="card">
                                <div class="card-body">
                                    <label class="form-label">{{ __('Customer Status') }}</label>
                                    @include('panel.customers._status', ['customer' => $campaign->customer])
                                </div>
                            </div>
                        </div>--}}

                        @if(\Gate::allows('campaigns-description'))
                            <div class="col-md-12 mb">
                                <div class="card">
                                    <div class="card-body">
                                        <label class="form-label">{{ __('Description') }}</label>
                                        {!! nl2br($campaign->description) !!}
                                    </div>
                                </div>
                            </div>
                        @endif

                    </div>
                </div>

                @if(\Gate::allows('campaigns-note'))
                    <div class="col-md-4 mb">
                        <div class="card">
                            <div class="card-header">
                                <div class="card-title">{{ __('Notes') }}</div>
                            </div>
                            <div class="card-body">
                                <div class="list-group list-group-flush overflow-auto mb" style="max-height: 30rem; overflow-x: hidden !important">
                                    @foreach($campaign->notes as $note)
                                        <div class="list-group-item py-2 px-0">
                                            <div class="row">
                                                <div class="col text-truncate">
                                                    <span class="text-body d-block">{{ $note->user->name }}</span>
                                                    <div class="text-muted text-wrap mt-n1">{!! nl2br($note->note) !!}</div>
                                                    <small class="text-muted mt-n1">{{ $note->created_at->format('M d, Y - h:i A') }}</small>
                                                </div>
                                            </div>
                                        </div>
                                    @endforeach
                                </div>


                                @if(\Gate::allows('campaigns-note-add'))
                                    <form id="leadNoteForm" action="{{ route('panel.campaigns.note', $campaign->id) }}" method="post">
                                        <textarea required rows="4" minlength="5" class="form-control mb" name="note" autocomplete="off" placeholder="{{ __('Enter Note') }}"></textarea>
                                        <button class="btn btn-primary w-100 submission">{{ __('Submit') }}</button>
                                    </form>
                                @endif
                            </div>
                        </div>
                    </div>
                @endif

            </div>
        </div>
    </div>

@stop

@push('script')
    @include('panel.inc.filepond.js')

    <script !src="">
        @if(\Gate::allows('campaigns-note-add'))
        $('#leadNoteForm').submit(function(e){
            let form = this;
            $(form).find('.submission').btnloading();

            formHandler({ form, e }).then(function (r) {
                notify('success', r.data.message);

                setTimeout(function(){
                    location.reload();
                }, 1000);

            }).catch(function (e) {
                notify('error', e.response.data.message);
                $(form).find('.submission').btnreset();
            });
        })
        @endif
    </script>
@endpush