@php
/**
* Component : Contact
* Controller : ContactController
* File : contact.list.blade.php
* ----------------------------------------------------------------------------- */
$currentGroup = $groupUid ? $vendorContactGroups->where('_uid', $groupUid)->first() : null;
@endphp
@extends('layouts.app', ['title' => __tr('Contacts')])
@section('content')
@include('users.partials.header', [
'title' => $groupUid ? __tr('__groupName__ group contacts', [
'__groupName__' => $currentGroup->title
]) : __tr('Contacts'),
// 'description' => $groupUid ? $currentGroup->description : '',
'class' => 'col-lg-7'
])
@php
$groupDescription = $groupUid ? $currentGroup->description : '';
@endphp
<div class="container-fluid mt-lg--6" x-data="initialContactsInfoData">
    <div class="row">
        <!-- button -->
        <div class="col-xl-12 mb-3">
            <div class="float-right">
                @if ($groupUid)
                    <a class="lw-btn btn btn-secondary" href="{{ route('vendor.contact.group.read.list_view') }}">{{
                        __tr('Back to Contact Groups') }}</a>
                    <a class="lw-btn btn btn-secondary" href="{{ route('vendor.contact.read.list_view') }}">{{
                        __tr('Back to Contacts') }}</a>
                @endif
                @if(hasVendorAccess('manage_contacts', 'add_edit_contacts'))
                    <button type="button" class="lw-btn btn btn-primary" data-toggle="modal" data-target="#lwAddNewContact">
                        {{ __tr('Create New Contact') }}
                    </button>
                @endif
                @if (!$groupUid)
                    @if(hasVendorAccess('manage_contacts', 'export_contacts'))
                        <button type="button" class="lw-btn btn btn-dark" data-toggle="modal" data-target="#lwExportDialog"> <i class="fa fa-download"></i> {{ __tr('Download Contacts') }}</button>
                    @endif
                    @if(hasVendorAccess('manage_contacts', 'import_contacts'))
                        <button type="button" class="lw-btn btn btn-dark" data-toggle="modal"
                            data-target="#lwImportContactDialog"><i class="fa fa-upload"></i> {{ __tr('Upload Contacts') }}
                        </button>
                    @endif
                @endif
            </div>
        </div>

        @if(!hasVendorAccess('manage_contacts', 'add_edit_contacts') 
            and !hasVendorAccess('manage_contacts', 'export_contacts') 
            and !hasVendorAccess('manage_contacts', 'import_contacts'))
            <div class="col-xl-12 mt-4"></div>
        @endif

        <!--/ button -->
        {{-- import contacts --}}
        <x-lw.modal id="lwImportContactDialog" :header="__tr('Upload Contacts')" :hasForm="true"
            data-pre-callback="appFuncs.clearContainer">
            <x-lw.form id="lwImportContactDialogForm" :action="route('vendor.contact.write.import')"
                :data-callback-params="['modalId' => '#lwImportContactDialog', 'datatableId' => '#lwContactList']"
                data-callback="window.onImportProcessUpdate">
                <div class="lw-form-modal-body p-3">
                <div x-cloak class="text-center" x-show="existingImportRequestData.progress">
                    <h1 class="text-success" x-text="existingImportRequestData.progressCountFormatted"></h1>
                    <h4 x-show="existingImportRequestData.estimatedRemainingTime" class="text-muted">{{  __tr('Estimated time remaining') }}</h4>
                    <h4 class="text-info" x-show="existingImportRequestData.estimatedRemainingTime" x-text="existingImportRequestData.estimatedRemainingTime"></h4>
                    <h3>{{  __tr('Please wait ... contacts import is in progress') }}</h3>
                    <div class="progress" role="progressbar" aria-label="{{ __tr('contacts import in progress') }}" :aria-valuenow="existingImportRequestData.progress" aria-valuemin="0" aria-valuemax="100">
                    <div class="progress-bar progress-bar-striped progress-bar-animated" :style="{'width':existingImportRequestData.progress + '%'}" style="width: 0%"></div>
                    </div>
                    <div>
                        <a class="lw-ajax-link-action btn btn-danger btn-sm" data-confirm="