@php(
    $headerOption = [
        'title' => '',
        'noCardView' => true,
    ]
)
@extends('front.layouts.layout', $headerOption)

@section('content')
    <div class="row">
        <div class="col-12">
            <div class="page-title-box d-flex align-items-center justify-content-between">
                <h4 class="mb-0 font-size-18">Companies</h4>

                <div class="page-title-right">
                    <ol class="breadcrumb m-0">
                        <li class="breadcrumb-item"><a href="javascript: void(0);">Dashboard</a></li>
                        <li class="breadcrumb-item active">Companies</li>
                    </ol>
                </div>

            </div>
        </div>
    </div>

    <div class="card">
        <div class="card-body">
            <div class="d-flex justify-content-between mb-3">
                <div class="w-f-150">
                    <select class="form-control border-radius-100">
                        <option>All Status</option>
                    </select>
                </div>
                <div class="d-flex align-items-center gap-10">
                    <div class="search-box">
                        <div class="position-relative">
                            <input type="text" class="form-control" placeholder="Search...">
                            <i class="bx bx-search-alt search-icon"></i>
                        </div>
                    </div>
                    <a href="javascript:void(0);" class="btn btn-light btn-rounded waves-effect">Download All</a>
                    <a href="javascript:void(0);"
                        class="btn btn-primary btn-rounded waves-effect waves-light right-bar-toggle"><span
                            id="heading-tag">Create Company</span></a>

                </div>
            </div>
            <div class="table-responsive policy-table mb-0" data-pattern="priority-columns">
                <table id="tech-companies-1" class="table table-striped">
                    <thead>
                        <tr>
                            <th></th>
                            <th>Company Name <i class="bx bx-chevron-up ml-1"></i></th>
                            <th>Email</th>
                            <th>Phone</th>
                            {{-- <th data-priority="3"></th> --}}
                            <th data-priority="3">Status</th>
                        </tr>
                    </thead>
                    <tbody>
                        @if (count($data))
                            @foreach ($data as $key => $val)
                                <tr>
                                    <td>
                                        {{-- @if ($val->creator_id == auth()->user()->id || $val->owner_id == auth()->user()->id) --}}
                                        <a href="javascript:void(0);" data-id="{{ $val->id }}"
                                            class="right-bar-toggle company" data-mode="company"><i
                                                class="bx bx-edit font-size-20"></i></a>
                                        {{-- @endif --}}

                                        {{-- <a href="javascript:void(0);" data-id="{{ $val->id }}" class="del-company"><i
                                            class="bx bx-copy-alt font-size-20 ml-1 mr-1"></i></a> --}}
                                    </td>
                                    <td>{{ $val->name }}</td>
                                    <td>{{ $val->email }}</td>
                                    <td>{{ $val->phone }}</td>
                                    <td><span
                                            class="badge badge-pill badge-soft-{{ $val->statuses[$val->status]['badge'] }} font-size-12">{!! $val->statuses[$val->status]['name'] !!}</span>
                                    </td>
                                    <td class="w-20">
                                        @if ($val->is_master_company != 1)
                                            <div class="media justify-content-end">
                                                <button type="button"
                                                    class="btn btn-warning btn-rounded waves-effect waves-light del-company"
                                                    data-id="{{ $val->id }}"><i
                                                        class="mdi mdi-delete font-size-15"></i></button>
                                            </div>
                                        @endif
                                    </td>
                                </tr>
                            @endforeach
                        @else
                            <tr>
                                <td colspan="4" class="text-center">No Data Found</td>
                            </tr>
                        @endif

                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <!-- modal -->
    <div class="right-bar right-bar-xl">
        <div data-simplebar class="h-100">
            <div class="rightbar-title px-3 py-4">
                <a href="javascript:void(0);" class="right-bar-toggle float-right" id="close-modal">
                    <i class="mdi mdi-close noti-icon"></i>
                </a>
                <h5 class="m-0">Create new Company</h5>
            </div>

            <div class="px-3 pt-4">
                <div id="formrow-plantitle">
                    <h2 class="card-title mb-2">Company Info</h2>
                    <hr>
                </div>

                <form class="mt-4" id="registerForm">
                    <input type="hidden" id="requirmentid" value="" />
                    <input type="hidden" class="form-control " id="formrow-companylat-input" value="" />
                    <input type="hidden" class="form-control " id="formrow-companylng-input" value="" />
                    <div class="form-group" id="formrow-companyname">
                        <label for="formrow-companyname-input">Company Name <sup class="text-danger">*</sup></label>
                        <input type="text" class="form-control" id="formrow-companyname-input" required="true">
                    </div>

                    <div class="form-group" id="formrow-companyemail">
                        <label for="formrow-companyemail-input">Company Email <sup class="text-danger">*</sup></label>
                        <input type="email" class="form-control" id="formrow-companyemail-input" data-parsley-type="email"
                            data-parsley-trigger="keyup"
                            data-parsley-checkemail="true"
                            data-parsley-checkemail-message="This email id alredy exists."
                            required="true">
                    </div>

                    <div class="form-group" id="formrow-companyphone">
                        <label for="formrow-companyphone-input">Company Phone <sup class="text-danger">*</sup></label>
                        <input type="tel" class="form-control input-mask" id="formrow-companyphone-input"
                            data-parsley-trigger="keyup"
                            data-parsley-checkphone="true"
                            data-parsley-checkphone-message="This phone number alredy exists."
                            required="true"
                            data-inputmask="'mask': '(999) 999-9999'"
                            im-insert='true'">
                    </div>

                    <div class="form-group" id="formrow-companyaddress">
                        <label for="formrow-companyaddress-input">Address </label>
                        <input type="text" class="form-control" id="formrow-companyaddress-input">
                    </div>

                    <div class="row">

                        <div class="col-md-12" id="formrow-companydesc">
                            <div class="form-group">
                                <label for="formrow-companydesc-input">About the company </label>
                                <textarea type="text" id="con-desc" class="form-control heg-adj" rows="7"></textarea>
                            </div>
                        </div>
                    </div>

                    {{-- <div id="formrow-planyear">
                        <h2 class="card-title mb-2 mt-4">Plan Year</h2>
                        <hr>
                        @php($yearlist = ['' => 'Select year'] + $yearlist)
                        {!! Form::select('audit_year', $yearlist, null, ['class' => 'form-control', 'id' => 'audit_year']) !!}
                    </div> --}}

                </form>
                <div class="d-flex justify-content-end gap-10 border-top pt-4 pb-4">
                    <a href="javascript:void(0)"
                        class="btn btn-outline-primary btn-rounded waves-effect waves-light px-5 py-2"
                        onclick="closeCreateModal()">Cancel</a>
                    <a href="javascript:void(0)" id="req_submit_btn" onclick="onUpdateRequirement()"
                        data-loading-text="<i class='bx bx-loader-alt bx-spin'></i> Processing..."
                        class="btn btn-primary btn-rounded px-5 py-2">Save</a>
                </div>
            </div>



        </div>
    </div>



    </div>
@endsection
<style>
    .pac-container {
        z-index: 10000 !important;
        /* Adjust the value as needed */
    }
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDbY2OH3jKg_Z4b0RCIaMcyGyTl29_4AvI&libraries=places"></script>
<script>
    var app_url = "