@extends('backend.layout.master')
@include('backend.profile.css')
@section('content')
    <div class="page-body">
        <div class="container-fluid">
            <div class="page-header">
                <div class="row">
                    <div class="col-lg-6 main-header">
                        <h2>Manage <span>Profile </span></h2>
                    </div>
                </div>
            </div>
        </div>
        <!-- Container-fluid starts-->
        <div class="container-fluid general-widget">

            <div class="row">
                <div class="col-lg-12">
                    @if(session()->has('success'))
                        <div class="alert alert-success hide-alert">
                            {{ session()->get('success') }}
                        </div>
                    @endif
                    @if(session()->has('error'))
                        <div class="alert alert-danger hide-alert">
                            {{ session()->get('error') }}
                        </div>
                    @endif

                    @if ($errors->any())
                        <div class="alert alert-danger hide-alert">
                            <ul>
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif

                </div>
                <div class="col-lg-6">
                    <div class="card">
                        <div class="card-header">
                            <h4 class="card-title mb-0">My Subscription</h4>
                            <div class="card-options"><a class="card-options-collapse" href="#"
                                                         data-toggle="card-collapse"><i
                                        class="fe fe-chevron-up"></i></a><a class="card-options-remove" href="#"
                                                                            data-toggle="card-remove"><i
                                        class="fe fe-x"></i></a></div>
                        </div>
                        <div class="card-content">
                            <div class="card-body card-dashboard">
                                @php
                                    $now = time(); // or your date as well
                                    $expiry_date = strtotime(auth()->guard('web')->user()->subscription_expiry);
                                    $datediff = $expiry_date - $now;
                                    $diffInDays = round($datediff / (60 * 60 * 24));
                                    if($diffInDays >= 0 && $diffInDays <= 7)
                                        {
                                            $renew = true;
                                            echo '<div class="alert alert-danger alert-dismissible" role="alert">Your Subscription will expire in '.abs($diffInDays).' days. <button class="btn btn-primary btn-pill checkout_btn">Renew Now</button> <button class="close" type="button" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button></div>';
                                        }
                                @endphp


                                <div class="row">
                                    <div class="col-md-6 ">
                                        @if($user->is_subscription_active)
                                            <p class="mb-3"><strong>Subscription Status:</strong> <span
                                                    class="text-white bg-success font-weight-bold p-1">ACTIVE</span></p>
                                            <p class="mb-3"><strong>Subscription Start Date:</strong> 03/10/2021</p>
                                            <p class="mb-3"><strong>Subscription End Date:</strong> 03/15/2022</p>
                                        @else
                                            <p class="mb-3"><strong>Subscription Status:</strong> <span
                                                    class="text-white bg-danger font-weight-bold p-1">INACTIVE</span>
                                            </p>
                                        @endif

                                    </div>
                                    <div class="col-md-6 text-right align-self-center">
                                        <!-- Vertically centered modal-->
                                        <!-- <a class="text-uppercase " type="button" data-toggle="modal" data-target="#exampleModalCenter">Pay Now</a> -->
                                        @if(!$user->is_subscription_active)
                                            <button class="btn btn-pill btn-primary checkout_btn" type="button"
                                                    data-original-title="btn btn-pill btn-primary" title="">Pay Now
                                            </button>
                                        @endif

                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="card">

                        <div class="card-content">
                            <div class="card-body card-dashboard pt-5">

                                <div class="row">
                                    <div class="col-md-6">
                                        <h5>Email:</h5>
                                        <p>{{$user->email}}</p>
                                    </div>
                                    <div class="col-md-6 text-right">


                                    </div>
                                </div>
                                <hr>

                                <div class="row">
                                    <div class="col-md-6">
                                        <h5>Password:</h5>
                                        <p>************</p>
                                    </div>
                                    <div class="col-md-6 text-right">
                                        <!-- Vertically centered modal-->
                                        <a class="text-uppercase " type="button" data-toggle="modal"
                                           data-target="#changepass">Change Password</a>
                                        <div class="modal fade" id="changepass" tabindex="-1" role="dialog"
                                             aria-labelledby="exampleModalCenter" aria-hidden="true">
                                            <div class="modal-dialog modal-dialog-centered" role="document">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <h5 class="modal-title">Change Password</h5>
                                                        <button class="close" type="button" data-dismiss="modal"
                                                                aria-label="Close"><span aria-hidden="true">×</span>
                                                        </button>
                                                    </div>
                                                    <div class="modal-body">
                                                        <div class="text-left validation-errors"></div>
                                                        <form class="form theme-form profile-form" id="changePassForm">
                                                            @csrf
                                                            <div class="card-body p-3">
                                                                <div class="row text-left">
                                                                    <div class="col-sm-12 ">
                                                                        <input type="hidden" value="change_password"
                                                                               name="form_type">
                                                                        <div class="form-group m-t-15">
                                                                            <label for="password">Old Password<span
                                                                                    class="font-danger">*</span></label>
                                                                            <input class="form-control" type="password"
                                                                                   placeholder="Enter Old Password"
                                                                                   name="old_password" id="old_password"
                                                                                   value="">
                                                                        </div>
                                                                        <div class="form-group m-t-15">
                                                                            <label for="password">New Password<span
                                                                                    class="font-danger">*</span></label>
                                                                            <input class="form-control" type="password"
                                                                                   placeholder="Enter New Password"
                                                                                   name="new_password" id="new_password"
                                                                                   value="">
                                                                        </div>
                                                                        <div class="form-group m-t-15">
                                                                            <label for="retype_password">Retype
                                                                                Password<span
                                                                                    class="font-danger">*</span></label>
                                                                            <input class="form-control" type="password"
                                                                                   placeholder="Reenter New Password"
                                                                                   name="confirm_password"
                                                                                   id="confirm_password" value=""
                                                                            >
                                                                        </div>
                                                                    </div>
                                                                </div>

                                                            </div>
                                                            <div class="card-footer p-3">
                                                                <button class="btn btn-primary btn-pill" type="submit">
                                                                    Submit
                                                                </button>

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

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

                <div class="col-lg-6">
                    <div class="card">
                        <div class="card-header">
                            <h4 class="card-title mb-0">My Account</h4>
                            <div class="card-options"><a class="card-options-collapse" href="#"
                                                         data-toggle="card-collapse"><i
                                        class="fe fe-chevron-up"></i></a><a class="card-options-remove" href="#"
                                                                            data-toggle="card-remove"><i
                                        class="fe fe-x"></i></a></div>
                        </div>
                        <div class="card-content">
                            <div class="card-body card-dashboard pt-4">
                                <div class="row">
                                    <div class="col-md-6 ">
                                        <div class="avatar"><img class="img-70 rounded-circle"
                                                                 src="{{url('storage/'.$user->profile_photo_path)}}"
                                                                 alt="#"></div>

                                    </div>
                                    <div class="col-md-6 text-right align-self-center">
                                        <!-- Vertically centered modal-->
                                        <a class="text-uppercase " type="button" data-toggle="modal"
                                           data-target="#exampleModalCenter">Change Logo</a>
                                        <div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog"
                                             aria-labelledby="exampleModalCenter" aria-hidden="true">
                                            <div class="modal-dialog modal-dialog-centered">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <h5 class="modal-title">Upload Logo</h5>
                                                        <button class="close" type="button" data-dismiss="modal"
                                                                aria-label="Close"><span aria-hidden="true">×</span>
                                                        </button>
                                                    </div>
                                                    <div class="modal-body">
                                                        <form class="form theme-form">
                                                            <div class="card-body p-3">
                                                                <div class="row">
                                                                    <div class="col">
                                                                        <div class="form-group row">
                                                                            <div class="col-sm-12">
                                                                                <div class="dropzone"
                                                                                     id="myDropzone"></div>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>

                                                            </div>
                                                            <div class="card-footer p-3">
                                                                <button class="btn btn-primary btn-pill" type="submit">
                                                                    Submit
                                                                </button>

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

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

                                <div class="row">
                                    <div class="col-md-6">
                                        <h5>Phone Number:</h5>
                                        <p>{{$user->phone}}</p>
                                    </div>
                                    <div class="col-md-6 text-right">
                                        <!-- Vertically centered modal-->
                                        <a class="text-uppercase " type="button" data-toggle="modal"
                                           data-target="#editProfile">Change Profile</a>
                                        <div class="modal fade" id="editProfile" tabindex="-1" role="dialog"
                                             aria-labelledby="exampleModalCenter" aria-hidden="true">
                                            <div class="modal-dialog modal-dialog-centered" role="document">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <h5 class="modal-title">Update Profile</h5>
                                                        <button class="close" type="button" data-dismiss="modal"
                                                                aria-label="Close"><span aria-hidden="true">×</span>
                                                        </button>
                                                    </div>
                                                    <div class="modal-body">
                                                        <div class="text-left validation-errors"></div>
                                                        <form class="form theme-form profile-form" id="editProfileForm">
                                                            @csrf
                                                            <input type="hidden" value="profile" name="form_type">
                                                            <div class="card-body p-3">
                                                                <div class="row text-left">
                                                                    <div class="col-md-12">
                                                                        <div class="form-group">
                                                                            <label>Phone Number<span
                                                                                    class="font-danger">*</span></label>
                                                                            <input class="form-control"
                                                                                   name="phone" id="phone"
                                                                                   type="text"
                                                                                   placeholder="Phone"
                                                                                   value="{{ old('phone')  ??  $user->phone }}">
                                                                        </div>
                                                                    </div>

                                                                    <div class="col-md-12">
                                                                        <div class="form-group">
                                                                            <label>Address<span
                                                                                    class="font-danger">*</span></label>
                                                                            <input class="form-control" type="text"
                                                                                   placeholder="Address" name="address"
                                                                                   id="address"
                                                                                   value="{{old('address') ?? $user->address }}"
                                                                            >
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-sm-6 col-md-6">
                                                                        <div class="form-group">
                                                                            <label>City<span
                                                                                    class="font-danger">*</span></label>
                                                                            <input class="form-control" type="text"
                                                                                   placeholder="City" name="city"
                                                                                   id="city"
                                                                                   value="{{old('city') ?? $user->city }}"
                                                                            >
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-sm-6 col-md-6">
                                                                        <div class="form-group">
                                                                            <label>State<span
                                                                                    class="font-danger">*</span></label>
                                                                            <select class="form-control btn-square"
                                                                                    name="state" id="state">
                                                                                <option value="" disabled=""
                                                                                        selected="">--Select State--
                                                                                </option>
                                                                                @foreach($states as $state)
                                                                                    <option
                                                                                        value="{{ $state->id }}"
                                                                                        @if($user->state_id == $state->id) selected @endif >{{ $state->state_name.' ['.$state->state_code.']'  }}</option>
                                                                                @endforeach
                                                                            </select>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-sm-6 col-md-6">
                                                                        <div class="form-group">
                                                                            <label>Zip Code<span
                                                                                    class="font-danger">*</span></label>
                                                                            <input class="form-control" type="number"
                                                                                   placeholder="ZIP Code" name="zip"
                                                                                   id="zip"
                                                                                   value="{{old('zip') ?? $user->zip }}">
                                                                        </div>
                                                                    </div>
                                                                </div>


                                                            </div>
                                                            <div class="card-footer p-3">
                                                                <button class="btn btn-primary btn-pill" type="submit">
                                                                    Submit
                                                                </button>

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

                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <hr>
                                <div class="row">
                                    <div class="col-md-6">
                                        <h5>Address</h5>
                                        <p class="mb-0">{{$user->address}}</p>
                                        <p class="mb-0">{{$user->city}}</p>
                                        <p class="mb-0">{{$mystate}}-{{$user->zip}}</p>
                                    </div>
                                    <div class="col-md-6 text-right">
                                        <!-- Vertically centered modal-->
                                        {{-- <a class="text-uppercase " type="button" data-toggle="modal" data-target="#changeaddress">Change Address</a>--}}
                                        {{--<div class="modal fade" id="changeaddress" tabindex="-1" role="dialog"
                                             aria-labelledby="exampleModalCenter" aria-hidden="true">
                                            <div class="modal-dialog modal-dialog-centered" role="document">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <h5 class="modal-title">Update Address</h5>
                                                        <button class="close" type="button" data-dismiss="modal"
                                                                aria-label="Close"><span aria-hidden="true">×</span>
                                                        </button>
                                                    </div>
                                                    <div class="modal-body">
                                                        <form class="form theme-form">
                                                            <div class="card-body p-3">
                                                                <div class="row text-left">
                                                                    <div class="col-md-12">
                                                                        <div class="form-group">
                                                                            <input class="form-control" type="text"
                                                                                   placeholder="Address" name="address"
                                                                                   id="address"
                                                                                   value="31, Sukh Shine Complex,3">
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-sm-6 col-md-6">
                                                                        <div class="form-group">

                                                                            <input class="form-control" type="text"
                                                                                   placeholder="City" name="city"
                                                                                   id="city" value="Ahmedabad3">
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-sm-6 col-md-6">
                                                                        <div class="form-group">
                                                                            <select class="form-control btn-square"
                                                                                    name="state" id="state" required="">
                                                                                <option value="" disabled=""
                                                                                        selected="">--Select State--
                                                                                </option>
                                                                                <option value="1">Alaska [AK]</option>
                                                                                  </select>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-sm-6 col-md-6">
                                                                        <div class="form-group">
                                                                            <input class="form-control" type="number"
                                                                                   placeholder="ZIP Code" name="zip"
                                                                                   id="zip" value="55554">
                                                                        </div>
                                                                    </div>
                                                                </div>

                                                            </div>
                                                            <div class="card-footer p-3">
                                                                <button class="btn btn-primary btn-pill" type="submit">
                                                                    Submit
                                                                </button>

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

                                                </div>
                                            </div>
                                        </div>--}}
                                    </div>
                                </div>


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

                </div>
                <!-- <div class="col-lg-8">
                  <form class="card theme-form">
                    <div class="card-header">
                      <h4 class="card-title mb-0">Change Password</h4>
                      <div class="card-options"><a class="card-options-collapse" href="#" data-toggle="card-collapse"><i class="fe fe-chevron-up"></i></a><a class="card-options-remove" href="#" data-toggle="card-remove"><i class="fe fe-x"></i></a></div>
                    </div>
                    <div class="card-body">
                      <div class="row">
                        <div class="col-md-7">
                          <div class="form-group">
                            <label class="form-label">Old Password</label>
                            <input class="form-control" type="password" placeholder="Old Password">
                          </div>
                        </div>
                        <div class="col-md-6">
                          <div class="form-group">
                            <label class="form-label">New Password</label>
                            <input class="form-control" type="password" placeholder="New Password">
                          </div>
                        </div>
                        <div class="col-md-6">
                          <div class="form-group">
                            <label class="form-label">Confirm Password</label>
                            <input class="form-control" type="password" placeholder="New Password">
                          </div>
                        </div>

                        <div class="col-md-12 text-right">
                          <button class="btn btn-primary btn-pill" type="submit">Update</button>
                        </div>
                      </div>
                    </div>
                  </form>
                </div> -->

            </div>
        </div>
        <!-- Container-fluid Ends-->
    </div>

@endsection
@include('backend.profile.js')