@extends('admin.layouts.master')

@section('contents')

    <div class="content-overlay"></div>
    <div class="header-navbar-shadow"></div>
    <div class="content-wrapper">
        <div class="content-header row">
            <div class="content-header-left col-md-9 col-12 mb-2">
                <div class="row breadcrumbs-top">
                    <div class="col-12">
                        <h2 class="content-header-title float-left mb-0">{{trans('Account Settings')}}</h2>
                        <div class="breadcrumb-wrapper col-12">
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item"><a href="{{route('admin.home')}}">{{__('Home')}}</a>
                                </li>
                                <li class="breadcrumb-item active"> {{__('Account Settings')}}
                                </li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="content-body">
            <!-- users edit start -->
            <section class="users-edit">
                <div class="card">
                    <div class="card-content">
                        <div class="card-body">
                            <ul class="nav nav-tabs mb-3" role="tablist">
                                <li class="nav-item">
                                    <a class="nav-link d-flex align-items-center active" id="account-tab" data-toggle="tab" href="#account" aria-controls="account" role="tab" aria-selected="true">
                                        <i class="feather icon-user mr-25"></i><span class="d-none d-sm-block">{{__('Account')}}</span>
                                    </a>
                                </li>
                            </ul>
                            <div class="tab-content">
                                <div class="tab-pane active" id="account" aria-labelledby="account-tab" role="tabpanel">

                                    <!-- users edit account form start -->
                                    <form novalidate action="{{route('admin.update.settings')}}" method="POST" enctype="multipart/form-data">
                                        @csrf

                                        <!-- users edit media object start -->
                                        <div class="media mb-2">
                                            <a href="{{$admin->image}}" target="_blank">
                                                <img src="{{$admin->image}}" id="output"  class="rounded mr-75" alt="profile image" height="64" width="64">
                                            </a>
                                            <div class="media-body mt-75">
                                                <div class="col-12 px-0 d-flex flex-sm-row flex-column justify-content-start">
                                                    <label class="btn btn-sm btn-primary ml-50 mb-50 mb-sm-0 cursor-pointer" for="account-upload">{{__('Upload new photo')}}</label>
                                                    <input type="file" name="image" id="account-upload" onchange="loadFile(event)" hidden accept="image/*">
                                                    @error('image')
                                                    <div class="alert alert-danger">{{ $message }}</div>
                                                    @enderror

                                                </div>
                                            </div>
                                        </div>
                                        <hr>
                                        <!-- users edit media object ends -->
                                        <div class="row">
                                            <div class="col-12 col-sm-6">
                                                <div class="form-group">
                                                    <div class="controls">
                                                        <label>{{__('Name')}}</label>
                                                        <input type="text" name="name" class="form-control" placeholder="{{__('Name')}}" value="{{$admin->name}}" required data-validation-required-message="This name field is required">
                                                    </div>
                                                    @error('name')
                                                    <div class="alert alert-danger">{{ $message }}</div>
                                                    @enderror
                                                </div>
                                                <div class="form-group">
                                                    <div class="controls">
                                                        <label>{{__('Email')}}</label>
                                                        <input type="email" name="email" class="form-control" placeholder="{{trans('Email')}}" value="{{$admin->email}}" required data-validation-required-message="This email field is required">
                                                        @error('email')
                                                        <div class="alert alert-danger">{{ $message }}</div>
                                                        @enderror
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-12 col-sm-6">
                                                <div class="form-group">
                                                    <div class="controls">
                                                        <label>{{__('Phone')}}</label>
                                                        <input type="tel" name="phone" class="form-control" placeholder="{{__('Phone')}}" value="{{$admin->phone}}" required data-validation-required-message="This name field is required">
                                                        @error('phone')
                                                        <div class="alert alert-danger">{{ $message }}</div>
                                                        @enderror
                                                    </div>
                                                </div>
                                                
                                                {{-- Username Field --}}
                                                <div class="form-group">
                                                    <div class="controls">
                                                        <label>{{__('Username')}}</label>
                                                        <input type="text" name="username" class="form-control" placeholder="{{__('Username')}}" value="{{$admin->username}}" pattern="[a-zA-Z0-9_-]+" title="{{__('Username can only contain letters, numbers, underscores and hyphens')}}">
                                                        <small class="form-text text-muted">{{__('This will be used in your blog author URL (e.g., blog-author/username)')}}</small>
                                                        @error('username')
                                                        <div class="alert alert-danger">{{ $message }}</div>
                                                        @enderror
                                                    </div>
                                                </div>
                                                
                                                {{-- Job Title Fields --}}
                                                <div class="form-group">
                                                    <div class="controls">
                                                        <label>{{__('Job Title (Arabic)')}}</label>
                                                        <input type="text" name="title_ar" class="form-control" placeholder="{{__('Job Title (Arabic)')}}" value="{{$admin->title_ar}}">
                                                        @error('title_ar')
                                                        <div class="alert alert-danger">{{ $message }}</div>
                                                        @enderror
                                                    </div>
                                                </div>
                                                
                                                <div class="form-group">
                                                    <div class="controls">
                                                        <label>{{__('Job Title (English)')}}</label>
                                                        <input type="text" name="title_en" class="form-control" placeholder="{{__('Job Title (English)')}}" value="{{$admin->title_en}}">
                                                        @error('title_en')
                                                        <div class="alert alert-danger">{{ $message }}</div>
                                                        @enderror
                                                    </div>
                                                </div>
                                                
                                                {{-- Bio/Details Fields --}}
                                                <div class="form-group">
                                                    <div class="controls">
                                                        <label>{{__('Bio (Arabic)')}}</label>
                                                        <textarea name="details_ar" class="form-control" rows="4" placeholder="{{__('Bio (Arabic)')}}">{{$admin->details_ar}}</textarea>
                                                        @error('details_ar')
                                                        <div class="alert alert-danger">{{ $message }}</div>
                                                        @enderror
                                                    </div>
                                                </div>
                                                
                                                <div class="form-group">
                                                    <div class="controls">
                                                        <label>{{__('Bio (English)')}}</label>
                                                        <textarea name="details_en" class="form-control" rows="4" placeholder="{{__('Bio (English)')}}">{{$admin->details_en}}</textarea>
                                                        @error('details_en')
                                                        <div class="alert alert-danger">{{ $message }}</div>
                                                        @enderror
                                                    </div>
                                                </div>
                                                
                                                <div class="col-xl-6 col-md-6 col-12 mb-1">
                                                    <div class="form-group">
                                                        <label>{{trans('Password')}}</label>
                                                        <div class="input-group show_hide_password">
                                                            <input type="password" name="password" class="form-control"
                                                                   placeholder="*********">
                                                            <div class="input-group-addon">
                                                                <a href=""><i class="fa fa-eye-slash" aria-hidden="true"></i></a>
                                                            </div>
                                                            <p id="passwordHelpBlock" class="form-text text-muted">
                                                                {{__('Your password must be more than 10 characters long, should contain at-least 1 Uppercase, 1 Lowercase, 1 Numeric and 1 special character.')}}
                                                            </p>
                                                            @error('password')
                                                            <div class="alert alert-danger">{{ $message }}</div>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>


                                            <div class="col-12 d-flex flex-sm-row flex-column justify-content-end mt-1">
                                                <button type="submit" class="btn btn-primary glow mb-1 mb-sm-0 mr-0 mr-sm-1">{{__('Save Changes')}}</button>
                                                <button type="reset" class="btn btn-outline-warning">{{__('Reset')}}</button>
                                            </div>
                                        </div>
                                    </form>
                                    <!-- users edit account form ends -->
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- users edit ends -->

        </div>
    </div>

@endsection