@extends('layouts.app', [
    'class' => '',
    'elementActive' => 'profile'
])

@section('content')
    <div class="content">
        @if (session('status'))
            <div class="alert alert-success" role="alert">
                {{ session('status') }}
            </div>
        @endif
        @if (session('password_status'))
            <div class="alert alert-success" role="alert">
                {{ session('password_status') }}
            </div>
        @endif
        <div class="row">
            <div class="col-md-4">
                <div class="card card-user">
                    <div class="image">
                        <img src="{{ asset('paper/img/damir-bosnjak.jpg') }}" alt="...">
                    </div>
                    <div class="card-body" style="max-height: 300px; " >
                        <div class="author">
                            <a href="#">
                            @php
                                $randomNumber = rand(1, 4); 
                                $photo = "accountPhoto{$randomNumber}.gif";
                            @endphp
                                <img style="background-color:white;"class="avatar border-gray" src="{{ asset('paper/img/userPhotos/' . $photo) }}" alt="...">

                                <h5 class="title">{{ __(auth()->user()->name)}}</h5>
                            </a>
                            <p class="description">
                            @ {{ __(auth()->user()->name)}}
                            </p>
                        </div>
                        <!-- <p class="description text-center">
                            {{ __('I like the way you work it') }}
                            <br> {{ __('No diggity') }}
                            <br> {{ __('I wanna bag it up') }}
                        </p> -->
                                <div style="display: flex; justify-content: center; align-items: center;">
                                    <img 
                                        src="{{ asset('paper/img/userPhotos/carlogo.jpg') }}" 
                                        alt="Centered Image"
                                        style="max-width: 150px;
                                                max-height: 150px;
                                                object-fit: contain;
                                                box-shadow: 8px 8px 15px rgba(0, 0, 0, 0.25); 
                                                border-radius: 30px; "
                                    >
                                </div>
                    </div>
                    <div class="card-footer">
                        <hr>
                        <div class="button-container">
                            <div class="row">
                                <div class="col-lg-6 col-md-12 col-12 ml-auto">
                                    <h5>{{ __(auth()->user()->edits)}}
                                        <br>
                                        <small>{{ __('Bearbeitungen') }}</small>
                                    </h5>
                                </div>
                                <div class="col-lg-6 col-md-12 col-12 ml-auto mr-auto">
                                    <h5>{{ __(auth()->user()->createPDF)}}
                                        <br>
                                        <small>{{ __('PDF-Erstellung') }}</small>
                                    </h5>
                                </div>
                               
                            </div>
                        </div>
                    </div>
                </div>


             
                <div class="card">
                    <div class="card-header">
                        <div class="row">
                            <div class="col-md-7">
                        <h4 class="card-title mb-0">{{ __('Teammitglieder') }}</h4>
                        </div>
                        @if(auth()->user()->isAdmin == 1)
                        <div class="col-md-5 text-right">
                        <small class="text-muted d-block">Bearbeiten</small>
                    <a href="listUser" class="btn btn-success btn-round" role="button" aria-disabled="true">
                        <i class="nc-icon nc-refresh-69"></i></a>
                        </div>
                        @endif
                        </div>
                    </div>

                    <div class="card-body scrollable-container">
                        <ul class="list-unstyled team-members">
        @foreach ($listUser as $item)
        @if(auth()->user()->isAdmin == 1)
            <li>
                <div class="row">
                    <div class="col-md-2 col-2">
                    <div class="avatar" style=" align-items: center; justify-content: center; margin-top: 0px;">
                            <img 
                                src="{{ asset($item->isAdmin == 1 ? 'paper/img/userPhotos/adminPhoto.gif' : 'paper/img/userPhotos/editorPhoto.gif') }}" 
                                alt="Circle Image" 
                                class="img-circle img-no-padding img-responsive"
                            >
                        </div>
                    </div>
                    <div class="col-md-7 col-7">
                        {{ __($item->name) }}
                        <br />
                        <span class="status-badge {{ $item->isAdmin == '1' ? 'text-success' : 'text-warning' }}">
                            <small>{{ __($item->isAdmin == 1 ? 'Admin' : 'Editor' ) }}</small>
                        </span>
                    </div>
                    <div class="col-md-3 col-3 text-right">
                    <a href="mailto:{{ $item->email }}">
                        <button class="btn btn-sm btn-outline-success btn-round btn-icon">
                            <i class="fa fa-envelope"></i>
                        </button>
                    </a>
                    </div>
                </div>
            </li>
            @else
            @if($item->isAdmin == 0)
            <li>
                <div class="row">
                    <div class="col-md-2 col-2">
                        <div class="avatar" style="width: 50px; height: 50px;flex; align-items: center; justify-content: center; margin-top: -10px;">
                            <img 
                                src="{{ asset('paper/img/userPhotos/editorPhoto.gif') }}" 
                                alt="UserImage" 
                                class="img-circle img-no-padding img-responsive"
                            >
                        </div>
                    </div>
                    <div class="col-md-7 col-7">
                        {{ __($item->name) }}
                        <br />
                        <span class="text-warning">
                            <small>Editor</small>
                        </span>
                    </div>
                    <div class="col-md-3 col-3 text-right">
                    <a href="mailto:{{ $item->email }}">
                        <button class="btn btn-sm btn-outline-success btn-round btn-icon">
                            <i class="fa fa-envelope"></i>
                        </button>
                    </a>
                    </div>
                </div>
            </li>
            @endif
            @endif
        @endforeach
    </ul>
                    </div>
                </div>
            </div>

            
        

            <div class="col-md-8 text-center">
                <form class="col-md-12" action="{{ route('profile.update') }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    @method('PUT')
                    <div class="card">
                        <div class="card-header">
                            <h5 class="title">{{ __('Profil bearbeiten') }}</h5>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <label class="col-md-3 col-form-label">{{ __('Name') }}</label>
                                <div class="col-md-9">
                                    <div class="form-group">
                                        <input type="text" name="name" class="form-control" placeholder="Name" value="{{ auth()->user()->name }}" required>
                                    </div>
                                    @if ($errors->has('name'))
                                        <span class="invalid-feedback" style="display: block;" role="alert">
                                            <strong>{{ $errors->first('name') }}</strong>
                                        </span>
                                    @endif
                                </div>
                            </div>
                            <div class="row">
                                <label class="col-md-3 col-form-label">{{ __('Email') }}</label>
                                <div class="col-md-9">
                                    <div class="form-group">
                                        <input type="email" name="email" class="form-control" placeholder="Email" value="{{ auth()->user()->email }}" required>
                                    </div>
                                    @if ($errors->has('email'))
                                        <span class="invalid-feedback" style="display: block;" role="alert">
                                            <strong>{{ $errors->first('email') }}</strong>
                                        </span>
                                    @endif
                                </div>
                            </div>
                        </div>
                        <div class="card-footer ">
                            <div class="row">
                                <div class="col-md-12 text-center">
                                    <button type="submit" class="btn btn-info btn-round">{{ __('Änderungen speichern') }}</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
                <form class="col-md-12" action="{{ route('profile.password') }}" method="POST">
                    @csrf
                    @method('PUT')
                    <div class="card">
                        <div class="card-header">
                            <h5 class="title">{{ __('Passwort ändern') }}</h5>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <label class="col-md-3 col-form-label">{{ __('Old Password') }}</label>
                                <div class="col-md-9">
                                    <div class="form-group">
                                        <input type="password" name="old_password" class="form-control" placeholder="Old password" required>
                                    </div>
                                    @if ($errors->has('old_password'))
                                        <span class="invalid-feedback" style="display: block;" role="alert">
                                            <strong>{{ $errors->first('old_password') }}</strong>
                                        </span>
                                    @endif
                                </div>
                            </div>
                            <div class="row">
                                <label class="col-md-3 col-form-label">{{ __('New Password') }}</label>
                                <div class="col-md-9">
                                    <div class="form-group">
                                        <input type="password" name="password" class="form-control" placeholder="Password" required>
                                    </div>
                                    @if ($errors->has('password'))
                                        <span class="invalid-feedback" style="display: block;" role="alert">
                                            <strong>{{ $errors->first('password') }}</strong>
                                        </span>
                                    @endif
                                </div>
                            </div>
                            <div class="row">
                                <label class="col-md-3 col-form-label">{{ __('Password Confirmation') }}</label>
                                <div class="col-md-9">
                                    <div class="form-group">
                                        <input type="password" name="password_confirmation" class="form-control" placeholder="Password Confirmation" required>
                                    </div>
                                    @if ($errors->has('password_confirmation'))
                                        <span class="invalid-feedback" style="display: block;" role="alert">
                                            <strong>{{ $errors->first('password_confirmation') }}</strong>
                                        </span>
                                    @endif
                                </div>
                            </div>
                        </div>
                        <div class="card-footer ">
                            <div class="row">
                                <div class="col-md-12 text-center">
                                    <button type="submit" class="btn btn-info btn-round">{{ __('Änderungen speichern') }}</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection

@stack('css')
<style>

.status-badge {
    display: inline-block;
    padding: 2px 10px;
    border: 2px solid;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: capitalize;
}

.scrollable-container {
  max-height: 300px;
  overflow-y: auto;
  
  -webkit-overflow-scrolling: touch; /* smooth scrolling on iOS */
}
</style>