@extends('Admin/Layouts/app')
@section('content')
<div class="container-fluid p-3">
    <div class="row">
        <div class="col-lg-12 col-md-12 col-12">
            <!-- Page header -->

            <div class="border-bottom pb-4 mb-4">
                <h3 class="mb-0 fw-bold">Add Employee</h3>
            </div>

        </div>
    </div>
    <div class="row mb-8">
        <div class="col-xl-3 col-lg-4 col-md-12 col-12">
            <div class="mb-4 mb-lg-0">
                <h4 class="mb-1">Profile</h4>
                <p class="mb-0 fs-5 text-muted">Profile Information </p>
            </div>

        </div>

        <div class="col-xl-9 col-lg-8 col-md-12 col-12">
            <form action="/Admin/add-employee-submit" method="post" enctype="multipart/form-data">
                @csrf
                <!-- card -->
                <div class="card">
                    <!-- card body -->
                    <div class="card-body">
                        <div class="d-flex justify-content-between">
                            <div class="p-2">
                                <div class=" mb-6">
                                    <h4 class="mb-1">Profile Settings</h4>

                                </div>
                            </div>
                            
                        </div>
                        <div class="row align-items-center mb-8">
                            <div class="col-md-3 mb-3 mb-md-0">
                                <h5 class="mb-0">Avatar</h5>
                            </div>
                            <div class="col-md-9">
                                <div class="d-flex align-items-center">
                                    <div class="me-3">
                                        <img src="{{URL('other.png')}}" class="rounded-circle avatar avatar-lg" alt="">
                                    </div>
                                    <div>
                                        <button type="button" class="btn btn-outline-white
                        me-1" onclick="$('#user_photo').click()">Change</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!-- col -->
                        <input type="file" style="visibility: hidden;" name="user_photo" id="user_photo"
                        accept="image/jpg,image/jpeg,image/png,image/webp">

                        <div>
                            <!-- border -->
                            <div class="mb-6">
                                <h4 class="mb-1">Basic information</h4>

                            </div>
                            <!-- row -->

                            <div class="mb-3 row">
                                <label for="fullName" class="col-sm-4 col-form-label
                      form-label">Full name</label>
                                <div class="col-sm mb-3 mb-lg-0">
                                    <input type="text" class="form-control" value=""
                                        placeholder="Full name" id="fullName" required name="name">
                                </div>
                            </div>
                            <div class="mb-3 row">
                                <label for="executive" class="col-sm-4 col-form-label
                      form-label">Select Executive</label>
                                <div class="col-sm mb-3 mb-lg-0">
                                    <select name="executive" id="executive" required class="form-control">
                                        <option value="">--Please Select--</option>
                                        @foreach($executive as $data)
                                            <option value="{{$data->unique_id}}">{{$data->frm}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                            <!-- row -->
                            <div class="mb-3 row">
                                <label for="email" class="col-sm-4 col-form-label
                      form-label">Email</label>
                                <div class="col-md-8 col-12">
                                    <input type="email" class="form-control" value=""
                                        placeholder="Email" id="email" required name="email">
                                </div>
                            </div>
                            <!-- row -->
                            <div class="mb-3 row">
                                <label for="phone" class="col-sm-4 col-form-label
                      form-label">Mobile</label>
                                <div class="col-md-8 col-12">
                                    <input type="text" class="form-control" value=""
                                        placeholder="Mobile" id="phone" required name="phone">
                                </div>
                            </div>
                            <div class="mb-3 row">
                                <label for="phone" class="col-sm-4 col-form-label
                      form-label">Address</label>
                                <div class="col-md-8 col-12">
                                    <input type="text" class="form-control" value=""
                                        placeholder="Address" required id="Address" name="address">
                                </div>
                            </div>
                            <div class="mb-3 row">
                                <label for="password" class="col-sm-4 col-form-label
                      form-label">Password</label>
                                <div class="col-md-8 col-12">
                                    <input type="password" class="form-control" value=""
                                        placeholder="Password" required id="password" name="password">
                                </div>
                            </div>
                            <div class="mb-3 row">
                                <label for="confirmpassword" class="col-sm-4 col-form-label
                      form-label">Confirm Password</label>
                                <div class="col-md-8 col-12">
                                    <input type="password" class="form-control" value=""
                                        placeholder="Confirm Password" required id="confirmpassword" name="confirmpassword">
                                </div>
                            </div>
                            <!-- row -->
                             

                            <div class="row align-items-center">
                                <div class="offset-md-4 col-md-8 ">
                                    <button type="submit" class="btn btn-primary"> Save
                                        Changes</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>


@endsection