@php
    use App\Enums\ContactFieldType;
    use App\Enums\InquiryContentRequireType;
@endphp
<div class="contact-block relative" data-aos="fade-up"
    v-if="filterContactForm(fieldPropertyValue('contact_form_id', item), index)">
    <div class="container">
        <div class="main-heading" data-aos="fade-up">
            <div class="flex-auto">
                <div class="heading-line"></div>
            </div>
            <div class="text">CONTACT US</div>
            <div class="flex-auto">
                <div class="heading-line"></div>
            </div>
        </div>
        <div class="contact-content" data-aos="fade-up">
            {{-- <div class="contact-header" v-html="setTextDefault(textLocale('send_text', forms[index]))">
            </div> --}}
            <div class="contact-form">
                <form class="form" id="basic-form" method="post" action="{{ route('api.v2.sendContactV2') }}"
                    :data-success="setTextDefault(textLocale('send_text', forms[index]))">
                    <input type="hidden" name="project_type" value="{{ $project->domain_type }}">
                    <input type="hidden" name="project_domain" value="{{ $project->domain }}">
                    <input type="hidden" name="admin_email" :value="fieldPropertyValue('admin_email', forms[index])">
                    <input type="hidden" name="emails"
                        :value="fieldPropertyValue('mail_contact_forms', forms[index]) ? JSON.stringify(fieldPropertyValue(
                            'mail_contact_forms', forms[index])) : ''">
                    <input type="hidden" name="fields"
                        :value="JSON.stringify(fieldPropertyValue('contact_form_fields', forms[index]))">
                    <input type="hidden" name="subject" :value="setTextDefault(textLocale('subject', forms[index]))">
                    <input type="hidden" name="reply_content_header"
                        :value="setTextDefault(textLocale('reply_content_header', forms[index]))">
                    <input type="hidden" name="reply_content_footer"
                        :value="setTextDefault(textLocale('reply_content_footer', forms[index]))">
                    <input type="hidden" name="mail_name"
                        :value="setTextDefault(textLocale('email_name', forms[index]))">
                    <input type="hidden" name="lang" :value="lang">
                    <div class="form-group"
                        v-for="contactFormField in fieldPropertyValue('contact_form_fields', forms[index])">
                        <div class="label"
                            v-if="fieldPropertyValue('type', contactFormField) != {{ ContactFieldType::CONSENT_CHECK }}">
                            <span v-html="setTextDefault(textLocale('name', contactFormField))"></span>
                            <font color="red"
                                v-if="fieldPropertyValue('type', contactFormField) == {{ ContactFieldType::EMAIL }} || fieldPropertyValue('type', contactFormField) == {{ ContactFieldType::NAME }} || fieldPropertyValue('is_required', contactFormField) == {{ InquiryContentRequireType::REQUIRED }}">
                                *</font>
                        </div>
                        <input class="form-control"
                            v-if="fieldPropertyValue('type', contactFormField) == {{ ContactFieldType::EMAIL }}"
                            :name="fieldPropertyValue('id', contactFormField)" type="email"
                            :placeholder="setTextDefault(textLocale('placeholder', contactFormField))"
                            data-validate="required|email" />
                        <input class="form-control"
                            v-if="fieldPropertyValue('type', contactFormField) == {{ ContactFieldType::TEXT_BOX }} || fieldPropertyValue('type', contactFormField) == {{ ContactFieldType::NAME }}"
                            :name="fieldPropertyValue('id', contactFormField)" type="text"
                            :placeholder="setTextDefault(textLocale('placeholder', contactFormField))"
                            :data-validate="fieldPropertyValue('type', contactFormField) == @json(ContactFieldType::NAME) ||
                                fieldPropertyValue('is_required', contactFormField) == @json(InquiryContentRequireType::REQUIRED) ?
                                'required' : ''" />
                        <select
                            v-if="fieldPropertyValue('type', contactFormField) == {{ ContactFieldType::DROP_DOWN }}"
                            class="form-control" :name="fieldPropertyValue('id', contactFormField)"
                            :data-validate="fieldPropertyValue('is_required', contactFormField) ==
                                @json(InquiryContentRequireType::REQUIRED) ? 'required' : ''">
                            <option value=""></option>
                            <option v-for="value in textLocale('option', contactFormField).split('\n')"
                                :value="value" v-html="value">
                            </option>
                        </select>
                        <div class="radio-group"
                            v-if="fieldPropertyValue('type', contactFormField) == {{ ContactFieldType::RADIO_BUTTON }}">
                            <label v-for="(value, ind) in textLocale('option', contactFormField).split('\n')">
                                <input type="radio" :name="fieldPropertyValue('id', contactFormField)"
                                    :value="value"
                                    :data-validate="fieldPropertyValue('is_required', contactFormField) ==
                                        @json(InquiryContentRequireType::REQUIRED) ? 'required' : ''" />
                                <span v-html="value"></span>
                            </label>
                        </div>
                        <div class="checkbox-group"
                            v-if="fieldPropertyValue('type', contactFormField) == {{ ContactFieldType::CHECKBOX }}">
                            <label v-for="(value, ind) in textLocale('option', contactFormField).split('\n')">
                                <input type="checkbox" :name="`${fieldPropertyValue('id', contactFormField)}[]`"
                                    :value="value"
                                    :data-validate="fieldPropertyValue('is_required', contactFormField) ==
                                        @json(InquiryContentRequireType::REQUIRED) ? 'required' : ''" />
                                <span v-html="value"></span>
                            </label>
                        </div>

                        <div class="custom-input-number"
                            v-if="fieldPropertyValue('type', contactFormField) == {{ ContactFieldType::NUMBER }}">
                            <a href="javascript:;" class="minus">-</a>
                            <input type="number" :name="fieldPropertyValue('id', contactFormField)"
                                :value="fieldPropertyValue('min_value', contactFormField)"
                                :min="fieldPropertyValue('min_value', contactFormField)"
                                :max="fieldPropertyValue('max_value', contactFormField)" number disabled />
                            <a href="javascript:;" class="plus">+</a>
                        </div>
                        <input v-if="fieldPropertyValue('type', contactFormField) == {{ ContactFieldType::DATE }}"
                            class="form-control" :name="fieldPropertyValue('id', contactFormField)" type="date"
                            :data-validate="fieldPropertyValue('is_required', contactFormField) ==
                                @json(InquiryContentRequireType::REQUIRED) ? 'required|validDate' : 'validDate'" />
                        <textarea v-if="fieldPropertyValue('type', contactFormField) == {{ ContactFieldType::TEXTAREA }}"
                            :name="fieldPropertyValue('id', contactFormField)"
                            :placeholder="setTextDefault(textLocale('placeholder', contactFormField))" rows="3"
                            :data-validate="fieldPropertyValue('is_required', contactFormField) ==
                                @json(InquiryContentRequireType::REQUIRED) ? 'required' : ''"></textarea>

                        <div class="checkbox-group"
                            v-if="fieldPropertyValue('type', contactFormField) == {{ ContactFieldType::CONSENT_CHECK }}">
                            <label>
                                <input class="consent-check" type="checkbox"
                                    :name="fieldPropertyValue('id', contactFormField)" />
                                <span></span>
                            </label>
                            <a :href="setTextDefault(textLocale('url', contactFormField))"
                                v-html="setTextDefault(textLocale('name', contactFormField))"></a>
                        </div>
                    </div>
                    <div class="form-group">
                        <button class="btn-submit" type="submit">
                            <i class="fa fa-refresh fa-spin loading-button"></i>
                            <span v-html="setTextDefault(textLocale('send_button', forms[index]))"></span>
                        </button>
                    </div>
                    <div class="message"></div>
                </form>
            </div>
        </div>
    </div>
</div>