@extends('layouts.dashboard.app')
@section('title', 'Edit Config information | Chemical Wholesale')
@section('content')
    <div class="cw-content">
        <div class="container-fluid">
            <div class="cw-content-inner">
                <div class="cw-content-body">
                    <div class="cw-block-head cw-block-head-sm">
                        <div class="cw-block-between d-flex justify-content-between align-items-center">
                            <div class="cw-block-head-content">
                                <h3 class="cw-block-title page-title">Update Configuration</h3>
                                <div class="cw-block-des text-soft">
                                    <p>Update common configurations.</p>
                                </div>
                            </div>
                        </div>
                    </div>
                    @include('layouts.dashboard.flash')
                    <form id="configForm" action="{{ route('admin.config.update', @$config['uuid']) }}" method="POST"
                        enctype="multipart/form-data">
                        @csrf
                        @method('PUT')
                        <div class="card">
                            <div class="card-body px-3">
                                <div class="row gx-5 align-items-center">
                                    <div class="col-lg-12">
                                        <div class="row">
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Support Email Address</label>
                                                <input class="form-control onboarding-input" type="text" maxlength="100"
                                                    placeholder="Support Email Address" id="support_email"
                                                    value="{{ old('support_email') ? old('support_email') : @$config['support_email'] }}"
                                                    name="support_email" autofocus>
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Support Phone Number </label>
                                                <input class="form-control onboarding-input" type="text" onkeyup="this.value = this.value.replace(/[^0-9\s\-\(\)]/g, '')"
                                                    placeholder="Support Phone Number" id="support_phone" maxlength="20"
                                                    value="{{ old('support_phone') ? old('support_phone') : @$config['support_phone'] }}"
                                                    name="support_phone">
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Company Email Address</label>
                                                <input class="form-control onboarding-input" type="text" maxlength="100"
                                                    placeholder="Company Email Address" id="company_email"
                                                    value="{{ old('company_email') ? old('company_email') : @$config['company_email'] }}"
                                                    name="company_email">
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Company Phone Number </label>
                                                <input class="form-control onboarding-input" type="text" maxlength="20" onkeyup="this.value = this.value.replace(/[^0-9\s\-\(\)]/g, '')" placeholder="Company Phone Number" id="company_phone"
                                                    value="{{ old('company_phone') ? old('company_phone') : @$config['company_phone'] }}"
                                                    name="company_phone">
                                            </div>
                                        </div>
                                        <div class="row border-top pt-3">
                                            <div class="col-lg-4 mb-3">
                                                <div class="">
                                                    <label class="form-label">Address</label>
                                                    <input type="text" class="form-control onboarding-input" maxlength="100"
                                                        name="address_1" id="address_1" placeholder="Address 1"
                                                        value="{{ old('address_1') ? old('address_1') : @$config['address_1'] }}">
                                                </div>
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <div class="">
                                                    <label class="form-label" style="opacity: 0">Address 2</label>
                                                    <input type="text" class="form-control onboarding-input" maxlength="100"
                                                        name="address_2" id="address_2" placeholder="Address 2"
                                                        value="{{ old('address_2') ? old('address_2') : @$config['address_2'] }}">
                                                </div>
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <div class="">
                                                    <label class="form-label">Country</label>
                                                    <select name="country_id" id="country_id"
                                                        class="form-control form-select onboarding-input country_id">
                                                        <option disabled>Select Country</option>
                                                        @foreach (Common::country() as $country)
                                                            <option value="{{ $country['id'] }}"
                                                                {{ empty($config['country_id']) && $country['iso2_code'] == 'US' ? 'selected' : (!empty($config['country_id']) && $config['country_id'] == $country['id'] ? 'selected' : '') }}>
                                                                {{ $country['name_en'] }}
                                                            </option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <div class="">
                                                    <label class="form-label">State / Province:</label>
                                                    <input type="text" class="form-control onboarding-input"
                                                        name="state" placeholder="State" id="state" maxlength="100"
                                                        value="{{ old('state') ? old('state') : @$config['state'] }}">
                                                </div>
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <div class="">
                                                    <label class="form-label">City</label>
                                                    <input type="text" class="form-control onboarding-input"
                                                        name="city" placeholder="City" value=""
                                                        id="city" maxlength="100"
                                                        value="{{ old('city') ? old('city') : @$config['city'] }}">
                                                </div>
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <div class="">
                                                    <label class="form-label">ZIP Code</label>
                                                    <input type="text" class="form-control onboarding-input"
                                                        name="zipcode" placeholder="ZIP Code" id="zipcode" maxlength="10"
                                                        value="{{ old('zipcode') ? old('zipcode') : @$config['zipcode'] }}">
                                                </div>
                                            </div>
                                            {{--
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Currency</label>
                                                <select name="currency" id="currency" class="form-control form-select">
                                                    <option value="">Select Currency</option>
                                                    @if ($currency->count() > 0)
                                                        @foreach ($currency as $cuur)
                                                            <option value="{{ $cuur->id }}"
                                                                {{ $config['currency'] == $cuur->id ? 'selected="true"' : '' }}>
                                                                {{ $cuur->name . ' (' . $cuur->symbole . ')' }}</option>
                                                        @endforeach
                                                    @endif
                                                </select>
                                            </div> --}}
                                        </div>
                                        <div class="row border-top pt-3">
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Facebook Link </label>
                                                <input class="form-control onboarding-input" type="text"
                                                    placeholder="Facebook link" id="facebook_link"
                                                    value="{{ old('facebook_link') ? old('facebook_link') : @$config['facebook_link'] }}"
                                                    name="facebook_link">
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Twitter Link </label>
                                                <input class="form-control onboarding-input" type="text"
                                                    placeholder="Twitter link" id="twitter_link"
                                                    value="{{ old('twitter_link') ? old('twitter_link') : @$config['twitter_link'] }}"
                                                    name="twitter_link">
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Instagram Link </label>
                                                <input class="form-control onboarding-input" type="text"
                                                    placeholder="Instagram link" id="instagram_link"
                                                    value="{{ old('instagram_link') ? old('instagram_link') : @$config['instagram_link'] }}"
                                                    name="instagram_link">
                                            </div>
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Linkedin Link</label>
                                                <input class="form-control onboarding-input" type="text"
                                                    placeholder="Linkedin link" id="linkedin_link"
                                                    value="{{ old('linkedin_link') ? old('linkedin_link') : @$config['linkedin_link'] }}"
                                                    name="linkedin_link">
                                            </div>
                                        </div>
                                        <div class="row border-top pt-3 d-none">
                                            <div class="col-lg-4">
                                                <div class="row">
                                                    <div class="col-lg-12 mb-3">
                                                        <label class="form-label">Upload logo</label>
                                                        <div class="imgpreview-container">
                                                            <img src="/{{ @$config['logo'] }}" alt=""
                                                                id="logoimg" class="imgpreview-img"
                                                                onerror="src='/assets/img/noimg.jpg'">
                                                        </div>
                                                        <input type="file" name="logo" id="logo"
                                                            data-prvid="logoimg" class="form-control logo"
                                                            onchange="readURL(this);" accept="image/jpeg, image/png">

                                                        <span class="upload-file-msg">Recommended size: 330 x 96 | Supported
                                                            File types - PNG, JPG</span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-lg-4">
                                                <div class="row">
                                                    <div class="col-lg-12 mb-3">
                                                        <label class="form-label">Upload favicon</label>
                                                        <div class="imgpreview-container">
                                                            <img src="/{{ @$config['favicon'] }}" alt=""
                                                                id="faviconimg" class="imgpreview-img"
                                                                onerror="src='/assets/img/noimg.jpg'">
                                                        </div>
                                                        <input type="file" name="favicon" id="favicon"
                                                            data-prvid="faviconimg" class="form-control favicon"
                                                            onchange="readURL(this);" accept=".png,.jpg,.jpeg">

                                                        <span class="upload-file-msg">Recommended size: 32 x 32 | Supported
                                                            File types - PNG/ JPG</span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row border-top pt-3">
                                            <div class="col-lg-4 mb-3">
                                                <label class="form-label">Display Header Announcement</label>
                                                <div class="d-flex mb-3 product-enable-div">
                                                    <span class="product-enable-label me-4">Show</span>
                                                    <div class="form-check form-switch">
                                                        <input class="form-check-input product-switch announcement_flag" type="checkbox"
                                                            {{ @$config['announcement_flag'] ? 'checked' : '' }} data-id="{{ @$config['id'] }}"
                                                            data-status="{{ @$config['announcement_flag'] ? 0 : 1 }}" name="announcement_flag" value="1">
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-lg-4 mb-3 systemimageflag" style="display:{{ @$config['announcement_flag'] ? 'block':'none';}}">
                                                <label class="form-label">Header Announcement Type</label>
                                                <div class="d-flex mb-3 product-enable-div">
                                                    <span class="product-enable-label me-4">Text</span>
                                                    <div class="form-check form-switch">
                                                        <input class="form-check-input product-switch announcement_type" type="checkbox"
                                                            {{ @$config['announcement_type'] ? 'checked' : '' }} data-id="{{ @$config['id'] }}"
                                                            data-status="{{ @$config['announcement_type'] ? 0 : 1 }}" name="announcement_type" value="1">
                                                    </div>
                                                    <span class="product-enable-label ms-4">Image</span>
                                                </div>
                                            </div>
                                            <div class="col-lg-4 mb-3 headerimage" style="display:{{ (@$config['announcement_flag'] && @$config['announcement_type']) ? 'block':'none';}}">
                                                <div class="row">
                                                    <div class="col-lg-12 mb-3">
                                                        <label class="form-label">Upload Announcement Image</label>
                                                        <div class="imgpreview-container">
                                                            <img src="/{{ @$config['announcement_image'] }}" alt=""
                                                                id="systemflagimg" class="imgpreview-img"
                                                                onerror="src='/assets/img/noimg.jpg'">
                                                        </div>
                                                        <input type="file" name="announcement_image" id="announcement_image"
                                                            data-prvid="systemflagimg" class="form-control favicon onboarding-input"
                                                            onchange="readURL(this);" accept="image/jpeg, image/png">

                                                        <span class="upload-file-msg">Recommended size: 600 x 50 | Supported
                                                        File types - PNG, JPG</span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-lg-4 mb-3 headertext" style="display:{{ (@$config['announcement_flag'] && !@$config['announcement_type']) ? 'block':'none';}}">
                                                <label class="form-label">Announcement Note</label>
                                                <input class="form-control onboarding-input" type="text"
                                                    placeholder="Announcement Note" id="announcement_note"
                                                    value="{{ old('announcement_note') ? old('announcement_note') : @$config['announcement_note'] }}"
                                                    name="announcement_note">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div>
                                    <button type="submit" class="btn-formpage-submit">Save</button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('css')
    <style>
        label {
            font-size: 14px;
            color: #000;
            font-weight: 600;
        }

        .form-control {
            box-shadow: none !important;
            border-radius: 5px;
            padding: 10px;
            border: 1px solid #ddd;
            font-size: 14px;
        }
    </style>
@endpush
@push('js')
    <!-- Validation js for this page-->
    <script src="{{ asset('assets/dashboard/js/form-validation.js') }}"></script>
    <script src="{{ asset('assets/dashboard/js/common.js?v1.0.1') }}"></script>
    <!-- End Validation js for this page-->
    <script type="text/javascript">
        $("#country_id").select2();

        $('.announcement_flag').on('change', function(e) {
            if($(this).is(':checked')){
                $(".systemimageflag").show();
                $(".headertext").show();
            }else{
                $(".systemimageflag").hide();
                $(".headertext").hide();
                $(".headerimage").hide();
                $(".announcement_type").prop('checked', false);
            }
        }); // Update Status

        $('.announcement_type').on('change', function(e) {
            if($(this).is(':checked')){
                $(".headertext").hide();
                $(".headerimage").show();
            }else{
                $(".headerimage").hide();
                $(".headertext").show();
            }
        }); // Update Status
    </script>    
    <script>
        $('form').submit(function(e) {
            var submitBtn = $(this).find('button[type="submit"]');
            submitBtn.html('<span class="spinner me-2"></span>Saving');
            setTimeout(function() {
                submitBtn.removeAttr('disabled');
                submitBtn.html('Save');
            }, 1000);
        });
    </script>
    <script>
        $(document).ready(function () {
            var autofocusElement = $('input[autofocus]').filter(function () {
            return $(this).val().length > 0;
            }).first();

            if (autofocusElement.length) {
            var autofocuslength = autofocusElement.val().length;
            autofocusElement[0].setSelectionRange(autofocuslength, autofocuslength);
            autofocusElement.focus();
            }
        });
    </script>
@endpush