TelemedPro/rejuvallife
8
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

initial commit

Browse Source
This commit is contained in:
Inshal
2024-10-25 01:02:11 +05:00
commit 6e65bc3a62
1710 changed files with 273609 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

110
resources/js/views/pages/account-settings/ChangePassword.vue Normal file
View File

@@ -0,0 +1,110 @@
<script setup>
import axios from '@axios';
import {
requiredValidator
} from '@validators';
const errors = ref({
new_password: undefined,
confirm_passowrd: undefined,
})
const isTonalSnackbarVisible = ref(false)
const patientResponse = ref(false)
const isLoadingVisible = ref(false)
const passwordVForm = ref()
const isNewPasswordVisible = ref(false)
const isConfirmPasswordVisible = ref(false)
const newPassword = ref(null)
const confirmPassword = ref(null)
const matchPasswordsValidator = (value) => {
if (value !== newPassword.value) {
errors.confirm_passowrd = ['Passwords do not match'];
return 'Passwords do not match';
}
return true;
}
const onSubmit = () => {
passwordVForm.value?.validate().then(async ({ valid: isValid }) => {
console.log('isValid ', isValid)
if (isValid)
await changePassword()
})
}
const changePassword = async () => {
isLoadingVisible.value = true;
await axios.post('/api/change-password', {
new_password: newPassword.value,
}).then(r => {
console.log("Change Password", r.data);
isTonalSnackbarVisible.value = true;
patientResponse.value = r.data.message;
isLoadingVisible.value = false;
}).catch(e => {
console.log(e.response);
const { errors: formErrors } = e.response.data.errors;
errors.value = e.response.data.errors;
isLoadingVisible.value = false;
console.error("Error", e.response.data.errors)
});
}
</script>
<template>
<VSnackbar v-model="isTonalSnackbarVisible" :timeout="5000" location="top end" variant="flat" color="success">
{{ patientResponse }}
</VSnackbar>
<VDialog v-model="isLoadingVisible" width="110" height="150" color="primary">
<VCardText class="" style="color: white !important;">
<div class="demo-space-x">
<VProgressCircular :size="40" color="primary" indeterminate />
</div>
</VCardText>
</VDialog>
<VRow>
<VCol cols="12">
<VCard>
<VCardText>
<VForm ref="passwordVForm" @submit.prevent="onSubmit">
<VCardText>
<VRow>
<VCol cols="12" md="6">
<!-- 👉 new password -->
<VTextField v-model="newPassword" :type="isNewPasswordVisible ? 'text' : 'password'"
:append-inner-icon="isNewPasswordVisible ? 'bx-hide' : 'bx-show'"
label="New Password" placeholder="············"
@click:append-inner="isNewPasswordVisible = !isNewPasswordVisible"
:rules="[requiredValidator]" :error-messages="errors.new_password" />
</VCol>
<VCol cols="12" md="6">
<!-- 👉 confirm password -->
<VTextField v-model="confirmPassword"
:type="isConfirmPasswordVisible ? 'text' : 'password'"
:append-inner-icon="isConfirmPasswordVisible ? 'bx-hide' : 'bx-show'"
label="Re-enter Password" placeholder="············"
@click:append-inner="isConfirmPasswordVisible = !isConfirmPasswordVisible"
:rules="[requiredValidator, matchPasswordsValidator]"
:error-messages="errors.confirm_passowrd" />
</VCol>
</VRow>
</VCardText>
<!-- 👉 Action Buttons -->
<VCardText class="d-flex flex-wrap gap-4">
<VBtn type="submit">Save changes</VBtn>
<!-- <VBtn type="reset" color="secondary" variant="tonal">
Reset
</VBtn> -->
</VCardText>
</VForm>
</VCardText>
</VCard>
</VCol>
</VRow>
</template>

211
resources/js/views/pages/account-settings/DeliveryAddress.vue Normal file
View File

@@ -0,0 +1,211 @@
<script setup>
import axios from '@axios';
import {
requiredState,
requiredValidator,
} from '@validators';
import { onMounted } from 'vue';
const errors = ref({
address: undefined,
city: undefined,
state: undefined,
zipcode: undefined,
country: undefined,
})
const isTonalSnackbarVisible = ref(false)
const patientResponse = ref(false)
const isLoadingVisible = ref(false)
const addressVForm = ref()
const address = ref()
const apt = ref()
const city = ref()
const state = ref()
const zipcode = ref()
const country = ref('United State')
const states = ref([
{ name: 'Howland Island', abbreviation: 'UM-84' },
{ name: 'Delaware', abbreviation: 'DE' },
{ name: 'Maryland', abbreviation: 'MD' },
{ name: 'Baker Island', abbreviation: 'UM-81' },
{ name: 'Kingman Reef', abbreviation: 'UM-89' },
{ name: 'New Hampshire', abbreviation: 'NH' },
{ name: 'Wake Island', abbreviation: 'UM-79' },
{ name: 'Kansas', abbreviation: 'KS' },
{ name: 'Texas', abbreviation: 'TX' },
{ name: 'Nebraska', abbreviation: 'NE' },
{ name: 'Vermont', abbreviation: 'VT' },
{ name: 'Jarvis Island', abbreviation: 'UM-86' },
{ name: 'Hawaii', abbreviation: 'HI' },
{ name: 'Guam', abbreviation: 'GU' },
{ name: 'United States Virgin Islands', abbreviation: 'VI' },
{ name: 'Utah', abbreviation: 'UT' },
{ name: 'Oregon', abbreviation: 'OR' },
{ name: 'California', abbreviation: 'CA' },
{ name: 'New Jersey', abbreviation: 'NJ' },
{ name: 'North Dakota', abbreviation: 'ND' },
{ name: 'Kentucky', abbreviation: 'KY' },
{ name: 'Minnesota', abbreviation: 'MN' },
{ name: 'Oklahoma', abbreviation: 'OK' },
{ name: 'Pennsylvania', abbreviation: 'PA' },
{ name: 'New Mexico', abbreviation: 'NM' },
{ name: 'American Samoa', abbreviation: 'AS' },
{ name: 'Illinois', abbreviation: 'IL' },
{ name: 'Michigan', abbreviation: 'MI' },
{ name: 'Virginia', abbreviation: 'VA' },
{ name: 'Johnston Atoll', abbreviation: 'UM-67' },
{ name: 'West Virginia', abbreviation: 'WV' },
{ name: 'Mississippi', abbreviation: 'MS' },
{ name: 'Northern Mariana Islands', abbreviation: 'MP' },
{ name: 'United States Minor Outlying Islands', abbreviation: 'UM' },
{ name: 'Massachusetts', abbreviation: 'MA' },
{ name: 'Connecticut', abbreviation: 'CT' },
{ name: 'Florida', abbreviation: 'FL' },
{ name: 'District of Columbia', abbreviation: 'DC' },
{ name: 'Midway Atoll', abbreviation: 'UM-71' },
{ name: 'Navassa Island', abbreviation: 'UM-76' },
{ name: 'Indiana', abbreviation: 'IN' },
{ name: 'Wisconsin', abbreviation: 'WI' },
{ name: 'Wyoming', abbreviation: 'WY' },
{ name: 'South Carolina', abbreviation: 'SC' },
{ name: 'Arkansas', abbreviation: 'AR' },
{ name: 'South Dakota', abbreviation: 'SD' },
{ name: 'Montana', abbreviation: 'MT' },
{ name: 'North Carolina', abbreviation: 'NC' },
{ name: 'Palmyra Atoll', abbreviation: 'UM-95' },
{ name: 'Puerto Rico', abbreviation: 'PR' },
{ name: 'Colorado', abbreviation: 'CO' },
{ name: 'Missouri', abbreviation: 'MO' },
{ name: 'New York', abbreviation: 'NY' },
{ name: 'Maine', abbreviation: 'ME' },
{ name: 'Tennessee', abbreviation: 'TN' },
{ name: 'Georgia', abbreviation: 'GA' },
{ name: 'Louisiana', abbreviation: 'LA' },
{ name: 'Nevada', abbreviation: 'NV' },
{ name: 'Iowa', abbreviation: 'IA' },
{ name: 'Idaho', abbreviation: 'ID' },
{ name: 'Rhode Island', abbreviation: 'RI' },
{ name: 'Washington', abbreviation: 'WA' },
{ name: 'Ohio', abbreviation: 'OH' },
// ... (add the rest of the states)
]);
onMounted(async () => {
await getPatientInfo()
})
const getPatientInfo = async () => {
const patient_id = localStorage.getItem('patient_id')
const access_token = localStorage.getItem('access_token');
isLoadingVisible.value = true;
await axios.post('/api/agent-last-appointment-detail/' + patient_id, {
headers: {
'Authorization': `Bearer ${access_token}`,
}
})
.then(response => {
console.log('Response:', response.data);
if (response.data) {
let patientData = response.data.patient
address.value = patientData.address;
city.value = patientData.city
state.value = patientData.state
zipcode.value = patientData.zip_code
isLoadingVisible.value = false;
} else {
isLoadingVisible.value = false;
}
})
.catch(error => {
console.error('Error:', error);
});
}
const onSubmit = () => {
addressVForm.value?.validate().then(async ({ valid: isValid }) => {
console.log('isValid ', isValid)
if (isValid)
await saveAddress()
})
}
const saveAddress = async () => {
isLoadingVisible.value = true;
await axios.post('/api/update-patient-detail', {
address: address.value,
city: city.value,
state: state.value,
zip_code: zipcode.value,
country: country.value,
}).then(r => {
console.log("Address Save", r.data);
isTonalSnackbarVisible.value = true;
patientResponse.value = r.data.message;
isLoadingVisible.value = false;
}).catch(e => {
console.log(e.response);
const { errors: formErrors } = e.response.data.errors;
errors.value = e.response.data.errors;
isLoadingVisible.value = false;
console.error("Error", e.response.data.errors)
});
}
</script>
<template>
<VSnackbar v-model="isTonalSnackbarVisible" :timeout="5000" location="top end" variant="flat" color="success">
{{ patientResponse }}
</VSnackbar>
<VDialog v-model="isLoadingVisible" width="110" height="150" color="primary">
<VCardText class="" style="color: white !important;">
<div class="demo-space-x">
<VProgressCircular :size="40" color="primary" indeterminate />
</div>
</VCardText>
</VDialog>
<VRow>
<VCol cols="12">
<VCard>
<VCardText>
<VForm ref="addressVForm" @submit.prevent="onSubmit">
<VCardText>
<VRow>
<VCol cols="12" md="12">
<VTextField v-model="address" label="Street Name" :rules="[requiredValidator]"
:error-messages="errors.address" />
</VCol>
<VCol cols="12" md="6">
<VTextField v-model="apt" label="Apt Suit etc" />
</VCol>
<VCol cols="12" md="6">
<v-select v-model="state" label="Select State" :items="states" item-title="name"
item-value="abbreviation" :rules="[requiredState]" :error-messages="errors.state"></v-select>
</VCol>
<VCol cols="12" md="6">
<VTextField v-model="city" label="City" :rules="[requiredValidator]" :error-messages="errors.city" />
</VCol>
<VCol cols="12" md="6">
<VTextField v-model="zipcode" label="ZIP Code" :rules="[requiredValidator]"
:error-messages="errors.zipcode" />
</VCol>
</VRow>
</VCardText>
<!-- 👉 Action Buttons -->
<VCardText class="d-flex flex-wrap gap-4">
<VBtn type="submit">Save changes</VBtn>
<!-- <VBtn type="reset" color="secondary" variant="tonal">
Reset
</VBtn> -->
</VCardText>
</VForm>
</VCardText>
</VCard>
</VCol>
</VRow>
</template>

321
resources/js/views/pages/account-settings/MyInfo.vue Normal file
View File

@@ -0,0 +1,321 @@
<script setup>
import axios from '@axios';
import avatar1 from "@images/avatars/avatar-1.png";
import {
emailValidator,
requiredEmail,
requiredLastName,
requiredName,
requiredPhone,
requiredValidator,
validUSAPhone
} from '@validators';
import { onMounted } from 'vue';
import { useStore } from "vuex";
const getIsTonalSnackbarVisible = ref(false);
const store = useStore();
const errors = ref({
name: undefined,
last_name: undefined,
phone: undefined,
email: undefined,
dob: undefined,
gender: undefined,
marital_status: undefined,
height: undefined,
weight: undefined,
})
const refInputEl = ref();
const isTonalSnackbarVisible = ref(false)
const patientResponse = ref(false)
const isLoadingVisible = ref(false)
const infoVForm = ref()
const name = ref()
const last_name = ref()
const email = ref(null)
const phone = ref(null)
const dob = ref()
const gender = ref()
const martialStatus = ref(null)
const height = ref(null)
const weight = ref(null)
const patientId = ref()
const ImageBase64 = ref();
const accountData = {
avatarImg: avatar1,
};
const accountDataLocal = ref(structuredClone(accountData));
const changeAvatar = async (file) => {
const fileReader = new FileReader();
const { files } = file.target;
if (files && files.length) {
fileReader.readAsDataURL(files[0]);
fileReader.onload = () => {
if (typeof fileReader.result === "string") {
accountDataLocal.value.avatarImg = fileReader.result;
}
ImageBase64.value = fileReader.result.split(",")[1];
store.dispatch("profilePicPatient", {
image: ImageBase64.value, //ecelData,
});
};
}
};
const genders = ref([
{ name: 'Male', abbreviation: 'Male' },
{ name: 'Female', abbreviation: 'Female' },
{ name: 'Other', abbreviation: 'Other' },
]);
const maritalStatuses = ref([
{ name: 'Single', abbreviation: 'Single' },
{ name: 'Married', abbreviation: 'Married' },
{ name: 'Divorced', abbreviation: 'Divorced' },
]);
const heights = ref([
{ name: '5 ft 0 in', abbreviation: '5 ft 0 in' },
{ name: '5 ft 1 in', abbreviation: '5 ft 1 in' },
{ name: '5 ft 2 in', abbreviation: '5 ft 2 in' },
{ name: '5 ft 3 in', abbreviation: '5 ft 3 in' },
{ name: '5 ft 4 in', abbreviation: '5 ft 4 in' },
{ name: '5 ft 5 in', abbreviation: '5 ft 5 in' },
{ name: '5 ft 6 in', abbreviation: '5 ft 6 in' },
{ name: '5 ft 7 in', abbreviation: '5 ft 7 in' },
{ name: '5 ft 8 in', abbreviation: '5 ft 8 in' },
{ name: '5 ft 9 in', abbreviation: '5 ft 9 in' },
{ name: '5 ft 10 in', abbreviation: '5 ft 10 in' },
{ name: '5 ft 11 in', abbreviation: '5 ft 11 in' },
{ name: '6 ft 0 in', abbreviation: '6 ft 0 in' },
{ name: '6 ft 1 in', abbreviation: '6 ft 1 in' },
{ name: '6 ft 2 in', abbreviation: '6 ft 2 in' },
{ name: '6 ft 3 in', abbreviation: '6 ft 3 in' },
{ name: '6 ft 4 in', abbreviation: '6 ft 4 in' },
{ name: '6 ft 5 in', abbreviation: '6 ft 5 in' },
{ name: '6 ft 6 in', abbreviation: '6 ft 6 in' },
{ name: '6 ft 7 in', abbreviation: '6 ft 7 in' },
{ name: '6 ft 8 in', abbreviation: '6 ft 8 in' },
{ name: '6 ft 9 in', abbreviation: '6 ft 9 in' },
{ name: '6 ft 10 in', abbreviation: '6 ft 10 in' },
{ name: '6 ft 11 in', abbreviation: '6 ft 11 in' },
{ name: '7 ft 0 in', abbreviation: '7 ft 0 in' },
]);
onMounted(async () => {
await getPatientInfo()
await store.dispatch("patientDetial");
let list = await store.getters.getPatientDetail;
if (!list.profile_picture) {
accountDataLocal.value.avatarImg = avatar1;
} else {
accountDataLocal.value.avatarImg = list.profile_picture;
}
})
const getPatientInfo = async () => {
const patient_id = localStorage.getItem('patient_id')
const access_token = localStorage.getItem('access_token');
isLoadingVisible.value = true;
await axios.post('/api/agent-last-appointment-detail/' + patient_id, {
headers: {
'Authorization': `Bearer ${access_token}`,
}
})
.then(response => {
console.log('Response:', response.data);
if (response.data) {
let patientData = response.data.patient
name.value = patientData.first_name;
last_name.value = patientData.last_name
email.value = patientData.email
phone.value = patientData.phone_no
dob.value = patientData.dob;
gender.value = patientData.gender;
martialStatus.value = patientData.marital_status;
height.value = patientData.height;
weight.value = patientData.weight;
isLoadingVisible.value = false;
} else {
isLoadingVisible.value = false;
}
})
.catch(error => {
console.error('Error:', error);
});
}
const formatPhoneNumber = () => {
// Remove non-numeric characters from the input
const numericValue = phone.value.replace(/\D/g, '');
// Apply formatting logic
if (numericValue.length <= 10) {
phone.value = numericValue.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
} else {
// Limit the input to a maximum of 14 characters
const truncatedValue = numericValue.slice(0, 10);
phone.value = truncatedValue.replace(/(\d{3})(\d{3})(\d{4})/, '($1) $2-$3');
}
};
const getCurrentDate = () => {
const today = new Date();
const year = today.getFullYear();
let month = today.getMonth() + 1;
let day = today.getDate();
// Format the date to match the input type="date" format
month = month < 10 ? `0${month}` : month;
day = day < 10 ? `0${day}` : day;
return `${year}-${month}-${day}`;
};
const onSubmit = async () => {
infoVForm.value?.validate().then(async ({ valid: isValid }) => {
console.log('isValid ', isValid)
if (isValid)
await saveInfo()
})
}
const saveInfo = async () => {
isLoadingVisible.value = true;
await axios.post('/api/update-patient-detail', {
first_name: name.value,
last_name: last_name.value,
phone_no: phone.value,
email: email.value,
dob: dob.value,
gender: gender.value,
marital_status: martialStatus.value,
height: height.value,
weight: weight.value,
}).then(r => {
console.log("Info Save", r.data);
isTonalSnackbarVisible.value = true;
patientResponse.value = r.data.message;
isLoadingVisible.value = false;
}).catch(e => {
console.log(e.response);
const { errors: formErrors } = e.response.data.errors;
errors.value = e.response.data.errors;
isLoadingVisible.value = false;
console.error("Error", e.response.data.errors)
});
}
</script>
<template>
<VSnackbar v-model="isTonalSnackbarVisible" :timeout="5000" location="top end" variant="flat" color="success">
{{ patientResponse }}
</VSnackbar>
<VDialog v-model="isLoadingVisible" width="110" height="150" color="primary">
<VCardText class="" style="color: white !important;">
<div class="demo-space-x">
<VProgressCircular :size="40" color="primary" indeterminate />
</div>
</VCardText>
</VDialog>
<VRow>
<VCol cols="12">
<VCard>
<VCardText>
<!-- 👉 Form -->
<div class="d-flex mb-10">
<VSnackbar v-model="getIsTonalSnackbarVisible" :timeout="5000" location="top end" variant="flat"
color="success">
<VIcon class="ri-success-line success-icon" />
Profile Update Successfully
</VSnackbar>
<!-- 👉 Avatar -->
<VAvatar rounded size="100" class="me-6" :image="accountDataLocal.avatarImg" />
<!-- 👉 Upload Photo -->
<form class="d-flex flex-column justify-center gap-4">
<div class="d-flex flex-wrap gap-4">
<VBtn color="primary" @click="refInputEl?.click()">
<VIcon icon="ri-upload-cloud-line" class="d-sm-none" />
<span class="d-none d-sm-block">Upload Profile Image</span>
</VBtn>
<input ref="refInputEl" type="file" name="file" accept=".jpeg,.png,.jpg,GIF" hidden
@input="changeAvatar" />
</div>
<p class="text-body-1 mb-0">
Allowed JPG, GIF or PNG. Max size of 800K
</p>
</form>
</div>
<VForm class="mt-6" ref="infoVForm" @submit.prevent="onSubmit">
<VRow>
<!-- 👉 First Name -->
<VCol md="4" cols="12">
<VTextField v-model="name" placeholder="John" label="First Name" :rules="[requiredName]"
:error-messages="errors.name" />
</VCol>
<!-- 👉 Last Name -->
<VCol md="4" cols="12">
<VTextField v-model="last_name" placeholder="Doe" label="Last Name"
:rules="[requiredLastName]" :error-messages="errors.last_name" />
</VCol>
<!-- 👉 Email -->
<VCol cols="12" md="4">
<VTextField v-model="email" label="E-mail" placeholder="johndoe@gmail.com" type="email"
:rules="[requiredEmail, emailValidator]" :error-messages="errors.email"
disabled="" />
</VCol>
<!-- 👉 Phone -->
<VCol cols="12" md="4">
<VTextField v-model="phone" label="Phone Number" pattern="^\(\d{3}\) \d{3}-\d{4}$"
:rules="[requiredPhone, validUSAPhone]" :error-messages="errors.phone"
placeholder="(917) 543-9876" @input="formatPhoneNumber" max="14" />
</VCol>
<VCol md="4" cols="12">
<VTextField v-model="dob" :max="getCurrentDate()" label="Date of Birth"
placeholder="Date of Birth" type="date" :rules="[requiredValidator]" />
</VCol>
<VCol md="4" cols="12">
<v-select v-model="gender" label="Select Gender" :items="genders" item-title="name"
item-value="abbreviation" :rules="[requiredValidator]"
:error-messages="errors.gender">
</v-select>
</VCol>
<VCol cols="12" md="4">
<v-select v-model="martialStatus" label="Select Marital Status" :items="maritalStatuses"
item-title="name" item-value="abbreviation" :rules="[requiredValidator]"
:error-messages="errors.martial_status">
</v-select>
</VCol>
<VCol cols="12" md="4">
<v-select v-model="height" label="Select Height" :items="heights" item-title="name"
item-value="abbreviation" :rules="[requiredValidator]"
:error-messages="errors.height">
</v-select>
</VCol>
<VCol cols="12" md="4">
<VTextField v-model="weight" label="Weight" :rules="[requiredValidator]"
:error-messages="errors.weight" />
</VCol>
<!-- 👉 Form Actions -->
<VCol cols="12" class="d-flex flex-wrap gap-4">
<VBtn type="submit">Save changes</VBtn>
<!-- <VBtn color="secondary" variant="tonal" type="reset">
Reset
</VBtn> -->
</VCol>
</VRow>
</VForm>
</VCardText>
</VCard>
</VCol>
</VRow>
</template>

45
resources/js/views/pages/account-settings/PaymentDetails.vue Normal file
View File

@@ -0,0 +1,45 @@
<script setup>
const cardNumber = ref(null)
const expiry = ref(null)
const cvv = ref(null)
</script>
<template>
<VRow>
<VCol cols="12">
<VCard>
<VCardText>
<VForm>
<VCardText>
<VRow>
<VCol cols="12" md="6">
<VTextField v-model="cardNumber" label="Card Number" />
</VCol>
<VCol cols="12" md="4">
<VTextField v-model="expiry" label="Expiry" />
</VCol>
<VCol cols="12" md="2">
<VTextField v-model="cvv" label="CVV" />
</VCol>
</VRow>
</VCardText>
<!-- 👉 Action Buttons -->
<VCardText class="d-flex flex-wrap gap-4">
<VBtn>Save changes</VBtn>
<!-- <VBtn type="reset" color="secondary" variant="tonal">
Reset
</VBtn> -->
</VCardText>
</VForm>
</VCardText>
</VCard>
</VCol>
</VRow>
</template>