@extends('ui-common.layouts.master')
@section('title')
@lang('Vendor Master Add')
@endsection
@section('css')
<!-- select2@4.1.0 -->
<link href="{{ url('css/Select2_cdn/select2.min.css') }}" rel="stylesheet" />
<!-- font-awesome-6.7.2 -->
<link href="{{ url('css/font-awesome_cdn/font-awesome.min.css') }}" rel="stylesheet" />
<link href="{{ url('css/task/task.add.css') }}" rel="stylesheet" />
<link rel="stylesheet" href="{{ url('js/libs/filepond/filepond.min.css') }}" type="text/css" />
<link rel="stylesheet" href="{{ url('js/libs/filepond-plugin-image-preview/filepond-plugin-image-preview.min.css') }}">
@endsection
@section('content')
@component('tenants.components.breadcrumb')
@slot('li_1')
Vendor Master Add
@endslot
@slot('title')
Vendor Master
@endslot
@endcomponent

<div class="row">
    <div class="col-12 p-0">
        <div class="card pb-2">
            <form id="safetymeetingskForm">
                <div class="card-header d-flex align-items-center justify-content-between pos-sticky">
                    <h4 class="card-title">Vendor Master Details</h4>
                    <div class="d-flex gap-2 flex-wrap">
                        <button class="btn reset_btn" type="button">Cancel </button>
                        <button type="submit" class="btn btn_primary">Save</button>
                    </div>
                </div>
                <div class="row py-3 px-4 gy-4">
                    <div class="col-xxl-4 col-md-6 col-lg-4">
                        <div class="form-group ">
                            <label class="form-label">
                              Vendor Name<sup class="required-start-icon ">*</sup> </label>
                            <div class="input-field">
                                <span class="icon">
                                <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18"
                                                    viewBox="0 0 21 20" fill="none">
                                                    <path
                                                        d="M10.5003 8.33366C12.3413 8.33366 13.8337 6.84127 13.8337 5.00033C13.8337 3.15938 12.3413 1.66699 10.5003 1.66699C8.65938 1.66699 7.16699 3.15938 7.16699 5.00033C7.16699 6.84127 8.65938 8.33366 10.5003 8.33366Z"
                                                        stroke="#96A5B8" stroke-width="1.5" />
                                                    <path
                                                        d="M17.1673 14.584C17.1673 16.6548 17.1673 18.334 10.5007 18.334C3.83398 18.334 3.83398 16.6548 3.83398 14.584C3.83398 12.5132 6.81898 10.834 10.5007 10.834C14.1823 10.834 17.1673 12.5132 17.1673 14.584Z"
                                                        stroke="#96A5B8" stroke-width="1.5" />
                                                </svg>
                                </span>
                                <input type="text" class="form-control" placeholder="Enter Vendor Name"
                                    name="vendor_name">
                            </div>
                        </div>
                    </div>
                    <div class="col-xxl-4 col-md-6 col-lg-4">
                        <div class="form-group ">
                            <label class="form-label">
                                Contact Person</label>
                            <div class="input-field">
                                <span class="icon">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24"
                                        fill="none">
                                        <path fill-rule="evenodd" clip-rule="evenodd"
                                            d="M10.9436 1.25H13.0564C14.8942 1.24998 16.3498 1.24997 17.489 1.40314C18.6614 1.56076 19.6104 1.89288 20.3588 2.64124C21.1071 3.38961 21.4392 4.33856 21.5969 5.51098C21.75 6.65019 21.75 8.10583 21.75 9.94359V14.0564C21.75 15.8942 21.75 17.3498 21.5969 18.489C21.4392 19.6614 21.1071 20.6104 20.3588 21.3588C19.6104 22.1071 18.6614 22.4392 17.489 22.5969C16.3498 22.75 14.8942 22.75 13.0564 22.75H10.9436C9.10583 22.75 7.65019 22.75 6.51098 22.5969C5.33856 22.4392 4.38961 22.1071 3.64124 21.3588C2.89288 20.6104 2.56076 19.6614 2.40314 18.489C2.24997 17.3498 2.24998 15.8942 2.25 14.0564V9.94358C2.24998 8.10582 2.24997 6.65019 2.40314 5.51098C2.56076 4.33856 2.89288 3.38961 3.64124 2.64124C4.38961 1.89288 5.33856 1.56076 6.51098 1.40314C7.65019 1.24997 9.10582 1.24998 10.9436 1.25ZM6.71085 2.88976C5.70476 3.02502 5.12511 3.27869 4.7019 3.7019C4.27869 4.12511 4.02502 4.70476 3.88976 5.71085C3.75159 6.73851 3.75 8.09318 3.75 10V14C3.75 15.9068 3.75159 17.2615 3.88976 18.2892C4.02502 19.2952 4.27869 19.8749 4.7019 20.2981C5.12511 20.7213 5.70476 20.975 6.71085 21.1102C7.73851 21.2484 9.09318 21.25 11 21.25H13C14.9068 21.25 16.2615 21.2484 17.2892 21.1102C18.2952 20.975 18.8749 20.7213 19.2981 20.2981C19.7213 19.8749 19.975 19.2952 20.1102 18.2892C20.2484 17.2615 20.25 15.9068 20.25 14V10C20.25 8.09318 20.2484 6.73851 20.1102 5.71085C19.975 4.70476 19.7213 4.12511 19.2981 3.7019C18.8749 3.27869 18.2952 3.02502 17.2892 2.88976C16.2615 2.75159 14.9068 2.75 13 2.75H11C9.09318 2.75 7.73851 2.75159 6.71085 2.88976ZM7.25 8C7.25 7.58579 7.58579 7.25 8 7.25H16C16.4142 7.25 16.75 7.58579 16.75 8C16.75 8.41421 16.4142 8.75 16 8.75H8C7.58579 8.75 7.25 8.41421 7.25 8ZM7.25 12C7.25 11.5858 7.58579 11.25 8 11.25H16C16.4142 11.25 16.75 11.5858 16.75 12C16.75 12.4142 16.4142 12.75 16 12.75H8C7.58579 12.75 7.25 12.4142 7.25 12ZM7.25 16C7.25 15.5858 7.58579 15.25 8 15.25H13C13.4142 15.25 13.75 15.5858 13.75 16C13.75 16.4142 13.4142 16.75 13 16.75H8C7.58579 16.75 7.25 16.4142 7.25 16Z"
                                            fill="#868C98"></path>
                                    </svg>
                                </span>
                                <input type="text" class="form-control" placeholder="Enter  Contact Person"
                                    name="contact_Person">
                            </div>
                        </div>
                    </div>
                    <div class="col-xxl-4 col-md-6 col-lg-4">
                        <div class="form-group ">
                            <label class="form-label">
                                Phone Number<sup class="required-start-icon ">*</sup> </label>
                            <div class="input-field">
                                <span class="icon">
                                <svg xmlns="http://www.w3.org/2000/svg" width="21" height="20"
                                                    viewBox="0 0 21 20" fill="none">
                                                    <path
                                                        d="M7.487 2.06617L6.77 2.28217C6.13158 2.4747 5.56144 2.8456 5.12669 3.35121C4.69194 3.85682 4.41068 4.47611 4.316 5.13617C4.019 7.20417 4.683 9.62217 6.284 12.3952C7.881 15.1612 9.639 16.9432 11.574 17.7232C12.1957 17.9737 12.8763 18.0405 13.5349 17.9155C14.1935 17.7906 14.8023 17.4791 15.289 17.0182L15.831 16.5042C16.1829 16.1711 16.402 15.7215 16.4474 15.2391C16.4929 14.7566 16.3616 14.2741 16.078 13.8812L14.722 12.0012C14.5387 11.7474 14.2805 11.5573 13.9837 11.4576C13.6869 11.3579 13.3664 11.3535 13.067 11.4452L11.016 12.0722L10.963 12.0822C10.737 12.1152 10.215 11.6262 9.565 10.5002C8.885 9.32217 8.745 8.63317 8.932 8.45517L9.975 7.48217C10.356 7.12638 10.6163 6.66037 10.7194 6.14935C10.8225 5.63833 10.7633 5.10787 10.55 4.63217L9.888 3.16117C9.68894 2.71851 9.3357 2.36335 8.89413 2.16188C8.45256 1.96042 7.9518 1.9264 7.487 2.06617ZM8.978 3.57117L9.638 5.04217C9.76608 5.32749 9.80178 5.64571 9.7401 5.95231C9.67842 6.25892 9.52245 6.53858 9.294 6.75217L8.248 7.72617C7.578 8.36017 7.8 9.44217 8.7 11.0002C9.546 12.4662 10.318 13.1902 11.148 13.0642L11.272 13.0382L13.36 12.4012C13.4598 12.3705 13.5667 12.3719 13.6657 12.405C13.7647 12.4382 13.8508 12.5016 13.912 12.5862L15.268 14.4662C15.41 14.6626 15.4758 14.904 15.4532 15.1453C15.4305 15.3866 15.321 15.6115 15.145 15.7782L14.602 16.2922C14.2543 16.6212 13.8195 16.8435 13.3493 16.9327C12.879 17.0218 12.393 16.9741 11.949 16.7952C10.251 16.1112 8.646 14.4842 7.151 11.8952C5.652 9.30017 5.045 7.09317 5.306 5.27817C5.37356 4.8066 5.57445 4.36415 5.88502 4.00292C6.19559 3.64168 6.6029 3.3767 7.059 3.23917L7.776 3.02317C8.00846 2.95332 8.25839 2.9704 8.47918 3.07123C8.69997 3.17206 8.87656 3.34975 8.976 3.57117"
                                                        fill="#96A5B8" />
                                                </svg>
                                </span>
                                <input type="text" class="form-control" placeholder="Enter Phone Number"
                                    name="phone_number">
                            </div>
                        </div>
                    </div>
                    <div class="col-xxl-4 col-md-6 col-lg-4">
                        <div class="form-group ">
                            <label class="form-label">
                                Email Address<sup class="required-start-icon ">*</sup> </label>
                            <div class="input-field">
                                <span class="icon">
                                <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18"
                                                    viewBox="0 0 25 24" fill="none">
                                                    <path d="M7.5 9L12.5 12.5L17.5 9" stroke="#96A5B8" stroke-width="1.5"
                                                        stroke-linecap="round" stroke-linejoin="round" />
                                                    <path
                                                        d="M2.5 17V7C2.5 6.46957 2.71071 5.96086 3.08579 5.58579C3.46086 5.21071 3.96957 5 4.5 5H20.5C21.0304 5 21.5391 5.21071 21.9142 5.58579C22.2893 5.96086 22.5 6.46957 22.5 7V17C22.5 17.5304 22.2893 18.0391 21.9142 18.4142C21.5391 18.7893 21.0304 19 20.5 19H4.5C3.96957 19 3.46086 18.7893 3.08579 18.4142C2.71071 18.0391 2.5 17.5304 2.5 17Z"
                                                        stroke="#96A5B8" stroke-width="1.5" />
                                                </svg>
                                </span>
                                <input type="text" class="form-control" placeholder="Enter Email Address"
                                    name="email_address">
                            </div>
                        </div>
                    </div>
                    <div class="col-xxl-4 col-md-6 col-lg-4">
                        <div class="form-group ">
                            <label class="form-label">
                                City</label>
                            <div class="input-field">
                                <span class="icon">
                                <svg xmlns="http://www.w3.org/2000/svg" width="21" height="20" viewBox="0 0 21 20" fill="none">
                                                <path d="M10.4994 1.60742C12.3465 1.60742 14.1179 2.34116 15.4239 3.64721C16.73 4.95327 17.4637 6.72466 17.4637 8.57171C17.4637 11.5146 15.3959 14.7217 11.3137 18.2274C11.0867 18.4224 10.7973 18.5295 10.4981 18.5292C10.1989 18.529 9.90966 18.4214 9.68301 18.226L9.41301 17.9917C5.51158 14.5774 3.53516 11.4489 3.53516 8.57171C3.53516 6.72466 4.26889 4.95327 5.57495 3.64721C6.88101 2.34116 8.6524 1.60742 10.4994 1.60742ZM10.4994 2.67885C8.93656 2.67885 7.43769 3.2997 6.33256 4.40483C5.22744 5.50995 4.60658 7.00882 4.60658 8.57171C4.60658 11.0731 6.42658 13.9553 10.1166 17.1839L10.383 17.4146C10.4154 17.4424 10.4567 17.4577 10.4994 17.4577C10.5422 17.4577 10.5835 17.4424 10.6159 17.4146C14.4844 14.0917 16.3923 11.1324 16.3923 8.57171C16.3923 7.79785 16.2399 7.03156 15.9437 6.31661C15.6476 5.60165 15.2135 4.95203 14.6663 4.40483C14.1191 3.85763 13.4695 3.42356 12.7545 3.12742C12.0396 2.83127 11.2733 2.67885 10.4994 2.67885ZM10.4994 5.89314C11.2098 5.89314 11.8911 6.17534 12.3935 6.67767C12.8958 7.18 13.178 7.86131 13.178 8.57171C13.178 9.28211 12.8958 9.96341 12.3935 10.4657C11.8911 10.9681 11.2098 11.2503 10.4994 11.2503C9.78904 11.2503 9.10774 10.9681 8.60541 10.4657C8.10308 9.96341 7.82087 9.28211 7.82087 8.57171C7.82087 7.86131 8.10308 7.18 8.60541 6.67767C9.10774 6.17534 9.78904 5.89314 10.4994 5.89314ZM10.4994 6.96456C10.0732 6.96456 9.66442 7.13389 9.36302 7.43529C9.06162 7.73668 8.8923 8.14547 8.8923 8.57171C8.8923 8.99795 9.06162 9.40673 9.36302 9.70813C9.66442 10.0095 10.0732 10.1789 10.4994 10.1789C10.9257 10.1789 11.3345 10.0095 11.6359 9.70813C11.9373 9.40673 12.1066 8.99795 12.1066 8.57171C12.1066 8.14547 11.9373 7.73668 11.6359 7.43529C11.3345 7.13389 10.9257 6.96456 10.4994 6.96456Z" fill="#96A5B8"></path>
                                            </svg>
                                </span>
                                <input type="text" class="form-control" placeholder="Enter City" name="city">
                            </div>
                        </div>
                    </div>
                    <div class="col-xxl-4 col-md-6 col-lg-4">
                        <div class="form-group ">
                            <label class="form-label">
                                Country </label>
                            <div class="input-field">
                                <span class="icon z-index">
                                <svg xmlns="http://www.w3.org/2000/svg" width="21" height="20" viewBox="0 0 21 20" fill="none">
                                                <path d="M10.4994 1.60742C12.3465 1.60742 14.1179 2.34116 15.4239 3.64721C16.73 4.95327 17.4637 6.72466 17.4637 8.57171C17.4637 11.5146 15.3959 14.7217 11.3137 18.2274C11.0867 18.4224 10.7973 18.5295 10.4981 18.5292C10.1989 18.529 9.90966 18.4214 9.68301 18.226L9.41301 17.9917C5.51158 14.5774 3.53516 11.4489 3.53516 8.57171C3.53516 6.72466 4.26889 4.95327 5.57495 3.64721C6.88101 2.34116 8.6524 1.60742 10.4994 1.60742ZM10.4994 2.67885C8.93656 2.67885 7.43769 3.2997 6.33256 4.40483C5.22744 5.50995 4.60658 7.00882 4.60658 8.57171C4.60658 11.0731 6.42658 13.9553 10.1166 17.1839L10.383 17.4146C10.4154 17.4424 10.4567 17.4577 10.4994 17.4577C10.5422 17.4577 10.5835 17.4424 10.6159 17.4146C14.4844 14.0917 16.3923 11.1324 16.3923 8.57171C16.3923 7.79785 16.2399 7.03156 15.9437 6.31661C15.6476 5.60165 15.2135 4.95203 14.6663 4.40483C14.1191 3.85763 13.4695 3.42356 12.7545 3.12742C12.0396 2.83127 11.2733 2.67885 10.4994 2.67885ZM10.4994 5.89314C11.2098 5.89314 11.8911 6.17534 12.3935 6.67767C12.8958 7.18 13.178 7.86131 13.178 8.57171C13.178 9.28211 12.8958 9.96341 12.3935 10.4657C11.8911 10.9681 11.2098 11.2503 10.4994 11.2503C9.78904 11.2503 9.10774 10.9681 8.60541 10.4657C8.10308 9.96341 7.82087 9.28211 7.82087 8.57171C7.82087 7.86131 8.10308 7.18 8.60541 6.67767C9.10774 6.17534 9.78904 5.89314 10.4994 5.89314ZM10.4994 6.96456C10.0732 6.96456 9.66442 7.13389 9.36302 7.43529C9.06162 7.73668 8.8923 8.14547 8.8923 8.57171C8.8923 8.99795 9.06162 9.40673 9.36302 9.70813C9.66442 10.0095 10.0732 10.1789 10.4994 10.1789C10.9257 10.1789 11.3345 10.0095 11.6359 9.70813C11.9373 9.40673 12.1066 8.99795 12.1066 8.57171C12.1066 8.14547 11.9373 7.73668 11.6359 7.43529C11.3345 7.13389 10.9257 6.96456 10.4994 6.96456Z" fill="#96A5B8"></path>
                                            </svg>
                                </span>
                                <select class="form-select select2" aria-label="Default select example" name="">
                                    <option selected value="">Select Country</option>
                                    <option value="1">India</option>
                                    <option value="1">USA</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-xxl-4 col-md-6 col-lg-4">
                        <div class="form-group ">
                            <label class="form-label">
                                State </label>
                            <div class="input-field">
                                <span class="icon z-index">
                                <svg xmlns="http://www.w3.org/2000/svg" width="21" height="20" viewBox="0 0 21 20" fill="none">
                                                <path d="M10.4994 1.60742C12.3465 1.60742 14.1179 2.34116 15.4239 3.64721C16.73 4.95327 17.4637 6.72466 17.4637 8.57171C17.4637 11.5146 15.3959 14.7217 11.3137 18.2274C11.0867 18.4224 10.7973 18.5295 10.4981 18.5292C10.1989 18.529 9.90966 18.4214 9.68301 18.226L9.41301 17.9917C5.51158 14.5774 3.53516 11.4489 3.53516 8.57171C3.53516 6.72466 4.26889 4.95327 5.57495 3.64721C6.88101 2.34116 8.6524 1.60742 10.4994 1.60742ZM10.4994 2.67885C8.93656 2.67885 7.43769 3.2997 6.33256 4.40483C5.22744 5.50995 4.60658 7.00882 4.60658 8.57171C4.60658 11.0731 6.42658 13.9553 10.1166 17.1839L10.383 17.4146C10.4154 17.4424 10.4567 17.4577 10.4994 17.4577C10.5422 17.4577 10.5835 17.4424 10.6159 17.4146C14.4844 14.0917 16.3923 11.1324 16.3923 8.57171C16.3923 7.79785 16.2399 7.03156 15.9437 6.31661C15.6476 5.60165 15.2135 4.95203 14.6663 4.40483C14.1191 3.85763 13.4695 3.42356 12.7545 3.12742C12.0396 2.83127 11.2733 2.67885 10.4994 2.67885ZM10.4994 5.89314C11.2098 5.89314 11.8911 6.17534 12.3935 6.67767C12.8958 7.18 13.178 7.86131 13.178 8.57171C13.178 9.28211 12.8958 9.96341 12.3935 10.4657C11.8911 10.9681 11.2098 11.2503 10.4994 11.2503C9.78904 11.2503 9.10774 10.9681 8.60541 10.4657C8.10308 9.96341 7.82087 9.28211 7.82087 8.57171C7.82087 7.86131 8.10308 7.18 8.60541 6.67767C9.10774 6.17534 9.78904 5.89314 10.4994 5.89314ZM10.4994 6.96456C10.0732 6.96456 9.66442 7.13389 9.36302 7.43529C9.06162 7.73668 8.8923 8.14547 8.8923 8.57171C8.8923 8.99795 9.06162 9.40673 9.36302 9.70813C9.66442 10.0095 10.0732 10.1789 10.4994 10.1789C10.9257 10.1789 11.3345 10.0095 11.6359 9.70813C11.9373 9.40673 12.1066 8.99795 12.1066 8.57171C12.1066 8.14547 11.9373 7.73668 11.6359 7.43529C11.3345 7.13389 10.9257 6.96456 10.4994 6.96456Z" fill="#96A5B8"></path>
                                            </svg>
                                </span>
                                <select class="form-select select2" aria-label="Default select example" name=" ">
                                    <option selected value="">Select State</option>
                                    <option value="1">Bengulure</option>
                                    <option value="1">Goa</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-xxl-4 col-md-6 col-lg-4">
                        <div class="form-group ">
                            <label class="form-label">
                                Status</label>
                            <div class="input-field">
                                <span class="icon z-index">
                                <svg width="15" height="15" viewBox="0 0 15 15" fill="none"
                                        xmlns="http://www.w3.org/2000/svg">
                                        <path fill-rule="evenodd" clip-rule="evenodd"
                                            d="M5.0302 1.55517C5.20684 1.74442 5.19661 2.04104 5.00735 2.21768L2.32878 4.71768C2.23371 4.80642 2.10604 4.85167 1.97631 4.84261C1.84658 4.83356 1.72644 4.77102 1.64461 4.66994L0.885682 3.73244C0.722793 3.53122 0.753863 3.23606 0.955079 3.07317C1.15629 2.91028 1.45146 2.94135 1.61435 3.14257L2.05681 3.68913L4.36768 1.53232C4.55694 1.35568 4.85356 1.36591 5.0302 1.55517ZM7.03127 3.125C7.03127 2.86612 7.24113 2.65625 7.50002 2.65625H13.75C14.0089 2.65625 14.2188 2.86612 14.2188 3.125C14.2188 3.38389 14.0089 3.59375 13.75 3.59375H7.50002C7.24113 3.59375 7.03127 3.38389 7.03127 3.125ZM5.0302 5.93017C5.20684 6.11942 5.19661 6.41604 5.00735 6.59268L2.32878 9.09268C2.23371 9.18142 2.10604 9.22667 1.97631 9.21761C1.84658 9.20856 1.72644 9.14602 1.64461 9.04494L0.885682 8.10744C0.722793 7.90622 0.753863 7.61106 0.955079 7.44817C1.15629 7.28528 1.45146 7.31635 1.61435 7.51756L2.05681 8.06413L4.36768 5.90732C4.55694 5.73068 4.85356 5.74091 5.0302 5.93017ZM7.03127 7.5C7.03127 7.24112 7.24113 7.03125 7.50002 7.03125H13.75C14.0089 7.03125 14.2188 7.24112 14.2188 7.5C14.2188 7.75889 14.0089 7.96875 13.75 7.96875H7.50002C7.24113 7.96875 7.03127 7.75889 7.03127 7.5ZM5.0302 10.3052C5.20684 10.4944 5.19661 10.791 5.00735 10.9677L2.32878 13.4677C2.23371 13.5564 2.10604 13.6017 1.97631 13.5926C1.84658 13.5836 1.72644 13.521 1.64461 13.4199L0.885682 12.4824C0.722793 12.2812 0.753863 11.9861 0.955079 11.8232C1.15629 11.6603 1.45146 11.6913 1.61435 11.8926L2.05681 12.4391L4.36768 10.2823C4.55694 10.1057 4.85356 10.1159 5.0302 10.3052ZM7.03127 11.875C7.03127 11.6161 7.24113 11.4063 7.50002 11.4063H13.75C14.0089 11.4063 14.2188 11.6161 14.2188 11.875C14.2188 12.1339 14.0089 12.3438 13.75 12.3438H7.50002C7.24113 12.3438 7.03127 12.1339 7.03127 11.875Z"
                                            fill="#525866"></path>
                                    </svg>
                                </span>
                                <select class="form-select select2" aria-label="Default select example"
                                    name="meeting_type ">
                                    <option selected value="">Select Status</option>
                                    <option value="1">Active</option>
                                    <option value="1">Inactive</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

@endsection
@section('script')
<script src="{{ url('js/jquery-3.6.0_cdn/jquery.min.js') }}"></script>
<script src="{{ url('js/select2@4.1.0/select2.min.js') }}"></script>
<script src="{{ url('js/select2.init.js') }}"></script>
<script src="http://sat.localhost/ets-saas/public/js/app.js"></script>
<script src="https://cdn.rawgit.com/jzaefferer/jquery-validation/1.19.3/dist/jquery.validate.min.js"></script>
<script src="{{ url('js/libs/filepond/filepond.min.js') }}"></script>
<script src="{{ url('js/libs/filepond-plugin-image-preview/filepond-plugin-image-preview.min.js') }}"></script>
<script src="{{ url('js/libs/filepond-plugin-file-validate-size/filepond-plugin-file-validate-size.min.js') }}">
</script>
<script src="{{ url('js/libs/filepond-plugin-image-exif-orientation/filepond-plugin-image-exif-orientation.min.js') }}">
</script>
<script src="{{ url('js/libs/filepond-plugin-file-encode/filepond-plugin-file-encode.min.js') }}"></script>
<script>
$(document).ready(function() {
    // Initialize Select2
    $('.select-multi').select2();
    $(".select2").select2();

    $("#safetymeetingskForm").validate({
        errorElement: "span",
        errorClass: "text-danger",
        rules: {
            vendor_name: {
                required: true,
            },
            phone_number: {
                required: true,
                digits: true,
                minlength: 10,
                maxlength: 10 
            },
            email_address: {
                required: true,
                email: true
            },
        },
        messages: {
            vendor_name: {
                required: "Please enter the vendor name",
            },
            phone_number: {
                required: "Please enter the phone number",
                digits: "Only numbers are allowed",
                minlength: "Phone number must be exactly 10 digits",
                maxlength: "Phone number must be exactly 10 digits"
            },
            email_address: {
                required: "Please enter the email addres",
                email: "Please enter a valid email addres"
            },
        },
        errorPlacement: function(error, element) {
            error.addClass("invalid-feedback");
            if (element.hasClass("flatpickr-input")) {
                error.insertAfter(element.closest("div"));
            } else {
                if (element.is(":radio")) {
                    error.appendTo(element.closest(".radio-label-error"));
                } else {
                    if (element.hasClass("select2")) {
                        error.insertAfter(element.next(".select2-container"));
                    } else {
                        error.insertAfter(element); // Place the error after the input itself
                    }
                }
            }
        },
        ignore: [],
        submitHandler: function(form) {
            // form.submit(); // Regular form submission
        }
    });
});
</script>
@endsection