@extends('admin.master')

@section('title')
    Profile
@endsection

@section('content')
    <div class="mt-4">
        <div class="row g-4">
            <div class="col-md-12">
                <div class="row g-3 mb-4">
                    <div class="col-auto">
                        <h2 class="mb-0">Profile</h2>
                    </div>
                </div>

                <div class="row">
                    <div class="col-lg-8">
                        <div class="card">
                            <div class="card-body">
                                {!! Form::open(['id' => 'profileForm', 'files' => true, 'route' => 'admin.profile.update', 'method' => 'POST']) !!}

                                <div class="row mb-3">
                                    <div class="col-md-6">
                                        <div class="mb-3">
                                            {!! Form::label('name', 'Name', ['class' => 'form-label']) !!}
                                            {!! Form::text('name', $admin->name ?? '', [
                                                'class' => 'form-control form-control-sm',
                                                'id' => 'name',
                                                'required' => true,
                                                'placeholder' => 'Enter Name',
                                            ]) !!}
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="mb-3">
                                            {!! Form::label('email', 'Email', ['class' => 'form-label']) !!}
                                            {!! Form::email('email', $admin->email ?? '', [
                                                'class' => 'form-control form-control-sm',
                                                'id' => 'email',
                                                'required' => true,
                                                'placeholder' => 'Enter Email',
                                            ]) !!}
                                        </div>
                                    </div>
                                </div>

                                <div class="row mb-3">
                                    <div class="col-md-6">
                                        <div class="mb-3">
                                            {!! Form::label('phone', 'Phone', ['class' => 'form-label']) !!}
                                            {!! Form::text('phone', $admin->phone ?? '', [
                                                'class' => 'form-control form-control-sm',
                                                'id' => 'phone',
                                                'placeholder' => 'Enter Phone Number',
                                            ]) !!}
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="mb-3">
                                            {!! Form::label('pincode', 'Pincode', ['class' => 'form-label']) !!}
                                            {!! Form::text('pincode', $admin->pincode ?? '', [
                                                'class' => 'form-control form-control-sm',
                                                'id' => 'pincode',
                                                'placeholder' => 'Enter Pincode',
                                            ]) !!}
                                        </div>
                                    </div>
                                </div>

                                <div class="mb-3">
                                    {!! Form::label('address', 'Address', ['class' => 'form-label']) !!}
                                    {!! Form::textarea('address', $admin->address ?? '', [
                                        'class' => 'form-control form-control-sm',
                                        'id' => 'address',
                                        'rows' => 3,
                                        'placeholder' => 'Enter Address',
                                    ]) !!}
                                </div>

                                <div class="row mb-3">
                                    <div class="col-md-4">
                                        <div class="mb-3">
                                            {!! Form::label('city', 'City', ['class' => 'form-label']) !!}
                                            {!! Form::text('city', $admin->city ?? '', [
                                                'class' => 'form-control form-control-sm',
                                                'id' => 'city',
                                                'placeholder' => 'Enter City',
                                            ]) !!}
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="mb-3">
                                            {!! Form::label('state', 'State', ['class' => 'form-label']) !!}
                                            {!! Form::text('state', $admin->state ?? '', [
                                                'class' => 'form-control form-control-sm',
                                                'id' => 'state',
                                                'placeholder' => 'Enter State',
                                            ]) !!}
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="mb-3">
                                            {!! Form::label('country', 'Country', ['class' => 'form-label']) !!}
                                            {!! Form::text('country', $admin->country ?? '', [
                                                'class' => 'form-control form-control-sm',
                                                'id' => 'country',
                                                'placeholder' => 'Enter Country',
                                            ]) !!}
                                        </div>
                                    </div>
                                </div>

                                <hr class="my-4">

                                <h5 class="mb-3">Change Password</h5>
                                <div class="row mb-3">
                                    <div class="col-md-6">
                                        <div class="mb-3">
                                            {!! Form::label('password', 'New Password', ['class' => 'form-label']) !!}
                                            {!! Form::password('password', [
                                                'class' => 'form-control form-control-sm',
                                                'id' => 'password',
                                                'placeholder' => 'Enter New Password',
                                            ]) !!}
                                            <small class="text-muted">Leave blank to keep current password</small>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="mb-3">
                                            {!! Form::label('password_confirmation', 'Confirm Password', ['class' => 'form-label']) !!}
                                            {!! Form::password('password_confirmation', [
                                                'class' => 'form-control form-control-sm',
                                                'id' => 'password_confirmation',
                                                'placeholder' => 'Confirm New Password',
                                            ]) !!}
                                        </div>
                                    </div>
                                </div>

                                <div class="d-flex gap-2 justify-content-end mt-4">
                                    <button type="submit" class="btn btn-primary">Update Profile</button>
                                </div>
                                {!! Form::close() !!}
                            </div>
                        </div>
                    </div>

                    <div class="col-lg-4">
                        <div class="card">
                            <div class="card-body text-center">
                                <div class="mb-3">
                                    @if($admin->profile_image)
                                        <img src="{{ asset('assets/attachments/admin/' . $admin->profile_image) }}" 
                                             alt="Profile Image" 
                                             class="img-thumbnail rounded-circle" 
                                             style="width: 150px; height: 150px; object-fit: cover;" 
                                             id="profileImagePreview">
                                    @else
                                        <img src="{{ asset('assets/img/team/72x72/57.webp') }}" 
                                             alt="Profile Image" 
                                             class="img-thumbnail rounded-circle" 
                                             style="width: 150px; height: 150px; object-fit: cover;" 
                                             id="profileImagePreview">
                                    @endif
                                </div>
                                <h5 class="mb-1">{{ $admin->name ?? 'Admin' }}</h5>
                                <p class="text-muted mb-3">{{ $admin->email ?? '' }}</p>
                                
                                <div class="mb-3">
                                    {!! Form::open(['id' => 'profileImageForm', 'files' => true, 'route' => 'admin.profile.update', 'method' => 'POST']) !!}
                                    {!! Form::file('profile_image', [
                                        'class' => 'form-control form-control-sm',
                                        'id' => 'profileImage',
                                        'accept' => 'image/*',
                                    ]) !!}
                                    <small class="text-muted d-block mt-2">Upload Profile Image</small>
                                    {!! Form::close() !!}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('javascript')
    <script>
        $(document).ready(function() {
            // Profile image preview
            $('#profileImage').on('change', function(e) {
                const file = e.target.files[0];
                if (file && file.type.startsWith('image/')) {
                    const reader = new FileReader();
                    reader.onload = function(event) {
                        $('#profileImagePreview').attr('src', event.target.result);
                    };
                    reader.readAsDataURL(file);
                    
                    // Auto submit image form
                    $('#profileImageForm').submit();
                }
            });

            // Profile form submission
            $('#profileForm').on('submit', function(e) {
                e.preventDefault();
                let formData = new FormData(this);
                
                $.ajax({
                    url: $(this).attr('action'),
                    type: 'POST',
                    data: formData,
                    contentType: false,
                    processData: false,
                    success: function(res) {
                        window.location.reload();
                    },
                    error: function(xhr) {
                        let errors = xhr.responseJSON?.errors;
                        let msg = '';
                        if (errors) {
                            $.each(errors, function(key, value) {
                                msg += value[0] + '\n';
                            });
                            alert(msg);
                        } else {
                            alert('Something went wrong.');
                        }
                    }
                });
            });

            // Profile image form submission
            $('#profileImageForm').on('submit', function(e) {
                e.preventDefault();
                let formData = new FormData(this);
                
                $.ajax({
                    url: $(this).attr('action'),
                    type: 'POST',
                    data: formData,
                    contentType: false,
                    processData: false,
                    success: function(res) {
                        window.location.reload();
                    },
                    error: function(xhr) {
                        let errors = xhr.responseJSON?.errors;
                        let msg = '';
                        if (errors) {
                            $.each(errors, function(key, value) {
                                msg += value[0] + '\n';
                            });
                            alert(msg);
                        } else {
                            alert('Something went wrong.');
                        }
                    }
                });
            });
        });
    </script>
@endsection