@extends('layouts.dash')

@section('content')

<!--begin::Main-->
<div class="app-main flex-column flex-row-fluid" id="kt_app_main">
						<!--begin::Content wrapper-->
						<div class="d-flex flex-column flex-column-fluid">
							<!--begin::Toolbar-->
							<div id="kt_app_toolbar" class="app-toolbar py-3 py-lg-6">
								<!--begin::Toolbar container-->
								<div id="kt_app_toolbar_container" class="app-container container-xxl d-flex flex-stack">
									<!--begin::Page title-->
									<div class="page-title d-flex flex-column justify-content-center flex-wrap me-3">
										<!--begin::Title-->
										<h1 class="page-heading d-flex text-gray-900 fw-bold fs-3 flex-column justify-content-center my-0">Contractor</h1>
										<!--end::Title-->
										<!--begin::Breadcrumb-->
									
									</div>
									<!--end::Page title-->
								</div>
								<!--end::Toolbar container-->
							</div>
							<!--end::Toolbar-->
							<!--begin::Content-->
							<div id="kt_app_content" class="app-content flex-column-fluid">
								<!--begin::Content container-->
								<div id="kt_app_content_container" class="app-container container-xxl">
									<!--begin::Card-->
									<div class="card">
										<!--begin::Card header-->
										<div class="card-header border-0 pt-6">
											<!--begin::Card title-->
											<div class="card-title d-flex gap-3">
											



											<!--begin::Search-->
											<div class="d-flex align-items-center position-relative my-1">
												<i class="ki-duotone ki-magnifier fs-3 position-absolute ms-5">
													<span class="path1"></span>
													<span class="path2"></span>
												</i>
												<input type="text" data-kt-user-table-filter="search"
													class="form-control form-control-solid w-250px ps-13"
													placeholder="Search user" />
											</div>
											<!--end::Search-->
										</div>
											<!--begin::Card title-->
											<!--begin::Card toolbar-->
											<div class="card-toolbar">
												<!--begin::Toolbar-->
												<div class="d-flex justify-content-end" data-kt-user-table-toolbar="base">
													<!--begin::Filter-->
													<button type="button" class="btn btn-light-primary me-3" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-end">
													<i class="ki-duotone ki-filter fs-2">
														<span class="path1"></span>
														<span class="path2"></span>
													</i>Filter</button>
													<!--begin::Menu 1-->
													<div class="menu menu-sub menu-sub-dropdown w-300px w-md-325px" data-kt-menu="true">
														<!--begin::Header-->
														<div class="px-7 py-5">
															<div class="fs-5 text-gray-900 fw-bold">Filter Options</div>
														</div>
														<!--end::Header-->
														<!--begin::Separator-->
														<div class="separator border-gray-200"></div>
														<!--end::Separator-->
														<!--begin::Content-->
														<div class="px-7 py-5" data-kt-user-table-filter="form">
														    <form action="{{ route('filterContractor') }}" method="POST">
														        @csrf
															<!--begin::Input group-->
															<div class="mb-10">
                                                                <label class="form-label fs-6 fw-semibold">District:</label>
                                                                <select name="districtf" id="districtf" class="form-control form-control-solid" required>
                                                                                    <option value="">Select</option>
                                                                                    <option value="Alappuzha">Alappuzha</option>
                                                                                    <option value="Ernakulam">Ernakulam</option>
                                                                                    <option value="Idukki">Idukki</option>
                                                                                    <option value="Kannur">Kannur</option>
                                                                                    <option value="Kasaragod">Kasaragod</option>
                                                                                    <option value="Kollam">Kollam</option>
                                                                                    <option value="Kottayam">Kottayam</option>
                                                                                    <option value="Kozhikode">Kozhikode</option>
                                                                                    <option value="Malappuram">Malappuram</option>
                                                                                    <option value="Palakkad">Palakkad</option>
                                                                                    <option value="Pathanamthitta">Pathanamthitta</option>
                                                                                    <option value="Thiruvananthapuram">Thiruvananthapuram</option>
                                                                                    <option value="Thrissur">Thrissur</option>
                                                                                    <option value="Wayanad">Wayanad</option>
                    
                                                                                </select>
                                                            </div>
															<!--end::Input group-->
															<!--begin::Actions-->
															<div class="d-flex justify-content-end">
																<button type="reset" class="btn btn-light btn-active-light-primary fw-semibold me-2 px-6" data-kt-menu-dismiss="true" data-kt-user-table-filter="reset">Reset</button>
																<button type="submit" class="btn btn-primary fw-semibold px-6" data-kt-menu-dismiss="true" data-kt-user-table-filter="filter">Apply</button>
															</div>
															<!--end::Actions-->
														</div>
														<!--end::Content-->
													</div>
													<!--end::Menu 1-->
													<!--end::Filter-->
													<!--begin::Export-->
													<button type="button" class="btn btn-light-primary me-3" data-bs-toggle="modal" id="exportBtn">
													<i class="ki-duotone ki-exit-up fs-2">
														<span class="path1"></span>
														<span class="path2"></span>
													</i>Export</button>
													<!--end::Export-->
													<!--begin::Add user-->
													<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#kt_modal_add_user" id="addBtn">
													<i class="ki-duotone ki-plus fs-2"></i>Add Contarct</button>
													<!--end::Add user-->
												</div>
												<!--end::Toolbar-->
												<!--begin::Modal - Adjust Balance-->
												<div class="modal fade" id="kt_modal_export_users" tabindex="-1" aria-hidden="true">
													<!--begin::Modal dialog-->
													<div class="modal-dialog modal-dialog-centered mw-650px">
														<!--begin::Modal content-->
														<div class="modal-content">
															<!--begin::Modal header-->
															<div class="modal-header">
																<!--begin::Modal title-->
																<h2 class="fw-bold">Export Users</h2>
																<!--end::Modal title-->
																<!--begin::Close-->
																<div class="btn btn-icon btn-sm btn-active-icon-primary" data-kt-users-modal-action="close">
																	<i class="ki-duotone ki-cross fs-1">
																		<span class="path1"></span>
																		<span class="path2"></span>
																	</i>
																</div>
																<!--end::Close-->
															</div>
															<!--end::Modal header-->
															<!--begin::Modal body-->
															<div class="modal-body scroll-y mx-5 mx-xl-15 my-7">
																<!--begin::Form-->
																<form id="kt_modal_export_users_form" class="form" action="#">
																	<!--begin::Input group-->
																	<div class="fv-row mb-10">
																		<!--begin::Label-->
																		<label class="fs-6 fw-semibold form-label mb-2">Select Roles:</label>
																		<!--end::Label-->
																		<!--begin::Input-->
																		<select name="role" data-control="select2" data-placeholder="Select a role" data-hide-search="true" class="form-select form-select-solid fw-bold">
																			<option></option>
																			<option value="Administrator">Administrator</option>
																			<option value="Analyst">Analyst</option>
																			<option value="Developer">Developer</option>
																			<option value="Support">Support</option>
																			<option value="Trial">Trial</option>
																		</select>
																		<!--end::Input-->
																	</div>
																	<!--end::Input group-->
																	<!--begin::Input group-->
																	<div class="fv-row mb-10">
																		<!--begin::Label-->
																		<label class="required fs-6 fw-semibold form-label mb-2">Select Export Format:</label>
																		<!--end::Label-->
																		<!--begin::Input-->
																		<select name="format" data-control="select2" data-placeholder="Select a format" data-hide-search="true" class="form-select form-select-solid fw-bold">
																			<option></option>
																			<option value="excel">Excel</option>
																			<option value="pdf">PDF</option>
																			<option value="cvs">CVS</option>
																			<option value="zip">ZIP</option>
																		</select>
																		<!--end::Input-->
																	</div>
																	<!--end::Input group-->
																	<!--begin::Actions-->
																	<div class="text-center">
																		<button type="reset" class="btn btn-light me-3" data-kt-users-modal-action="cancel">Discard</button>
																		<button type="submit" class="btn btn-primary" data-kt-users-modal-action="submit">
																			<span class="indicator-label">Submit</span>
																			<span class="indicator-progress">Please wait... 
																			<span class="spinner-border spinner-border-sm align-middle ms-2"></span></span>
																		</button>
																	</div>
																	<!--end::Actions-->
																</form>
																<!--end::Form-->
															</div>
															<!--end::Modal body-->
														</div>
														<!--end::Modal content-->
													</div>
													<!--end::Modal dialog-->
												</div>
												<!--end::Modal - New Card-->
												<!--begin::Modal - Add task-->
												<div class="modal fade" id="kt_modal_add_user" tabindex="-1" aria-hidden="true">
													<!--begin::Modal dialog-->
													<div class="modal-dialog modal-dialog-centered mw-650px">
														<!--begin::Modal content-->
														<div class="modal-content">
															<!--begin::Modal header-->
															<div class="modal-header" id="kt_modal_add_user_header">
																<!--begin::Modal title-->
																<h2 class="fw-bold" id="cont_head">Add Contractor</h2>
																<!--end::Modal title-->
																<!--begin::Close-->
																<div class="btn btn-icon btn-sm btn-active-icon-primary" data-bs-dismiss="modal">
																	<i class="ki-duotone ki-cross fs-1">
																		<span class="path1"></span>
																		<span class="path2"></span>
																	</i>
																</div>
																<!--end::Close-->
															</div>
															<!--end::Modal header-->
															<!--begin::Modal body-->
															<div class="modal-body px-5 my-7">
																<!--begin::Form-->
																<form id="kt_modal_add_user_form" class="form" action="{{ url('RegisterContractor') }}">
																	@csrf
																	<!--begin::Scroll-->
                                                                    <div class="scroll-y me-n7 pe-7" id="kt_modal_new_address_scroll" data-kt-scroll="true" data-kt-scroll-activate="{default: false, lg: true}" data-kt-scroll-max-height="auto" data-kt-scroll-dependencies="#kt_modal_new_address_header" data-kt-scroll-wrappers="#kt_modal_new_address_scroll" data-kt-scroll-offset="350px">
                                                                        
                                                								<div class="row mb-5">
                                                									<!--begin::Col-->
                                                									<div class="col-md-4 fv-row">
                                                										<!--begin::Label-->
                                                										<label class="fs-5 fw-semibold mb-2">Name<span style="color: red;">*</span></label>
                                                										<!--end::Label-->
                                                										<!--begin::Input-->
                                                										<input type="text" class="form-control form-control-solid" placeholder="" name="name" id="name" />
                                                										<span id="name-error" class="text-danger"></span>
                                                										<!--end::Input-->
                                                									</div>
                                                									<!--end::Col-->
                                                									<!--begin::Col-->
                                                									<div class="col-md-4 fv-row">
                                                										<!--end::Label-->
                                                										<label class="fs-5 fw-semibold mb-2">Phone<span style="color: red;">*</span></label>
                                                										<!--end::Label-->
                                                										<!--end::Input-->
                                                										<input type="text" class="form-control form-control-solid" placeholder="" name="phone" id="phone" />
                                                										<span id="phone-error" class="text-danger"></span>
                                                										<!--end::Input-->
                                                									</div>
                                                									<!--end::Col-->
                                                									<div class="col-md-4 fv-row">
                                                										<!--end::Label-->
                                                										<label class="fs-5 fw-semibold mb-2">Email<span style="color: red;">*</span></label>
                                                										<!--end::Label-->
                                                										<!--end::Input-->
                                                										<input type="email" class="form-control form-control-solid" placeholder="" name="email" id="email" />
                                                										<span id="email-error" class="text-danger"></span>
                                                										<!--end::Input-->
                                                									</div>
                                                								</div>
                                                								<div class="row mb-5">
                                                									<!--begin::Col-->
                                                									<div class="col-md-4 fv-row">
                                                										<!--begin::Label-->
                                                										<label class="fs-5 fw-semibold mb-2">Contact person name</label>
                                                										<!--end::Label-->
                                                										<!--begin::Input-->
                                                										<input type="text" class="form-control form-control-solid" placeholder="" name="cont_per_name" id="cont_per_name" />
                                                										<span id="cont-error" class="text-danger"></span>
                                                										<!--end::Input-->
                                                									</div>
                                                									<!--end::Col-->
                                                									<!--begin::Col-->
                                                                                    <div class="col-md-4 fv-row">
                                                										<!--end::Label-->
                                                										<label class="fs-5 fw-semibold mb-2">Contact person phone</label>
                                                										<!--end::Label-->
                                                										<!--end::Input-->
                                                										<input type="text" class="form-control form-control-solid" placeholder="" name="cont_per_phone" id="cont_per_phone" />
                                                										<span id="contper-error" class="text-danger"></span>
                                                										<!--end::Input-->
                                                									</div>
                                                									<!--begin::Col-->
                                                                                    <div class="col-md-4 fv-row">
                                                                                        <!--end::Label-->
                                                                                        <label
                                                                                            class="fs-5 fw-semibold mb-2">District</label>
                                                                                        <!--end::Label-->
                                                                                        <!--end::Input-->
                                                                                        <select name="district" id="district" class="form-control form-control-solid">
                                                                                            <option value="" selected>Select District</option>
                                                                                            <option value="Alappuzha">Alappuzha</option>
                                                                                            <option value="Ernakulam">Ernakulam</option>
                                                                                            <option value="Idukki">Idukki</option>
                                                                                            <option value="Kannur">Kannur</option>
                                                                                            <option value="Kasaragod">Kasaragod</option>
                                                                                            <option value="Kollam">Kollam</option>
                                                                                            <option value="Kottayam">Kottayam</option>
                                                                                            <option value="Kozhikode">Kozhikode</option>
                                                                                            <option value="Malappuram">Malappuram</option>
                                                                                            <option value="Palakkad">Palakkad</option>
                                                                                            <option value="Pathanamthitta">Pathanamthitta</option>
                                                                                            <option value="Thiruvananthapuram">Thiruvananthapuram</option>
                                                                                            <option value="Thrissur">Thrissur</option>
                                                                                            <option value="Wayanad">Wayanad</option>
                            
                                                                                        </select>
                                                                                        <span id="dis-error" class="text-danger"></span>
                                                                                        
                                                                                        <!--end::Input-->
                                                                                    </div>
                                                                                    <span id="dis-error" class="text-danger"></span>
                                                                                    <!--end::Col-->
                                                									
                                                									
                                                								</div>
                                                							
                                                								<!--<div class="row mb-5">-->
                                                								    <!--begin::Col-->
                                                								<!--    <div class="col-md-4 fv-row">-->
                                                										<!--end::Label-->
                                                								<!--		<label class="fs-5 fw-semibold mb-2">Address<span style="color: red;">*</span></label>-->
                                                										<!--end::Label-->
                                                										<!--end::Input-->
                                                								<!--		<input type="text" class="form-control form-control-solid" placeholder="" name="address" id="address" />-->
                                                								<!--		<span id="addr-error" class="text-danger"></span>-->
                                                										<!--end::Input-->
                                                								<!--	</div>-->
                                                									<!--end::Col-->
                                                									<!--begin::Col-->
                                                								<!--	<div class="col-md-4 fv-row">-->
                                                										<!--begin::Label-->
                                                								<!--		<label class=" fs-5 fw-semibold mb-2">GST No</label>-->
                                                										<!--end::Label-->
                                                										<!--begin::Input-->
                                                								<!--		<input type="number" class="form-control form-control-solid" placeholder="" name="gst" id="gst" />-->
                                                								<!--		<span id="gst-error" class="text-danger"></span>-->
                                                										<!--end::Input-->
                                                								<!--	</div>-->
                                                        <!--                            <div class="col-md-4 fv-row">-->
                                                										<!--begin::Label-->
                                                								<!--		<label class=" fs-5 fw-semibold mb-2">Option to upload id</label>-->
                                                										<!--end::Label-->
                                                										<!--begin::Input-->
                                                								<!--		<input type="file" class="form-control form-control-solid" placeholder="" name="file" />-->
                                                								<!--		<span id="fileInput"></span>-->
                                                										<!--end::Input-->
                                                								<!--	</div>-->
                                                									
                                                									
                                                								<!--</div>-->
                                                								<div class="row mb-5">
                                                								    <!--begin::Col-->
                                                								    <div class="col-md-4 fv-row">
                                                									<!--end::Label-->
                                                										<label class="fs-5 fw-semibold mb-2">Address</label>
                                                										<!--end::Label-->
                                                										<!--end::Input-->
                                                										<input type="text" class="form-control form-control-solid" placeholder="" name="address" id="address" />
                                                										<span id="addr-error" class="text-danger"></span>
                                                									<!--	end::Input-->
                                                									</div>
                                                									
                                                									<div class="col-md-4 fv-row">
                                                										<!--begin::Label-->
                                                										<label class=" fs-5 fw-semibold mb-2">Option to upload id</label>
                                                										<!--end::Label-->
                                                										<!--begin::Input-->
                                                										<input type="file" class="form-control form-control-solid" placeholder="" name="file" />
                                                										<span id="fileInput"></span>
                                                										<!--end::Input-->
                                                									</div>
                                                									
                                                									<!--end::-->
                                                									<!--begin::Col-->
                                                									
                                                                                  
                                                										<div class="row mb-5">
                                                                                        <!--begin::Col-->
                                                                                        <div class="col-md-4 fv-row">
                                                                                            <label class="fs-7 fw-semibold mb-2">Are you registered with GST? </label>
                                                                                            <select name="is_gst_registered" id="is_gst_registered" class="form-control form-control-solid" onchange="toggleGstField()">
                                                                                                <option value="">Select</option>
                                                                                                <option value="yes">Yes</option>
                                                                                                <option value="no">No</option>
                                                                                            </select>
                                                                                            <span id="is_gst_registered-error" class="text-danger"></span>
                                                                                        </div>
                                                                                        <div class="col-md-4 fv-row" id="gst_field" style="display: none;">
                                                                                            <label class="fs-5 fw-semibold mb-2">GST No </label>
                                                                                            <input type="text" class="form-control form-control-solid" placeholder="Enter GST Number" name="gst" />
                                                                                            <span id="gst-error" class="text-danger"></span>
                                                                                        </div>
                                                                                    </div>
                                                									
                                                								</div>
                                                							</div>
                                                							<input type="hidden" name="user_type" value="contractor" />
																	<!--end::Scroll-->
																	<!--begin::Actions-->
																	<div class="text-center pt-10">
																		<button type="reset" class="btn btn-light me-3"
																			data-bs-dismiss="modal">Discard</button>
																		<button type="submit" class="btn btn-primary">
																			<span class="indicator-label">Submit</span>
																			<span class="indicator-progress">Please wait...
																				<span
																					class="spinner-border spinner-border-sm align-middle ms-2"></span></span>
																		</button>
																	</div>
																	<!--end::Actions-->
																</form>
																<!--end::Form-->
															</div>
															<!--end::Modal body-->
														</div>
														<!--end::Modal content-->
													</div>
													<!--end::Modal dialog-->
												</div>
												<!--end::Modal - Add task-->
											</div>
											<!--end::Card toolbar-->
										</div>
										<!--end::Card header-->
										<!--begin::Card body-->
										<div class="card-body py-4">
										    
										    @if (session('success'))
                                                <div class="alert alert-success">
                                                    {{ 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
											<!--begin::Table-->
											<table class="table align-middle table-row-dashed fs-6 gy-5" id="kt_table_users">
												<thead>
													<tr class="text-start text-muted fw-bold fs-7 text-uppercase gs-0">
														
														<th class="min-w-90px">Name</th>
														<th class="min-w-90px">Phone</th>
														<th class="min-w-100px">Email</th>
														<th class="min-w-125px">Cont-per name</th>
														<th class="min-w-125px">Cont-per phone</th>
														<th class=" min-w-100px">Address</th>
														<th class=" min-w-80px">GST No</th>
														<th class=" min-w-100px"></th>
														<th class=" min-w-100px">Status</th>
														<th class="text-end min-w-50px"></th>
													</tr>
												</thead>
												<tbody class="text-gray-600 fw-semibold">
													@if($list)
													@foreach($list as $li)
													<tr>
														<td>{{ $li->user->name }}</td>
														<td>{{ $li->phone }}</td>
														<td>{{ $li->user->email }}</td>
														<td>{{ $li->cont_per_name }}</td>
														<td>{{ $li->cont_per_phone}}</td>
														<td>{{ $li->address}}</td>
														<td>{{ $li->gst}}</td>
														<td>
														    @if($li->file)
                                                            <a href="{{ $li->file }}" download 
                                                               style="display: inline-block; padding: 10px 20px; background-color: #1D4ED8; color: white; font-size: 14px; font-weight: 500; text-align: center; border-radius: 6px; text-decoration: none; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); transition: background-color 0.3s ease;">
                                                                Download
                                                            </a>
                                                            @endif
                                                        </td>
                                                        <td>
                                                            <div class="col-xl-9">
                                                                <div class="form-check form-switch form-check-custom form-check-solid">
                                                                    <input class="form-check-input" type="checkbox" id="status-{{ $li->user_id }}" name="status" data-user-id="{{ $li->user_id }}" {{ $li->status ? 'checked' : '' }}>
                                                                    <label class="form-check-label fw-semibold text-gray-500 ms-3" for="status">
                                                                        {{ $li->status == 1 ? 'Active' : 'Blocked' }}
                                                                    </label>
                                                                </div>
                                                            </div>
                                                        </td>
														<td class="text-end">
															<a href="#" class="btn btn-light btn-active-light-primary btn-flex btn-center btn-sm" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-end"><i class="fas fa-ellipsis-v ki-down"></i> 
															</a>
															<!--begin::Menu-->
															<div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-600 menu-state-bg-light-primary fw-semibold fs-7 w-125px py-4" data-kt-menu="true">
																<!--begin::Menu item-->
																<div class="menu-item px-3">
																	<button type="button" class="menu-link px-3 editBtn" data-id="{{ $li->id }}" style="border: none;background: white;" data-bs-toggle="modal" data-bs-target="#kt_modal_add_user">
																		Edit</button>
																</div>
																<!--end::Menu item-->
																<!--begin::Menu item-->
																<div class="menu-item px-3">
																	<form action="{{ route('contractor.delete', $li->id) }}" method="POST" style="display:inline;" onsubmit="return confirm('Are you sure?');">
																		@csrf
																		@method('DELETE')
																		<button type="submit" class="menu-link px-3" style="border: none;background: white;">Delete</button>
																	</form>
																</div>
																<!--end::Menu item-->
															</div>
															<!--end::Menu-->
														</td>
													</tr>
													@endforeach
													@endif
													</tbody>
											</table>
											<!--end::Table-->
										</div>
										<!--end::Card body-->
									</div>
									<!--end::Card-->
								</div>
								<!--end::Content container-->
							</div>
							<!--end::Content-->
						</div>
						<!--end::Content wrapper-->
						<!--begin::Footer-->
						<div id="kt_app_footer" class="app-footer">
							<!--begin::Footer container-->
							<div class="app-container container-fluid d-flex flex-column flex-md-row flex-center flex-md-stack py-3">
								<!--begin::Copyright-->
								<div class="text-gray-900 order-2 order-md-1">
									<span class="text-muted fw-semibold me-1">2024&copy;</span>
									<a href="https://keenthemes.com" target="_blank" class="text-gray-800 text-hover-primary">Keenthemes</a>
								</div>
								<!--end::Copyright-->
								<!--begin::Menu-->
								<ul class="menu menu-gray-600 menu-hover-primary fw-semibold order-1">
									<li class="menu-item">
										<a href="https://keenthemes.com" target="_blank" class="menu-link px-2">About</a>
									</li>
									<li class="menu-item">
										<a href="https://devs.keenthemes.com" target="_blank" class="menu-link px-2">Support</a>
									</li>
									<li class="menu-item">
										<a href="https://1.envato.market/EA4JP" target="_blank" class="menu-link px-2">Purchase</a>
									</li>
								</ul>
								<!--end::Menu-->
							</div>
							<!--end::Footer container-->
						</div>
						<!--end::Footer-->
					</div>
					<div id="page-loader" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); z-index: 9999; text-align: center;">
                        <div style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">
                            <div class="spinner-border text-light" role="status">
                                <span class="visually-hidden">Loading...</span>
                            </div>
                        </div>
                    </div>
					<!--end:::Main-->

					<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
					<script>   
					
					$(document).ready(function () {
						// Add user form submission
						$('#kt_modal_add_user_form').on('submit', function (e) {
							e.preventDefault(); // Prevent the default form submission
					        
					        const form = document.getElementById("kt_modal_add_user_form");
                            const submitButton = form.querySelector("button[type='submit']");
                        
                            submitButton.disabled = true; 
							
							let formData = new FormData(this);
							const actionUrl = $(this).attr('action'); // Fetch the form action URL again right before submitting
                            console.log("Submitting form to: ", actionUrl); // Log to ensure it's not undefined
                            
                            if (!actionUrl) {
                                console.error("Form action URL is undefined or empty.");
                                return;
                            }
                            
                            $('#page-loader').show();
							$.ajax({
								url: actionUrl, // Use the action URL for the current operation
								type: actionUrl.includes('/RegisterContractor') ? "POST" : "POST", // Change to PUT if editing
								data: formData,
								contentType: false,
								processData: false,
								success: function (response) {
								    console.log(response);
									// On success, reset the form, close the modal, and reload the page
									if (response.success) {
					
										
										$('#kt_modal_add_user_form').trigger("reset"); 
										$('#kt_modal_export_users').modal('hide'); 
										location.reload(); 
									}
								},
								error: function (xhr) {
								   $('#page-loader').hide();
								   submitButton.disabled = false;
									$('.text-danger').remove(); 
									let errors = xhr.responseJSON.errors;
									if (errors) {
										for (let key in errors) {
											let errorMessage = errors[key][0];
											console.log(errorMessage);
                                            
                                            $(`input[name="${key}"]`).after(`<span class="text-danger">${errorMessage}</span>`);
                                            $(`#${key}-error`).text(errorMessage);
                                            
								// 			$('input[name="' + key + '"]').after('<span class="text-danger">' + errorMessage + '</span>');
										}
									}
								}
							});
						});
					
					  
						$('#addBtn').on('click', function() {
						    const actionUrl = "{{ url('RegisterContractor') }}"; 
						    //alert(actionUrl);
						    $('#cont_head').html("Add Contractor");
							$('#kt_modal_add_user_form').attr('action', actionUrl); 
							$('#kt_modal_add_user_form button[type=submit]').text('Add User'); 
							$('#kt_modal_add_user_form')[0].reset(); 
						});
					
						
						$('.editBtn').on('click', function() {
							var userId = $(this).data('id');
					  
						   
							$.ajax({
								url: 'contractor/edit/' + userId,
								type: 'GET',
								success: function(data) {
					
								   
								   
									$('#kt_modal_add_user_form').attr('action', '{{ url("/contractor/update") }}/' + userId); 
									$('#kt_modal_add_user_form button[type=submit]').text('Update User'); 
					                $('#cont_head').html("Edit Contractor");
								   
									$('[name="name"]').val(data.user.name);
									$('[name="email"]').val(data.user.email);
									$('[name="cont_per_name"]').val(data.cont_per_name);
									$('[name="cont_per_phone"]').val(data.cont_per_phone);
									$('#district').val(data.district).change();
									$('[name="phone"]').val(data.phone);
									$('[name="address"]').val(data.address);
									$('#is_gst_registered').val(data.is_gst_registered).change();
                                    $('[name="gst"]').val(data.gst);
									$('#fileInput').html(data.file);
					                $('.text-danger').html('');
									
								},
								error: function(xhr) {
									alert('Error loading data');
								}
							});
						});
					});
                
                    document.addEventListener("DOMContentLoaded", function () {
                        // Select all input and select fields that need validation
                        const fields = document.querySelectorAll("input, select");
                    
                        fields.forEach((field) => {
                            field.addEventListener("input", function () {
                                // Find the error container directly after the field
                                const errorContainer = this.closest(".fv-row").querySelector(".text-danger");
                    
                                // Skip validation if no error container is found
                                if (!errorContainer) return;
                    
                                // Add or clear validation message
                                if (this.value.trim() === "" || (this.tagName === "SELECT" && this.value === "default")) {
                                    errorContainer.textContent = `The ${this.name || this.placeholder || "field"} is required.`;
                                } else {
                                    errorContainer.textContent = ""; // Clear error if input is valid
                                }
                            });
                    
                            // Special case for `change` event on select boxes
                            /*if (field.tagName === "SELECT") {
                                field.addEventListener("change", function () {
                                    const errorContainer = this.closest(".fv-row").querySelector(".text-danger");
                    
                                    if (!errorContainer) return;
                    
                                    if (this.value === "" || this.value === "default") {
                                        errorContainer.textContent = `The ${this.name || "field"} is required.`;
                                    } else {
                                        errorContainer.textContent = ""; // Clear error if valid
                                    }
                                });
                            }*/
                        });
                    });    
                       
					
					document.getElementById('exportBtn').addEventListener('click', function () {
                                let table = document.getElementById('kt_table_users');
                                let rows = Array.from(table.querySelectorAll('tr'));
                            
                                // Create CSV data excluding the "Actions" column (last column)
                                let csvContent = rows.map(row => {
                                    let cols = Array.from(row.querySelectorAll('th, td'));
                                    
                                    // Filter out the last column (index -1 means skip the last column)
                                    let filteredCols = cols.slice(0, -2);
                            
                                    // Join the content as CSV format
                                    return filteredCols.map(col => `"${col.textContent}"`).join(',');
                                }).join('\n');
                            
                                // Create a downloadable link
                                let csvBlob = new Blob([csvContent], { type: 'text/csv' });
                                let csvUrl = URL.createObjectURL(csvBlob);
                                let link = document.createElement('a');
                                link.href = csvUrl;
                                link.download = 'export.csv';
                            
                                // Trigger the download
                                link.click();
                            });
                            
                            document.querySelectorAll('.form-check-input').forEach((checkbox) => {
                                checkbox.addEventListener('change', function () {
                                    // Retrieve user ID from the data attribute
                                    const userId = this.dataset.userId;
                                    console.log('User ID:', userId); // Debugging step to ensure userId is correct
                            
                                    if (!userId) {
                                        alert('User ID not found! Check the data-user-id attribute.');
                                        return;
                                    }
                            
                                    // Construct the URL
                                    const url = `{{ url('/toggleStatus') }}?id=${userId}`;
                                    console.log('URL:', url); // Debugging step to check URL format
                            
                                    // Perform the API call
                                    fetch(url, {
                                        method: 'POST',
                                        headers: {
                                            'Content-Type': 'application/json',
                                            'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content
                                        },
                                        body: JSON.stringify({})
                                    })
                                        .then(response => response.json())
                                        .then(data => {
                                            console.log('Response:', data); // Debugging step to check API response
                                            if (data.success) {
                                                alert(data.message);
                                            } else {
                                                alert('Failed to update status.');
                                            }
                                        })
                                        .catch(error => console.error('Error:', error));
                                });
                            });
                            
                            function toggleGstField() {
                                const isGstRegistered = document.getElementById('is_gst_registered').value;
                                const gstField = document.getElementById('gst_field');
                            
                                if (isGstRegistered === 'yes') {
                                    gstField.style.display = 'block';
                                } else {
                                    gstField.style.display = 'none';
                                }
                            }
					</script>

@endsection