<!-- Profile Form -->
<main class="main-wrapper">
    <div class="main-content">
        <div class="container-fluid">
            <div class="Procard">
                <div class="bacgroundLogo bg-black">
                    <div class="d-flex justify-content-center">

                        <img class="mt-5" src="<?php echo base_url(); ?>assets/images/dplogo.png" alt="">

                    </div>
                    <div class="d-flex justify-content-end mx-2 pt-5 align-items-center" style="height:100%;">
                        <button type="submit" class="editBtn btn btn-secondary px-5">
                            <!-- <img src="<?php echo base_url(); ?>assets/images/iconedit.svg" alt=""> -->
                            <!-- <i class="fa fa-edit"></i>                     -->
                            <!-- Edit -->
                        </button>




                    </div>
                </div>
                <form method="POST" action="<?php echo base_url('Users/updateProfile'); ?>" enctype="multipart/form-data">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="d-flex gap-2 align-items-end">
                                <div>
                                    <label for="pImage">
                                        <img class="profImage" height="200"
                                            src="<?php echo !empty($this->session->userdata['session_data']['u_image'])
                                                        ? $this->session->userdata['session_data']['u_image']
                                                        : base_url('assets/images/profimage.svg'); ?>"
                                            alt="Profile Image">
                                    </label>
                                    <input type="file" name="user_image" id="pImage" class="d-none">
                                </div>
                                <div>
                                    <p class="pf1 mb-2" id="fullNameDisplay">
                                        <?php echo $this->session->userdata['session_data']['firstName'] . ' ' . $this->session->userdata['session_data']['lastName']; ?>
                                    </p>
                                    <p class="pf2 mb-1 mt-2"><?php echo ucfirst($this->session->userdata['session_data']['userType']); ?></p>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <?php
                            $successMessage = $this->session->flashdata('successmessage');
                            $warningmessage = $this->session->flashdata('warningmessage');

                            if (isset($successMessage)) {
                                echo '<div id="alertmessage" class="col-md-12">
                                        <div class="alert alert-success alert-dismissible fade show" role="alert">
                                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                            ' . output($successMessage) . '
                                        </div>
                                    </div>';
                            }

                            if (isset($warningmessage)) {
                                echo '<div id="alertmessage" class="col-md-12">
                                        <div class="alert alert-warning alert-dismissible fade show" role="alert">
                                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                            ' . output($warningmessage) . '
                                        </div>
                                    </div>';
                            }
                            ?>
                        </div>
                        <!-- User Details -->
                        <div class="row">

                            <div class="col-md-4">
                                <label for="firstName">First Name</label>
                                <input class="form-control" id="firstName" name="firstName" type="text"
                                    value="<?php
                                            // Check if firstName is empty, then extract from name
                                            $firstName = isset($this->session->userdata['session_data']['firstName']) ? $this->session->userdata['session_data']['firstName'] : '';
                                            if (empty($firstName)) {
                                                $name = isset($this->session->userdata['session_data']['name']) ? $this->session->userdata['session_data']['name'] : '';
                                                $firstName = strtok($name, ' '); // Extract first part of name
                                            }
                                            echo $firstName;
                                            ?>" required>
                            </div>

                            <div class="col-md-4">
                                <label for="lastName">Last Name</label>
                                <input class="form-control" id="lastName" name="lastName" type="text"
                                    value="<?php
                                            // Check if lastName is empty, then extract from name
                                            $lastName = isset($this->session->userdata['session_data']['lastName']) ? $this->session->userdata['session_data']['lastName'] : '';
                                            if (empty($lastName)) {
                                                $name = isset($this->session->userdata['session_data']['name']) ? $this->session->userdata['session_data']['name'] : '';
                                                $nameParts = explode(' ', $name);
                                                $lastName = isset($nameParts[1]) ? $nameParts[1] : ''; // Extract last part of name
                                            }
                                            echo $lastName;
                                            ?>" required>
                            </div>

                            <div class="col-md-4">
                                <label for="email">Email</label>
                                <input class="form-control" id="email" name="email" type="email"
                                    value="<?php echo $this->session->userdata['session_data']['email']; ?>" required>
                            </div>
                            <div class="col-md-4">
                                <label for="phone">Phone</label>
                                <input class="form-control" id="phone" name="phone" type="text"
                                    value="<?php echo $this->session->userdata['session_data']['phone']; ?>" required>
                            </div>
                            <div class="col-md-4">
                                <label for="dob">Date of Birth</label>
                                <input class="form-control" id="dob" name="dob" type="date"
                                    value="<?php echo $this->session->userdata['session_data']['dob']; ?>">
                            </div>
                            <div class="col-md-4">
                                <label for="address">Address</label>
                                <input class="form-control" id="address" name="address" type="text"
                                    value="<?php echo $this->session->userdata['session_data']['address']; ?>">
                            </div>
                        </div>
                        <!-- Submit Button -->
                        <button type="submit" class="btn btn-dark mt-3">Save Changes</button>
                    </div>
                </form>

                <!-- <h1 class="mt-2">Update Password </h1> -->
                <div class='row justify-content-center'>

                    <form id="addnewservice" role="form" action="<?= base_url() ?>users/resetpasswordsave" method="post" class="basicvalidation col-md-6">
                        <h1 class="mt-2 md-6">Update Password </h1>
                        <div class="row">
                            <div class="col-md-12">
                                <label for="password">New Password</label>
                                <input type="password" class="form-control" required="true" id="password" name="password" placeholder="Enter Password">
                            </div>
                            <div class="col-md-12">
                                <label for="confirm-password">Confirm Password</label>
                                <input type="password" class="form-control" required="true" id="cnfpassword" name="cnfpassword" placeholder="Confirm Password">
                            </div>

                            <div id="password_submit" class="btn-block text-right mt-3">
                                <button type="submit" class="btn btn-dark mt-3">Submit</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>






</main>
<!-- Scripts -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- JavaScript for Image Upload -->
<script>
    $('#pImage').on('change', function() {
        const formData = new FormData();
        const file = this.files[0];
        formData.append('user_image', file);

        $.ajax({
            url: '<?php echo base_url("Users/uploadProfileImage"); ?>',
            type: 'POST',
            data: formData,
            contentType: false,
            processData: false,
            success: function(response) {
                const jsonResponse = JSON.parse(response);

                if (jsonResponse.status === 'success') {
                    // Update the image source dynamically
                    $('.profImage').attr('src', jsonResponse.image_url);
                    alert('Image updated successfully!');
                } else {
                    alert('Image upload failed: ' + jsonResponse.message);
                }
            },
            error: function() {
                alert('Error uploading image.');
            }
        });
    });
</script>


<!-- End main wrapper -->