@extends('admin.layout.master')
@section('users', 'active')
@section('contant')
    <div class="content-body">
        <section class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-head">
                        <div class="card-header">
                            <h4 class="card-title">Admin Profile</h4>
                            <a class="heading-elements-toggle"><i class="la la-ellipsis-h font-medium-3"></i></a>
                            <div class="heading-elements">
                                {{-- <a href="{{url('admin.user.create')}}" class="btn btn-info text-white btn-sm" type="button"><i class="ft-plus white"></i> Add User</a> --}}
                                <!-- <span class="dropdown">
                              <button id="btnSearchDrop1" type="button" data-toggle="dropdown" aria-haspopup="true"
                              aria-expanded="true" class="btn btn-warning dropdown-toggle dropdown-menu-right btn-sm"><i class="ft-download-cloud white"></i></button>
                              <span aria-labelledby="btnSearchDrop1" class="dropdown-menu mt-1 dropdown-menu-right">
                                <a href="#" class="dropdown-item"><i class="ft-upload"></i> Import</a>
                                <a href="#" class="dropdown-item"><i class="ft-download"></i> Export</a>
                                <a href="#" class="dropdown-item"><i class="ft-shuffle"></i> Find Duplicate</a>
                              </span>
                            </span> -->
                                {{-- <button class="btn btn-default btn-sm"><i class="ft-settings white"></i></button> --}}
                            </div>
                        </div>
                    </div>
                    <div class="card-content">
                        <div class="card-body">
                            <!-- <div class="row">
                                            <div class="col-md-4"></div>
                                            <div class="col-md-4 ">
                                                <img class="profile-img" src="https://www.pngitem.com/middle/hTJbowJ_circle-profile-picture-png-transparent-png/" alt="Avatar" style="width:400px">
                                            </div>
                                            <div class="col-md-4"></div>
                                        </div> -->
                            <div class="container">
                                {{-- @if (session('success'))
                                    <div class="alert alert-success">{{ session('success') }}</div>
                                @endif --}}
                                <div class="main-body">
                                    @if (Session::get('errors'))
                                        <div class="alert alert-danger alert-dismissible fade show" role="alert">
                                            <button type="button" class="close" data-dismiss="alert"
                                                aria-label="Close">
                                                <span aria-hidden="true">&times;</span>
                                                <span class="sr-only">Close</span>
                                            </button>
                                            <strong>{{ Session::get('errors')->first() }}</strong>
                                        </div>
                                        {!! Session::forget('errors') !!}
                                    @endif
                                    @if (Session::get('success'))
                                        <div class="alert alert-success alert-dismissible fade show" role="alert">
                                            <button type="button" class="close" data-dismiss="alert"
                                                aria-label="Close">
                                                <span aria-hidden="true">&times;</span>
                                                <span class="sr-only">Close</span>
                                            </button>
                                            <strong>{{ Session::get('success') }}</strong>
                                        </div>
                                        {!! Session::forget('success') !!}
                                    @endif
                                    <ul class="nav nav-tabs" id="myTab" role="tablist">
                                        <li class="nav-item">
                                            <a class="nav-link active" id="profile-tab" data-toggle="tab" href="#profile"
                                                role="tab" aria-controls="profile" aria-selected="true">Profile</a>
                                        </li>
                                        <li class="nav-item">
                                            <a class="nav-link" id="change-password-tab" data-toggle="tab"
                                                href="#change-password" role="tab" aria-controls="change-password"
                                                aria-selected="false">Change Password</a>
                                        </li>
                                    </ul>
                                    <div class="tab-content" id="myTabContent">
                                        <div class="tab-pane fade show active" id="profile" role="tabpanel"
                                            aria-labelledby="profile-tab">
                                            <div class="row gutters-sm">
                                                <div class="col-md-4 mb-3">
                                                    <div class="card">
                                                        <div class="card-body">
                                                            <div class="d-flex flex-column align-items-center text-center">
                                                                <img src="{{ asset('profile_images/' . $profile->image) }}"
                                                                    alt="Admin" class="rounded-circle" width="200"
                                                                    height="200">
                                                                <div class="mt-1">
                                                                    <h4>{{ $profile->name }}</h4>
                                                                    <!-- <label for="files" class="btn btn-primary">
                                                                                    <input id="files" type="file">Change Profile Image</input>
                                                                                </label> -->
                                                                    <form action="{{ route('admin.update.profile') }}"
                                                                        enctype="multipart/form-data" method="post">
                                                                        {{-- <button class="btn btn-primary text-center" style="display:block;width:160px; height:40px;" onclick="document.getElementById('getFile').click()">Change Profile Image</button> --}}
                                                                        <input type='file' name="profile_image">
                                                                        @csrf
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="card mb-3">
                                                        <div class="card-body">
                                                            <div class="row">
                                                                <div class="form-group col-md-12 mb-2">
                                                                    <input type="hidden" name="id"
                                                                        value="{{ $profile->id }}">
                                                                    <label for="name">Name</label>
                                                                    <input type="text" id="name"
                                                                        class="form-control border-info" placeholder="name"
                                                                        name="name" value="{{ $profile->name }}" required>
                                                                    <span class="text-danger"></span>
                                                                </div>
                                                                <div class="form-group col-md-12 mb-2">
                                                                    <label for="email">Email</label>
                                                                    <input type="email" id="email"
                                                                        class="form-control border-info" placeholder="email"
                                                                        name="email" value="{{ $profile->email }}"
                                                                        required>
                                                                    <span class="text-danger"></span>
                                                                </div>
                                                            </div>
                                                            <hr>
                                                            <div class="row">
                                                                <div class="col-sm-12">
                                                                    <button type="submit"
                                                                        class="btn btn-info ">Update</button>
                                                                </div>
                                                            </div>
                                                            </form>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="tab-pane fade" id="change-password" role="tabpanel"
                                            aria-labelledby="change-password-tab">
                                            <div class="row gutters-sm">
                                                <div class="col-md-6">
                                                    <div class="card mb-3">
                                                        <div class="card-body">
                                                            <div class="row">
                                                                <div class="col-md-12">
                                                                    <form action="{{ route('admin.change.password') }}"
                                                                        method="post">
                                                                        <div class="form-group mb-2">
                                                                            <input type="hidden" name="id"
                                                                                value="{{ $profile->id }}">
                                                                            <label for="name">Old Password</label>
                                                                            <input type="password" id="name"
                                                                                class="form-control border-info"
                                                                                placeholder="type old password here"
                                                                                name="old_password" required>
                                                                            @csrf
                                                                            <span class="text-danger"></span>
                                                                        </div>
                                                                        <div class="form-group mb-2">
                                                                            <label for="email">New Password</label>
                                                                            <input type="password" id="email"
                                                                                class="form-control border-info"
                                                                                placeholder="type new password here"
                                                                                name="new_password" required>
                                                                            <span class="text-danger"></span>
                                                                        </div>
                                                                        <hr>
                                                                        <div class="row">
                                                                            <div class="col-sm-12">
                                                                                <button type="submit"
                                                                                    class="btn btn-info ">Change
                                                                                    Password</button>
                                                                            </div>
                                                                        </div>
                                                                    </form>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
@endsection