@extends('layouts.admin')
@section('content')
    <section class="dashboard-sec">
        <div class="dashboard-wrapper">
            <div class="dashboard-content-wrapper p-5">
                <section class="section">
                    <div class="section-body">
                        <div class="row">
                            <div class="col-12 col-md-12 col-lg-12">
                                <div class="card">
                                   
                                    <div class='ajax-response'></div>
                                    {{-- <x-alert /> --}}
                                    <div class="card-header">
                                        @php
                                            $userType = $type == 'host' ? 'Update Host' : 'Update Member';
                                            $host = $type == 'host' ? true : false;
                                            $hostProfile = $host ? $member?->hostProfile : $member;
                                        @endphp
                                        <h4>{{ $member ? $userType : 'Add Member' }}</h4>
                                        <div class="card-header-form">
                                            <a class="btn btn-primary btn-lg float-end"
                                                href="{{ route('admin.member.list', ['role' => $type, 'status' => 'active']) }}">Back</a>
                                        </div>
                                    </div>
                                    <div class="card-body">

                                        <form
                                            action="{{ route('admin.member.store', ['id' => $member ? jsencode_userdata($member->id) : null, 'type' => $type]) }}"
                                            id="memberForm" method='POST' enctype="multipart/form-data">
                                            @csrf
                                            <div class="form-row form-cstm">
                                                {{-- <input type="hidden" name='role' value="{{ $member->getRoleNames()->first() }}"> --}}
                                                <div class="form-group col-md-12">
                                                    <label
                                                        for="inputEmail4">{{ $type == 'host' ? 'Update Host Logo' : 'Upload Profile Pic' }}</label>
                                                    <div class="parent-media">
                                                        <div class="kuch-bhi mb-3">
                                                            <img src="{{ $host ? (@$hostProfile?->profile_pic_path ? Storage::url(@$hostProfile?->profile_pic_path) : asset('images/user-sm.svg')) : Storage::url($member?->user_details?->profile_pic_path) ?? asset('images/user-sm.svg') }}"
                                                                id='profile-dp-preview' height="50" width="50"
                                                                alt="" style="background: grey;">
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="form-group col-md-6">
                                                    <label>
                                                        @if ($type == 'host')
                                                            Host By Name
                                                        @else
                                                            Username
                                                        @endif
                                                        <span class="required-field">*</span>
                                                    </label>
                                                    <div class="formfield">
                                                        <input type="text"
                                                            @if ($type == 'host') readonly @endif
                                                            class="form-control @error('username') is-invalid @enderror"
                                                            placeholder="Full Name" name="username" id="username"
                                                            value="{{ $host ? @$hostProfile->host_by_name : @$member->host_by_name }}" />
                                                        @error('username')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                @if ($type != 'host')
                                                    <div class="form-group col-md-6">
                                                        <label>Gender <span class="required-field">*</span></label>
                                                        <div class="formfield">
                                                            @php
                                                                $memberGender = $member
                                                                    ? optional(@$member->user_details)->gender
                                                                    : null;
                                                            @endphp
                                                            <select
                                                                class="form-control @error('gender') is-invalid @enderror"
                                                                name="gender" id="gender">
                                                                <option value="">Select Gender</option>
                                                                <option value="male"
                                                                    {{ ($member ? ($memberGender == 'male' ? 'selected' : '') : old('gender') == 'male') ? 'selected' : '' }}>
                                                                    Male</option>
                                                                <option value="female"
                                                                    {{ ($member ? ($memberGender == 'female' ? 'selected' : '') : old('gender') == 'female') ? 'selected' : '' }}>
                                                                    Female</option>
                                                                <option value="other"
                                                                    {{ ($member ? ($memberGender == 'other' ? 'selected' : '') : old('gender') == 'other') ? 'selected' : '' }}>
                                                                    Other</option>
                                                            </select>
                                                            @error('gender')
                                                                <span class="invalid-feedback" role="alert">
                                                                    <strong>{{ $message }}</strong>
                                                                </span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                @endif
                                                <div class="form-group col-md-6">
                                                    <label>First Name <span class="required-field">*</span></label>
                                                    <div class="formfield">
                                                        <input type="text"
                                                            @if ($type == 'host') readonly @endif
                                                            class="form-control @error('first_name') is-invalid @enderror"
                                                            placeholder="First Name" name="first_name" id="first_name"
                                                            value="{{ $host ? @$hostProfile->first_name ?? 'N/A' : @$member->first_name ?? 'N/A' }}" />
                                                        @error('first_name')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="form-group col-md-6">
                                                    <label>Last Name <span class="required-field">*</span></label>
                                                    <div class="formfield">
                                                        <input type="text"
                                                            @if ($type == 'host') readonly @endif
                                                            class="form-control @error('last_name') is-invalid @enderror"
                                                            placeholder="First Name" name="last_name" id="last_name"
                                                            value="{{ $host ? @$hostProfile->last_name ?? 'N/A' : @$member->last_name ?? 'N/A' }}" />
                                                        @error('last_name')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="form-group col-md-6">
                                                    <label>Email <span class="required-field">*</span></label>
                                                    <div class="formfield">
                                                        <input type="text"
                                                            class="form-control @error('email') is-invalid @enderror"
                                                            placeholder="Email" name="email" id="email"
                                                            value="{{ $member ? $member->email : 'N/A' }}" readonly />
                                                        @error('email')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                @if ($type != 'host')
                                                    <div class="form-group col-md-6">
                                                        <label>Bio <span class="required-field">*</span></label>
                                                        <div class="formfield">
                                                            <input type="text"
                                                                class="form-control @error('bio') is-invalid @enderror"
                                                                placeholder="Bio" name="bio" id="bio"
                                                                value="{{ $member ? optional($member->user_details)->bio : 'N/A' }}" />
                                                            @error('bio')
                                                                <span class="invalid-feedback" role="alert">
                                                                    <strong>{{ $message }}</strong>
                                                                </span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                @endif
                                                <div class="form-group col-md-6">
                                                    <label>Address <span class="required-field">*</span></label>
                                                    <div class="formfield">
                                                        <input type="text"
                                                            @if ($type == 'host') readonly @endif
                                                            class="form-control @error('address') is-invalid @enderror"
                                                            placeholder="Address" name="address" id="address"
                                                            value="{{ $host ? @$hostProfile->address ?? 'N/A' : (@$member->user_details ? @$member->user_details->address : 'N/A') }}" />
                                                        @error('address')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div>

                                                @if ($type != 'host')
                                                    <div class="form-group col-md-6">
                                                        <label>Affiliation<span class="required-field">*</span></label>
                                                        <div class="formfield">
                                                            <input type="text"
                                                                class="form-control @error('address') is-invalid @enderror"
                                                                placeholder="Affiliation" name="affiliation"
                                                                id="affiliation"
                                                                value="{{ $member ? optional($member->user_details)->affiliation : 'N/A' }}" />
                                                            @error('affiliation')
                                                                <span class="invalid-feedback" role="alert">
                                                                    <strong>{{ $message }}</strong>
                                                                </span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                @endif
                                                <div
                                                    class="form-group  @if ($type != 'host') col-md-6 @else col-md-6 @endif">
                                                    <label> Phone Number <span class="required-field">*</span></label>
                                                    <div class="formfield">
                                                        <input type='text' id="phone_number"
                                                            class="form-control  @error('phone_number') is-invalid @enderror"
                                                            name="phone_number" placeholder="Phone Number"
                                                            value="{{ @$hostProfile->phone_number }}"></input>
                                                        @error('phone_number')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div
                                                    class="form-group @if ($type == 'host') col-md-4 @else col-md-4 @endif">
                                                    <label>Country<span class="required-field">*</span></label>

                                                    <div class="formfield">
                                                        @if ($type != 'host')
                                                            <select name="country" id="country"
                                                                @if ($type == 'host') readonly @endif
                                                                class="form-control @error('country') is-invalid @enderror">
                                                                <option value=""></option>
                                                            </select>
                                                        @else
                                                            <input type="text"
                                                                @if ($type == 'host') readonly @endif
                                                                class="form-control @error('country') is-invalid @enderror"
                                                                placeholder="country" name="country" id="country"
                                                                value="{{ $host ? @$hostProfile->userCountry->upper_name ?? 'N/A' : @$member->user_details->userCountry->upper_name ?? 'N/A' }}" />
                                                        @endif
                                                        @error('country')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="form-group col-md-4">
                                                    @php
                                                        use App\Models\State;
                                                        $states = $member
                                                            ? State::where(
                                                                'country_id',
                                                                optional($member->user_details)->country,
                                                            )->get()
                                                            : null;
                                                    @endphp
                                                    <label>State<span class="required-field">*</span></label>
                                                    <div class="formfield">
                                                        @if ($type != 'host')
                                                            <select name="state" id="state"
                                                                @if ($type == 'host') readonly @endif
                                                                class="form-control @error('state') is-invalid @enderror">
                                                                <option value="">Select any</option>

                                                                @foreach ($states as $state)
                                                                    <option id="{{ $state->id }}"
                                                                        value="{{ $state->id }}"
                                                                        @if ($state->id == optional($member->user_details)->state) selected @endif>
                                                                        {{ $state->name }}</option>
                                                                @endforeach
                                                            </select>
                                                        @else
                                                            <input type="text"
                                                                @if ($type == 'host') readonly @endif
                                                                class="form-control @error('state') is-invalid @enderror"
                                                                placeholder="State" name="state" id="state"
                                                                value="{{ $host ? @$hostProfile->userState->name ?? 'N/A' : @$member->user_details->userState->name ?? 'N/A' }}" />
                                                        @endif

                                                        @error('state')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div>

                                                <div class="form-group col-md-4">
                                                    <label>Zip Code<span class="required-field">*</span></label>
                                                    <div class="formfield">
                                                        <input type="text"
                                                            @if ($type == 'host') readonly @endif
                                                            class="form-control @error('zip_code') is-invalid @enderror"
                                                            placeholder="Zip Code" name="zip_code" id="zip_code"
                                                            value="{{ $host ? $hostProfile->zip_code ?? 'N/A' : @$member->user_details->zip_code ?? 'N/A' }}" />
                                                        @error('zip_code')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div>

                                                <div class="form-group col-md-12">
                                                    <label>City<span class="required-field"></span></label>
                                                    <div class="formfield">
                                                        <input type="text"
                                                            class="form-control @error('city') is-invalid @enderror"
                                                            placeholder="Zip Code" name="city" id="city"
                                                            value="{{ $host ? $hostProfile->city ?? 'N/A' : @$member->user_details->city ?? 'N/A' }}"
                                                            disabled />
                                                        @error('city')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div>




                                                @if ($type == 'host')
                                                    <div class="form-group col-md-4">
                                                        <label>Routing Number<span class="required-field">*</span></label>
                                                        <div class="formfield">
                                                            <input type="text"
                                                                @if ($type == 'host') readonly @endif
                                                                class="form-control @error('routing_number') is-invalid @enderror"
                                                                placeholder="Routing Number" name="routing_number"
                                                                id="routing_number"
                                                                value="{{ $member && optional($member->bankDetails)->routing_number ? jsdecode_userdata($member->bankDetails->routing_number) : 'N/A' }}"
                                                                disabled />
                                                            @error('routing_number')
                                                                <span class="invalid-feedback" role="alert">
                                                                    <strong>{{ $message }}</strong>
                                                                </span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                    <div class="form-group col-md-4">
                                                        <label>Account Number<span class="required-field">* </span></label>
                                                        <div class="formfield">
                                                            <input type="text"
                                                                @if ($type == 'host') readonly @endif
                                                                class="form-control @error('account_number') is-invalid @enderror"
                                                                placeholder="Account Number" name="account_number"
                                                                id="account_number"
                                                                value="{{ $member && optional($member->bankDetails)->account_number ? jsdecode_userdata($member->bankDetails->account_number) : 'N/A' }}"
                                                                disabled />
                                                            @error('account_number')
                                                                <span class="invalid-feedback" role="alert">
                                                                    <strong>{{ $message }}</strong>
                                                                </span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                    <div class="form-group col-md-4">
                                                        <label>Non-Employee Tax Identification Number<span
                                                                class="required-field">*</span></label>
                                                        <div class="formfield">
                                                            <input type="text"
                                                                class="form-control @error('tax_number') is-invalid @enderror"
                                                                placeholder="Tax Identification Number" name="tax_number"
                                                                id="tax_number"
                                                                value="{{ $member && optional($member->bankDetails)->tax_number ? jsdecode_userdata($member->bankDetails->tax_number) : 'N/A' }}"
                                                                disabled />
                                                            @error('tax_number')
                                                                <span class="invalid-feedback" role="alert">
                                                                    <strong>{{ $message }}</strong>
                                                                </span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                @endif

                                                {{-- <div class="form-group col-md-12">
                                                    <label>Member For</label>
                                                    <select
                                                        class="form-control  @error('type') is-invalid @enderror"
                                                        tabindex="-1" aria-hidden="true" name='type'>
                                                        <option value="">Select Any</option>
                                                        <option id="male" value="male"
                                                            @if (isset($member) && $member->type == 'male') selected @endif>
                                                            Male
                                                        </option>
                                                        <option id="female" value="female"
                                                            @if (isset($member) && $member->type == 'female') selected @endif>
                                                            Female
                                                        </option>
                                                        <option id="both" value="both"
                                                            @if (isset($member) && $member->type == 'both') selected @endif>
                                                            Both
                                                        </option>
                                                    </select>
                                                    @error('type')
                                                        <span class="invalid-feedback" role="alert">
                                                            <strong>{{ $message }}</strong>
                                                        </span>
                                                    @enderror
                                                </div>
                                                <div class="form-group col-md-12">
                                                    <label>Status <span class="required-field">*</span></label>
                                                    <div class="formfield" id='estatus'>
                                                        <select name="status"
                                                            class="form-control form-select @error('status') is-invalid @enderror">
                                                            <option>Select</option>
                                                            <option value="1"
                                                                @isset($member) @if ($member->status == '1') selected @endif @endisset>
                                                                Active
                                                            </option>
                                                            <option value="0"
                                                                @isset($member) @if ($member->status == '0') selected @endif @endisset>
                                                                Inactive
                                                            </option>
                                                        </select>
                                                        @error('status')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="form-group col-md-12">
                                                    <label>About Member <span class="required-field">*</span></label>
                                                    <div class="formfield">
                                                        <textarea class="form-control @error('content') is-invalid @enderror" name="content">{{ old('content', @$page->content) }}</textarea>
                                                        @error('content')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div> --}}

                                            </div>

                                            <div class="btn-box-end">
                                                <button class="btn btn-primary mr-1" type="submit"
                                                    id="submit">{{ $member ? 'Update' : 'Submit' }}</button>

                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
            </div>
    </section>
    </div>
    </section>
@endsection

@push('pagespecificscripts')
    @includeFirst(['validation'])
    @if ($type != 'host')
        @include('validations.js_member')
    @endif
    <script src="https://cdn.tiny.cloud/1/s0z7cz8e2t06dxo8qiyuovdp5nk6z1hjd2fa2gh9d11guf29/tinymce/5/tinymce.min.js"
        referrerpolicy="origin"></script>
    <script src="{{ asset('assets/bundles/select2/dist/js/select2.full.min.js') }}"></script>
    <script>
        tinymce.init({
            selector: 'textarea',
            width: '100%',
            height: 640,
            branding: false,
            plugins: 'image code',
            toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | code",
            image_title: true,
            automatic_uploads: true,
            file_picker_types: 'image',
            setup: function(editor) {
                editor.on('init change', function() {
                    editor.save();
                });
            },
            images_upload_handler: function(blobInfo, success, failure) {
                var xhr, formData;
                xhr = new XMLHttpRequest();
                xhr.withCredentials = false;
                xhr.onload = function() {
                    var json;
                    if (xhr.status != 200) {
                        failure('HTTP Error: ' + xhr.status);
                        return;
                    }
                    json = JSON.parse(xhr.responseText);
                    if (!json || typeof json.location != 'string') {
                        failure('Invalid JSON: ' + xhr.responseText);
                        return;
                    }
                    success(json.location);
                };
                formData = new FormData();
                formData.append('file', blobInfo.blob(), blobInfo.filename());
                formData.append('_token', '{{ csrf_token() }}');
                xhr.send(formData);
            },
            file_picker_callback: function(cb, value, meta) {
                var input = document.createElement('input');
                input.setAttribute('type', 'file');
                input.setAttribute('accept', 'image/*');
                input.onchange = function() {
                    var file = this.files[0];
                    var reader = new FileReader();
                    reader.onload = function() {
                        var id = 'blobid' + (new Date()).getTime();
                        var blobCache = tinymce.activeEditor.editorUpload.blobCache;
                        var base64 = reader.result.split(',')[1];
                        var blobInfo = blobCache.create(id, file, base64);
                        blobCache.add(blobInfo);
                        cb(blobInfo.blobUri(), {
                            title: file.name
                        });
                    };
                    reader.readAsDataURL(file);
                };
                input.click();
            },
            content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px }',
        });
    </script>
    <script>
        // errorShow Popup
        function errorShow(title, text, confirmButtonText) {
            Swal.fire({
                title: title,
                text: text,
                icon: 'error',
                confirmButtonColor: "#3085d6",
                confirmButtonText: confirmButtonText || "OK"
            });
        }
        // show profile image preview
        const existingPic = "{{ $member ? $member->profile_pic_path : asset('images/user-sm.svg') }}";
        const input = document.getElementById('upload-dp');
        const previewPhoto = () => {
            const file = input.files;
            if (file) {
                const fileReader = new FileReader();
                const preview = document.getElementById('profile-dp-preview');
                const fileSize = file[0].size;
                const maxSize = 2 * 1024 * 1024;

                if (fileSize > maxSize) {
                    errorShow('Error', 'File size exceeds the maximum limit of 2MB.', 'Try again');
                    preview.setAttribute('src', existingPic);
                    return;
                }
                // check format
                const allowedFormats = ['image/jpeg', 'image/png', 'image/jpg'];
                if (!allowedFormats.includes(file[0].type)) {
                    errorShow('Error', 'Invalid file format. Please upload a JPEG, JPG or PNG image.', 'Try again');
                    preview.setAttribute('src', existingPic);
                    return;
                }
                fileReader.onload = function(event) {
                    preview.setAttribute('src', event.target.result);
                }
                fileReader.readAsDataURL(file[0]);
            }
        }
        // input.addEventListener("change", previewPhoto);
        //show country and states selected
        jQuery(document).ready(function() {

            let url = "{{ route('countries') }}";

            //hit the ajax
            let response = ajaxCall(url, 'get');
            response.then(function(response) {
                let html = '<option value="" ></option> ';
                if (response.status) {

                    // setting country options
                    jQuery.each(response.data, function(key, value) {
                        html +=
                            `<option id="${value.id}" value="${value.id}" ${(value.id == "{{ optional($member->user_details)->country }}") ? 'selected' : ' '}>${value.name}</option>`;
                    });
                    jQuery('#country').html(html);
                }

                jQuery('#country').change(function() {
                    //get the country id
                    let id = jQuery(this).find('option:selected').attr('id');


                    let urlState = APP_URL + '/states/' + id;

                    //hit the ajax
                    let result = ajaxCall(urlState, 'get');
                    result.then(function(result) {
                        let stateHtml = '<option value="" ></option> ';
                        if (result.status) {
                            //setting options
                            jQuery.each(result.data, function(key, value) {
                                stateHtml +=
                                    `<option id="${value.id}" value="${value.id}" >${value.name}</option>`;
                            });
                            jQuery('#state').html(stateHtml);
                        }
                    })
                })
            });

            $("#phone_number").keypress(function(e) {
                if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
                    return false;
                }
                var curchr = this.value.length;
                var curval = $(this).val();
                if (curchr == 3 && curval.indexOf("-") <= -1) {
                    $(this).val(curval + "-");
                } else if (curchr == 4 && curval.indexOf("-") > -1) {
                    $(this).val(curval + "-");
                } else if (curchr == 7 && curval.indexOf("-") > -1) {
                    $(this).val(curval + "-");
                } else if (curchr == 9) {
                    // $(this).val(curval + "-");
                    $(this).attr('maxlength', '12');
                }
            });

        });

        //FORMATTING PHONE NUMBER INTO (323-232-3232) FORMAT    
        // function formatPhoneNumber(input) {
        //     // Remove all non-digit characters
        //     const cleaned = ('' + input).replace(/\D/g, '');
        //     if (cleaned.length >= 11) {
        //         return false;
        //     }
        //     // Split the cleaned number into groups of 3 and 4
        //     const parts = [];
        //     for (let i = 0; i < cleaned.length; i += 3) {
        //         if (cleaned.length > 6)
        //             parts.push(cleaned.substring(i, i + 4));
        //         else
        //             parts.push(cleaned.substring(i, i + 3));
        //     }


        //     return parts.join('-');
        //     // Join the parts with hyphens    
        // }

        // function handleInput(event) {
        //     const inputField = event.target;
        //     if (inputField.value.length > 10) {
        //         return false;
        //     }
        //     const formattedNumber = formatPhoneNumber(inputField.value);
        //     inputField.value = formattedNumber;
        // }
    </script>
@endpush