File: /var/www/html/resources/views/livewire/profile/customer-profile.blade.php
<div class="row">
<div class="col-xl-12 mb-4">
<div class="log-reg-form search-modal form-style1 bgc-white p50 p30-sm default-box-shadow1 bdrs12">
<div class="mb30">
<h3>Profile photo</h3>
</div>
<div class="col-xl-7">
<form wire:submit.prevent="updateSellerPhoto">
<div class="profile-box d-sm-flex align-items-center mb30">
<div class="profile-img mb20-sm">
@if ($profile_photo_url)
<img src="{{ $profile_photo_url->temporaryUrl() }}" style="width: 100px; height: 100px; object-fit: cover; border-radius: 50%;">
@else
<img style="width: 100px; height: 100px; object-fit: cover; border-radius: 50%;" src="{{ $photo }}" alt="Upload Photo">
@endif
</div>
<div class="profile-content ml20 ml0-xs">
<div class="d-flex align-items-center my-3">
<label for="photo-upload" class="upload-btn ml10">Change</label>
<input type="file" id="photo-upload" wire:model.live="profile_photo_url" style="display: none;">
<!-- Loading Spinner -->
<div type="submit" wire:loading.attr="disabled">
<span wire:loading wire:target="profile_photo_url" class="spinner-border spinner-border-sm"> </span>
<span wire:loading wire:target="profile_photo_url"> Please wait ...</span>
</div>
</div>
</div>
</div>
@error('profile_photo_url')
<span class="text-success">{{ $message }}</span>
@enderror
</form>
</div>
</div>
</div>
@livewire('profile.set-pin')
@if ($userData['google_id'] == null)
<div class="col-lg-12 mb-4">
<div class="log-reg-form search-modal form-style1 bgc-white p50 p30-sm default-box-shadow1 bdrs12">
<div class="mb30">
<h3>Update email</h3>
</div>
@if ($verified_email)
<div class="mb25 mt-4">
<label class="form-label fw500 dark-color">Email <b>VERIFIED</b> <i class="fas fa-edit" wire:click="toggleEmailEdit"></i> </label>
<div class="input-group">
<div class="input-group-text">
<i class="flaticon-mail mr8"></i>
</div>
<input wire:model="email" readonly class="form-control" />
</div>
</div>
@endif
@if ($showVerifyOtpForm)
<div class="mb25">
<label class="form-label fw500 text-success dark-color">Enter confirmation otp sent to your inbox/spam </label>
<div class="input-group">
<div class="input-group-text">
<i class="fas fa-pen"></i>
</div>
<input wire:model="email_otp" type="tel" maxlength="6" placeholder="Enter email confirmation code" class="form-control" />
<button wire:click="changeEmail" class="btn btn-sm btn-primary text-white ms-2">Confirm</button>
<span wire:loading wire:click="changeEmail" style="width: 20px; height: 20px;" class="spinner-border spinner-border-sm">
</span>
</div>
@error('email_otp') <span class="text-danger">{{ $message }}</span> @enderror
</div>
@endif
@if ($un_verified_email)
<div class="mb25">
<label class="form-label fw500 dark-color">Enter your new email </label>
<div class="input-group">
<div class="input-group-text">
<i class="flaticon-mail mr8"></i>
</div>
<input wire:model="new_email" type="email" class="form-control" />
<!-- <button wire:click="sendEmailOtp" class="btn btn-sm btn-primary text-white ms-2">Verify</button>
<span wire:loading wire:click="sendEmailOtp" class="spinner-border spinner-border-sm"></span> -->
<button type="submit" wire:loading.attr="disabled" class="btn btn-sm btn-primary text-white ms-2">
<span wire:loading wire:click="sendEmailOtp" class="spinner-border spinner-border-sm">
</span>
<span wire:loading.remove> Verify</span>
</button>
</div>
@error('new_email')
<span class="text-danger">{{ $message }}</span>
@enderror
</div>
@endif
</div>
</div>
@endif
<div class="col-lg-12 mb-4">
<div class="log-reg-form search-modal form-style1 bgc-white p50 p30-sm default-box-shadow1 bdrs12">
<div class="mb30">
<h3>Update phone</h3>
</div>
<form wire:submit.prevent="updatePhone">
<div class="mb25">
<label class="form-label fw500 dark-color">Phone number</label>
<div class="input-group me-2">
<div class="input-group-text">
<i class="flaticon-mobile mr8"></i>
</div>
<input wire:model="phone" type="tel" maxlength="11" class="form-control" placeholder="Enter your phone no" />
</div>
@error('phone') <span class="text-success">{{$message}}</span>@enderror
@error('phoneDanger') <span class="text-danger">{{$message}}</span>@enderror
</div>
<div class="d-grid mb20">
<button type="submit" wire:loading.attr="disabled" class="ud-btn btn-thm default-box-shadow2">
<span wire:loading wire:target="updatePhone" class="spinner-border spinner-border-sm"> </span>
<span wire:loading wire:target="updatePhone"> Please wait ...</span>
<span wire:loading.remove> Update phone</span>
</button>
</div>
</form>
</div>
</div>
<div class="col-lg-12 mb-4">
<div class="log-reg-form search-modal form-style1 bgc-white p50 p30-sm default-box-shadow1 bdrs12">
<div class="mb30">
<h3>Profile</h3>
</div>
<form wire:submit.prevent="updateInfo">
<div class="mb25">
<label class="form-label fw500 dark-color">Full name</label>
<div class="d-flex">
<div class="input-group me-2">
<div class="input-group-text">
<i class="flaticon-photo mr8"></i>
</div>
<input wire:model="name" class="form-control" placeholder="Enter your first name" />
</div>
<div class="input-group">
<div class="input-group-text">
<i class="flaticon-photo mr8"></i>
</div>
<input wire:model="lastname" class="form-control" placeholder="Enter your last name" />
</div>
</div>
@error('address') <span class="text-success">{{$message}}</span>@enderror
</div>
<div class="d-grid mb20">
<button type="submit" wire:loading.attr="disabled" class="ud-btn btn-thm default-box-shadow2">
<span wire:loading wire:target="updateInfo" class="spinner-border spinner-border-sm"> </span>
<span wire:loading wire:target="updateInfo"> Please wait ...</span>
<span wire:loading.remove> Update profile</span>
</button>
</div>
</form>
</div>
</div>
<div class="col-lg-12 mb-4">
<div class="log-reg-form search-modal form-style1 bgc-white p50 p30-sm default-box-shadow1 bdrs12">
<div class="mb30">
<h3>Update location</h3>
</div>
<form wire:submit.prevent="updateInfo">
<div class="mb25">
<label class="form-label fw500 dark-color">Adress, City and State</label>
<div class="">
<div class=" col-lg-12 input-group me-2 mb-4">
<div class="input-group-text">
<i class="flaticon-place fz16 vam text-thm2 me-1"></i>
</div>
<input wire:model="address" type="text" class="form-control" placeholder="Enter your delivery address" />
</div>
<div class="input-group me-2 mb-4">
<div class="input-group-text">
<i class="flaticon-place fz16 vam text-thm2 me-1"></i>
</div>
<input wire:model="city" type="text" class="form-control" placeholder="Enter your city" />
</div>
<div class="input-group">
<div class="input-group-text">
<i class="flaticon-place fz16 vam text-thm2 me-1"></i>
</div>
<input wire:model="state" type="text" class="form-control" placeholder="Enter your state" />
</div>
</div>
@error('address') <span class="text-success">{{$message}}</span>@enderror
</div>
<div class="d-grid mb20">
<button type="submit" wire:loading.attr="disabled" class="ud-btn btn-thm default-box-shadow2">
<span wire:loading wire:target="updateInfo" class="spinner-border spinner-border-sm"> </span>
<span wire:loading wire:target="updateInfo"> Please wait ...</span>
<span wire:loading.remove> Update location</span>
</button>
</div>
</form>
</div>
</div>
@if ($userData['google_id'] == null)
<div class="col-lg-12 mb-4">
<div class="log-reg-form search-modal form-style1 bgc-white p50 p30-sm default-box-shadow1 bdrs12">
<div class="mb30">
<h3>Update Password</h3>
</div>
<form wire:submit.prevent="updatePassword" class="form-style1">
<div class="mb15" x-data="{ showPin: false }">
<label class="form-label fw500 dark-color">New Password</label>
<div class="input-group">
<div class="input-group-text">
<i class="flaticon-website mr8"></i>
</div>
<input x-bind:type="showPin ? 'text' : 'password'" class="form-control" placeholder="Enter your new password" wire:model="new_password" />
<button type="button" class="input-group-text" x-on:click="showPin = !showPin">
<template x-if="showPin">
<i class="fas fa-eye-slash"></i>
</template>
<template x-if="!showPin">
<i class="fas fa-eye"></i>
</template>
</button>
</div>
@error('new_password') <span class="text-danger">{{ $message }}</span> @enderror
@error('new') <span class="text-success">{{ $message }}</span> @enderror
</div>
<div class="d-grid mb20">
<button type="submit" wire:loading.attr="disabled" class="ud-btn btn-thm default-box-shadow2">
<span wire:loading wire:target="updatePassword" class="spinner-border spinner-border-sm"> </span>
<span wire:loading wire:target="updatePassword"> Please wait ... </span>
<span wire:loading.remove> Update Password</span>
</button>
</div>
</form>
</div>
</div>
@endif
</div>