@extends('admin.admin_dashboard')
@section('admin')
<<<<<<< HEAD
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>

<div class="page-content">
    <!--breadcrumb-->
    <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
        <div class="breadcrumb-title pe-3">Change Password</div>
        <div class="ps-3">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb mb-0 p-0">
                    <li class="breadcrumb-item"><a href="javascript:;"><i class="bx bx-home-alt"></i></a>
                    </li>
                    <li class="breadcrumb-item active" aria-current="page">Change Password</li>
                </ol>
            </nav>
        </div>
        <div class="ms-auto">

        </div>
    </div>
    <!--end breadcrumb-->
    <div class="container">
        <div class="main-body">
            <div class="row">
                <div class="col-lg-4">
                    <div class="card">
                        <div class="card-body">
                            <div class="d-flex flex-column align-items-center text-center">
    <img src="{{ (!empty($profileData->photo)) ? url('upload/admin_images/'.$profileData->photo) : url('upload/no_image.jpg')}}" alt="Admin" class="rounded-circle p-1 bg-primary" width="110">
    <div class="mt-3">
        <h4>{{ $profileData->name }}</h4>
        <p class="text-secondary mb-1">{{ $profileData->username }}</p>
        <p class="text-muted font-size-sm">{{ $profileData->email }}</p>
        <button class="btn btn-primary">Follow</button>
        <button class="btn btn-outline-primary">Message</button>
    </div>
                            </div>
                            <hr class="my-4" />
                           
                        </div>
                    </div>
                </div>
<div class="col-lg-8">
    <div class="card">

        <form method="POST" action="{{ route('admin.password.update') }}"  enctype="multipart/form-data">
            @csrf

        <div class="card-body">
            <div class="row mb-3"> 
                <div class="col-sm-3">
                    <h6 class="mb-0">Old Password </h6>
                </div>
                <div class="col-sm-9 text-secondary">
                    <input type="password" name="old_password" class="form-control @error('old_password') is-invalid @enderror" id="old_password" />
                    @error('old_password')
                        <span class="text-danger">{{ $message }}</span>
                    @enderror
                </div>
            </div>

            <div class="row mb-3"> 
                <div class="col-sm-3">
                    <h6 class="mb-0">New Password </h6>
                </div>
                <div class="col-sm-9 text-secondary">
                    <input type="password" name="new_password" class="form-control @error('new_password') is-invalid @enderror" id="new_password" />
                    @error('new_password')
                        <span class="text-danger">{{ $message }}</span>
                    @enderror
                </div>
            </div>

            <div class="row mb-3"> 
                <div class="col-sm-3">
                    <h6 class="mb-0">Confirm New Password </h6>
                </div>
                <div class="col-sm-9 text-secondary">
                    <input type="password" name="new_password_confirmation" class="form-control" id="new_password_confirmation" /> 
                </div>
            </div>




            <div class="row">
                <div class="col-sm-3"></div>
                <div class="col-sm-9 text-secondary">
                    <input type="submit" class="btn btn-primary px-4" value="Save Changes" />
                </div>
            </div>
        </div> 
    </form>


    </div>



</div>
            </div>
        </div>
    </div>
</div>



@endsection
=======

@php
    $photoUrl = $profileData->photo
        ? url('upload/admin_images/'.$profileData->photo)
        : url('upload/no_image.jpg');
    $isOnline = $profileData->UserOnline();
    $roleLabel = ucfirst(str_replace('-', ' ', $profileData->role ?? 'user'));
@endphp

<div class="page-content">
    <x-chm.layout.page
        title="Change Password"
        subtitle="Update your login credentials to keep your CHM ERP account secure."
        icon="bx bx-key"
    >
        <x-slot:breadcrumb>
            <x-chm.breadcrumb-item :href="route('admin.dashboard')">Home</x-chm.breadcrumb-item>
            <x-chm.breadcrumb-item :href="route('admin.profile')">My Profile</x-chm.breadcrumb-item>
            <x-chm.breadcrumb-item :active="true">Change Password</x-chm.breadcrumb-item>
        </x-slot:breadcrumb>

        <x-slot:actions>
            <x-chm.button variant="outline-primary" icon="bx bx-user" :href="route('admin.profile')">
                Back to profile
            </x-chm.button>
        </x-slot:actions>

        <div class="row g-4">
            {{-- Left column --}}
            <div class="col-lg-4">
                <div class="card chm-profile-hero mb-0">
                    <div class="chm-profile-hero-banner"></div>
                    <div class="card-body text-center pt-0">
                        <div class="chm-profile-avatar-wrap">
                            <img
                                src="{{ $photoUrl }}"
                                alt="{{ $profileData->name }}"
                                class="chm-profile-avatar"
                            >
                            @if($isOnline)
                                <span class="chm-profile-avatar-status" title="Online now"></span>
                            @endif
                        </div>
                        <h4 class="chm-profile-name mb-1">{{ $profileData->name }}</h4>
                        <p class="text-muted mb-2">{{ $profileData->username ? '@'.$profileData->username : 'No username' }}</p>
                        <p class="small text-muted mb-3">{{ $profileData->email }}</p>
                        <x-chm.status-badge status="info" :label="$roleLabel" />
                    </div>
                </div>

                <div class="card mt-4">
                    <div class="card-body">
                        <h6 class="mb-3"><i class="bx bx-shield-quarter me-1"></i> Security tips</h6>
                        <ul class="chm-profile-security-list mb-0">
                            <li>Use at least 8 characters with letters and numbers.</li>
                            <li>Avoid reusing passwords from other sites.</li>
                            <li>Do not share your password with colleagues.</li>
                            <li>Change your password if you suspect unauthorized access.</li>
                        </ul>
                    </div>
                </div>

                <div class="card mt-4">
                    <div class="card-body">
                        <h6 class="mb-3"><i class="bx bx-link-alt me-1"></i> Quick links</h6>
                        <div class="d-grid gap-2">
                            <a href="{{ route('admin.profile') }}" class="chm-profile-quick-link">
                                <i class="bx bx-user"></i>
                                <span>My profile</span>
                                <i class="bx bx-chevron-right ms-auto"></i>
                            </a>
                            <a href="{{ route('admin.dashboard') }}" class="chm-profile-quick-link">
                                <i class="bx bx-home-circle"></i>
                                <span>Dashboard</span>
                                <i class="bx bx-chevron-right ms-auto"></i>
                            </a>
                        </div>
                    </div>
                </div>
            </div>

            {{-- Right column --}}
            <div class="col-lg-8">
                <form method="POST" action="{{ route('admin.password.update') }}">
                    @csrf

                    <x-chm.form-section
                        title="Update password"
                        description="Enter your current password, then choose a new one."
                        icon="bx bx-lock-alt"
                    >
                        <div class="row g-3">
                            <div class="col-12">
                                <label for="old_password" class="form-label">Current password <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <input
                                        type="password"
                                        name="old_password"
                                        id="old_password"
                                        class="form-control @error('old_password') is-invalid @enderror"
                                        autocomplete="current-password"
                                        required
                                    >
                                    <button type="button" class="btn btn-outline-secondary chm-toggle-password" data-target="old_password" aria-label="Show password">
                                        <i class="bx bx-show"></i>
                                    </button>
                                </div>
                                @error('old_password')
                                    <div class="invalid-feedback d-block">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-md-6">
                                <label for="new_password" class="form-label">New password <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <input
                                        type="password"
                                        name="new_password"
                                        id="new_password"
                                        class="form-control @error('new_password') is-invalid @enderror"
                                        autocomplete="new-password"
                                        required
                                    >
                                    <button type="button" class="btn btn-outline-secondary chm-toggle-password" data-target="new_password" aria-label="Show password">
                                        <i class="bx bx-show"></i>
                                    </button>
                                </div>
                                @error('new_password')
                                    <div class="invalid-feedback d-block">{{ $message }}</div>
                                @enderror
                            </div>

                            <div class="col-md-6">
                                <label for="new_password_confirmation" class="form-label">Confirm new password <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <input
                                        type="password"
                                        name="new_password_confirmation"
                                        id="new_password_confirmation"
                                        class="form-control"
                                        autocomplete="new-password"
                                        required
                                    >
                                    <button type="button" class="btn btn-outline-secondary chm-toggle-password" data-target="new_password_confirmation" aria-label="Show password">
                                        <i class="bx bx-show"></i>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </x-chm.form-section>

                    <div class="d-flex flex-wrap gap-2 mt-4">
                        <x-chm.button type="submit" variant="primary" icon="bx bx-save">Update password</x-chm.button>
                        <x-chm.button variant="outline-secondary" :href="route('admin.profile')">Cancel</x-chm.button>
                    </div>
                </form>
            </div>
        </div>
    </x-chm.layout.page>
</div>

@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', function () {
    document.querySelectorAll('.chm-toggle-password').forEach(function (button) {
        button.addEventListener('click', function () {
            var input = document.getElementById(button.dataset.target);
            if (!input) return;

            var isHidden = input.type === 'password';
            input.type = isHidden ? 'text' : 'password';

            var icon = button.querySelector('i');
            if (icon) {
                icon.className = isHidden ? 'bx bx-hide' : 'bx bx-show';
            }
        });
    });
});
</script>
@endpush

@endsection
>>>>>>> origin/main