@extends('companyuser::layouts.master')
@section('title', __('sales::customers.Create Customer'))
@section('extra-styles')
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/custom/forms/custom-form.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/vendors/css/pickers/daterange/daterangepicker.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/vendors/css/pickers/datetime/bootstrap-datetimepicker.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/vendors/css/pickers/pickadate/pickadate.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/plugins/pickers/daterange/daterange.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/custom.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/custom/forms/frames.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/custom/forms/person-details.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/style-svgFont.css') }}" >
<script src="{{ asset('js/app.js') }}" defer></script>
<style>
    .swal2-container.swal2-center{
        z-index: 99999999;
    }
</style>
@endsection
@section('breadcrumb')
<div class="row breadcrumbs-top">
    <div class="breadcrumb-wrapper col-xs-12">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ route('company.customers.index', $subdomain)}}">@lang('companyuser::sidebar.Sales')</a></li>
            <li class="breadcrumb-item active"><a href="{{ route('company.customers.index', $subdomain)}}" class="redirect-item">@lang('companyuser::sidebar.Customers')</a></li>
            <li class="breadcrumb-item active"><a href="#">@lang('Create')</a></li>
        </ol>
    </div>
</div>
@endsection
@section('content')
@php
    $optionalAddressFields = ['building_number', 'address_number', 'district', 'province'];
    // Keep the KSA-only fields open when the user already put something in them,
    // so a failed submit never hides what they typed.
    $revealOptionalAddress = $errors->hasAny($optionalAddressFields)
        || collect($optionalAddressFields)->contains(fn ($field) => filled(old($field)));
@endphp

<section>
    <form action="{{ route('company.customers.store', $subdomain) }}" method="POST" novalidate class="form" id="create-customer-form">
        @csrf
        <div class="container-fluid">
            <div class="headBtns mx-1 fixed-btns">
                <div class="btn-group pull-right">
                    <button type="submit" class="text-green bg-trans" id="submit-button">
                        <span class="icon-Save action-icon"></span>
                    </button>
                </div>
                <div class="mb-1 pull-left">
                    <a class="text-green redirect-item" href="{{route('company.customers.index', $subdomain)}}" title="{{__('Back')}}">
                        @if(LaravelLocalization::getCurrentLocale() === 'en')
                            <span class="icon-Previous action-icon back-btnIcon"></span>
                        @else
                            <span class="icon-Next action-icon back-btnIcon"></span>
                        @endif
                    </a>
                </div>
            </div>
            <div class="match-height">
                {{-- @include('superadmin::errors.lists') --}}
                <div class="card mb-0">
                    <div class=" add-form-section filter-section-collapse">

                        <input type="hidden" value="{{request()->query()['customer_type'] ?? Modules\Sales\Enums\InvoiceTypesEnum::SIMPLIFIED_TAX_INVOICE}}" name="customer_type">
                        <div class="card-block">
                            <div class="form-body mt-20">
                                <div class="row">
                                    <div class="col-xs-12 col-lg-7">
                                        {{-- customer code --}}
                                        <div class="row mb-1">
                                            <div class="col-md-3">
                                                <label for="code">{{ __('sales::customers.Code') }}</label> <span class="required text-danger">*</span>
                                            </div>
                                            <div class="col-md-9">
                                                <input type="text" name="code" id="code" value="{{ old('code', $suggested_code) }}" class="w-100 form-control h-45{{ $errors->has('code') ? ' is-invalid' : '' }}" placeholder="" required maxlength="6" minlength="5">
                                                @error('code')
                                                <span class="invalid-feedback" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>

                                        </div>
                                        {{-- customer name --}}
                                        <div class="row mb-1">
                                            <div class="col-md-3">
                                                <label for="name" class="display-inline">{{ __('sales::customers.Customer Name') }}</label> <span class="required text-danger">*</span>
                                            </div>
                                            <div class="col-md-9">
                                                <input type="text" name="name" id="name" value="{{ old('name') }}" class="check-zatca-validation w-100 form-control h-45{{ $errors->has('name') ? ' is-invalid' : '' }}" required>
                                                @error('name')
                                                <span class="invalid-feedback" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                        </div>
                                        {{-- customer company --}}
                                        <div class="row mb-1">
                                            <div class="col-md-3">
                                                <label for="account_receivable_id">{{ __('sales::customers.Account') }}</label>
                                            </div>
                                            <div class="col-md-9">
                                                <select name="account_receivable_id" id="account_receivable_id" class="w-100 form-control h-45 select2-custom {{ $errors->has('account_receivable_id') ? ' is-invalid' : '' }}">
                                                    @foreach($accounts_receivable as $key => $value)
                                                        <option value="{{ $key }}" {{ old('account_receivable_id', str_replace('?', '', request('account_id'))) == $key ? 'selected' : '' }}>{{ $value }}</option>
                                                    @endforeach
                                                </select>
                                                @error('account_receivable_id')
                                                <span class="invalid-feedback" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                        </div>
                                        {{-- customer account --}}
                                        <div class="row mb-1 align-items-center">
                                            <div class="col-md-6 offset-md-3 d-flex align-items-center">
                                                <input type="checkbox" id="customer_account" name="customer_account" @if(old('customer_account')) checked @endif>
                                                <label for="customer_account"  style="margin:0 5px">{{ __('sales::customers.Customer Account') }} </label>
                                                <input type="hidden" id="account_code"  name="account_code" value="">
                                            </div>
                                            @error('customer_account')
                                            <div class="col-md-6 offset-md-3">
                                                <span class="invalid-feedback" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                            </div>
                                            @enderror
                                        </div>
                                        {{-- phone number --}}
                                        <div class="row mb-1">
                                            <div class="col-md-3">
                                                <label for="mobile">{{ __('sales::customers.Phone') }}</label>
                                            </div>
                                            @if(app()->getLocale() == 'ar')
                                            <div class="col-md-4">
                                                <input type="text" name="mobile" id="mobile" value="{{ old('mobile') }}" class="form-control h-45 inputValue{{ $errors->has('mobile') ? ' is-invalid' : '' }}" placeholder="">
                                                @error('mobile')
                                                <span class="invalid-feedback" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                            <div class="col-md-5">
                                                @include('superadmin::includes.selectCountry')
                                                @error('country_code')
                                                <span class="invalid-feedback" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                            @else
                                            <div class="col-md-5">
                                                @include('superadmin::includes.selectCountry')
                                                @error('country_code')
                                                <span class="invalid-feedback" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                            <div class="col-md-4">
                                                <input type="text" name="mobile" id="mobile" value="{{ old('mobile') }}" class="form-control inputValue{{ $errors->has('mobile') ? ' is-invalid' : '' }}" placeholder="">
                                                @error('mobile')
                                                <span class="invalid-feedback" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                            @endif
                                        </div>
                                        {{-- email --}}
                                        <div class="row mb-1">
                                            <div class="col-md-3">
                                                <label for="email">{{ __('sales::customers.Email') }}</label>
                                                @if($isB2BClient)
                                                    <span class="fa-lg text-danger">*</span>
                                                @endif
                                            </div>
                                            <div class="col-md-9">
                                                <input type="email" name="email" id="email" value="{{ old('email') }}" class="w-100 form-control h-45 inputValue{{ $errors->has('email') ? ' is-invalid' : '' }}" {{ $isB2BClient ? 'required' : '' }}>
                                                @error('email')
                                                <span class="invalid-feedback" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                        </div>
                                        @if($isB2BClient)
                                            {{-- taxable --}}
                                            <div class="row mb-1">
                                                <div class="col-md-3"></div>
                                                <div class="col-md-9">
                                                    <input type="checkbox" name="taxable" id="taxable" value="1" {{ old('taxable', '1') == '1' ? 'checked' : '' }}> <label for="taxable" style="margin: 0px 5px;">@lang('settings::general_settings.taxable')</label>
                                                </div>
                                            </div>
                                        @endif
                                        {{-- tax number --}}
                                        <div class="row mb-1">
                                            <div class="col-md-3">
                                                <label for="tax_number">{{ __('sales::customers.Tax Number') }}</label>
                                                @if($isB2BClient)
                                                    <span id="tax-number-required" class="fa-lg text-danger">*</span>
                                                @endif
                                            </div>
                                            <div class="col-md-9">
                                                <input type="number" name="tax_number" id="tax_number" value="{{ old('tax_number') }}" class="w-100 form-control h-45 inputValue{{ $errors->has('tax_number') ? ' is-invalid' : '' }}">
                                                @error('tax_number')
                                                <span class="invalid-feedback text text-danger" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                        </div>

                                        <div hidden><input type="number" name="zatca_comply" value="{{ $companyInfo->zatca_comply }}"></div>
                                        <div hidden><input type="number" name="is_not_simplified_only" value="{{ $isNotSimplifiedOnly }}"></div>
                                        @if ($isB2BClient)
                                        <div class="form-group">
                                            <div class="row mb-1">
                                                <div class="col-md-3">
                                                    <label for="serial_number">{{ __('settings::general_settings.serial_number') }}</label>
                                                </div>
                                                <div class="col-md-9">
                                                    <input type="text" name="serial_number" id="serial_number" value="{{ old('serial_number') }}" class="w-100 form-control h-45{{ $errors->has('serial_number') ? ' is-invalid' : '' }}" required>
                                                    @error('serial_number')
                                                        <span class="invalid-feedback text text-danger" role="alert">
                                                            <p>{{ $message }}</p>
                                                        </span>
                                                    @enderror
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-group sa-address-toggle" style="display: none;">
                                            <div class="row mb-1">
                                                <div class="col-md-3"></div>
                                                <div class="col-md-9">
                                                    <a href="#" id="toggle-optional-address" class="btn btn-link p-0">{{ __('sales::customers.add_address_details') }}</a>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-group sa-address-field">
                                            <div class="row mb-1">
                                                <div class="col-md-3">
                                                    <label for="province">{{ __('settings::general_settings.province') }}</label>
                                                    <span class="sa-required-asterisk fa-lg text-danger">*</span>
                                                </div>
                                                <div class="col-md-9">
                                                    <input type="text" name="province" id="province" value="{{ old('province') }}" class="check-zatca-validation sa-required-field w-100 form-control h-45{{ $errors->has('province') ? ' is-invalid' : '' }}" required>
                                                    @error('province')
                                                    <span class="invalid-feedback text text-danger" role="alert">
                                                            <p>{{ $message }}</p>
                                                        </span>
                                                    @enderror
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-group sa-address-field">
                                            <div class="row mb-1">
                                                <div class="col-md-3">
                                                    <label for="district">{{ __('settings::general_settings.district') }}</label>
                                                    <span class="sa-required-asterisk fa-lg text-danger">*</span>
                                                </div>
                                                <div class="col-md-9">
                                                    <input type="text" name="district" id="district" value="{{ old('district') }}" class="check-zatca-validation sa-required-field w-100 form-control h-45{{ $errors->has('district') ? ' is-invalid' : '' }}" required>
                                                    @error('district')
                                                        <span class="invalid-feedback text text-danger" role="alert">
                                                            <p>{{ $message }}</p>
                                                        </span>
                                                    @enderror
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-group sa-address-field">
                                            <div class="row mb-1">
                                                <div class="col-md-3">
                                                    <label for="address_number">{{ __('settings::general_settings.address_number') }}</label>
                                                    <span class="sa-required-asterisk fa-lg text-danger">*</span>
                                                </div>
                                                <div class="col-md-9">
                                                    <input type="text" name="address_number" id="address_number" value="{{ old('address_number') }}" class="sa-required-field w-100 form-control h-45{{ $errors->has('address_number') ? ' is-invalid' : '' }}" required>
                                                    @error('address_number')
                                                        <span class="invalid-feedback text text-danger" role="alert">
                                                            <p>{{ $message }}</p>
                                                        </span>
                                                    @enderror
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-group sa-address-field">
                                            <div class="row mb-1">
                                                <div class="col-md-3">
                                                    <label for="building_number">{{ __('settings::general_settings.building_number') }}</label>
                                                    <span class="sa-required-asterisk fa-lg text-danger">*</span>
                                                </div>
                                                <div class="col-md-9">
                                                    <input type="text" name="building_number" id="building_number" value="{{ old('building_number') }}" class="sa-required-field w-100 form-control h-45{{ $errors->has('building_number') ? ' is-invalid' : '' }}" required>
                                                    @error('building_number')
                                                        <span class="invalid-feedback text text-danger" role="alert">
                                                            <p>{{ $message }}</p>
                                                        </span>
                                                    @enderror
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <div class="row mb-1">
                                                <div class="col-md-3">
                                                    <label for="commercial_schema">{{ __('settings::general_settings.commercial_schema') }}</label>
                                                    <span class="fa-lg text-danger">*</span>
                                                </div>
                                                <div class="col-md-9">
                                                    <select name="commercial_schema" id="commercial_schema" class="form-control h-45" required>
                                                        <option value="" disabled selected>{{ __('settings::general_settings.select_commercial_schema') }}</option>
                                                        @foreach(\App\Enums\Zatca\VatNumberSchemaEnum::translatedListBuyerSchema() as $key => $value)
                                                            <option value="{{ $key }}" {{ old('commercial_schema') == $key ? 'selected' : '' }}>{{ $value }}</option>
                                                        @endforeach
                                                    </select>
                                                    @error('commercial_schema')
                                                        <span class="invalid-feedback text text-danger" role="alert">
                                                            <p>{{ $message }}</p>
                                                        </span>
                                                    @enderror
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row mb-1">
                                            <div class="col-md-3">
                                                <label for="commercial_number">{{ __('settings::general_settings.commercial number') }}</label>
                                                <span class="fa-lg text-danger">*</span>
                                            </div>
                                            <div class="col-md-9">
                                                <input type="text" name="commercial_number" id="commercial_number" value="{{ old('commercial_number') }}" class="w-100 form-control h-45{{ $errors->has('commercial_number') ? ' is-invalid' : '' }}" required>
                                                @error('commercial_number')
                                                    <span class="invalid-feedback text text-danger" role="alert">
                                                        <p>{{ $message }}</p>
                                                    </span>
                                                @enderror
                                            </div>
                                        </div>
                                        @endif
                                        {{-- Opening Balance --}}
                                        <div class="row mb-1">
                                            <div class="col-md-3">
                                                <label for="opening_balance">{{ __('sales::customers.Opening Balance') }}</label>
                                            </div>
                                            <div class="col-md-4">
                                                <input type="number" name="opening_balance" id="opening_balance" value="{{ old('opening_balance') }}" class="w-100 form-control inputValue number h-45{{ $errors->has('opening_balance') ? ' is-invalid' : '' }}">
                                                @error('opening_balance')
                                                <span class="invalid-feedback text text-danger" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                            <div class="col-md-2" style="padding: 0.5rem">{!! __('settings::currencies.'.$currency) !!}</div>
                                        </div>
                                    </div>
                                    <div class="col-xs-12 col-lg-5 rounded">
                                        <div class="row" style="background-color: #f5f7fa;">
                                            <div class="col-xs-12 my-1">
                                                <h5>
                                                    @lang('sales::customers.Billing Address')
                                                    @if($isB2BClient)
                                                        <span class="fa-lg text-danger">*</span>
                                                    @endif
                                                </h5>
                                            </div>
                                            <div class="col-xs-12 mb-1">
                                                <input type="text" name="street" value="{{ old('street') }}" class="check-zatca-validation w-100 form-control h-45 inputValue" placeholder="{{ __('sales::customers.Street Name') }}">
                                                @error('street')
                                                <span class="invalid-feedback text text-danger" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                            <div class="col-xs-12 mb-1">
                                                <input type="text" name="city" value="{{ old('city') }}" class="check-zatca-validation w-100 form-control h-45 inputValue" placeholder="{{ __('sales::customers.City') }}">
                                                @error('city')
                                                <span class="invalid-feedback text text-danger" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                            <div class="col-xs-12 mb-1">
                                                <input type="text" name="country" value="{{ old('country') }}" class="w-100 form-control h-45 inputValue" placeholder="{{ __('sales::customers.Country') }}">
                                                @error('country')
                                                <span class="invalid-feedback text text-danger" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                            <div class="col-xs-12 col-md-6 mb-1">
                                                <input type="text" name="postal_code" value="{{ old('postal_code') }}" class="w-100 form-control h-45 inputValue{{ $errors->has('postal_code') ? ' is-invalid' : '' }}" placeholder="{{ __('sales::customers.Postal Code') }}">
                                                @error('postal_code')
                                                <span class="invalid-feedback text text-danger" role="alert">
                                                    <p>{{ $message }}</p>
                                                </span>
                                                @enderror
                                            </div>
                                        </div>
                                    </div>

                                </div>
                                <div class="row mb-1">
                                    <div class="col-md-12">
                                        @if( $customFields->count() )
                                        <button class="mb-1 btn btn-default w-100 filterbtn" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
                                            <div class="d-flex justify-content-between">
                                                <span>{{ __('purchases::purchase_bills.additional_fields') }} </span><i class="fa fa-angle-down"></i>
                                            </div>
                                        </button>

                                        <div class="collapse" id="collapseExample">
                                            <div class="card card-body mb-0">
                                                @foreach($customFields as $key=>$field)
                                                <div class="row mb-1">
                                                    <div class="col-md-4">
                                                        <label for="{{$field->name_en}}">
                                                            {{ $field->{'name_'.app()->getLocale()} }}
                                                        </label>
                                                    </div>
                                                    <div class="col-md-8">
                                                        @if($field['type']=='checkbox')
                                                        <input id="{{$field->name_en}}" type="checkbox" name="custom_fields[{{($key+1)}}][value]" @isset(old('custom_fields')[$key+1]['value']) checked @endisset>
                                                        @else
                                                        <input class="w-100 py-1 form-control @if($field->type=='date') singledate @endif" placeholder="{{ $field->{'name_'.app()->getLocale()} }}" name="custom_fields[{{($key+1)}}][value]" type="{{ ($field->type=='date')?'text':(($field->type=='check_box')?'checkbox':$field->type) }}" id="{{$field->name_en}}" value="{{old('custom_fields') ? old('custom_fields')[$key+1]['value'] : null}}">
                                                        @endif
                                                        <input type="hidden" value="{{$field->name_ar}}" name="custom_fields[{{ ($key+1) }}][name_ar]">
                                                        <input type="hidden" value="{{$field->name_en}}" name="custom_fields[{{ ($key+1) }}][name_en]">
                                                        <input type="hidden" value="{{$field->type}}" name="custom_fields[{{ ($key+1) }}][type]">
                                                        <input type="hidden" value="{{$field->module}}" name="custom_fields[{{ ($key+1) }}][module]">
                                                    </div>
                                                </div>
                                                @endforeach
                                            </div>
                                        </div>
                                        @endif
                                    </div>
                                </div>

                                @can('settings.custom-fields.create')
                                <div>
                                    <a href="{{route('company.custom-fields.index', [$subdomain])}}" class="redirect-item">
                                        <span class="icon-Add action-icon f-30"></span>
                                        <span class="add-field">@lang('settings::custom_fields.add_custom_fields')</span>
                                    </a>
                                </div>
                                @endcan
                            </div>

                        </div>
                        @if(request('reference'))
                        <input name="reference" type="hidden" value="{{ request('reference') }}">
                        <input name="type" type="hidden" value="{{request()->query()['customer_type'] ?? $companyInfo->zatca_comply ? Modules\Sales\Enums\InvoiceTypesEnum::SIMPLIFIED_TAX_INVOICE : request('type') }}">
                        @endif
                        <input type="hidden" name="attachment_id" value="{{ request('attachment_id') }}">

                    </div>
                </div>
            </div>
        </div>
    </form>
    @include('sales::includes.redirect_popup')

</section>

@stop
@section('extra_scripts')
    <script>
        gtag('event', 'web_sales_customers_create');
        console.log('web_sales_customers_create event');
    </script>
<script src="{{ asset('assets/js/vendors/js/pickers/dateTime/moment-with-locales.min.js') }}" defer></script>
<script src="{{ asset('assets/js/vendors/js/pickers/dateTime/bootstrap-datetimepicker.min.js') }}" defer></script>
<script src="{{ asset('assets/js/vendors/js/pickers/pickadate/picker.js') }}" defer></script>
<script src="{{ asset('assets/js/vendors/js/pickers/pickadate/picker.date.js') }}" defer></script>
<script src="{{ asset('assets/js/vendors/js/pickers/pickadate/picker.time.js') }}" defer></script>
<script src="{{ asset('assets/js/vendors/js/pickers/pickadate/legacy.js') }}" defer></script>
<script src="{{ asset('assets/js/vendors/js/pickers/daterange/daterangepicker.js') }}" defer></script>
<script src="{{ asset('assets/js/custom/daterangepicker.js') }}" defer></script>
<script src="{{ asset('assets/js/vendors/js/pickers/dateTime/picker-date-time.js') }}" defer></script>
<script src="{{ asset('assets/js/custom/redirectconfirmation.js') }}" defer></script>
<script src="{{ asset('js/validation/limit-digits-in-decimal-numbers.js') }}" defer></script>
<script src="{{ asset('assets/js/general/zatca-validations.js') }}"></script>
<script src="{{ asset('assets/js/modules/sales/customers/customers-taxable-validation.js') }}" defer></script>
<script src="{{ asset('vendor/sweetalert/sweetalert.all.js') }}"></script>
<script>
    
    window.addEventListener('DOMContentLoaded', function() {
        
        $('#create-customer-form').submit(function(e) {
            // Check if the "Create associate account" is checked
            if (!$('#customer_account').prop('checked')) {
                e.preventDefault();
                Swal.fire({
                    title: '@lang("sales::customers.popup_header")',
                    html: '@lang("sales::customers.popup_message")',
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonText: '@lang("sales::customers.create_customer")',
                    cancelButtonText: '@lang("sales::customers.cancel")'
                }).then((result) => {
                    if (result.isConfirmed) {
                        this.submit();
                    }else{
                        $('#submit-button').prop('disabled', false);
                    }
                });
            }
        });
        

        $('.check-zatca-validation').on('keypress', function (e) {
            checkZatcaValidation(e);
        });

var optionalAddressRevealed = @json($revealOptionalAddress);

        function toggleSaAddressRequirements() {
            var isSA = $('#country_code').val() === 'SA';
            // The KSA-only address fields (BR-KSA-63/BR-KSA-67) are required for Saudi
            // buyers. For every other country they are optional, so they stay hidden
            // behind the toggle instead of sitting there empty.
            $('.sa-required-field').prop('required', isSA);
            $('.sa-required-asterisk').toggle(isSA);
            $('.sa-address-field').toggle(isSA || optionalAddressRevealed);
            $('.sa-address-toggle').toggle(!isSA);
            $('#toggle-optional-address').text(optionalAddressRevealed
                ? '{{ __('sales::customers.hide_address_details') }}'
                : '{{ __('sales::customers.add_address_details') }}');
        }
        $('#toggle-optional-address').on('click', function (e) {
            e.preventDefault();
            optionalAddressRevealed = !optionalAddressRevealed;
            toggleSaAddressRequirements();
        });
        $('#country_code').on('change', toggleSaAddressRequirements);
        toggleSaAddressRequirements();

        $('select[name="commercial_schema"] option:first').attr('disabled', true);
        // needed for select2
        $(".select2-custom").select2({
            allowClear: true,
            escapeMarkup: function(markup) {
                return markup;
            },
            tags: false,
            language: {
                noResults: function() {
                    return `@can('accounting.chart-of-accounts.create')

                                <a href="{{ route('company.chart-of-accounts.create',
                                        ['subdomain' => $subdomain,'reference'=>'customers',
                                            'account_type' => \Modules\Accounting\Enums\AccountingSubCategoriesEnum::CURRENT_ASSETS,
                                            'parent_id' => \Modules\Accounting\Enums\AccountsEnum::ACCOUNTS_RECEIVABLE]) }}" class="btn btn-sm btn-default h-45 redirect-item" style="padding: 0;">
                                            <span class="pull-left lh-30">@lang('settings::custom_fields.add_new_account')</span>
                                            <i class="fa fa-plus-square-o  font-large-1" aria-hidden="true"></i>
                                        </a>
                                    @endcan`;
                }
            },
        });


        if ($('#customer_account').prop("checked")) {
            let subcategoryId = $('#account_receivable_id option[value="5"]').val();
            $("#account_receivable_id").select2("val", subcategoryId);
            $("#account_receivable_id").prop('disabled', true).trigger('change');
        }else{
            $("#account_receivable_id").prop('disabled', false).trigger('change');
        }
        $('#customer_account').on('change', function() {
            if ($('#customer_account').prop("checked")) {
                let subcategoryId = $('#account_receivable_id option[value="5"]').val();
                $("#account_receivable_id").select2("val", subcategoryId);
                $("#account_receivable_id").prop('disabled', true).trigger('change');
            }else{
                $("#account_receivable_id").prop('disabled', false).trigger('change');
            }
        });
        

    });
    /* TODO:: create JS function for creating associated account of customers */
    function checkZatcaValidation(e) {
        window.parent.preventAndSymbol(e, {{$companyInfo->zatca_comply}});
    }
</script>
@endsection