@extends('layout.mainlayout')
@section('content')

    <!-- ========================
        Start Page Content
    ========================= -->

    <div class="page-wrapper">

        <!-- Start Content -->
		<div class="content">
			<div class="page-header">
				<div class="add-item d-flex">
					<div class="page-title">
						<h4>Edit Employee</h4>
						<h6>Edit Employee</h6>
					</div>
				</div>
				<ul class="table-top-head">
					<li class="me-2">
						<a data-bs-toggle="tooltip" data-bs-placement="top" title="Refresh"><i class="ti ti-refresh"></i></a>
					</li>
					<li>
						<a data-bs-toggle="tooltip" data-bs-placement="top" title="Collapse" id="collapse-header"><i class="ti ti-chevron-up"></i></a>
					</li>
				</ul>
				<div class="page-btn">
					<a href="{{url('employees-list')}}" class="btn btn-secondary"><i data-feather="arrow-left" class="me-2"></i>Back to List</a>
				</div>
			</div>

			<!-- /product list -->
			<form action="{{url('edit-employee')}}">
				<div class="accordion-card-one accordion" id="accordionExample">
					<div class="accordion-item">
						<div class="accordion-header p-3" id="headingOne">
							<div class="accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseOne"  aria-controls="collapseOne">
								<div class="addproduct-icon d-flex align-items-center justify-content-between flex-fill">
									<h5 class="d-inline-flex align-items-center"><i data-feather="info" class="feather-edit text-primary me-2"></i><span>Employee Information</span></h5>
								</div>
							</div>
						</div>
						<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
						<div class="accordion-body">
							<div class="new-employee-field">
								<div class="profile-pic-upload edit-pic">
									<div class="profile-pic">
										<span><img src="{{URL::asset('build/img/users/user-01.jpg')}}" alt="Img"></span>
									</div>
									<div class="me-3 mb-0">
										<div class="image-upload mb-0">
											<input type="file">
											<div class="image-uploads">
												<h4>Change Image</h4>
											</div>
										</div>
									</div>
								</div>
								<div class="row">
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">First Name<span class="text-danger ms-1">*</span></label>
											<input type="text" class="form-control" value="Mitchum">
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Last Name<span class="text-danger ms-1">*</span></label>
											<input type="text" class="form-control" value="Daniel">
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Email<span class="text-danger ms-1">*</span></label>
											<input type="email" class="form-control" value="mir34345@example.com">
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Contact Number<span class="text-danger ms-1">*</span></label>
											<input type="text" class="form-control" value="+1 54554 54788">
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Emp Code<span class="text-danger ms-1">*</span></label>
											<input type="text" class="form-control" value="POS001">
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="input-blocks">
											<label class="form-label">Date of Birth<span class="text-danger ms-1">*</span></label>
											<div class="input-groupicon calender-input">
												<i data-feather="calendar" class="info-img"></i>
												<input type="text" class="datetimepicker form-control ps-2" placeholder="Select Date" value="13 Aug 1992">
											</div>
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Gender<span class="text-danger ms-1">*</span></label>
											<select class="select">
												<option>Male</option>
												<option>Female</option>
											</select>
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Nationality<span class="text-danger ms-1">*</span></label>
											<select class="select">
												<option>United Kingdom</option>
												<option>India</option>
											</select>
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="input-blocks">
											<label class="form-label">Joining Date<span class="text-danger ms-1">*</span></label>
											<div class="input-groupicon calender-input">
												<i data-feather="calendar" class="info-img"></i>
												<input type="text" class="datetimepicker form-control ps-2" placeholder="Select Date" >
											</div>
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<div class="add-newplus">
												<label class="form-label">Shift<span class="text-danger ms-1">*</span></label>
												<a href="#" data-bs-toggle="modal" data-bs-target="#add_customer"><span><i data-feather="plus-circle" class="plus-down-add"></i>Add new</span></a>
											</div>
											<select class="select">
												<option>Regular</option>
											</select>
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Department<span class="text-danger ms-1">*</span></label>
											<select class="select">
												<option>UI/UX</option>
												<option>Support</option>
												<option>HR</option>
												<option>Engineering</option>
											</select>
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Designation<span class="text-danger ms-1">*</span></label>
											<select class="select">
												<option>Designer</option>
												<option>Developer</option>
												<option>Tester</option>
											</select>
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Blood Group<span class="text-danger ms-1">*</span></label>
											<select class="select">
												<option>O positive</option>
												<option>A positive</option>
												<option>B negative</option>
											</select>
										</div>
									</div>
									<!-- Editor -->
									<div class="col-lg-12">
										<div class="input-blocks summer-description-box transfer mb-3">
											<label>About</label>
											<div class="editor pages-editor">As an award winning designer, I deliver exceptional quality work and bring value to your brand! With 10 years of experience and 350+ projects completed worldwide with satisfied customers, I developed the 360° brand approach, which helped me to create numerous brands that are relevant, meaningful and loved.Phone</div>
											<p class="mt-1">Maximum 60 Characters</p>
										</div>
									</div>
									<!-- /Editor -->
								</div>
							</div>
						</div>
						</div>
					</div>
					<div class="accordion-item">
						<div class="accordion-header p-3" id="heading3">
							<div class="accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseThree"  aria-controls="collapseThree">
								<div class="addproduct-icon d-flex align-items-center justify-content-between flex-fill">
									<h5 class="d-inline-flex align-items-center"><i data-feather="map-pin" class="feather-edit text-primary me-2"></i><span>Address Information</span></h5>
								</div>
							</div>
						</div>
						<div id="collapseThree" class="accordion-collapse collapse show" aria-labelledby="heading3" data-bs-parent="#accordionExample">
						<div class="accordion-body">
							<div class="other-info">
								<div class="row">
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Address</label>
											<input type="text" class="form-control" value="1861 Bayonne Ave, Manchester">
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Country</label>
											<select class="select">
												<option>Select</option>
												<option selected>United Kingdom</option>
												<option>USA</option>			
											</select>
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">State</label>
											<select class="select">
												<option>Select</option>
												<option selected>California</option>
												<option>Paris</option>			
											</select>
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">City</label>
											<select class="select">
												<option>Select</option>
												<option selected>Los Angeles</option>
												<option>New Jersey</option>			
											</select>
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Zipcode</label>
											<input type="text" class="form-control" value="90001">
										</div>
									</div>
								</div>
							</div>
						</div>
						</div>
					</div>
					<div class="accordion-item">
						<div class="accordion-header p-3" id="heading4">
							<div class="accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseFour"  aria-controls="collapseFour">
								<div class="addproduct-icon d-flex align-items-center justify-content-between flex-fill">
									<h5 class="d-inline-flex align-items-center"><i data-feather="info" class="feather-edit text-primary me-2"></i><span>Emergency Information</span></h5>
								</div>
							</div>
						</div>
						<div id="collapseFour" class="accordion-collapse collapse show" aria-labelledby="heading4" data-bs-parent="#accordionExample">
						<div class="accordion-body">
							<div class="other-info">
								<div class="row">
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Emergency Contact Number 1</label>
											<input type="text" class="form-control" value="+1 43566 67788">
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Relation</label>
											<input type="text" class="form-control" value="Mother">
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Name</label>
											<input type="text" class="form-control" value="Andrea Jermiah">
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Emergency Contact Number 2</label>
											<input type="text" class="form-control">
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Relation</label>
											<input type="text" class="form-control">
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="mb-3">
											<label class="form-label">Name</label>
											<input type="text" class="form-control">
										</div>
									</div>
									
								</div>
							</div>
						</div>
						</div>
					</div>
					<div class="accordion-item">
						<div class="accordion-header p-3" id="heading5">
							<div class="accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseFive"  aria-controls="collapseFive">
								<div class="addproduct-icon d-flex align-items-center justify-content-between flex-fill">
									<h5 class="d-inline-flex align-items-center"><i class="ti ti-building-bank feather-edit text-primary me-2"></i><span>Bank Information</span></h5>
								</div>
							</div>
						</div>
						<div id="collapseFive" class="accordion-collapse collapse show" aria-labelledby="heading5" data-bs-parent="#accordionExample">
						<div class="accordion-body">
							<div class="other-info">
								<div class="row">
									<div class="col-lg-3 col-md-6">
										<div class="mb-3">
											<label class="form-label">Bank Name</label>
											<input type="text" class="form-control" value="Swizz International">
										</div>
									</div>
									<div class="col-lg-3 col-md-6">
										<div class="mb-3">
											<label class="form-label">Account Number</label>
											<input type="text" class="form-control" value="350501501690">
										</div>
									</div>
									<div class="col-lg-3 col-md-6">
										<div class="mb-3">
											<label class="form-label">IFSC</label>
											<input type="text" class="form-control" value="SW7994">
										</div>
									</div>
									<div class="col-lg-3 col-md-6">
										<div class="mb-3">
											<label class="form-label">Branch</label>
											<input type="text" class="form-control" value="Alabama USA">
										</div>
									</div>
								</div>
							</div>
						</div>
						</div>
					</div>
					<div class="accordion-item">
						<div class="accordion-header p-3" id="heading6">
							<div class="accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseTwo"  aria-controls="collapseTwo">
								<div class="addproduct-icon d-flex align-items-center justify-content-between flex-fill">
									<h5 class="d-inline-flex align-items-center"><i data-feather="info" class="feather-edit text-primary me-2"></i><span>Password</span></h5>
								</div>
							</div>
						</div>
						<div id="collapseTwo" class="accordion-collapse collapse show" aria-labelledby="heading6" data-bs-parent="#accordionExample">
						<div class="accordion-body">
							<div class="pass-info">
								<div class="row">
									<div class="col-lg-4 col-md-6">
										<div class="input-blocks mb-md-0 mb-sm-3">
											<label>Password</label>
											<div class="pass-group">
												<input type="password" class="pass-input form-control" value="12345678">
												<span class="fas toggle-password fa-eye-slash"></span>
											</div>
										</div>
									</div>
									<div class="col-lg-4 col-md-6">
										<div class="input-blocks mb-0">
											<label>Confirm Password</label>
											<div class="pass-group">
												<input type="password" class="pass-inputa form-control" value="12345678">
												<span class="fas toggle-passworda fa-eye-slash"></span>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
						</div>
					</div>


				</div>
				<!-- /product list -->

				<div class="text-end my-3 ">
					<button type="button" class="btn btn-secondary me-2">Cancel</button>
					<button type="submit" class="btn btn-primary">Save Changes</button>
				</div>
			</form>
		</div>
        <!-- End Content -->
    
        @include('layout.partials.footer')

    </div>

    <!-- ========================
        End Page Content
    ========================= -->

@endsection