@extends("layouts.main")

@section('main-container')
  <div>
    @if (Session::has('success'))
        <div class="alert alert-success alert-dismissible my-1" role="alert">
            <button type="button" class="close" data-bs-dismiss="alert">
                <i class="fa fa-times"></i>
            </button>
            <strong>Success !</strong> {{ session('success') }}
        </div>
    @endif
    
    @if ($errors->any())
        <div class="alert alert-danger">
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif
  </div>

  <div class="main_content_iner">
    <div class="container-fluid p-0">
      <div class="row justify-content-center">
        
        {{-- Customers header --}}
        <div class="">
          <div class="px-4 py-1 theme_bg_1 d-flex justify-content-between">
              <h5 class="mb-0 text-white text-center">Customers</h5>
              <a class="btn-custom-1" href="#" data-bs-toggle="modal" data-bs-target="#addCustomerModal">Add</a>
          </div>
        </div>

        {{-- add modal --}}
        <div class="modal fade" id="addCustomerModal" tabindex="-1"
          aria-labelledby="addCustomerModalLabel" aria-hidden="true">
          <div class="modal-dialog modal-xl">
            <div class="modal-content">
              <div class="modal-header" style="background: #2d1967; padding: 0.8rem 1rem;">
                <h1 class="modal-title fs-5 text-white" id="addCustomerModalLabel">Add New Customer</h1>
                <button type="button" class="btn-close" data-bs-dismiss="modal"
                  aria-label="Close" style="filter: invert(100%);"></button>
              </div>
              <form class="" method="POST" action="{{ route('customers.store') }}">
                @csrf
                <div class="modal-body">

                  {{-- Customer Basic Information --}}
                  <h4 class="text-center text-decoration-underline mb-3 fw-bolder">Customer Basic Information</h4>
                  <div class="border border-secondary p-3 mb-5">
                    
                    <div class="row">
                      <div class="col-md-4">
                        <div class="mb-2">
                          <label for="customer_name" class="form-label fw-bold">Customer Name <span class="text-danger">*</span> </label>
                          <input type="text" class="form-control" id="customer_name" name="customer_name">
                        </div>
                        <div class="mb-2">
                          <label for="gender" class="form-label fw-bold">Gender </label>
                          <select name="gender" id="gender" class="p-2 form-control">
                            <option value="">Select a Gender</option>
                            <option value="1">Male</option>
                            <option value="2">Female</option>
                            <option value="3">Others</option>
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="reg_form_no" class="form-label fw-bold">Registration form Number </label>
                          <input type="text" class="form-control" id="reg_form_no" name="reg_form_no">
                        </div>
                        <div class="mb-2">
                          <label for="nid_number" class="form-label fw-bold">NID Number <span class="text-danger">*</span> </label>
                          <input type="text" class="form-control" id="nid_number" name="nid_number">
                        </div>
                        <div class="mb-2">
                          <label for="mobile1" class="form-label fw-bold">Mobile <span class="text-danger">*</span> </label>
                          <input type="text" class="form-control" id="mobile1" name="mobile1">
                        </div>
                        <div class="mb-2">
                          <label for="village" class="form-label fw-bold">Road No# <span class="text-danger">*</span> </label>
                          <input type="text" class="form-control" id="village" name="village">
                        </div>
                        <div class="mb-2">
                          <label for="district_id" class="form-label fw-bold">District <span class="text-danger">*</span> </label>
                          <select name="district_id" id="district_id" class="p-2 form-control">
                            <option value="">Select a District</option>
                            @foreach ($districts as $district)
                                <option value="{{ $district->id }}">{{ $district->name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="latitude" class="form-label fw-bold">Latitude </label>
                          <input type="text" class="form-control" id="latitude" name="latitude">
                        </div>
                        <div class="mb-2">
                          <label for="present_address" class="form-label fw-bold">Present Address <span class="text-danger">*</span> </label>
                          <textarea class="form-control" id="present_address" name="present_address"></textarea>
                        </div>
                      </div>

                      <div class="col-md-4">
                        <div class="mb-2">
                          <label for="father_or_husband_name" class="form-label fw-bold">Father Name </label>
                          <input type="text" class="form-control" id="father_or_husband_name" name="father_or_husband_name">
                        </div>
                        <div class="mb-2">
                          <label for="blood_group" class="form-label fw-bold">Blood Group </label>
                          <select name="blood_group" id="blood_group" class="p-2 form-control">
                            <option value="-1">Select a Blood Group</option>
                            <option value="1">A + (Positive)</option>
                            <option value="2">A - (Negative)</option>
                            <option value="3">B + (Positive)</option>
                            <option value="4">B - (Negative)</option>
                            <option value="5">AB + (Positive)</option>
                            <option value="6">AB - (Negative)</option>
                            <option value="7">O + (Positive)</option>
                            <option value="8">O - (Negative)</option>
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="remarks" class="form-label fw-bold">remarks / Special Note </label>
                          <textarea class="form-control" id="remarks" name="remarks" rows="1"></textarea>
                        </div>
                        <div class="mb-2">
                          <label for="email" class="form-label fw-bold">Email <span class="text-danger">*</span> </label>
                          <input type="text" class="form-control" id="email" name="email">
                        </div>
                        <div class="mb-2">
                          <label for="phone" class="form-label fw-bold">Phone </label>
                          <input type="text" class="form-control" id="phone" name="phone">
                        </div>
                        <div class="mb-2">
                          <label for="house_no" class="form-label fw-bold">House No <span class="text-danger">*</span> </label>
                          <input type="text" class="form-control" id="house_no" name="house_no">
                        </div>
                        <div class="mb-2">
                          <label for="upazila_id" class="form-label fw-bold">Upazila <span class="text-danger">*</span> </label>
                          <select name="upazila_id" id="upazila_id" class="p-2 form-control">
                            <option value="">Select a Upazila</option>
                            @foreach ($upazilas as $upazila)
                                <option value="{{ $upazila->id }}">{{ $upazila->name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="longitude" class="form-label fw-bold">Longitude </label>
                          <input type="text" class="form-control" id="longitude" name="longitude">
                        </div>
                        <div class="mb-2">
                          <label for="permanent_address" class="form-label fw-bold">Permanent Address </label>
                          <textarea class="form-control" id="permanent_address" name="permanent_address"></textarea>
                        </div>
                      </div>

                      <div class="col-md-4">
                        <div class="mb-2">
                          <label for="mother_name" class="form-label fw-bold">Mother Name </label>
                          <input type="text" class="form-control" id="mother_name" name="mother_name">
                        </div>
                        <div class="mb-2">
                          <label for="date_of_birth" class="form-label fw-bold">Date Of Birth </label>
                          <input type="text" class="form-control datepicker-here digits" id="date_of_birth" name="date_of_birth" placeholder="dd/mm/yy">
                        </div>
                        <div class="mb-2">
                          <label for="occupation" class="form-label fw-bold">Occupation </label>
                          <input type="text" class="form-control" id="occupation" name="occupation">
                        </div>
                        <div class="mb-2">
                          <label for="fb_id" class="form-label fw-bold">Facebook ID </label>
                          <input type="text" class="form-control" id="fb_id" name="fb_id">
                        </div>
                        <div class="mb-2">
                          <label for="vat_status" class="form-label fw-bold">VAT Status </label>
                          <input readonly type="text" class="form-control" id="vat_status" name="vat_status" value="Yes">
                        </div>
                        <div class="mb-2">
                          <label for="area_id" class="form-label fw-bold">Area <span class="text-danger">*</span> </label>
                          <select name="area_id" id="area_id" class="p-2 form-control">
                            <option value="">Select an Area</option>
                            @foreach ($areas as $area)
                                <option value="{{ $area->id }}">{{ $area->area_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="zone_id" class="form-label fw-bold">Zone <span class="text-danger">*</span> </label>
                          <select name="zone_id" id="zone_id" class="p-2 form-control">
                            <option value="">Select a Zone</option>
                            @foreach ($zones as $zone)
                                <option value="{{ $zone->id }}">{{ $zone->zone_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="subzone_id" class="form-label fw-bold">Sub Zone </label>
                          <select name="subzone_id" id="subzone_id" class="p-2 form-control">
                            <option value="">Select a Sub Zone</option>
                            @foreach ($subzones as $subzone)
                                <option value="{{ $subzone->id }}">{{ $subzone->subzone_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="contract_person" class="form-label fw-bold">Contract Person </label>
                          <textarea class="form-control" id="contract_person" name="contract_person"></textarea>
                        </div>
                      </div>
                    </div>
                  </div>

                  {{-- Upload Picture --}}
                  <h4 class="text-center text-decoration-underline mb-3">Upload Picture</h4>
                  <div class="border border-secondary p-3 mb-5">
                    <div class="d-flex justify-content-between">

                      <div class="col-lg-3">
                        <div class="white_box">
                            <h5 class="">Profile Picture</h5>
                            <div class="avatar-upload">
                                <div class="avatar-edit">
                                    <input type='file' id="profile_pic" name="profile_pic" accept=".png, .jpg, .jpeg" />
                                    <label for="profile_pic"></label>
                                </div>
                                <div class="avatar-preview">
                                    <div id="imagePreview"
                                        style="background-image: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQioKINfcXK55EtAkOsFMG_CnHibqyNRI-tiPq_fGUVig&s);">
                                    </div>
                                </div>
                            </div>
                        </div>
                      </div>

                      <div class="col-lg-3">
                        <div class="white_box h-100">
                            <h5 class="mb-0">NID / Birth Certificate Picture</h5>
                            <div class="avatar-upload">
                                <div class="avatar-edit">
                                    <input type='file' id="nid_pic" name="nid_pic" accept=".png, .jpg, .jpeg" />
                                    <label for="nid_pic"></label>
                                </div>
                                <div class="avatar-preview">
                                    <div id="imagePreview"
                                        style="background-image: url(https://png.pngtree.com/png-vector/20221021/ourmid/pngtree-id-card-templateidentity-document-stock-icon-employee-sign-registered-vector-png-image_39834212.png);">
                                    </div>
                                </div>
                            </div>
                        </div>
                      </div>

                      <div class="col-lg-3">
                        <div class="white_box h-100">
                            <h5 class="mb-0">Registration Form Picture</h5>
                            <div class="avatar-upload">
                                <div class="avatar-edit">
                                    <input type='file' id="reg_form_pic" accept=".png, .jpg, .jpeg" />
                                    <label for="reg_form_pic"></label>
                                </div>
                                <div class="avatar-preview">
                                    <div id="imagePreview"
                                        style="background-image: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRfE5MgZNS1cCgi6bQLQdD7dgxK7aGqIa3yJQ&usqp=CAU);">
                                    </div>
                                </div>
                            </div>
                        </div>
                      </div>

                    </div>
                  </div>

                  {{-- service information --}}
                  {{-- <h4 class="text-center text-decoration-underline mb-3">Service Information</h4>
                  <div class="border border-secondary p-3 mb-5">

                    <div class="d-flex justify-content-around">
                      <div class="mb-2 w-25">
                        <label for="fb_id" class="form-label fw-bold">A/C No. <span class="text-danger">*</span> </label><br>
                        <span class="text-danger" id="" name="">Customer ID automatically generated after save</span>
                      </div>
                    </div>
                  </div> --}}

                  {{-- Server and Network --}}
                  <h4 class="text-center text-decoration-underline mb-3">Server and Network</h4>
                  <div class="border border-secondary p-3 mb-5">

                    <div class="row">
                      <div class="col-md-4">
                        <div class="mb-2">
                          <label for="username" class="form-label fw-bold">Username </label>
                          <input type="text" class="form-control" id="username" name="username">
                        </div>
                        <div class="mb-2">
                          <label for="connection_type_id" class="form-label fw-bold">Connection Type </label>
                          <select name="connection_type_id" id="connection_type_id" class="p-2 form-control">
                            <option value="">Select a Connection Type</option>
                            @foreach ($connectiontypes as $connectiontype)
                                <option value="{{ $connectiontype->id }}">{{ $connectiontype->connection_type_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="connection_employee_id" class="form-label fw-bold">Employee Connection </label>
                          <select name="connection_employee_id" id="connection_employee_id" class="p-2 form-control">
                            <option value="">Select an Employee</option>
                            @foreach ($employees as $employee)
                                <option value="{{ $employee->id }}">{{ $employee->employee_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="server_id" class="form-label fw-bold">Server </label>
                          <select name="server_id" id="server_id" class="p-2 form-control">
                            <option value="">Select a Server</option>
                            @foreach ($networkservers as $server)
                                <option value="{{ $server->id }}">{{ $server->server_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="box_id" class="form-label fw-bold">Box </label>
                          <select name="box_id" id="box_id" class="p-2 form-control">
                            <option value="">Select a Box</option>
                            @foreach ($boxes as $box)
                                <option value="{{ $box->id }}">{{ $box->box_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="device" class="form-label fw-bold">Device </label>
                          <input type="text" class="form-control" id="device" name="device">
                        </div>
                        <div class="mb-2">
                          <label for="joining_date" class="form-label fw-bold">Joining Date </label>
                          <input type="text" class="form-control datepicker-here digits" id="joining_date" name="joining_date" placeholder="dd/mm/yy">
                        </div>
                        <div class="mb-2">
                          <label for="monthly_bill" class="form-label fw-bold">Monthly Bill </label>
                          <input type="text" class="form-control" id="monthly_bill" name="monthly_bill">
                        </div>
                        <div class="mb-2">
                          <label for="status" class="form-label fw-bold">Status: </label>
                          <select name="status" id="status" class="p-2 form-control">
                              <option value="1">Active</option>
                              <option value="2">Inactive</option>
                          </select>
                        </div>
                        <div class="mb-2 mt-5 text-center text-lg">
                          <input type="checkbox" class="form-check-input" id="include_vat" name="include_vat">
                          <label for="include_vat" class="form-label fw-bold">Include VAT </label>
                        </div>
                      </div>

                      <div class="col-md-4">
                        <div class="mb-2">
                          <label for="network_password" class="form-label fw-bold">Password </label>
                          <input type="text" class="form-control" id="network_password" name="network_password">
                        </div>
                        <div class="mb-2">
                          <label for="business_type_id" class="form-label fw-bold">Business Type </label>
                          <select name="business_type_id" id="business_type_id" class="p-2 form-control">
                            <option value="">Select a Business Type</option>
                            @foreach ($businesstypes as $businesstype)
                                <option value="{{ $businesstype->id }}">{{ $businesstype->business_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="reference_by" class="form-label fw-bold">Reference By </label>
                          <input type="text" class="form-control" id="reference_by" name="reference_by">
                        </div>
                        <div class="mb-2">
                          <label for="protocol_typeid" class="form-label fw-bold">Protocol </label>
                          <select name="protocol_typeid" id="protocol_typeid" class="p-2 form-control">
                            <option value="">Select a Protocol</option>
                            @foreach ($protocoltypes as $protocoltype)
                                <option value="{{ $protocoltype->id }}">{{ $protocoltype->protocol_type_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="cable_req" class="form-label fw-bold">Cable req </label>
                          <input type="text" class="form-control" id="cable_req" name="cable_req">
                        </div>
                        <div class="mb-2">
                          <label for="device_vendor_id" class="form-label fw-bold">Device Vendor </label>
                          <select name="device_vendor_id" id="device_vendor_id" class="p-2 form-control">
                            <option value="">Select a Device Vendor</option>
                            @foreach ($devicevendors as $devicevendor)
                                <option value="{{ $devicevendor->id }}">{{ $devicevendor->device_vendor_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="expiry_date" class="form-label fw-bold">Expire Date </label>
                          <input type="text" class="form-control datepicker-here digits" id="expiry_date" name="expiry_date">
                        </div>
                        <div class="mb-2">
                          <label for="billing_month" class="form-label fw-bold">Billing Month </label>
                          <input type="text" class="form-control" id="billing_month" name="billing_month">
                        </div>
                        <div class="mb-2">
                          <label for="customer_type_id" class="form-label fw-bold">Customer Type </label>
                          <select name="customer_type_id" id="customer_type_id" class="p-2 form-control">
                            <option value="">Select a Customer Type</option>
                            @foreach ($customertypes as $customertype)
                                <option value="{{ $customertype->id }}">{{ $customertype->customer_type_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2 mt-5 text-center text-lg">
                          <input type="checkbox" class="form-check-input" id="greeting_sms_sent" name="greeting_sms_sent">
                          <label for="greeting_sms_sent" class="form-label fw-bold">Send Greeting SMS? </label>
                        </div>
                      </div>

                      <div class="col-md-4">
                        <div class="mb-2">
                          <label for="customer_package_id" class="form-label fw-bold">Package </label>
                          <select name="customer_package_id" id="customer_package_id" class="p-2 form-control">
                            <option value="">Select a Package</option>
                            @foreach ($customerpackages as $customerpackage)
                                <option value="{{ $customerpackage->id }}">{{ $customerpackage->customer_package_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="profile_id" class="form-label fw-bold">Profile </label>
                          <select name="profile_id" id="profile_id" class="p-2 form-control">
                            <option value="">Select a Profile</option>
                            @foreach ($customerprofiles as $customerprofile)
                                <option value="{{ $customerprofile->id }}">{{ $customerprofile->profile_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="fiber_code" class="form-label fw-bold">Fiber Code </label>
                          <input type="text" class="form-control" id="fiber_code" name="fiber_code">
                          {{-- <select name="fiber_code" id="fiber_code" class="p-2 form-control">
                            <option value="">Select a Fiber</option>
                            @foreach ($fibers as $fiber)
                                <option value="{{ $fiber->id }}">{{ $fiber->fiber_name }}</option>
                            @endforeach
                          </select> --}}
                        </div>
                        <div class="mb-2">
                          <label for="core_color" class="form-label fw-bold">Core Color </label>
                          <input type="text" class="form-control" id="core_color" name="core_color">
                        </div>
                        <div class="mb-2">
                          <label for="no_of_core" class="form-label fw-bold">No. of Core </label>
                          <input type="text" class="form-control" id="no_of_core" name="no_of_core">
                        </div>
                        <div class="mb-2">
                          <label for="device_mac" class="form-label fw-bold">Device MAC </label>
                          <input type="text" class="form-control" id="device_mac" name="device_mac">
                        </div>
                        <div class="mb-2">
                          <label for="purchase_date" class="form-label fw-bold">Purchase Date </label>
                          <input type="text" class="form-control datepicker-here digits" id="purchase_date" name="purchase_date">
                        </div>
                        <div class="mb-2">
                          <label for="billing_status_id" class="form-label fw-bold">Billing Status </label>
                          <select name="billing_status_id" id="billing_status_id" class="p-2 form-control">
                            <option value="">Select Billing Status</option>
                            @foreach ($billingstatuses as $billingstatus)
                                <option value="{{ $billingstatus->id }}">{{ $billingstatus->billing_status_name }}</option>
                            @endforeach
                          </select>
                        </div>
                        <div class="mb-2">
                          <label for="customer_status_id" class="form-label fw-bold">Customer Status </label>
                          <select name="customer_status_id" id="customer_status_id" class="p-2 form-control">
                            <option value="">Select a Customer Status</option>
                            @foreach ($clientstatuses as $clientstatus)
                                <option value="{{ $clientstatus->id }}">{{ $clientstatus->customer_status_name }}</option>
                            @endforeach
                          </select>
                        </div>
                      </div>

                    </div>
                  </div>

                  {{-- Other Information --}}
                  {{-- <h4 class="text-center text-decoration-underline mb-3">Other Information</h4>
                  <div class="border border-secondary p-3 mb-5">
                    <label for="" class="form-label fw-bold">Comments</label>
                    <textarea class="form-control" id="contract_person" name="contract_person" placeholder="Leave any comment here!" rows="4"></textarea>
                  </div> --}}

                </div>
                <div class="modal-footer">
                  <button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal" aria-label="Close">Cancel</button>
                  <button class="btn-custom-1 py-1" type="submit" onclick="this.disabled=true;this.form.submit();">Add</button>
                </div>
              </form>
            </div>
          </div>
        </div>

        <div class="col-12">
          <div class="p-3">
            <div class="d-flex justify-content-between mb-3">
              <div class="col-sm-3">
                <select class="select2 form-select" id="customerid" name="customerid">
                  <option selected>Select a Customer</option>
                  @foreach ($customers as $cust)
                      <option value="{{ $cust->id }}">{{ $cust->customer_name }}</option>
                  @endforeach
                </select>
              </div>
              
              <div class="col-sm-3">
                <select class="select2 form-select" id="customertypeid" name="customertypeid">
                  <option selected>Select a Customer Type</option>
                  @foreach ($customertypes as $ct)
                      <option value="{{ $ct->id }}">{{ $ct->customer_type_name }}</option>
                  @endforeach                      
                </select>
              </div>
              
              <div class="col-sm-3">
                <select class="select2 form-select" id="customer_status_id" name="customer_status_id">
                  <option selected>Select a Customer Status</option>
                  @foreach ($clientstatuses as $cs)
                      <option value="{{ $cs->id }}">{{ $cs->customer_status_name }}</option>
                  @endforeach
                </select>
              </div>
                    
            </div>
            <div class="d-flex justify-content-between mb-3">
              <div class="col-sm-3">
                <select class="select2 form-select" id="packageid" name="packageid">
                  <option selected>Select a Package</option>
                  @foreach ($customerpackages as $cp)
                      <option value="{{ $cp->id }}">{{ $cp->customer_package_name }}</option>
                  @endforeach 
                </select>
              </div> 
              
              <div class="col-sm-3">
                <select class="select2 form-select" id="zoneid" name="zoneid">
                  <option selected>Select a Zone</option>
                  @foreach ($zones as $zone)
                      <option value="{{ $zone->id }}">{{ $zone->zone_name }}</option>
                  @endforeach
                </select>
              </div>
              
              <div class="col-sm-3">
                <select class="select2 form-select" id="subzone_id" name="subzone_id">
                  <option selected>Select a Sub Zone</option>
                  @foreach ($subzones as $subzone)
                      <option value="{{ $subzone->id }}">{{ $subzone->subzone_name }}</option>
                  @endforeach
                </select>
              </div>
            </div>
            <div class="d-flex justify-content-end">
              <button class="btn btn-sm btn-success">Search</button>    
            </div>   
            <div class="QA_table pb-0">
              <table class="table datatable compact">
                <thead>
                  <tr>
                    <th scope="col">Sl</th>
                    <th scope="col">User ID</th>
                    <th scope="col">Customer Name</th>
                    <th scope="col">IP Address</th>
                    <th scope="col">Mobile</th>
                    <th scope="col">Package</th>
                    <th scope="col">Status</th>
                    <th scope="col">Bill Start Date</th>
                    <th scope="col">Client Type</th>
                    <th scope="col">Bill Type</th>
                    <th scope="col">Action</th>
                  </tr>
                </thead>
                <tbody>
                  @php $slNumber = 1 @endphp
                  @foreach ($customers as $cust)
                    <tr>
                      <td style="color: black; font-size: small;">{{ $slNumber++ }}</td>
                      <td style="color: black; font-size: small;">{{ $cust->id }}</td>
                      <td style="color: black; font-size: small;">{{ $cust->customer_name }}</td>
                      <td style="color: black; font-size: small;">{{ $cust->device }}</td>
                      <td style="color: black; font-size: small;">{{ $cust->mobile1 }}</td>
                      <td style="color: black; font-size: small;">{{ $cust->CustomerPackage->customer_package_name }}</td>
                      <td style="color: black; font-size: small;">{{ $cust->status ==1 ? 'Active' : 'Inactive' }}</td>
                      <td style="color: black; font-size: small;">{{ $cust->joining_date }}</td>
                      <td style="color: black; font-size: small;">{{ $cust->CustomerType->customer_type_name }}</td>
                      <td style="color: black; font-size: small;" class="text-center">{{ $cust->bill_type_id }}</td>
                      <td>
                          <div class="btn-group">
                            <button type="button" class="btn btn-sm btn-primary dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                              Action
                            </button>
                            <div class="dropdown-menu">
                              <a class="dropdown-item" href="#" data-bs-toggle="modal" data-bs-target="#editCustomerModal{{ $cust->id }}">Edit</a>
                              <a class="dropdown-item" href="#" onclick="window.print()">Print</a>
                            </div>
                          </div>
                      </td>
                    </tr>

                    {{-- edit modal --}}
                    <div class="modal fade" id="editCustomerModal{{ $cust->id }}" tabindex="-1"
                      aria-labelledby="editCustomerModalLabel{{ $cust->id }}" aria-hidden="true">
                      <div class="modal-dialog modal-xl">
                        <div class="modal-content">
                          <div class="modal-header" style="background: #2d1967; padding: 0.8rem 1rem;">
                            <h1 class="modal-title fs-5 text-white" id="editCustomerModalLabel{{ $cust->id }}">Edit Customer</h1>
                            <button type="button" class="btn-close" data-bs-dismiss="modal"
                              aria-label="Close" style="filter: invert(100%);"></button>
                          </div>
                          <form class="" method="POST" action="{{ route('customers.update', ['customer' => $cust]) }}">
                            @csrf
                            @method('PUT')
                            <div class="modal-body">

                              {{-- Customer Basic Information --}}
                              <h4 class="text-center text-decoration-underline mb-3 fw-bolder">Customer Basic Information</h4>
                              <div class="border border-secondary p-3 mb-5">
                                
                                <div class="row">
                                  <div class="col-md-4">
                                    <div class="mb-2">
                                      <label for="customer_name" class="form-label fw-bold">Customer Name <span class="text-danger">*</span> </label>
                                      <input type="text" class="form-control" id="customer_name" name="customer_name" value="{{ $cust->customer_name }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="gender" class="form-label fw-bold">Gender </label>
                                      <select name="gender" id="gender" class="p-2 form-control">
                                        <option {{ $cust->gender == "1" ? "selected" : "" }} value="1">Male</option>
                                        <option {{ $cust->gender == "2" ? "selected" : "" }} value="2">Female</option>
                                        <option {{ $cust->gender == "3" ? "selected" : "" }} value="3">Others</option>
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="reg_form_no" class="form-label fw-bold">Registration form Number </label>
                                      <input type="text" class="form-control" id="reg_form_no" name="reg_form_no" value="{{ $cust->reg_form_no }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="nid_number" class="form-label fw-bold">NID Number <span class="text-danger">*</span> </label>
                                      <input type="text" class="form-control" id="nid_number" name="nid_number" value="{{ $cust->nid_number }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="mobile1" class="form-label fw-bold">Mobile <span class="text-danger">*</span> </label>
                                      <input type="text" class="form-control" id="mobile1" name="mobile1" value="{{ $cust->mobile1 }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="village" class="form-label fw-bold">Road No# <span class="text-danger">*</span> </label>
                                      <input type="text" class="form-control" id="village" name="village" value="{{ $cust->village }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="district_id" class="form-label fw-bold">District <span class="text-danger">*</span> </label>
                                      <select name="district_id" id="district_id" class="p-2 form-control">
                                        @foreach ($districts as $district)
                                            <option {{ ($cust->district_id == $district->id) ? "selected" : "" }} value="{{ $district->id }}">{{ $district->name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="latitude" class="form-label fw-bold">Latitude </label>
                                      <input type="text" class="form-control" id="latitude" name="latitude" value="{{ $cust->latitude }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="present_address" class="form-label fw-bold">Present Address <span class="text-danger">*</span> </label>
                                      <textarea class="form-control" id="present_address" name="present_address">{{ $cust->present_address }}</textarea>
                                    </div>
                                  </div>

                                  <div class="col-md-4">
                                    <div class="mb-2">
                                      <label for="father_or_husband_name" class="form-label fw-bold">Father Name </label>
                                      <input type="text" class="form-control" id="father_or_husband_name" name="father_or_husband_name" value="{{ $cust->father_or_husband_name }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="blood_group" class="form-label fw-bold">Blood Group </label>
                                      <select name="blood_group" id="blood_group" class="p-2 form-control">
                                        <option {{ $cust->blood_group == "A+" ? "selected" : "" }} value="A+">A + (Positive)</option>
                                        <option {{ $cust->blood_group == "A-" ? "selected" : "" }} value="A-">A - (Negative)</option>
                                        <option {{ $cust->blood_group == "B+" ? "selected" : "" }} value="B+">B + (Positive)</option>
                                        <option {{ $cust->blood_group == "B-" ? "selected" : "" }} value="B-">B - (Negative)</option>
                                        <option {{ $cust->blood_group == "AB+" ? "selected" : "" }} value="AB+">AB + (Positive)</option>
                                        <option {{ $cust->blood_group == "AB+" ? "selected" : "" }} value="AB-">AB - (Negative)</option>
                                        <option {{ $cust->blood_group == "O+" ? "selected" : "" }} value="O+">O + (Positive)</option>
                                        <option {{ $cust->blood_group == "O-" ? "selected" : "" }} value="O-">O - (Negative)</option>
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="remarks" class="form-label fw-bold">remarks / Special Note </label>
                                      <textarea class="form-control" id="remarks" name="remarks" rows="1">{{ $cust->remarks }}</textarea>
                                    </div>
                                    <div class="mb-2">
                                      <label for="email" class="form-label fw-bold">Email <span class="text-danger">*</span> </label>
                                      <input type="text" class="form-control" id="email" name="email" value="{{ $cust->email }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="phone" class="form-label fw-bold">Phone </label>
                                      <input type="text" class="form-control" id="phone" name="phone" value="{{ $cust->phone }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="house_no" class="form-label fw-bold">House No <span class="text-danger">*</span> </label>
                                      <input type="text" class="form-control" id="house_no" name="house_no" value="{{ $cust->house_no }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="upazila_id" class="form-label fw-bold">Upazila <span class="text-danger">*</span> </label>
                                      <select name="upazila_id" id="upazila_id" class="p-2 form-control">
                                        @foreach ($upazilas as $upazila)
                                            <option {{ ($cust->upazila_id == $upazila->id) ? "selected" : "" }} value="{{ $upazila->id }}">{{ $upazila->name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="longitude" class="form-label fw-bold">Longitude </label>
                                      <input type="text" class="form-control" id="longitude" name="longitude" value="{{ $cust->longitude }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="permanent_address" class="form-label fw-bold">Permanent Address </label>
                                      <textarea class="form-control" id="permanent_address" name="permanent_address">{{ $cust->permanent_address }}</textarea>
                                    </div>
                                  </div>

                                  <div class="col-md-4">
                                    <div class="mb-2">
                                      <label for="mother_name" class="form-label fw-bold">Mother Name </label>
                                      <input type="text" class="form-control" id="mother_name" name="mother_name" value="{{ $cust->mother_name }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="date_of_birth" class="form-label fw-bold">Date Of Birth </label>
                                      <input type="text" class="form-control datepicker-here digits" id="date_of_birth" name="date_of_birth" placeholder="dd/mm/yy" value="{{ $cust->date_of_birth }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="occupation" class="form-label fw-bold">Occupation </label>
                                      <input type="text" class="form-control" id="occupation" name="occupation" value="{{ $cust->occupation }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="fb_id" class="form-label fw-bold">Facebook ID </label>
                                      <input type="text" class="form-control" id="fb_id" name="fb_id" value="{{ $cust->fb_id }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="vat_status" class="form-label fw-bold">VAT Status </label>
                                      <select readonly name="vat_status" id="vat_status" class="p-2 form-control">
                                        <option selected value="Yes">Yes</option>
                                        <option value="No">No</option>
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="area_id" class="form-label fw-bold">Area <span class="text-danger">*</span> </label>
                                      <select name="area_id" id="area_id" class="p-2 form-control">
                                        @foreach ($areas as $area)
                                            <option {{ ($cust->area_id == $area->id) ? "selected" : "" }} value="{{ $area->id }}">{{ $area->area_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="zone_id" class="form-label fw-bold">Zone <span class="text-danger">*</span> </label>
                                      <select name="zone_id" id="zone_id" class="p-2 form-control">
                                        @foreach ($zones as $zone)
                                            <option {{ ($cust->zone_id == $zone->id) ? "selected" : "" }} value="{{ $zone->id }}">{{ $zone->zone_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="subzone_id" class="form-label fw-bold">Sub Zone </label>
                                      <select name="subzone_id" id="subzone_id" class="p-2 form-control">
                                        @foreach ($subzones as $subzone)
                                            <option {{ ($cust->subzone_id == $subzone->id) ? "selected" : "" }} value="{{ $subzone->id }}">{{ $subzone->subzone_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="contract_person" class="form-label fw-bold">Contract Person </label>
                                      <textarea class="form-control" id="contract_person" name="contract_person">{{ $cust->contract_person }}</textarea>
                                    </div>
                                  </div>
                                </div>
                              </div>

                              {{-- Upload Picture --}}
                              <h4 class="text-center text-decoration-underline mb-3">Upload Picture</h4>
                              <div class="border border-secondary p-3 mb-5">
                                <div class="d-flex justify-content-between">

                                  <div class="col-lg-3">
                                    <div class="white_box">
                                        <h5 class="">Profile Picture</h5>
                                        <div class="avatar-upload">
                                            <div class="avatar-edit">
                                                <input type='file' id="profile_pic" name="profile_pic" accept=".png, .jpg, .jpeg" />
                                                <label for="profile_pic"></label>
                                            </div>
                                            <div class="avatar-preview">
                                                <div id="imagePreview"
                                                    style="background-image: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQioKINfcXK55EtAkOsFMG_CnHibqyNRI-tiPq_fGUVig&s);">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                  </div>

                                  <div class="col-lg-3">
                                    <div class="white_box h-100">
                                        <h5 class="mb-0">NID / Birth Certificate Picture</h5>
                                        <div class="avatar-upload">
                                            <div class="avatar-edit">
                                                <input type='file' id="nid_pic" name="nid_pic" accept=".png, .jpg, .jpeg" />
                                                <label for="nid_pic"></label>
                                            </div>
                                            <div class="avatar-preview">
                                                <div id="imagePreview"
                                                    style="background-image: url(https://png.pngtree.com/png-vector/20221021/ourmid/pngtree-id-card-templateidentity-document-stock-icon-employee-sign-registered-vector-png-image_39834212.png);">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                  </div>

                                  <div class="col-lg-3">
                                    <div class="white_box h-100">
                                        <h5 class="mb-0">Registration Form Picture</h5>
                                        <div class="avatar-upload">
                                            <div class="avatar-edit">
                                                <input type='file' id="reg_form_pic" accept=".png, .jpg, .jpeg" />
                                                <label for="reg_form_pic"></label>
                                            </div>
                                            <div class="avatar-preview">
                                                <div id="imagePreview"
                                                    style="background-image: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRfE5MgZNS1cCgi6bQLQdD7dgxK7aGqIa3yJQ&usqp=CAU);">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                  </div>

                                </div>
                              </div>

                              {{-- service information --}}
                              {{-- <h4 class="text-center text-decoration-underline mb-3">Service Information</h4>
                              <div class="border border-secondary p-3 mb-5">

                                <div class="d-flex justify-content-around">
                                  <div class="mb-2 w-25">
                                    <label for="fb_id" class="form-label fw-bold">A/C No. <span class="text-danger">*</span> </label><br>
                                    <span class="text-danger" id="" name="">Customer ID automatically generated after save</span>
                                  </div>
                                </div>
                              </div> --}}

                              {{-- Server and Network --}}
                              <h4 class="text-center text-decoration-underline mb-3">Server and Network</h4>
                              <div class="border border-secondary p-3 mb-5">

                                <div class="row">
                                  <div class="col-md-4">
                                    <div class="mb-2">
                                      <label for="username" class="form-label fw-bold">Username </label>
                                      <input type="text" class="form-control" id="username" name="username" value="{{ $cust->username }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="connection_type_id" class="form-label fw-bold">Connection Type </label>
                                      <select name="connection_type_id" id="connection_type_id" class="p-2 form-control">
                                        @foreach ($connectiontypes as $connectiontype)
                                            <option {{ ($cust->connection_type_id == $connectiontype->id) ? "selected" : "" }} value="{{ $connectiontype->id }}">{{ $connectiontype->connection_type_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="connection_employee_id" class="form-label fw-bold">Employee Connection </label>
                                      <select name="connection_employee_id" id="connection_employee_id" class="p-2 form-control">
                                        @foreach ($employees as $employee)
                                            <option {{ ($cust->connection_employee_id == $employee->id) ? "selected" : "" }} value="{{ $employee->id }}">{{ $employee->employee_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="server_id" class="form-label fw-bold">Server </label>
                                      <select name="server_id" id="server_id" class="p-2 form-control">
                                        @foreach ($networkservers as $server)
                                            <option {{ ($cust->server_id == $server->id) ? "selected" : "" }} value="{{ $server->id }}">{{ $server->server_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="box_id" class="form-label fw-bold">Box </label>
                                      <select name="box_id" id="box_id" class="p-2 form-control">
                                        @foreach ($boxes as $box)
                                            <option {{ ($cust->box_id == $box->id) ? "selected" : "" }} value="{{ $box->id }}">{{ $box->box_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="device" class="form-label fw-bold">Device </label>
                                      <input type="text" class="form-control" id="device" name="device" value="{{ $cust->device }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="joining_date" class="form-label fw-bold">Joining Date </label>
                                      <input type="text" class="form-control datepicker-here digits" id="joining_date" name="joining_date" value="{{ $cust->joining_date }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="monthly_bill" class="form-label fw-bold">Monthly Bill </label>
                                      <input type="text" class="form-control" id="monthly_bill" name="monthly_bill" value="{{ $cust->monthly_bill }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="status" class="form-label fw-bold">Status: </label>
                                      <select name="status" id="status" class="p-2 form-control">
                                          <option {{ $cust->status == "1" ? "selected" : "" }} value="1">Active</option>
                                          <option {{ $cust->status == "2" ? "selected" : "" }} value="2">Inactive</option>
                                      </select>
                                    </div>
                                    <div class="mb-2 mt-5 text-center text-lg">
                                      <input type="checkbox" class="form-check-input" id="include_vat" name="include_vat" value="{{ $cust->vat_status }}">
                                      <label for="include_vat" class="form-label fw-bold">Include VAT </label>
                                    </div>
                                  </div>

                                  <div class="col-md-4">
                                    <div class="mb-2">
                                      <label for="network_password" class="form-label fw-bold">Password </label>
                                      <input type="text" class="form-control" id="network_password" name="network_password" value="{{ $cust->network_password }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="business_type_id" class="form-label fw-bold">Business Type </label>
                                      <select name="business_type_id" id="business_type_id" class="p-2 form-control">
                                        @foreach ($businesstypes as $businesstype)
                                            <option {{ ($cust->business_type_id == $businesstype->id) ? "selected" : "" }} value="{{ $businesstype->id }}">{{ $businesstype->business_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="reference_by" class="form-label fw-bold">Reference By </label>
                                      <input type="text" class="form-control" id="reference_by" name="reference_by" value="{{ $cust->reference_by }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="protocol_typeid" class="form-label fw-bold">Protocol </label>
                                      <select name="protocol_typeid" id="protocol_typeid" class="p-2 form-control">
                                        @foreach ($protocoltypes as $protocoltype)
                                            <option {{ ($cust->protocol_typeid == $protocoltype->id) ? "selected" : "" }} value="{{ $protocoltype->id }}">{{ $protocoltype->protocol_type_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="cable_req" class="form-label fw-bold">Cable req </label>
                                      <input type="text" class="form-control" id="cable_req" name="cable_req" value="{{ $cust->cable_req }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="device_vendor_id" class="form-label fw-bold">Device Vendor </label>
                                      <select name="device_vendor_id" id="device_vendor_id" class="p-2 form-control">
                                        @foreach ($devicevendors as $devicevendor)
                                            <option {{ ($cust->device_vendor_id == $devicevendor->id) ? "selected" : "" }} value="{{ $devicevendor->id }}">{{ $devicevendor->device_vendor_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="expiry_date" class="form-label fw-bold">Expire Date </label>
                                      <input type="text" class="form-control datepicker-here digits" id="expiry_date" name="expiry_date" value="{{ $cust->expiry_date }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="billing_month" class="form-label fw-bold">Billing Month </label>
                                      <input type="text" class="form-control" id="billing_month" name="billing_month" value="{{ $cust->billing_month }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="customer_type_id" class="form-label fw-bold">Customer Type </label>
                                      <select name="customer_type_id" id="customer_type_id" class="p-2 form-control">
                                        @foreach ($customertypes as $customertype)
                                            <option {{ ($cust->customer_type_id == $customertype->id) ? "selected" : "" }} value="{{ $customertype->id }}">{{ $customertype->customer_type_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2 mt-5 text-center text-lg">
                                      <input type="checkbox" class="form-check-input" id="greeting_sms_sent" name="greeting_sms_sent" value="{{ $cust->greeting_sms_sent }}">
                                      <label for="greeting_sms_sent" class="form-label fw-bold">Send Greeting SMS? </label>
                                    </div>
                                  </div>

                                  <div class="col-md-4">
                                    <div class="mb-2">
                                      <label for="customer_package_id" class="form-label fw-bold">Package </label>
                                      <select name="customer_package_id" id="customer_package_id" class="p-2 form-control">
                                        @foreach ($customerpackages as $customerpackage)
                                            <option {{ ($cust->customer_package_id == $customerpackage->id) ? "selected" : "" }} value="{{ $customerpackage->id }}">{{ $customerpackage->customer_package_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="profile_id" class="form-label fw-bold">Profile </label>
                                      <select name="profile_id" id="profile_id" class="p-2 form-control">
                                        @foreach ($customerprofiles as $customerprofile)
                                            <option {{ ($cust->profile_id == $customerprofile->id) ? "selected" : "" }} value="{{ $customerprofile->id }}">{{ $customerprofile->profile_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="fiber_code" class="form-label fw-bold">Fiber Code </label>
                                      <input type="text" class="form-control" id="fiber_code" name="fiber_code" value="{{ $cust->fiber_code }}">
                                      {{-- <select name="fiber_code" id="fiber_code" class="p-2 form-control">
                                        @foreach ($fibers as $fiber)
                                            <option value="{{ $fiber->id }}">{{ $fiber->fiber_name }}</option>
                                        @endforeach
                                      </select> --}}
                                    </div>
                                    <div class="mb-2">
                                      <label for="core_color" class="form-label fw-bold">Core Color </label>
                                      <input type="text" class="form-control" id="core_color" name="core_color" value="{{ $cust->core_color }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="no_of_core" class="form-label fw-bold">No. of Core </label>
                                      <input type="text" class="form-control" id="no_of_core" name="no_of_core" value="{{ $cust->no_of_core }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="device_mac" class="form-label fw-bold">Device MAC </label>
                                      <input type="text" class="form-control" id="device_mac" name="device_mac" value="{{ $cust->device_mac }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="purchase_date" class="form-label fw-bold">Purchase Date </label>
                                      <input type="text" class="form-control datepicker-here digits" id="purchase_date" name="purchase_date" value="{{ $cust->purchase_date }}">
                                    </div>
                                    <div class="mb-2">
                                      <label for="billing_status_id" class="form-label fw-bold">Billing Status </label>
                                      <select name="billing_status_id" id="billing_status_id" class="p-2 form-control">
                                        @foreach ($billingstatuses as $billingstatus)
                                            <option {{ ($cust->billing_status_id == $billingstatus->id) ? "selected" : "" }} value="{{ $billingstatus->id }}">{{ $billingstatus->billing_status_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                    <div class="mb-2">
                                      <label for="customer_status_id" class="form-label fw-bold">Customer Status </label>
                                      <select name="customer_status_id" id="customer_status_id" class="p-2 form-control">
                                        @foreach ($clientstatuses as $clientstatus)
                                            <option {{ ($cust->customer_status_id == $clientstatus->id) ? "selected" : "" }} value="{{ $clientstatus->id }}">{{ $clientstatus->customer_status_name }}</option>
                                        @endforeach
                                      </select>
                                    </div>
                                  </div>

                                </div>
                              </div>

                              {{-- Other Information --}}
                              {{-- <h4 class="text-center text-decoration-underline mb-3">Other Information</h4>
                              <div class="border border-secondary p-3 mb-5">
                                <label for="" class="form-label fw-bold">Comments</label>
                                <textarea class="form-control" id="contract_person" name="contract_person" placeholder="Leave any comment here!" rows="4"></textarea>
                              </div> --}}

                            </div>
                            <div class="modal-footer">
                              <button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal" aria-label="Close">Cancel</button>
                              <button class="btn btn-sm btn-success" type="submit" onclick="this.disabled=true;this.form.submit();">Edit</button>
                            </div>
                          </form>
                        </div>
                      </div>
                    </div>
                  @endforeach

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

  @push('select2')
    <script>
        $(document).ready(function() {
            // Select2 Multiple
            $('.select2').select2({
                
            });
        });
    </script>
  @endpush

@endsection